Home Download Buy Blog Forum Support

Auto Sort Css Rules

Auto Sort Css Rules

Postby ajpalkovic on Fri Jun 17, 2011 12:52 am

https://github.com/ajpalkovic/SublimePl ... sortCss.py

I've always found organizing CSS files to be a pain, and the best trick I've had was to always keep my CSS rules in sorted order so they are semi easy/logical to find. But, I hate keeping it ordered.

So, I created a plugin that sorts all of the CSS rules in a file. Additionally, I added a small onSave event, so that every time you save the file it automatically sorts the css rules! That can be disabled by setting sort_css_on_save to false. It is true by default.

Notes:
1. The new version of the plugin sorts the first continuous block of rules in each selector. This is really only a limitation for scss. If you put css rules after a nested selector, they won't be sorted.
2. If you find bugs, please post the css snippet and I'll fix it.
Last edited by ajpalkovic on Sun Jun 19, 2011 9:35 pm, edited 1 time in total.
ajpalkovic
 
Posts: 142
Joined: Fri Jun 10, 2011 10:21 pm

Re: Auto Sort Css Rules

Postby adzenith on Fri Jun 17, 2011 2:51 am

ajpalkovic wrote:The problem appears to be that self.view.show(self.view.visible_region()) doesn't seem to keep the view at the same location.

I've encountered the same issue. Seems strange, doesn't it? :)
adzenith
 
Posts: 1217
Joined: Mon Oct 19, 2009 9:12 pm

Re: Auto Sort Css Rules

Postby ajpalkovic on Fri Jun 17, 2011 3:17 am

Yea, I started doing some fancy match, and I could get it to only scroll a couple of lines, I guess I could always write a loop to scroll it one character at a time until it reaches the correct line :)
ajpalkovic
 
Posts: 142
Joined: Fri Jun 10, 2011 10:21 pm

Re: Auto Sort Css Rules

Postby iamntz on Fri Jun 17, 2011 7:29 am

Nice plugin!
There might be a problem though on sorting custom css properties:

Code: Select all
filter:alpha(opacity=50);
opacity: 0.5;

or
Code: Select all
-moz-border-radius: 5px;
border-radius: 5px;


Would be great if these won't be split like this:
Code: Select all
filter:alpha(opacity=50);
padding:0;
opacity: 0.5;


Make sense? There is something that can be done? Thanks!
iamntz
 
Posts: 918
Joined: Fri Apr 29, 2011 8:52 am
Location: Romania

Re: Auto Sort Css Rules

Postby jps on Fri Jun 17, 2011 7:46 am

ajpalkovic wrote:The problem appears to be that self.view.show(self.view.visible_region()) doesn't seem to keep the view at the same location.

view.visible_region() is approximate, in the sense that if a line is partially visible, it'll be included in the visible region. Doing a show() on a partially visible line will scroll the view to reveal the line.
jps
Site Admin
 
Posts: 3077
Joined: Wed Mar 19, 2008 12:33 pm

Re: Auto Sort Css Rules

Postby ajpalkovic on Fri Jun 17, 2011 8:21 am

It's not off by one line though.

If I run this in the console:
sublime.active_window().active_view().show(sublime.active_window().active_view().visible_region())
it scrolls multiple lines.

If I have the top of the buffer at line 1, that scrolls so the top of the buffer is line 35. Running it again moves the buffer to line 52.
Last edited by ajpalkovic on Fri Jun 17, 2011 8:29 am, edited 1 time in total.
ajpalkovic
 
Posts: 142
Joined: Fri Jun 10, 2011 10:21 pm

Re: Auto Sort Css Rules

Postby ajpalkovic on Fri Jun 17, 2011 8:24 am

@iamntz
-moz- and the other prefixes are stripped when sorting, so that all the properties with the same name but different prefix stay next to each other.

The filter thing could be hard. I think though that isn't what I want. That starts trying to find a more logical way of grouping stuff. I tried to keep it strictly alphabetically. It's a slippery slope, one exception leads to another and then its no longer alphabetical.

But, if you really want to, you can certainly modify the plugin. There is a single function self.compareLines I think that does the sort comparison, so you can add exceptions like that if you want to.
ajpalkovic
 
Posts: 142
Joined: Fri Jun 10, 2011 10:21 pm

Re: Auto Sort Css Rules

Postby jps on Fri Jun 17, 2011 9:14 am

ajpalkovic wrote:If I have the top of the buffer at line 1, that scrolls so the top of the buffer is line 35. Running it again moves the buffer to line 52.


Yeah - if a point isn't fully visible, then show() will attempt to centre the view on that point. This is off the top of my head btw, so I could be wrong.
jps
Site Admin
 
Posts: 3077
Joined: Wed Mar 19, 2008 12:33 pm

Re: Auto Sort Css Rules

Postby ajpalkovic on Fri Jun 17, 2011 9:21 am

Yea, that makes sense.

If I do this instead:
sublime.active_window().active_view().show(sublime.active_window().active_view().visible_region().a)
it is definitely better, but it still jumps around in my sortCss.py plugin.

I think the plugin is jumping because the edits force the view to make the edit'd region visible? Maybe there could be an option to disable that behavior? It never jumps on a sorted css file because it doesn't make any edits.
ajpalkovic
 
Posts: 142
Joined: Fri Jun 10, 2011 10:21 pm

Re: Auto Sort Css Rules

Postby jps on Fri Jun 17, 2011 1:23 pm

ajpalkovic wrote:I think the plugin is jumping because the edits force the view to make the edit'd region visible? Maybe there could be an option to disable that behavior? It never jumps on a sorted css file because it doesn't make any edits.


It turns out that using view.replace() will scroll to reveal the replaced text. It clearly shouldn't be doing this, and I'll remove it for the next build.
jps
Site Admin
 
Posts: 3077
Joined: Wed Mar 19, 2008 12:33 pm

Next

Return to Plugin Announcements

Who is online

Users browsing this forum: No registered users and 4 guests