CDE

CDE

pvdz.ee

pvdz.ee

pvdz.ee

The CDE javascript is syntactic sugar that helps creating DHTML easier and faster by creating Custom DOM Elements.

Note: Twitter broke this demo a long time ago. Sorry :)

var cdeAjax, query='CDE'; function getTwitter() {   // ajax waiting   cdeAjax = CDE.div().bgc('black').c('white').p(3).add(     CDE.img('img/twit/ajax-loader_bw.gif', 'Please wait..').vam(),     CDE.txt("  Loading data from Twitter.com ...")   ).centerFade();   // fetch data   CDE.ljs('https://search.twitter.com/search.json?callback=twitterCallback&q='+query); } function twitterCallback(json){   var cde, key, val, outer;   // remove ajax warning   cdeAjax.fadeDel(false,true,true);   cde = CDE.div().id('divTwitter').add(     // add stylesheet for popup     CDE.css(       '#divTwitter { background-color: black; color: white; padding: 5px; }'+ // .bgc('black').c('white').p(5)       '#divTwitter #divTop { text-align: center; }'+ // .tac()       '#divTwitter #divTop input { border: 1px solid white; text-align: center; width: 75px; background-color: black; }'+ // .sb('white').tac().w(75).bgc('black')       '#divTwitter #divContent { text-align: left; }'+ // .tal()       '#divTwitter input { color: white; }'+       '#divTwitter a { color: red; }'+     ''),     // top. whenever you type in the search box the query gets updated     CDE.div().id('divTop').add(       CDE.txt("Twitter search for "),       CDE.inp('text').val(query).on('keyup', function(evt,key){ query = this.value; if(key == 13) { cde.fadeDel(false,true,true); getTwitter(); } }, 'keyboard'), // this updates the search query whenever you type       CDE.txt(" ("),       CDE.lnk("search", function(){ cde.fadeDel(false,true,true); getTwitter(); }),       CDE.txt(", "),       CDE.lnk("close", function(){         cde.fadeDel(false, true, true);       }),       CDE.txt(")")     )   );   // process response   if (json && json.results) {     // create new div for results     outer = CDE.div();          // add all twitter results     for (key in json.results) {       val = json.results[key];       if (val && 'text' in val) {         cde.add(CDE.br());         if (val.from_user) cde.add(CDE.a("@"+val.from_user, 'https://twitter.com/'+val.from_user, true).gc('twit')); // target=blank         cde.add(CDE.txt('  '+val.text).gc('twit'));       }     }          // and ... cue tweets     cde.add(outer).centerFade();   } }