A Pen by Dmitry Radkovskiy on CodePen.
Last active
July 2, 2019 19:12
-
-
Save zlumer/0bb82eceb73fd31d6f3a6c70b9e26fcb to your computer and use it in GitHub Desktop.
KLozVj
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<body class="layout-boxed navbar-top bg-black"> | |
<div class="flash-messages" style="display: none;"> | |
</div> | |
<!-- Main navbar --> | |
<div class="navbar navbar-fixed-top navbar-inverse bg-anco-blue-dark"> | |
<div id="jGrowl" class="top-right jGrowl"></div> | |
<div class="navbar-collapse collapse" id="navbar-mobile"> | |
<p class="navbar-text pl-5"><i class="icon-watch2 opacity-50"></i> <span id="current-time"></span> UTC</p> | |
<ul class="nav navbar-nav navbar-right"> | |
<li class="dropdown language-switch"> | |
<a class="dropdown-toggle" data-toggle="dropdown"> | |
<img class="position-left" alt="" src="/assets/flags/en-5d72c5a8bef80fca6f99f476e15ec95ce2d5e5f65c6dab9ee8e56348be0d39fc.png" /> | |
English | |
<span class="caret"></span> | |
</a> | |
</li> | |
</ul> | |
</div> | |
</div> | |
<!-- /main navbar --> | |
<!-- Page container --> | |
<div class="page-container"> | |
<!-- Page content --> | |
<div class="page-content"> | |
<!-- Main sidebar --> | |
<div class="sidebar sidebar-main bg-black-grad"> | |
<div class="sidebar-content"> | |
<!-- User menu --> | |
<div class="sidebar-user"> | |
<div class="category-content"> | |
<div class="media"> | |
<div class="media-left"> | |
<a class="label label-rounded label-icon bg-anco-red" href="/en/profile"> | |
<i class="icon-user"></i> | |
</a> </div> | |
<div class="media-body"> | |
<span id="current-user-email" class="media-heading text-semibold">[email protected]</span> | |
</div> | |
<div class="text-size-mini user-balances-many"> | |
<div> | |
<span>My Balance:</span> | |
0 ANCO | |
</div> | |
<div> | |
<span>Purchases:</span> | |
0 ANCO | |
</div> | |
<div> | |
<span>Bonuses:</span> | |
0 ANCO | |
</div> | |
<div> | |
<span>Referral bonus:</span> | |
0 BTC | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
<!-- /user menu --> | |
<!-- Main navigation --> | |
<hr/> | |
<!-- /main navigation --> | |
</div> | |
</div> | |
<!-- /main sidebar --> | |
<!-- Main content --> | |
<div class="content-wrapper"> | |
<!-- Page header --> | |
<div class="page-header page-header-default page-header-xs"> | |
<div class="page-header-content"> | |
<div class="page-title"> | |
<h1>My payment information for each incentive type</h1> | |
</div> | |
</div> | |
</div> | |
<!-- /page header --> | |
<!-- Content area --> | |
<div class="content"> | |
<div class="panel panel-white"> | |
<div class="panel-heading"> | |
<h4 class="panel-title">1. Referral: total amount $</h4> | |
</div> | |
<div class="table-responsive"> | |
<table class="table table-striped"> | |
<thead> | |
<tr> | |
<th>Referral DATE</th> | |
<th>ID</th> | |
<th>Bonus (10%)</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td>05042019</td> | |
<td>red</td> | |
<td>280$</td> | |
</tr> | |
<tr> | |
<td> </td> | |
<td></td> | |
<td></td> | |
</tr> | |
<tr> | |
<td> </td> | |
<td></td> | |
<td></td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
</div> | |
<div class="panel panel-white"> | |
<div class="panel-heading"> | |
<h4 class="panel-title">2. Winners: $</h4> | |
</div> | |
<div class="table-responsive"> | |
<table class="table table-striped"> | |
<thead> | |
<tr> | |
<th>Awrad DATE</th> | |
<th>RANK (Class, Contract)</th> | |
<th>Bonus (10%)</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td>10042019</td> | |
<td>1st ( Class 1 , A )</td> | |
<td>50$</td> | |
</tr> | |
<tr> | |
<td>11042019</td> | |
<td>1st ( Class 1 , A )</td> | |
<td>250$</td> | |
</tr> | |
<tr> | |
<td> </td> | |
<td></td> | |
<td></td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
</div> | |
<div class="panel panel-white"> | |
<div class="panel-heading"> | |
<h4 class="panel-title">3. Incentives: $ <span class="text-danger">( Additional bonus from class 6 )</span></h4> | |
</div> | |
<div class="table-responsive"> | |
<table class="table table-striped"> | |
<thead> | |
<tr> | |
<th>Awrad DATE</th> | |
<th>RANK (Class, Contract)</th> | |
<th>Bonus (10%)</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td> </td> | |
<td></td> | |
<td></td> | |
</tr> | |
<tr> | |
<td> </td> | |
<td></td> | |
<td></td> | |
</tr> | |
<tr> | |
<td> </td> | |
<td></td> | |
<td></td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
</div> | |
</div> | |
<!-- /content area --> | |
</div> | |
<!-- /main content --> | |
</div> | |
<!-- /page content --> | |
</div> | |
<!-- /page container --> | |
</body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
;(function(){ | |
if (window.ANCO_INJECT) | |
return; | |
window.ANCO_INJECT = true; | |
var HANDLERS = { | |
payment: _payment, | |
referral_structure: _ref_struct, | |
referral: _ref_program, | |
points: _points, | |
dashboard: replaceDashboardOverview, | |
contracts: _contracts, | |
social: _snsLinks, | |
contract_a: __contract('A'), | |
contract_b: __contract('B'), | |
contract_c: __contract('C'), | |
contract_d: __contract('D') | |
} | |
const API_URL = 'https://fathomless-wave-75159.herokuapp.com' | |
function _api(path) | |
{ | |
return API_URL + path | |
} | |
var PRELOADER = '<div id="zl-preloader"><div class="lds-ring"><div></div><div></div><div></div><div></div></div></div>' | |
try | |
{ | |
console.log('TEST SCRIPT LAUNCHED!') | |
$(document).ready(function(){ | |
console.log('TEST SCRIPT: DOCUMENT IS READY!') | |
console.log('TEST SCRIPT user email: ' + $('#current-user-email').text()) | |
var text = $('#current-user-email').text() | |
// text = '[email protected]' | |
/* if (text == "[email protected]") | |
$('#current-user-email').text(text + ' INJECTED') */ | |
var page = window.location.pathname.split('/')[2] | |
if ((window.location.hostname == 'dashboard.anco.io') && !page) | |
page = 'dashboard' | |
// manually set page for development purposes | |
console.log(window.location.host) | |
if (window.location.host == 'cdpn.io') | |
page = 'payment' | |
updateUserInfo(text) | |
var h = HANDLERS[page] | |
if (h) | |
{ | |
var $content = $('div.content') | |
$content.hide() | |
$('div.content-wrapper').append(PRELOADER) | |
function hidePreloader() | |
{ | |
// return; | |
$('#zl-preloader').hide() | |
$content.show() | |
} | |
h({ | |
email: text, | |
$content: $content, | |
ready: hidePreloader | |
}) | |
} | |
}) | |
} | |
catch(err) | |
{ | |
console.error(err.message || err) | |
} | |
function updateUserInfo(email) | |
{ | |
function blcs() | |
{ | |
return $('div.user-balances-many').children().toArray() | |
} | |
$(blcs()).hide() | |
fetch(_api('/userinfo/' + email)) | |
.then(function(response) { return response.json() }) | |
.then(function(json) | |
{ | |
setUserInfo(json.contracts, json.balance) | |
$(blcs().slice(0,2)).show() | |
}) | |
} | |
function setUserInfo(contracts, usd) | |
{ | |
let [ctrElem, usdElem] = $('div.user-balances-many').children() | |
let ctrText = (contracts && contracts.length) ? contracts.join(', ') : "none" | |
ctrElem.innerHTML = `<span>Owned contracts:</span> ${ctrText}` | |
usdElem.innerHTML = `<span>USD balance:</span> $${usd}` | |
} | |
function _ignore(helpers) | |
{ | |
console.log(helpers) | |
helpers.ready() | |
} | |
function _payment(helpers) | |
{ | |
return __template(_api('/payment?user=' + helpers.email), PAYMENT_TEMPLATE, { email: helpers.email, api_url: API_URL })(helpers) | |
} | |
function _snsLinks(helpers) | |
{ | |
return __template(_api('/sns/links'), SNS_VISITS_TEMPLATE, { email: helpers.email })(helpers) | |
} | |
function _points(helpers) | |
{ | |
return __template(_api('/points?user=' + helpers.email), POINTS_TEMPLATE)(helpers) | |
} | |
function _ref_struct(helpers) | |
{ | |
return __template(_api('/referrals?user=' + helpers.email), REF_STRUCT_TEMPLATE)(helpers) | |
} | |
function _ref_program(helpers) | |
{ | |
$($('div.content .panel.panel-flat').toArray().slice(2)).hide() | |
helpers.ready() | |
} | |
function _contracts(helpers) | |
{ | |
return __template(_api('/contracts/overview?user=' + helpers.email), CONTRACTS_TEMPLATE)(helpers) | |
} | |
function __contract(ctr) | |
{ | |
return function(helpers) { | |
return __template(_api('/contracts/contract?contract=' + ctr), CONTRACT_TEMPLATE)(helpers) | |
} | |
} | |
function __template(url, tmpl, extra) | |
{ | |
if (!extra) | |
extra = {}; | |
return function(helpers){ | |
fetch(url) | |
.then(function(response) { return response.json() }) | |
.then(function(json){ return Object.assign(json, extra); }) | |
.then(function(json) { | |
console.log(JSON.stringify(json)) | |
helpers.$content.html(tmpl(json)) | |
helpers.ready() | |
}) | |
} | |
} | |
function replaceDashboardOverview(helpers) | |
{ | |
let content = helpers.$content | |
console.log(content) | |
console.log(content.children()) | |
console.log(content.children()[0]) | |
$(content.children()[0]).hide() | |
$(content.children()[1]).hide() | |
content.prepend('<div id="zl-dshbrd-parent"/>') | |
helpers.$content = $(content.children()[0]) // newly added element | |
return __template(_api('/summary?user=' + helpers.email), OVERVIEW_TEMPLATE)(helpers) | |
} | |
var PAYMENT_TEMPLATE = (function anonymous(it | |
) { | |
var out='<div class="panel panel-default"><div class="panel-heading"><h4 class="panel-title">Current USD balance: $'+(it.total.available)+'</h4></div>';if(it.total.available){out+='<div class="panel-body">';if(it.openw){out+='<span>Withdrawal requested at '+( new Date(it.openw.timestamp).toUTCString() )+'. Processing...</span>';}else{out+='<form id="form-withdraw" action="'+(it.api_url)+'/withdraw/'+(it.email)+'" method="POST"><input class="btn btn-primary" type="submit" value="Withdraw $'+(it.total.available)+'"></form><script>;(function(){let form = $(\'#form-withdraw\');let button = $(\'#form-withdraw input\');let url = form.attr(\'action\');form.on(\'submit\', function(e){if (e && e.preventDefault)e.preventDefault();button.attr(\'disabled\', true);$.post(url, function(data){form.parent().append(\'Withdrawal request submitted.\');form.hide();});return false;})})();</script>';}out+='</div>';}out+='</div> <div class="panel panel-white"><div class="panel-heading"> <h4 class="panel-title">1. Referral: $'+(it.referral.total)+'</h4></div><div class="table-responsive"> <table class="table table-striped"><thead> <tr><th>Referral DATE</th><th>ID</th><th>Bonus (10%)</th> </tr></thead><tbody>';var arr1=it.referral.users;if(arr1){var value,index=-1,l1=arr1.length-1;while(index<l1){value=arr1[index+=1];out+=' <tr><td>'+(value.date)+'</td><td>'+(value.uid)+'</td><td>$'+(value.bonus)+'</td> </tr> ';} } out+='</tbody> </table></div> </div> <div class="panel panel-white"><div class="panel-heading"> <h4 class="panel-title">2. Winners: $'+(it.bonuses.total)+'</h4></div><div class="table-responsive"> <table class="table table-striped"><thead> <tr><th>Award DATE</th><th>RANK (Class, Contract)</th><th>Bonus (10%)</th> </tr></thead><tbody>';var arr2=it.bonuses.awards;if(arr2){var value,index=-1,l2=arr2.length-1;while(index<l2){value=arr2[index+=1];out+=' <tr><td>'+(value.date)+'</td><td>Rank '+(value.rank)+' (Class '+(value.class)+', '+(value.contract)+')</td><td>$'+(value.bonus)+'</td> </tr> ';} } out+='</tbody> </table></div> </div> <div class="panel panel-white"><div class="panel-heading"> <h4 class="panel-title">3. Incentives: $'+(it.bonuses2.total)+' <span class="text-danger">( Additional bonus from class 6 )</span></h4></div><div class="table-responsive"> <table class="table table-striped"><thead> <tr><th>Awaad DATE</th><th>RANK (Class, Contract)</th><th>Bonus (10%)</th> </tr></thead><tbody>';var arr3=it.bonuses2.awards;if(arr3){var value,index=-1,l3=arr3.length-1;while(index<l3){value=arr3[index+=1];out+='<tr><td>'+(value.date)+'</td><td>Rank '+(value.rank)+' (Class '+(value.class)+', '+(value.contract)+')</td><td>$'+(value.bonus)+'</td></tr>';} } out+='</tbody> </table></div> </div>';return out; | |
}) | |
var POINTS_TEMPLATE = (function anonymous(it | |
) { | |
var out='<div class="row"><div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Referral points</h5></div><div class="table-responsive"> <table class="table text-center"><thead> <tr><th>A</th><th>B</th><th>C</th><th>D</th> </tr></thead><tbody> <tr><td>'+(it.referral[0])+'</td><td>'+(it.referral[1])+'</td><td>'+(it.referral[2])+'</td><td>'+(it.referral[3])+'</td> </tr></tbody> </table></div> </div></div><div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Sequence points</h5></div><div class="table-responsive"> <table class="table text-center"><thead> <tr><th>A</th><th>B</th><th>C</th><th>D</th> </tr></thead><tbody> <tr><td>'+(it.sequence[0])+'</td><td>'+(it.sequence[1])+'</td><td>'+(it.sequence[2])+'</td><td>'+(it.sequence[3])+'</td> </tr></tbody> </table></div> </div></div> </div> <div class="row"><div class="col-md-6"> <div class="panel"><div class="panel-heading"> <h5 class="panel-title">Daily points: '+(it.login)+'</h5></div> </div></div><div class="col-md-6"> <div class="panel"><div class="panel-heading"> <h5 class="panel-title">Daily SNS points: '+(it.sns)+'</h5></div> </div></div> </div> <div class="row"><div class="col-md-6 col-md-offset-3"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Total</h5></div><div class="table-responsive"> <table class="table text-center"><thead> <tr><th>A</th><th>B</th><th>C</th><th>D</th> </tr></thead><tbody> <tr><td>'+(it.total[0])+'</td><td>'+(it.total[1])+'</td><td>'+(it.total[2])+'</td><td>'+(it.total[3])+'</td> </tr></tbody> </table></div> </div></div> </div>';return out; | |
}) | |
var REF_STRUCT_TEMPLATE = (function anonymous(it | |
) { | |
var out=' <div class="row"><div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract A</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>The number of people</th><th>Total point</th> </tr></thead><tbody>';var arr1=it.referrals.A;if(arr1){var value,index=-1,l1=arr1.length-1;while(index<l1){value=arr1[index+=1];out+='<tr><td>'+((index+1))+'</td><td>'+(value.n)+'</td><td>'+(value.p)+'</td></tr> ';} } out+='</tbody><tfoot> <tr><th>Total</th><th>'+(it.totals.A.ref.n)+'</th><th>'+(it.totals.A.ref.p)+'</th> </tr></tfoot> </table></div> </div></div><div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract B</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>The number of people</th><th>Total point</th> </tr></thead><tbody>';var arr2=it.referrals.B;if(arr2){var value,index=-1,l2=arr2.length-1;while(index<l2){value=arr2[index+=1];out+='<tr><td>'+((index+1))+'</td><td>'+(value.n)+'</td><td>'+(value.p)+'</td></tr>';} } out+='</tbody><tfoot> <tr><th>Total</th><th>'+(it.totals.B.ref.n)+'</th><th>'+(it.totals.B.ref.p)+'</th> </tr></tfoot> </table></div> </div></div> </div> <div class="row"><div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract C</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>The number of people</th><th>Total point</th> </tr></thead><tbody>';var arr3=it.referrals.C;if(arr3){var value,index=-1,l3=arr3.length-1;while(index<l3){value=arr3[index+=1];out+='<tr><td>'+((index+1))+'</td><td>'+(value.n)+'</td><td>'+(value.p)+'</td></tr>';} } out+='</tbody><tfoot> <tr><th>Total</th><th>'+(it.totals.C.ref.n)+'</th><th>'+(it.totals.C.ref.p)+'</th> </tr></tfoot> </table></div> </div></div><div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract D</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>The number of people</th><th>Total point</th> </tr></thead><tbody>';var arr4=it.referrals.D;if(arr4){var value,index=-1,l4=arr4.length-1;while(index<l4){value=arr4[index+=1];out+='<tr><td>'+((index+1))+'</td><td>'+(value.n)+'</td><td>'+(value.p)+'</td></tr> ';} } out+='</tbody><tfoot> <tr><th>Total</th><th>'+(it.totals.D.ref.n)+'</th><th>'+(it.totals.D.ref.p)+'</th> </tr></tfoot> </table></div> </div></div> </div> <h1 class="mb-20">My sequence registration information</h1> <div class="row"><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract A</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>ID</th> </tr></thead><tbody>';var arr5=it.sequence.A;if(arr5){var value,index=-1,l5=arr5.length-1;while(index<l5){value=arr5[index+=1];out+=' <tr><td>'+((index + 1))+'</td><td>'+(value)+'</td></tr>';} } out+='</tbody><tfoot> <tr><th>Total</th><th>'+(it.totals.A.seq)+'</th> </tr></tfoot> </table></div> </div></div><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract B</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>ID</th> </tr></thead><tbody>';var arr6=it.sequence.B;if(arr6){var value,index=-1,l6=arr6.length-1;while(index<l6){value=arr6[index+=1];out+='<tr><td>'+((index + 1))+'</td><td>'+(value)+'</td></tr>';} } out+='</tbody><tfoot><tr><th>Total</th><th>'+(it.totals.B.seq)+'</th></tr></tfoot> </table></div> </div></div><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract C</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>ID</th> </tr></thead><tbody>';var arr7=it.sequence.C;if(arr7){var value,index=-1,l7=arr7.length-1;while(index<l7){value=arr7[index+=1];out+='<tr><td>'+((index + 1))+'</td><td>'+(value)+'</td></tr>';} } out+='</tbody><tfoot><tr><th>Total</th><th>'+(it.totals.C.seq)+'</th></tr></tfoot> </table></div> </div></div><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract D</h5></div><div class="table-responsive"> <table class="table table-striped text-center"><thead> <tr><th>Level</th><th>ID</th> </tr></thead><tbody>';var arr8=it.sequence.D;if(arr8){var value,index=-1,l8=arr8.length-1;while(index<l8){value=arr8[index+=1];out+='<tr><td>'+((index + 1))+'</td><td>'+(value)+'</td></tr>';} } out+='</tbody><tfoot><tr><th>Total</th><th>'+(it.totals.D.seq)+'</th></tr></tfoot> </table></div> </div></div> </div>';return out; | |
}) | |
var CONTRACTS_TEMPLATE = (function anonymous(it | |
) { | |
var out='<div class="row">';if(it.contracts.A){out+='<div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract A';if(it.contracts.A.bought){out+='<span class="text-muted text-size-small ml-10">(Class '+(it.contracts.A.class)+' Rank '+(it.contracts.A.rank)+')</span>';}else{out+='<span class="text-muted text-size-small ml-10">(not purchased yet)</span>';}out+=' </h5></div><div class="table-responsive"> <table class="table"><thead> <tr><th>Rank</th><th>ID</th><th>Point</th> </tr></thead><tbody>';var arr1=it.contracts.A.neighbors;if(arr1){var value,index=-1,l1=arr1.length-1;while(index<l1){value=arr1[index+=1];out+='<tr';if((value[0] == it.contracts.A.rank)){out+='class="active"';}out+='><td>'+(value[0])+'</td><td>'+(value[1])+'</td><td>'+(value[2])+'</td></tr> ';} } out+='</tbody> </table></div> </div></div>';}if(it.contracts.B){out+='<div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract B';if(it.contracts.B.bought){out+='<span class="text-muted text-size-small ml-10">(Class '+(it.contracts.B.class)+' Rank '+(it.contracts.B.rank)+')</span>';}else{out+='<span class="text-muted text-size-small ml-10">(not purchased yet)</span>';}out+=' </h5></div><div class="table-responsive"> <table class="table"><thead> <tr><th>Rank</th><th>ID</th><th>Point</th> </tr></thead><tbody>';var arr2=it.contracts.B.neighbors;if(arr2){var value,index=-1,l2=arr2.length-1;while(index<l2){value=arr2[index+=1];out+='<tr';if((value[0] == it.contracts.B.rank)){out+='class="active"';}out+='><td>'+(value[0])+'</td><td>'+(value[1])+'</td><td>'+(value[2])+'</td></tr>';} } out+='</tbody> </table></div> </div></div>';}out+=' </div> <div class="row">';if(it.contracts.C){out+='<div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract C';if(it.contracts.C.bought){out+='<span class="text-muted text-size-small ml-10">(Class '+(it.contracts.C.class)+' Rank '+(it.contracts.C.rank)+')</span>';}else{out+='<span class="text-muted text-size-small ml-10">(not purchased yet)</span>';}out+=' </h5></div><div class="table-responsive"> <table class="table"><thead> <tr><th>Rank</th><th>ID</th><th>Point</th> </tr></thead><tbody>';var arr3=it.contracts.C.neighbors;if(arr3){var value,index=-1,l3=arr3.length-1;while(index<l3){value=arr3[index+=1];out+='<tr';if((value[0] == it.contracts.C.rank)){out+='class="active"';}out+='><td>'+(value[0])+'</td><td>'+(value[1])+'</td><td>'+(value[2])+'</td></tr>';} } out+='</tbody> </table></div> </div></div>';}if(it.contracts.D){out+='<div class="col-md-6"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Contract D';if(it.contracts.D.bought){out+='<span class="text-muted text-size-small ml-10">(Class '+(it.contracts.D.class)+' Rank '+(it.contracts.D.rank)+')</span>';}else{out+='<span class="text-muted text-size-small ml-10">(not purchased yet)</span>';}out+=' </h5></div><div class="table-responsive"> <table class="table"><thead> <tr><th>Rank</th><th>ID</th><th>Point</th> </tr></thead><tbody>';var arr4=it.contracts.D.neighbors;if(arr4){var value,index=-1,l4=arr4.length-1;while(index<l4){value=arr4[index+=1];out+='<tr';if((value[0] == it.contracts.D.rank)){out+='class="active"';}out+='><td>'+(value[0])+'</td><td>'+(value[1])+'</td><td>'+(value[2])+'</td></tr>';} } out+='</tbody> </table></div> </div></div>';}out+=' </div>';return out; | |
}) | |
var CONTRACT_TEMPLATE = (function anonymous(it | |
) { | |
var out='';var arr1=it.classes;if(arr1){var members,clidx=-1,l1=arr1.length-1;while(clidx<l1){members=arr1[clidx+=1];if((clidx % 3 == 0)){out+='<div class="row">';}out+='<div class="col-md-4"><div class="panel panel-white"><div class="panel-heading"><h5 class="panel-title">Class '+((clidx+1))+'<div>Member ID score</div></h5></div><div class="table-responsive"><table class="table"><thead><tr><th>Rank</th><th>ID</th><th>Point</th></tr></thead><tbody>';var arr2=members;if(arr2){var mem,memidx=-1,l2=arr2.length-1;while(memidx<l2){mem=arr2[memidx+=1];out+='<tr><td>'+(mem[0])+'</td><td>'+(mem[1])+'</td><td>'+(mem[2])+'</td></tr>';} } out+='</tbody></table></div></div></div>';if(((clidx % 3 == 2) || (clidx == it.classes.length - 1))){out+='</div>';}} } return out; | |
}) | |
var OVERVIEW_TEMPLATE = (function anonymous(it | |
) { | |
var out='<style>img.zl-dash-icon {width: 20%;}h5.zl-icon-title {display: inline;margin-left: 0.5rem;}</style><div class="row"><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"><img src="https://svgshare.com/i/DEv.svg" class="zl-dash-icon"> <h5 class="panel-title zl-icon-title">Referral bonus</h5></div><div class="table-responsive"> <table class="table text-center"><tbody> <tr><td>$'+(it.referral)+'</td> </tr></tbody> </table></div> </div></div><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"><img src="https://svgshare.com/i/DFp.svg" class="zl-dash-icon"> <h5 class="panel-title zl-icon-title">Award bonus</h5></div><div class="table-responsive"> <table class="table text-center"><tbody> <tr><td>$'+(it.award)+'</td> </tr></tbody> </table></div> </div></div><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"><img src="https://svgshare.com/i/DFq.svg" class="zl-dash-icon"> <h5 class="panel-title zl-icon-title">Additional bonus</h5></div><div class="table-responsive"> <table class="table text-center"><tbody> <tr><td>$'+(it.additional)+'</td> </tr></tbody> </table></div> </div></div><div class="col-md-3"> <div class="panel panel-white"><div class="panel-heading"><img src="https://svgshare.com/i/DGp.svg" class="zl-dash-icon"> <h5 class="panel-title zl-icon-title">My ranking</h5></div><div class="table-responsive"> <table class="table text-center"><thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead><tbody><tr>';if(it.ranks.length){out+='<td>';if(it.ranks[0]){out+='C'+(it.ranks[0].class)+'R'+(it.ranks[0].rank);}out+='</td><td>';if(it.ranks[1]){out+='C'+(it.ranks[1].class)+'R'+(it.ranks[1].rank);}out+='</td><td>';if(it.ranks[2]){out+='C'+(it.ranks[2].class)+'R'+(it.ranks[2].rank);}out+='</td><td>';if(it.ranks[3]){out+='C'+(it.ranks[3].class)+'R'+(it.ranks[3].rank);}out+='</td>';}else{out+='<td colspan="4">No contracts purchased yet</td>';}out+='</tr></tbody> </table></div> </div></div> </div> <div class="row"><div class="col-md-6"> <div class="panel"><div class="panel-heading"> <h5 class="panel-title">My purchase history</h5></div><div class="table-responsive"><table class="table text-center"> <tbody>';if(!it.purchases.list.length){out+='<tr><td colspan="2">No contracts purchased yet</td></tr>';}else{if(it.purchases.list[0]){out+='<tr><td>Contract A:</td><td>$'+(it.purchases.list[0])+'</td></tr>';}if(it.purchases.list[1]){out+='<tr><td>Contract B:</td><td>$'+(it.purchases.list[1])+'</td></tr>';}if(it.purchases.list[2]){out+='<tr><td>Contract C:</td><td>$'+(it.purchases.list[2])+'</td></tr>';}if(it.purchases.list[3]){out+='<tr><td>Contract D:</td><td>$'+(it.purchases.list[3])+'</td></tr>';}}out+='<tr><td>Total:</td><td>$'+(it.purchases.total)+'</td></tr> </tbody></table> </div> </div></div><div class="col-md-6"> <div class="panel"><div class="panel-heading"> <h5 class="panel-title">My score</h5></div><div class="table-responsive"><table class="table text-center"><thead><tr><th></th><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead><tbody><tr><td>Daily:</td><td colspan="4">'+(it.points.login)+'</td></tr><tr><td>Time sequence:</td><td>'+(it.points.seq[0])+'</td><td>'+(it.points.seq[1])+'</td><td>'+(it.points.seq[2])+'</td><td>'+(it.points.seq[3])+'</td></tr><tr><td>Referral:</td><td>'+(it.points.referral[0])+'</td><td>'+(it.points.referral[1])+'</td><td>'+(it.points.referral[2])+'</td><td>'+(it.points.referral[3])+'</td></tr><tr><td>Total:</td><td>'+(it.points.total[0])+'</td><td>'+(it.points.total[1])+'</td><td>'+(it.points.total[2])+'</td><td>'+(it.points.total[3])+'</td></tr></tbody></table></div> </div></div> </div>';return out; | |
}) | |
var SNS_VISITS_TEMPLATE = (function anonymous(it | |
) { | |
var out='<div class="row">';if(it.links.facebook){out+='<div class="col-md-12"> <div class="panel panel-white"><div class="panel-heading"> <h5 class="panel-title">Like us on Facebook</h5></div><div class="panel-body"> <a href="https://fathomless-wave-75159.herokuapp.com/sns/visit/'+(it.email)+'/facebook" target="_blank">'+(it.links.facebook)+'</a></div> </div></div>';}if(it.links.twitter){out+='<div class="col-md-12"><div class="panel panel-white"> <div class="panel-heading"><h5 class="panel-title">Retweet us on Twitter</h5> </div> <div class="panel-body"><a href="https://fathomless-wave-75159.herokuapp.com/sns/visit/'+(it.email)+'/twitter" target="_blank">'+(it.links.twitter)+'</a> </div></div></div>';}if(it.links.youtube){out+='<div class="col-md-12"><div class="panel panel-white"> <div class="panel-heading"><h5 class="panel-title">Like us on YouTube</h5> </div> <div class="panel-body"><a href="https://fathomless-wave-75159.herokuapp.com/sns/visit/'+(it.email)+'/youtube" target="_blank">'+(it.links.youtube)+'</a> </div></div></div>';}out+='</div>';return out; | |
}) | |
})(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#zl-preloader { | |
width: 64px; | |
margin: 0 auto; | |
padding-top: 50px; | |
} | |
.lds-ring { | |
display: inline-block; | |
position: relative; | |
width: 64px; | |
height: 64px; | |
} | |
.lds-ring div { | |
box-sizing: border-box; | |
display: block; | |
position: absolute; | |
width: 51px; | |
height: 51px; | |
margin: 6px; | |
border: 6px solid #ccc; | |
border-radius: 50%; | |
animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; | |
border-color: #ccc transparent transparent transparent; | |
} | |
.lds-ring div:nth-child(1) { | |
animation-delay: -0.45s; | |
} | |
.lds-ring div:nth-child(2) { | |
animation-delay: -0.3s; | |
} | |
.lds-ring div:nth-child(3) { | |
animation-delay: -0.15s; | |
} | |
@keyframes lds-ring { | |
0% { | |
transform: rotate(0deg); | |
} | |
100% { | |
transform: rotate(360deg); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment