Using Vim, how can I make CSS rules into one liners? - css

I would like to come up with a Vim substitution command to turn multi-line CSS rules, like this one:
#main {
padding: 0;
margin: 10px auto;
}
into compacted single-line rules, like so:
#main {padding:0;margin:10px auto;}
I have a ton of CSS rules that are taking up too many lines, and I cannot figure out the :%s/ commands to use.

Here's a one-liner:
:%s/{\_.\{-}}/\=substitute(submatch(0), '\n', '', 'g')/
\_. matches any character, including a newline, and \{-} is the non-greedy version of *, so {\_.\{-}} matches everything between a matching pair of curly braces, inclusive.
The \= allows you to substitute the result of a vim expression, which we here use to strip out all the newlines '\n' from the matched text (in submatch(0)) using the substitute() function.
The inverse (converting the one-line version to multi-line) can also be done as a one liner:
:%s/{\_.\{-}}/\=substitute(submatch(0), '[{;]', '\0\r', 'g')/

If you are at the beginning or end of the rule, V%J will join it into a single line:
Go to the opening (or closing) brace
Hit V to enter visual mode
Hit % to match the other brace, selecting the whole rule
Hit J to join the lines

Try something like this:
:%s/{\n/{/g
:%s/;\n/;/g
:%s/{\s+/{/g
:%s/;\s+/;/g
This removes the newlines after opening braces and semicolons ('{' and ';') and then removes the extra whitespace between the concatenated lines.

If you want to change the file, go for rampion's solution.
If you don't want (or can't) change the file, you can play with a custom folding as it permits to choose what and how to display the folded text. For instance:
" {rtp}/fold/css-fold.vim
" [-- local settings --] {{{1
setlocal foldexpr=CssFold(v:lnum)
setlocal foldtext=CssFoldText()
let b:width1 = 20
let b:width2 = 15
nnoremap <buffer> + :let b:width2+=1<cr><c-l>
nnoremap <buffer> - :let b:width2-=1<cr><c-l>
" [-- global definitions --] {{{1
if exists('*CssFold')
setlocal foldmethod=expr
" finish
endif
function! CssFold(lnum)
let cline = getline(a:lnum)
if cline =~ '{\s*$'
return 'a1'
elseif cline =~ '}\s*$'
return 's1'
else
return '='
endif
endfunction
function! s:Complete(txt, width)
let length = strlen(a:txt)
if length > a:width
return a:txt
endif
return a:txt . repeat(' ', a:width - length)
endfunction
function! CssFoldText()
let lnum = v:foldstart
let txt = s:Complete(getline(lnum), b:width1)
let lnum += 1
while lnum < v:foldend
let add = s:Complete(substitute(getline(lnum), '^\s*\(\S\+\)\s*:\s*\(.\{-}\)\s*;\s*$', '\1: \2;', ''), b:width2)
if add !~ '^\s*$'
let txt .= ' ' . add
endif
let lnum += 1
endwhile
return txt. '}'
endfunction
I leave the sorting of the fields as exercise. Hint: get all the lines between v:foldstart+1 and v:voldend in a List, sort the list, build the string, and that's all.

I won’t answer the question directly, but instead I suggest you to reconsider your needs. I think that your “bad” example is in fact the better one. It is more readable, easier to modify and reason about. Good indentation is very important not only when it comes to programming languages, but also in CSS and HTML.
You mention that CSS rules are “taking up too many lines”. If you are worried about file size, you should consider using CSS and JS minifiers like YUI Compressor instead of making the code less readable.

A convenient way of doing this transformation is to run the following
short command:
:g/{/,/}/j

Go to the first line of the file, and use the command gqG to run the whole file through the formatter. Assuming runs of nonempty lines should be collapsed in the whole file.

Related

Need of awk command explaination

I want to know how the below command is working.
awk '/Conditional jump or move depends on uninitialised value/ {block=1} block {str=str sep $0; sep=RS} /^==.*== $/ {block=0; if (str!~/oracle/ && str!~/OCI/ && str!~/tuxedo1222/ && str!~/vprintf/ && str!~/vfprintf/ && str!~/vtrace/) { if (str!~/^$/){print str}} str=sep=""}' file_name.txt >> CondJump_val.txt
I'd also like to know how to check the texts Oracle, OCI, and so on from the second line only. 
The first step is to write it so it's easier to read
awk '
/Conditional jump or move depends on uninitialised value/ {block=1}
block {
str=str sep $0
sep=RS
}
/^==.*== $/ {
block=0
if (str!~/oracle/ && str!~/OCI/ && str!~/tuxedo1222/ && str!~/vprintf/ && str!~/vfprintf/ && str!~/vtrace/) {
if (str!~/^$/) {
print str
}
}
str=sep=""
}
' file_name.txt >> CondJump_val.txt
It accumulates the lines starting with "Conditional jump ..." ending with "==...== " into a variable str.
If the accumulated string does not match several patterns, the string is printed.
I'd also like to know how to check the texts Oracle, OCI, and so on from the second line only.
What does that mean? I assume you don't want to see the "Conditional jump..." line in the output. If that's the case then use the next command to jump to the next line of input.
/Conditional jump or move depends on uninitialised value/ {
block=1
next
}
perhaps consolidate those regex into a single chain ?
if (str !~ "oracle|OCI|tuxedo1222|v[f]?printf|vtrace") {
print str
}
There are two idiomatic awkisms to understand.
The first can be simplified to this:
$ seq 100 | awk '/^22$/{flag=1}
/^31$/{flag=0}
flag'
22
23
...
30
Why does this work? In awk, flag can be tested even if not yet defined which is what the stand alone flag is doing - the input is only printed if flag is true and flag=1 is only executed when after the regex /^22$/. The condition of flag being true ends with the regex /^31$/ in this simple example.
This is an idiom in awk to executed code between two regex matches on different lines.
In your case, the two regex's are:
/Conditional jump or move depends on uninitialised value/ # start
# in-between, block is true and collect the input into str separated by RS
/^==.*== $/ # end
The other 'awkism' is this:
block {str=str sep $0; sep=RS}
When block is true, collect $0 into str and first time though, RS should not be added in-between the last time. The result is:
str="first lineRSsecond lineRSthird lineRS..."
both depend on awk being able to use a undefined variable without error

How to make all the attributions in the css selector into one line with vim?

Here is my css part of css file.
body{
width:1100px;
height:800px;
}
div.main{
margin:20px auto 0 auto;
background-color:#f7f7f7;
}
I want to rewrite it as below.
body{width:1100px;height:800px;}
div.main{margin:20px auto 0 auto;background-color:#f7f7f7;}
All attritutions and values rewritten as only one line,is there a smarty vim command to do the job?
One option would be
g/{/,/}/j
which breaks down as
g start a global command
{ search for {
,/}/ for each match, set a range up until the }
j join the range
Note that this might be to naïve as-is. This doesn't take into account nested brackets. You might first want to set a visual range to the textblock you like to change.
You could use the J or gJ (alternative that doesn't add spaces) commands. They can be run in visual mode to join all selected lines, or take a count.
Alternatively, the splitjoin.vim plugin provides specific support for css rules as you are asking. With the cursor over the first line of the css block, type gJ to join the whole block into a single line.
Either way, you may want/need to run a replace to remove leading spaces before joining - :s/^\s\+// before joining the lines.
EDIT: I guess a 'smarty' way to do this, and without using plugins, would be the following macro: vf}:s/^\s\+/^MgvgJ (the ^M means pressing the enter key - you may have to enter the macro manually to get this). Use it by putting the cursor at the beginning of the line at the top of the css rule you want to rewrite.
As #romainl said, you should use a minifier. However I am going to assume what you really want is a way to glance at your css rules quickly. If that is the case then I suggest you look into folding. #Luc Hermitte gave a great answer on this subject on the post: Using vi, how can I make CSS rules into one liners?
Below is a variant of #Luc Hermitte answer. Put the following in ~/.vim/ftplugin/css_fold.vim:
let b:width = 25
" Use the following mappings to adjust the foldtext "columns"
nnoremap <silent> <buffer> >s :<c-u>let b:width+=v:count1<cr><c-l>
nnoremap <silent> <buffer> <s :<c-u>let b:width-=v:count1<cr><c-l>
if !exists('*s:CssFoldText')
function! s:CssFoldText()
let line = printf("% *s {", -1*b:width, substitute(getline(v:foldstart), "{\s*$", "", ""))
let nnum = nextnonblank(v:foldstart + 1)
let lst = []
while nnum <= v:foldend
let line = line . " " . substitute(getline(nnum), "^\s*", "", "")
let nnum += 1
endwhile
return line
endfunction
map <SID>xx <SID>xx
let s:sid = substitute(maparg("<SID>xx"),'xx$','', '')
unmap <SID>xx
endif
exe "setlocal foldtext=" . s:sid . "CssFoldText()"
setlocal foldmethod=syntax
Now you can use folding commands like zM to close all folds, zR to open all folds, and za to toggle the current fold. Vimcasts has a nice screencast on this topic, How to fold.
For more information see:
:h folds
:h 'foldtext'
:h 'foldmethod'
:h za
:h zR
:h zM

QRegExp: individual quantifiers can't be non-greedy, but what good alternatives then?

I'm trying to write code that appends ending _my_ending to the filename, and does not change file extension.
Examples of what I need to get:
"test.bmp" -> "test_my_ending.bmp"
"test.foo.bar.bmp" -> "test.foo.bar_my_ending.bmp"
"test" -> "test_my_ending"
I have some experience in PCRE, and that's trivial task using it. Because of the lack of experience in Qt, initially I wrote the following code:
QString new_string = old_string.replace(
QRegExp("^(.+?)(\\.[^.]+)?$"),
"\\1_my_ending\\2"
);
This code does not work (no match at all), and then I found in the docs that
Non-greedy matching cannot be applied to individual quantifiers, but can be applied to all the quantifiers in the pattern
As you see, in my regexp I tried to reduce greediness of the first quantifier + by adding ? after it. This isn't supported in QRegExp.
This is really disappointing for me, and so, I have to write the following ugly but working code:
//-- write regexp that matches only filenames with extension
QRegExp r = QRegExp("^(.+)(\\.[^.]+)$");
r.setMinimal(true);
QString new_string;
if (old_string.contains(r)){
//-- filename contains extension, so, insert ending just before it
new_string = old_string.replace(r, "\\1_my_ending\\2");
} else {
//-- filename does not contain extension, so, just append ending
new_string = old_string + time_add;
}
But is there some better solution? I like Qt, but some things that I see in it seem to be discouraging.
How about using QFileInfo? This is shorter than your 'ugly' code:
QFileInfo fi(old_string);
QString new_string = fi.completeBaseName() + "_my_ending"
+ (fi.suffix().isEmpty() ? "" : ".") + fi.suffix();

Textmate "comment" command not working properly for css code

I'm having some problems when I toggle the comments in TextMate for CSS source code.
Using the shortcut CMD + / I activate the "Comment Line/Selection" command from the "source" bundle. The problem is that it inserts a series of // for all kinds of languages. For example, in CSS files it is supposed to insert a /**/ block, but it doesn't. In CSS files I also tried the "Insert Block Comment" command from the source bundle with the weird result that I get the following //.
// ----------------------------------------
instead of my code, deleting the code and inserting that.
I know I am supposed to modify the command from the bundle, but I can't figure out how and what.
This is the code of the "Comment Line/Selection" command from the "Source" Bundle:
#!/usr/bin/env ruby
# by James Edward Gray II <james (at) grayproductions.net>
#
# To override the operation of this commond for your language add a Preferences
# bundle item that defines the following valiables as appropriate for your
# language:
#
# TM_COMMENT_START - the character string that starts comments, e.g. /*
# TM_COMMENT_END - the character string that ends comments (if appropriate),
# e.g. */
# TM_COMMENT_MODE - the type of comment to use - either 'line' or 'block'
#
require "#{ENV["TM_SUPPORT_PATH"]}/lib/escape"
def out(*args)
print( *args.map do |arg|
escaped = e_sn(arg)
$selected ? escaped.gsub("}", "\\}") : escaped.sub("\0", "${0}")
end )
end
# find all available comment variables
var_suffixes = [""]
2.upto(1.0/0.0) do |n|
if ENV.include? "TM_COMMENT_START_#{n}"
var_suffixes << "_#{n}"
else
break
end
end
text = STDIN.read
default = nil # the comment we will insert, if none are removed
# maintain selection
if text == ENV["TM_SELECTED_TEXT"]
$selected = true
print "${0:"
at_exit { print "}" }
else
$selected = false
end
# try a removal for each comment...
var_suffixes.each do |suffix|
# build comment
com = { :start => ENV["TM_COMMENT_START#{suffix}"] || "# ",
:end => ENV["TM_COMMENT_END#{suffix}"] || "",
:mode => ENV["TM_COMMENT_MODE#{suffix}"] ||
(ENV["TM_COMMENT_END#{suffix}"] ? "block" : "line"),
:no_indent => ENV["TM_COMMENT_DISABLE_INDENT#{suffix}"] }
com[:esc_start], com[:esc_end] = [com[:start], com[:end]].map do |str|
str.gsub(/[\\|()\[\].?*+{}^$]/, '\\\\\&').
gsub(/\A\s+|\s+\z/, '(?:\&)?')
end
# save the first one as our insertion default
default = com if default.nil?
# try a removal
case com[:mode]
when "line" # line by line comment
if text !~ /\A[\t ]+\z/ &&
text.send(text.respond_to?(:lines) ? :lines : :to_s).
map { |l| !!(l =~ /\A\s*(#{com[:esc_start]}|$)/) }.uniq == [true]
if $selected
out text.gsub( /^(\s*)#{com[:esc_start]}(.*?)#{com[:esc_end]}(\s*)$/,
'\1\2\3' )
exit
else
r = text.sub( /^(\s*)#{com[:esc_start]}(.*?)#{com[:esc_end]}(\s*)$/,
'\1\2\3' )
i = ENV["TM_LINE_INDEX"].to_i
i = i > text.index(/#{com[:esc_start]}/) ?
[[0, i - com[:start].length].max, r.length].min :
[i, r.length].min
r[i, 0] = "\0"
out r
exit
end
end
when "block" # block comment
regex = /\A(\s*)#{com[:esc_start]}(.*?)#{com[:esc_end]}(\s*)\z/m
if text =~ regex
if $selected
out text.sub(regex, '\1\2\3')
exit
else
r = text.sub(regex, '\1\2\3')
i = ENV["TM_LINE_INDEX"].to_i
i = i > text.index(/#{com[:esc_start]}/) ?
[[0, i - com[:start].length].max, r.length].min :
[i, r.length].min
r[i, 0] = "\0"
out r
exit
end
end
end
end
# none of our removals worked, so preform an insert (minding indent setting)
text[ENV["TM_LINE_INDEX"].to_i, 0] = "\0" unless $selected or text.empty?
case default[:mode]
when "line" # apply comment line by line
if text.empty?
out "#{default[:start]}\0#{default[:end]}"
elsif default[:no_indent]
out text.gsub(/^.*$/, "#{default[:start]}\\&#{default[:end]}")
elsif text =~ /\A([\t ]*)\0([\t ]*)\z/
out text.gsub(/^.*$/, "#{$1}#{default[:start]}#{$2}#{default[:end]}")
else
indent = text.scan(/^[\t \0]*(?=\S)/).
min { |a, b| a.length <=> b.length } || ""
text.send(text.respond_to?(:lines) ? :lines : :to_s).map do |line|
if line =~ /^(#{indent})(.*)$(\n?)/ then
out $1 + default[:start] + $2 + default[:end] + $3
elsif line =~ /^(.*)$(\n?)/ then
out indent + default[:start] + $1 + default[:end] + $2
end
end
end
when "block" # apply comment around selection
if text.empty?
out default[:start]
print "${0}"
out default[:end]
elsif text =~ /\A([\t ]*)\0([\t ]*)\z/
out $1, default[:start]
print "${0}"
out $2, default[:end]
elsif default[:no_indent]
out default[:start], text, default[:end]
else
lines = text.to_a
if lines.empty?
out default[:start], default[:end]
else
lines[-1].sub!(/^(.*)$/, "\\1#{default[:end]}")
out lines.shift.sub(/^([\s\0]*)(.*)$/, "\\1#{default[:start]}\\2")
out(*lines) unless lines.empty?
end
end
end
Ensure you have the "Source" bundle installed. In the latest Textmate 2 Alpha at the time of writing, go to TextMate -> Preferences -> Bundles -> Check "Source" bundle to install. The CMD + / shortcut should now work.
It is small syntax problem if you're using a Ruby higher then 1.8.7. You will find that to_a method has been removed. If you want to fix the problem all you need to do is modify the code found in this file.
In order to fix the problem you need to search for any location that they call to_a and replace it with Array("string").
In my case I did this. This also should work for you:
lines = text.to_a
with
lines = text.lines.to_a
This should be a solution for every thing. Look to the image to see what file I ended up fixing.
I had the same problem and it turns out that I had an SCSS bundle installed that had a preference set to use "//" for comments with a scope selector for source.css as well as source.scss.
I would check to make sure that you don't have the same SCSS bundle and if you do, change the scope selector of the comments preference to be just source.scss.
Cmd/ has been working for years and still is. Well, my copy of TM2 alpha is broken (doesn't work with the / in the numeric pad but, well, it's alpha) but TM 1.5.x works as it should.
You are not supposed to modify anything anywhere. The Comment Line/Selection command is smart enough to put the right kind of comment in "any" kind of file.
Did you mess with language definitions? Is your file recognized as "CSS"? Does it work when removing all or certain plugins/bundles?
-- EDIT --

Looping through and combining two files in UNIX

This should be simple for those of you who have some programming knowledge... Unfortunately I don't.
I'm trying to iterate through a text file of image captions and add them as title tags to an html file. The image captions file has 105 captions (each is separated by a carriage return) and the gallery file has blank alt tags on each a tag (set up like alt="#"). The order of the captions corresponds with the order of the images in the html file.
So in other words... the psuedo code would be: "Loop through every line in captions.txt and for every alt="#" inside the gallery.html file, replace the # with the corresponding caption."
I'm on a Mac so I'd like to use UNIX.
Any help is greatly appreciated!
Thanks,
Mike
If all the alt="#" are on separate lines, you can use ed:
{
while read cap
do echo "/alt=\"#\"/ s//alt=\"$cap\"/"
done < captions.txt
echo wq
} | ed gallery.html
This assumes none of your captions contain a slash.
There are many ways to accomplish this goal. awk is the classic text manipulation program. (Well, awk and sed, for different purposes, but sed won't help here.)
awk '
BEGIN {
caps = ARGV[1]
delete ARGV[1]
}
/#/ {
getline cap < caps
gsub("#", cap)
}
{ print }
' captions.txt gallery.html
You could put it into a script to avoid having to type it more than once. Just start a plain text file with "#!/usr/bin/awk -f", put the "BEGIN ... { print }" below it, and give the file execute permissions.
This translates trivially into most scripting languages. Perl:
#!/usr/bin/perl -p
BEGIN { open CAPS, shift }
if (/#/) {
chomp($cap = <CAPS>);
s/#/$cap/g;
}
Almost the same in Ruby:
#!/usr/bin/ruby
caps = IO.readlines(ARGV.shift).each {|s| s.chomp!}
while gets
$_.gsub!(/#/, caps.shift) if $_ =~ /#/
print
end
And Python:
#!/usr/bin/python
import sys
caps = [s.strip() for s in file(sys.argv[1]).readlines()]
for f in [file(s, 'r') for s in sys.argv[2:]] or [sys.stdin]:
for s in f:
if s.find('#') > 0: s = s.replace('#', caps.pop(0))
print s,

Resources