// ==UserScript==
// @name Diep.style
// @namespace https://www.reddit.com/r/Diepio/comments/5y1np1/diepstyle_plugin/
// @version 0.093
// @description Press Esc twice to toggle the menu,and save the setting
// @author sbk2015
// @match http://*diep.io/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
var localStorage;
var saveList;
var nowSetting;
var isLocal;
var clone;
jsInit();
setTimeout(pluginInit, 1000);
function jsInit() {
Storage.prototype.setObject = function(key, value) {
this.setItem(key, JSON.stringify(value));
}
Storage.prototype.getObject = function(key) {
var value = this.getItem(key);
return value && JSON.parse(value);
}
clone = function(obj) {
return JSON.parse(JSON.stringify(obj));
}
window.diepStyle = {};
localStorage = window.localStorage;
if (location.href.indexOf('file://') >= 0) {
var warning = false;
warning ? '' : console.warn('off warning');
isLocal = true;
window.input = {
set_convar: function() { warning ? console.warn('block input.set_convar') : '' },
execute: function() { warning ? console.warn('block input.set_execute') : '' }
}
}
}
function pluginInit() {
storageInit();
keyListen();
tempInit();
styleInit();
diepStyle.onColor = onColor;
diepStyle.storageInit = storageInit;
// togglePanel(true);
function storageInit(cmd) {
var th = 50,
netTH = 110;
var colors = [
{ id: 2, name: 'You FFA', color: '00b1de' },
{ id: 15, name: 'Other FFA', color: 'f14e54' },
{ id: 3, name: 'Blue Team', color: '00b1de' },
{ id: 4, name: 'Red Team', color: 'f14e54' },
{ id: 5, name: 'Purple Team', color: 'bf7ff5' },
{ id: 6, name: 'Green Team', color: '00e16e' },
{ id: 17, name: 'Fallen team', color: 'c6c6c6' },
{ id: 12, name: 'Arena Closer', color: 'ffe869' },
{ id: 8, name: 'Square', color: 'ffe869' },
{ id: 7, name: 'Green Square?', color: '89ff69' },
{ id: 16, name: 'Necro Square', color: 'fcc376' },
{ id: 9, name: 'Triangle', color: 'fc7677' },
{ id: 10, name: 'Pentagon', color: '768dfc' },
{ id: 11, name: 'Crasher', color: 'f177dd' },
{ id: 14, name: 'Waze Wall', color: 'bbbbbb' },
{ id: 1, name: 'Turret', color: '999999' },
{ id: 0, name: 'Smasher', color: '4f4f4f' },
{ id: th++, name: 'All Bars', color: '000000', cmd: 'ren_bar_background_color' },
{ id: th++, name: 'Outline', color: '555555', cmd: 'ren_stroke_solid_color' },
{ id: 13, name: 'Leader Board', color: '64ff8c' },
{ id: th++, name: 'Xp Bar', color: 'ffde43', cmd: 'ren_xp_bar_fill_color' },
{ id: th++, name: 'Score Bar', color: '43ff91', cmd: 'ren_score_bar_fill_color' },
{ id: th++, name: 'Health Bar1', color: '85e37d', cmd: 'ren_health_fill_color' },
{ id: th++, name: 'Health Bar2', color: '555555', cmd: 'ren_health_background_color' },
{ id: th++, name: 'Grid Color', color: '000000', cmd: 'ren_grid_color' },
{ id: th++, name: 'Minimap 1', color: 'CDCDCD', cmd: 'ren_minimap_background_color' },
{ id: th++, name: 'Minimap 2', color: '797979', cmd: 'ren_minimap_border_color' },
{ id: th++, name: 'Background 1', color: 'CDCDCD', cmd: 'ren_background_color' },
{ id: th++, name: 'Background 2', color: '797979', cmd: 'ren_border_color' },
{ id: netTH++, name: 'UI Color1', color: 'e69f6c', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color2', color: 'ff73ff', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color3', color: 'c980ff', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color4', color: '71b4ff', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color5', color: 'ffed3f', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color6', color: 'ff7979', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color7', color: '88ff41', cmd: 'ui_replace_colors' },
{ id: netTH++, name: 'UI Color8', color: '41ffff', cmd: 'ui_replace_colors' },
]
diepStyle.colorMap = new Map(colors.map(function(elem) {
return [elem.id, { color: elem.color, cmd: elem.cmd || 'no cmd' }]
}));
diepStyle.uiColorMap = function(cmd) {
var uiTH = nowSetting.colors.findIndex(elem => elem.name == 'UI Color1');
var colorBunch = '';
var arr = [];
if (cmd == '0x') {
for (var i = 0; i < 8; i++) {
colorBunch = ' 0x' + nowSetting.colors[uiTH + i].color + colorBunch;
}
return colorBunch;
}
if (cmd == 'array') {
for (var i = 0; i < 8; i++) {
arr.push(nowSetting.colors[uiTH + i].color);
}
return arr;
}
}
var renders = [
{ name: 'Grid Alpha', value: 0.1, cmd: 'grid_base_alpha' },
{ name: 'Outline Intensity', value: 0.25, cmd: 'stroke_soft_color_intensity' },
{ name: 'Show Outline', value: false, cmd: 'stroke_soft_color',reverse: true },
{ name: 'Border Alpha', value: 0.1, cmd: 'border_color_alpha' },
{ name: 'UI Scale', value: 1, cmd: 'ui_scale' },
{ name: 'Clear UI', value: false, cmd: 'ui',reverse: true },
{ name: 'Show FPS', value: false, cmd: 'fps' },
{ name: 'Show Health', value: false, cmd: 'raw_health_values' },
{ name: 'Hide Name', value: false, cmd: 'names',reverse: true },
];
;(function checkHasStorage() {
var _localStorage = localStorage.getObject('diepStyle')
var page = 1;
if (nowSetting && nowSetting.saveTH) {
page = nowSetting.saveTH;
}
if (_localStorage && _localStorage.saveList) {
saveList = _localStorage.saveList;
nowSetting = _localStorage.nowSetting;
}
if (!nowSetting || cmd == 'reset') {
nowSetting = getBlankSetting();
nowSetting.saveTH = page;
}
if (!saveList) saveList = getBlankSaveList();
saveList[0]=getBlankSetting();
;(function checkMissing(){
var plain=getBlankSetting();
plain.renders.forEach((elem,th)=>{
var index=nowSetting.renders.findIndex(now=>elem.cmd==now.cmd);
if(index<0) {
nowSetting.renders.splice(th,0,elem);
saveList[nowSetting.saveTH].renders.splice(th,0,elem)
}
});
plain.colors.forEach((elem,th)=>{
var index=nowSetting.colors.findIndex(now=>{
if(elem.cmd&&elem.cmd==now.cmd) return true;
if((elem.id||elem.id==0)&&elem.id==now.id) return true;
});
if(index<0) {
nowSetting.colors.splice(th,0,elem);
saveList[nowSetting.saveTH].colors.splice(th,0,elem);
}
});
})();
})();
;(function command(){
diepStyle.command={};
renders.forEach(elem=>{
diepStyle.command[elem.cmd]={};
if(elem.reverse) diepStyle.command[elem.cmd].reverse=true;
})
diepStyle.command.fn= function(cmd, value) {
nowSetting.renders=nowSetting.renders.map(elem=>{
if(elem.cmd==cmd) elem.value=value;
return elem
})
if (diepStyle.command[cmd].reverse) value = !value;
input.set_convar("ren_" + cmd, value);
};
})();
function getBlankSetting() {
return { version: 0.092, saveTH: 1, lock: false, colors, renders };
}
function getBlankSaveList() {
var list = [];
for (var i = 0; i < 6; i++) {
list[i] = getBlankSetting();
if (i == 0) list[i].isDefault = 'default,no save';
}
return clone(list);
};
Storage.prototype.pluginSave = function() {
saveList[nowSetting.saveTH] = clone(nowSetting);
var _storageObj = {
nowSetting: clone(nowSetting),
saveList: clone(saveList)
}
localStorage.setObject('diepStyle', _storageObj);
};
localStorage.pluginSave();
}
function keyListen() {
var input = '';
document.addEventListener('keyup', function(evt) {
var that = this;
if (that.pluginOn == undefined) that.pluginOn = false;
var e = window.event || evt;
var key = e.which || e.keyCode;
input += key;
if (input.indexOf('2727') >= 0) {
input = '';
that.pluginOn = !that.pluginOn
togglePanel(that.pluginOn);
(function save() {
if (!that.pluginOn) {
localStorage.pluginSave();
};
})();
}
if (input.length > 10) input = input.substring(input.length - 10);
});
}
function tempInit() {
var colorObj = { th: 0 };
var setObj = { th: 0 }
diepStyle.exportJSON = exportJSON;
diepStyle.importJSON = importJSON;
init1();
loadColor();
setTimeout(diepStyle.resetRender, 1500);
diepStyle.resetColor = loadColor;
function init1() {
diepStyle.resetRender = resetRender;
var title = `<div class="title">Diep.Style Ver 0.092<br>
Press Esc twice to toggle this</div>`;
var colorPlane = function(id) {
return `{position:'left',width:300, height:200,onFineChange:'diepStyle.onColor(${id},this)'}`
}
colorObj.setClass = function() {
return `colorBlock colorBlock${this.th++}`
}
setObj.setClass = function() {
return `setting setting${this.th++}`
}
function resetRender(cmd) {
document.querySelectorAll('#styleSetting .render').forEach(function(elem) {
elem.outerHTML = ``
})
var it = document.querySelector('.renderBegin')
it.insertAdjacentHTML('afterend', getRenderBody());
it.remove();
nowSetting.renders.forEach(function(elem) {
diepStyle.command.fn(elem.cmd, elem.value);
});
listenerInit(cmd);
}
var bodyRender = getRenderBody();
var bodyColor = getColorBody();
var bodyImport = getImportBody();
function getRenderBody() {
var renders = nowSetting.renders;
var th = -1;
var html = `
<div class="renderBegin">Render Setting</div>
<div class="row render">
<div class="cell">${renders[++th].name} <br><span class="grid_base_value">${renders[th].value}</span></div>
<div class="cell"><input type="range" name="grid_base_alpha" value=${renders[th].value*100} max="200"></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name} <br><span class="stroke_intensity_value">${renders[th].value}</span></div>
<div class="cell"><input type="range" name="stroke_soft_color_intensity" value=${renders[th].value*100} max="100"></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name}</div>
<div class="cell"><input type="checkbox" name="stroke_soft_color" ${renders[th].value?'checked':''}></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name} <br><span class="border_value">${renders[th].value}</span></div>
<div class="cell"><input type="range" name="border_color_alpha" value=${renders[th].value*100} max="100"></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name} <br><span class="ui_scale_value">${renders[th].value}</span></div>
<div class="cell"><input type="range" name="ui_scale" value=${renders[th].value*100} max="200"></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name}</div>
<div class="cell"><input type="checkbox" name="ui" ${renders[th].value?'checked':''}></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name}</div>
<div class="cell"><input type="checkbox" name="fps" ${renders[th].value?'checked':''}></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name}</div>
<div class="cell"><input type="checkbox" name="raw_health_values" ${renders[th].value?'checked':''}></div>
</div>
<div class="row render">
<div class="cell">${renders[++th].name}</div>
<div class="cell"><input type="checkbox" name="names" ${renders[th].value?'checked':''}></div>
</div>
`
return html;
}
function getColorBody() {
var it = '<div class="row colorBegin">Color Setting</div>\n' +
`<div class="row header hide theme">
<div class="cell noBoard name"></div>
<div class="cell noBoard author"></div>
</div>`
nowSetting.colors.forEach(function(elem, th) {
var id = elem.id;
it += `
<div class="row colorBlock colorBlock${th}">
<div class="cell"></div>
<div class="cell"><input class="jscolor ${colorPlane(`${id}`)}"> </div>
</div>
`;
});
return it
}
var allBody =
`
<div class="pluginBody">${title}
<hr>
<div class="table">
<span class="pluginLock"></span>
${bodyRender} ${bodyColor} <br>
</div>
</div>
`;
var getSaveBtns=function() {
var btn='';
for (var i = 0; i < 6; i++) {
if(i==0) {btn+=`<button>Default</button>`;continue;}
btn+=`<button>${i}</button>`;
}
return btn;
}
function getImportBody() {
var html=
`
<div class="importBegin">Import / Export Save</div>
<div class="row">
<div class="cell">
<button class="import">Import</button>
</div>
<div class="cell">
<button class="export">Export</button>
</div>
</div>
`
return html
}
var footer=
`
<div class="footer">
<div class="saveBtns">${getSaveBtns()}</div>
<div class="otherBtns">
<span><button class="import">Import</button></span>
<span><button class="export">Export</button></span>
<span class="lock"><button>Lock</button></span>
<span class="reset"><button>Reset</button></span>
</div>
</div>
`
// ${bodyImport}
var id = 0;
var temp = `<div id="styleSetting"> ${allBody} ${footer} </div>`;
document.querySelector('body').insertAdjacentHTML('afterend', temp);
loadScript();
// function addScript(src) {
// var s = document.createElement('script');
// s.setAttribute('src', src);
// document.body.appendChild(s);
// }
function listenerInit(cmd) {
;(function (){
var theName="grid_base_alpha";
document.querySelector(`input[name=${theName}]`).addEventListener('input',
function(e) {
var value = (e.target.value - e.target.value % 2) / 100
document.querySelector('.grid_base_value').innerHTML = value;
diepStyle.command.fn(theName, value);
});
})();
;(function (){
var theName="stroke_soft_color_intensity";
document.querySelector(`input[name=${theName}]`).addEventListener('input',
function(e) {
var value = (e.target.value - e.target.value % 5)/100
document.querySelector('.stroke_intensity_value').innerHTML = value;
diepStyle.command.fn(theName, value);
});
})();
;(function (){
var theName="stroke_soft_color";
document.querySelector(`input[name=${theName}]`).addEventListener('change',
function(e) {diepStyle.command.fn(theName, e.target.checked); });
})();
;(function (){
var theName="border_color_alpha";
document.querySelector(`input[name=${theName}]`).addEventListener('input',
function(e) {
var value = (e.target.value - e.target.value % 2) / 100
document.querySelector('.border_value').innerHTML = value;
diepStyle.command.fn(theName, value);
});
})();
;(function (){
var theName="ui_scale";
document.querySelector(`input[name=${theName}]`).addEventListener('input',
function(e) {
var value = (e.target.value - e.target.value % 2) / 100
document.querySelector(`.${theName}_value`).innerHTML = value;
diepStyle.command.fn(theName, value);
});
})();
;(function (){
var theName="ui";
document.querySelector(`input[name=${theName}]`).addEventListener('change',
function(e) {diepStyle.command.fn(theName, e.target.checked); });
})();
;(function (){
var theName="fps";
document.querySelector(`input[name=${theName}]`).addEventListener('change',
function(e) {diepStyle.command.fn(theName, e.target.checked); });
})();
;(function (){
var theName="raw_health_values";
document.querySelector(`input[name=${theName}]`).addEventListener('change',
function(e) {diepStyle.command.fn(theName, e.target.checked); });
})();
;(function (){
var theName="names";
document.querySelector(`input[name=${theName}]`).addEventListener('change',
function(e) {diepStyle.command.fn(theName, e.target.checked); });
})();
if(cmd=='reset') return;
document.querySelector('button.import').addEventListener('click',function(e) {
var example='[\n{"cmd":"ui_scale","value":"1.5"},'+
'\n{"id":"8","value":"888888"}\n]';
var gotValue=prompt('Enter The JSON\nExample:\n'+example,example.replace(/\s/g, ''));
if(!isJson(gotValue)){
alert('Code Incorrect\nPlz git gud and check your JSON');
return
};
var gotArr=JSON.parse(gotValue);
if(!gotArr) return;
gotArr.forEach(function(elem) {
nowSetting.colors=nowSetting.colors.map(function(now) {
if(elem.id && now.id==elem.id) now.color=elem.value;
if(!elem.id&&elem.cmd && now.cmd==elem.cmd) now.color=elem.value;
return now
});
nowSetting.renders=nowSetting.renders.map(function(now) {
if(elem.cmd && now.cmd==elem.cmd) now.value=elem.value;
return now
});
if(elem.cmd=='ui_replace_colors') {
var uiTH = nowSetting.colors.findIndex(elem => elem.name == 'UI Color1');
for (var i = 0; i < 8; i++) {
nowSetting.colors[uiTH + i].color=elem.value[i];
}
};
if(elem.theme){
if(elem.theme.name||elem.theme.author) nowSetting.theme=elem.theme;
}else{
elem.theme={};
};
});
document.querySelectorAll('.saveBtns button')[nowSetting.saveTH].click();
function isJson(str) {
try {
JSON.parse(str);
} catch (e) {
return false;
}
if(typeof JSON.parse(str)=='object') return true;
}
});
document.querySelector('button.export').addEventListener('click',function(e) {
prompt('Copy the Json',diepStyle.exportJSON('one'));
});
document.querySelectorAll('.saveBtns button').forEach((elem, th) => {
elem.addEventListener('click', function() {
localStorage.pluginSave();
nowSetting=clone(saveList[th]);
nowSetting.saveTH=th;
// diepStyle.storageInit();
// nowSetting.saveTH=th;
diepStyle.resetColor();
diepStyle.resetRender('reset');
updateSaveBtns();
})
})
document.querySelector('.lock button').addEventListener('click',
function(e) {
nowSetting.lock=!nowSetting.lock;
updateSaveBtns();
});
document.querySelector('.reset button').addEventListener('click',
function(e) {
if(e.target.innerHTML!='Confirm'){
e.target.innerHTML='Confirm';
}else{
diepStyle.storageInit('reset');
diepStyle.resetColor();
diepStyle.resetRender('reset');
updateSaveBtns();
}
});
document.querySelector('.reset button').addEventListener('mouseleave',function(e) {
e.target.innerHTML='Reset';
})
updateSaveBtns();
function updateSaveBtns() {
var theTH=nowSetting.saveTH;
var status=saveList[theTH];
var lockBtn=document.querySelector('.lock button');
var resetBtn=document.querySelector('.reset button');
if(theTH==0){
lockBtn.disabled = true;
resetBtn.disabled = true;
nowSetting.lock=true;
}else{
resetBtn.disabled = nowSetting.lock;
lockBtn.disabled = false;
}
if(resetBtn.disabled) {
document.querySelector('.table').classList.add('noClicks');
lockBtn.innerHTML='locked';
}else{
document.querySelector('.table').classList.remove('noClicks');
lockBtn.innerHTML='no lock';
}
;(function (){
document.querySelectorAll('.saveBtns button').forEach(function(elem, th) {
elem.classList.remove('chosenBtn');
if(theTH==th) elem.classList.add('chosenBtn');
})
})();
}
}
}
function loadColor() {
if(nowSetting.theme){
document.querySelector('.theme').classList.remove('hide');
var it=document.querySelector('.theme .name');
it.innerText='Theme '+nowSetting.theme.name;
it=document.querySelector('.theme .author');
it.innerText='by '+nowSetting.theme.author;
}else{
document.querySelector('.theme').classList.add('hide');
}
nowSetting.colors.some(function(elem, th) {
var target = document.querySelector(`.colorBlock${th}`);
if (!target || !target.querySelector('.cell input').jscolor) {
setTimeout(loadColor, 500);
return true
}
onColor(elem.id, elem.color);
target.querySelector('.cell').innerHTML = elem.name;
target.querySelector('.cell input').jscolor.fromString(elem.color);
})
}
function exportJSON(cmd) {
var toExport=[];
if(cmd=='one') toExport=write(nowSetting);
if(cmd=='all') saveList.forEach(elem=>toExport.push(write(elem)));
return JSON.stringify(toExport);
function write(now) {
var array=[];
now.colors.forEach(function(elem){
if(elem.id&&elem.id<50) array.push({id:elem.id,value:elem.color});
if(elem.id&&elem.id>=50&&elem.id<100) array.push({cmd:elem.cmd,value:elem.color});
if(!elem.id&&elem.cmd) array.push({cmd:elem.cmd,value:elem.color});
});
array.push({cmd:'ui_replace_colors',value:diepStyle.uiColorMap('array')});
now.renders.forEach(function(elem){
array.push({cmd:elem.cmd,value:elem.value});
});
if(now.theme){
array.unshift({theme:{
name:now.theme.name||'',
author:now.theme.author||''}});
}else{
array.unshift({theme:{name:'',author:''}});
}
return array
}
}
function importJSON() {
}
}
function onColor(id, e) {
var target = id;
var color=e.toString();
if (id >= 0 && id < 50) {
input.execute(`net_replace_color ${target} 0x${color}`)
} else if(id >= 50 && id < 100){
var cmd=diepStyle.colorMap.get(id).cmd
input.set_convar(cmd, `0x${color}`);
} else{
input.execute('ui_replace_colors'+diepStyle.uiColorMap('0x'));
}
nowSetting.colors = nowSetting.colors.map(function(elem) {
if (elem.id === id) elem.color = color;
return elem
})
}
function styleInit() {
addGlobalStyle(`#styleSetting{padding: 0.2em; margin:0.2em; position: absolute;top: 0;right: 0;width: 30%;
min-width:20em; background-color: rgba(200,200,200,0.8);display:none;border: 1px solid black;height: 92vh;}`);
addGlobalStyle(".table{ display: table; text-align: center; width: 99%;}");
addGlobalStyle(".row{ display: table-row; }");
addGlobalStyle(`.cell{ display: table-cell;}`);
addGlobalStyle(`.cell:not(.noBoard){ display: table-cell; padding: 0.1em 0.3em;border: 1px solid black;}`);
addGlobalStyle("input[type=checkbox],input[type=range]{transform: scale(1.2); }");
addGlobalStyle(`.pluginBody{height: 90%; overflow-y: auto;}`);
addGlobalStyle(`.colorBegin, .renderBegin, .importBegin,.header{font-size:1.2em; line-height:1.5em;}`);
addGlobalStyle(`.saveBtns button{margin: 0 3%; padding: 0.2em 0.5em;}`);
addGlobalStyle(`@-moz-document url-prefix() {.saveBtns button{margin: 0 1%;padding: 0.1em 0.3em;} } }`);
addGlobalStyle(`.otherBtns button{margin: 0 4%; padding: 0.2em 0.5em;}`);
addGlobalStyle(`.footer{text-align:center;height:10%; border: 1px solid black;}`);
addGlobalStyle(`.footer > *{margin: 0.2vh 0 1.3vh 0;}`);
addGlobalStyle(`.reset button{box-shadow: 0 0 1em red;}`);
addGlobalStyle(`.backRed{background-color:#f14e54}`);
addGlobalStyle(`.chosenBtn{-webkit-filter: brightness(0.8);filter:brightness(0.8);}`)
addGlobalStyle(`.noClicks{pointer-events:none; -webkit-filter: opacity(50%); filter: opacity(50%);}`)
addGlobalStyle(`.hide{display:none}`)
function addGlobalStyle(css) {
var head, style;
head = document.getElementsByTagName('head')[0];
if (!head) {return;}
style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = css;
head.appendChild(style);
}
}
}
function togglePanel(tf) {
if(tf){
try{
document.querySelector('#styleSetting').style.display = "block";
}catch(err){
var warn='\n\nYou can DELETE ALL PLUGIN SAVES to fix this'+
'\nType delete to confirm'+
'\nor cancel to download all saves';
var gotValue=prompt('Got an error\n'+err+warn);
if(gotValue=='delete'){
localStorage.removeItem('diepStyle');
alert('Deleted,refresh to take effect');
return
}else{
download('diep.style saves.txt',diepStyle.exportJSON('all'))
};
}
}else{
document.querySelector('#styleSetting').style.display = "none";
}
function download(filename, text) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}
}
function loadScript() {
;(function (){
"use strict";window.jscolor||(window.jscolor=function(){var e={register:function(){e.attachDOMReadyEvent(e.init),e.attachEvent(document,"mousedown",e.onDocumentMouseDown),e.attachEvent(document,"touchstart",e.onDocumentTouchStart),e.attachEvent(window,"resize",e.onWindowResize)},init:function(){e.jscolor.lookupClass&&e.jscolor.installByClassName(e.jscolor.lookupClass)},tryInstallOnElements:function(t,n){var r=new RegExp("(^|\\s)("+n+")(\\s*(\\{[^}]*\\})|\\s|$)","i");for(var i=0;i<t.length;i+=1){if(t[i].type!==undefined&&t[i].type.toLowerCase()=="color"&&e.isColorAttrSupported)continue;var s;if(!t[i].jscolor&&t[i].className&&(s=t[i].className.match(r))){var o=t[i],u=null,a=e.getDataAttr(o,"jscolor");a!==null?u=a:s[4]&&(u=s[4]);var f={};if(u)try{f=(new Function("return ("+u+")"))()}catch(l){e.warn("Error parsing jscolor options: "+l+":\n"+u)}o.jscolor=new e.jscolor(o,f)}}},isColorAttrSupported:function(){var e=document.createElement("input");if(e.setAttribute){e.setAttribute("type","color");if(e.type.toLowerCase()=="color")return!0}return!1}(),isCanvasSupported:function(){var e=document.createElement("canvas");return!!e.getContext&&!!e.getContext("2d")}(),fetchElement:function(e){return typeof e=="string"?document.getElementById(e):e},isElementType:function(e,t){return e.nodeName.toLowerCase()===t.toLowerCase()},getDataAttr:function(e,t){var n="data-"+t,r=e.getAttribute(n);return r!==null?r:null},attachEvent:function(e,t,n){e.addEventListener?e.addEventListener(t,n,!1):e.attachEvent&&e.attachEvent("on"+t,n)},detachEvent:function(e,t,n){e.removeEventListener?e.removeEventListener(t,n,!1):e.detachEvent&&e.detachEvent("on"+t,n)},_attachedGroupEvents:{},attachGroupEvent:function(t,n,r,i){e._attachedGroupEvents.hasOwnProperty(t)||(e._attachedGroupEvents[t]=[]),e._attachedGroupEvents[t].push([n,r,i]),e.attachEvent(n,r,i)},detachGroupEvents:function(t){if(e._attachedGroupEvents.hasOwnProperty(t)){for(var n=0;n<e._attachedGroupEvents[t].length;n+=1){var r=e._attachedGroupEvents[t][n];e.detachEvent(r[0],r[1],r[2])}delete e._attachedGroupEvents[t]}},attachDOMReadyEvent:function(e){var t=!1,n=function(){t||(t=!0,e())};if(document.readyState==="complete"){setTimeout(n,1);return}if(document.addEventListener)document.addEventListener("DOMContentLoaded",n,!1),window.addEventListener("load",n,!1);else if(document.attachEvent){document.attachEvent("onreadystatechange",function(){document.readyState==="complete"&&(document.detachEvent("onreadystatechange",arguments.callee),n())}),window.attachEvent("onload",n);if(document.documentElement.doScroll&&window==window.top){var r=function(){if(!document.body)return;try{document.documentElement.doScroll("left"),n()}catch(e){setTimeout(r,1)}};r()}}},warn:function(e){window.console&&window.console.warn&&window.console.warn(e)},preventDefault:function(e){e.preventDefault&&e.preventDefault(),e.returnValue=!1},captureTarget:function(t){t.setCapture&&(e._capturedTarget=t,e._capturedTarget.setCapture())},releaseTarget:function(){e._capturedTarget&&(e._capturedTarget.releaseCapture(),e._capturedTarget=null)},fireEvent:function(e,t){if(!e)return;if(document.createEvent){var n=document.createEvent("HTMLEvents");n.initEvent(t,!0,!0),e.dispatchEvent(n)}else if(document.createEventObject){var n=document.createEventObject();e.fireEvent("on"+t,n)}else e["on"+t]&&e["on"+t]()},classNameToList:function(e){return e.replace(/^\s+|\s+$/g,"").split(/\s+/)},hasClass:function(e,t){return t?-1!=(" "+e.className.replace(/\s+/g," ")+" ").indexOf(" "+t+" "):!1},setClass:function(t,n){var r=e.classNameToList(n);for(var i=0;i<r.length;i+=1)e.hasClass(t,r[i])||(t.className+=(t.className?" ":"")+r[i])},unsetClass:function(t,n){var r=e.classNameToList(n);for(var i=0;i<r.length;i+=1){var s=new RegExp("^\\s*"+r[i]+"\\s*|"+"\\s*"+r[i]+"\\s*$|"+"\\s+"+r[i]+"(\\s+)","g");t.className=t.className.replace(s,"$1")}},getStyle:function(e){return window.getComputedStyle?window.getComputedStyle(e):e.currentStyle},setStyle:function(){var e=document.createElement("div"),t=function(t){for(var n=0;n<t.length;n+=1)if(t[n]in e.style)return t[n]},n={borderRadius:t(["borderRadius","MozBorderRadius","webkitBorderRadius"]),boxShadow:t(["boxShadow","MozBoxShadow","webkitBoxShadow"])};return function(e,t,r){switch(t.toLowerCase()){case"opacity":var i=Math.round(parseFloat(r)*100);e.style.opacity=r,e.style.filter="alpha(opacity="+i+")";break;default:e.style[n[t]]=r}}}(),setBorderRadius:function(t,n){e.setStyle(t,"borderRadius",n||"0")},setBoxShadow:function(t,n){e.setStyle(t,"boxShadow",n||"none")},getElementPos:function(t,n){var r=0,i=0,s=t.getBoundingClientRect();r=s.left,i=s.top;if(!n){var o=e.getViewPos();r+=o[0],i+=o[1]}return[r,i]},getElementSize:function(e){return[e.offsetWidth,e.offsetHeight]},getAbsPointerPos:function(e){e||(e=window.event);var t=0,n=0;return typeof e.changedTouches!="undefined"&&e.changedTouches.length?(t=e.changedTouches[0].clientX,n=e.changedTouches[0].clientY):typeof e.clientX=="number"&&(t=e.clientX,n=e.clientY),{x:t,y:n}},getRelPointerPos:function(e){e||(e=window.event);var t=e.target||e.srcElement,n=t.getBoundingClientRect(),r=0,i=0,s=0,o=0;return typeof e.changedTouches!="undefined"&&e.changedTouches.length?(s=e.changedTouches[0].clientX,o=e.changedTouches[0].clientY):typeof e.clientX=="number"&&(s=e.clientX,o=e.clientY),r=s-n.left,i=o-n.top,{x:r,y:i}},getViewPos:function(){var e=document.documentElement;return[(window.pageXOffset||e.scrollLeft)-(e.clientLeft||0),(window.pageYOffset||e.scrollTop)-(e.clientTop||0)]},getViewSize:function(){var e=document.documentElement;return[window.innerWidth||e.clientWidth,window.innerHeight||e.clientHeight]},redrawPosition:function(){if(e.picker&&e.picker.owner){var t=e.picker.owner,n,r;t.fixed?(n=e.getElementPos(t.targetElement,!0),r=[0,0]):(n=e.getElementPos(t.targetElement),r=e.getViewPos());var i=e.getElementSize(t.targetElement),s=e.getViewSize(),o=e.getPickerOuterDims(t),u,a,f;switch(t.position.toLowerCase()){case"left":u=1,a=0,f=-1;break;case"right":u=1,a=0,f=1;break;case"top":u=0,a=1,f=-1;break;default:u=0,a=1,f=1}var l=(i[a]+o[a])/2;if(!t.smartPosition)var c=[n[u],n[a]+i[a]-l+l*f];else var c=[-r[u]+n[u]+o[u]>s[u]?-r[u]+n[u]+i[u]/2>s[u]/2&&n[u]+i[u]-o[u]>=0?n[u]+i[u]-o[u]:n[u]:n[u],-r[a]+n[a]+i[a]+o[a]-l+l*f>s[a]?-r[a]+n[a]+i[a]/2>s[a]/2&&n[a]+i[a]-l-l*f>=0?n[a]+i[a]-l-l*f:n[a]+i[a]-l+l*f:n[a]+i[a]-l+l*f>=0?n[a]+i[a]-l+l*f:n[a]+i[a]-l-l*f];var h=c[u],p=c[a],d=t.fixed?"fixed":"absolute",v=(c[0]+o[0]>n[0]||c[0]<n[0]+i[0])&&c[1]+o[1]<n[1]+i[1];e._drawPosition(t,h,p,d,v)}},_drawPosition:function(t,n,r,i,s){var o=s?0:t.shadowBlur;e.picker.wrap.style.position=i,e.picker.wrap.style.left=n+"px",e.picker.wrap.style.top=r+"px",e.setBoxShadow(e.picker.boxS,t.shadow?new e.BoxShadow(0,o,t.shadowBlur,0,t.shadowColor):null)},getPickerDims:function(t){var n=!!e.getSliderComponent(t),r=[2*t.insetWidth+2*t.padding+t.width+(n?2*t.insetWidth+e.getPadToSliderPadding(t)+t.sliderSize:0),2*t.insetWidth+2*t.padding+t.height+(t.closable?2*t.insetWidth+t.padding+t.buttonHeight:0)];return r},getPickerOuterDims:function(t){var n=e.getPickerDims(t);return[n[0]+2*t.borderWidth,n[1]+2*t.borderWidth]},getPadToSliderPadding:function(e){return Math.max(e.padding,1.5*(2*e.pointerBorderWidth+e.pointerThickness))},getPadYComponent:function(e){switch(e.mode.charAt(1).toLowerCase()){case"v":return"v"}return"s"},getSliderComponent:function(e){if(e.mode.length>2)switch(e.mode.charAt(2).toLowerCase()){case"s":return"s";case"v":return"v"}return null},onDocumentMouseDown:function(t){t||(t=window.event);var n=t.target||t.srcElement;n._jscLinkedInstance?n._jscLinkedInstance.showOnClick&&n._jscLinkedInstance.show():n._jscControlName?e.onControlPointerStart(t,n,n._jscControlName,"mouse"):e.picker&&e.picker.owner&&e.picker.owner.hide()},onDocumentTouchStart:function(t){t||(t=window.event);var n=t.target||t.srcElement;n._jscLinkedInstance?n._jscLinkedInstance.showOnClick&&n._jscLinkedInstance.show():n._jscControlName?e.onControlPointerStart(t,n,n._jscControlName,"touch"):e.picker&&e.picker.owner&&e.picker.owner.hide()},onWindowResize:function(t){e.redrawPosition()},onParentScroll:function(t){e.picker&&e.picker.owner&&e.picker.owner.hide()},_pointerMoveEvent:{mouse:"mousemove",touch:"touchmove"},_pointerEndEvent:{mouse:"mouseup",touch:"touchend"},_pointerOrigin:null,_capturedTarget:null,onControlPointerStart:function(t,n,r,i){var s=n._jscInstance;e.preventDefault(t),e.captureTarget(n);var o=function(s,o){e.attachGroupEvent("drag",s,e._pointerMoveEvent[i],e.onDocumentPointerMove(t,n,r,i,o)),e.attachGroupEvent("drag",s,e._pointerEndEvent[i],e.onDocumentPointerEnd(t,n,r,i))};o(document,[0,0]);if(window.parent&&window.frameElement){var u=window.frameElement.getBoundingClientRect(),a=[-u.left,-u.top];o(window.parent.window.document,a)}var f=e.getAbsPointerPos(t),l=e.getRelPointerPos(t);e._pointerOrigin={x:f.x-l.x,y:f.y-l.y};switch(r){case"pad":switch(e.getSliderComponent(s)){case"s":s.hsv[1]===0&&s.fromHSV(null,100,null);break;case"v":s.hsv[2]===0&&s.fromHSV(null,null,100)}e.setPad(s,t,0,0);break;case"sld":e.setSld(s,t,0)}e.dispatchFineChange(s)},onDocumentPointerMove:function(t,n,r,i,s){return function(t){var i=n._jscInstance;switch(r){case"pad":t||(t=window.event),e.setPad(i,t,s[0],s[1]),e.dispatchFineChange(i);break;case"sld":t||(t=window.event),e.setSld(i,t,s[1]),e.dispatchFineChange(i)}}},onDocumentPointerEnd:function(t,n,r,i){return function(t){var r=n._jscInstance;e.detachGroupEvents("drag"),e.releaseTarget(),e.dispatchChange(r)}},dispatchChange:function(t){t.valueElement&&e.isElementType(t.valueElement,"input")&&e.fireEvent(t.valueElement,"change")},dispatchFineChange:function(e){if(e.onFineChange){var t;typeof e.onFineChange=="string"?t=new Function(e.onFineChange):t=e.onFineChange,t.call(e)}},setPad:function(t,n,r,i){var s=e.getAbsPointerPos(n),o=r+s.x-e._pointerOrigin.x-t.padding-t.insetWidth,u=i+s.y-e._pointerOrigin.y-t.padding-t.insetWidth,a=o*(360/(t.width-1)),f=100-u*(100/(t.height-1));switch(e.getPadYComponent(t)){case"s":t.fromHSV(a,f,null,e.leaveSld);break;case"v":t.fromHSV(a,null,f,e.leaveSld)}},setSld:function(t,n,r){var i=e.getAbsPointerPos(n),s=r+i.y-e._pointerOrigin.y-t.padding-t.insetWidth,o=100-s*(100/(t.height-1));switch(e.getSliderComponent(t)){case"s":t.fromHSV(null,o,null,e.leavePad);break;case"v":t.fromHSV(null,null,o,e.leavePad)}},_vmlNS:"jsc_vml_",_vmlCSS:"jsc_vml_css_",_vmlReady:!1,initVML:function(){if(!e._vmlReady){var t=document;t.namespaces[e._vmlNS]||t.namespaces.add(e._vmlNS,"urn:schemas-microsoft-com:vml");if(!t.styleSheets[e._vmlCSS]){var n=["shape","shapetype","group","background","path","formulas","handles","fill","stroke","shadow","textbox","textpath","imagedata","line","polyline","curve","rect","roundrect","oval","arc","image"],r=t.createStyleSheet();r.owningElement.id=e._vmlCSS;for(var i=0;i<n.length;i+=1)r.addRule(e._vmlNS+"\\:"+n[i],"behavior:url(#default#VML);")}e._vmlReady=!0}},createPalette:function(){var t={elm:null,draw:null};if(e.isCanvasSupported){var n=document.createElement("canvas"),r=n.getContext("2d"),i=function(e,t,i){n.width=e,n.height=t,r.clearRect(0,0,n.width,n.height);var s=r.createLinearGradient(0,0,n.width,0);s.addColorStop(0,"#F00"),s.addColorStop(1/6,"#FF0"),s.addColorStop(2/6,"#0F0"),s.addColorStop(.5,"#0FF"),s.addColorStop(4/6,"#00F"),s.addColorStop(5/6,"#F0F"),s.addColorStop(1,"#F00"),r.fillStyle=s,r.fillRect(0,0,n.width,n.height);var o=r.createLinearGradient(0,0,0,n.height);switch(i.toLowerCase()){case"s":o.addColorStop(0,"rgba(255,255,255,0)"),o.addColorStop(1,"rgba(255,255,255,1)");break;case"v":o.addColorStop(0,"rgba(0,0,0,0)"),o.addColorStop(1,"rgba(0,0,0,1)")}r.fillStyle=o,r.fillRect(0,0,n.width,n.height)};t.elm=n,t.draw=i}else{e.initVML();var s=document.createElement("div");s.style.position="relative",s.style.overflow="hidden";var o=document.createElement(e._vmlNS+":fill");o.type="gradient",o.method="linear",o.angle="90",o.colors="16.67% #F0F, 33.33% #00F, 50% #0FF, 66.67% #0F0, 83.33% #FF0";var u=document.createElement(e._vmlNS+":rect");u.style.position="absolute",u.style.left="-1px",u.style.top="-1px",u.stroked=!1,u.appendChild(o),s.appendChild(u);var a=document.createElement(e._vmlNS+":fill");a.type="gradient",a.method="linear",a.angle="180",a.opacity="0";var f=document.createElement(e._vmlNS+":rect");f.style.position="absolute",f.style.left="-1px",f.style.top="-1px",f.stroked=!1,f.appendChild(a),s.appendChild(f);var i=function(e,t,n){s.style.width=e+"px",s.style.height=t+"px",u.style.width=f.style.width=e+1+"px",u.style.height=f.style.height=t+1+"px",o.color="#F00",o.color2="#F00";switch(n.toLowerCase()){case"s":a.color=a.color2="#FFF";break;case"v":a.color=a.color2="#000"}};t.elm=s,t.draw=i}return t},createSliderGradient:function(){var t={elm:null,draw:null};if(e.isCanvasSupported){var n=document.createElement("canvas"),r=n.getContext("2d"),i=function(e,t,i,s){n.width=e,n.height=t,r.clearRect(0,0,n.width,n.height);var o=r.createLinearGradient(0,0,0,n.height);o.addColorStop(0,i),o.addColorStop(1,s),r.fillStyle=o,r.fillRect(0,0,n.width,n.height)};t.elm=n,t.draw=i}else{e.initVML();var s=document.createElement("div");s.style.position="relative",s.style.overflow="hidden";var o=document.createElement(e._vmlNS+":fill");o.type="gradient",o.method="linear",o.angle="180";var u=document.createElement(e._vmlNS+":rect");u.style.position="absolute",u.style.left="-1px",u.style.top="-1px",u.stroked=!1,u.appendChild(o),s.appendChild(u);var i=function(e,t,n,r){s.style.width=e+"px",s.style.height=t+"px",u.style.width=e+1+"px",u.style.height=t+1+"px",o.color=n,o.color2=r};t.elm=s,t.draw=i}return t},leaveValue:1,leaveStyle:2,leavePad:4,leaveSld:8,BoxShadow:function(){var e=function(e,t,n,r,i,s){this.hShadow=e,this.vShadow=t,this.blur=n,this.spread=r,this.color=i,this.inset=!!s};return e.prototype.toString=function(){var e=[Math.round(this.hShadow)+"px",Math.round(this.vShadow)+"px",Math.round(this.blur)+"px",Math.round(this.spread)+"px",this.color];return this.inset&&e.push("inset"),e.join(" ")},e}(),jscolor:function(t,n){function i(e,t,n){e/=255,t/=255,n/=255;var r=Math.min(Math.min(e,t),n),i=Math.max(Math.max(e,t),n),s=i-r;if(s===0)return[null,0,100*i];var o=e===r?3+(n-t)/s:t===r?5+(e-n)/s:1+(t-e)/s;return[60*(o===6?0:o),100*(s/i),100*i]}function s(e,t,n){var r=255*(n/100);if(e===null)return[r,r,r];e/=60,t/=100;var i=Math.floor(e),s=i%2?e-i:1-(e-i),o=r*(1-t),u=r*(1-t*s);switch(i){case 6:case 0:return[r,u,o];case 1:return[u,r,o];case 2:return[o,r,u];case 3:return[o,u,r];case 4:return[u,o,r];case 5:return[r,o,u]}}function o(){e.unsetClass(d.targetElement,d.activeClass),e.picker.wrap.parentNode.removeChild(e.picker.wrap),delete e.picker.owner}function u(){function l(){var e=d.insetColor.split(/\s+/),n=e.length<2?e[0]:e[1]+" "+e[0]+" "+e[0]+" "+e[1];t.btn.style.borderColor=n}d._processParentElementsInDOM(),e.picker||(e.picker={owner:null,wrap:document.createElement("div"),box:document.createElement("div"),boxS:document.createElement("div"),boxB:document.createElement("div"),pad:document.createElement("div"),padB:document.createElement("div"),padM:document.createElement("div"),padPal:e.createPalette(),cross:document.createElement("div"),crossBY:document.createElement("div"),crossBX:document.createElement("div"),crossLY:document.createElement("div"),crossLX:document.createElement("div"),sld:document.createElement("div"),sldB:document.createElement("div"),sldM:document.createElement("div"),sldGrad:e.createSliderGradient(),sldPtrS:document.createElement("div"),sldPtrIB:document.createElement("div"),sldPtrMB:document.createElement("div"),sldPtrOB:document.createElement("div"),btn:document.createElement("div"),btnT:document.createElement("span")},e.picker.pad.appendChild(e.picker.padPal.elm),e.picker.padB.appendChild(e.picker.pad),e.picker.cross.appendChild(e.picker.crossBY),e.picker.cross.appendChild(e.picker.crossBX),e.picker.cross.appendChild(e.picker.crossLY),e.picker.cross.appendChild(e.picker.crossLX),e.picker.padB.appendChild(e.picker.cross),e.picker.box.appendChild(e.picker.padB),e.picker.box.appendChild(e.picker.padM),e.picker.sld.appendChild(e.picker.sldGrad.elm),e.picker.sldB.appendChild(e.picker.sld),e.picker.sldB.appendChild(e.picker.sldPtrOB),e.picker.sldPtrOB.appendChild(e.picker.sldPtrMB),e.picker.sldPtrMB.appendChild(e.picker.sldPtrIB),e.picker.sldPtrIB.appendChild(e.picker.sldPtrS),e.picker.box.appendChild(e.picker.sldB),e.picker.box.appendChild(e.picker.sldM),e.picker.btn.appendChild(e.picker.btnT),e.picker.box.appendChild(e.picker.btn),e.picker.boxB.appendChild(e.picker.box),e.picker.wrap.appendChild(e.picker.boxS),e.picker.wrap.appendChild(e.picker.boxB));var t=e.picker,n=!!e.getSliderComponent(d),r=e.getPickerDims(d),i=2*d.pointerBorderWidth+d.pointerThickness+2*d.crossSize,s=e.getPadToSliderPadding(d),o=Math.min(d.borderRadius,Math.round(d.padding*Math.PI)),u="crosshair";t.wrap.style.clear="both",t.wrap.style.width=r[0]+2*d.borderWidth+"px",t.wrap.style.height=r[1]+2*d.borderWidth+"px",t.wrap.style.zIndex=d.zIndex,t.box.style.width=r[0]+"px",t.box.style.height=r[1]+"px",t.boxS.style.position="absolute",t.boxS.style.left="0",t.boxS.style.top="0",t.boxS.style.width="100%",t.boxS.style.height="100%",e.setBorderRadius(t.boxS,o+"px"),t.boxB.style.position="relative",t.boxB.style.border=d.borderWidth+"px solid",t.boxB.style.borderColor=d.borderColor,t.boxB.style.background=d.backgroundColor,e.setBorderRadius(t.boxB,o+"px"),t.padM.style.background=t.sldM.style.background="#FFF",e.setStyle(t.padM,"opacity","0"),e.setStyle(t.sldM,"opacity","0"),t.pad.style.position="relative",t.pad.style.width=d.width+"px",t.pad.style.height=d.height+"px",t.padPal.draw(d.width,d.height,e.getPadYComponent(d)),t.padB.style.position="absolute",t.padB.style.left=d.padding+"px",t.padB.style.top=d.padding+"px",t.padB.style.border=d.insetWidth+"px solid",t.padB.style.borderColor=d.insetColor,t.padM._jscInstance=d,t.padM._jscControlName="pad",t.padM.style.position="absolute",t.padM.style.left="0",t.padM.style.top="0",t.padM.style.width=d.padding+2*d.insetWidth+d.width+s/2+"px",t.padM.style.height=r[1]+"px",t.padM.style.cursor=u,t.cross.style.position="absolute",t.cross.style.left=t.cross.style.top="0",t.cross.style.width=t.cross.style.height=i+"px",t.crossBY.style.position=t.crossBX.style.position="absolute",t.crossBY.style.background=t.crossBX.style.background=d.pointerBorderColor,t.crossBY.style.width=t.crossBX.style.height=2*d.pointerBorderWidth+d.pointerThickness+"px",t.crossBY.style.height=t.crossBX.style.width=i+"px",t.crossBY.style.left=t.crossBX.style.top=Math.floor(i/2)-Math.floor(d.pointerThickness/2)-d.pointerBorderWidth+"px",t.crossBY.style.top=t.crossBX.style.left="0",t.crossLY.style.position=t.crossLX.style.position="absolute",t.crossLY.style.background=t.crossLX.style.background=d.pointerColor,t.crossLY.style.height=t.crossLX.style.width=i-2*d.pointerBorderWidth+"px",t.crossLY.style.width=t.crossLX.style.height=d.pointerThickness+"px",t.crossLY.style.left=t.crossLX.style.top=Math.floor(i/2)-Math.floor(d.pointerThickness/2)+"px",t.crossLY.style.top=t.crossLX.style.left=d.pointerBorderWidth+"px",t.sld.style.overflow="hidden",t.sld.style.width=d.sliderSize+"px",t.sld.style.height=d.height+"px",t.sldGrad.draw(d.sliderSize,d.height,"#000","#000"),t.sldB.style.display=n?"block":"none",t.sldB.style.position="absolute",t.sldB.style.right=d.padding+"px",t.sldB.style.top=d.padding+"px",t.sldB.style.border=d.insetWidth+"px solid",t.sldB.style.borderColor=d.insetColor,t.sldM._jscInstance=d,t.sldM._jscControlName="sld",t.sldM.style.display=n?"block":"none",t.sldM.style.position="absolute",t.sldM.style.right="0",t.sldM.style.top="0",t.sldM.style.width=d.sliderSize+s/2+d.padding+2*d.insetWidth+"px",t.sldM.style.height=r[1]+"px",t.sldM.style.cursor="default",t.sldPtrIB.style.border=t.sldPtrOB.style.border=d.pointerBorderWidth+"px solid "+d.pointerBorderColor,t.sldPtrOB.style.position="absolute",t.sldPtrOB.style.left=-(2*d.pointerBorderWidth+d.pointerThickness)+"px",t.sldPtrOB.style.top="0",t.sldPtrMB.style.border=d.pointerThickness+"px solid "+d.pointerColor,t.sldPtrS.style.width=d.sliderSize+"px",t.sldPtrS.style.height=m+"px",t.btn.style.display=d.closable?"block":"none",t.btn.style.position="absolute",t.btn.style.left=d.padding+"px",t.btn.style.bottom=d.padding+"px",t.btn.style.padding="0 15px",t.btn.style.height=d.buttonHeight+"px",t.btn.style.border=d.insetWidth+"px solid",l(),t.btn.style.color=d.buttonColor,t.btn.style.font="12px sans-serif",t.btn.style.textAlign="center";try{t.btn.style.cursor="pointer"}catch(c){t.btn.style.cursor="hand"}t.btn.onmousedown=function(){d.hide()},t.btnT.style.lineHeight=d.buttonHeight+"px",t.btnT.innerHTML="",t.btnT.appendChild(document.createTextNode(d.closeText)),a(),f(),e.picker.owner&&e.picker.owner!==d&&e.unsetClass(e.picker.owner.targetElement,d.activeClass),e.picker.owner=d,e.isElementType(v,"body")?e.redrawPosition():e._drawPosition(d,0,0,"relative",!1),t.wrap.parentNode!=v&&v.appendChild(t.wrap),e.setClass(d.targetElement,d.activeClass)}function a(){switch(e.getPadYComponent(d)){case"s":var t=1;break;case"v":var t=2}var n=Math.round(d.hsv[0]/360*(d.width-1)),r=Math.round((1-d.hsv[t]/100)*(d.height-1)),i=2*d.pointerBorderWidth+d.pointerThickness+2*d.crossSize,o=-Math.floor(i/2);e.picker.cross.style.left=n+o+"px",e.picker.cross.style.top=r+o+"px";switch(e.getSliderComponent(d)){case"s":var u=s(d.hsv[0],100,d.hsv[2]),a=s(d.hsv[0],0,d.hsv[2]),f="rgb("+Math.round(u[0])+","+Math.round(u[1])+","+Math.round(u[2])+")",l="rgb("+Math.round(a[0])+","+Math.round(a[1])+","+Math.round(a[2])+")";e.picker.sldGrad.draw(d.sliderSize,d.height,f,l);break;case"v":var c=s(d.hsv[0],d.hsv[1],100),f="rgb("+Math.round(c[0])+","+Math.round(c[1])+","+Math.round(c[2])+")",l="#000";e.picker.sldGrad.draw(d.sliderSize,d.height,f,l)}}function f(){var t=e.getSliderComponent(d);if(t){switch(t){case"s":var n=1;break;case"v":var n=2}var r=Math.round((1-d.hsv[n]/100)*(d.height-1));e.picker.sldPtrOB.style.top=r-(2*d.pointerBorderWidth+d.pointerThickness)-Math.floor(m/2)+"px"}}function l(){return e.picker&&e.picker.owner===d}function c(){d.importColor()}this.value=null,this.valueElement=t,this.styleElement=t,this.required=!0,this.refine=!0,this.hash=!1,this.uppercase=!0,this.onFineChange=null,this.activeClass="jscolor-active",this.minS=0,this.maxS=100,this.minV=0,this.maxV=100,this.hsv=[0,0,100],this.rgb=[255,255,255],this.width=181,this.height=101,this.showOnClick=!0,this.mode="HSV",this.position="bottom",this.smartPosition=!0,this.sliderSize=16,this.crossSize=8,this.closable=!1,this.closeText="Close",this.buttonColor="#000000",this.buttonHeight=18,this.padding=12,this.backgroundColor="#FFFFFF",this.borderWidth=1,this.borderColor="#BBBBBB",this.borderRadius=8,this.insetWidth=1,this.insetColor="#BBBBBB",this.shadow=!0,this.shadowBlur=15,this.shadowColor="rgba(0,0,0,0.2)",this.pointerColor="#4C4C4C",this.pointerBorderColor="#FFFFFF",this.pointerBorderWidth=1,this.pointerThickness=2,this.zIndex=1e3,this.container=null;for(var r in n)n.hasOwnProperty(r)&&(this[r]=n[r]);this.hide=function(){l()&&o()},this.show=function(){u()},this.redraw=function(){l()&&u()},this.importColor=function(){this.valueElement?e.isElementType(this.valueElement,"input")?this.refine?!this.required&&/^\s*$/.test(this.valueElement.value)?(this.valueElement.value="",this.styleElement&&(this.styleElement.style.backgroundImage=this.styleElement._jscOrigStyle.backgroundImage,this.styleElement.style.backgroundColor=this.styleElement._jscOrigStyle.backgroundColor,this.styleElement.style.color=this.styleElement._jscOrigStyle.color),this.exportColor(e.leaveValue|e.leaveStyle)):this.fromString(this.valueElement.value)||this.exportColor():this.fromString(this.valueElement.value,e.leaveValue)||(this.styleElement&&(this.styleElement.style.backgroundImage=this.styleElement._jscOrigStyle.backgroundImage,this.styleElement.style.backgroundColor=this.styleElement._jscOrigStyle.backgroundColor,this.styleElement.style.color=this.styleElement._jscOrigStyle.color),this.exportColor(e.leaveValue|e.leaveStyle)):this.exportColor():this.exportColor()},this.exportColor=function(t){if(!(t&e.leaveValue)&&this.valueElement){var n=this.toString();this.uppercase&&(n=n.toUpperCase()),this.hash&&(n="#"+n),e.isElementType(this.valueElement,"input")?this.valueElement.value=n:this.valueElement.innerHTML=n}t&e.leaveStyle||this.styleElement&&(this.styleElement.style.backgroundImage="none",this.styleElement.style.backgroundColor="#"+this.toString(),this.styleElement.style.color=this.isLight()?"#000":"#FFF"),!(t&e.leavePad)&&l()&&a(),!(t&e.leaveSld)&&l()&&f()},this.fromHSV=function(e,t,n,r){if(e!==null){if(isNaN(e))return!1;e=Math.max(0,Math.min(360,e))}if(t!==null){if(isNaN(t))return!1;t=Math.max(0,Math.min(100,this.maxS,t),this.minS)}if(n!==null){if(isNaN(n))return!1;n=Math.max(0,Math.min(100,this.maxV,n),this.minV)}this.rgb=s(e===null?this.hsv[0]:this.hsv[0]=e,t===null?this.hsv[1]:this.hsv[1]=t,n===null?this.hsv[2]:this.hsv[2]=n),this.exportColor(r)},this.fromRGB=function(e,t,n,r){if(e!==null){if(isNaN(e))return!1;e=Math.max(0,Math.min(255,e))}if(t!==null){if(isNaN(t))return!1;t=Math.max(0,Math.min(255,t))}if(n!==null){if(isNaN(n))return!1;n=Math.max(0,Math.min(255,n))}var o=i(e===null?this.rgb[0]:e,t===null?this.rgb[1]:t,n===null?this.rgb[2]:n);o[0]!==null&&(this.hsv[0]=Math.max(0,Math.min(360,o[0]))),o[2]!==0&&(this.hsv[1]=o[1]===null?null:Math.max(0,this.minS,Math.min(100,this.maxS,o[1]))),this.hsv[2]=o[2]===null?null:Math.max(0,this.minV,Math.min(100,this.maxV,o[2]));var u=s(this.hsv[0],this.hsv[1],this.hsv[2]);this.rgb[0]=u[0],this.rgb[1]=u[1],this.rgb[2]=u[2],this.exportColor(r)},this.fromString=function(e,t){var n;if(n=e.match(/^\W*([0-9A-F]{3}([0-9A-F]{3})?)\W*$/i))return n[1].length===6?this.fromRGB(parseInt(n[1].substr(0,2),16),parseInt(n[1].substr(2,2),16),parseInt(n[1].substr(4,2),16),t):this.fromRGB(parseInt(n[1].charAt(0)+n[1].charAt(0),16),parseInt(n[1].charAt(1)+n[1].charAt(1),16),parseInt(n[1].charAt(2)+n[1].charAt(2),16),t),!0;if(n=e.match(/^\W*rgba?\(([^)]*)\)\W*$/i)){var r=n[1].split(","),i=/^\s*(\d*)(\.\d+)?\s*$/,s,o,u;if(r.length>=3&&(s=r[0].match(i))&&(o=r[1].match(i))&&(u=r[2].match(i))){var a=parseFloat((s[1]||"0")+(s[2]||"")),f=parseFloat((o[1]||"0")+(o[2]||"")),l=parseFloat((u[1]||"0")+(u[2]||""));return this.fromRGB(a,f,l,t),!0}}return!1},this.toString=function(){return(256|Math.round(this.rgb[0])).toString(16).substr(1)+(256|Math.round(this.rgb[1])).toString(16).substr(1)+(256|Math.round(this.rgb[2])).toString(16).substr(1)},this.toHEXString=function(){return"#"+this.toString().toUpperCase()},this.toRGBString=function(){return"rgb("+Math.round(this.rgb[0])+","+Math.round(this.rgb[1])+","+Math.round(this.rgb[2])+")"},this.isLight=function(){return.213*this.rgb[0]+.715*this.rgb[1]+.072*this.rgb[2]>127.5},this._processParentElementsInDOM=function(){if(this._linkedElementsProcessed)return;this._linkedElementsProcessed=!0;var t=this.targetElement;do{var n=e.getStyle(t);n&&n.position.toLowerCase()==="fixed"&&(this.fixed=!0),t!==this.targetElement&&(t._jscEventsAttached||(e.attachEvent(t,"scroll",e.onParentScroll),t._jscEventsAttached=!0))}while((t=t.parentNode)&&!e.isElementType(t,"body"))};if(typeof t=="string"){var h=t,p=document.getElementById(h);p?this.targetElement=p:e.warn("Could not find target element with ID '"+h+"'")}else t?this.targetElement=t:e.warn("Invalid target element: '"+t+"'");if(this.targetElement._jscLinkedInstance){e.warn("Cannot link jscolor twice to the same element. Skipping.");return}this.targetElement._jscLinkedInstance=this,this.valueElement=e.fetchElement(this.valueElement),this.styleElement=e.fetchElement(this.styleElement);var d=this,v=this.container?e.fetchElement(this.container):document.getElementsByTagName("body")[0],m=3;if(e.isElementType(this.targetElement,"button"))if(this.targetElement.onclick){var g=this.targetElement.onclick;this.targetElement.onclick=function(e){return g.call(this,e),!1}}else this.targetElement.onclick=function(){return!1};if(this.valueElement&&e.isElementType(this.valueElement,"input")){var y=function(){d.fromString(d.valueElement.value,e.leaveValue),e.dispatchFineChange(d)};e.attachEvent(this.valueElement,"keyup",y),e.attachEvent(this.valueElement,"input",y),e.attachEvent(this.valueElement,"blur",c),this.valueElement.setAttribute("autocomplete","off")}this.styleElement&&(this.styleElement._jscOrigStyle={backgroundImage:this.styleElement.style.backgroundImage,backgroundColor:this.styleElement.style.backgroundColor,color:this.styleElement.style.color}),this.value?this.fromString(this.value)||this.exportColor():this.importColor()}};return e.jscolor.lookupClass="jscolor",e.jscolor.installByClassName=function(t){var n=document.getElementsByTagName("input"),r=document.getElementsByTagName("button");e.tryInstallOnElements(n,t),e.tryInstallOnElements(r,t)},e.register(),e.jscolor}());
})();
}
})();