Demo Site

☆ A M B ☆
24,524 Posts

sottwell Reply #1, 20 years, 1 month ago

I’m finally beginning to get my demo site back to life. I’m starting a new demo, the development of an AJAX front-end to the WebLogin snippet. Actually, the WebLogin snippet is used unchanged, and some nice Unobtrusive Javascript hijacks it to make an AjaxLogin out of it. So far I’m just taking baby steps as I learn the Moofx system, but it should be interesting.

http://www.sottwell.com/ajax-login.html

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

7,075 Posts

davidm Reply #2, 20 years, 1 month ago

I have seen this, very interresting Susan. The only problem I am having with using libraieries other than script.aculo.us is the risk of incompatibilities. Since QuickEdit requires script.aculo.us, if moo.fx breaks it, that’s not good...

I have done an Ajax enhanced login box with script.aculo.us for a client’s website, using effect appear (can’t show it, since it’s not live). I did not touch the Weblogin snippet either, I just placed the code inside a hidden div with a js link, also providing an alternate for those with js disabled. This being said, it’s probably a "quick and dirty" solution, and if I could be sure nothing breaks QuickEdit, I agree that moo.fx is lighter and probably the way to go

.: COO - Commerce Guys - Community Driven Innovation :.

MODx est l'outil id

☆ A M B ☆
24,524 Posts

sottwell Reply #3, 20 years, 1 month ago

It’s not giving me any trouble with QuickEdit. Maybe because I’m using the event-driven loader?

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

7,075 Posts

davidm Reply #4, 20 years, 1 month ago

Nice to know

I am not really familiar with moo.fx yet, I’ll look at the event-loader thing, thanks for the tip !

.: COO - Commerce Guys - Community Driven Innovation :.

MODx est l'outil id

☆ A M B ☆
24,524 Posts

sottwell Reply #5, 20 years, 1 month ago

I took the event-driven loader from http://onlinetools.org/articles/unobtrusivejavascript/chapter4.html

function addEvent(obj, evType, fn){ 
 if (obj.addEventListener){ 
   obj.addEventListener(evType, fn, false); 
   return true; 
 } else if (obj.attachEvent){ 
   var r = obj.attachEvent("on"+evType, fn); 
   return r; 
 } else { 
   return false; 
 } 
}
addEvent(window, 'load', closeLoginBlock);
addEvent(window, 'load', function() { new AjaxLogin('assets/snippets/ajaxlogin/login.php'); }, true);

The file containing this gets loaded right after the moo.fx files get loaded. There is no javascript in the XHTML at all.

<script type="text/javascript" src="assets/js/moo/prototype.lite.js"></script>
<script type="text/javascript" src="assets/js/moo/moo.fx.js"></script>
<script type="text/javascript" src="assets/js/moo/moo.fx.pack.js"></script>
<script type="text/javascript" src="assets/js/md5.js"></script>
<script type="text/javascript" src="assets/snippets/ajaxlogin/login.js"></script>

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

7,075 Posts

davidm Reply #6, 20 years, 1 month ago

Waow this is cool Susan, now I really get the non-obstrusive part

Thanks for sharing !

.: COO - Commerce Guys - Community Driven Innovation :.

MODx est l'outil id