Two version before and after the top step component

/*
* Digglist
* by SUNHW 2014-8-14
*/
;
(function () {
var map = {
Ding: {type: ' Up ', Text: ' Top ', cls: ' Digglisted digglistuped '},
Cai: {type: ' Step ', Text: ' Stepped ', cls: ' Digglisted diggliststeped '}
};
var $list = t.get (' _digglist ');
if (! $list) {
Return
}
Top-Stepping animation
function animate (text) {
var anirun = t.get (' Anirun ');
anirun.innerhtml = text;
F.tween (T.get (' Anirun '), F.math.tweener.simple, 0.6, {top: -40}, Function () {
T.dom.remove (Anirun);
} );
}

Top-stepping processing function
function Handler ($target) {
var type = t.dom.getattr ($target, ' class '), conf = map[type];
if (!conf) {return;}
T.dom.inserthtml ($target. parentnode, ' beforeend ', ' <div id= ' anirun ' class= ' animation ' ></div> ');
SendRequest (type, function (JSON) {
(Type = = ' ding ')? Animate (' +1 '): Animate ('-1 ');
T.dom.hide ($target);
var $txt = t.query (' B.txt ', $target. parentnode) [0];
$txt. InnerHTML = Conf.text;
T.dom.show ($txt);
T.dom.addclass ($target. Parentnode.parentnode, CONF.CLS);
Updatestat (Conf.type);
} );
}

Update Top steps
function Updatestat (type) {
var $dNum = T.query ('. sm-ding ', $list) [0], Dnum = parseint ($dNum. InnerHTML) | | 0;
var $cNum = T.query ('. Sm-cai ', $list) [0], CNum = parseint ($cNum. InnerHTML) | | 0;
var $pBar = T.query ('. Bar ', $list) [0];
if (type = = ' up ') {
dnum++;
} else {
cnum++;
}
$dNum. InnerHTML = Dnum;
$cNum. InnerHTML = CNum;
Update percentage
T.dom.setstyle ($pBar, ' width ', (Dnum * +/(Dnum + cNum)) + '% ');
}

Detecting User Login states
function Checklogin (callback) {
if (! F.tool.user.userid) {
F.tool.ajaxlogin.panel ();
} else {
Callback && callback ();
}
}

Send Top Request
function SendRequest (type, callback) {
if (!map[type]) {return;}
var url = f.config.api + '/ajax/digg/' + map[type].type + '/' + t.dom.getattr ($list, ' data-videoid ');
F.get (URL, function (JSON) {
if (json.status = = 403) {
F.tool.ajaxlogin.panel ();
} else if (Json.status = = 200) {
Callback && callback (JSON);
}
} );
}

function Binddiggevent () {
var $target = null;
T.on ($list, ' click ', function (EV) {
EV = T.event.get (EV);
$target = Ev.target;
if ($target. tagName = = ' I ') {
Checklogin (function () {
Handler ($target. parentnode);
} );
}
} );
}

T.dom.ready (function () {
Binddiggevent ();
} );
})();

/*
* Digglist
* by SUNHW 2014-8-14
*/
T.dom.ready (function () {
(function () {
var userid = F.user.userid | | F.cookie.get (' userid ');
var acttype = null;

function handler (dbtns, Cbtns, vid, Dnum, cNum) {
T.each (Dbtns, function (item, index) {
T.on (item, ' Click ', Function (e) {
T.event.stop (T.event.get (e));
Acttype = ' up ';
Bind (item, Acttype);
} );
} );
T.each (Cbtns, function (item, index) {
T.on (item, ' Click ', Function (e) {
T.event.stop (T.event.get (e));
Acttype = ' Step ';
Bind (item, Acttype);
} );
} );
function bind (ele, type) {
if (!userid) {
F.tool.ajaxlogin.panel ();
T.observer.send (F.eventcenter.err_no_login);
} else {
var parentnode = Ele.parentNode.parentNode;
if (T.dom.hasclass (parentnode, ' digglisted ')) {
Return
}
var url = f.config.api + '/ajax/digg/' + type + '/' + vid;
var upnum = 0, downnum = 0;
T.dom.inserthtml (Ele.parentnode, ' beforeend ', ' <div id= ' anirun ' class= ' animation ' ></div> ');
F.get (URL, function (resp) {
var json = T.json.parse (RESP);
if (!json | | Json.status! = 200) {
Return
}
var data = Json.data;

function animate (text) {
var num = t.get (' Anirun ');
num.innerhtml = text;
F.tween (T.get (' Anirun '), f.math.tweener.simple, 0.5, {top: -40}, Function () {
T.dom.remove (num);
} );
}

function Upactionfun () {
T.dom.addclass (parentnode, ' digglisted digglistuped ');
Animate (' +1 ');
var elenext = T.dom.next (ele);
if (Elenext) {
elenext.innerhtml = ' already top ';
}
T.each (Cbtns, function (item) {
item.innerhtml = ' tread ';
} );
T.each (Dnum, function (item) {
Upnum = parseint (item.innerhtml, 10);
item.innerhtml = Upnum + 1;
Upnum = Upnum + 1;
} );
Downnum = parseint (T.query ('. Sm-cai ') [0].innerhtml, 10);
T.dom.setstyle (T.query ('. Probar. bar-ding ') [0], ' width ', parseint (Upnum/(Upnum + downnum), 10) + '% ');
T.dom.setstyle (T.query ('. Probar. Bar-cai ') [0], ' width ', parseint ([+] (Upnum/(Upnum + downnum)), 10) + ' %‘ );
}

function Downactionfun () {
T.dom.addclass (parentnode, ' digglisted diggliststeped ');
Animate ('-1 ');
var elenext = T.dom.next (ele);
if (Elenext) {
elenext.innerhtml = ' stepped on ';
}
T.each (Dbtns, function (item) {
item.innerhtml = ' top ';
} );
T.each (CNum, function (item) {
Downnum = parseint (item.innerhtml, 10);
item.innerhtml = Downnum + 1;
Downnum = Downnum + 1;
} );
Upnum = parseint (T.query ('. sm-ding ') [0].innerhtml, 10);
T.dom.setstyle (T.query ('. Probar. Bar-cai ') [0], ' width ', parseint (Downnum/(Upnum + downnum), 10) + '% ');
T.dom.setstyle (T.query ('. Probar. bar-ding ') [0], ' width ', parseint ([+] (Downnum/(Upnum + downnum)), 10) + '% ');
}

if (type = = = ' Up ' && ele.tagname = = = ' A ') {//Click the top button
Upactionfun ();
} else if (type = = = ' Step ' && ele.tagname = = = ' A ') {//Click the Step button
Downactionfun ();
}
} );
}
}
}

var diggtool = t.query (' div.tool-digglist ');
T.each (Diggtool, function (item) {
var dingbtn = t.query (Item.getattribute (' data-dingbtn '), item);
var caibtn = t.query (Item.getattribute (' data-caibtn '), item);
var dingnum = t.query (Item.getattribute (' Data-dingnumber '), item);
var cainum = t.query (Item.getattribute (' Data-cainumber '), item);
var videoid = t.getattr (item, ' Data-videoid ');
if (!dingbtn | |!caibtn | |!videoid) {
Return
}
Handler (DINGBTN, CAIBTN, VideoID, Dingnum, cainum);
} );
})();
} );

Two version before and after the top step component