Skip to content

Commit 0238cbb

Browse files
ilyaeverexilyaeverex
committed
merge formater from widget + some fixes
1 parent f841983 commit 0238cbb

File tree

2 files changed

+154
-45
lines changed

2 files changed

+154
-45
lines changed

‎css/ethplorer.css

+12-4
Original file line numberDiff line numberDiff line change
@@ -1376,10 +1376,8 @@ a.token-update {
13761376
100%{transform:rotate(360deg)}
13771377
}
13781378
.historical-price {
1379-
/*font-size: 0.7em;*/
1380-
font-size: 0.8em;
1381-
/*opacity: 0.5;*/
1382-
color: rgba(255, 255, 255, 0.6);
1379+
font-size: 0.7em;
1380+
color: rgba(255, 255, 255, 0.5);
13831381
}
13841382
/* Scrollable */
13851383
.scrollable{
@@ -1422,3 +1420,13 @@ a.token-update {
14221420
margin-bottom: 0;
14231421
}
14241422

1423+
.diff-span {
1424+
padding-right: 10px;
1425+
color: rgba(255, 255, 255, 0.6);
1426+
}
1427+
.diff-span span {
1428+
padding-left: 4px;
1429+
}
1430+
.diff-zero{
1431+
color: rgba(255, 255, 255, 0.6);
1432+
}

‎js/ethplorer.js

+142-41
Original file line numberDiff line numberDiff line change
@@ -368,6 +368,23 @@ Ethplorer = {
368368
}
369369
$('#transfer-operation-value').html(value);
370370

371+
var usdPrice = '';
372+
if(op.usdPrice && Ethplorer.showHistoricalPrice && valFloat){
373+
var diff = Ethplorer.Utils.round(Ethplorer.Utils.pdiff(op.usdPrice, oToken.price.rate), 2);
374+
var hint = 'estimated at tx date';
375+
376+
var cls = getDiffClass(diff);
377+
if(diff > 0){
378+
diff = '+' + Ethplorer.Utils.formatNum(diff, true, 2, true, true);;
379+
}
380+
var historyPrice = Ethplorer.Utils.formatNum(op.usdPrice * valFloat, true, 2, true, true);
381+
382+
usdPrice = '<span title="' + hint + '">~$ ' + historyPrice +
383+
'&nbsp<span class="' + cls + '">' + diff + '%</span></span>'
384+
}
385+
$('#historical-price').html(usdPrice);
386+
387+
371388
titleAdd += oOperation.type;
372389
$('.token-operation-type').text(oOperation['type']);
373390
Ethplorer.fillValues('transfer', txData, ['operation', 'operation.from', 'operation.to']);
@@ -609,6 +626,21 @@ Ethplorer = {
609626
value = value + '<br><span class="tx-value-price">($ ' + Ethplorer.Utils.formatNum(oToken.price.rate * valFloat, true, 2, true, true) + ')</span>';
610627
}
611628
$('#transfer-operation-value').html(value);
629+
var usdPrice = '';
630+
if(oOperation.usdPrice && Ethplorer.showHistoricalPrice && valFloat){
631+
var diff = Ethplorer.Utils.round(Ethplorer.Utils.pdiff(oOperation.usdPrice, oToken.price.rate), 2);
632+
var hint = 'estimated at tx date';
633+
634+
var cls = getDiffClass(diff);
635+
if(diff > 0){
636+
diff = '+' + Ethplorer.Utils.formatNum(diff, true, 2, true, true);;
637+
}
638+
var historyPrice = Ethplorer.Utils.formatNum(oOperation.usdPrice * valFloat, true, 2, true, true);
639+
640+
usdPrice = '<span title="' + hint + '">~$ ' + historyPrice +
641+
'&nbsp<span class="' + cls + '">(' + diff + '%)</span></span>'
642+
}
643+
$('#historical-price').html(usdPrice);
612644
}
613645

