Home Download Buy Blog Forum Support

How create snippet with multiple values?

How create snippet with multiple values?

Postby brunobatista on Fri Jun 29, 2012 1:21 pm

Example:

Code: Select all
// Filter by $2.
\$${1:helloId} = \$this->getState('filter.${2:hello}_id');
if (${3:is_numeric|is_array|is_string}(\$$1))
{
   \$query->where('a.$2 = ' . (int) \$$1);
}


I try use for example:

Code: Select all
${3:is_numeric|is_array|is_string}


But not working, is possible use multiple values to select?
brunobatista
 
Posts: 16
Joined: Thu Apr 26, 2012 2:13 pm

Re: How create snippet with multiple values?

Postby agibsonsw on Sat Jun 30, 2012 12:08 am

I may have misunderstood your question but I have completions (snippets) that enable the completion of one of a selection of words. Here's a CSS example which I've extracted from my completions file.

Code: Select all
{ "trigger": "position", "contents": "position: ${1:Absolute/Relative/Fixed/Static}${1/(a$)|(r$)|(f$)|(s$)|(ab$)|(re$)|(fi$)|(st$)|.*/?1:bsolute:?2:elative:?3:ixed:?4:tatic:?5:solute:?6:lative:?7:xed:?8:atic/i};$0" },

It appears as follows, with the text 'Absolute/Relative/Fixed/Static' highlighted:

Code: Select all
position: Absolute/Relative/Fixed/Static;

If I overtype the selected text with the letters 'a' or 'ab' it will insert the word 'absolute'. If I Backspace to delete these characters, and type the letter 'r', it will insert the word 'relative' instead. I then tab to finish the snippet.

This is in a completions file but the same principles apply to individual snippets.
"I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
agibsonsw
 
Posts: 901
Joined: Fri Jan 27, 2012 9:11 pm

Re: How create snippet with multiple values?

Postby iamntz on Sat Jun 30, 2012 3:58 am

@agibsonsw: it is possible to have the trigger key in other position than begining? Let's say i want to have display: [t]able/table-[c]ell/table-[r]ow and so on. Right now i used [t], [ta], [tab] for every variant. Thanks!
iamntz
 
Posts: 898
Joined: Fri Apr 29, 2011 8:52 am
Location: Romania

Re: How create snippet with multiple values?

Postby agibsonsw on Sat Jun 30, 2012 10:32 am

Yes it is possible:

Code: Select all
{ "trigger": "display", "contents": "display: ${1/(bl|ta)$|(ce|ca|c|co|f|fo|h|he|r|ro)$|.*/?1:inline-:?2:table-/i}${1:Inline-BLock-TAble-List-RUn-in-CEll-CAption-COlumn-Footer-Header-ROw-group/None}${1/(b$)|(i$)|(ru$)|(t$)|(l$)|(bl$)|(ta$)|(ce$)|(ca$)|(c$)|(co$)|(f$)|(fo$)|(h$)|(he$)|(r$)|(ro$)|(n$)|(no$)|.*/?1:lock:?2:nline:?3:n-in:?4:able:?5:ist-item:?6:ock:?7:ble:?8:ll:?9:ption:?10:olumn:?11:lumn-group:?12:ooter-group:?13:oter-group:?14:eader-group:?15:ader-group:?16:ow:?17:w-group:?18:one:?19:ne/i};${1/($)|.*/?1:I BL TA L RU CE CA CO F H RO N/}" },


It displays like this:

Code: Select all
display: Inline-BLock-TAble-List-RUn-in-CEll-CAption-COlumn-Footer-Header-ROw-group/None;

with the whole section after display: highlighted. If you press Delete it shows,

Code: Select all
display: ;I BL TA L RU CE CA CO F H RO N

indicating the letters you can use. (This last section in the snippet can be removed.) So, typing 'ta' will result in:

Code: Select all
display: inline-table;


My CSS completions are at my GitHub. There are other variations in this file. For example, using the completion 'margin4' will display:

Code: Select all
margin: top right bottom left;

If you over-type 'top' with '10px' it will result in the following, and I can Tab to add the other pixel values:

Code: Select all
margin: 10px rightpx bottompx leftpx;

My JS completions demonstrate other techniques. For example, using 'alert' will preprend 'window' if appropriate.
"I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
agibsonsw
 
Posts: 901
Joined: Fri Jan 27, 2012 9:11 pm

Re: How create snippet with multiple values?

Postby iamntz on Sat Jun 30, 2012 10:47 am

Image

Thanks man, today i learned something new!
iamntz
 
Posts: 898
Joined: Fri Apr 29, 2011 8:52 am
Location: Romania

