Now indexes colors in CSS, HTML, or PHP file when it is opened or saved. This is currently done by file extension.
Current colors are shown as a palette in the palette panel which you can select colors from. On demand, manual index command is provided.
Some small bug fixes and improvements have made it in, and also a new feature allowing the colors to be bookmarked in a special palette called Favorites. I plan on adding a way to add colors to other palettes through the UI , but the bookmark feature allows you to add colors real quick clicking the bookmark icon on the color info panel.
So give it a try and let me know if it is something that should stay. By the way, palettes are now split out into a separate file now: color_helpers.palettes.
I added a way that other plugins can call @weslly’s ColorPicker plugin (though it hasn’t been released yet, I but probably soon) and added support to call it from ColorHelper. To make things more obvious, I have added a palette icon, a dropper icon, and the bookmark/fav icon for opening the palette panel, opening the color picker, or bookmarking the current color respectively. I know the icons rendering is not the best, but that is because of Sublime HTML renderier. I still think meh icons are better than verbose links. Anyways, feedback is welcome, and hope everyone likes the recent changes.
I think the next step is creating a way to add colors or remove colors from palettes and even create new palettes or delete existing ones. I think after that, I can think more about how colors would be managed in a per project way and how they may or may existing along side global ones.
After all that, I may start thinking about project scanning, but I make no promises. I’m going to need to think how I can do it without impacting performance, and probably implement a simple caching system to keep from scanning stuff that doesn’t need scanning again…I don’t really care to think about all of that now.
A number of new things have been added:
So I still need a way to add a color to a non-existent palette (create new palette). That should be coming soon. I think I am also going to offer a way to convert colors to different formats; need to think about how to work that in the UI.
I think after that, I am ready to think about per project stuff. Along the way I need to figure out a flow for importing ASE palettes.
ColorHelper has some new features
Maybe other things that I have forgotten. I need expose more control over what gets displayed and what gets scanned, but now is the time feedback will help. So if your using this, feel free to let me know what you like and don’t like, or what you would like to see (keeping in mind that I may or may not implement it).
Please do report bugs as well.
Looks nicer and nicer!
There is a way to automagically show the color picker when the text cursor gets into a color? (after x ms)
Is it not popping up for your? Or are you just wanting to tweak the timing of the popup? It should pop up on its own when you are either in a CSS color or in an HTML attribute with a color. If it isn’t popping up, let me know what syntax languages you use. If you want to tweak, I would be interested to hear what you don’t like about the current timing.
Well, yeah, that’s it! I’m using SCSS syntax (on plain CSS works wonderful and the timing is just right!).
And i think why. Here are the scopes for exactly same cursor position for css vs sass:
*(http://i.imgur.com/rl58vFe.png)
*(http://i.imgur.com/BTcCIa6.png)
long story short, property-value is not a thing on sass syntax (i also have an ancient version of sass; let’s see if i can update)**
Hmm. Well that is the down side of these types of projects, you spend most of your time processing more and more variants. So are SCSS and SASS the same thing?
Anyways, I can probably take a look at the SCSS and/or SASS. if I can’t refine the scope search, I can probably relax detection for that/those syntax(s). What gets more annoying is indexing the file’s and project colors. I index the file colors by using the scope to make it quick to make it so I search less code and get more relevant results. I guess I could run it through the project indexer which just parses plain text. But then I also have to support more syntax. The current CSS indexer is really basic an probably doens’t handle a couple of corner cases ideally yet, but it is so far good enough. But now I would have to parse more style variants ughhh. Hopefully there is a good python library with a compatible license that I can just convert it to CSS.
Well, not really. Even i’m using one of these on a daily basis, i’m not sure which is which, but the main difference is that one it looks like a plain CSS, the other one doesn’t need curly braces and semicolon at the end (other than that, they both work the same).
I’ve tested a couple of other packages and none of them doesn’t provide a compatible scope. The variant i use provide a color.rgb-value.css scope on #hexcolors but nothing for rgb or rgba.
So most likely I will start digging into the tmLanguage file and see how i could add these extra scopes.
Thanks!
Scopes would make it work the best for auto popup and current file color indexing. Worst case scenario, I can still filter out comments and strings, but you could possibly get a false positive if you use a hex color as a class name or id or used a web color name in a class name etc. It would also probably pick up things like css attribute nameswhite-space but I could probably tweak the regex to avoid stuff like that by avoiding colors preceded or followed by dashes.
The biggest hurdle is providing a way to index a SCSS and SASS without scopes for project indexing. I would have to build up some kind of sass and scss parser. CSS is pretty basic, so it is easiest to parse as plain text, though I think I will need to tweak things for @media etc.; it will handle the nesting, just no ideally like it should, and false positives are possible., but SCSS and Sass make things more complicated for accurate color detection via this simplistic approach. I will almost have to write up a simple lexer…ughh. I guess if I am just lazy I could just parse search for colors and ignore the nuances of the language.
@iamntz, you can try this which should get scss and sass working if you are using this package: packagecontrol.io/packages/Synt … for%20Sass. The scoping was unique enough that I think this works. You should get auto pop ups and indexing of current file colors on save and such. Other sass, sccs syntaxes may not work, but they may very likely be resolved in a similar way, or better scoping would have to be added to them. So I would currently recommend the package above.
The only problem is going to be with certain sass/scss variables as the current regex and code doesn’t filter out color names that might start with $ or have dashes in front of them. I will tweak that stuff later, and I think we can overcome that. Now project indexing is going to be a bit tougher as I have to come up with a way to parse this stuff, so that is going to be put on hold.
Anyways, here is the new rules. I will commit these later today along with some better regex and such.
[pre=#FAFDFF] // File syntaxes that will be scanned on file open, save.
// These are the syntaxes in which the auto popup tooltip uses as well.
“supported_syntax”:
“meta.property-value.css -comment -string”, // CSS, CSS in HTML etc.
“meta.value.css -comment -string”, // CSS3, CSS3 in HTML etc.
“meta.property-list.css.sass -comment -string”, // sass and scss
“sass-script-maps -variable.other -comment -string”, // sass script maps
“meta.tag.inline.any.html string.quoted” // HTML attributes
][/pre]
Thinking about this more, if my regex is good enough, I may be able to just strip out comments and strings when scanning project files, and successfully scan CSS, SCSS, and Sass without having any additional special parsers. All I care about is the colors, so if I can isolate them well enough with solid regex, I may be able to get this working. I may give it a shot tonight.
Okay, full SCSS and Sass support should now be in (project scanning and everything). Also made just about every option configurable, so you can turn off whatever you don’t like or don’t use.
So, feature wise, I am going to freeze this. From now on, I will be taking input about current functionality, fixing bugs, possibly cutting features if people feel they don’t make sense or aren’t practical, and tweaking the look.
So please do give feedback, before we get to a final release.
Hi,
This plugin has a ton of potential and I love how it’s shaping up to be, however, I am having some issues though with the indexing (I am assuming) in a big plone project, and the plugin_host ends up eating all my cpu for quite some time. Would it be possible to have a setting to turn off indexing?
At a quick glance, everything seems to work pretty damn good (at least in a single file mode). These day i’ll start a new project and i’ll be able to give a more complete feedback (i.e. find bugs) 
Thanks!
At first sight, sublime became very sluggish (plugin_host.exe uses up to 25% cpu) when i try to open a fairly large project (e.g. laravel codebase). Disabling the plugin will make everything goes smooth again.
@iamntz, I will need a bit of info.
How sluggish are we talking?
Do you get console errors.
If you turn off “enable_project_palette”: false, and restarting, do things pick up (this is the only thing that has to do with big projects; if this doesn’t help it can’t be the indexing).
Try turning off “enable_current_file_palette”: true, (maybe it has to do with a big file)?
I was running this in really large projects. Some projects we have at work are very, very large; once built, they take up over a gig with object files and source code and other crap. They don’t have any real web stuff (or very little), so it probably isn’t indexing many files, but it would have to crawl the entire tree. If you know of a public repo that would be good for me to try, please point me at a link. The whole process is threaded, but python threads are not truly parallel. Maybe I need more than a big project, but the right kind of project to see your problem?
Setting “enable_project_palette”: false solves the problem for me. This is in a project of approx 4GB counting about 127k files, mostly python files. No errors in the console with debug set to true.