614646
if(oTx.blockNumber){
@@ -648,20 +680,6 @@ Ethplorer = {
648680
$('.tx-details-close').hide();
649681
}
650682

651-
var usdPrice = '';
652-
if(oTx.usdPrice && Ethplorer.showHistoricalPrice && valFloat){
653-
var diff = Ethplorer.Utils.round(Ethplorer.Utils.pdiff(oTx.usdPrice, oToken.price.rate), 2);
654-
var hint = 'estimated at tx date';
655-
656-
var cls = (diff > 0 ? 'diff-up' : 'diff-down')
657-
if(diff > 0){
658-
diff = '+' + Ethplorer.Utils.round(diff, 2);
659-
}
660-
var historyPrice = Ethplorer.Utils.formatNum(oTx.usdPrice * valFloat, true, 2, true, true);
661-
662-
usdPrice = '<span title="' + hint + '">~$ ' + historyPrice +
663-
'&nbsp<span class="' + cls + '">(' + diff + '%)</span></span>'
664-
}
665683
document.title = 'Ethplorer';
666684
document.title += (': ' + (titleAdd ? (titleAdd + ' -') : ''));
667685
document.title += (' hash ' + txHash);
@@ -680,7 +698,6 @@ Ethplorer = {
680698
}else if(multiop){
681699
Ethplorer.showOpDetails(oTx, txData.operations[0]);
682700
}
683-
$('#historical-price').html(usdPrice);
684701

685702
Ethplorer.Events.fire('ethp_showTxDetails_finish', txData);
686703
Ethplorer.Utils.hideEmptyFields();
@@ -922,7 +939,7 @@ Ethplorer = {
922939
var price = balances[k].balanceUSD;
923940
value += ('<br><div class="balances-price" title="$' + price + '">$ ' + Ethplorer.Utils.formatNum(price, true, 2, true) + ' ');
924941
if(rate.diff){
925-
var cls = rate.diff > 0 ? 'diff-up' : 'diff-down';
942+
var cls = getDiffClass(rate.diff);
926943
var hint = 'Updated at ' + Ethplorer.Utils.ts2date(rate.ts, true);
927944
if(rate.diff > 0){
928945
rate.diff = '+' + rate.diff;
@@ -955,7 +972,7 @@ Ethplorer = {
955972
if(totalPrice){
956973
var value = '~ $ ' + Ethplorer.Utils.formatNum(totalPrice, true, 2, true, true);
957974
if(totalDiff){
958-
var cls = totalDiff > 0 ? 'diff-up' : 'diff-down';
975+
var cls = getDiffClass(totalDiff);
959976
if(totalDiff > 0){
960977
totalDiff = '+' + totalDiff;
961978
}
@@ -1143,12 +1160,16 @@ Ethplorer = {
11431160
var usdval = Ethplorer.Utils.formatNum(Math.abs(Ethplorer.Utils.round(pf * txToken.price.rate, 2)), true, 2, true);
11441161
value = value + '<br><span class="transfer-usd" title="now">$ ' + usdval + '</span>';
11451162
}
1163+
// Fill the tx.usdPrice if tx age less 10 minutes, because of delay price update scripts
1164+
if (!tx.usdPrice && txToken.price.rate && ((new Date().getTime()/1000 - tx.timestamp ) / 60 < 10)){
1165+
tx.usdPrice = txToken.price.rate;
1166+
}
11461167
if (tx.usdPrice && Ethplorer.showHistoricalPrice){
11471168

11481169
var diff = Ethplorer.Utils.round(Ethplorer.Utils.pdiff(tx.usdPrice, txToken.price.rate), 2);
11491170
var hint = 'estimated at tx date';
11501171

1151-
var cls = (diff > 0 ? 'diff-up' : 'diff-down')
1172+
var cls = getDiffClass(diff);
11521173
if(diff > 0){
11531174
diff = '+' + Ethplorer.Utils.round(diff, 2);
11541175
}
@@ -1646,31 +1667,21 @@ Ethplorer = {
16461667
case 'price':
16471668
if(value && value.rate){
16481669
var rate = value;
1649-
value = '$ ' + Ethplorer.Utils.formatNum(rate.rate, true, 2, true);
1650-
if(rate.diff){
1651-
var cls = rate.diff > 0 ? 'diff-up' : 'diff-down';
1652-
var hint = 'Updated at ' + Ethplorer.Utils.ts2date(rate.ts, true) + ' in 24 hour period';
1653-
if(rate.diff > 0){
1654-
rate.diff = '+' + rate.diff;
1655-
}
1656-
value = value + ' <span class="' + cls + '" title="' + hint + '">(24h ' + Ethplorer.Utils.round(rate.diff, 2) + '%)</span>'
1670+
var hint = 'Updated at ' + Ethplorer.Utils.ts2date(rate.ts, true);
1671+
1672+
value = '<span title="' + hint + '">$ ' + Ethplorer.Utils.formatNum(rate.rate, true, 2, true) + '</span><br>';
1673+
if('undefined' !== typeof rate.diff){
1674+
value = value + '<span class="diff-span">24h<span class="' + getDiffClass(rate.diff) + '">'
1675+
+ getDiffString(rate.diff) +'</span></span>'
16571676
}
1658-
if(rate.diff7d){
1659-
var cls = rate.diff7d > 0 ? 'diff-up' : 'diff-down';
1660-
var hint = 'Updated at ' + Ethplorer.Utils.ts2date(rate.ts, true) + ' in 7 days period';
1661-
if(rate.diff7d > 0){
1662-
rate.diff7d = '+' + rate.diff7d;
1663-
}
1664-
value = value + ' <span class="' + cls + '" title="' + hint + '">(7d ' + Ethplorer.Utils.round(rate.diff7d, 2) + '%)</span>'
1677+
if('undefined' !== typeof rate.diff7d){
1678+
value = value + '<span class="diff-span">7d<span class="' + getDiffClass(rate.diff7d) + '">'
1679+
+ getDiffString(rate.diff7d) +'</span></span>'
16651680
}
1666-
if(rate.diff && rate.diff7d){
1667-
var cls = rate.diff7d > 0 ? 'diff-up' : 'diff-down';
1668-
var hint = 'Updated at ' + Ethplorer.Utils.ts2date(rate.ts, true) + ' in 30 days period';
1669-
var diff30d = 123456.789;
1670-
if(rate.diff7d > 0){
1671-
diff30d = '+' + diff30d;
1672-
}
1673-
value = value + ' <span class="' + cls + '" title="' + hint + '">(30d ' + Ethplorer.Utils.round(diff30d, 2) + '%)</span>'
1681+
if('undefined' !== typeof rate.diff && 'undefined' !== typeof rate.diff7d || 'undefined' !== typeof rate.diff30d){
1682+
var diff30d = rate.diff30d || 123456.789;
1683+
value = value + '<span class="diff-span">30d<span class="' + getDiffClass(diff30d) + '">'
1684+
+ getDiffString(diff30d) +'</span></span>'
16741685
}
16751686
}else{
16761687
value = '';
@@ -1954,6 +1965,77 @@ Ethplorer = {
19541965
}
19551966
return res;
19561967
},
1968+
1969+
/**
1970+
* Number formatter (separates thousands with comma, adds zeroes to decimal part).
1971+
*
1972+
* @param {int} num
1973+
* @param {bool} withDecimals
1974+
* @param {int} decimals
1975+
* @param {bool} cutZeroes
1976+
* @returns {string}
1977+
*/
1978+
formatNumWidget: function(num, withDecimals /* = false */, decimals /* = 2 */, cutZeroes /* = false */, withPostfix /* = false */, numLimitPostfix /* = 999999 */){
1979+
var postfix = '';
1980+
if(withPostfix){
1981+
if(!numLimitPostfix) numLimitPostfix = 999999;
1982+
if(num > 999 && num <= numLimitPostfix){
1983+
num = num / 1000;
1984+
postfix = ' K';
1985+
}else if(num > numLimitPostfix){
1986+
num = num / 1000000;
1987+
postfix = ' M';
1988+
}
1989+
}
1990+
function math(command, val, decimals){
1991+
var k = Math.pow(10, decimals ? parseInt(decimals) : 0);
1992+
return Math[command](val * k) / k;
1993+
}
1994+
function padZero(s, len){
1995+
while(s.length < len) s += '0';
1996+
return s;
1997+
}
1998+
if(('object' === typeof(num)) && ('undefined' !== typeof(num.c))){
1999+
num = parseFloat(Ethplorer.Utils.toBig(num).toString());
2000+
}
2001+
cutZeroes = !!cutZeroes;
2002+
withDecimals = !!withDecimals;
2003+
// decimals = decimals || (cutZeroes ? 0 : 2);
2004+
2005+
if((num.toString().indexOf("e+") > 0)){
2006+
return num.toString();
2007+
}
2008+
2009+
if((num.toString().indexOf("e-") > 0) && withDecimals){
2010+
var parts = num.toString().split("e-");
2011+
var res = parts[0].replace('.', '');
2012+
for(var i=1; i<parseInt(parts[1]); i++){
2013+
res = '0' + res;
2014+
}
2015+
return '0.' + res;
2016+
}
2017+
2018+
if(withDecimals){
2019+
num = math('round', num, decimals);
2020+
}
2021+
var parts = num.toString().split('.');
2022+
var res = parts[0].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
2023+
var zeroCount = cutZeroes ? 0 : decimals;
2024+
if(withDecimals && decimals){
2025+
if(parts.length > 1){
2026+
res += '.';
2027+
var tail = parts[1].substring(0, decimals);
2028+
if(tail.length < zeroCount){
2029+
tail = padZero(tail, zeroCount);
2030+
}
2031+
res += tail;
2032+
}else{
2033+
res += padZero('.', parseInt(zeroCount) + 1);
2034+
}
2035+
}
2036+
res = res.replace(/\.$/, '');
2037+
return res + postfix;
2038+
},
19572039
/**
19582040
* Parses URL path
19592041
* @returns {string}
@@ -2092,6 +2174,9 @@ Ethplorer = {
20922174
},
20932175
toBig: function(obj){
20942176
var res = new BigNumber(0);
2177+
if (obj && 'string' === typeof(obj)) {
2178+
obj = obj.replace(/,/g, '');
2179+
}
20952180
if(obj && 'undefined' !== typeof(obj.c)){
20962181
res.c = obj.c;
20972182
res.e = obj.e;
@@ -2195,3 +2280,19 @@ Ethplorer = {
21952280
location.reload();
21962281
}
21972282
};
2283+
2284+
function getDiffClass(value) {
2285+
if (value === 0) {
2286+
return 'diff-zero'
2287+
}
2288+
return value > 0 ? 'diff-up' : 'diff-down';
2289+
}
2290+
2291+
function getDiffString(diff){
2292+
if (diff === 0) {
2293+
return '--';
2294+
}
2295+
var str = (diff > 0 ? '+' : '');
2296+
str += Ethplorer.Utils.formatNumWidget(diff, true, 2, true, true) + '%';
2297+
return str;
2298+
}

0 commit comments

Comments
 (0)