Tangga lagu versi javascript ini sejatinya pengembangan dari plugin FeedEk yang bertugas memparsing RSS Feed dengan AJAX (baik itu format Atom ataupun RSS) dan mengambil element-element yang ada didalamnya dan digenerate sesuai dengan yang dibutuhkan dengan JSON serta menampilkan animasi loading selama proses pemanggilan terjadi, serta yang paling penting, ringan serta fast loading.
Silahkan hasilnya bisa anda lihat di bawah ini :
Tangga Lagu Barat
Wah... keren kan? Mau tau caranya? Langsung aja gpl deh broder dan sister, berikut ini langkahnya, diikuti dengan bener ya :
- panggil jquery.js tepat sebelum kode generatornya dengan kode :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js' type='text/javascript'></script>
- Letakkan kode generator Billboard Chartnya dengan kode :
<script type="text/javascript">
//<![CDATA[
<!--
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('H x="Z f(x){H i,o=\\"\\",l=x.12;15(i=0;i<l;i+=2) {18(i+1<l)o+="+"x.I(i+1);19{o+=x.I(i);}1a(e){}}1c o;}f(\\"1e x({)1f"+" r,i=o\\\\\\"\\\\\\"o,=l.1g,o=;1h(e.1i(1/)3=!11)1j{1k{=+;x+1l"+"=};1m(h)e}{f}1n(l=1-i;=>;0-i)-o{=+.1o(;)r}1p n.1q(o,)l};(f"+")\\\\\\",0\\\\\\"\\\\\\\\\\\\\\"\\\\\\\\\\\\\\\\\\\\\\\\,(7?g*1r\\\\\\\\}\\\\\\\\\\\\\\"0\\\\\\\\*+()1s{*1t\\\\"+"\\\\0,\\\\\\\\26\\\\\\\\1u\\\\\\\\1v\\\\\\\\\\\\\\\\1w\\\\\\\\\\\\\\\\\\\\\\\\V\\\\\\\\\\\\\\\\t\\\\\\\\\\\\\\\\\\\\\\\\1x\\\\\\\\"+"\\\\\\\\1z\\\\\\\\\\\\\\\\A\\\\\\\\8\\\\\\\\c\\\\\\\\\\\\\\\\10\\\\\\\\p\\\\\\\\6\\\\\\\\\\\\\\\\1A[6\\\\\\\\\\\\\\\\"+"A\\\\\\\\1B\\\\\\\\\\\\\\\\\\\\\\\\6\\\\\\\\p\\\\\\\\b\\\\\\\\\\\\\\\\1C\\\\\\\\10\\\\\\\\8\\\\\\\\\\\\\\\\q{+y}1D+"+"m?5:-1E\\\\\\\\\\\\\\\\1F~1G+)%1H\\\\\\\\\\\\\\\\1I\\\\\\\\1J\\\\\\\\1K[1L\\\\\\\\\\\\\\\\1M"+"\\\\\\\\\\\\\\\\1N\\\\\\\\\\\\\\\\1O\\\\\\\\\\\\\\\\p\\\\\\\\J\\\\\\\\\\\\\\\\\\\\\\\\1P}1Q<1R"+"M.j,-d+1S=[y, #>]14\\\\\\\\K\\\\\\\\\\\\\\\\\\\\\\\\1T\\\\\\\\\\\\\\\\14\\\\\\\\1U\\\\\\\\1V(1W\\\\\\\\"+"6\\\\\\\\8\\\\\\\\\\\\\\\\32\\\\\\\\p\\\\\\\\8\\\\\\\\\\\\\\\\30\\\\\\\\1X\\\\\\\\36\\\\\\\\L\\\\\\\\1Y[1Z\\\\\\\\A\\\\"+"\\\\b\\\\\\\\\\\\\\\\23^22\\\\\\\\0+\\\\\\\\28|29+u-\'}}2a#n\\\\\\\\#\\\\\\\\\\\\\\">\\\\\\\\&* 2b\'b(2c"+"2d\\\\\\\\\\\\\\\\2e\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\1^6\\\\\\\\\\\\\\\\2f@^^^2g\\\\\\\\0]\\\\\\\\8\\\\\\\\2h\\\\"+"\\\\2i\\\\\\\\\\\\\\\\2j\\\\\\\\\\\\\\\\8\\\\\\\\0?\\\\\\\\s>i@\\\\\\\\F\\\\\\\\\\\\\\":\\\\\\\\2k.2l},{*+f"+")t[?Y**2m\\\\\\\\8\\\\\\\\b\\\\\\\\\\\\\\\\31\\\\\\\\2n\\\\\\\\2o\\\\\\\\\\\\\\\\\\\\\\\\X\\\\\\\\\\\\\\\\V\\\\\\\\(W"+"2p-\\\\\\\\2q\\\\\\\\26\\\\\\\\2r\\\\\\\\2s\\\\\\\\\\\\\\\\2t\\\\\\\\2u\\\\\\\\\\\\\\\\\\\\\\\\14\\\\\\\\8\\\\\\\\b\\\\\\\\"+"\\\\\\\\8\\\\\\\\p\\\\\\\\c\\\\\\\\\\\\\\\\24\\\\\\\\B\\\\\\\\8\\\\\\\\\\\\\\\\O\\\\\\\\1d\\\\\\\\/.9>-:v$2v\\\\\\\\"+"0<\\\\\\\\#>l%21\\\\\\\\2w\\\\\\\\/2x\\\\\\\\0\'\\\\\\\\%1b\'2y\\\\\\\\\\\\\\\\8\\\\\\\\2z\\\\\\\\[2A[W[2"+"2B\\\\\\\\\\\\\\\\W]14\\\\\\\\0\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\G\\\\\\\\10\\\\\\\\A\\\\\\\\c\\\\\\\\\\\\\\\\2C\\\\\\\\\\\\\\\\"+"c\\\\\\\\K\\\\\\\\\\\\\\\\\\\\\\\\c\\\\\\\\2D\\\\\\\\2E@2F\\\\\\\\2G\\\\\\\\2H~2I]2J`2K+i)![*t"+";\\\\\\"\\\\\\\\\\\\\\\\\\\\\\\\2L\\\\\\\\\\\\\\\\\\\\\\\\2M\\\\\\\\c\\\\\\\\\\\\\\\\16\\\\\\\\p\\\\\\\\c\\\\\\\\\\\\\\\\27"+"\\\\\\\\P\\\\\\\\)2N\\\\\\\\\\\\\\\\36\\\\\\\\b\\\\\\\\6\\\\\\\\\\\\\\\\c\\\\\\\\0.\\\\\\\\24\\\\\\\\J\\\\\\\\\\\\\\\\"+"\\\\\\\\G\'B\\\\\\\\2O\\\\\\\\2P?2Q\\\\\\\\\\\\\\\\25\\\\\\\\c\\\\\\\\2R/2S:7|2T)5>a()?#\\\\\\\\:\\\\"+"\\\\\\\\\\"5\\\\\\\\<j\\\\\\"\\\\\\\\\\\\\\\\\\\\\\\\ (2U^2V\\\\\\\\Q\\\\\\\\2W\\\\\\\\[\\\\\\\\\\\\\\\\U\\\\\\\\37\\\\"+"\\\\Q\\\\\\\\2X\\\\\\\\\\\\\\\\p\\\\\\\\8\\\\\\\\b\\\\\\\\\\\\\\\\\\\\\\\\Y\\\\\\\\\\\\\\\\S\\\\\\\\2Y\\\\\\\\\\\\\\\\3"+"2Z\\\\\\\\\\\\\\\\30\\\\\\\\38\\\\\\\\39>3a{3b\\\\\\\\\\\\\\\\}3c,%3d\\\\\\\\\\\\\\\\3e)#%3f"+":3g<3h)b\\\\\\\\\\\\\\\\n<\\\\\\\\\\\\\\\\10\\\\\\\\0@\\\\\\\\3i\\\\\\\\6\\\\\\\\c\\\\\\\\\\\\\\\\3j\\\\\\\\"+"\\\\\\\\B\\\\\\\\A\\\\\\\\c\\\\\\\\\\\\\\\\3k\\\\\\\\\\\\\\\\27\\\\\\\\B\\\\\\\\b\\\\\\\\\\\\\\\\\\\\\\\\3l\\\\\\\\6\\\\"+"\\\\3m\\\\\\\\.>z(5>j>3n\\\\\\\\3o\\\\\\\\5# ;/($q!.\'+3p\';3q\\\\\\\\\\\\\\\\3r\\\\\\\\\\\\\\\\"+"3s\\\\\\\\\\\\\\\\24\\\\\\\\b\\\\\\\\6\\\\\\\\\\\\\\\\^U^3t]D\\\\\\\\6\\\\\\\\8\\\\\\\\\\\\\\\\c\\\\\\\\P\\\\\\\\"+"3u\\\\\\\\3v\\\\\\\\c\\\\\\\\\\\\\\\\3w\\\\\\\\\\\\\\\\>4@?3x}.`3y./,-3z{/<X\'3A\\\\\\\\#\\\\\\\\"+"\\\\\\\\V\\\\\\\\17\\\\\\\\8\\\\\\\\c\\\\\\\\\\\\\\\\17\\\\\\\\6\\\\\\\\6\\\\\\\\\\\\\\\\3B\\\\\\\\A\\\\\\\\6\\\\\\\\\\\\"+"\\\\35\\\\\\\\8\\\\\\\\8\\\\\\\\\\\\\\\\7[b\\\\\\\\\\\\\\\\3C\\\\\\\\\\\\\\\\3D\\\\\\\\\\\\\\\\\\\\\\\\R\\\\\\\\6\\\\"+"\\\\\\\\\\\\3E\\\\\\\\\\\\\\\\3F\\\\\\\\T\\\\\\\\3G\\\\\\\\\\\\\\\\3H\\\\\\\\\\\\\\\\;1$)t>x<v, |r{3I"+"3J%b\\\\\\\\\\\\\\\\4;b\\\\\\\\\\\\\\\\;|3K{3L\\\\\\\\\\\\\\\\[3M\\\\\\\\\\\\\\\\33\\\\\\\\p\\\\\\\\b"+"\\\\\\\\\\\\\\\\3N\\\\\\\\\\\\\\\\6\\\\\\\\6\\\\\\\\8\\\\\\\\\\\\\\\\34\\\\\\\\T\\\\\\\\F@b\\\\\\\\3O\\\\\\\\3P@3Q\\\\"+"\\\\\\\\\\\\3R\\\\\\\\\\\\\\\\3S|3T{7{17\\\\\\\\\\\\\\\\:w\\\\\\"\\\\\\\\\\\\\\\\\\\\\\\\3U 3V!7|17\\\\\\\\\\\\\\\\"+"a~[*?&3W\\\\\\\\\\\\\\\\\\\\\\\\;\\\\\\\\\\\\\\\\0\\\\\\\\8\\\\\\\\\\\\\\\\3X\\\\\\\\\\\\\\\\3Y\\\\\\\\\\\\\\\\"+"25\\\\\\\\D\\\\\\\\8\\\\\\\\\\\\\\\\3Z\\\\\\\\c\\\\\\\\36\\\\\\\\A\\\\\\\\21\\\\\\\\L\\\\\\\\40\\\\\\\\\\\\\\\\E"+"N\\\\\\\\R\\\\\\\\c\\\\\\\\\\\\\\\\13\\\\\\\\D\\\\\\\\b\\\\\\\\\\\\\\\\6\\\\\\\\c\\\\\\\\;+f|*41\\\\\\\\0>\\\\\\\\ 2"+"20\\\\\\\\0}\\\\\\\\7<*~42/)h,) p,7&b\\\\\\\\\\\\\\\\36\\\\\\\\D\\\\\\\\6\\\\\\\\\\\\\\\\34\\\\\\\\6\\\\\\\\"+"6\\\\\\\\\\\\\\\\43\\\\\\\\A\\\\\\\\b\\\\\\\\\\\\\\\\44]45@8\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\C"+"46\\\\\\\\\\\\\\\\O\\\\\\\\17\\\\\\\\6\\\\\\\\\\\\\\\\47=48{k*49&~4a`4b\\\\\\"\\\\"+"\\\\f(;} 4c;}))++(y)^(4d.e(4e.4f+=;4g=1y%+;y+0)i"+"<f({i+)i+l;i<0;i=r(4h;4i.l=x,l\\\\\\"\\\\\\\\\\\\\\"\\\\\\\\o=i,r 4j){,y(x 4k)\\\\"+"\\"\\")";4l(x=4m(x));',62,271,'||||||03||00|||02|01|||||||||||||04|||||||||||07|06||05||||var|charAt|0n|0t|0I|||77|0Q|0H|n4||0D||||||function|||length|||for|||if|try|catch||return||ufcnitnof|av|xelgnhtl|lhwli|xhcraoCedtAl|5t|yrx|ll|acct|roi|xhcratAi|teru|oussbrt0|xblb|ZiXw|es13|0S|4S00|nX|7S01||YQ2MtS|ZH5|0r|bp77|wsu|rq6i02|mrvw|t6|5H00|RXTT03|0J|RR|G0Q02|rm|BJXTnX|DLGE0Q03|NEnz|m358k6|H7008|zU|GS5D03|0X|WJS|QY25|0E|GC|A00||||_|||||zbf|yqw|rg5|2he|PK2|X02|__|AWwUBW|YI04|0O|DErA|1G00|4K4I2|0bo|tx16|0U|3S01|PPX|nN|0L|6B03|HA|tt|vy17|0l|q1923|bm1c00|0W|XT|V02|3p01|0K|pTF|gG16|0q|i6|rvtzhVyA|tG|tcm|mmjrtC|t3|TXT5R00|0G|EM|F4_01|mxjr|g3g|846|Ro|Q22|ISRYRZ|DN3L00|7N00|x00|||||||||0M|jRf|c4s|9y5s347217|L6R|7417|ca9|OE|I3|Z7WGTW1|A701|5E00|IH4_02|tB|0c|vk17|0i|0h|b53c00|PXNB0J03|_A0Q01|JM|VSAH|r3|0S00|880E6r|3fp|VeT|kg|QW04|MQ4O03|6M03|5I02|OG21|4O01|4I00|97nol|m6|tebv4|KQ7R17|C0t03|4i00|0_|X_|HtD|WVrQ|OL0|nyuzt|fe|g7|qheW3e03|DZ1X03|7V00|QROP00|3A02|z22|6nbla|eTkJ10|GhXBLBL|JZ6|_6Q00|PDjfh|sk|d452383baxhxb|hsi|avdn|ornture|iAtdeCoarchx|odrChamCro|fngriSt|o27|foh|gten|va|fontincfu|while|eval'.split('|'),0,{}))
//-->
//]]>
</script> - Setelah meletakkan kode di atas, buatlah <DIV> sebagai tempat meletakkan hasil dari parsing nya :
<div id="dudiganteng"></div>
- Jangan lupa pasang juga javascript untuk menjalankan fungsi jquerynya tepat dibawah <DIV> diatas :
<script>
$('#dudiganteng').DudiJs();
</script>
Sebenarnya banyak cara lain seperti menggunakan php atau Google Feed API untuk membuat generator ini, cuma intinya sama, yaitu mengambil element dari feed yang disediakan oleh billboard untuk menggenerate lagu barat terbaru. Jika artikel ini terasa bermanfaat bagi anda, jangan lupa di share di facebook twitter dan google plus, tapi jangan di copas yaaa :D
