Not signed in (Sign In)

Powered by Vanilla 1.1.2.

Welcome Guest!
Want to take part in these discussions? If you have an account, please sign in. If you don't have an account, register now.

Resources: Regexp patterns for converting Uni-Form selectors (by Nate Cavanaugh)

Bottom of Page

1 to 6 of 6

  1.  
    •  
      CommentAuthorDraganBabic
    • CommentTimeApr 22nd 2007 edited
     #1

    Use these regular expressions patterns Nate kindly provided to convert Uni-Form element selectors (IDs and class names) to the naming convention of your choice. Almost all text editors support them in their native search and replace functionality.

    To convert camelCase to dashes (eg. .ctrlHolder → .ctrl-holder): 

    Find: (#|.)([a-z]+)([A-Z]{1})([a-z]+)(s|{|:|.|,)Replace: $1$2-L$3$4$5

    To convert camelCase to underscores( eg. .ctrlHolder → .ctrl_holder): 

    Find: (#|.)([a-z]+)([A-Z]{1})([a-z]+)(s|{|:|.|,)Replace: $1$2_L$3$4$5
  2.  #2

    Question for Nate:

    Hi Nate, I see you have registered. I just wanted to ask you something about these regexps because they don't seem to work for me. I have tried them with EditPlus2. I must admit that I don't have the slightest clue of what is going on there, so I thought you might explain it to me if you have a minute. Thanks.

  3.  #3

    Hi Dragan,
    Actually, they need a bit of updating because of version 1.2, so here are the new ones, but I'm also guessing a reason why it's not working is that slashes got stripped out of the ones above, which are needed:

    To convert camelCase to dashes (eg. .ctrlHolder → .ctrl-holder):
    Find: (#|\.)([a-z]+)([A-Z]{1})([a-z]+)(\s|\{|:|\.|,)
    Replace: $1$2-\L$3$4$5

    To convert camelCase to underscores( eg. .ctrlHolder → .ctrl_holder):
    Find: (#|\.)([a-z]+)([A-Z]{1})([a-z]+)(\s|\{|:|\.|,)
    Replace: $1$2_\L$3$4$5

    I'll try to explain exactly what's going on:

    () means grouping, and it also allows you to reference it later, via the $n.

    So here goes on what the groups actually match:

    (#|\.) This says find either a # or a . (matches .inlineLabels{)
    ([a-z]+) This says find any alphabetical, lowercase letter, 1 or more times (matches .inlineLabels{)
    ([A-Z]{1}) This says find me exactly 1 occurrence of any capital letter (matches .inlineLabels{)
    ([a-z]+) This says find any alphabetical, lowercase letter, 1 or more times (matches .inlineLabels{ )
    (\s|\{|:|\.|,) This says find either a space, a curly brace, a colon, a period, or a comma (matches .inlineLabels{ )

    Now for the matching:

    $1 refers to the first parenthesis, $2 the second, etc. The _ or - is the new symbol we're going to insert and the \L says to change the following match to lower case.

    I hope that was clear, because regex's can get quite obtuse :)

  4.  #4

    Also, if you start trying to do a replace, and you get this:

    .inlineLa-bel, or .ctrlHo-lder, try running the replace with the "Match Case" option selected.

    •  
      CommentAuthorDraganBabic
    • CommentTimeApr 27th 2007 edited
     #5

    Nope, I can't get these to work in EditPlus2 no matter what... I suppose they work and you have tried them Nate, right? So I'm gonna replace the old ones in the first post of this thread with the new ones.

    Thanks for the clarification on them!

  6.  #6

    PS

    I am planning on getting someone to make a simple php script that would allow people to upload their Uni-Form CSS files and do the conversion automatically. Yell if you know someone who would be willing to do this. :)

1 to 6 of 6

  1.