<div id="views" style="height:603px"><div id="cv_" class=" Qg " style="width:375px"><div class="Hi" style="height:603px;width:1125px"><div id="cvss_15658e5d9b812705" class="Pj" style="width:375px"><div class="Rj"></div><div class="sh"><div class="th"><div class="kj"><div class="lj mm"></div></div><div class="jj"><font face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2"><span style="background-color:rgba(255,255,255,0)"><span class="ij">XKCD :: Time Travel Thesis</span><span class="mj"><div class="pj"></div></span></span></font></div></div><div class="Ih"><div class="Tj rh"><div class="Ii"><div class="kh Ji "><font color="#000000" face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2"><span style="background-color:rgba(255,255,255,0)">I</span></font></div><img class="jh zh Ji" src="https://mail.google.com/mail/u/0/photos/action%40ifttt.com?at=AF6bupPwYuSFgi_DVk5tBA1s2mydHCgI8Q&sz=100&pld=1"></div><div class="Xj"><span id="ti_d_15658e5d9b812705" style="white-space:normal;background-color:rgba(255,255,255,0)"><font color="#000000" face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2">12:11 am</font></span></div><div class="Ti Sj Ig"><font color="#000000" size="2"><span style="white-space:normal;background-color:rgba(255,255,255,0)">IFTTT Action</span></font></div><div class="Ni Vj"><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><a href="http://xkcd.com/1716/">http://xkcd.com/1716/</a> IFTTT Put the internet to work for you. Turn off or edit this Recipe IFTTT Recipe: Share your Instagrams to Facebook connects instagram to facebook Recommended for you</span></font></div></div></div><div class="Uj" style="visibility: hidden;"><font size="2"><span style="background-color:rgba(255,255,255,0)"><div class="Tf"></div></span></font></div></div></div><div class="Qj" style="width:375px"><div class="Sg" style="bottom: 0px;"><div class="Kg"><div class="Di"><div class="qj"><div class="th gj"><div class="kj"><div id="cvcstar" class="M j b" tabindex="0"><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><div class="V j lm lj b"></div></span></font></div></div><div class="jj"><font color="#000000" face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2"><span style="background-color:rgba(255,255,255,0)"><br><span class="mj"><div class="pj"></div></span></span></font></div></div><div class="Ih"><div id="cvcmsg_15657dba9e13dbb3" class="rh oj" style="height:70px;margin-bottom:0px;overflow:hidden"><div class="Oh" id="cvcfullmsg_15657dba9e13dbb3"><div class="M j Ri Ei" tabindex="0"><div id="cvcreply_15657dba9e13dbb3" class="M j T b hc qh bj S" tabindex="0"><div class="V j td"></div></div><div class="Qh">I got this from the developer yesterday- will try to implement later today.<br><div class="Ui"><div id="cvcstsnip_15657dba9e13dbb3" class="Mi uh"><div class="Oi"></div></div></div></div></div></div></div><div id="cvcmsg_15657ed5a78f219e" class="rh" style="margin-bottom:11px"><div class="Oh" id="cvcfullmsg_15657ed5a78f219e"><div class="M j Ri Ei " tabindex="0" style="outline:none"><div class="Qh"><br></div></div><div id="cvcmsgbod_15657ed5a78f219e" class="Si"><div class="Fi"><div class="Ki"><div class="Li" style="height:1694px"><div class="Xh" style="height:1694px"><div class="gi hi Wh" dir="ltr"><div dir="ltr"><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">Hi , thanks for your interest in Dante.</span></font><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">Well , Dante doesn't know anything about your backend but it has callbacks that you can use to handle store , uploads and even @ suggest results. In practice you could use a button if you want to submit the changes. sending the editor.getContent().</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">I'm using Dante in production , currently from this branch : <a href="https://github.com/michelson/Dante/pull/136" target="_blank">https://github.com/michelson<wbr>/Dante/pull/136</a> , that branch handles the "auto save" properly.</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">The implementation I have is something like this:</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> editor = new Dante.Editor(</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> {</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> api_key: "my-api-key",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> el: "#editor",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> upload_url: "/uploads",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> debug: #{Rails.env.production? ? false : true},</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> store_url: "/posts.json",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> store_method: "post",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> suggest_url: "/search.json",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> store_success_handler: successStoreHandler,</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> suggest_query_param: "q[term]",</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> suggest_handler: handleSuggest,</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> before_xhr_handler: handle_before_xhr_handler,</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> success_xhr_handler: handle_success_xhr_handler,</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> suggest_resource_handler: handleSuggestResource</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> //extra_tooltip_widgets: [btn1, btn2]</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> }</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> )</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> editor.start()</span></font></div></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">so , when Dante detect changes in content it will post via ajax and try to call the functions added in before_xhr_handler (show loading for example), success_xhr_handler (when the content has been saved)</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">for example, im my function I use a /posts/new endpoint for new records and when the first save occurs I will change the url on location with push state to the created records, and change some options on editor to point on /edit</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> successStoreHandler = function(data){</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> // data is the json data returned by your backend</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> var targetUrl = "/a/" + <a href="http://data.id/" target="_blank">data.id</a></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> if(window.location.pathname != targetUrl){</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> // setup dante defaults again pointing update url</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> editor.store_url = targetUrl;</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> editor.upload_url = targetUrl + "/uploads.json";</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> editor.store_method = "put";</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> var targetUrlForPush = targetUrl + "/edit";</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> window.history.pushState({url: "" + targetUrlForPush}, "edit", targetUrlForPush);</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> }</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"> }</span></font></div></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">I hope you could find this useful</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">cheers</span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div><div><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br></span></font></div></div><div class="gmail_extra"><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)"><br clear="all"></span></font><div><div data-smartmail="gmail_signature"><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">Atte. <br>Miguel Michelson Martinez<br><a href="http://www.artenlinea.com/" target="_blank">www.artenlinea.com</a></span></font></div></div><div style="clear:both"></div></div></div></div></div></div><div style="clear:both"></div><div><div class="M j T b hc sj S" tabindex="0" style="background-color:rgba(255,255,255,0)"><font color="#000000" size="2"><div class="V j ef"></div></font></div></div><div style="clear:both"></div><div class="Ki"><div class="Li" style="height:0px"><div class="Xh" style="height:0px"><div class="gi hi Wh" dir="ltr"><div style="clear:both"></div></div></div></div></div><div style="clear:both"></div></div></div></div></div></div><div class="Hj"></div><div id="cvcfb" class="uj"><div class="vj" style="width:355px"><div class="wj"><div class="M j T b hc xj Ei S" tabindex="0"><div class="V j vd zj"></div><div class="V j Y Dj" style="background-color:rgba(255,255,255,0)"><font color="#000000" face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2">Reply</font></div></div></div><div class="yj" style="background-size: 1px;"></div><div class="wj"><div class="M j T b hc xj Ei S" tabindex="0"><div class="V j sd zj"></div><div class="V j Y Dj" style="background-color:rgba(255,255,255,0)"><font color="#000000" face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2">Forward</font></div></div></div></div></div></div></div></div></div></div><div id="cvss_15655df1aac7d7ed" class="Pj" style="width:375px"><div class="Rj"></div><div class="sh"><div class="th"><div class="kj"><div class="lj mm"></div></div><div class="jj"><font face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2"><span style="background-color:rgba(255,255,255,0)"><span class="ij">What are you working on today?</span><span class="mj"><div class="pj"></div></span></span></font></div></div><div class="Ih"><div class="Tj rh"><div class="Ii"><div class="kh zh Ji"></div><img class="jh Ji Ah " src="https://mail.google.com/mail/u/0/photos/me?at=AF6bupPwYuSFgi_DVk5tBA1s2mydHCgI8Q&sz=100&pld=1"></div><div class="Xj"><span id="ti_d_15655df1aac7d7ed" style="white-space:normal;background-color:rgba(255,255,255,0)"><font color="#000000" face="Helvetica Neue, Helvetica, Arial, sans-serif" size="2">Yesterday</font></span></div><div class="Ti Sj Ig"><font color="#000000" size="2"><span style="white-space:normal;background-color:rgba(255,255,255,0)">me, Phil (3)</span></font></div><div class="Ni Vj"><font color="#000000" size="2"><span style="background-color:rgba(255,255,255,0)">Ok cool. Somehow the admin layout went missing (The sidebar menu thing when you do a search, for example) so I added it back and am going through other pages as well replacing it if it is missing. On</span></font></div></div></div><div class="Uj" style="visibility: hidden;"><font size="2"><span style="background-color:rgba(255,255,255,0)"><div class="Tf"></div></span></font></div></div></div></div><div class="Tg"></div><div class="Hg"></div></div></div><br>On Friday, August 5, 2016, Mark Burns <<a href="mailto:markthedeveloper@gmail.com">markthedeveloper@gmail.com</a>> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">Another guess is that it is not using jquery to post hence not including the csrf token as a param to post and rails is dropping the requests before they hit your app.<br><div class="gmail_quote"><div dir="ltr">On Fri, 5 Aug 2016 at 14:17, Jon Wood <<a href="javascript:_e(%7B%7D,'cvml','jon@ninjagiraffes.co.uk');" target="_blank">jon@ninjagiraffes.co.uk</a>> wrote:<br></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><p dir="ltr">My guess is that yes, it regularly posts as you make changes. You should be able to see if that's the case by watching the logs in log/development.log for requests to your save endpoint.</p>
<br><div class="gmail_quote"><div dir="ltr">On Fri, 5 Aug 2016, 08:12 Jesse Waites, <<a href="javascript:_e(%7B%7D,'cvml','jesse.waites@gmail.com');" target="_blank">jesse.waites@gmail.com</a>> wrote:<br></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr">Hi everyone,<div><br></div><div>This may be a little long, please bear with me.</div><div><br></div><div>I have a dead simple hobby rails app spun up with Devise. I have users, users have many Stories. Those associations are done, easy peasy. I am now trying to integrate a Medium.com style WYSIWYG editor called Dante into a hobby app.</div><div><br></div><div>This is the editor:</div><div><a href="https://github.com/michelson/Dante" target="_blank">https://github.com/michelson/<wbr>Dante</a></div><div><br></div><div>This is the demo in action:</div><div><a href="http://michelson.github.io/Dante/" target="_blank">http://michelson.github.io/<wbr>Dante/</a></div><div><br></div><div>I have managed to get the editor on the page, but for the life of me I cannot seem to figure out how to get it to actually save the content.</div><div><br></div><div>This is a link to my repo:</div><div><a href="https://github.com/piratebroadcast/bckpckrs/" target="_blank">https://github.com/<wbr>piratebroadcast/bckpckrs/</a><br></div><div><br></div><div>The integration of the editor is on this page:</div><div><a href="https://github.com/piratebroadcast/bckpckrs/blob/master/app/views/stories/new.html.erb" target="_blank">https://github.com/<wbr>piratebroadcast/bckpckrs/blob/<wbr>master/app/views/stories/new.<wbr>html.erb</a><br></div><div><br></div><div>The only reference anywhere online I've found is *me* trying to figure out how to integrate this thing almost a year ago:</div><div><a href="http://stackoverflow.com/questions/33656321/integrating-dante-ysiwyg-medium-style-editor-into-a-rails-form" target="_blank">http://stackoverflow.com/<wbr>questions/33656321/<wbr>integrating-dante-ysiwyg-<wbr>medium-style-editor-into-a-<wbr>rails-form</a><br></div><div><br></div><div>There, a developer answers that I should somehow integrate the content from the editor into a simple_form form. I'm not so sure about that, as the editor *Seems* to have an upload URL and can so it itself.</div><div><br></div><div><pre style="font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:13.6px;margin-top:0px;margin-bottom:0px;font-stretch:normal;line-height:1.45;word-wrap:normal;padding:16px;overflow:auto;border-radius:3px;color:rgb(51,51,51);background-color:rgb(247,247,247)"><span><<span style="color:rgb(99,163,92)">script</span> <span style="color:rgb(121,93,163)">type</span>=<span style="color:rgb(24,54,145)"><span>"</span>text/javascript<span>"</span></span>></span>
<span> editor <span style="color:rgb(167,29,93)">=</span> <span style="color:rgb(167,29,93)">new</span> <span style="color:rgb(121,93,163)">Dante.Editor</span>(</span>
<span> {</span>
<span> el<span style="color:rgb(167,29,93)">:</span> <span style="color:rgb(24,54,145)"><span>"</span>#editor<span>"</span></span>,</span>
<span> upload_url<span style="color:rgb(167,29,93)">:</span> <span style="color:rgb(24,54,145)"><span>"</span>/images.json<span>"</span></span>, <span style="color:rgb(150,152,150)">//it expect an url string in response like /your/server/image.jpg or <a href="http://app.com/images/image.jpg" target="_blank">http://app.com/images/image.<wbr>jpg</a></span></span>
<span> store_url<span style="color:rgb(167,29,93)">:</span> <span style="color:rgb(24,54,145)"><span>"</span>/save<span>"</span></span> <span style="color:rgb(150,152,150)">//post to save</span></span>
<span></span>
<span> }</span>
<span> );</span>
<span> <span>editor</span>.<span style="color:rgb(0,134,179)">start</span>()</span>
<span> </<span style="color:rgb(99,163,92)">script</span>></span></pre></div><div><br></div><div><br></div><div>I am completely baffled as to how the system would know when you are done "writing" your story into the editor. Does it POST constantly? </div><div><br></div><div>Any and all tips would really be appreciated.</div><div><br></div><div>Thank you!</div><div><br></div><div><br clear="all"><div><br></div>-- <br><div data-smartmail="gmail_signature"><div dir="ltr"><div><div dir="ltr"><div><div dir="ltr"><div dir="ltr"><div>Jesse Waites</div><div>Web Developer</div><div><a href="http://JesseWaites.com" target="_blank">JesseWaites.com</a></div></div></div></div></div></div></div></div>
</div></div>
______________________________<wbr>_________________<br>
Chat mailing list<br>
<a href="javascript:_e(%7B%7D,'cvml','Chat@lists.lrug.org');" target="_blank">Chat@lists.lrug.org</a><br>
Archives: <a href="http://lists.lrug.org/pipermail/chat-lrug.org" rel="noreferrer" target="_blank">http://lists.lrug.org/<wbr>pipermail/chat-lrug.org</a><br>
Manage your subscription: <a href="http://lists.lrug.org/options.cgi/chat-lrug.org" rel="noreferrer" target="_blank">http://lists.lrug.org/options.<wbr>cgi/chat-lrug.org</a><br>
List info: <a href="http://lists.lrug.org/listinfo.cgi/chat-lrug.org" rel="noreferrer" target="_blank">http://lists.lrug.org/<wbr>listinfo.cgi/chat-lrug.org</a><br>
</blockquote></div>
______________________________<wbr>_________________<br>
Chat mailing list<br>
<a href="javascript:_e(%7B%7D,'cvml','Chat@lists.lrug.org');" target="_blank">Chat@lists.lrug.org</a><br>
Archives: <a href="http://lists.lrug.org/pipermail/chat-lrug.org" rel="noreferrer" target="_blank">http://lists.lrug.org/<wbr>pipermail/chat-lrug.org</a><br>
Manage your subscription: <a href="http://lists.lrug.org/options.cgi/chat-lrug.org" rel="noreferrer" target="_blank">http://lists.lrug.org/options.<wbr>cgi/chat-lrug.org</a><br>
List info: <a href="http://lists.lrug.org/listinfo.cgi/chat-lrug.org" rel="noreferrer" target="_blank">http://lists.lrug.org/<wbr>listinfo.cgi/chat-lrug.org</a><br>
</blockquote></div>
</blockquote><br><br>-- <br>Jesse Waites<br><a href="http://JesseWaites.com">http://JesseWaites.com</a><br>