Re: How create snippet with multiple values?

Postby pier on Sun Nov 25, 2012 2:53 am

iamntz wrote:Image

Thanks man, today i learned something new!


There's no other way to put it.

MOTHER OF GOD!

This opens up a whole new world of possibilities, it should be a sticky or in the documentation.

Thanks AGibson
pier
 
Posts: 92
Joined: Fri Jun 15, 2012 2:47 am

Re: How create snippet with multiple values?

Postby agibsonsw on Sun Nov 25, 2012 12:18 pm

@pier. Thank you.

The following JS example completion pre-pends Math to abs() if there is not already something before the dot .

Code: Select all
{ "trigger": "abs", "contents": "${TM_CURRENT_WORD/\\.\\W*|\\w+|(.*)/(?1:Math\\.)/}abs(${1:x})$0" },

It's a completion but the same principle applies to a snippet.

..and here's my MEGA-Snippet to study :o

Code: Select all
<snippet>
   <content><![CDATA[/* ${1} ${1/.*(\.)$|.*/?1::\n/}${1/($)|.*(?:^| )((b)|(c)|(d)|(e)|(f)|(h)|(l)|(m)|(o)|(p)|(q)|(r)|(t)|(v)|(w)|(z)).?$|.*/?1:Type to for top etc, followed by a space:?3:BAckground-Attach etc BOTtom BOrder-Collapse-Spacing-Bottom\(Color\/Style\/Width\) etc BC BS BW:?4:CLear CLIp COlor CONtent CUrsor Counter-Inc-Reset Caption-Side:?5:DIsplay DIRection:?6:Empty-Cells:?7:FOnt F-Family-SI\/ST\/W\/V FLoat:?8:HEight:?9:LEft LEtter-Spacing Line-Height List-Style I\/P\/T:?10:MArgin T\/R\/B\/L MAx\/MIn-Height\/Width:?11:OUtline-Color-Style-Width OVerflow:?12:PAdding T\/R\/B\/L POsition-Abs\/Rel\/Fixed\/Static:?13:QUotes:?14:RIght:?15:TOp TExt-Align\/D\/I\/T:?16:Vertical-Align VIsibility:?17:WHite-space WIdth WOrd-spacing:?18:Z-Index/i}${1/($)|.*(?:\b| )((baa)|(bap)|(bar)|((b[trbl]?s)|(ous))|(b[trbl]?w|ouw)|(boc)|(cl)|(cu)|(cs)|(dir)|(di)|(ec)|(fl)|(fsi)|(fst)|(fv)|(fw)|((bot|to|le|ri|he|wi|mat|mar|mab|mal|ma)|(mah|maw)|mih|miw|pa[trbl]?|tei)|((lh)|ls)|(lsi)|(lsp)|(lst)|(ov)|(po)|(tea)|(ted)|(tet)|(va)|(vi)|(wh)|(wo)|(zi))( |_[a-z0-9-]{0,8})$|.*/?3:attachment\: fixed scroll:?4:left center right bottom center top:?5:repeat no-repeat repeat-x repeat-y:?6:style\: dashed dotted double groove inset outset ridge solid none(?7: hidden):?9:width\: thin thick medium:?10:collapse separate:?11:left right both:?12:default pointer crosshair move *-resize text wait help progress auto:?13:top bottom:?14:ltr rtl:?15:inline inline-block list-item run-in table-cell-column-row -header-footer -group none:?16:show hide:?17:left right none:?18:smaller larger x\(x\)-small-large medium:?19:italic oblique normal:?20:small-caps normal:?21:bold bolder lighter normal xxx:?22:length percentage(?23: auto:?24: none):?25:length percentage (?26:number )normal:?27:none:?28:inside outside:?29:disc circle square decimal-leading-zero lower-upper-greek-latin-roman armenian georgian:?30:visible hidden scroll auto:?31:absolute relative fixed static:?32:left center right justify:?33:underline overline line-through blink none:?34:uppercase lowercase capitalize none:?35:baseline sub super top text-top middle bottom text-bottom length percentage:?36:visible hidden collapse:?37:nowrap pre pre-wrap pre-line normal:?38:length normal:?39:integer auto/gi} */$0${1/\\|\.$|(?:\b| )((ba((a)|(c)|(i)|(p)|(r))?)|(bot)|(bo((c)|(s))?)|(((bb)|(bl)|(br)|(bt)|b)((c)|(s)|(w))?)|(cli)|(con)|(co)|(cu)|(cl)|(c((i)|(r)))|(cs)|(dir)|(di)|(ec)|((ff)|(fsi)|(fst)|(fv)|(fw)|fo)|(fl)|(he)|(les)|(le)|(lh)|(ls((i)|(p)|(t))?)|(((ma)|(mi))((h)|(w)))|(((ma)|(pa))((b)|(l)|(r)|(t))?)|(ou((c)|(s)|(w))?)|(ov)|(po(?:(a)|(r)|(f)|(s))?)|(qu)|(ri)|(to)|(?:te((a)|(d)|(i)|(t)))|(va)|(vi)|(wh)|(wi)|(wo)|(zi)|(!)|([0-9]*)(cm|em|ex|in|mm|pt|pc|px|\%)(?:(4)|3)(!)?)( |_|\.|$)|( {2,}|\t)/?2:;\nbackground(?4:-attachment:?5:-color:?6:-image:?7:-position:?8:-repeat)\: :?9:;\nbottom\: :?10:;\nborder(?12:-collapse:?13:-spacing)\: :?14:;\nborder(?16:-bottom:?17:-left:?18:-right:?19:-top)(?21:-color:?22:-style:?23:-width)\: :?24;\nclip\: :?25:;\ncontent\: :?26:;\ncolor\: :?27:;\ncursor\: :?28:;\nclear\: :?29:;\ncounter-(?31:increment:?32:reset)\: :?33:;\ncaption-side\: :?34:;\ndirection\: :?35:;\ndisplay\: :?36:;\nempty-cells\: :?37:;\nfont(?38:-family:?39:-size:?40:-style:?41:-variant:?42:-weight)\: :?43:;\nfloat\: :?44:;\nheight\: :?45:;\nletter-spacing\: :?46:;\nleft\: :?47;\nline-height\: :?48:;\nlist-style(?50:-image:?51:-position:?52:-type)\: :?53:;\n(?55:max:?56:min)(?58:-height:?59:-width):?60:;\n(?62:margin:?63:padding)(?65:-bottom:?66:-left:?67:-right:?68:-top)\: :?69:;\noutline(?71:-color:?72:-style:?73:-width)\: :?74:;\noverflow\: :?75:;\nposition\: (?76:absolute:?77:relative:?78:fixed:?79:static):?80:;\nquotes\: :?81:;\nright\: :?82:;\ntop\: :?83:;\ntext(?84:-align:?85:-decoration:?86:-indent:?87:-transform)\: :?88:;\nvertical-align\: :?89:;\nvisibility\: :?90:;\nwhite-space\: :?91:;\nwidth\: :?92:;\nword-spacing\: :?93:;\nz-index\: :?94: !important:?95:$95$96 $96 $96(?97: $96)(?98: !important)/gi};
]]></content>
   <tabTrigger>propx</tabTrigger>
   <scope>source.css  meta.property-list.css</scope>
   <description>po to, etc</description>
