<div dir="ltr">All of this would rely on the IHaskell interface, and would not work with any other interface or work with raw SVG/HTML/JS/etc. <div><br></div><div>I'd love to have a different approach though, in case anyone knows of one :)</div>

</div><div class="gmail_extra"><br><br><div class="gmail_quote">On Mon, Apr 7, 2014 at 5:55 PM, Kai Zhang <span dir="ltr"><<a href="mailto:kai@kzhang.org" target="_blank">kai@kzhang.org</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">

<div dir="ltr"><div class="gmail_default" style="font-size:small">Looks like you are going to add some "control bars" to diagrams. This is definitely a nice feature to have. But how would you be able to do something like changing the color of a circle when you place the mouse on it? I want control bars as well as some interactivity built directly into the SVG.</div>


</div><div class="HOEnZb"><div class="h5"><div class="gmail_extra"><br><br><div class="gmail_quote">On Mon, Apr 7, 2014 at 4:56 PM, Andrew Gibiansky <span dir="ltr"><<a href="mailto:andrew.gibiansky@gmail.com" target="_blank">andrew.gibiansky@gmail.com</a>></span> wrote:<br>


<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr">I am very interested in using this with IHaskell, but don't know of something that exists already. I am currently working on using IPython widgets with IHaskell in order to create a generic "event handling" framework for <i>any</i> sort of displays. Code might look like this (just some initial thoughts):<div>





<br></div><div><font face="courier new, monospace">-- Uses a StateT of some sort. Reruns things every time</font></div><div><font face="courier new, monospace">-- a dependent value changes, and shows the updated output.</font></div>





<div><font face="courier new, monospace">interactive $ do</font></div><div><font face="courier new, monospace">  -- Display a slider. The value changes every time the slider moves.</font></div><div><font face="courier new, monospace">  width <- slider # name "Picture Width" # range 0.1 5</font></div>





<div><font face="courier new, monospace"><br></font></div><div><font face="courier new, monospace">  -- Rerun this event every key press. It can modify the state.</font></div><div><font face="courier new, monospace">  onEvent (keyPress 'c') $ do</font></div>





<div><font face="courier new, monospace">    modifyState doSomething</font></div><div><font face="courier new, monospace"><br></font></div><div><font face="courier new, monospace">  -- Make a diagram using the current state. Rerun every time a </font></div>





<div><font face="courier new, monospace">  -- slider value changes or key press event happens.</font></div><div><font face="courier new, monospace">  diagram <- makeDiagram</font></div><div><font face="courier new, monospace"><br>





</font></div><div><font face="courier new, monospace">  -- Show the diagram. This is what will chance in the IHaskell display.</font></div><div><font face="courier new, monospace">  display diagram</font></div><div><font face="courier new, monospace"><br>





</font></div><div><font face="arial, helvetica, sans-serif">I have Diagrams already working with IHaskell, and interactivity already working in another example (interactive parsers with Parsec, see error messages etc as you type), so all that remains is combining them. I'm hoping to get it working nicely sometime this summer when I have more time, but if you're interested in this approach, feel free to contact me.</font></div>





<div><font face="arial, helvetica, sans-serif"><br></font></div><div><font face="arial, helvetica, sans-serif">[0] IHaskell: <a href="https://github.com/gibiansky/IHaskell" target="_blank">https://github.com/gibiansky/IHaskell</a></font></div>





<div class="gmail_extra"><br><br><div class="gmail_quote"><div><div>On Mon, Apr 7, 2014 at 4:44 PM, Kai Zhang <span dir="ltr"><<a href="mailto:kai@kzhang.org" target="_blank">kai@kzhang.org</a>></span> wrote:<br>
</div></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div><div>


<div dir="ltr"><div class="gmail_default" style="font-size:small">Hi cafe,</div><div class="gmail_default" style="font-size:small"><br></div><div class="gmail_default" style="font-size:small">Is there any active project about creating interactive diagrams, like D3js <a href="http://d3js.org/" target="_blank">http://d3js.org/</a> ? The Diagrams library has already done a good job of making static images. Would it be possible to extend this library to support declaring interactive diagrams and then use JS and HTML as backend to draw them? </div>






<div class="gmail_default" style="font-size:small"><br></div><div class="gmail_default" style="font-size:small">Example: circle 1 $ with & hover .~ (change style)</div><div class="gmail_default" style="font-size:small">






<br></div><div class="gmail_default" style="font-size:small">PS: I don't want a D3js binding.</div></div>
<br></div></div>_______________________________________________<br>
Haskell-Cafe mailing list<br>
<a href="mailto:Haskell-Cafe@haskell.org" target="_blank">Haskell-Cafe@haskell.org</a><br>
<a href="http://www.haskell.org/mailman/listinfo/haskell-cafe" target="_blank">http://www.haskell.org/mailman/listinfo/haskell-cafe</a><br>
<br></blockquote></div><br></div></div>
</blockquote></div><br></div>
</div></div></blockquote></div><br></div>