mirror of
https://github.com/XRPLF/xrpl-dev-portal.git
synced 2025-11-20 03:35:51 +00:00
removed duplicated carbon calulator. finessing the calculations
This commit is contained in:
Calvin Jhunjhnuwala
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,32 +1,32 @@
|
|||||||
let arr = {
|
let arr = {
|
||||||
'btc': {
|
'btc': {
|
||||||
'kWh': 487.368757765725,
|
'kWh': 487.368757765725,
|
||||||
'tons': 16.97290,
|
'tons': 0.41034833,
|
||||||
'gas': 38.7744
|
'gas': 38.7744
|
||||||
},
|
},
|
||||||
'eth': {
|
'eth': {
|
||||||
'kWh': 42.8633,
|
'kWh': 42.8633,
|
||||||
'tons': 1.13107,
|
'tons': 0.02734399,
|
||||||
'gas': 2.38677
|
'gas': 2.38677
|
||||||
},
|
},
|
||||||
'pap': {
|
'pap': {
|
||||||
'kWh': 0.044,
|
'kWh': 0.044,
|
||||||
'tons': 0.00096,
|
'tons': 0.0000000000232,
|
||||||
'gas': 0.00350
|
'gas': 0.00350
|
||||||
},
|
},
|
||||||
'xrp': {
|
'xrp': {
|
||||||
'kWh': 0.0079,
|
'kWh': 0.0079,
|
||||||
'tons': 0.00015,
|
'tons': 0.000000000003688,
|
||||||
'gas': 0.00063
|
'gas': 0.00063
|
||||||
},
|
},
|
||||||
'vsa': {
|
'vsa': {
|
||||||
'kWh': 0.0008,
|
'kWh': 0.0008,
|
||||||
'tons': 0.00002,
|
'tons': 0.0000000000005,
|
||||||
'gas': 0.00006
|
'gas': 0.00006
|
||||||
},
|
},
|
||||||
'mst': {
|
'mst': {
|
||||||
'kWh': 0.0006,
|
'kWh': 0.0006,
|
||||||
'tons': 0.00002,
|
'tons': 0.0000000000005,
|
||||||
'gas': 0.00005
|
'gas': 0.00005
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
@@ -76,7 +76,7 @@ function doCalculations( val ){
|
|||||||
kwhComp = ( total / 50340000000 ).toFixed( 2 );
|
kwhComp = ( total / 50340000000 ).toFixed( 2 );
|
||||||
|
|
||||||
if ( data_comp === 'tons' ) {
|
if ( data_comp === 'tons' ) {
|
||||||
total = total / 2000;
|
total = total * 1000000;
|
||||||
}
|
}
|
||||||
|
|
||||||
num.innerHTML = total.commarize();
|
num.innerHTML = total.commarize();
|
||||||
|
|||||||
@@ -1,163 +0,0 @@
|
|||||||
let arr = {
|
|
||||||
'btc': {
|
|
||||||
'kWh': 487.368757765725,
|
|
||||||
'tons': 16.97290,
|
|
||||||
'gas': 38.7744
|
|
||||||
},
|
|
||||||
'eth': {
|
|
||||||
'kWh': 42.8633,
|
|
||||||
'tons': 1.13107,
|
|
||||||
'gas': 2.38677
|
|
||||||
},
|
|
||||||
'pap': {
|
|
||||||
'kWh': 0.044,
|
|
||||||
'tons': 0.00096,
|
|
||||||
'gas': 0.00350
|
|
||||||
},
|
|
||||||
'xrp': {
|
|
||||||
'kWh': 0.0079,
|
|
||||||
'tons': 0.00015,
|
|
||||||
'gas': 0.00063
|
|
||||||
},
|
|
||||||
'vsa': {
|
|
||||||
'kWh': 0.0008,
|
|
||||||
'tons': 0.00002,
|
|
||||||
'gas': 0.00006
|
|
||||||
},
|
|
||||||
'mst': {
|
|
||||||
'kWh': 0.0006,
|
|
||||||
'tons': 0.00002,
|
|
||||||
'gas': 0.00005
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
function commarize() {
|
|
||||||
// Alter numbers larger than 1k
|
|
||||||
if (this >= 1e6) {
|
|
||||||
var units = ["Thousand", "Million", "Billion", "Trillion"];
|
|
||||||
|
|
||||||
// Divide to get SI Unit engineering style numbers (1e3,1e6,1e9, etc)
|
|
||||||
let unit = Math.floor(((this).toFixed(0).length - 1) / 3) * 3
|
|
||||||
// Calculate the remainder
|
|
||||||
var num = (this / ('1e'+unit)).toFixed(2)
|
|
||||||
var unitname = units[Math.floor(unit / 3) - 1]
|
|
||||||
|
|
||||||
// output number remainder + unitname
|
|
||||||
return num + ' ' + unitname
|
|
||||||
}
|
|
||||||
|
|
||||||
// return formatted original number
|
|
||||||
return this.toLocaleString()
|
|
||||||
}
|
|
||||||
|
|
||||||
// Add method to prototype. this allows you to use this function on numbers and strings directly
|
|
||||||
Number.prototype.commarize = commarize
|
|
||||||
String.prototype.commarize = commarize
|
|
||||||
|
|
||||||
let slider = document.getElementById( 'myRange' ),
|
|
||||||
txns = document.querySelectorAll( '.slider-amt' ),
|
|
||||||
dataTypes = document.querySelectorAll( '.d-output' ),
|
|
||||||
dataViz = document.querySelectorAll( '.viz-output' );
|
|
||||||
|
|
||||||
|
|
||||||
// Update the current slider value (each time you drag the slider handle)
|
|
||||||
|
|
||||||
function doCalculations( val ){
|
|
||||||
|
|
||||||
[].slice.call( dataTypes ).forEach( function( dataType ){
|
|
||||||
|
|
||||||
if ( dataType.classList.contains( 'active' ) ){
|
|
||||||
|
|
||||||
let data_type = dataType.getAttribute( 'data-type' ),
|
|
||||||
data_comp = dataType.getAttribute( 'data-comp' ),
|
|
||||||
total = val * 1000000 * arr[ data_type ][ data_comp ],
|
|
||||||
num = document.getElementById( data_comp + '-' + data_type ),
|
|
||||||
// comp = the number of kWh Portugal used in 2019
|
|
||||||
kwhComp = ( total / 50340000000 ).toFixed( 2 );
|
|
||||||
|
|
||||||
if ( data_comp === 'tons' ) {
|
|
||||||
total = total / 2000;
|
|
||||||
}
|
|
||||||
|
|
||||||
num.innerHTML = total.commarize();
|
|
||||||
num.style.transition = "all .2s ease-in-out";
|
|
||||||
|
|
||||||
if ( data_comp === 'kWh' && kwhComp > .02 ){
|
|
||||||
let dot = document.getElementById( data_comp + '-' + data_type + '-dot' );
|
|
||||||
dot.style.transition = "all .2s ease-in-out";
|
|
||||||
dot.style.transform = "scale(" + kwhComp * 100 + ")";
|
|
||||||
dot.style.webkitTransform = "scale(" + kwhComp * 100 + ")";
|
|
||||||
dot.style.msTransform = "scale(" + kwhComp * 100 + ")";
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function cryptoSelected(){
|
|
||||||
gasCryptoAnimation();
|
|
||||||
co2CryptoAnimation();
|
|
||||||
}
|
|
||||||
|
|
||||||
function cashSelected(){
|
|
||||||
gasCashAnimation();
|
|
||||||
co2CashAnimation();
|
|
||||||
}
|
|
||||||
|
|
||||||
function creditSelected(){
|
|
||||||
gasCreditAnimation();
|
|
||||||
co2CreditAnimation();
|
|
||||||
}
|
|
||||||
|
|
||||||
function changeDataType( type ){
|
|
||||||
|
|
||||||
|
|
||||||
[].slice.call( dataTypes ).forEach( function( dataType ){
|
|
||||||
if ( dataType.classList.contains( type ) ){
|
|
||||||
let dType = type.substring(2);
|
|
||||||
dataType.classList.add( 'active' );
|
|
||||||
document.getElementById('gasAnimation').innerHTML = '';
|
|
||||||
document.getElementById('co2Animation').innerHTML = '';
|
|
||||||
|
|
||||||
if ( dType === 'cash' ){
|
|
||||||
cashSelected();
|
|
||||||
} else if ( dType === 'credit' ){
|
|
||||||
creditSelected()
|
|
||||||
} else {
|
|
||||||
cryptoSelected();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
dataType.classList.remove( 'active' );
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
doCalculations( slider.value );
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
$('.tab-link').on('click', function(e){
|
|
||||||
$( '#data-selector li' ).removeClass( 'active' );
|
|
||||||
$( this ).parent( 'li' ).addClass( 'active' );
|
|
||||||
|
|
||||||
let type = $( this ).attr( 'href' ).slice(1);
|
|
||||||
|
|
||||||
changeDataType( type );
|
|
||||||
})
|
|
||||||
|
|
||||||
$( document ).ready( function(){
|
|
||||||
[].slice.call( txns ).forEach( function( txn ){
|
|
||||||
txn.innerHTML = slider.value;
|
|
||||||
})
|
|
||||||
|
|
||||||
slider.oninput = function() {
|
|
||||||
var val = this.value;
|
|
||||||
[].slice.call( txns ).forEach( function( txn ){
|
|
||||||
txn.innerHTML = val;
|
|
||||||
})
|
|
||||||
doCalculations( val );
|
|
||||||
}
|
|
||||||
|
|
||||||
doCalculations( slider.value );
|
|
||||||
cryptoSelected();
|
|
||||||
});
|
|
||||||
@@ -1,10 +1,10 @@
|
|||||||
$base-size = 1rem;
|
$base-size: 1rem;
|
||||||
// Font Settings ===============================================================
|
// Font Settings ===============================================================
|
||||||
body {
|
body {
|
||||||
// font-feature-settings: "liga", "kern";
|
// font-feature-settings: "liga", "kern";
|
||||||
text-rendering: optimizeLegibility;
|
text-rendering: optimizeLegibility;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
font-size: 1rem;
|
font-size: $base-size;
|
||||||
background: #000;
|
background: #000;
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
|
|||||||
@@ -161,32 +161,32 @@
|
|||||||
<li class="d-output d-crypto active" data-comp="tons" data-type="btc">
|
<li class="d-output d-crypto active" data-comp="tons" data-type="btc">
|
||||||
<p class="h6 mt-3 mb-1">Bitcoin</p>
|
<p class="h6 mt-3 mb-1">Bitcoin</p>
|
||||||
<h5 class="h4 normal mb-0" id="tons-btc"></h5>
|
<h5 class="h4 normal mb-0" id="tons-btc"></h5>
|
||||||
<p class="text-small black-90">tons of CO2</p>
|
<p class="text-small black-90">metric tons of CO2</p>
|
||||||
</li>
|
</li>
|
||||||
<li class="d-output d-crypto active" data-comp="tons" data-type="eth">
|
<li class="d-output d-crypto active" data-comp="tons" data-type="eth">
|
||||||
<p class="h6 mt-3 mb-1">Ethereum</p>
|
<p class="h6 mt-3 mb-1">Ethereum</p>
|
||||||
<h5 class="h4 normal mb-0" id="tons-eth"></h5>
|
<h5 class="h4 normal mb-0" id="tons-eth"></h5>
|
||||||
<p class="text-small black-90">tons of CO2</p>
|
<p class="text-small black-90">metric tons of CO2</p>
|
||||||
</li>
|
</li>
|
||||||
<li class="d-output d-cash" data-comp="tons" data-type="pap">
|
<li class="d-output d-cash" data-comp="tons" data-type="pap">
|
||||||
<p class="h6 mt-3 mb-1">Cash</p>
|
<p class="h6 mt-3 mb-1">Cash</p>
|
||||||
<h5 class="h4 normal mb-0" id="tons-pap"></h5>
|
<h5 class="h4 normal mb-0" id="tons-pap"></h5>
|
||||||
<p class="text-small black-90">tons of CO2</p>
|
<p class="text-small black-90">metric tons of CO2</p>
|
||||||
</li>
|
</li>
|
||||||
<li class="d-output d-crypto d-credit d-cash active" data-comp="tons" data-type="xrp">
|
<li class="d-output d-crypto d-credit d-cash active" data-comp="tons" data-type="xrp">
|
||||||
<p class="h6 mt-3 mb-1">XRP</p>
|
<p class="h6 mt-3 mb-1">XRP</p>
|
||||||
<h5 class="h4 normal mb-0" id="tons-xrp"></h5>
|
<h5 class="h4 normal mb-0" id="tons-xrp"></h5>
|
||||||
<p class="text-small black-90">tons of CO2</p>
|
<p class="text-small black-90">metric tons of CO2</p>
|
||||||
</li>
|
</li>
|
||||||
<li class="d-output d-credit" data-comp="tons" data-type="vsa">
|
<li class="d-output d-credit" data-comp="tons" data-type="vsa">
|
||||||
<p class="h6 mt-3 mb-1">Visa</p>
|
<p class="h6 mt-3 mb-1">Visa</p>
|
||||||
<h5 class="h4 normal mb-0" id="tons-vsa"></h5>
|
<h5 class="h4 normal mb-0" id="tons-vsa"></h5>
|
||||||
<p class="text-small black-90">tons of CO2</p>
|
<p class="text-small black-90">metric tons of CO2</p>
|
||||||
</li>
|
</li>
|
||||||
<li class="d-output d-credit" data-comp="tons" data-type="mst">
|
<li class="d-output d-credit" data-comp="tons" data-type="mst">
|
||||||
<p class="h6 mt-3 mb-1">Mastercard</p>
|
<p class="h6 mt-3 mb-1">Mastercard</p>
|
||||||
<h5 class="h4 normal mb-0" id="tons-mst"></h5>
|
<h5 class="h4 normal mb-0" id="tons-mst"></h5>
|
||||||
<p class="text-small black-90">tons of CO2</p>
|
<p class="text-small black-90">metric tons of CO2</p>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
@@ -249,7 +249,7 @@
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td class="bold ta-right">{% trans %}Kilowatt Hour{% endtrans %}</td>
|
<td class="bold ta-right">{% trans %}dddKilowatt Hour{% endtrans %}</td>
|
||||||
<td class="bold ta-right">{% trans %}Gallons of Gas{% endtrans %}</td>
|
<td class="bold ta-right">{% trans %}Gallons of Gas{% endtrans %}</td>
|
||||||
<td class="bold ta-right">{% trans %}CO2 Emissions{% endtrans %}</td>
|
<td class="bold ta-right">{% trans %}CO2 Emissions{% endtrans %}</td>
|
||||||
</tr>
|
</tr>
|
||||||
@@ -371,169 +371,7 @@
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
// let arr = {
|
|
||||||
// 'btc': {
|
|
||||||
// 'kWh': 487.368757765725,
|
|
||||||
// 'tons': 16.97290,
|
|
||||||
// 'gas': 38.7744
|
|
||||||
// },
|
|
||||||
// 'eth': {
|
|
||||||
// 'kWh': 42.8633,
|
|
||||||
// 'tons': 1.13107,
|
|
||||||
// 'gas': 2.38677
|
|
||||||
// },
|
|
||||||
// 'pap': {
|
|
||||||
// 'kWh': 0.044,
|
|
||||||
// 'tons': 0.00096,
|
|
||||||
// 'gas': 0.00350
|
|
||||||
// },
|
|
||||||
// 'xrp': {
|
|
||||||
// 'kWh': 0.0079,
|
|
||||||
// 'tons': 0.00015,
|
|
||||||
// 'gas': 0.00063
|
|
||||||
// },
|
|
||||||
// 'vsa': {
|
|
||||||
// 'kWh': 0.0008,
|
|
||||||
// 'tons': 0.00002,
|
|
||||||
// 'gas': 0.00006
|
|
||||||
// },
|
|
||||||
// 'mst': {
|
|
||||||
// 'kWh': 0.0006,
|
|
||||||
// 'tons': 0.00002,
|
|
||||||
// 'gas': 0.00005
|
|
||||||
// },
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function commarize() {
|
|
||||||
// // Alter numbers larger than 1k
|
|
||||||
// if (this >= 1e6) {
|
|
||||||
// var units = ["Thousand", "Million", "Billion", "Trillion"];
|
|
||||||
|
|
||||||
// // Divide to get SI Unit engineering style numbers (1e3,1e6,1e9, etc)
|
|
||||||
// let unit = Math.floor(((this).toFixed(0).length - 1) / 3) * 3
|
|
||||||
// // Calculate the remainder
|
|
||||||
// var num = (this / ('1e'+unit)).toFixed(2)
|
|
||||||
// var unitname = units[Math.floor(unit / 3) - 1]
|
|
||||||
|
|
||||||
// // output number remainder + unitname
|
|
||||||
// return num + ' ' + unitname
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // return formatted original number
|
|
||||||
// return this.toLocaleString()
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // Add method to prototype. this allows you to use this function on numbers and strings directly
|
|
||||||
// Number.prototype.commarize = commarize
|
|
||||||
// String.prototype.commarize = commarize
|
|
||||||
|
|
||||||
// let slider = document.getElementById( 'myRange' ),
|
|
||||||
// txns = document.querySelectorAll( '.slider-amt' ),
|
|
||||||
// dataTypes = document.querySelectorAll( '.d-output' ),
|
|
||||||
// dataViz = document.querySelectorAll( '.viz-output' );
|
|
||||||
|
|
||||||
|
|
||||||
// // Update the current slider value (each time you drag the slider handle)
|
|
||||||
|
|
||||||
// function doCalculations( val ){
|
|
||||||
|
|
||||||
// [].slice.call( dataTypes ).forEach( function( dataType ){
|
|
||||||
|
|
||||||
// if ( dataType.classList.contains( 'active' ) ){
|
|
||||||
|
|
||||||
// let data_type = dataType.getAttribute( 'data-type' ),
|
|
||||||
// data_comp = dataType.getAttribute( 'data-comp' ),
|
|
||||||
// total = val * 1000000 * arr[ data_type ][ data_comp ],
|
|
||||||
// num = document.getElementById( data_comp + '-' + data_type ),
|
|
||||||
// // comp = the number of kWh Portugal used in 2019
|
|
||||||
// kwhComp = ( total / 50340000000 ).toFixed( 2 );
|
|
||||||
|
|
||||||
// if ( data_comp === 'tons' ) {
|
|
||||||
// total = total / 2000;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// num.innerHTML = total.commarize();
|
|
||||||
// num.style.transition = "all .2s ease-in-out";
|
|
||||||
|
|
||||||
// if ( data_comp === 'kWh' && kwhComp > .02 ){
|
|
||||||
// let dot = document.getElementById( data_comp + '-' + data_type + '-dot' );
|
|
||||||
// dot.style.transition = "all .2s ease-in-out";
|
|
||||||
// dot.style.transform = "scale(" + kwhComp * 100 + ")";
|
|
||||||
// dot.style.webkitTransform = "scale(" + kwhComp * 100 + ")";
|
|
||||||
// dot.style.msTransform = "scale(" + kwhComp * 100 + ")";
|
|
||||||
// }
|
|
||||||
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
|
|
||||||
|
|
||||||
// function cryptoSelected(){
|
|
||||||
// gasCryptoAnimation( );
|
|
||||||
// co2CryptoAnimation();
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function cashSelected(){
|
|
||||||
// gasCashAnimation();
|
|
||||||
// co2CashAnimation();
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function creditSelected(){
|
|
||||||
// gasCreditAnimation();
|
|
||||||
// co2CreditAnimation();
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function changeDataType( type ){
|
|
||||||
|
|
||||||
|
|
||||||
// [].slice.call( dataTypes ).forEach( function( dataType ){
|
|
||||||
// if ( dataType.classList.contains( type ) ){
|
|
||||||
// let dType = type.substring(2);
|
|
||||||
// dataType.classList.add( 'active' );
|
|
||||||
// document.getElementById('gasAnimation').innerHTML = '';
|
|
||||||
// document.getElementById('co2Animation').innerHTML = '';
|
|
||||||
|
|
||||||
// if ( dType === 'cash' ){
|
|
||||||
// cashSelected();
|
|
||||||
// } else if ( dType === 'credit' ){
|
|
||||||
// creditSelected()
|
|
||||||
// } else {
|
|
||||||
// cryptoSelected();
|
|
||||||
// }
|
|
||||||
// } else {
|
|
||||||
// dataType.classList.remove( 'active' );
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// doCalculations( slider.value );
|
|
||||||
|
|
||||||
// }
|
|
||||||
|
|
||||||
// $('.tab-link').on('click', function(e){
|
|
||||||
// $( '#data-selector li' ).removeClass( 'active' );
|
|
||||||
// $( this ).parent( 'li' ).addClass( 'active' );
|
|
||||||
|
|
||||||
// let type = $( this ).attr( 'href' ).slice(1);
|
|
||||||
|
|
||||||
// changeDataType( type );
|
|
||||||
// })
|
|
||||||
|
|
||||||
// $( document ).ready( function(){
|
|
||||||
// [].slice.call( txns ).forEach( function( txn ){
|
|
||||||
// txn.innerHTML = slider.value;
|
|
||||||
// })
|
|
||||||
|
|
||||||
// slider.oninput = function() {
|
|
||||||
// var val = this.value;
|
|
||||||
// [].slice.call( txns ).forEach( function( txn ){
|
|
||||||
// txn.innerHTML = val;
|
|
||||||
// })
|
|
||||||
// doCalculations( val );
|
|
||||||
// }
|
|
||||||
|
|
||||||
// doCalculations( slider.value );
|
|
||||||
// cryptoSelected();
|
|
||||||
// });
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user