ckirkendall / enfocus

DOM manipulation and templating library for ClojureScript inspired by Enlive.
http://ckirkendall.github.com/enfocus-site/
370 stars 41 forks source link

Function based inline snippets #99

Open CmdrDats opened 10 years ago

CmdrDats commented 10 years ago

I'm trying to figure out how to write something where I can use a hidden html tag in my dom as a template, copy the node, manipulate it and then insert it at another point. In my specific instance, I have a chat window and a template hidden 'response' div that I'd like to copy.

Ideally, I'd be able to define the transforms and selection without actually providing the data or root node yet (the root node is important, since I could have multiple chats on a page, each with different templates)

I imagine the code looking something like:

(defn chat [root name message]
  (ef/snippet root [:.message]
     [:.name] (ef/content name)
     [:.message] (ef/content message)))

the result of ef/snippet in this example would compose with something like:

(at root 
  [:.messagebox]
  (ef/append (chat root "Bob" "Hello world!")))

Is there already a way to achieve this? If not, would it be a feasible thing to go about implementing? Also, there's the issue of removing the 'hidden' style - I'm happy in my case to always assume a 'display:none' style (and in ef/snippet, always remove it), but I'm not sure that's universally a good idea?

ckirkendall commented 10 years ago

so like deftemplate and defsnippet but the node already exists in the dom?

CmdrDats commented 10 years ago

That almost nails it, yes, but without actually attaching the idea of a def'd var at all, just return a copied dom node value that can be passed around.

It might be the composition of two ideas - copying a dom node, and then performing an at on that. But I'm not sure what the implications are regarding the css selectors?

I've had a browse through the enfocus source code and it seems like you'd have to copy the node and physically insert it into the dom for the css at to work?

ckirkendall commented 10 years ago

yes it has to be part of the dom for the transforms to be possible.