WLED/wled00/data/index_mobile.htm

837 lines
67 KiB
HTML
Raw Normal View History

2018-05-22 21:11:19 +02:00
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta content='width=device-width' name='viewport'>
<link href="images/safari-pinned-tab.svg" rel="mask-icon">
<meta content="#ffffff" name="theme-color">
<meta content="yes" name="apple-mobile-web-app-capable">
<link href='/favicon.ico' rel='shortcut icon' type='image/x-icon'>
<title>WLED 0.7.0</title>
2018-05-22 21:11:19 +02:00
<style>
*{transition-duration: 0.5s;}
body {
margin-bottom: 60px;
/* Margin bottom by footer height */
background-color: #333;
font-family: Helvetica, Verdana, sans-serif;
color: white;
background: linear-gradient(0deg, #7e8a96, #333);
background-size: 400% 400%;
}
.feedbackanim{
animation: feedback 0.3s ease;
animation-iteration-count: 1;
}
@-webkit-keyframes feedback {
0%{background-position:49% 0%}
50%{background-position:52% 100%}
100%{background-position:49% 0%}
}
@-moz-keyframes feedback {
0%{background-position:49% 0%}
50%{background-position:52% 100%}
100%{background-position:49% 0%}
}
@keyframes feedback {
0%{background-position:49% 0%}
50%{background-position:52% 100%}
100%{background-position:49% 0%}
}
.segment{
width:100%;
height:145px;
max-width:260px;
margin-left:auto;
margin-right:auto;
}
.cC {
2018-05-22 21:11:19 +02:00
width: 27px;
height: 27px;
float: left;
border: solid;
border-radius: 30px;
padding: 10px;
margin: 5px;
font-size: 23px;
}
2018-05-22 21:11:19 +02:00
#mode li {
padding: 15px;
background-color: rgba(255, 255, 255, 0);
margin: 10px;
border-color: white;
color: white;
border: solid;
text-transform: uppercase;
list-style: none;
margin-left: -37px;
border-radius: 40px;
}
#mode li a {
color: white;
text-decoration: none;
font-family: helvetica;
font-size: 19px;
display:block;
}
input[type=range] {
-webkit-appearance: none;
width: 228px;
margin-top: 10px;
background-color: rgba(0, 0, 0, 0);
}
input[type=range]:focus {
outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
width: 100%;
height: 32px;
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
background: #66d1ff;
background: linear-gradient(45deg, #66d1ff 0%, #ff6a00 100%);
border-radius: 25px;
border: 0px solid #010101;
}
input[type=range]::-webkit-slider-thumb {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
height: 26px;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
-webkit-appearance: none;
margin-top: 3.3px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
background: #66d1ff;
background: linear-gradient(45deg, #66d1ff 0%, #ff6a00 100%);
}
input[type=range]::-moz-range-track {
width: 100%;
height: 32px;
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
background: #66d1ff;
background: linear-gradient(45deg, #66d1ff 0%, #ff6a00 100%);
border-radius: 25px;
border: 0px solid #010101;
}
input[type=range]::-moz-range-thumb {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
height: 26px;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
}
input[type=range]::-ms-track {
width: 100%;
height: 32px;
cursor: pointer;
background: transparent;
border-color: transparent;
color: transparent;
}
input[type=range]::-ms-fill-lower {
background: rgba(242, 242, 242, 0.65);
border: 0px solid #010101;
border-radius: 50px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
background: rgba(255, 255, 255, 0.65);
border: 0px solid #010101;
border-radius: 50px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
height: 26px;
}
input[type=range]:focus::-ms-fill-lower {
background: rgba(255, 255, 255, 0.65);
}
input[type=range]:focus::-ms-fill-upper {
background: rgba(255, 255, 255, 0.65);
}
input[type=range] #speedslider {
-webkit-appearance: none;
width: 228px;
margin-top: 10px;
background-color: rgba(0, 0, 0, 0);
}
input[type=range]:focus #speedslider {
outline: none;
}
input[type=range]::-webkit-slider-runnable-track #speedslider {
width: 100%;
height: 32px;
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
background: #66d1ff;
background: linear-gradient(45deg, #66d1ff 0%, #ff6a00 100%);
border-radius: 25px;
border: 0px solid #010101;
}
input[type=range]::-webkit-slider-thumb #speedslider {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
height: 26px;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
-webkit-appearance: none;
margin-top: 3.3px;
}
input[type=range]:focus::-webkit-slider-runnable-track #speedslider {
background: #66d1ff;
background: linear-gradient(45deg, #66d1ff 0%, #ff6a00 100%);
}
input[type=range]::-moz-range-track #speedslider {
width: 100%;
height: 32px;
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
background: #66d1ff;
background: linear-gradient(45deg, #66d1ff 0%, #ff6a00 100%);
border-radius: 25px;
border: 0px solid #010101;
}
input[type=range]::-moz-range-thumb #speedslider {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
height: 26px;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
}
input[type=range]::-ms-track #speedslider {
width: 100%;
height: 32px;
cursor: pointer;
background: transparent;
border-color: transparent;
color: transparent;
}
input[type=range]::-ms-fill-lower #speedslider {
background: rgba(242, 242, 242, 0.65);
border: 0px solid #010101;
border-radius: 50px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper #speedslider {
background: rgba(255, 255, 255, 0.65);
border: 0px solid #010101;
border-radius: 50px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb #speedslider {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
height: 26px;
}
input[type=range]:focus::-ms-fill-lower #speedslider {
background: rgba(255, 255, 255, 0.65);
}
input[type=range]:focus::-ms-fill-upper #speedslider {
background: rgba(255, 255, 255, 0.65);
}
input[type=range] #brightslider {
-webkit-appearance: none;
width: 228px;
margin-top: 10px;
background-color: rgba(0, 0, 0, 0);
}
input[type=range]:focus #brightslider {
outline: none;
}
input[type=range]::-webkit-slider-runnable-track #brightslider {
width: 100%;
height: 32px;
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
background: #111111;
background: linear-gradient(45deg, #111111 0%, #ff6a00 100%);
border-radius: 25px;
border: 0px solid #010101;
}
input[type=range]::-webkit-slider-thumb #brightslider {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
height: 26px;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
-webkit-appearance: none;
margin-top: 3.3px;
}
input[type=range]:focus::-webkit-slider-runnable-track #brightslider {
background: #111111;
background: linear-gradient(45deg, #111111 0%, #ff6a00 100%);
}
input[type=range]::-moz-range-track #brightslider {
width: 100%;
height: 32px;
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
background: #111111;
background: linear-gradient(45deg, #111111 0%, #ff6a00 100%);
border-radius: 25px;
border: 0px solid #010101;
}
input[type=range]::-moz-range-thumb #brightslider {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
height: 26px;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
}
input[type=range]::-ms-track #brightslider {
width: 100%;
height: 32px;
cursor: pointer;
background: transparent;
border-color: transparent;
color: transparent;
}
input[type=range]::-ms-fill-lower #brightslider {
background: rgba(242, 242, 242, 0.65);
border: 0px solid #010101;
border-radius: 50px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper #brightslider {
background: rgba(255, 255, 255, 0.65);
border: 0px solid #010101;
border-radius: 50px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb #brightslider {
box-shadow: 0.4px 0.4px 0.4px #000031, 0px 0px 0.4px #00004b;
border: 2.6px solid #ffffff;
width: 26px;
border-radius: 26px;
background: rgba(255, 255, 255, 0);
cursor: pointer;
height: 26px;
}
input[type=range]:focus::-ms-fill-lower #brightslider {
background: rgba(255, 255, 255, 0.65);
}
input[type=range]:focus::-ms-fill-upper #brightslider {
background: rgba(255, 255, 255, 0.65);
}
.oos {
2018-05-22 21:11:19 +02:00
position: relative;
width: 58px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}
.oos-chk {
2018-05-22 21:11:19 +02:00
display: none;
}
.oos-label {
2018-05-22 21:11:19 +02:00
display: block;
overflow: hidden;
cursor: pointer;
height: 24px;
padding: 0;
line-height: 24px;
border: 2px solid #999999;
border-radius: 24px;
background-color: #EEEEEE;
transition: background-color 0.3s ease-in;
}
.oos-label:before {
2018-05-22 21:11:19 +02:00
content: "";
display: block;
width: 24px;
margin: 0px;
background: #FFFFFF;
position: absolute;
top: 0;
bottom: 0;
right: 32px;
border: 2px solid #999999;
border-radius: 24px;
transition: all 0.3s ease-in 0s;
}
.oos-chk:checked + .oos-label {
2018-05-22 21:11:19 +02:00
background-color: #34A7C1;
}
.oos-chk:checked + .oos-label,
.oos-chk:checked + .oos-label:before {
2018-05-22 21:11:19 +02:00
border-color: #34A7C1;
}
.oos-chk:checked + .oos-label:before {
2018-05-22 21:11:19 +02:00
right: 0px;
}
section.range-slider {
position: relative;
width: 100%;
height: 50px;
text-align: center;
}
section.range-slider input {
pointer-events: none;
position: absolute;
overflow: hidden;
left: 0;
top: 30px;
width: 100%;
outline: none;
height: 32px;
margin: 0;
padding: 0;
}
section.range-slider input::-webkit-slider-thumb {
pointer-events: all;
position: relative;
z-index: 1;
outline: 0;
}
section.range-slider input::-moz-range-thumb {
pointer-events: all;
position: relative;
z-index: 10;
-moz-appearance: none;
width: 9px;
}
section.range-slider input::-moz-range-track {
position: relative;
z-index: -1;
background-color: rgba(0, 0, 0, 1);
border: 0;
}
section.range-slider input:last-of-type::-moz-range-track {
-moz-appearance: none;
background: none transparent;
border: 0;
}
section.range-slider input[type=range]::-moz-focus-outer {
border: 0;
}
.cyclebtns li{
width:30%;
float:left;
text-align:center;
border:solid;
border-color:white;
margin: 1px;
padding-top: 10px;
padding-bottom: 10px;
border-radius: 29px;
list-style:none;
border-radius:30px;
}
li {
box-shadow: rgba(255,255,255,0) 0 0 0px;
}
.btns{
height:50px;
width:50px;
float:left;
margin-top:-10px;
opacity:0.5;
2018-05-22 21:11:19 +02:00
}
</style>
</head>
<body style="padding:30px;">
<main class="container" role="main" style="max-width:280px; margin-left:auto; margin-right:auto; text-align:center;">
<div style="width:100%; max-width:260px; margin-left:auto; margin-right:auto; font-size:12px; margin-bottom:20px;">
<div class="btns" style="width:70%; float:left; text-align:left;">
<p>WLED</p>
<a href="#" onclick="togglePower();"><img src="data:image/png;base64,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
<a href="/settings"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAHxtJREFUeNrsnQu8VWPex1fXIeWYVEanQiklypRQY7qYmoowKiVe1yaGSDQMpiZCE9NoyhhGvBGmjHLpSBcqpItySSmdLidyihJqUOmi9/99Pvt33vUua++91t77HM28rc9nd077rP2s5/lff//L8+xy+/bt8w5c+89V/gAJDjDkwHWAIf8+V8XgG9999533xRdfePuDb2Eue/fu9Xbv3u1+L1eunFe5cmWvQoUK3qGHHupVrFjxILutsr0q6CP22mX37ty2bds+1vDtt9+6Mfis3e9e5cuXd/9PK612X/Xq1SPdW2oMgRknn3yyZwsqcwZAQIi3a9cu9/shhxzi1apVq1qDBg2OqVOnTpO6des2rlevXv2DDz443whV40c/+lFVuw+mVEoMsddeO40h32zevPlL+/mJXUXr168vtNfKdevWrdm4ceOWL7/80o0PcypVquQIH3bVrFnTe/vtt71q1aqVGQ3KBTXhs88+8+rXr+99/fXXP4hWGBMq//SnPz2pefPmHZo2bdo2Pz+/WV5eXr4Rr5wYpp+pLrTISZwRHQlHw7Zv375l06ZNK1auXDl/yZIls5cuXbpow4YNSSXv8MMP94qKipw2/qAMadSokbd169YymwQS2KpVq9adO3fubs8+64gjjmiC1O7Zs8eZK+YIUSEy7/slOjh/v3kR42AGLzEIreC+r776qriwsHD23LlzJ82ZM+cV06od/rFsHt6qVav+/zDEzFD17t2792rbtu1lpgmnMhfMFUSE+LL3MAWNxdR8/vnnzqxiUnlv586djnHSCjNjXpUqVTzTKu/HP/6xk3L8AETlbzyD+3kxtnySjbt6wYIFE6ZMmTLeNGct45m59FavXv2fzxAb/4gLLrjgytatW/czYtUVUSEMBIIhEN1svpNQfn766afev/71L8cAma2gRvg1hvdFcDQQf3DUUUd5DRs29MwneT/5yU+cpkgLefZBBx2EQHxl5uzpp556avTatWvf//jjj937/5EMqV27dtWLLrromi5dugw0X3Hkjh07nCmRlJrJ8JYtW+Yc6Zo1axxTID6E9aOjqKiHtekF4TUWDII5J510kmf+yjOw4N4HkXEvDLB7d5gwPGY/77E5fcTfYWAur2uvvdY7+uijy54hLKZ3797nGTPuMkk93pyrYwQLh1BowWuvvea9++67ziRxwaSo8DQTOI1WwKCqVat6xx9/vNeuXTvPgIRDdjBG87P5bCkoKBgxbty4MTbX3bmcx+uvv+79/Oc/L1uGNG7cuPb1119/j0nif7FQGIAthxhmGrzp06d7y5cvd0TgfaGjsox1eDaMP+aYY7xOnTp5P/vZzxyjMI8J5OcVFxfPf+CBB26YPXv2olw9e968eV6bNm3KjiG9evU6u1+/fn+1xdX75ptvnMpjemDA888/77333nuOIDCiLIOvZOYNrUFggP3nnHOOI5ZMGRprc99pTn/ImDFjRqLl/zYMMVRSbtCgQcMMxg6WE7Zgzo09efJk79VXX3VoCpPwQzMi7BLSw78Y+HD0wN9BKzRnxYoVk++6666rzOl/vt8zxJxl3uDBgx81e9zDcL4zQWgGDzfk4lnk7JiTLDreXy7ogjABoc8991ynMWg32sJ7Brvfv/vuuy944403lueSITmlijGyzqhRo2accMIJPYCoqDnSNnbsWO8vf/mLt2XLFmeP93dmCDYjOJgwBGnEiBEOesMMzJVpygl33HHHrLPPPrvdfpntNU43GD169EwLpk7FXzBxtGH48OHeSy+95JjD69/tQsMRIgCIMcB766233P8RNPvbEb///e9f7NOnz1n7FUNatmxZ32zqdJOaJlJz4ok777zTW7lypVtArnxFnCx0LjPWrIlMwciRI71p06Y57QGQmG+pOmDAgEnGlG77BUPMTNUeNmzYi+YnjsW+QvyFCxd69957rwvsmHg2BOQ9Fo5E4lgVI0RFTXxGmYBsGYSGMwYm+J///GfJ/238gwzaT+zevXuHnKff41wW4VY12zo5Ly/PaQbMMCfnGV53BIhrooJaJEaAbICiBHDkpiZMmODeT+WLYMavfvUr77DDDvOWLl3qffjhh05AFPVnTLBExoA58AzTDDcXW/8h11133TPmZzrMnz9/WZkzBBX+wx/+8N9HHnnkafgMaYaYkW2aAdjJMy6//HKvSZMmLhcFTGZczCDQmWcmg6116tTxTGIdMw1+O3NDXgpCfvTRR1nND4Ywl0mTJjkfAzRGE00ADx8yZMik/v37n15UVPRZmZqsG2+8cXCzZs3OlwN///33c8YMaQfjnn766V5+fr57T+anS5cuTlKT1USYQ8eOHZ25BHojyWR/Tz31VKdhmL1cpINgyjPPPONNnTrVPYtxLQZrZL7zMftZvswYYlCvo73uIP1NlL1x40bv/vvvd3AwVwk4FgwDiIf89h/pJ04yIOGIHfQLEL927doO3yslIgYzX8aDkekKXFHnyHrHjx/vvfnmm06AmPOxxx57pjn628qEIWbLDzdbOdYeXF5phQcffNBlamFOLuMAOfIwX/HLX/7y/2Ro/QwhUUgtJOj8VVfR2KqjZAuLef7DDz/sTCE04BlnnXXW0K5du7YpdYYY5++tVq3a0UgYD584caKDuHHQlHxEKtQjomESg86e9y34dL4FiScIRTu5Fyfetm1bR/zgeJg77hODlZKPO7fghZbgo0BfCAjj2xwrmi95yHxslVJjSLdu3TqaHb6CRcEA1FSYPM4FsZR6T2U6+BtmKaghEAvJvOKKK5yPOeWUU7zWrVu7+gaoBwAQlH6ZQF6qqfBSGl7jQlCAQFymQAP86HPPPecElXFtHideddVVN5cKyjKnWLlv374jExGqk4gnn3yyZLFRLwhCmttwu6t/PP300yWp96BEQxSeExZUMg+z1SC9kvtlovhbmL1Hk2QC/WOqash7IDLQGZr/8ssvO78QNahFyF588UUnGGgvGnvGGWfcNGXKlKfeeeed1TnVkIsvvrivOcvmTJz4gvQ5MDJOrAExqNQNGjTIq1evnosTbrvtNvc7k/dLpBwy6CgsEJR0Q3xe3M//g6YqiNrkeP3PQuOB0OYbvV//+tfO7PHTiOn+FlVTEFTm8o9//KNEKAwNVjFBHha1zhOJIWYHDzVUdSuTQ5Kp8L3yyiuxas0QiuDupptucvVsxuLVtGlTJ+VIppw47yP9t9xyizNHuYCpaAGxCekcnD7z0RxatWrlcm7t27d3fkbC8Jvf/MbB5zhRPvRZsWKFi5OgD+tp0aJFLxu7Vc5MVu/evS83qamrXq0XXnjBPSiq70A6iRuuvPJKRxQhHWkNUsviUXMYDRMUR6hqFzXCT0U4CEsN++abby7xf4ADNBUJFoDgpUwDfqqwsNDbtGlTJEjPZ7mvoKDAxT2szUxv+QsvvPCWOXPm9EiX9knLkBo1ahxsEPM6CAf3qfaR8YyjHYKnSA2S7yegfAUv6suUTyEOEhzGDKU+BDcFDPhdcYH/b0HnLlMCsWC80JzaTYPoiUz1+vXrYwEXPrdhwwbPGOD8EbQ77rjjzrHnnbhw4cJlWTHETMk51atXb4D0QAhq4BArbj4IaZsxY4ZjiGxzGJyVJIctkheOGZNJVwqEoimCBUNQtfxgEjGPtPyYuQ2NV1KZQXWefPDBBw64SGPUWhR1vbNnz3ZrTRTkKp533nlXG0OuyZghDNqlS5d+MABi0FZJXSCTAFDNziwQppAO8UfSyQgjRpAcpDNl0aJFTvpEUH9rkDLD0hacc+PGjb0OHTq4fmWIHMUEMk8E8KGHHnKCI2sgOkRhirSE+RLE8tyWLVuebwBmiAnS5xk59WbNmjU2SWuL5DJJMrlMNNOKH2MQyI0bN66kOS1KDQLC/O53v3OJQbSC5wsxQSwEBOHhJ9Ko9yEmCU+qfUOGDHH9XrzP51P5GsYCK
<a onclick="toggleNight();"><img src="data:image/png;base64,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
2018-05-22 21:11:19 +02:00
</div>
<div style="width:30%; float:left; text-align:right;">
2018-05-22 21:11:19 +02:00
<p style="text-align: right; margin-bottom: 5px;">FX 2nd Color</p>
<div class="oos" style="float:right;">
<input class="oos-chk" id="myoos" name="oos" type="checkbox"> <label class="oos-label" for="myoos"></label>
2018-05-22 21:11:19 +02:00
</div>
</div>
</div>
<div id="color-picker-container" style="margin-left: auto; margin-right: auto; width:280px;"></div>
<div>
<p style="margin-bottom: -4px;">Brightness</p><input id="brightslider" max="255" min="0" type="range" value="222">
</div>
<div class="row segment" style="">
<div class="cC" onclick="pC('#ff0000');" style="background-color:#ff0000;">&nbsp;</div>
<div class="cC" onclick="pC('#ff4d00');" style="background-color:#ff4d00;">&nbsp;</div>
<div class="cC" onclick="pC('#ffc800');" style="background-color:#ffc800;">&nbsp;</div>
<div class="cC" onclick="pC('#08ff00');" style="background-color:#08ff00;">&nbsp;</div><br>
<div class="cC" onclick="pC('#0000ff');" style="background-color:#0000ff;">&nbsp;</div>
<div class="cC" onclick="pC('#b700ff');" style="background-color:#b700ff;">&nbsp;</div>
<div class="cC" onclick="pC('#ff00ee');" style="background-color:#ff00ee;">&nbsp;</div>
<div class="cC" onclick="pC('#ffffff');" style="background-color:#ffffff;">&nbsp;</div>
2018-05-22 21:11:19 +02:00
</div>
<div class="row segment" style="height:250px;">
<div style="height: 51px;">
<p style="text-align: right; margin-bottom: 5px;">Edit Presets</p>
<div class="oos" style="float:right;">
<input class="oos-chk oos-chk-ps" id="myoos-ps" name="oos-ps" type="checkbox"> <label class="oos-label" for="myoos-ps"></label>
2018-05-22 21:11:19 +02:00
</div>
</div>
<p style="text-align:center;">Presets</p>
<div class="cC" onclick="ps(1);">1</div>
<div class="cC" onclick="ps(2);">2</div>
<div class="cC" onclick="ps(3);">3</div>
<div class="cC" onclick="ps(4);">4</div><br>
<div class="cC" onclick="ps(5);">5</div>
<div class="cC" onclick="ps(6);">6</div>
<div class="cC" onclick="ps(7);">7</div>
<div class="cC" onclick="ps(8);">8</div><br>
<div class="cC" onclick="ps(9);">9</div>
<div class="cC" onclick="ps(10);">10</div>
<div class="cC" onclick="ps(11);">11</div>
<div class="cC" onclick="ps(12);">12</div><br>
<div class="cC" onclick="ps(13);">13</div>
<div class="cC" onclick="ps(14);">14</div>
<div class="cC" onclick="ps(15);">15</div>
<div class="cC" onclick="ps(16);">16</div>
2018-05-22 21:11:19 +02:00
</div>
<div class="row segment" style="height:50px; padding-top:100px;">
<p style="text-align: right; margin-bottom: 5px; padding:10px; padding-bottom:0px;">Cycle Mode</p>
<div class="oos" style="float:right;">
<input class="oos-chk oos-chk-cy" id="myoos-cy" name="oos-cy" onclick="toggleCycle();" type="checkbox"> <label class="oos-label" for="myoos-cy"></label>
2018-05-22 21:11:19 +02:00
</div>
</div>
<p style="padding:15px; padding-bottom:0px;">Cycle Range</p>
<section class="range-slider">
<span class="rangeValues" style="font-size:20px;"></span> <input max="16" min="1" step="1" type="range" value="1"> <input max="16" min="1" step="1" type="range" value="2">
</section>
<div class="row segment cyclebtns" style="height:240px; padding-top:10px;">
<ul style="padding:0px;">
<li onclick="EC('/win&PC=1&PX=0');">Color</li>
<li onclick="EC('/win&PX=1&PC=0');">Effects</li>
<li onclick="EC('/win&PX=1&PC=1');">Both</li>
2018-05-22 21:11:19 +02:00
</ul>
<div style="padding-top:50px;">
<p id="PSDurationLabel" style="margin-bottom: -4px;">Preset Duration</p><input id="cyclespeedslider" max="65000" min="50" type="range" step="50" value="5000">
</div>
<div>
<p id="CDurationLabel" style="margin-bottom: -4px;">Color Transition</p><input id="cycletransitionslider" max="65000" min="0" step="50" type="range" value="500">
</div>
</div>
<div>
<p style="margin-bottom: -4px;">FX Speed</p><input id="speedslider" max="255" min="50" type="range" value="222">
</div>
2018-05-22 21:11:19 +02:00
<ul id='mode' style="margin-top:20px;">
<li>
<a href="/win&FX=0" target="controlframe">Solid</a>
</li>
<li>
<a href="/win&FX=1" target="controlframe">Blink</a>
</li>
<li>
<a href="/win&FX=2" target="controlframe">Breathe</a>
</li>
<li>
<a href="/win&FX=3" target="controlframe">Wipe</a>
</li>
<li>
<a href="/win&FX=4" target="controlframe">Wipe Random</a>
</li>
<li>
<a href="/win&FX=5" target="controlframe">Random Colors</a>
2018-05-22 21:11:19 +02:00
</li>
<li>
<a href="/win&FX=6" target="controlframe">Easter</a>
2018-05-22 21:11:19 +02:00
</li>
<li>
<a href="/win&FX=7" target="controlframe">Multi Colors</a>
2018-05-22 21:11:19 +02:00
</li>
<li>
<a href="/win&FX=8" target="controlframe">Rainbow Full</a>
</li>
<li>
<a href="/win&FX=9" target="controlframe">Rainbow Cycle</a>
</li>
<li>
<a href="/win&FX=10" target="controlframe">Scan</a>
</li>
<li>
<a href="/win&FX=11" target="controlframe">Double Scan</a>
</li>
<li>
<a href="/win&FX=12" target="controlframe">Fade Out</a>
</li>
<li>
<a href="/win&FX=13" target="controlframe">Chase</a>
</li>
<li>
<a href="/win&FX=14" target="controlframe">Chase Rainbow</a>
</li>
<li>
<a href="/win&FX=15" target="controlframe">Running</a>
</li>
<li>
<a href="/win&FX=16" target="controlframe">Twinkle</a>
</li>
<li>
<a href="/win&FX=17" target="controlframe">Twinkle Random</a>
</li>
<li>
<a href="/win&FX=18" target="controlframe">Twinkle Fade</a>
</li>
<li>
<a href="/win&FX=19" target="controlframe">Twinkle Random Fade</a>
</li>
<li>
<a href="/win&FX=20" target="controlframe">Sparkle</a>
</li>
<li>
<a href="/win&FX=21" target="controlframe">Dark Sparkle</a>
</li>
<li>
<a href="/win&FX=22" target="controlframe">Dark Sparkle+</a>
</li>
<li>
<a href="/win&FX=23" target="controlframe">Strobe</a>
</li>
<li>
<a href="/win&FX=24" target="controlframe">Strobe Rainbow</a>
</li>
<li>
<a href="/win&FX=25" target="controlframe">Double Strobe</a>
</li>
<li>
<a href="/win&FX=26" target="controlframe">Blink Rainbow</a>
</li>
<li>
<a href="/win&FX=27" target="controlframe">Chase+</a>
</li>
<li>
<a href="/win&FX=28" target="controlframe">Dark Chase</a>
</li>
<li>
<a href="/win&FX=29" target="controlframe">Dark Chase Random</a>
</li>
<li>
<a href="/win&FX=30" target="controlframe">Dark Chase Rainbow</a>
</li>
<li>
<a href="/win&FX=31" target="controlframe">Chase Flash</a>
</li>
<li>
<a href="/win&FX=32" target="controlframe">Dark Chase Random</a>
</li>
<li>
<a href="/win&FX=33" target="controlframe">Rainbow Runner</a>
</li>
<li>
<a href="/win&FX=34" target="controlframe">Colorful</a>
2018-05-22 21:11:19 +02:00
</li>
<li>
<a href="/win&FX=35" target="controlframe">Traffic Light</a>
</li>
<li>
<a href="/win&FX=36" target="controlframe">Sweep Random</a>
</li>
<li>
<a href="/win&FX=37" target="controlframe">Running 2</a>
</li>
<li>
<a href="/win&FX=38" target="controlframe">Red & Blue</a>
</li>
<li>
<a href="/win&FX=39" target="controlframe">Running 2 Random</a>
</li>
<li>
<a href="/win&FX=40" target="controlframe">Scanner</a>
</li>
<li>
<a href="/win&FX=41" target="controlframe">Lighthouse</a>
</li>
<li>
<a href="/win&FX=42" target="controlframe">Fireworks</a>
</li>
<li>
<a href="/win&FX=43" target="controlframe">Fireworks Random</a>
</li>
<li>
<a href="/win&FX=44" target="controlframe">Merry Christmas</a>
</li>
<li>
<a href="/win&FX=45" target="controlframe">Fire Flicker</a>
</li>
<li>
<a href="/win&FX=46" target="controlframe">Gradient</a>
</li>
<li>
<a href="/win&FX=47" target="controlframe">Gradient Loading</a>
</li>
<li>
<a href="/win&FX=48" target="controlframe">In Out</a>
</li>
<li>
<a href="/win&FX=49" target="controlframe">In In</a>
</li>
<li>
<a href="/win&FX=50" target="controlframe">Out Out</a>
</li>
<li>
<a href="/win&FX=51" target="controlframe">Out In</a>
</li>
<li>
<a href="/win&FX=52" target="controlframe">Circus</a>
</li>
</ul><iframe id="stf" name="controlframe" onload="feedback();" style="display:none;"></iframe>
</main>
<script>
/*!
* iro.js v3.3.0
* 2016-2018 James Daniel
* Released under the MIT license
* github.com/jaames/iro.js
*/
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.iro=e():t.iro=e()}(this,function(){return function(t){function e(s){if(r[s])return r[s].exports;var n=r[s]={i:s,l:!1,exports:{}};return t[s].call(n.exports,n,n.exports,e),n.l=!0,n.exports}var r={};return e.m=t,e.c=r,e.i=function(t){return t},e.d=function(t,r,s){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var r=t&&t.t?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=4)}([function(t,e,r){"use strict";function s(t){var e,r,s,n,i,o,a,h,c=t.h/360,u=t.s/100,l=t.v/100;switch(n=k(6*c),i=6*c-n,o=l*(1-u),a=l*(1-i*u),h=l*(1-(1-i)*u),n%6){case 0:e=l,r=h,s=o;break;case 1:e=a,r=l,s=o;break;case 2:e=o,r=l,s=h;break;case 3:e=o,r=a,s=l;break;case 4:e=h,r=o,s=l;break;case 5:e=l,r=o,s=a}return{r:w(255*e),g:w(255*r),b:w(255*s)}}function n(t){var e,r=t.r/255,s=t.g/255,n=t.b/255,i=Math.max(r,s,n),o=Math.min(r,s,n),a=i-o;switch(i){case o:e=0;break;case r:e=(s-n)/a+(s<n?6:0);break;case s:e=(n-r)/a+2;break;case n:e=(r-s)/a+4}return e/=6,{h:w(360*e),s:w(0==i?0:a/i*100),v:w(100*i)}}function i(t){var e=t.s/100,r=t.v/100,s=.5*r*(2-e);return e=r*e/(1-Math.abs(2*s-1)),{h:t.h,s:w(100*e)||0,l:w(100*s)}}function o(t){var e=t.s/100,r=t.l/100;return r*=2,e*=r<=1?r:2-r,{h:t.h,s:w(2*e/(r+e)*100),v:w((r+e)/2*100)}}function a(t){return"rgb"+(t.a?"a":"")+"("+t.r+", "+t.g+", "+t.b+(t.a?", "+t.a:"")+")"}function h(t){return"hsl"+(t.a?"a":"")+"("+t.h+", "+t.s+"%, "+t.l+"%"+(t.a?", "+t.a:"")+")"}function c(t){var e=t.r,r=t.g,s=t.b,n=e%17==0&&r%17==0&&s%17==0,i=n?17:1,o=n?4:8,a=n?4:7,h=e/i<<2*o|r/i<<o|s/i,c=h.toString(16);return"#"+new Array(a-c.length).join("0")+c}function u(t,e){var r=t.match(/(\S+)\((\d+)(%?)(?:\D+?)(\d+)(%?)(?:\D+?)(\d+)(%?)(?:\D+?)?([0-9\.]+?)?\)/i),s=parseInt(r[2]),n=parseInt(r[4]),i=parseInt(r[6]);return[r[1],"%"==r[3]?s/100*e[0]:s,"%"==r[5]?n/100*e[1]:n,"%"==r[7]?i/100*e[2]:i,parseFloat(r[8])||void 0]}function l(t){var e=u(t,[255,255,255]);return{r:e[1],g:e[2],b:e[3]}}function f(t){var e=u(t,[360,100,100]);return{h:e[2],s:e[3],l:e[4]}}function v(t){t=t.replace("#","");var e=parseInt("0x"+t),r=3==t.length,s=r?15:255,n=r?4:8,i=r?17:1;return{r:(e>>2*n&s)*i,g:(e>>n&s)*i,b:(e&s)*i}}function p(t){return t instanceof x?t:new x(t)}function d(t,e,r){return t<=e?e:t>=r?r:t}function g(t,e){var r={};for(var s in t)r[s]=e[s]!=t[s];return r}function _(t,e,r){var s=p(t).rgb,n=p(e).rgb;return r=d(r/100||.5,0,1),new x({r:k(s.r+(n.r-s.r)*r),g:k(s.g+(n.g-s.g)*r),b:k(s.b+(n.b-s.b)*r)})}function m(t,e){var r=p(t),s=r.hsv;return s.v=d(s.v+e,0,100),r.hsv=s,r}function y(t,e){var r=p(t),s=r.hsv;return s.v=d(s.v-e,0,100),r.hsv=s,r}var b="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},w=Math.round,k=Math.floor,x=function(t){this.e=!1,this.u={h:void 0,s:void 0,v:void 0},t&&this.set(t)};x.mix=_,x.lighten=m,x.darken=y,x.hsv2Rgb=s,x.rgb2Hsv=n,x.hsv2Hsl=i,x.hsl2Hsv=o,x.hsl2Str=h,x.rgb2Str=a,x.rgb2Hex=c,x.parseHexStr=v,x.parseHslStr=f,x.parseRgbStr=l,x.prototype={constructor:x,set:function(t){"object"==(void 0===t?"undefined":b(t))?t instanceof x?this.hsv=x.hsv:"r"in t?this.rgb=t:"v"in t?this.hsv=t:"l"in t&&(this.hsl=t):"string"==typeof t&&(/^rgb/.test(t)?this.rgbString=t:/^hsl/.test(t)?this.hslString=t:/^#[0-9A-Fa-f]/.test(t)&&(this.hexString=t))},setChannel:function(t,e,r){var s=this[t];s[e]=r,this[t]=s},clone:function(){return new x(this)},compare:function(t,e){return e=e||"hsv",g(this[e],p(t)[e])},mix:function(t,e){this.hsv=_(this,t,e).hsv},lighten:function(t){m(this,t)},darken:function(t){y(this,t)}},Object.defineProperties(x.prototype,{hsv:{get:function(){var t=this.u;return{h:t.h,s:t.s,v:t.v}},set:function(t){if(this.e){var e=this.u;for(var r in e)t.hasOwnProperty(r)||(t[r]=e[r]);var s=g(e,t);this.
</script>
<script>
//Feedback
function feedback(){
var e = document.body;
e.classList.remove("feedbackanim");
void e.offsetWidth;
e.classList.add("feedbackanim");
}
//Speed slider
document.getElementById('speedslider').onchange = function() {
var speedurl = '/win&SX=' + this.value;
EC(speedurl);
2018-05-22 21:11:19 +02:00
}
//Brightness slider
document.getElementById('brightslider').onchange = function() {
var brighturl = '/win&A=' + this.value;
EC(brighturl);
2018-05-22 21:11:19 +02:00
}
//Preset speed slider
document.getElementById('cyclespeedslider').onchange = function() {
var val = this.value;
var url = '/win&PT=' + val;
var seconds = millisToMinutesAndSeconds(val);
EC(url);
2018-05-22 21:11:19 +02:00
document.getElementById('PSDurationLabel').innerHTML = 'Preset Duration (' + seconds + ')';
}
//Cycle Transition slider
document.getElementById('cycletransitionslider').onchange = function() {
var val = this.value;
var seconds = millisToMinutesAndSeconds(val);
var url = '/win&TT=' + this.value;
document.getElementById('CDurationLabel').innerHTML = 'Color Transition (' + seconds + ')';
EC(url);
2018-05-22 21:11:19 +02:00
}
var cpick = new iro.ColorPicker("#color-picker-container", {
2018-05-22 21:11:19 +02:00
width: 280,
height: 280
2018-05-22 21:11:19 +02:00
});
function toggleCycle(){
if (document.getElementById('myoos-cy').checked)
2018-05-22 21:11:19 +02:00
{
EC('win&CY=1');
2018-05-22 21:11:19 +02:00
} else {
EC('win&CY=0');
2018-05-22 21:11:19 +02:00
}
}
function millisToMinutesAndSeconds(millis) {
var minutes = Math.floor(millis / 60000);
var seconds = ((millis % 60000) / 1000).toFixed(0);
return minutes + ":" + (seconds < 10 ? '0' : '') + seconds;
}
window.onload = function () {
cpick.on("color:change", function(color, changes) {
2018-05-22 21:11:19 +02:00
var cr = color.rgb.r;
var cg = color.rgb.g;
var cb = color.rgb.b;
//Secondary color
if (document.querySelector('.oos-chk').checked == true) {
2018-05-22 21:11:19 +02:00
var rgburl = "/win&R2=" + cr + "&G2=" + cg + "&B2=" + cb;
EC(rgburl);
2018-05-22 21:11:19 +02:00
}
//Primary color
if (document.querySelector('.oos-chk').checked == false) {
2018-05-22 21:11:19 +02:00
var rgburl = "/win&R=" + cr + "&G=" + cg + "&B=" + cb;
EC(rgburl);
2018-05-22 21:11:19 +02:00
}
});
// Initialize Sliders
var sliderSections = document.getElementsByClassName("range-slider");
for( var x = 0; x < sliderSections.length; x++ ){
var sliders = sliderSections[x].getElementsByTagName("input");
for( var y = 0; y < sliders.length; y++ ){
if( sliders[y].type ==="range" ){
sliders[y].oninput = getVals;
sliders[y].oninput();
}
}
}
}
function EC(rgburl){
2018-05-22 21:11:19 +02:00
document.getElementById('stf').src = rgburl;
}
function pC(colour) {
2018-05-22 21:11:19 +02:00
var pc = iro.Color.parseHexStr(colour);
var cr = pc.r;
var cg = pc.g;
var cb = pc.b;
if (document.querySelector('.oos-chk').checked == true) {
2018-05-22 21:11:19 +02:00
var rgburl = "/win&R2=" + cr + "&G2=" + cg + "&B2=" + cb;
}
if (document.querySelector('.oos-chk').checked == false) {
2018-05-22 21:11:19 +02:00
var rgburl = "/win&R=" + cr + "&G=" + cg + "&B=" + cb;
}
EC(rgburl);
2018-05-22 21:11:19 +02:00
}
function togglePower(){
EC('/win&T=2');
2018-05-22 21:11:19 +02:00
}
function toggleNight(){
EC('/win&ND');
2018-05-22 21:11:19 +02:00
}
function ps(psNum){
if (document.querySelector('.oos-chk-ps').checked == false) {
var url = "/win&PL=" + psNum;
2018-05-22 21:11:19 +02:00
}
if (document.querySelector('.oos-chk-ps').checked == true) {
var url = "/win&PS=" + psNum;
2018-05-22 21:11:19 +02:00
}
EC(url);
2018-05-22 21:11:19 +02:00
}
function getVals(){
var pr = this.parentNode;
var slides = pr.getElementsByTagName("input");
var s1 = parseFloat( slides[0].value );
var s2 = parseFloat( slides[1].value );
if(s1>s2){ var tmp = s2; s2 = s1; s1 = tmp; }
2018-05-22 21:11:19 +02:00
var displayElement = pr.getElementsByClassName("rangeValues")[0];
displayElement.innerHTML = s1 + " - " + s2;
EC('/win&P1=' + s1 + '&P2=' + s2);
2018-05-22 21:11:19 +02:00
}
</script>
</body>
</html>