├── LICENSE
├── README.md
├── background.js
├── content.js
├── docs
├── blue_demo.png
├── demo.gif.gif
├── newer-logo.xcf
├── purple_demo.png
├── red_demo.png
└── yellow_demo.png
├── icons
├── logo.png
├── logo_128x128.png
├── logo_16x16.png
└── logo_48x48.png
├── jquery.js
├── jscolor.js
├── manifest.json
├── plugin.zip
├── plugin
├── background.js
├── content.js
├── icons
│ ├── logo.png
│ ├── logo_128x128.png
│ ├── logo_16x16.png
│ └── logo_48x48.png
├── jquery.js
├── jscolor.js
├── manifest.json
├── popup.html
└── popup.js
├── popup.html
└── popup.js
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2019 Patrick Scott
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 | Colorize Github Contribution Heatmaps
7 |
8 |
9 | :star: Overview
10 | --------
11 |
12 | A Chrome extension that changes the colors of contribution heatmaps in GitHub.
13 |
14 | Features:
15 |
16 | * Colorize contribution graph and legend
17 | * Colorize activity overview graph
18 |
19 | :wrench: Install
20 | -------
21 | 1. Download the [plugin files](https://github.com/pkellz/github-heatmap-colorizer/blob/master/plugin.zip?raw=true)
22 | 2. Unzip the folder
23 | 3. Visit `chrome://extensions`
24 | 4. Make sure 'Developer Mode' is enabled
25 | 5. Drag and drop the unzipped folder
26 |
27 | :camera: Screenshots
28 | -----------
29 | Blue | Red
30 | :----------------------------------:|:--------------------------------------:
31 | |
32 |
33 | Purple | Yellow
34 | :----------------------------------:|:--------------------------------------:
35 | |
36 |
37 | ## :hammer: Usage
38 | 
39 |
40 | :family: Contributing
41 | ------------
42 |
43 | Contributions are welcome!
44 |
--------------------------------------------------------------------------------
/background.js:
--------------------------------------------------------------------------------
1 | // Activate plugin on every tab update
2 | chrome.tabs.onUpdated.addListener(() => {
3 | chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
4 | chrome.tabs.executeScript(
5 | tabs[0].id,
6 | { file: 'content.js' });
7 | });
8 | })
--------------------------------------------------------------------------------
/content.js:
--------------------------------------------------------------------------------
1 | (function(){
2 | // If on someone's Github profile
3 | const activityContainer = document.querySelector('.graph-before-activity-overview')
4 | if(activityContainer)
5 | initColorize()
6 | })()
7 |
8 | function initColorize()
9 | {
10 | chrome.storage.local.get('color', function(data) {
11 | if(!data.color)
12 | data.color = '4594A8'
13 | let mainColorHex = `#${data.color}`
14 |
15 | const legendItems = document.querySelectorAll('.contrib-legend ul li')
16 | const originalColors = []
17 | for(let li of legendItems)
18 | originalColors.push(li.getAttribute('style').split(':')[1].trim())
19 |
20 | colorizeActivity(mainColorHex)
21 | colorizeLegend(mainColorHex, originalColors, legendItems)
22 | colorizeDays(mainColorHex, originalColors)
23 | });
24 | }
25 |
26 | function colorizeActivity(color)
27 | {
28 | const activity = document.querySelector('.js-highlight-blob')
29 | if(activity)
30 | {
31 | const axes = document.querySelectorAll('.activity-overview-axis')
32 | const ellipses = document.querySelectorAll('.activity-overview-point')
33 | const blob = document.querySelector('.js-highlight-blob')
34 | activity.setAttribute('stroke', color)
35 | blob.style.fill = color
36 | for(let ellipse of ellipses)
37 | ellipse.style.stroke = color
38 | for(let axis of axes)
39 | axis.style.stroke = color
40 | }
41 | }
42 |
43 | function colorizeLegend(mainColor, originalColors, legendItems)
44 | {
45 | legendItems[0].setAttribute('style', `background-color:${originalColors[0]}`)
46 | legendItems[1].setAttribute('style', `background-color:${colorLuminance(mainColor, 0.9)}`)
47 | legendItems[2].setAttribute('style', `background-color:${colorLuminance(mainColor, 0.75)}`)
48 | legendItems[3].setAttribute('style', `background-color:${colorLuminance(mainColor, 0.5)}`)
49 | legendItems[4].setAttribute('style', `background-color:${mainColor}`)
50 | }
51 |
52 | function colorizeDays(mainColor, originalColors)
53 | {
54 | let days = Array.from(document.getElementsByClassName('day'))
55 |
56 | const dayGroups = {
57 | 0: days.filter( day => day.getAttribute('fill') == originalColors[0]),
58 | 1: days.filter( day => day.getAttribute('fill') == originalColors[1]),
59 | 2: days.filter( day => day.getAttribute('fill') == originalColors[2]),
60 | 3: days.filter( day => day.getAttribute('fill') == originalColors[3]),
61 | 4: days.filter( day => day.getAttribute('fill') == originalColors[4])
62 | }
63 |
64 | dayGroups[0].forEach(day => day.setAttribute('fill', originalColors[0]))
65 | dayGroups[1].forEach(day => day.setAttribute('fill', colorLuminance(mainColor, 0.9)))
66 | dayGroups[2].forEach(day => day.setAttribute('fill', colorLuminance(mainColor, 0.75)))
67 | dayGroups[3].forEach(day => day.setAttribute('fill', colorLuminance(mainColor, 0.5)))
68 | dayGroups[4].forEach(day => day.setAttribute('fill', mainColor))
69 | }
70 |
71 | function colorLuminance(hex, lum) {
72 | // validate hex string
73 | hex = String(hex).replace(/[^0-9a-f]/gi, '');
74 | if (hex.length < 6) {
75 | hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
76 | }
77 | lum = lum || 0;
78 |
79 | // convert to decimal and change luminosity
80 | let rgb = "#", c, i;
81 | for (i = 0; i < 3; i++) {
82 | c = parseInt(hex.substr(i*2,2), 16);
83 | c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
84 | rgb += ("00"+c).substr(c.length);
85 | }
86 | return rgb;
87 | }
88 |
--------------------------------------------------------------------------------
/docs/blue_demo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/docs/blue_demo.png
--------------------------------------------------------------------------------
/docs/demo.gif.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/docs/demo.gif.gif
--------------------------------------------------------------------------------
/docs/newer-logo.xcf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/docs/newer-logo.xcf
--------------------------------------------------------------------------------
/docs/purple_demo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/docs/purple_demo.png
--------------------------------------------------------------------------------
/docs/red_demo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/docs/red_demo.png
--------------------------------------------------------------------------------
/docs/yellow_demo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/docs/yellow_demo.png
--------------------------------------------------------------------------------
/icons/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/icons/logo.png
--------------------------------------------------------------------------------
/icons/logo_128x128.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/icons/logo_128x128.png
--------------------------------------------------------------------------------
/icons/logo_16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/icons/logo_16x16.png
--------------------------------------------------------------------------------
/icons/logo_48x48.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/pkellz/github-heatmap-colorizer/96c9e6f6861a0d4dc33900f3f29601bab4b51956/icons/logo_48x48.png
--------------------------------------------------------------------------------
/jquery.js:
--------------------------------------------------------------------------------
1 | /*! jQuery v3.4.1 | (c) JS Foundation and other contributors | jquery.org/license */
2 | !function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],E=C.document,r=Object.getPrototypeOf,s=t.slice,g=t.concat,u=t.push,i=t.indexOf,n={},o=n.toString,v=n.hasOwnProperty,a=v.toString,l=a.call(Object),y={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType},x=function(e){return null!=e&&e===e.window},c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.4.1",k=function(e,t){return new k.fn.init(e,t)},p=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function d(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp($),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+$),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\([\\da-f]{1,6}"+M+"?|("+M+")|.)","ig"),ne=function(e,t,n){var r="0x"+t-65536;return r!=r||n?t:r<0?String.fromCharCode(r+65536):String.fromCharCode(r>>10|55296,1023&r|56320)},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(m.childNodes),m.childNodes),t[m.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&((e?e.ownerDocument||e:m)!==C&&T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&y(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!A[t+" "]&&(!v||!v.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&U.test(t)){(s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=k),o=(l=h(t)).length;while(o--)l[o]="#"+s+" "+xe(l[o]);c=l.join(","),f=ee.test(t)&&ye(e.parentNode)||e}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){A(t,!0)}finally{s===k&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[k]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ve(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ye(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e.namespaceURI,n=(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:m;return r!==C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),m!==C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=k,!C.getElementsByName||!C.getElementsByName(k).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],v=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){a.appendChild(e).innerHTML="":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=p[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&p(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?k.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?k.grep(e,function(e){return e===n!==r}):"string"!=typeof n?k.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(k.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||q,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:L.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof k?t[0]:t,k.merge(this,k.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),D.test(r[1])&&k.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(k):k.makeArray(e,this)}).prototype=k.fn,q=k(E);var H=/^(?:parents|prev(?:Until|All))/,O={children:!0,contents:!0,next:!0,prev:!0};function P(e,t){while((e=e[t])&&1!==e.nodeType);return e}k.fn.extend({has:function(e){var t=k(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i,ge={option:[1,""," "],thead:[1,""],col:[2,""],tr:[2,""],td:[3,""],_default:[0,"",""]};function ve(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?k.merge([e],n):n}function ye(e,t){for(var n=0,r=e.length;nx",y.noCloneChecked=!!me.cloneNode(!0).lastChild.defaultValue;var Te=/^key/,Ce=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,Ee=/^([^.]*)(?:\.(.+)|)/;function ke(){return!0}function Se(){return!1}function Ne(e,t){return e===function(){try{return E.activeElement}catch(e){}}()==("focus"===t)}function Ae(e,t,n,r,i,o){var a,s;if("object"==typeof t){for(s in"string"!=typeof n&&(r=r||n,n=void 0),t)Ae(e,s,n,r,t[s],o);return e}if(null==r&&null==i?(i=n,r=n=void 0):null==i&&("string"==typeof n?(i=r,r=void 0):(i=r,r=n,n=void 0)),!1===i)i=Se;else if(!i)return e;return 1===o&&(a=i,(i=function(e){return k().off(e),a.apply(this,arguments)}).guid=a.guid||(a.guid=k.guid++)),e.each(function(){k.event.add(this,t,i,r,n)})}function De(e,i,o){o?(Q.set(e,i,!1),k.event.add(e,i,{namespace:!1,handler:function(e){var t,n,r=Q.get(this,i);if(1&e.isTrigger&&this[i]){if(r.length)(k.event.special[i]||{}).delegateType&&e.stopPropagation();else if(r=s.call(arguments),Q.set(this,i,r),t=o(this,i),this[i](),r!==(n=Q.get(this,i))||t?Q.set(this,i,!1):n={},r!==n)return e.stopImmediatePropagation(),e.preventDefault(),n.value}else r.length&&(Q.set(this,i,{value:k.event.trigger(k.extend(r[0],k.Event.prototype),r.slice(1),this)}),e.stopImmediatePropagation())}})):void 0===Q.get(e,i)&&k.event.add(e,i,ke)}k.event={global:{},add:function(t,e,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.get(t);if(v){n.handler&&(n=(o=n).handler,i=o.selector),i&&k.find.matchesSelector(ie,i),n.guid||(n.guid=k.guid++),(u=v.events)||(u=v.events={}),(a=v.handle)||(a=v.handle=function(e){return"undefined"!=typeof k&&k.event.triggered!==e.type?k.event.dispatch.apply(t,arguments):void 0}),l=(e=(e||"").match(R)||[""]).length;while(l--)d=g=(s=Ee.exec(e[l])||[])[1],h=(s[2]||"").split(".").sort(),d&&(f=k.event.special[d]||{},d=(i?f.delegateType:f.bindType)||d,f=k.event.special[d]||{},c=k.extend({type:d,origType:g,data:r,handler:n,guid:n.guid,selector:i,needsContext:i&&k.expr.match.needsContext.test(i),namespace:h.join(".")},o),(p=u[d])||((p=u[d]=[]).delegateCount=0,f.setup&&!1!==f.setup.call(t,r,h,a)||t.addEventListener&&t.addEventListener(d,a)),f.add&&(f.add.call(t,c),c.handler.guid||(c.handler.guid=n.guid)),i?p.splice(p.delegateCount++,0,c):p.push(c),k.event.global[d]=!0)}},remove:function(e,t,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.hasData(e)&&Q.get(e);if(v&&(u=v.events)){l=(t=(t||"").match(R)||[""]).length;while(l--)if(d=g=(s=Ee.exec(t[l])||[])[1],h=(s[2]||"").split(".").sort(),d){f=k.event.special[d]||{},p=u[d=(r?f.delegateType:f.bindType)||d]||[],s=s[2]&&new RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"),a=o=p.length;while(o--)c=p[o],!i&&g!==c.origType||n&&n.guid!==c.guid||s&&!s.test(c.namespace)||r&&r!==c.selector&&("**"!==r||!c.selector)||(p.splice(o,1),c.selector&&p.delegateCount--,f.remove&&f.remove.call(e,c));a&&!p.length&&(f.teardown&&!1!==f.teardown.call(e,h,v.handle)||k.removeEvent(e,d,v.handle),delete u[d])}else for(d in u)k.event.remove(e,d+t[l],n,r,!0);k.isEmptyObject(u)&&Q.remove(e,"handle events")}},dispatch:function(e){var t,n,r,i,o,a,s=k.event.fix(e),u=new Array(arguments.length),l=(Q.get(this,"events")||{})[s.type]||[],c=k.event.special[s.type]||{};for(u[0]=s,t=1;t\x20\t\r\n\f]*)[^>]*)\/>/gi,qe=/\s*$/g;function Oe(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&k(e).children("tbody")[0]||e}function Pe(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function Re(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Me(e,t){var n,r,i,o,a,s,u,l;if(1===t.nodeType){if(Q.hasData(e)&&(o=Q.access(e),a=Q.set(t,o),l=o.events))for(i in delete a.handle,a.events={},l)for(n=0,r=l[i].length;n")},clone:function(e,t,n){var r,i,o,a,s,u,l,c=e.cloneNode(!0),f=oe(e);if(!(y.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||k.isXMLDoc(e)))for(a=ve(c),r=0,i=(o=ve(e)).length;r").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Vt,Gt=[],Yt=/(=)\?(?=&|$)|\?\?/;k.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Gt.pop()||k.expando+"_"+kt++;return this[e]=!0,e}}),k.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Yt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Yt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Yt,"$1"+r):!1!==e.jsonp&&(e.url+=(St.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||k.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?k(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Gt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),y.createHTMLDocument=((Vt=E.implementation.createHTMLDocument("").body).innerHTML="",2===Vt.childNodes.length),k.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(y.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=D.exec(e))?[t.createElement(i[1])]:(i=we([e],t,o),o&&o.length&&k(o).remove(),k.merge([],i.childNodes)));var r,i,o},k.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(k.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},k.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){k.fn[t]=function(e){return this.on(t,e)}}),k.expr.pseudos.animated=function(t){return k.grep(k.timers,function(e){return t===e.elem}).length},k.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=k.css(e,"position"),c=k(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=k.css(e,"top"),u=k.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,k.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},k.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){k.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===k.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===k.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=k(e).offset()).top+=k.css(e,"borderTopWidth",!0),i.left+=k.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-k.css(r,"marginTop",!0),left:t.left-i.left-k.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===k.css(e,"position"))e=e.offsetParent;return e||ie})}}),k.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;k.fn[t]=function(e){return _(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),k.each(["top","left"],function(e,n){k.cssHooks[n]=ze(y.pixelPosition,function(e,t){if(t)return t=_e(e,n),$e.test(t)?k(e).position()[n]+"px":t})}),k.each({Height:"height",Width:"width"},function(a,s){k.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){k.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return _(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?k.css(e,t,i):k.style(e,t,n,i)},s,n?e:void 0,n)}})}),k.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){k.fn[n]=function(e,t){return 0 vs[a] ?
448 | (-vp[a]+tp[a]+ts[a]/2 > vs[a]/2 && tp[a]+ts[a]-ps[a] >= 0 ? tp[a]+ts[a]-ps[a] : tp[a]) :
449 | tp[a],
450 | -vp[b]+tp[b]+ts[b]+ps[b]-l+l*c > vs[b] ?
451 | (-vp[b]+tp[b]+ts[b]/2 > vs[b]/2 && tp[b]+ts[b]-l-l*c >= 0 ? tp[b]+ts[b]-l-l*c : tp[b]+ts[b]-l+l*c) :
452 | (tp[b]+ts[b]-l+l*c >= 0 ? tp[b]+ts[b]-l+l*c : tp[b]+ts[b]-l-l*c)
453 | ];
454 | }
455 |
456 | var x = pp[a];
457 | var y = pp[b];
458 | var positionValue = thisObj.fixed ? 'fixed' : 'absolute';
459 | var contractShadow =
460 | (pp[0] + ps[0] > tp[0] || pp[0] < tp[0] + ts[0]) &&
461 | (pp[1] + ps[1] < tp[1] + ts[1]);
462 |
463 | jsc._drawPosition(thisObj, x, y, positionValue, contractShadow);
464 | }
465 | },
466 |
467 |
468 | _drawPosition : function (thisObj, x, y, positionValue, contractShadow) {
469 | var vShadow = contractShadow ? 0 : thisObj.shadowBlur; // px
470 |
471 | jsc.picker.wrap.style.position = positionValue;
472 | jsc.picker.wrap.style.left = x + 'px';
473 | jsc.picker.wrap.style.top = y + 'px';
474 |
475 | jsc.setBoxShadow(
476 | jsc.picker.boxS,
477 | thisObj.shadow ?
478 | new jsc.BoxShadow(0, vShadow, thisObj.shadowBlur, 0, thisObj.shadowColor) :
479 | null);
480 | },
481 |
482 |
483 | getPickerDims : function (thisObj) {
484 | var displaySlider = !!jsc.getSliderComponent(thisObj);
485 | var dims = [
486 | 2 * thisObj.insetWidth + 2 * thisObj.padding + thisObj.width +
487 | (displaySlider ? 2 * thisObj.insetWidth + jsc.getPadToSliderPadding(thisObj) + thisObj.sliderSize : 0),
488 | 2 * thisObj.insetWidth + 2 * thisObj.padding + thisObj.height +
489 | (thisObj.closable ? 2 * thisObj.insetWidth + thisObj.padding + thisObj.buttonHeight : 0)
490 | ];
491 | return dims;
492 | },
493 |
494 |
495 | getPickerOuterDims : function (thisObj) {
496 | var dims = jsc.getPickerDims(thisObj);
497 | return [
498 | dims[0] + 2 * thisObj.borderWidth,
499 | dims[1] + 2 * thisObj.borderWidth
500 | ];
501 | },
502 |
503 |
504 | getPadToSliderPadding : function (thisObj) {
505 | return Math.max(thisObj.padding, 1.5 * (2 * thisObj.pointerBorderWidth + thisObj.pointerThickness));
506 | },
507 |
508 |
509 | getPadYComponent : function (thisObj) {
510 | switch (thisObj.mode.charAt(1).toLowerCase()) {
511 | case 'v': return 'v'; break;
512 | }
513 | return 's';
514 | },
515 |
516 |
517 | getSliderComponent : function (thisObj) {
518 | if (thisObj.mode.length > 2) {
519 | switch (thisObj.mode.charAt(2).toLowerCase()) {
520 | case 's': return 's'; break;
521 | case 'v': return 'v'; break;
522 | }
523 | }
524 | return null;
525 | },
526 |
527 |
528 | onDocumentMouseDown : function (e) {
529 | if (!e) { e = window.event; }
530 | var target = e.target || e.srcElement;
531 |
532 | if (target._jscLinkedInstance) {
533 | if (target._jscLinkedInstance.showOnClick) {
534 | target._jscLinkedInstance.show();
535 | }
536 | } else if (target._jscControlName) {
537 | jsc.onControlPointerStart(e, target, target._jscControlName, 'mouse');
538 | } else {
539 | // Mouse is outside the picker controls -> hide the color picker!
540 | if (jsc.picker && jsc.picker.owner) {
541 | jsc.picker.owner.hide();
542 | }
543 | }
544 | },
545 |
546 |
547 | onDocumentTouchStart : function (e) {
548 | if (!e) { e = window.event; }
549 | var target = e.target || e.srcElement;
550 |
551 | if (target._jscLinkedInstance) {
552 | if (target._jscLinkedInstance.showOnClick) {
553 | target._jscLinkedInstance.show();
554 | }
555 | } else if (target._jscControlName) {
556 | jsc.onControlPointerStart(e, target, target._jscControlName, 'touch');
557 | } else {
558 | if (jsc.picker && jsc.picker.owner) {
559 | jsc.picker.owner.hide();
560 | }
561 | }
562 | },
563 |
564 |
565 | onWindowResize : function (e) {
566 | jsc.redrawPosition();
567 | },
568 |
569 |
570 | onParentScroll : function (e) {
571 | // hide the picker when one of the parent elements is scrolled
572 | if (jsc.picker && jsc.picker.owner) {
573 | jsc.picker.owner.hide();
574 | }
575 | },
576 |
577 |
578 | _pointerMoveEvent : {
579 | mouse: 'mousemove',
580 | touch: 'touchmove'
581 | },
582 | _pointerEndEvent : {
583 | mouse: 'mouseup',
584 | touch: 'touchend'
585 | },
586 |
587 |
588 | _pointerOrigin : null,
589 | _capturedTarget : null,
590 |
591 |
592 | onControlPointerStart : function (e, target, controlName, pointerType) {
593 | var thisObj = target._jscInstance;
594 |
595 | jsc.preventDefault(e);
596 | jsc.captureTarget(target);
597 |
598 | var registerDragEvents = function (doc, offset) {
599 | jsc.attachGroupEvent('drag', doc, jsc._pointerMoveEvent[pointerType],
600 | jsc.onDocumentPointerMove(e, target, controlName, pointerType, offset));
601 | jsc.attachGroupEvent('drag', doc, jsc._pointerEndEvent[pointerType],
602 | jsc.onDocumentPointerEnd(e, target, controlName, pointerType));
603 | };
604 |
605 | registerDragEvents(document, [0, 0]);
606 |
607 | if (window.parent && window.frameElement) {
608 | var rect = window.frameElement.getBoundingClientRect();
609 | var ofs = [-rect.left, -rect.top];
610 | registerDragEvents(window.parent.window.document, ofs);
611 | }
612 |
613 | var abs = jsc.getAbsPointerPos(e);
614 | var rel = jsc.getRelPointerPos(e);
615 | jsc._pointerOrigin = {
616 | x: abs.x - rel.x,
617 | y: abs.y - rel.y
618 | };
619 |
620 | switch (controlName) {
621 | case 'pad':
622 | // if the slider is at the bottom, move it up
623 | switch (jsc.getSliderComponent(thisObj)) {
624 | case 's': if (thisObj.hsv[1] === 0) { thisObj.fromHSV(null, 100, null); }; break;
625 | case 'v': if (thisObj.hsv[2] === 0) { thisObj.fromHSV(null, null, 100); }; break;
626 | }
627 | jsc.setPad(thisObj, e, 0, 0);
628 | break;
629 |
630 | case 'sld':
631 | jsc.setSld(thisObj, e, 0);
632 | break;
633 | }
634 |
635 | jsc.dispatchFineChange(thisObj);
636 | },
637 |
638 |
639 | onDocumentPointerMove : function (e, target, controlName, pointerType, offset) {
640 | return function (e) {
641 | var thisObj = target._jscInstance;
642 | switch (controlName) {
643 | case 'pad':
644 | if (!e) { e = window.event; }
645 | jsc.setPad(thisObj, e, offset[0], offset[1]);
646 | jsc.dispatchFineChange(thisObj);
647 | break;
648 |
649 | case 'sld':
650 | if (!e) { e = window.event; }
651 | jsc.setSld(thisObj, e, offset[1]);
652 | jsc.dispatchFineChange(thisObj);
653 | break;
654 | }
655 | }
656 | },
657 |
658 |
659 | onDocumentPointerEnd : function (e, target, controlName, pointerType) {
660 | return function (e) {
661 | var thisObj = target._jscInstance;
662 | jsc.detachGroupEvents('drag');
663 | jsc.releaseTarget();
664 | // Always dispatch changes after detaching outstanding mouse handlers,
665 | // in case some user interaction will occur in user's onchange callback
666 | // that would intrude with current mouse events
667 | jsc.dispatchChange(thisObj);
668 | };
669 | },
670 |
671 |
672 | dispatchChange : function (thisObj) {
673 | if (thisObj.valueElement) {
674 | if (jsc.isElementType(thisObj.valueElement, 'input')) {
675 | jsc.fireEvent(thisObj.valueElement, 'change');
676 | }
677 | }
678 | },
679 |
680 |
681 | dispatchFineChange : function (thisObj) {
682 | if (thisObj.onFineChange) {
683 | var callback;
684 | if (typeof thisObj.onFineChange === 'string') {
685 | callback = new Function (thisObj.onFineChange);
686 | } else {
687 | callback = thisObj.onFineChange;
688 | }
689 | callback.call(thisObj);
690 | }
691 | },
692 |
693 |
694 | setPad : function (thisObj, e, ofsX, ofsY) {
695 | var pointerAbs = jsc.getAbsPointerPos(e);
696 | var x = ofsX + pointerAbs.x - jsc._pointerOrigin.x - thisObj.padding - thisObj.insetWidth;
697 | var y = ofsY + pointerAbs.y - jsc._pointerOrigin.y - thisObj.padding - thisObj.insetWidth;
698 |
699 | var xVal = x * (360 / (thisObj.width - 1));
700 | var yVal = 100 - (y * (100 / (thisObj.height - 1)));
701 |
702 | switch (jsc.getPadYComponent(thisObj)) {
703 | case 's': thisObj.fromHSV(xVal, yVal, null, jsc.leaveSld); break;
704 | case 'v': thisObj.fromHSV(xVal, null, yVal, jsc.leaveSld); break;
705 | }
706 | },
707 |
708 |
709 | setSld : function (thisObj, e, ofsY) {
710 | var pointerAbs = jsc.getAbsPointerPos(e);
711 | var y = ofsY + pointerAbs.y - jsc._pointerOrigin.y - thisObj.padding - thisObj.insetWidth;
712 |
713 | var yVal = 100 - (y * (100 / (thisObj.height - 1)));
714 |
715 | switch (jsc.getSliderComponent(thisObj)) {
716 | case 's': thisObj.fromHSV(null, yVal, null, jsc.leavePad); break;
717 | case 'v': thisObj.fromHSV(null, null, yVal, jsc.leavePad); break;
718 | }
719 | },
720 |
721 |
722 | _vmlNS : 'jsc_vml_',
723 | _vmlCSS : 'jsc_vml_css_',
724 | _vmlReady : false,
725 |
726 |
727 | initVML : function () {
728 | if (!jsc._vmlReady) {
729 | // init VML namespace
730 | var doc = document;
731 | if (!doc.namespaces[jsc._vmlNS]) {
732 | doc.namespaces.add(jsc._vmlNS, 'urn:schemas-microsoft-com:vml');
733 | }
734 | if (!doc.styleSheets[jsc._vmlCSS]) {
735 | var tags = ['shape', 'shapetype', 'group', 'background', 'path', 'formulas', 'handles', 'fill', 'stroke', 'shadow', 'textbox', 'textpath', 'imagedata', 'line', 'polyline', 'curve', 'rect', 'roundrect', 'oval', 'arc', 'image'];
736 | var ss = doc.createStyleSheet();
737 | ss.owningElement.id = jsc._vmlCSS;
738 | for (var i = 0; i < tags.length; i += 1) {
739 | ss.addRule(jsc._vmlNS + '\\:' + tags[i], 'behavior:url(#default#VML);');
740 | }
741 | }
742 | jsc._vmlReady = true;
743 | }
744 | },
745 |
746 |
747 | createPalette : function () {
748 |
749 | var paletteObj = {
750 | elm: null,
751 | draw: null
752 | };
753 |
754 | if (jsc.isCanvasSupported) {
755 | // Canvas implementation for modern browsers
756 |
757 | var canvas = document.createElement('canvas');
758 | var ctx = canvas.getContext('2d');
759 |
760 | var drawFunc = function (width, height, type) {
761 | canvas.width = width;
762 | canvas.height = height;
763 |
764 | ctx.clearRect(0, 0, canvas.width, canvas.height);
765 |
766 | var hGrad = ctx.createLinearGradient(0, 0, canvas.width, 0);
767 | hGrad.addColorStop(0 / 6, '#F00');
768 | hGrad.addColorStop(1 / 6, '#FF0');
769 | hGrad.addColorStop(2 / 6, '#0F0');
770 | hGrad.addColorStop(3 / 6, '#0FF');
771 | hGrad.addColorStop(4 / 6, '#00F');
772 | hGrad.addColorStop(5 / 6, '#F0F');
773 | hGrad.addColorStop(6 / 6, '#F00');
774 |
775 | ctx.fillStyle = hGrad;
776 | ctx.fillRect(0, 0, canvas.width, canvas.height);
777 |
778 | var vGrad = ctx.createLinearGradient(0, 0, 0, canvas.height);
779 | switch (type.toLowerCase()) {
780 | case 's':
781 | vGrad.addColorStop(0, 'rgba(255,255,255,0)');
782 | vGrad.addColorStop(1, 'rgba(255,255,255,1)');
783 | break;
784 | case 'v':
785 | vGrad.addColorStop(0, 'rgba(0,0,0,0)');
786 | vGrad.addColorStop(1, 'rgba(0,0,0,1)');
787 | break;
788 | }
789 | ctx.fillStyle = vGrad;
790 | ctx.fillRect(0, 0, canvas.width, canvas.height);
791 | };
792 |
793 | paletteObj.elm = canvas;
794 | paletteObj.draw = drawFunc;
795 |
796 | } else {
797 | // VML fallback for IE 7 and 8
798 |
799 | jsc.initVML();
800 |
801 | var vmlContainer = document.createElement('div');
802 | vmlContainer.style.position = 'relative';
803 | vmlContainer.style.overflow = 'hidden';
804 |
805 | var hGrad = document.createElement(jsc._vmlNS + ':fill');
806 | hGrad.type = 'gradient';
807 | hGrad.method = 'linear';
808 | hGrad.angle = '90';
809 | hGrad.colors = '16.67% #F0F, 33.33% #00F, 50% #0FF, 66.67% #0F0, 83.33% #FF0'
810 |
811 | var hRect = document.createElement(jsc._vmlNS + ':rect');
812 | hRect.style.position = 'absolute';
813 | hRect.style.left = -1 + 'px';
814 | hRect.style.top = -1 + 'px';
815 | hRect.stroked = false;
816 | hRect.appendChild(hGrad);
817 | vmlContainer.appendChild(hRect);
818 |
819 | var vGrad = document.createElement(jsc._vmlNS + ':fill');
820 | vGrad.type = 'gradient';
821 | vGrad.method = 'linear';
822 | vGrad.angle = '180';
823 | vGrad.opacity = '0';
824 |
825 | var vRect = document.createElement(jsc._vmlNS + ':rect');
826 | vRect.style.position = 'absolute';
827 | vRect.style.left = -1 + 'px';
828 | vRect.style.top = -1 + 'px';
829 | vRect.stroked = false;
830 | vRect.appendChild(vGrad);
831 | vmlContainer.appendChild(vRect);
832 |
833 | var drawFunc = function (width, height, type) {
834 | vmlContainer.style.width = width + 'px';
835 | vmlContainer.style.height = height + 'px';
836 |
837 | hRect.style.width =
838 | vRect.style.width =
839 | (width + 1) + 'px';
840 | hRect.style.height =
841 | vRect.style.height =
842 | (height + 1) + 'px';
843 |
844 | // Colors must be specified during every redraw, otherwise IE won't display
845 | // a full gradient during a subsequential redraw
846 | hGrad.color = '#F00';
847 | hGrad.color2 = '#F00';
848 |
849 | switch (type.toLowerCase()) {
850 | case 's':
851 | vGrad.color = vGrad.color2 = '#FFF';
852 | break;
853 | case 'v':
854 | vGrad.color = vGrad.color2 = '#000';
855 | break;
856 | }
857 | };
858 |
859 | paletteObj.elm = vmlContainer;
860 | paletteObj.draw = drawFunc;
861 | }
862 |
863 | return paletteObj;
864 | },
865 |
866 |
867 | createSliderGradient : function () {
868 |
869 | var sliderObj = {
870 | elm: null,
871 | draw: null
872 | };
873 |
874 | if (jsc.isCanvasSupported) {
875 | // Canvas implementation for modern browsers
876 |
877 | var canvas = document.createElement('canvas');
878 | var ctx = canvas.getContext('2d');
879 |
880 | var drawFunc = function (width, height, color1, color2) {
881 | canvas.width = width;
882 | canvas.height = height;
883 |
884 | ctx.clearRect(0, 0, canvas.width, canvas.height);
885 |
886 | var grad = ctx.createLinearGradient(0, 0, 0, canvas.height);
887 | grad.addColorStop(0, color1);
888 | grad.addColorStop(1, color2);
889 |
890 | ctx.fillStyle = grad;
891 | ctx.fillRect(0, 0, canvas.width, canvas.height);
892 | };
893 |
894 | sliderObj.elm = canvas;
895 | sliderObj.draw = drawFunc;
896 |
897 | } else {
898 | // VML fallback for IE 7 and 8
899 |
900 | jsc.initVML();
901 |
902 | var vmlContainer = document.createElement('div');
903 | vmlContainer.style.position = 'relative';
904 | vmlContainer.style.overflow = 'hidden';
905 |
906 | var grad = document.createElement(jsc._vmlNS + ':fill');
907 | grad.type = 'gradient';
908 | grad.method = 'linear';
909 | grad.angle = '180';
910 |
911 | var rect = document.createElement(jsc._vmlNS + ':rect');
912 | rect.style.position = 'absolute';
913 | rect.style.left = -1 + 'px';
914 | rect.style.top = -1 + 'px';
915 | rect.stroked = false;
916 | rect.appendChild(grad);
917 | vmlContainer.appendChild(rect);
918 |
919 | var drawFunc = function (width, height, color1, color2) {
920 | vmlContainer.style.width = width + 'px';
921 | vmlContainer.style.height = height + 'px';
922 |
923 | rect.style.width = (width + 1) + 'px';
924 | rect.style.height = (height + 1) + 'px';
925 |
926 | grad.color = color1;
927 | grad.color2 = color2;
928 | };
929 |
930 | sliderObj.elm = vmlContainer;
931 | sliderObj.draw = drawFunc;
932 | }
933 |
934 | return sliderObj;
935 | },
936 |
937 |
938 | leaveValue : 1<<0,
939 | leaveStyle : 1<<1,
940 | leavePad : 1<<2,
941 | leaveSld : 1<<3,
942 |
943 |
944 | BoxShadow : (function () {
945 | var BoxShadow = function (hShadow, vShadow, blur, spread, color, inset) {
946 | this.hShadow = hShadow;
947 | this.vShadow = vShadow;
948 | this.blur = blur;
949 | this.spread = spread;
950 | this.color = color;
951 | this.inset = !!inset;
952 | };
953 |
954 | BoxShadow.prototype.toString = function () {
955 | var vals = [
956 | Math.round(this.hShadow) + 'px',
957 | Math.round(this.vShadow) + 'px',
958 | Math.round(this.blur) + 'px',
959 | Math.round(this.spread) + 'px',
960 | this.color
961 | ];
962 | if (this.inset) {
963 | vals.push('inset');
964 | }
965 | return vals.join(' ');
966 | };
967 |
968 | return BoxShadow;
969 | })(),
970 |
971 |
972 | //
973 | // Usage:
974 | // var myColor = new jscolor( [, ])
975 | //
976 |
977 | jscolor : function (targetElement, options) {
978 |
979 | // General options
980 | //
981 | this.value = null; // initial HEX color. To change it later, use methods fromString(), fromHSV() and fromRGB()
982 | this.valueElement = targetElement; // element that will be used to display and input the color code
983 | this.styleElement = targetElement; // element that will preview the picked color using CSS backgroundColor
984 | this.required = true; // whether the associated text [, ])
975 | //
976 |
977 | jscolor : function (targetElement, options) {
978 |
979 | // General options
980 | //
981 | this.value = null; // initial HEX color. To change it later, use methods fromString(), fromHSV() and fromRGB()
982 | this.valueElement = targetElement; // element that will be used to display and input the color code
983 | this.styleElement = targetElement; // element that will preview the picked color using CSS backgroundColor
984 | this.required = true; // whether the associated text Heatmap Customizer
8 | Choose Main Color
43 |
44 | Heatmap Customizer
8 | Choose Main Color
43 |
44 | 
3 |