860 lines
28 KiB
HTML
860 lines
28 KiB
HTML
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,minimal-ui">
|
|
|
|
<style>
|
|
|
|
.oc[data-darkmode="true"] .card {
|
|
background: linear-gradient(var(--bg-gray), #657183);
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .additional {
|
|
background: linear-gradient(#337ab7, #657183);
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .general .dler-title {
|
|
color: #dfdfdf;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .general .dler-result {
|
|
color: #dfdfdf;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .general .dler-result2 {
|
|
color: #dfdfdf;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .general h1 {
|
|
color: #dfdfdf;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .additional .user-card::after {
|
|
border-left: 2px solid #ffffff33;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .additional .more-info h1 {
|
|
color: #ededed;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .additional .coords {
|
|
color: #ededed;
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .general .dler-info::-webkit-scrollbar-thumb {
|
|
background: rgba(255,255,255,0.3);
|
|
}
|
|
|
|
.oc[data-darkmode="true"] .card .general .dler-info::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(255,255,255,0.4);
|
|
}
|
|
|
|
.oc .dler-main-container {
|
|
background: var(--bg-white);
|
|
border: 1px solid var(--border-light);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: var(--shadow-md);
|
|
margin: 16px auto;
|
|
width: 100%;
|
|
transition: all var(--transition-fast);
|
|
}
|
|
|
|
.oc .center {
|
|
width: 100%;
|
|
background: var(--bg-white);
|
|
border: 1px solid var(--border-light);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: var(--shadow-sm);
|
|
padding: 12px;
|
|
transition: all var(--transition-fast);
|
|
}
|
|
|
|
.oc .card {
|
|
width: 100%;
|
|
height: 250px;
|
|
background-color: #fff;
|
|
background: linear-gradient(#f8f8f8, #fff);
|
|
box-shadow: 0 8px 16px -8px rgba(0,0,0,0.4);
|
|
border-radius: 6px;
|
|
position: relative;
|
|
}
|
|
|
|
.oc .card h1 {
|
|
text-align: center;
|
|
}
|
|
|
|
.oc .card .additional {
|
|
position: absolute;
|
|
width: 150px;
|
|
height: 100%;
|
|
background: linear-gradient(#337ab7, #fefefe);
|
|
transition: width 0.5s cubic-bezier(0.4, 0.0, 0.2, 1), border-radius 0.5s ease;
|
|
overflow: hidden;
|
|
z-index: 2;
|
|
display: flex;
|
|
align-items: stretch;
|
|
border-radius: var(--radius-lg);
|
|
}
|
|
|
|
.oc .card .additional.expanded {
|
|
width: 100%;
|
|
}
|
|
|
|
.oc .card .additional.collapsed {
|
|
width: 150px;
|
|
}
|
|
|
|
.oc .card .additional .user-card {
|
|
width: 150px;
|
|
height: 100%;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.oc .card .additional .user-card::after {
|
|
content: "";
|
|
display: block;
|
|
position: absolute;
|
|
top: 10%;
|
|
right: -2px;
|
|
height: 80%;
|
|
border-left: 2px solid rgba(0,0,0,0.025);
|
|
}
|
|
|
|
.oc .card .additional .user-card .img {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.oc .card .additional .user-card img {
|
|
width: 60%;
|
|
max-width: 90px;
|
|
border-radius: 50%;
|
|
position: relative;
|
|
top: auto;
|
|
left: auto;
|
|
bottom: auto;
|
|
}
|
|
|
|
.oc .card .additional .more-info {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
padding: 1rem;
|
|
text-align: center;
|
|
transition: opacity 0.3s ease, visibility 0.3s ease;
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
overflow: visible;
|
|
}
|
|
|
|
.oc .card .additional.expanded .more-info {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
}
|
|
|
|
.oc .card .additional.collapsed .more-info {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.oc .card .additional .more-info h1 {
|
|
color: #fff;
|
|
margin: 0.5rem 0;
|
|
font-size: 2.5rem;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
border-bottom: none;
|
|
position: relative;
|
|
line-height: 1.2;
|
|
padding-top: 0.2rem;
|
|
}
|
|
|
|
.oc .card .additional .more-info h1::after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -0.2rem;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
width: 60%;
|
|
height: 1px;
|
|
background-color: #eee;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.oc .card .additional .coords {
|
|
color: #fff;
|
|
font-size: 1rem;
|
|
line-height: 1.4;
|
|
margin: 0;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.oc .card .additional.expanded + .general {
|
|
margin-left: 0;
|
|
opacity: 0;
|
|
}
|
|
|
|
.oc .card .additional.collapsed + .general {
|
|
opacity: 1;
|
|
}
|
|
|
|
.oc .card .general {
|
|
width: auto;
|
|
height: 100%;
|
|
position: relative;
|
|
margin-left: 180px;
|
|
top: 0;
|
|
right: 0;
|
|
z-index: 1;
|
|
overflow: hidden;
|
|
padding-top: 0;
|
|
padding-right: 10px;
|
|
transition: margin-left 0.5s ease, opacity 0.5s ease;
|
|
opacity: 1;
|
|
}
|
|
|
|
.oc .card .general h1 {
|
|
font-size: 30px;
|
|
text-align: center;
|
|
padding-top: 10px;
|
|
margin: 0 0 0 -15%;
|
|
line-height: 35px;
|
|
color: black;
|
|
}
|
|
|
|
.oc .card .general .dler-info {
|
|
top: 8%;
|
|
width: 90%;
|
|
height: 65%;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 120px;
|
|
gap: 5%;
|
|
position: absolute;
|
|
margin: 0 auto;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
position: relative;
|
|
}
|
|
|
|
.oc .card .general .dler-info-left {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
overflow: visible;
|
|
}
|
|
|
|
.oc .card .general .dler-info-center {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
overflow: visible;
|
|
}
|
|
|
|
.oc .card .general .dler-info-right {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-width: 100px;
|
|
width: 100%;
|
|
height: 100%;
|
|
padding-right: 10px;
|
|
}
|
|
|
|
.oc .card .general .dler-btn-container {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex: 1;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.oc .card .general .dler-info p {
|
|
padding: 4px 0 !important;
|
|
text-align: left;
|
|
margin-bottom: 0;
|
|
line-height: 25px;
|
|
min-height: 25px;
|
|
}
|
|
|
|
.oc .card .general .dler-info div {
|
|
position: relative;
|
|
}
|
|
|
|
.oc .card .general .dler-title {
|
|
font-weight: bold;
|
|
color: #444;
|
|
font-size: 15px;
|
|
display: inline-block;
|
|
width: 45%;
|
|
overflow: hidden;
|
|
vertical-align: bottom;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
line-height: 25px;
|
|
height: 25px;
|
|
text-align: left;
|
|
}
|
|
|
|
.oc .card .general .dler-result {
|
|
color: #444;
|
|
font-size: 15px;
|
|
white-space: nowrap;
|
|
display: inline-block;
|
|
width: 55%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
vertical-align: bottom;
|
|
text-align: right;
|
|
line-height: 25px;
|
|
height: 25px;
|
|
}
|
|
|
|
.oc .card .general .dler-result2 {
|
|
color: #444;
|
|
font-size: 15px;
|
|
white-space: nowrap;
|
|
display: inline-block;
|
|
width: 55%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
vertical-align: bottom;
|
|
text-align: right;
|
|
line-height: 25px;
|
|
height: 25px;
|
|
}
|
|
|
|
.oc .card .general .btn {
|
|
color: white !important;
|
|
border-color: #337ab7 !important;
|
|
background: #1473e6;
|
|
background-color: var(--primary-color) !important;
|
|
box-shadow: 0 8px 16px -8px rgba(0,0,0,0.4);
|
|
border-radius: 6px;
|
|
width: 90px;
|
|
height: 90px !important;
|
|
font-size: 15px;
|
|
font-weight: bold;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
appearance: button;
|
|
-webkit-appearance: button;
|
|
border: none !important;
|
|
cursor: pointer;
|
|
transition: all var(--transition-fast);
|
|
text-shadow: none !important;
|
|
}
|
|
|
|
.oc .card .general .btn:hover {
|
|
background: #2563eb !important;
|
|
}
|
|
|
|
.oc .card .general .more {
|
|
font-size: 12px;
|
|
line-height: 16px;
|
|
padding: 0;
|
|
margin: 0;
|
|
pointer-events: auto;
|
|
overflow: hidden;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
position: absolute;
|
|
bottom: 8px;
|
|
left: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
z-index: 10;
|
|
padding-right: 16px;
|
|
padding-bottom: 5px;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.oc .card .general .more p {
|
|
margin: 0;
|
|
font-size: 15px;
|
|
padding: 0;
|
|
color: var(--text-secondary);
|
|
text-align: right;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
min-width: 0;
|
|
flex-shrink: 1;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.oc .card .general .more a {
|
|
text-decoration: none;
|
|
color: var(--primary-color);
|
|
opacity: 0.8;
|
|
transition: opacity var(--transition-fast);
|
|
white-space: nowrap;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.oc .card .general .more a:hover {
|
|
opacity: 1;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.oc .card .general .dler-info::-webkit-scrollbar {
|
|
width: 4px;
|
|
}
|
|
|
|
.oc .card .general .dler-info::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
|
|
.oc .card .general .dler-info::-webkit-scrollbar-thumb {
|
|
background: rgba(0,0,0,0.2);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.oc .card .general .dler-info::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(0,0,0,0.3);
|
|
}
|
|
|
|
@media screen and (max-width: 1200px) {
|
|
.oc .dler-main-container {
|
|
margin: 11px auto;
|
|
width: calc(100% - 32px);
|
|
}
|
|
|
|
.oc .card .additional.collapsed {
|
|
width: 140px;
|
|
}
|
|
|
|
.oc .card .additional .user-card {
|
|
width: 140px;
|
|
}
|
|
|
|
.oc .card .additional .user-card img {
|
|
max-width: 80px;
|
|
}
|
|
|
|
.oc .card .additional .more-info h1 {
|
|
font-size: 1.8rem;
|
|
}
|
|
|
|
.oc .card .additional .coords {
|
|
font-size: 0.95rem;
|
|
}
|
|
|
|
.oc .card .general {
|
|
margin-left: 120px;
|
|
padding-right: 8px;
|
|
}
|
|
|
|
.oc .card .general .more {
|
|
bottom: 6px;
|
|
padding-right: 12px;
|
|
}
|
|
|
|
}
|
|
|
|
@media screen and (max-width: 768px) {
|
|
.oc .dler-main-container {
|
|
margin: 10px auto;
|
|
width: 100%;
|
|
}
|
|
|
|
.oc .card .additional.collapsed {
|
|
width: 125px;
|
|
}
|
|
|
|
.oc .card .additional .user-card {
|
|
width: 125px;
|
|
}
|
|
|
|
.oc .card .additional .user-card img {
|
|
max-width: 70px;
|
|
}
|
|
|
|
.oc .card .additional .more-info h1 {
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.oc .card .additional .coords {
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
.oc .card .general {
|
|
margin-left: 110px;
|
|
padding-right: 6px;
|
|
}
|
|
|
|
.oc .card .general h1 {
|
|
font-size: 24px;
|
|
line-height: 30px;
|
|
margin: 0;
|
|
}
|
|
|
|
.oc .card .general .dler-info {
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: auto auto auto;
|
|
gap: 12px;
|
|
padding-right: 8px;
|
|
height: 50%;
|
|
}
|
|
|
|
.oc .card .general .dler-info-right {
|
|
justify-content: flex-start;
|
|
padding-top: 8px;
|
|
gap: 12px;
|
|
}
|
|
|
|
.oc .card .general .btn {
|
|
width: 80px !important;
|
|
height: 80px !important;
|
|
font-size: 14px;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.oc .card .general .dler-title {
|
|
font-size: 14px;
|
|
width: 50%;
|
|
}
|
|
|
|
.oc .card .general .dler-result,
|
|
.oc .card .general .dler-result2 {
|
|
font-size: 14px;
|
|
width: 50%;
|
|
}
|
|
|
|
.oc .card .general .more {
|
|
bottom: 4px;
|
|
padding-right: 10px;
|
|
}
|
|
|
|
}
|
|
|
|
@media screen and (max-width: 575px) {
|
|
.oc .center {
|
|
padding: 8px;
|
|
}
|
|
|
|
.oc .card .additional.collapsed {
|
|
width: 115px;
|
|
}
|
|
|
|
.oc .card .additional .user-card {
|
|
width: 115px;
|
|
}
|
|
|
|
.oc .card .additional .user-card img {
|
|
max-width: 60px;
|
|
}
|
|
|
|
.oc .card .additional .more-info h1 {
|
|
font-size: 1.3rem;
|
|
}
|
|
|
|
.oc .card .additional .coords {
|
|
font-size: 0.7rem;
|
|
}
|
|
|
|
.oc .card .general {
|
|
margin-left: 120px;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.oc .card .general .dler-info {
|
|
height: 50%;
|
|
}
|
|
|
|
.oc .card .general h1 {
|
|
font-size: 18px;
|
|
line-height: 26px;
|
|
margin: 0;
|
|
}
|
|
|
|
.oc .card .general .dler-title {
|
|
font-size: 12px;
|
|
width: 50%;
|
|
}
|
|
|
|
.oc .card .general .dler-result,
|
|
.oc .card .general .dler-result2 {
|
|
font-size: 12px;
|
|
width: 50%;
|
|
}
|
|
|
|
.oc .card .general .more {
|
|
bottom: 2px;
|
|
padding-right: 8px;
|
|
}
|
|
|
|
.oc .card .general .btn {
|
|
width: 60px !important;
|
|
height: 60px !important;
|
|
font-size: 10px;
|
|
padding: 0 !important;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<fieldset class="cbi-section">
|
|
<table width="100%"><tr><td>
|
|
<div class="oc">
|
|
<div class="dler-main-container">
|
|
<div class="center">
|
|
<div id="card" class="card">
|
|
<div id="additional" class="additional">
|
|
<div class="user-card">
|
|
<div class="img">
|
|
<img id="dler_logo" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAAEcq2jCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ4IDc5LjE2NDAzNiwgMjAxOS8wOC8xMy0wMTowNjo1NyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjFFQjY1RjRCMjJENDExRUM5NjlEQURCQTU4RDMyNUM3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjFFQjY1RjRDMjJENDExRUM5NjlEQURCQTU4RDMyNUM3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MUVCNjVGNDkyMkQ0MTFFQzk2OURBREJBNThEMzI1QzciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MUVCNjVGNEEyMkQ0MTFFQzk2OURBREJBNThEMzI1QzciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5CHITsAAACx1BMVEVjY2P+/v79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" loading="lazy" title="Dler Cloud" alt="Dler Cloud" onerror="return imgerrorfuns(this,this.src)" onclick="return show_more()" />
|
|
</div>
|
|
</div>
|
|
<div class="more-info" id="more_info">
|
|
<h1>Dler Cloud</h1>
|
|
<div class="coords" id="dler_it">
|
|
<%:Simple & trustworthy%>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="general">
|
|
<h1 id="dler-plan"></h1>
|
|
<div class="dler-info">
|
|
<div class="dler-info-left">
|
|
<div>
|
|
<p>
|
|
<span class="dler-title" title="<%:Plan Expiration Time%>"><%:Plan Expiration Time%>:</span><span class="dler-result" id="dler-plantime" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
<p>
|
|
<span class="dler-title" title="<%:Account Balances%>"><%:Account Balances%>:</span><span class="dler-result" id="dler-money" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
<p>
|
|
<span class="dler-title" title="<%:Aff Balances%>"><%:Aff Balances%>:</span><span class="dler-result" id="dler-affmoney" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
<p>
|
|
<span class="dler-title" title="<%:Account Integral%>"><%:Account Integral%>:</span><span class="dler-result" id="dler-integral" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dler-info-center">
|
|
<div>
|
|
<p>
|
|
<span class="dler-title" title="<%:Today Used%>"><%:Today Used%>:</span><span class="dler-result2" id="dler-today-used" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
<p>
|
|
<span class="dler-title" title="<%:Plan Used%>"><%:Plan Used%>:</span><span class="dler-result2" id="dler-used" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
<p>
|
|
<span class="dler-title" title="<%:Plan Unused%>"><%:Plan Unused%>:</span><span class="dler-result2" id="dler-unused" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
<p>
|
|
<span class="dler-title" title="<%:Plan Traffic%>"><%:Plan Traffic%>:</span><span class="dler-result2" id="dler-traffic" title="<%:Collecting data...%>"><%:Collecting data...%></span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dler-info-right">
|
|
<div class="dler-btn-container">
|
|
<input type="button" class="btn" value="<%:Checkin%>" onclick="return dler_checkin_btn(this)">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="more">
|
|
<p>Powered by <a class="myip-footer" onclick="return web_dler()" href="javascript:void(0);">dlercloud.com</a></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</td></tr></table>
|
|
</fieldset>
|
|
|
|
<script type="text/javascript">//<![CDATA[
|
|
var dler_plan = document.getElementById('dler-plan');
|
|
var dler_plantime = document.getElementById('dler-plantime');
|
|
var dler_money = document.getElementById('dler-money');
|
|
var dler_affmoney = document.getElementById('dler-affmoney');
|
|
var dler_today_used = document.getElementById('dler-today-used');
|
|
var dler_used = document.getElementById('dler-used');
|
|
var dler_unused = document.getElementById('dler-unused');
|
|
var dler_traffic = document.getElementById('dler-traffic');
|
|
var dler_integral = document.getElementById('dler-integral');
|
|
var dler_checkin = document.getElementById('dler-checkin');
|
|
var obj = document.getElementById("additional");
|
|
var card = document.getElementById("card");
|
|
var dler_it = document.getElementById("dler_it");
|
|
var more_info = document.getElementById("more_info");
|
|
var dler_logo = document.getElementById("dler_logo");
|
|
var showmore=1;
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
DarkModeDetector.init();
|
|
});
|
|
|
|
window.addEventListener('DOMContentLoaded', function() {
|
|
setTimeout(function() {
|
|
obj.classList.add('collapsed');
|
|
obj.classList.remove('expanded');
|
|
}, 100);
|
|
});
|
|
|
|
XHR.get('<%=luci.dispatcher.build_url("admin", "services", "openclash", "dler_info")%>', null, function(x, status) {
|
|
if (x && x.status == 200 && status.dler_info != "error") {
|
|
dler_plan.innerHTML = status.dler_info.plan;
|
|
dler_plantime.innerHTML = status.dler_info.plan_time;
|
|
dler_plantime.title = status.dler_info.plan_time;
|
|
dler_money.innerHTML = status.dler_info.money;
|
|
dler_money.title = status.dler_info.money;
|
|
dler_affmoney.innerHTML = status.dler_info.aff_money;
|
|
dler_affmoney.title = status.dler_info.aff_money;
|
|
dler_today_used.innerHTML = status.dler_info.today_used;
|
|
dler_today_used.title = status.dler_info.today_used;
|
|
dler_used.innerHTML = status.dler_info.used;
|
|
dler_used.title = status.dler_info.used;
|
|
dler_unused.innerHTML = status.dler_info.unused;
|
|
dler_unused.title = status.dler_info.unused;
|
|
dler_traffic.innerHTML = status.dler_info.traffic;
|
|
dler_traffic.title = status.dler_info.traffic;
|
|
dler_integral.innerHTML = status.dler_info.integral;
|
|
dler_integral.title = status.dler_info.integral;
|
|
show_info();
|
|
}
|
|
else {
|
|
show_less();
|
|
}
|
|
});
|
|
|
|
XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "services", "openclash", "dler_info")%>', null, function(x, status) {
|
|
if (x && x.status == 200 && status.dler_info != "error") {
|
|
dler_plan.innerHTML = status.dler_info.plan;
|
|
dler_plantime.innerHTML = status.dler_info.plan_time;
|
|
dler_plantime.title = status.dler_info.plan_time;
|
|
dler_money.innerHTML = status.dler_info.money;
|
|
dler_money.title = status.dler_info.money;
|
|
dler_affmoney.innerHTML = status.dler_info.aff_money;
|
|
dler_affmoney.title = status.dler_info.aff_money;
|
|
dler_today_used.innerHTML = status.dler_info.today_used;
|
|
dler_today_used.title = status.dler_info.today_used;
|
|
dler_used.innerHTML = status.dler_info.used;
|
|
dler_used.title = status.dler_info.used;
|
|
dler_unused.innerHTML = status.dler_info.unused;
|
|
dler_unused.title = status.dler_info.unused;
|
|
dler_traffic.innerHTML = status.dler_info.traffic;
|
|
dler_traffic.title = status.dler_info.traffic;
|
|
dler_integral.innerHTML = status.dler_info.integral;
|
|
dler_integral.title = status.dler_info.integral;
|
|
if (showmore != 0) {
|
|
show_info();
|
|
}
|
|
else {
|
|
show_less();
|
|
}
|
|
}
|
|
else {
|
|
show_less();
|
|
}
|
|
});
|
|
|
|
function dler_checkin_btn(btn)
|
|
{
|
|
XHR.get('<%=luci.dispatcher.build_url("admin", "services", "openclash", "dler_checkin")%>', null, function(x, status) {
|
|
if ( x && x.status == 200 && status.dler_checkin != "error") {
|
|
if (status.dler_checkin.ret == 200) {
|
|
alert("<%:Dler Cloud Checkin Successful, Result:%>\n\n"+
|
|
status.dler_checkin.data.checkin);
|
|
}
|
|
else if (status.dler_checkin.msg) {
|
|
alert("<%:Dler Cloud Checkin Failed, Result:%>\n\n"+
|
|
status.dler_checkin.msg);
|
|
}
|
|
else {
|
|
alert("<%:Dler Cloud Checkin Failed! Please Check And Try Again...%>")
|
|
}
|
|
}
|
|
else {
|
|
alert("<%:Dler Cloud Checkin Failed! Please Check And Try Again...%>")
|
|
}
|
|
});
|
|
}
|
|
|
|
function web_dler()
|
|
{
|
|
url='https://bit.ly/32mrABp';
|
|
window.open(url);
|
|
}
|
|
|
|
function show_more()
|
|
{
|
|
if (obj.classList.contains('expanded')) {
|
|
show_info();
|
|
showmore = 1;
|
|
}
|
|
else {
|
|
if (dler_plan.innerHTML != "") {
|
|
show_less();
|
|
showmore = 0;
|
|
}
|
|
else {
|
|
web_dler();
|
|
}
|
|
}
|
|
}
|
|
|
|
function show_less()
|
|
{
|
|
if (!obj.classList.contains('expanded')) {
|
|
obj.classList.add('expanded');
|
|
obj.classList.remove('collapsed');
|
|
}
|
|
|
|
var rdmdl = Math.floor(Math.random() * 6) + 1;
|
|
if (rdmdl == 1) {
|
|
dler_it.innerHTML = '<%:Simple & trustworthy%>';
|
|
}
|
|
if (rdmdl == 2) {
|
|
dler_it.innerHTML = '<%:Cross-platform Support%>';
|
|
}
|
|
if (rdmdl == 3) {
|
|
dler_it.innerHTML = '<%:Global Acceleration Network%>';
|
|
}
|
|
if (rdmdl == 4) {
|
|
dler_it.innerHTML = '<%:Easy to Use%>';
|
|
}
|
|
if (rdmdl == 5) {
|
|
dler_it.innerHTML = '<%:Intelligent Shunting%>';
|
|
}
|
|
if (rdmdl == 6) {
|
|
dler_it.innerHTML = '<%:Perfect Technical Support%>';
|
|
}
|
|
}
|
|
|
|
function show_info()
|
|
{
|
|
if (!obj.classList.contains('collapsed')) {
|
|
obj.classList.add('collapsed');
|
|
obj.classList.remove('expanded');
|
|
}
|
|
}
|
|
|
|
function imgerrorfuns(imgobj,imgSrc)
|
|
{
|
|
setTimeout(function(){
|
|
imgobj.src=imgSrc;
|
|
},1000*10);
|
|
}
|
|
|
|
//]]></script>
|
|
</html> |