Comments (4)
hi there,
great library!
if you are interested, i've quickly put together a custom element https://gist.github.com/lekoala/233b0c6246170716c52dbfab342caf22
Maybe @melloware would be interested since they maintain the NPM/Typescript fork.
by the way, the current api is not super friendly when you want to init each element on their own (i would rather have a new Coloris(myElem, options) type of api with maybe some kind of helper init function that loops over elements).
I created this color picker partly because every other one I could find did what you just described, and I didn't want that. If that's what you need I suggest you use a different color picker.
Also, you cannot have multiple visible inline elements due to the fact that there is only one picker. no big deal since i don't use them, but still something to keep in mind (and should maybe be added in the readme?).
The README does state that there is only one true instance of the color picker and therefore it's not possible to show multiple instances at the same time. I'll see if can make it even clear. Thanks for pointing it out.
from coloris.
ok thanks :)
i think both approaches are compatible: only one instance for a given set of options. that means the picker can be reused as much as possible. but restricting to only one true instance means that you cannot show both pickers, which kind of defeat the inline feature in my opinion (i don't use it, so i don't care, but still, it's a bit odd)
from coloris.
This an intentional design choice to keep the performance of the color picker in check. This is used in a web app among dozens of other UI tools, and keep in it as light as possible is my number one priority.
I too don't use the inline mode, but I agreed to add it because it doesn't cost me much in terms of performance.
Anyway, this tool does things in a certain way, and it either works for you or it doesn't. I'm not interested in discussing the merits of alternative approches :)
from coloris.
@lekoala I did something similar to wrap the component as a Java Server Faces component for PrimeFaces: https://github.com/primefaces/primefaces/blob/master/primefaces/src/main/resources/META-INF/resources/primefaces/colorpicker/1-colorpicker.js
I think we should just leave the current color picker as is and just use wrappers like we are doing. Safe to close this ticket.
from coloris.
Related Issues (20)
- No way to access the current element? HOT 2
- Manually clearing color has unexpected behavior HOT 3
- Enhancement: mirror cursor position/selection when picker is opened with focusInput: true HOT 4
- Allow el configuration property to be the dom element HOT 4
- How do you add a custom input?
- Dragging hue and alpha markers doesn't work on iOS HOT 4
- Reading option with attributes HOT 1
- How to programmatically change the thumbnail color?
- 能增加一个onClose事件监听吗? HOT 1
- Firefox accessing colorAreaDims before initialization HOT 18
- NaN values when inline color picker HOT 7
- Open method HOT 3
- clr-open-label not initialized on osX HOT 4
- Add 'Cancel' button (or any custom button) HOT 5
- Materializecss compatibility HOT 2
- Popup Input Issue HOT 3
- Mouse does not lineup on palette after scrolling in scrollable container HOT 3
- Include SCSS file with variables HOT 10
- Add support for CSS custom properties (variables) HOT 1
- Colorpicker wraps all input fields on page load HOT 5
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from coloris.