attribute abbreviations

mark-hahn commented 13 years ago

I have an attribute abbreviation feature that I developed as part of a home-brew template engine. I've used this feature for a year or so with good success. I'm making it available here to pull if you wish.

It allows you to put in something like this ...

div x:"in=exp-test c=kls1+kls2 w:100 h:200 bc:white opacity:30% w=50 h:o c:p"

and it creates this (I added line breaks for readability here) ...

<div id="exp-test" name="exp-test" class="kls1 kls2" width="50" 
        style="width:100px; height:200px; background-color:white; opacity:30%; 
                   hidden:overflow; cursor:pointer"></div>

Features:

You can mix attributes and css and it detects which is which by the : or = key/value separator.
It uses spaces for attribute separation but no quotes are required. If you want to put in a space use a +, like in a url
if you want you can use real keys like background-color instead of bc
Almost all abbreviations are correct initials. I was amazed at how few conflicts there were
Things you might think are conflicts, like fs:12 (font-size:12px) and fs:i (font-style:italic), are resolved by context.
You can always type 100 instead of 100px. Of course you can still type 100% etc.
in=xxx compiles to id="xxx" name="xxx". This is the only case like this though.

I know this is not everyone's kup of tea. It makes the template pretty much unreadable to a beginner. You must have used html/css for so long that you have them memorized. The only answer for this problem is to read the resulting html.

If you hate typing in long keys like background-color like I do, then give this a try.

My to-do list includes support for checked= compiling to checked=checked. Other suggestions like this are welcome.

mark-hahn commented 13 years ago

You can probably ignore this as I won't be able to support it myself. The reason is that I've continued to add more features to my fork to the point where I am permanently forked.

JasonGiedymin commented 13 years ago

I've forked this repo and added this info to a wiki page: https://github.com/JasonGiedymin/coffeekup/wiki/Attribute-Abbreviations

mauricemach commented 13 years ago

I used to think I was exploring the limits of minimalism with zappa, but you proved me wrong sir! :)

You're right, that's not exactly my kup of tea, my comfort threshold in the balance between terseness and expressiveness pending more to the latter than this. But I can definitely relate to your "itch" and I see it providing a lot of value for some people. At any rate, it would be a nice option to have. The implementation details are also very cleverly and nicely resolved; solving conflicts by context, telling attrs and style apart by operator, etc. Nice job!

I've been thinking a lot lately in providing some kind of a plugin system for CK, and maybe this is a good fit for such system. Especially given that by my rough calculations, this feature alone would add ~8KB to any CK template on the client-side, so it should definitely be optional.

On a side note, I think this feature would shine brighter in a specialized templating language, especially one that excels in minimalism such as Jade. The point of coffeekup being to represent HTML with existing CoffeeScript syntax, it's comparatively limited in this space. Having all these attributes inside a big ugly string is such a waste. It could be very nice if properly integrated within a language, with syntax highlighting and all.

I'm closing this request for the moment as I don't think it belongs to the "core", but I'll think of an extension mechanism and I believe this will make a fine addition to it.

mauricemach / coffeekup

attribute abbreviations #47