</snippet>
"I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
agibsonsw
 
Posts: 901
Joined: Fri Jan 27, 2012 9:11 pm

Re: How create snippet with multiple values?

Postby qgates on Mon Nov 26, 2012 4:22 pm

agibsonsw, clearly you are the snippet master ;)

So here's a question for you. I was wondering whether it was possible to do more than just mirror fields in snippets. For example:

Snippet field 1: I'm Typing In Title Case
Autocompleted field 2: i'm typing in title case

As I type in field 1, field 2 is automatically completed but with some simple adjustment processing, title case in the above example but I can think of more valuable use-cases. Is that possible?

S
qgates
 
Posts: 205
Joined: Mon Nov 05, 2012 4:33 pm

Re: How create snippet with multiple values?

Postby agibsonsw on Mon Nov 26, 2012 5:49 pm

Code: Select all
<snippet>
    <content><![CDATA[
${1:type here}: title-case is:
${1/\b(\w*)\b/\u\1/g}
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>test</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <!-- <scope>source.python</scope> -->
</snippet>
"I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
agibsonsw
 
Posts: 901
Joined: Fri Jan 27, 2012 9:11 pm

Re: How create snippet with multiple values?

Postby agibsonsw on Mon Nov 26, 2012 11:44 pm

A more complete version, that lower-cases all letters after the first-letter of each word:

Code: Select all
<snippet>
    <content><![CDATA[
${1:type here}: title-case is:
${1/\b(\w)(\w*)\b/\u\1\L\2\E/g}
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>test</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <!-- <scope>source.python</scope> -->
</snippet>
"I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
agibsonsw
 
Posts: 901
Joined: Fri Jan 27, 2012 9:11 pm

Next

Return to General Discussion

Who is online

Users browsing this forum: slayd, Yahoo [Bot] and 16 guests