diff --git a/readme.md b/readme.md index d14b603..53f2046 100644 --- a/readme.md +++ b/readme.md @@ -2,7 +2,7 @@ Method Draw is a web based vector drawing application. -**Use [Method Draw](https://editor.method.ac) online.** +### [Try Method Draw](https://editor.method.ac) online. ![Method Draw](https://method.ac/assets/editor.png) @@ -31,6 +31,7 @@ Deploy `dist` to your static file server of choice. ## Release notes +**2020.12.10** Gradient fixes on Windows and Safari MacOS **2020.08.04** Vast code simplification **2020.08.02** File clean-up and gulp build implemented **2020.08.01** Project thawed diff --git a/src/css/jpicker.css b/src/css/jpicker.css index 5bb30fd..54cd60e 100644 --- a/src/css/jpicker.css +++ b/src/css/jpicker.css @@ -152,6 +152,7 @@ table#svg_editor .jPicker { } #svg_editor .jPicker .Button input { width: 100px; + cursor: pointer; } #svg_editor .jPicker td.Radio { @@ -162,6 +163,7 @@ table#svg_editor .jPicker { #svg_editor .jPicker td.Radio input { margin: 0 5px 0 0; padding: 0; + cursor: pointer; } #svg_editor .jPicker td.Text { font-size: 12px!important; @@ -182,7 +184,6 @@ table#svg_editor .jPicker { } #svg_editor .jPicker td.Text input { background-color: #fff; - border: 1px inset #aaa; height: 15px; margin: 0 0 0 5px; text-align: left; diff --git a/src/css/method-draw.css b/src/css/method-draw.css index 035fecb..f5eedcd 100644 --- a/src/css/method-draw.css +++ b/src/css/method-draw.css @@ -333,6 +333,7 @@ div#font-selector .font-item:hover { #color_picker input[type=text], #color_picker input[type=number] { width: 30px; background: #fff; + border: solid rgba(0,0,0,0.3) 1px; } .dropdown_set input[type=text], .dropdown_set input[type=number] { diff --git a/src/index.html b/src/index.html index 8d1f387..9b38f47 100644 --- a/src/index.html +++ b/src/index.html @@ -682,7 +682,7 @@ - + diff --git a/src/js/lib/jgraduate/LICENSE b/src/js/lib/jgraduate/LICENSE deleted file mode 100644 index d645695..0000000 --- a/src/js/lib/jgraduate/LICENSE +++ /dev/null @@ -1,202 +0,0 @@ - - Apache License - Version 2.0, January 2004 - http://www.apache.org/licenses/ - - TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION - - 1. Definitions. - - "License" shall mean the terms and conditions for use, reproduction, - and distribution as defined by Sections 1 through 9 of this document. - - "Licensor" shall mean the copyright owner or entity authorized by - the copyright owner that is granting the License. - - "Legal Entity" shall mean the union of the acting entity and all - other entities that control, are controlled by, or are under common - control with that entity. For the purposes of this definition, - "control" means (i) the power, direct or indirect, to cause the - direction or management of such entity, whether by contract or - otherwise, or (ii) ownership of fifty percent (50%) or more of the - outstanding shares, or (iii) beneficial ownership of such entity. - - "You" (or "Your") shall mean an individual or Legal Entity - exercising permissions granted by this License. - - "Source" form shall mean the preferred form for making modifications, - including but not limited to software source code, documentation - source, and configuration files. - - "Object" form shall mean any form resulting from mechanical - transformation or translation of a Source form, including but - not limited to compiled object code, generated documentation, - and conversions to other media types. - - "Work" shall mean the work of authorship, whether in Source or - Object form, made available under the License, as indicated by a - copyright notice that is included in or attached to the work - (an example is provided in the Appendix below). - - "Derivative Works" shall mean any work, whether in Source or Object - form, that is based on (or derived from) the Work and for which the - editorial revisions, annotations, elaborations, or other modifications - represent, as a whole, an original work of authorship. For the purposes - of this License, Derivative Works shall not include works that remain - separable from, or merely link (or bind by name) to the interfaces of, - the Work and Derivative Works thereof. - - "Contribution" shall mean any work of authorship, including - the original version of the Work and any modifications or additions - to that Work or Derivative Works thereof, that is intentionally - submitted to Licensor for inclusion in the Work by the copyright owner - or by an individual or Legal Entity authorized to submit on behalf of - the copyright owner. For the purposes of this definition, "submitted" - means any form of electronic, verbal, or written communication sent - to the Licensor or its representatives, including but not limited to - communication on electronic mailing lists, source code control systems, - and issue tracking systems that are managed by, or on behalf of, the - Licensor for the purpose of discussing and improving the Work, but - excluding communication that is conspicuously marked or otherwise - designated in writing by the copyright owner as "Not a Contribution." - - "Contributor" shall mean Licensor and any individual or Legal Entity - on behalf of whom a Contribution has been received by Licensor and - subsequently incorporated within the Work. - - 2. Grant of Copyright License. Subject to the terms and conditions of - this License, each Contributor hereby grants to You a perpetual, - worldwide, non-exclusive, no-charge, royalty-free, irrevocable - copyright license to reproduce, prepare Derivative Works of, - publicly display, publicly perform, sublicense, and distribute the - Work and such Derivative Works in Source or Object form. - - 3. Grant of Patent License. Subject to the terms and conditions of - this License, each Contributor hereby grants to You a perpetual, - worldwide, non-exclusive, no-charge, royalty-free, irrevocable - (except as stated in this section) patent license to make, have made, - use, offer to sell, sell, import, and otherwise transfer the Work, - where such license applies only to those patent claims licensable - by such Contributor that are necessarily infringed by their - Contribution(s) alone or by combination of their Contribution(s) - with the Work to which such Contribution(s) was submitted. If You - institute patent litigation against any entity (including a - cross-claim or counterclaim in a lawsuit) alleging that the Work - or a Contribution incorporated within the Work constitutes direct - or contributory patent infringement, then any patent licenses - granted to You under this License for that Work shall terminate - as of the date such litigation is filed. - - 4. Redistribution. You may reproduce and distribute copies of the - Work or Derivative Works thereof in any medium, with or without - modifications, and in Source or Object form, provided that You - meet the following conditions: - - (a) You must give any other recipients of the Work or - Derivative Works a copy of this License; and - - (b) You must cause any modified files to carry prominent notices - stating that You changed the files; and - - (c) You must retain, in the Source form of any Derivative Works - that You distribute, all copyright, patent, trademark, and - attribution notices from the Source form of the Work, - excluding those notices that do not pertain to any part of - the Derivative Works; and - - (d) If the Work includes a "NOTICE" text file as part of its - distribution, then any Derivative Works that You distribute must - include a readable copy of the attribution notices contained - within such NOTICE file, excluding those notices that do not - pertain to any part of the Derivative Works, in at least one - of the following places: within a NOTICE text file distributed - as part of the Derivative Works; within the Source form or - documentation, if provided along with the Derivative Works; or, - within a display generated by the Derivative Works, if and - wherever such third-party notices normally appear. The contents - of the NOTICE file are for informational purposes only and - do not modify the License. You may add Your own attribution - notices within Derivative Works that You distribute, alongside - or as an addendum to the NOTICE text from the Work, provided - that such additional attribution notices cannot be construed - as modifying the License. - - You may add Your own copyright statement to Your modifications and - may provide additional or different license terms and conditions - for use, reproduction, or distribution of Your modifications, or - for any such Derivative Works as a whole, provided Your use, - reproduction, and distribution of the Work otherwise complies with - the conditions stated in this License. - - 5. Submission of Contributions. Unless You explicitly state otherwise, - any Contribution intentionally submitted for inclusion in the Work - by You to the Licensor shall be under the terms and conditions of - this License, without any additional terms or conditions. - Notwithstanding the above, nothing herein shall supersede or modify - the terms of any separate license agreement you may have executed - with Licensor regarding such Contributions. - - 6. Trademarks. This License does not grant permission to use the trade - names, trademarks, service marks, or product names of the Licensor, - except as required for reasonable and customary use in describing the - origin of the Work and reproducing the content of the NOTICE file. - - 7. Disclaimer of Warranty. Unless required by applicable law or - agreed to in writing, Licensor provides the Work (and each - Contributor provides its Contributions) on an "AS IS" BASIS, - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or - implied, including, without limitation, any warranties or conditions - of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A - PARTICULAR PURPOSE. You are solely responsible for determining the - appropriateness of using or redistributing the Work and assume any - risks associated with Your exercise of permissions under this License. - - 8. Limitation of Liability. In no event and under no legal theory, - whether in tort (including negligence), contract, or otherwise, - unless required by applicable law (such as deliberate and grossly - negligent acts) or agreed to in writing, shall any Contributor be - liable to You for damages, including any direct, indirect, special, - incidental, or consequential damages of any character arising as a - result of this License or out of the use or inability to use the - Work (including but not limited to damages for loss of goodwill, - work stoppage, computer failure or malfunction, or any and all - other commercial damages or losses), even if such Contributor - has been advised of the possibility of such damages. - - 9. Accepting Warranty or Additional Liability. While redistributing - the Work or Derivative Works thereof, You may choose to offer, - and charge a fee for, acceptance of support, warranty, indemnity, - or other liability obligations and/or rights consistent with this - License. However, in accepting such obligations, You may act only - on Your own behalf and on Your sole responsibility, not on behalf - of any other Contributor, and only if You agree to indemnify, - defend, and hold each Contributor harmless for any liability - incurred by, or claims asserted against, such Contributor by reason - of your accepting any such warranty or additional liability. - - END OF TERMS AND CONDITIONS - - APPENDIX: How to apply the Apache License to your work. - - To apply the Apache License to your work, attach the following - boilerplate notice, with the fields enclosed by brackets "[]" - replaced with your own identifying information. (Don't include - the brackets!) The text should be enclosed in the appropriate - comment syntax for the file format. We also recommend that a - file or class name and description of purpose be included on the - same "printed page" as the copyright notice for easier - identification within third-party archives. - - Copyright [yyyy] [name of copyright owner] - - Licensed under the Apache License, Version 2.0 (the "License"); - you may not use this file except in compliance with the License. - You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - - Unless required by applicable law or agreed to in writing, software - distributed under the License is distributed on an "AS IS" BASIS, - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - See the License for the specific language governing permissions and - limitations under the License. diff --git a/src/js/lib/jgraduate/README b/src/js/lib/jgraduate/README deleted file mode 100644 index ef3e21f..0000000 --- a/src/js/lib/jgraduate/README +++ /dev/null @@ -1,3 +0,0 @@ -jGraduate - A jQuery plugin for picking gradients - -Licensed under the Apache License 2. See LICENSE for more information. diff --git a/src/js/lib/jgraduate/css/jPicker.css b/src/js/lib/jgraduate/css/jPicker.css deleted file mode 100644 index 5bb30fd..0000000 --- a/src/js/lib/jgraduate/css/jPicker.css +++ /dev/null @@ -1,250 +0,0 @@ -#svg_editor .jPicker .Icon { - display: inline-block; - height: 24px; - position: relative; - text-align: left; - width: 25px; -} -#svg_editor .jPicker .Icon span.Color, #svg_editor .jPicker .Icon span.Alpha { - background-position: 2px 2px; - display: block; - height: 100%; - left: 0; - position: absolute; - top: 0; - width: 100%} -#svg_editor .jPicker .Icon span.Image { - background-repeat: no-repeat; - cursor: pointer; - display: block; - height: 100%; - left: 0; - position: absolute; - top: 0; - width: 100%} -#svg_editor .jPicker.Container { - z-index: 10; -} - -table#svg_editor .jPicker { - width: 545px; - z-index: 20; -} - -#svg_editor .jPicker .Move { - background-color: #ddd; - border-color: #fff #666 #666 #fff; - border-style: solid; - border-width: 1px; - cursor: move; - height: 12px; - padding: 0; -} -#svg_editor .jPicker .Title { - display: none; -} - -#svg_editor .jPicker div.Map { - - border: solid #000 1px; - - cursor: crosshair; - - height: 260px; - - margin: 0; - - overflow: hidden; - - padding: 0; - - position: relative; - - width: 260px; - -} -#svg_editor .jPicker div[class="Map"] { - height: 256px; - width: 256px; -} -#svg_editor .jPicker div.Bar { - border: solid #000 1px; - cursor: n-resize; - height: 260px; - margin: 0 15px; - overflow: hidden; - padding: 0; - position: relative; - width: 24px; -} -#svg_editor .jPicker div[class="Bar"] { - height: 256px; - width: 20px; -} -#svg_editor .jPicker .Map .Map1, #svg_editor .jPicker .Map .Map2, #svg_editor .jPicker .Map .Map3, #svg_editor .jPicker .Bar .Map1, #svg_editor .jPicker .Bar .Map2, #svg_editor .jPicker .Bar .Map3, #svg_editor .jPicker .Bar .Map4, #svg_editor .jPicker .Bar .Map5, #svg_editor .jPicker .Bar .Map6 { - background-color: transparent; - background-image: none; - display: block; - left: 0; - position: absolute; - top: 0; -} -#svg_editor .jPicker .Map .Map1, #svg_editor .jPicker .Map .Map2, #svg_editor .jPicker .Map .Map3 { - height: 2596px; - width: 256px; -} -#svg_editor .jPicker .Bar .Map1, #svg_editor .jPicker .Bar .Map2, #svg_editor .jPicker .Bar .Map3, #svg_editor .jPicker .Bar .Map4 { - height: 3896px; - width: 20px; -} -#svg_editor .jPicker .Bar .Map5, #svg_editor .jPicker .Bar .Map6 { - height: 256px; - width: 20px; -} -#svg_editor .jPicker .Map .Map1, #svg_editor .jPicker .Map .Map2, #svg_editor .jPicker .Bar .Map6 { - background-repeat: no-repeat; -} -#svg_editor .jPicker .Map .Map3, #svg_editor .jPicker .Bar .Map5 { - background-repeat: repeat; -} -#svg_editor .jPicker .Bar .Map1, #svg_editor .jPicker .Bar .Map2, #svg_editor .jPicker .Bar .Map3, #svg_editor .jPicker .Bar .Map4 { - background-repeat: repeat-x; -} -#svg_editor .jPicker .Map .Arrow { - display: block; - position: absolute; -} -#svg_editor .jPicker .Bar .Arrow { - display: block; - left: 0; - position: absolute; -} -#svg_editor .jPicker .Preview { - font-size: 9px; - text-align: center; -} -#svg_editor .jPicker .Preview div.bgt { - height: 62px; - margin: 0 auto; - padding: 0; - width: 62px; -} - - -#svg_editor .jPicker .Preview div span { - border: 1px solid #000; - display: block; - height: 30px; - margin: 0 auto; - padding: 0; - width: 60px; -} -#svg_editor .jPicker .Preview .Active { - border-bottom-width: 0; -} -#svg_editor .jPicker .Preview .Current { - border-top-width: 0; - cursor: pointer; -} -#svg_editor .jPicker .Button { - text-align: center; - width: 115px; -} -#svg_editor .jPicker .Button input { - width: 100px; -} - -#svg_editor .jPicker td.Radio { - margin: 0; - padding: 0; - width: 31px; -} -#svg_editor .jPicker td.Radio input { - margin: 0 5px 0 0; - padding: 0; -} -#svg_editor .jPicker td.Text { - font-size: 12px!important; - height: 22px; - margin: 0; - padding: 0; - text-align: left; - width: 70px; -} -#svg_editor .jPicker tr.Hex td.Text { - width: 100px; - color: #666; -} - -#svg_editor .jPicker tr.Hex td.Text span { - width: 100px; - color: #333; -} -#svg_editor .jPicker td.Text input { - background-color: #fff; - border: 1px inset #aaa; - height: 15px; - margin: 0 0 0 5px; - text-align: left; - width: 30px; - color: #333; -} - -#svg_editor #color_picker .jPicker tr.Hex td.Text input.Hex { - width: 50px; - display: inline-block; - float: none; -} - -#svg_editor .jPicker tr.Hex td.Text input.AHex { - width: 20px; - display: none; -} -#svg_editor .jPicker .Grid { - text-align: center; - float: right; - width: 108px; -} -#svg_editor .jPicker .Grid span.QuickColor { - cursor: pointer; - display: inline-block; - height: 15px; - line-height: 15px; - margin: 0; - padding: 0; - width: 18px; -} -#svg_editor .jPicker td { - vertical-align: top; -} -#svg_editor .jPicker td.colorsquare { - width: 275px; -} - -#svg_editor .jPicker .prev_div { - margin-top: -15px; -} - -#svg_editor .jPicker .actions { - position: absolute; - bottom: 20px; - left: 20px; - right: 20px; -} - -#svg_editor .jPicker .actions .Ok{ - position: absolute; - top: 0; - right: 0px; -} - -#svg_editor .jPicker .actions .Cancel{ - position: absolute; - top: 0; - left: 0px; -} - -#svg_editor .jPicker .color_preview { - width: 62px; - margin: 0 auto; -} diff --git a/src/js/lib/jgraduate/css/jgraduate.css b/src/js/lib/jgraduate/css/jgraduate.css deleted file mode 100644 index 2283c00..0000000 --- a/src/js/lib/jgraduate/css/jgraduate.css +++ /dev/null @@ -1,332 +0,0 @@ -/* - * jGraduate Default CSS - * - * Copyright (c) 2010 Jeff Schiller - * http://blog.codedread.com/ - * - * Copyright (c) 2010 Alexis Deveria - * http://a.deveria.com/ - * - * Licensed under the Apache License Version 2 - */ - -h2.jGraduate_Title { - display: none; -} - -.jGraduate_Picker { - position: absolute; - padding: 20px; -} - -.jGraduate_tabs li { - display: inline-block; - padding: 5px 10px; - margin-right: 5px; - cursor: pointer; -} - -li.jGraduate_tab_current { - background: #fff; - border-radius: 3px 3px 0 0; -} - -.jGraduate_colPick { - display: none; -} - -.jGraduate_gradPick { - display: none; - overflow: visible; -/* position: relative;*/ -} - -.jGraduate_tabs { - position: relative; - background-color: #ddd; - padding: 10px 10px 0 10px; - margin: -20px -20px 20px -20px; - border-radius: 3px 3px 0 0; -} - -div.jGraduate_Swatch { - float: left; - margin: 0 15px 0 0; -} -div.jGraduate_GradContainer { - border: solid #000 1px; - background-image: url(../images/map-opacity.png); - background-position: 0px 0px; - height: 256px; - width: 256px; - position: relative; -} - -div.jGraduate_GradContainer div.grad_coord { - background: rgba(0,0,0,0.8); - border: 2px solid white; - border-radius: 15px; - -moz-border-radius: 5px; - width: 14px; - height: 14px; - position: absolute; - margin: -7px -7px; - top: 0; - left: 0; - text-align: center; - font-size: 8px; - line-height: 14px; - color: white; - text-decoration: none; - cursor: pointer; - -moz-user-select: none; - -webkit-user-select: none; -} - -.jGraduate_AlphaArrows { - position: absolute; - margin-top: -10px; - margin-left: 250.5px; -} - -div.jGraduate_Opacity { - border: 2px inset #eee; - margin-top: 14px; - background-color: black; - background-image: url(../images/Maps.png); - background-position: 0px -2816px; - height: 20px; - cursor: ew-resize; -} - -div.jGraduate_StopSlider { - margin: -10px 0 0 -10px; - width: 276px; - overflow: visible; - background: white; - height: 45px; - cursor: pointer; -} - -div.jGraduate_StopSection { - width: 120px; - float: left; -} - -div.jGraduate_StopSection.jGraduate_SpreadMethod { - display: none; -} - -input.jGraduate_Ok, input.jGraduate_Cancel { - display: block; - width: 100px; -} -input.jGraduate_Ok { - margin: 0 0 5px 0; -} - -.colorBox { - float: left; - height: 16px; - width: 16px; - border: 1px solid #808080; - cursor: pointer; - margin: 4px 4px 4px 30px; -} - -.colorBox + label { - float: left; - margin-top: 7px; -} - -label.jGraduate_Form_Heading { - - color: #333; - padding: 2px; - font-weight: bold; - font-size: 13px; -} - -div.jGraduate_Form_Section { - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - padding: 15px 5px 5px 5px; - margin: 5px 2px; - width: 100px; - text-align: center; - overflow: auto; - background: #eee; -} - -div.jGraduate_Form label { - padding: 0 2px; - color: #333; -} - -div.jGraduate_StopSection input[type=text], -div.jGraduate_Slider input[type=text] { - width: 33px; - color: #333; -} - -div.jGraduate_LightBox { - position: fixed; - top: 0px; - left: 0px; - right: 0px; - bottom: 0px; - background-color: #000; - opacity: 0.5; - display: none; -} - -div.jGraduate_stopPicker { - position: absolute; - display: none; - background: - white; - padding: 20px; - border-radius: 3px; - width: 530px; - height: 300px; - box-shadow: 0 5px 25px - black; -} - - -.jGraduate_gradPick { - width: 526px; -} - -.jGraduate_gradPick div.jGraduate_Slider { - line-height: 160% -} - -.jGraduate_gradPick div.jGraduate_Slider label:last-child { - position: absolute; - right: 10px; - top: 0; - color: #999; - font-weight: bold; -} - -.jGraduate_gradPick div.jGraduate_Slider label:last-child input { - margin: 0 3px 0 0; - color: #333; -} - -.jGraduate_gradPick .jGraduate_Form { - float: left; - width: 270px; - position: absolute; - left: 284px; - width: 266px; - height: 200px; - top: 195px; - margin: -3px 3px 0px 10px; - line-height: 200%; -} - -.jGraduate_gradPick .jGraduate_Form label, -.jGraduate_gradPick .jGraduate_Form input { - width: auto; - float: left; -} - -.jGraduate_gradPick .jGraduate_Form.jGraduate_rg_field label, .jGraduate_gradPick .jGraduate_Form.jGraduate_rg_field input { -width: auto; -float: left; -font-size: 11px; -} - -.jGraduate_gradPick .jGraduate_Form.jGraduate_rg_field #color_picker_jGraduate_match_ctr { - float: none; -} - -.jGraduate_gradPick .jGraduate_Form label { - clear: left; -} - -.jGraduate_gradPick .jGraduate_Points { - position: static; - float: left; - margin: 0; - width: auto; - } - -.jGraduate_Colorblocks { - display: table; - border-spacing: 0 5px; -} - -.jGraduate_colorblock { - display: table-row; -} - -.jGraduate_Colorblocks .jGraduate_colorblock > * { - display: table-cell; - vertical-align: middle; - margin: 0; - float: none; -} - -.jGraduate_gradPick .jGraduate_Form_Section { - padding-top: 9px; -} - - -.jGraduate_Slider { - text-align: center; - float: left; - width: 100%; - position: relative; - margin: 5px 0; -} - -.jGraduate_Slider .jGraduate_Form_Section { - border: none; - width: 250px; - padding: 0 2px; - overflow: visible; -} - - -.jGraduate_Slider label.prelabel { - width: 40px; - text-align: left; -} - -.jGraduate_SliderBar { - width: 140px; - float: left; - margin: 0 5px; - border:1px solid #BBB; - height:20px; - position: relative; -} - -div.jGraduate_Slider input { - margin-top: 5px; -} - -div.jGraduate_Slider img { - top: 0; - left: 0; - position: absolute; - cursor:ew-resize; -} - -.jPicker .Button .Ok, .jGraduate_Picker .jGraduate_OkCancel .jGraduate_Ok { - -webkit-appearance: none; - margin: 0; - position: absolute; - bottom: 5px; - right: 5px; -} - -.jPicker .Button .Cancel, .jGraduate_Picker .jGraduate_OkCancel .jGraduate_Cancel { - margin: 0; - position: absolute; - bottom: 5px; - left: 5px; -} diff --git a/src/js/lib/jgraduate/images/AlphaBar.png b/src/js/lib/jgraduate/images/AlphaBar.png deleted file mode 100644 index 2950dae..0000000 Binary files a/src/js/lib/jgraduate/images/AlphaBar.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/Bars.png b/src/js/lib/jgraduate/images/Bars.png deleted file mode 100644 index 80eb2bb..0000000 Binary files a/src/js/lib/jgraduate/images/Bars.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/Maps.png b/src/js/lib/jgraduate/images/Maps.png deleted file mode 100644 index 853d38c..0000000 Binary files a/src/js/lib/jgraduate/images/Maps.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/NoColor.png b/src/js/lib/jgraduate/images/NoColor.png deleted file mode 100644 index 5dc4767..0000000 Binary files a/src/js/lib/jgraduate/images/NoColor.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/bar-opacity.png b/src/js/lib/jgraduate/images/bar-opacity.png deleted file mode 100644 index e42ad08..0000000 Binary files a/src/js/lib/jgraduate/images/bar-opacity.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/eyedropper.png b/src/js/lib/jgraduate/images/eyedropper.png deleted file mode 100644 index 0c30fdb..0000000 Binary files a/src/js/lib/jgraduate/images/eyedropper.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/map-opacity.png b/src/js/lib/jgraduate/images/map-opacity.png deleted file mode 100644 index 6756cee..0000000 Binary files a/src/js/lib/jgraduate/images/map-opacity.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/mappoint.gif b/src/js/lib/jgraduate/images/mappoint.gif deleted file mode 100644 index f5f8557..0000000 Binary files a/src/js/lib/jgraduate/images/mappoint.gif and /dev/null differ diff --git a/src/js/lib/jgraduate/images/mappoint_c.png b/src/js/lib/jgraduate/images/mappoint_c.png deleted file mode 100644 index d0a6e1c..0000000 Binary files a/src/js/lib/jgraduate/images/mappoint_c.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/mappoint_f.png b/src/js/lib/jgraduate/images/mappoint_f.png deleted file mode 100644 index 563ff87..0000000 Binary files a/src/js/lib/jgraduate/images/mappoint_f.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/picker.gif b/src/js/lib/jgraduate/images/picker.gif deleted file mode 100644 index 374d891..0000000 Binary files a/src/js/lib/jgraduate/images/picker.gif and /dev/null differ diff --git a/src/js/lib/jgraduate/images/preview-opacity.png b/src/js/lib/jgraduate/images/preview-opacity.png deleted file mode 100644 index 0dd9a2f..0000000 Binary files a/src/js/lib/jgraduate/images/preview-opacity.png and /dev/null differ diff --git a/src/js/lib/jgraduate/images/rangearrows.gif b/src/js/lib/jgraduate/images/rangearrows.gif deleted file mode 100644 index 9fe89f4..0000000 Binary files a/src/js/lib/jgraduate/images/rangearrows.gif and /dev/null differ diff --git a/src/js/lib/jgraduate/images/rangearrows2.gif b/src/js/lib/jgraduate/images/rangearrows2.gif deleted file mode 100644 index ee10378..0000000 Binary files a/src/js/lib/jgraduate/images/rangearrows2.gif and /dev/null differ diff --git a/src/js/lib/jgraduate/jpicker.min.js b/src/js/lib/jgraduate/jpicker.min.js deleted file mode 100644 index fab5615..0000000 --- a/src/js/lib/jgraduate/jpicker.min.js +++ /dev/null @@ -1,2087 +0,0 @@ -/* - * jPicker 1.1.6 - * - * jQuery Plugin for Photoshop style color picker - * - * Copyright (c) 2010 Christopher T. Tillman - * Digital Magic Productions, Inc. (http://www.digitalmagicpro.com/) - * MIT style license, FREE to use, alter, copy, sell, and especially ENHANCE - * - * Painstakingly ported from John Dyers' excellent work on his own color picker based on the Prototype framework. - * - * John Dyers' website: (http://johndyer.name) - * Color Picker page: (http://johndyer.name/post/2007/09/PhotoShop-like-JavaScript-Color-Picker.aspx) - * - */ -(function($, version) -{ - Math.precision = function(value, precision) - { - if (precision === undefined) precision = 0; - return Math.round(value * Math.pow(10, precision)) / Math.pow(10, precision); - }; - var Slider = // encapsulate slider functionality for the ColorMap and ColorBar - could be useful to use a jQuery UI draggable for this with certain extensions - function(bar, options) - { - var $this = this, // private properties, methods, and events - keep these variables and classes invisible to outside code - arrow = bar.find('img:first'), // the arrow image to drag - minX = 0, - maxX = 100, - rangeX = 100, - minY = 0, - maxY = 100, - rangeY = 100, - x = 0, - y = 0, - offset, - timeout, - changeEvents = new Array(), - fireChangeEvents = - function(context) - { - for (var i = 0; i < changeEvents.length; i++) changeEvents[i].call($this, $this, context); - }, - mouseDown = // bind the mousedown to the bar not the arrow for quick snapping to the clicked location - function(e) - { - var off = bar.offset(); - offset = { l: off.left | 0, t: off.top | 0 }; - clearTimeout(timeout); - timeout = setTimeout( // using setTimeout for visual updates - once the style is updated the browser will re-render internally allowing the next Javascript to run - function() - { - setValuesFromMousePosition.call($this, e); - }, 0); - // Bind mousemove and mouseup event to the document so it responds when dragged of of the bar - we will unbind these when on mouseup to save processing - $(document).bind('mousemove', mouseMove).bind('mouseup', mouseUp); - e.preventDefault(); // don't try to select anything or drag the image to the desktop - }, - mouseMove = // set the values as the mouse moves - function(e) - { - clearTimeout(timeout); - timeout = setTimeout( - function() - { - setValuesFromMousePosition.call($this, e); - }, 0); - e.stopPropagation(); - e.preventDefault(); - return false; - }, - mouseUp = // unbind the document events - they aren't needed when not dragging - function(e) - { - $(document).unbind('mouseup', mouseUp).unbind('mousemove', mouseMove); - e.stopPropagation(); - e.preventDefault(); - return false; - }, - setValuesFromMousePosition = // calculate mouse position and set value within the current range - function(e) - { - var locX = e.pageX - offset.l, - locY = e.pageY - offset.t, - barW = bar.w, // local copies for YUI compressor - barH = bar.h; - // keep the arrow within the bounds of the bar - if (locX < 0) locX = 0; - else if (locX > barW) locX = barW; - if (locY < 0) locY = 0; - else if (locY > barH) locY = barH; - val.call($this, 'xy', { x: ((locX / barW) * rangeX) + minX, y: ((locY / barH) * rangeY) + minY }); - }, - draw = - function() - { - var arrowOffsetX = 0, - arrowOffsetY = 0, - barW = bar.w, - barH = bar.h, - arrowW = arrow.w, - arrowH = arrow.h; - setTimeout( - function() - { - if (rangeX > 0) // range is greater than zero - { - // constrain to bounds - if (x == maxX) arrowOffsetX = barW; - else arrowOffsetX = ((x / rangeX) * barW) | 0; - } - if (rangeY > 0) // range is greater than zero - { - // constrain to bounds - if (y == maxY) arrowOffsetY = barH; - else arrowOffsetY = ((y / rangeY) * barH) | 0; - } - // if arrow width is greater than bar width, center arrow and prevent horizontal dragging - if (arrowW >= barW) arrowOffsetX = (barW >> 1) - (arrowW >> 1); // number >> 1 - superfast bitwise divide by two and truncate (move bits over one bit discarding lowest) - else arrowOffsetX -= arrowW >> 1; - // if arrow height is greater than bar height, center arrow and prevent vertical dragging - if (arrowH >= barH) arrowOffsetY = (barH >> 1) - (arrowH >> 1); - else arrowOffsetY -= arrowH >> 1; - // set the arrow position based on these offsets - arrow.css({ left: arrowOffsetX + 'px', top: arrowOffsetY + 'px' }); - }, 0); - }, - val = - function(name, value, context) - { - var set = value !== undefined; - if (!set) - { - if (name === undefined || name == null) name = 'xy'; - switch (name.toLowerCase()) - { - case 'x': return x; - case 'y': return y; - case 'xy': - default: return { x: x, y: y }; - } - } - if (context != null && context == $this) return; - var changed = false, - newX, - newY; - if (name == null) name = 'xy'; - switch (name.toLowerCase()) - { - case 'x': - newX = value && (value.x && value.x | 0 || value | 0) || 0; - break; - case 'y': - newY = value && (value.y && value.y | 0 || value | 0) || 0; - break; - case 'xy': - default: - newX = value && value.x && value.x | 0 || 0; - newY = value && value.y && value.y | 0 || 0; - break; - } - if (newX != null) - { - if (newX < minX) newX = minX; - else if (newX > maxX) newX = maxX; - if (x != newX) - { - x = newX; - changed = true; - } - } - if (newY != null) - { - if (newY < minY) newY = minY; - else if (newY > maxY) newY = maxY; - if (y != newY) - { - y = newY; - changed = true; - } - } - changed && fireChangeEvents.call($this, context || $this); - }, - range = - function (name, value) - { - var set = value !== undefined; - if (!set) - { - if (name === undefined || name == null) name = 'all'; - switch (name.toLowerCase()) - { - case 'minx': return minX; - case 'maxx': return maxX; - case 'rangex': return { minX: minX, maxX: maxX, rangeX: rangeX }; - case 'miny': return minY; - case 'maxy': return maxY; - case 'rangey': return { minY: minY, maxY: maxY, rangeY: rangeY }; - case 'all': - default: return { minX: minX, maxX: maxX, rangeX: rangeX, minY: minY, maxY: maxY, rangeY: rangeY }; - } - } - var changed = false, - newMinX, - newMaxX, - newMinY, - newMaxY; - if (name == null) name = 'all'; - switch (name.toLowerCase()) - { - case 'minx': - newMinX = value && (value.minX && value.minX | 0 || value | 0) || 0; - break; - case 'maxx': - newMaxX = value && (value.maxX && value.maxX | 0 || value | 0) || 0; - break; - case 'rangex': - newMinX = value && value.minX && value.minX | 0 || 0; - newMaxX = value && value.maxX && value.maxX | 0 || 0; - break; - case 'miny': - newMinY = value && (value.minY && value.minY | 0 || value | 0) || 0; - break; - case 'maxy': - newMaxY = value && (value.maxY && value.maxY | 0 || value | 0) || 0; - break; - case 'rangey': - newMinY = value && value.minY && value.minY | 0 || 0; - newMaxY = value && value.maxY && value.maxY | 0 || 0; - break; - case 'all': - default: - newMinX = value && value.minX && value.minX | 0 || 0; - newMaxX = value && value.maxX && value.maxX | 0 || 0; - newMinY = value && value.minY && value.minY | 0 || 0; - newMaxY = value && value.maxY && value.maxY | 0 || 0; - break; - } - if (newMinX != null && minX != newMinX) - { - minX = newMinX; - rangeX = maxX - minX; - } - if (newMaxX != null && maxX != newMaxX) - { - maxX = newMaxX; - rangeX = maxX - minX; - } - if (newMinY != null && minY != newMinY) - { - minY = newMinY; - rangeY = maxY - minY; - } - if (newMaxY != null && maxY != newMaxY) - { - maxY = newMaxY; - rangeY = maxY - minY; - } - }, - bind = - function (callback) - { - if ($.isFunction(callback)) changeEvents.push(callback); - }, - unbind = - function (callback) - { - if (!$.isFunction(callback)) return; - var i; - while ((i = $.inArray(callback, changeEvents)) != -1) changeEvents.splice(i, 1); - }, - destroy = - function() - { - // unbind all possible events and null objects - $(document).unbind('mouseup', mouseUp).unbind('mousemove', mouseMove); - bar.unbind('mousedown', mouseDown); - bar = null; - arrow = null; - changeEvents = null; - }; - $.extend(true, $this, // public properties, methods, and event bindings - these we need to access from other controls - { - val: val, - range: range, - bind: bind, - unbind: unbind, - destroy: destroy - }); - // initialize this control - arrow.src = options.arrow && options.arrow.image; - arrow.w = options.arrow && options.arrow.width || arrow.width(); - arrow.h = options.arrow && options.arrow.height || arrow.height(); - bar.w = options.map && options.map.width || bar.width(); - bar.h = options.map && options.map.height || bar.height(); - // bind mousedown event - bar.bind('mousedown', mouseDown); - bind.call($this, draw); - }, - ColorValuePicker = // controls for all the input elements for the typing in color values - function(picker, color, bindedHex, alphaPrecision) - { - var $this = this, // private properties and methods - inputs = picker.find('td.Text input'), - red = inputs.eq(3), - green = inputs.eq(4), - blue = inputs.eq(5), - alpha = inputs.length > 7 ? inputs.eq(6) : null, - hue = inputs.eq(0), - saturation = inputs.eq(1), - value = inputs.eq(2), - hex = inputs.eq(inputs.length > 7 ? 7 : 6), - ahex = inputs.length > 7 ? inputs.eq(8) : null, - keyDown = // input box key down - use arrows to alter color - function(e) - { - if (e.target.value == '' && e.target != hex.get(0) && (bindedHex != null && e.target != bindedHex.get(0) || bindedHex == null)) return; - if (!validateKey(e)) return e; - switch (e.target) - { - case red.get(0): - switch (e.keyCode) - { - case 38: - red.val(setValueInRange.call($this, (red.val() << 0) + 1, 0, 255)); - color.val('r', red.val(), e.target); - return false; - case 40: - red.val(setValueInRange.call($this, (red.val() << 0) - 1, 0, 255)); - color.val('r', red.val(), e.target); - return false; - } - break; - case green.get(0): - switch (e.keyCode) - { - case 38: - green.val(setValueInRange.call($this, (green.val() << 0) + 1, 0, 255)); - color.val('g', green.val(), e.target); - return false; - case 40: - green.val(setValueInRange.call($this, (green.val() << 0) - 1, 0, 255)); - color.val('g', green.val(), e.target); - return false; - } - break; - case blue.get(0): - switch (e.keyCode) - { - case 38: - blue.val(setValueInRange.call($this, (blue.val() << 0) + 1, 0, 255)); - color.val('b', blue.val(), e.target); - return false; - case 40: - blue.val(setValueInRange.call($this, (blue.val() << 0) - 1, 0, 255)); - color.val('b', blue.val(), e.target); - return false; - } - break; - case alpha && alpha.get(0): - switch (e.keyCode) - { - case 38: - alpha.val(setValueInRange.call($this, parseFloat(alpha.val()) + 1, 0, 100)); - color.val('a', Math.precision((alpha.val() * 255) / 100, alphaPrecision), e.target); - return false; - case 40: - alpha.val(setValueInRange.call($this, parseFloat(alpha.val()) - 1, 0, 100)); - color.val('a', Math.precision((alpha.val() * 255) / 100, alphaPrecision), e.target); - return false; - } - break; - case hue.get(0): - switch (e.keyCode) - { - case 38: - hue.val(setValueInRange.call($this, (hue.val() << 0) + 1, 0, 360)); - color.val('h', hue.val(), e.target); - return false; - case 40: - hue.val(setValueInRange.call($this, (hue.val() << 0) - 1, 0, 360)); - color.val('h', hue.val(), e.target); - return false; - } - break; - case saturation.get(0): - switch (e.keyCode) - { - case 38: - saturation.val(setValueInRange.call($this, (saturation.val() << 0) + 1, 0, 100)); - color.val('s', saturation.val(), e.target); - return false; - case 40: - saturation.val(setValueInRange.call($this, (saturation.val() << 0) - 1, 0, 100)); - color.val('s', saturation.val(), e.target); - return false; - } - break; - case value.get(0): - switch (e.keyCode) - { - case 38: - value.val(setValueInRange.call($this, (value.val() << 0) + 1, 0, 100)); - color.val('v', value.val(), e.target); - return false; - case 40: - value.val(setValueInRange.call($this, (value.val() << 0) - 1, 0, 100)); - color.val('v', value.val(), e.target); - return false; - } - break; - } - }, - keyUp = // input box key up - validate value and set color - function(e) - { - if (e.target.value == '' && e.target != hex.get(0) && (bindedHex != null && e.target != bindedHex.get(0) || bindedHex == null)) return; - if (!validateKey(e)) return e; - switch (e.target) - { - case red.get(0): - red.val(setValueInRange.call($this, red.val(), 0, 255)); - color.val('r', red.val(), e.target); - break; - case green.get(0): - green.val(setValueInRange.call($this, green.val(), 0, 255)); - color.val('g', green.val(), e.target); - break; - case blue.get(0): - blue.val(setValueInRange.call($this, blue.val(), 0, 255)); - color.val('b', blue.val(), e.target); - break; - case alpha && alpha.get(0): - alpha.val(setValueInRange.call($this, alpha.val(), 0, 100)); - color.val('a', Math.precision((alpha.val() * 255) / 100, alphaPrecision), e.target); - break; - case hue.get(0): - hue.val(setValueInRange.call($this, hue.val(), 0, 360)); - color.val('h', hue.val(), e.target); - break; - case saturation.get(0): - saturation.val(setValueInRange.call($this, saturation.val(), 0, 100)); - color.val('s', saturation.val(), e.target); - break; - case value.get(0): - value.val(setValueInRange.call($this, value.val(), 0, 100)); - color.val('v', value.val(), e.target); - break; - case hex.get(0): - hex.val(hex.val().replace(/[^a-fA-F0-9]/g, '').toLowerCase().substring(0, 6)); - bindedHex && bindedHex.val(hex.val()); - color.val('hex', hex.val() != '' ? hex.val() : null, e.target); - break; - case bindedHex && bindedHex.get(0): - bindedHex.val(bindedHex.val().replace(/[^a-fA-F0-9]/g, '').toLowerCase().substring(0, 6)); - hex.val(bindedHex.val()); - color.val('hex', bindedHex.val() != '' ? bindedHex.val() : null, e.target); - break; - case ahex && ahex.get(0): - ahex.val(ahex.val().replace(/[^a-fA-F0-9]/g, '').toLowerCase().substring(0, 2)); - color.val('a', ahex.val() != null ? parseInt(ahex.val(), 16) : null, e.target); - break; - } - }, - blur = // input box blur - reset to original if value empty - function(e) - { - if (color.val() != null) - { - switch (e.target) - { - case red.get(0): red.val(color.val('r')); break; - case green.get(0): green.val(color.val('g')); break; - case blue.get(0): blue.val(color.val('b')); break; - case alpha && alpha.get(0): alpha.val(Math.precision((color.val('a') * 100) / 255, alphaPrecision)); break; - case hue.get(0): hue.val(color.val('h')); break; - case saturation.get(0): saturation.val(color.val('s')); break; - case value.get(0): value.val(color.val('v')); break; - case hex.get(0): - case bindedHex && bindedHex.get(0): - hex.val(color.val('hex')); - bindedHex && bindedHex.val(color.val('hex')); - break; - case ahex && ahex.get(0): ahex.val(color.val('ahex').substring(6)); break; - } - } - }, - validateKey = // validate key - function(e) - { - switch(e.keyCode) - { - case 9: - case 16: - case 29: - case 37: - case 39: - return false; - case 'c'.charCodeAt(): - case 'v'.charCodeAt(): - if (e.ctrlKey) return false; - } - return true; - }, - setValueInRange = // constrain value within range - function(value, min, max) - { - if (value == '' || isNaN(value)) return min; - if (value > max) return max; - if (value < min) return min; - return value; - }, - colorChanged = - function(ui, context) - { - var all = ui.val('all'); - if (context != red.get(0)) red.val(all != null ? all.r : ''); - if (context != green.get(0)) green.val(all != null ? all.g : ''); - if (context != blue.get(0)) blue.val(all != null ? all.b : ''); - if (alpha && context != alpha.get(0)) alpha.val(all != null ? Math.precision((all.a * 100) / 255, alphaPrecision) : ''); - if (context != hue.get(0)) hue.val(all != null ? all.h : ''); - if (context != saturation.get(0)) saturation.val(all != null ? all.s : ''); - if (context != value.get(0)) value.val(all != null ? all.v : ''); - if (context != hex.get(0) && (bindedHex && context != bindedHex.get(0) || !bindedHex)) hex.val(all != null ? all.hex : ''); - if (bindedHex && context != bindedHex.get(0) && context != hex.get(0)) bindedHex.val(all != null ? all.hex : ''); - if (ahex && context != ahex.get(0)) ahex.val(all != null ? all.ahex.substring(6) : ''); - }, - destroy = - function() - { - // unbind all events and null objects - red.add(green).add(blue).add(alpha).add(hue).add(saturation).add(value).add(hex).add(bindedHex).add(ahex).unbind('keyup', keyUp).unbind('blur', blur); - red.add(green).add(blue).add(alpha).add(hue).add(saturation).add(value).unbind('keydown', keyDown); - color.unbind(colorChanged); - red = null; - green = null; - blue = null; - alpha = null; - hue = null; - saturation = null; - value = null; - hex = null; - ahex = null; - }; - $.extend(true, $this, // public properties and methods - { - destroy: destroy - }); - red.add(green).add(blue).add(alpha).add(hue).add(saturation).add(value).add(hex).add(bindedHex).add(ahex).bind('keyup', keyUp).bind('blur', blur); - red.add(green).add(blue).add(alpha).add(hue).add(saturation).add(value).bind('keydown', keyDown); - color.bind(colorChanged); - }; - $.jPicker = - { - List: [], // array holding references to each active instance of the control - Color: // color object - we will be able to assign by any color space type or retrieve any color space info - // we want this public so we can optionally assign new color objects to initial values using inputs other than a string hex value (also supported) - function(init) - { - var $this = this, - r, - g, - b, - a, - h, - s, - v, - changeEvents = new Array(), - fireChangeEvents = - function(context) - { - for (var i = 0; i < changeEvents.length; i++) changeEvents[i].call($this, $this, context); - }, - val = - function(name, value, context) - { - var set = value !== undefined; - if (!set) - { - if (name === undefined || name == null || name == '') name = 'all'; - if (r == null) return null; - switch (name.toLowerCase()) - { - case 'ahex': return ColorMethods.rgbaToHex({ r: r, g: g, b: b, a: a }); - case 'hex': return val('ahex').substring(0, 6); - case 'all': return { r: r, g: g, b: b, a: a, h: h, s: s, v: v, hex: val.call($this, 'hex'), ahex: val.call($this, 'ahex') }; - default: - var ret={}; - for (var i = 0; i < name.length; i++) - { - switch (name.charAt(i)) - { - case 'r': - if (name.length == 1) ret = r; - else ret.r = r; - break; - case 'g': - if (name.length == 1) ret = g; - else ret.g = g; - break; - case 'b': - if (name.length == 1) ret = b; - else ret.b = b; - break; - case 'a': - if (name.length == 1) ret = a; - else ret.a = a; - break; - case 'h': - if (name.length == 1) ret = h; - else ret.h = h; - break; - case 's': - if (name.length == 1) ret = s; - else ret.s = s; - break; - case 'v': - if (name.length == 1) ret = v; - else ret.v = v; - break; - } - } - return ret == {} ? val.call($this, 'all') : ret; - break; - } - } - if (context != null && context == $this) return; - var changed = false; - if (name == null) name = ''; - if (value == null) - { - if (r != null) - { - r = null; - changed = true; - } - if (g != null) - { - g = null; - changed = true; - } - if (b != null) - { - b = null; - changed = true; - } - if (a != null) - { - a = null; - changed = true; - } - if (h != null) - { - h = null; - changed = true; - } - if (s != null) - { - s = null; - changed = true; - } - if (v != null) - { - v = null; - changed = true; - } - changed && fireChangeEvents.call($this, context || $this); - return; - } - switch (name.toLowerCase()) - { - case 'ahex': - case 'hex': - var ret = ColorMethods.hexToRgba(value && (value.ahex || value.hex) || value || '00000000'); - val.call($this, 'rgba', { r: ret.r, g: ret.g, b: ret.b, a: name == 'ahex' ? ret.a : a != null ? a : 255 }, context); - break; - default: - if (value && (value.ahex != null || value.hex != null)) - { - val.call($this, 'ahex', value.ahex || value.hex || '00000000', context); - return; - } - var newV = {}, rgb = false, hsv = false; - if (value.r !== undefined && !name.indexOf('r') == -1) name += 'r'; - if (value.g !== undefined && !name.indexOf('g') == -1) name += 'g'; - if (value.b !== undefined && !name.indexOf('b') == -1) name += 'b'; - if (value.a !== undefined && !name.indexOf('a') == -1) name += 'a'; - if (value.h !== undefined && !name.indexOf('h') == -1) name += 'h'; - if (value.s !== undefined && !name.indexOf('s') == -1) name += 's'; - if (value.v !== undefined && !name.indexOf('v') == -1) name += 'v'; - for (var i = 0; i < name.length; i++) - { - switch (name.charAt(i)) - { - case 'r': - if (hsv) continue; - rgb = true; - newV.r = value && value.r && value.r | 0 || value && value | 0 || 0; - if (newV.r < 0) newV.r = 0; - else if (newV.r > 255) newV.r = 255; - if (r != newV.r) - { - r = newV.r; - changed = true; - } - break; - case 'g': - if (hsv) continue; - rgb = true; - newV.g = value && value.g && value.g | 0 || value && value | 0 || 0; - if (newV.g < 0) newV.g = 0; - else if (newV.g > 255) newV.g = 255; - if (g != newV.g) - { - g = newV.g; - changed = true; - } - break; - case 'b': - if (hsv) continue; - rgb = true; - newV.b = value && value.b && value.b | 0 || value && value | 0 || 0; - if (newV.b < 0) newV.b = 0; - else if (newV.b > 255) newV.b = 255; - if (b != newV.b) - { - b = newV.b; - changed = true; - } - break; - case 'a': - newV.a = value && value.a != null ? value.a | 0 : value != null ? value | 0 : 255; - if (newV.a < 0) newV.a = 0; - else if (newV.a > 255) newV.a = 255; - if (a != newV.a) - { - a = newV.a; - changed = true; - } - break; - case 'h': - if (rgb) continue; - hsv = true; - newV.h = value && value.h && value.h | 0 || value && value | 0 || 0; - if (newV.h < 0) newV.h = 0; - else if (newV.h > 360) newV.h = 360; - if (h != newV.h) - { - h = newV.h; - changed = true; - } - break; - case 's': - if (rgb) continue; - hsv = true; - newV.s = value && value.s != null ? value.s | 0 : value != null ? value | 0 : 100; - if (newV.s < 0) newV.s = 0; - else if (newV.s > 100) newV.s = 100; - if (s != newV.s) - { - s = newV.s; - changed = true; - } - break; - case 'v': - if (rgb) continue; - hsv = true; - newV.v = value && value.v != null ? value.v | 0 : value != null ? value | 0 : 100; - if (newV.v < 0) newV.v = 0; - else if (newV.v > 100) newV.v = 100; - if (v != newV.v) - { - v = newV.v; - changed = true; - } - break; - } - } - if (changed) - { - if (rgb) - { - r = r || 0; - g = g || 0; - b = b || 0; - var ret = ColorMethods.rgbToHsv({ r: r, g: g, b: b }); - h = ret.h; - s = ret.s; - v = ret.v; - } - else if (hsv) - { - h = h || 0; - s = s != null ? s : 100; - v = v != null ? v : 100; - var ret = ColorMethods.hsvToRgb({ h: h, s: s, v: v }); - r = ret.r; - g = ret.g; - b = ret.b; - } - a = a != null ? a : 255; - fireChangeEvents.call($this, context || $this); - } - break; - } - }, - bind = - function(callback) - { - if ($.isFunction(callback)) changeEvents.push(callback); - }, - unbind = - function(callback) - { - if (!$.isFunction(callback)) return; - var i; - while ((i = $.inArray(callback, changeEvents)) != -1) changeEvents.splice(i, 1); - }, - destroy = - function() - { - changeEvents = null; - } - $.extend(true, $this, // public properties and methods - { - val: val, - bind: bind, - unbind: unbind, - destroy: destroy - }); - if (init) - { - if (init.ahex != null) val('ahex', init); - else if (init.hex != null) val((init.a != null ? 'a' : '') + 'hex', init.a != null ? { ahex: init.hex + ColorMethods.intToHex(init.a) } : init); - else if (init.r != null && init.g != null && init.b != null) val('rgb' + (init.a != null ? 'a' : ''), init); - else if (init.h != null && init.s != null && init.v != null) val('hsv' + (init.a != null ? 'a' : ''), init); - } - }, - ColorMethods: // color conversion methods - make public to give use to external scripts - { - hexToRgba: - function(hex) - { - hex = this.validateHex(hex); - if (hex == '') return { r: null, g: null, b: null, a: null }; - var r = '00', g = '00', b = '00', a = '255'; - if (hex.length == 6) hex += 'ff'; - if (hex.length > 6) - { - r = hex.substring(0, 2); - g = hex.substring(2, 4); - b = hex.substring(4, 6); - a = hex.substring(6, hex.length); - } - else - { - if (hex.length > 4) - { - r = hex.substring(4, hex.length); - hex = hex.substring(0, 4); - } - if (hex.length > 2) - { - g = hex.substring(2, hex.length); - hex = hex.substring(0, 2); - } - if (hex.length > 0) b = hex.substring(0, hex.length); - } - return { r: this.hexToInt(r), g: this.hexToInt(g), b: this.hexToInt(b), a: this.hexToInt(a) }; - }, - validateHex: - function(hex) - { - if (typeof hex == "object") return ''; - hex = hex.toLowerCase().replace(/[^a-f0-9]/g, ''); - if (hex.length > 8) hex = hex.substring(0, 8); - return hex; - }, - rgbaToHex: - function(rgba) - { - return this.intToHex(rgba.r) + this.intToHex(rgba.g) + this.intToHex(rgba.b) + this.intToHex(rgba.a); - }, - intToHex: - function(dec) - { - var result = (dec | 0).toString(16); - if (result.length == 1) result = ('0' + result); - return result.toLowerCase(); - }, - hexToInt: - function(hex) - { - return parseInt(hex, 16); - }, - rgbToHsv: - function(rgb) - { - var r = rgb.r / 255, g = rgb.g / 255, b = rgb.b / 255, hsv = { h: 0, s: 0, v: 0 }, min = 0, max = 0, delta; - if (r >= g && r >= b) - { - max = r; - min = g > b ? b : g; - } - else if (g >= b && g >= r) - { - max = g; - min = r > b ? b : r; - } - else - { - max = b; - min = g > r ? r : g; - } - hsv.v = max; - hsv.s = max ? (max - min) / max : 0; - if (!hsv.s) hsv.h = 0; - else - { - delta = max - min; - if (r == max) hsv.h = (g - b) / delta; - else if (g == max) hsv.h = 2 + (b - r) / delta; - else hsv.h = 4 + (r - g) / delta; - hsv.h = parseInt(hsv.h * 60); - if (hsv.h < 0) hsv.h += 360; - } - hsv.s = (hsv.s * 100) | 0; - hsv.v = (hsv.v * 100) | 0; - return hsv; - }, - hsvToRgb: - function(hsv) - { - var rgb = { r: 0, g: 0, b: 0, a: 100 }, h = hsv.h, s = hsv.s, v = hsv.v; - if (s == 0) - { - if (v == 0) rgb.r = rgb.g = rgb.b = 0; - else rgb.r = rgb.g = rgb.b = (v * 255 / 100) | 0; - } - else - { - if (h == 360) h = 0; - h /= 60; - s = s / 100; - v = v / 100; - var i = h | 0, - f = h - i, - p = v * (1 - s), - q = v * (1 - (s * f)), - t = v * (1 - (s * (1 - f))); - switch (i) - { - case 0: - rgb.r = v; - rgb.g = t; - rgb.b = p; - break; - case 1: - rgb.r = q; - rgb.g = v; - rgb.b = p; - break; - case 2: - rgb.r = p; - rgb.g = v; - rgb.b = t; - break; - case 3: - rgb.r = p; - rgb.g = q; - rgb.b = v; - break; - case 4: - rgb.r = t; - rgb.g = p; - rgb.b = v; - break; - case 5: - rgb.r = v; - rgb.g = p; - rgb.b = q; - break; - } - rgb.r = (rgb.r * 255) | 0; - rgb.g = (rgb.g * 255) | 0; - rgb.b = (rgb.b * 255) | 0; - } - return rgb; - } - } - }; - var Color = $.jPicker.Color, List = $.jPicker.List, ColorMethods = $.jPicker.ColorMethods; // local copies for YUI compressor - $.fn.jPicker = - function(options) - { - var $arguments = arguments; - return this.each( - function() - { - var $this = this, settings = $.extend(true, {}, $.fn.jPicker.defaults, options); // local copies for YUI compressor - if ($($this).get(0).nodeName.toLowerCase() == 'input') // Add color picker icon if binding to an input element and bind the events to the input - { - $.extend(true, settings, - { - window: - { - bindToInput: true, - expandable: true, - input: $($this) - } - }); - if($($this).val()=='') - { - settings.color.active = new Color({ hex: null }); - settings.color.current = new Color({ hex: null }); - } - else if (ColorMethods.validateHex($($this).val())) - { - settings.color.active = new Color({ hex: $($this).val(), a: settings.color.active.val('a') }); - settings.color.current = new Color({ hex: $($this).val(), a: settings.color.active.val('a') }); - } - } - if (settings.window.expandable) - $($this).after('    '); - else settings.window.liveUpdate = false; // Basic control binding for inline use - You will need to override the liveCallback or commitCallback function to retrieve results - var isLessThanIE7 = parseFloat(navigator.appVersion.split('MSIE')[1]) < 7 && document.body.filters, // needed to run the AlphaImageLoader function for IE6 - container = null, - colorMapDiv = null, - colorBarDiv = null, - colorMapL1 = null, // different layers of colorMap and colorBar - colorMapL2 = null, - colorMapL3 = null, - colorBarL1 = null, - colorBarL2 = null, - colorBarL3 = null, - colorBarL4 = null, - colorBarL5 = null, - colorBarL6 = null, - colorMap = null, // color maps - colorBar = null, - colorPicker = null, - elementStartX = null, // Used to record the starting css positions for dragging the control - elementStartY = null, - pageStartX = null, // Used to record the mousedown coordinates for dragging the control - pageStartY = null, - activePreview = null, // color boxes above the radio buttons - currentPreview = null, - okButton = null, - cancelButton = null, - grid = null, // preset colors grid - iconColor = null, // iconColor for popup icon - iconAlpha = null, // iconAlpha for popup icon - iconImage = null, // iconImage popup icon - moveBar = null, // drag bar - setColorMode = // set color mode and update visuals for the new color mode - function(colorMode) - { - var active = color.active, // local copies for YUI compressor - clientPath = images.clientPath, - hex = active.val('hex'), - rgbMap, - rgbBar; - settings.color.mode = colorMode; - switch (colorMode) - { - case 'h': - setTimeout( - function() - { - setBG.call($this, colorMapDiv, 'transparent'); - setImgLoc.call($this, colorMapL1, 0); - setAlpha.call($this, colorMapL1, 100); - setImgLoc.call($this, colorMapL2, 260); - setAlpha.call($this, colorMapL2, 100); - setBG.call($this, colorBarDiv, 'transparent'); - setImgLoc.call($this, colorBarL1, 0); - setAlpha.call($this, colorBarL1, 100); - setImgLoc.call($this, colorBarL2, 260); - setAlpha.call($this, colorBarL2, 100); - setImgLoc.call($this, colorBarL3, 260); - setAlpha.call($this, colorBarL3, 100); - setImgLoc.call($this, colorBarL4, 260); - setAlpha.call($this, colorBarL4, 100); - setImgLoc.call($this, colorBarL6, 260); - setAlpha.call($this, colorBarL6, 100); - }, 0); - colorMap.range('all', { minX: 0, maxX: 100, minY: 0, maxY: 100 }); - colorBar.range('rangeY', { minY: 0, maxY: 360 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('s'), y: 100 - active.val('v') }, colorMap); - colorBar.val('y', 360 - active.val('h'), colorBar); - break; - case 's': - setTimeout( - function() - { - setBG.call($this, colorMapDiv, 'transparent'); - setImgLoc.call($this, colorMapL1, -260); - setImgLoc.call($this, colorMapL2, -520); - setImgLoc.call($this, colorBarL1, -260); - setImgLoc.call($this, colorBarL2, -520); - setImgLoc.call($this, colorBarL6, 260); - setAlpha.call($this, colorBarL6, 100); - }, 0); - colorMap.range('all', { minX: 0, maxX: 360, minY: 0, maxY: 100 }); - colorBar.range('rangeY', { minY: 0, maxY: 100 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('h'), y: 100 - active.val('v') }, colorMap); - colorBar.val('y', 100 - active.val('s'), colorBar); - break; - case 'v': - setTimeout( - function() - { - setBG.call($this, colorMapDiv, '000000'); - setImgLoc.call($this, colorMapL1, -780); - setImgLoc.call($this, colorMapL2, 260); - setBG.call($this, colorBarDiv, hex); - setImgLoc.call($this, colorBarL1, -520); - setImgLoc.call($this, colorBarL2, 260); - setAlpha.call($this, colorBarL2, 100); - setImgLoc.call($this, colorBarL6, 260); - setAlpha.call($this, colorBarL6, 100); - }, 0); - colorMap.range('all', { minX: 0, maxX: 360, minY: 0, maxY: 100 }); - colorBar.range('rangeY', { minY: 0, maxY: 100 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('h'), y: 100 - active.val('s') }, colorMap); - colorBar.val('y', 100 - active.val('v'), colorBar); - break; - case 'r': - rgbMap = -1040; - rgbBar = -780; - colorMap.range('all', { minX: 0, maxX: 255, minY: 0, maxY: 255 }); - colorBar.range('rangeY', { minY: 0, maxY: 255 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('b'), y: 255 - active.val('g') }, colorMap); - colorBar.val('y', 255 - active.val('r'), colorBar); - break; - case 'g': - rgbMap = -1560; - rgbBar = -1820; - colorMap.range('all', { minX: 0, maxX: 255, minY: 0, maxY: 255 }); - colorBar.range('rangeY', { minY: 0, maxY: 255 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('b'), y: 255 - active.val('r') }, colorMap); - colorBar.val('y', 255 - active.val('g'), colorBar); - break; - case 'b': - rgbMap = -2080; - rgbBar = -2860; - colorMap.range('all', { minX: 0, maxX: 255, minY: 0, maxY: 255 }); - colorBar.range('rangeY', { minY: 0, maxY: 255 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('r'), y: 255 - active.val('g') }, colorMap); - colorBar.val('y', 255 - active.val('b'), colorBar); - break; - case 'a': - setTimeout( - function() - { - setBG.call($this, colorMapDiv, 'transparent'); - setImgLoc.call($this, colorMapL1, -260); - setImgLoc.call($this, colorMapL2, -520); - setImgLoc.call($this, colorBarL1, 260); - setImgLoc.call($this, colorBarL2, 260); - setAlpha.call($this, colorBarL2, 100); - setImgLoc.call($this, colorBarL6, 0); - setAlpha.call($this, colorBarL6, 100); - }, 0); - colorMap.range('all', { minX: 0, maxX: 360, minY: 0, maxY: 100 }); - colorBar.range('rangeY', { minY: 0, maxY: 255 }); - if (active.val('ahex') == null) break; - colorMap.val('xy', { x: active.val('h'), y: 100 - active.val('v') }, colorMap); - colorBar.val('y', 255 - active.val('a'), colorBar); - break; - default: - throw ('Invalid Mode'); - break; - } - switch (colorMode) - { - case 'h': - break; - case 's': - case 'v': - case 'a': - setTimeout( - function() - { - setAlpha.call($this, colorMapL1, 100); - setAlpha.call($this, colorBarL1, 100); - setImgLoc.call($this, colorBarL3, 260); - setAlpha.call($this, colorBarL3, 100); - setImgLoc.call($this, colorBarL4, 260); - setAlpha.call($this, colorBarL4, 100); - }, 0); - break; - case 'r': - case 'g': - case 'b': - setTimeout( - function() - { - setBG.call($this, colorMapDiv, 'transparent'); - setBG.call($this, colorBarDiv, 'transparent'); - setAlpha.call($this, colorBarL1, 100); - setAlpha.call($this, colorMapL1, 100); - setImgLoc.call($this, colorMapL1, rgbMap); - setImgLoc.call($this, colorMapL2, rgbMap - 260); - setImgLoc.call($this, colorBarL1, rgbBar - 780); - setImgLoc.call($this, colorBarL2, rgbBar - 520); - setImgLoc.call($this, colorBarL3, rgbBar); - setImgLoc.call($this, colorBarL4, rgbBar - 260); - setImgLoc.call($this, colorBarL6, 260); - setAlpha.call($this, colorBarL6, 100); - }, 0); - break; - } - if (active.val('ahex') == null) return; - activeColorChanged.call($this, active); - }, - activeColorChanged = // Update color when user changes text values - function(ui, context) - { - if (context == null || (context != colorBar && context != colorMap)) positionMapAndBarArrows.call($this, ui, context); - setTimeout( - function() - { - updatePreview.call($this, ui); - updateMapVisuals.call($this, ui); - updateBarVisuals.call($this, ui); - }, 0); - }, - mapValueChanged = // user has dragged the ColorMap pointer - function(ui, context) - { - var active = color.active; - if (context != colorMap && active.val() == null) return; - var xy = ui.val('all'); - switch (settings.color.mode) - { - case 'h': - active.val('sv', { s: xy.x, v: 100 - xy.y }, context); - break; - case 's': - case 'a': - active.val('hv', { h: xy.x, v: 100 - xy.y }, context); - break; - case 'v': - active.val('hs', { h: xy.x, s: 100 - xy.y }, context); - break; - case 'r': - active.val('gb', { g: 255 - xy.y, b: xy.x }, context); - break; - case 'g': - active.val('rb', { r: 255 - xy.y, b: xy.x }, context); - break; - case 'b': - active.val('rg', { r: xy.x, g: 255 - xy.y }, context); - break; - } - }, - colorBarValueChanged = // user has dragged the ColorBar slider - function(ui, context) - { - var active = color.active; - if (context != colorBar && active.val() == null) return; - switch (settings.color.mode) - { - case 'h': - active.val('h', { h: 360 - ui.val('y') }, context); - break; - case 's': - active.val('s', { s: 100 - ui.val('y') }, context); - break; - case 'v': - active.val('v', { v: 100 - ui.val('y') }, context); - break; - case 'r': - active.val('r', { r: 255 - ui.val('y') }, context); - break; - case 'g': - active.val('g', { g: 255 - ui.val('y') }, context); - break; - case 'b': - active.val('b', { b: 255 - ui.val('y') }, context); - break; - case 'a': - active.val('a', 255 - ui.val('y'), context); - break; - } - }, - positionMapAndBarArrows = // position map and bar arrows to match current color - function(ui, context) - { - if (context != colorMap) - { - switch (settings.color.mode) - { - case 'h': - var sv = ui.val('sv'); - colorMap.val('xy', { x: sv != null ? sv.s : 100, y: 100 - (sv != null ? sv.v : 100) }, context); - break; - case 's': - case 'a': - var hv = ui.val('hv'); - colorMap.val('xy', { x: hv && hv.h || 0, y: 100 - (hv != null ? hv.v : 100) }, context); - break; - case 'v': - var hs = ui.val('hs'); - colorMap.val('xy', { x: hs && hs.h || 0, y: 100 - (hs != null ? hs.s : 100) }, context); - break; - case 'r': - var bg = ui.val('bg'); - colorMap.val('xy', { x: bg && bg.b || 0, y: 255 - (bg && bg.g || 0) }, context); - break; - case 'g': - var br = ui.val('br'); - colorMap.val('xy', { x: br && br.b || 0, y: 255 - (br && br.r || 0) }, context); - break; - case 'b': - var rg = ui.val('rg'); - colorMap.val('xy', { x: rg && rg.r || 0, y: 255 - (rg && rg.g || 0) }, context); - break; - } - } - if (context != colorBar) - { - switch (settings.color.mode) - { - case 'h': - colorBar.val('y', 360 - (ui.val('h') || 0), context); - break; - case 's': - var s = ui.val('s'); - colorBar.val('y', 100 - (s != null ? s : 100), context); - break; - case 'v': - var v = ui.val('v'); - colorBar.val('y', 100 - (v != null ? v : 100), context); - break; - case 'r': - colorBar.val('y', 255 - (ui.val('r') || 0), context); - break; - case 'g': - colorBar.val('y', 255 - (ui.val('g') || 0), context); - break; - case 'b': - colorBar.val('y', 255 - (ui.val('b') || 0), context); - break; - case 'a': - var a = ui.val('a'); - colorBar.val('y', 255 - (a != null ? a : 255), context); - break; - } - } - }, - updatePreview = - function(ui) - { - try - { - var all = ui.val('all'); - activePreview.css({ backgroundColor: all && '#' + all.hex || 'transparent' }); - setAlpha.call($this, activePreview, all && Math.precision((all.a * 100) / 255, 4) || 0); - } - catch (e) { } - }, - updateMapVisuals = - function(ui) - { - switch (settings.color.mode) - { - case 'h': - setBG.call($this, colorMapDiv, new Color({ h: ui.val('h') || 0, s: 100, v: 100 }).val('hex')); - break; - case 's': - case 'a': - var s = ui.val('s'); - setAlpha.call($this, colorMapL2, 100 - (s != null ? s : 100)); - break; - case 'v': - var v = ui.val('v'); - setAlpha.call($this, colorMapL1, v != null ? v : 100); - break; - case 'r': - setAlpha.call($this, colorMapL2, Math.precision((ui.val('r') || 0) / 255 * 100, 4)); - break; - case 'g': - setAlpha.call($this, colorMapL2, Math.precision((ui.val('g') || 0) / 255 * 100, 4)); - break; - case 'b': - setAlpha.call($this, colorMapL2, Math.precision((ui.val('b') || 0) / 255 * 100)); - break; - } - var a = ui.val('a'); - setAlpha.call($this, colorMapL3, Math.precision(((255 - (a || 0)) * 100) / 255, 4)); - }, - updateBarVisuals = - function(ui) - { - switch (settings.color.mode) - { - case 'h': - var a = ui.val('a'); - setAlpha.call($this, colorBarL5, Math.precision(((255 - (a || 0)) * 100) / 255, 4)); - break; - case 's': - var hva = ui.val('hva'), - saturatedColor = new Color({ h: hva && hva.h || 0, s: 100, v: hva != null ? hva.v : 100 }); - setBG.call($this, colorBarDiv, saturatedColor.val('hex')); - setAlpha.call($this, colorBarL2, 100 - (hva != null ? hva.v : 100)); - setAlpha.call($this, colorBarL5, Math.precision(((255 - (hva && hva.a || 0)) * 100) / 255, 4)); - break; - case 'v': - var hsa = ui.val('hsa'), - valueColor = new Color({ h: hsa && hsa.h || 0, s: hsa != null ? hsa.s : 100, v: 100 }); - setBG.call($this, colorBarDiv, valueColor.val('hex')); - setAlpha.call($this, colorBarL5, Math.precision(((255 - (hsa && hsa.a || 0)) * 100) / 255, 4)); - break; - case 'r': - case 'g': - case 'b': - var hValue = 0, vValue = 0, rgba = ui.val('rgba'); - if (settings.color.mode == 'r') - { - hValue = rgba && rgba.b || 0; - vValue = rgba && rgba.g || 0; - } - else if (settings.color.mode == 'g') - { - hValue = rgba && rgba.b || 0; - vValue = rgba && rgba.r || 0; - } - else if (settings.color.mode == 'b') - { - hValue = rgba && rgba.r || 0; - vValue = rgba && rgba.g || 0; - } - var middle = vValue > hValue ? hValue : vValue; - setAlpha.call($this, colorBarL2, hValue > vValue ? Math.precision(((hValue - vValue) / (255 - vValue)) * 100, 4) : 0); - setAlpha.call($this, colorBarL3, vValue > hValue ? Math.precision(((vValue - hValue) / (255 - hValue)) * 100, 4) : 0); - setAlpha.call($this, colorBarL4, Math.precision((middle / 255) * 100, 4)); - setAlpha.call($this, colorBarL5, Math.precision(((255 - (rgba && rgba.a || 0)) * 100) / 255, 4)); - break; - case 'a': - var a = ui.val('a'); - setBG.call($this, colorBarDiv, ui.val('hex') || '000000'); - setAlpha.call($this, colorBarL5, a != null ? 0 : 100); - setAlpha.call($this, colorBarL6, a != null ? 100 : 0); - break; - } - }, - setBG = - function(el, c) - { - el.css({ backgroundColor: c && c.length == 6 && '#' + c || 'transparent' }); - }, - setImg = - function(img, src) - { - if (isLessThanIE7 && (src.indexOf('AlphaBar.png') != -1 || src.indexOf('Bars.png') != -1 || src.indexOf('Maps.png') != -1)) - { - img.attr('pngSrc', src); - img.css({ backgroundImage: 'none', filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + src + '\', sizingMethod=\'scale\')' }); - } - else img.css({ backgroundImage: 'url(\'' + src + '\')' }); - }, - setImgLoc = - function(img, y) - { - img.css({ top: y + 'px' }); - }, - setAlpha = - function(obj, alpha) - { - obj.css({ visibility: alpha > 0 ? 'visible' : 'hidden' }); - if (alpha > 0 && alpha < 100) - { - if (isLessThanIE7) - { - var src = obj.attr('pngSrc'); - if (src != null && (src.indexOf('AlphaBar.png') != -1 || src.indexOf('Bars.png') != -1 || src.indexOf('Maps.png') != -1)) - obj.css({ filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + src + '\', sizingMethod=\'scale\') progid:DXImageTransform.Microsoft.Alpha(opacity=' + alpha + ')' }); - else obj.css({ opacity: Math.precision(alpha / 100, 4) }); - } - else obj.css({ opacity: Math.precision(alpha / 100, 4) }); - } - else if (alpha == 0 || alpha == 100) - { - if (isLessThanIE7) - { - var src = obj.attr('pngSrc'); - if (src != null && (src.indexOf('AlphaBar.png') != -1 || src.indexOf('Bars.png') != -1 || src.indexOf('Maps.png') != -1)) - obj.css({ filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + src + '\', sizingMethod=\'scale\')' }); - else obj.css({ opacity: '' }); - } - else obj.css({ opacity: '' }); - } - }, - revertColor = // revert color to original color when opened - function() - { - color.active.val('ahex', color.current.val('ahex')); - }, - commitColor = // commit the color changes - function() - { - color.current.val('ahex', color.active.val('ahex')); - }, - radioClicked = - function(e) - { - $(this).parents('tbody:first').find('input:radio[value!="'+e.target.value+'"]').removeAttr('checked'); - setColorMode.call($this, e.target.value); - }, - currentClicked = - function() - { - revertColor.call($this); - }, - cancelClicked = - function() - { - revertColor.call($this); - settings.window.expandable && hide.call($this); - $.isFunction(cancelCallback) && cancelCallback.call($this, color.active, cancelButton); - }, - okClicked = - function() - { - commitColor.call($this); - settings.window.expandable && hide.call($this); - $.isFunction(commitCallback) && commitCallback.call($this, color.active, okButton); - }, - iconImageClicked = - function() - { - show.call($this); - }, - currentColorChanged = - function(ui, context) - { - var hex = ui.val('hex'); - currentPreview.css({ backgroundColor: hex && '#' + hex || 'transparent' }); - setAlpha.call($this, currentPreview, Math.precision(((ui.val('a') || 0) * 100) / 255, 4)); - }, - expandableColorChanged = - function(ui, context) - { - var hex = ui.val('hex'); - var va = ui.val('va'); - iconColor.css({ backgroundColor: hex && '#' + hex || 'transparent' }); - setAlpha.call($this, iconAlpha, Math.precision(((255 - (va && va.a || 0)) * 100) / 255, 4)); - if (settings.window.bindToInput&&settings.window.updateInputColor) - settings.window.input.css( - { - backgroundColor: hex && '#' + hex || 'transparent', - color: va == null || va.v > 75 ? '#000000' : '#ffffff' - }); - }, - moveBarMouseDown = - function(e) - { - var element = settings.window.element, // local copies for YUI compressor - page = settings.window.page; - elementStartX = parseInt(container.css('left')); - elementStartY = parseInt(container.css('top')); - pageStartX = e.pageX; - pageStartY = e.pageY; - // bind events to document to move window - we will unbind these on mouseup - $(document).bind('mousemove', documentMouseMove).bind('mouseup', documentMouseUp); - e.preventDefault(); // prevent attempted dragging of the column - }, - documentMouseMove = - function(e) - { - container.css({ left: elementStartX - (pageStartX - e.pageX) + 'px', top: elementStartY - (pageStartY - e.pageY) + 'px' }); - if (settings.window.expandable && !$.support.boxModel) container.prev().css({ left: container.css("left"), top: container.css("top") }); - e.stopPropagation(); - e.preventDefault(); - return false; - }, - documentMouseUp = - function(e) - { - $(document).unbind('mousemove', documentMouseMove).unbind('mouseup', documentMouseUp); - e.stopPropagation(); - e.preventDefault(); - return false; - }, - quickPickClicked = - function(e) - { - e.preventDefault(); - e.stopPropagation(); - color.active.val('ahex', $(this).attr('title') || null, e.target); - return false; - }, - commitCallback = $.isFunction($arguments[1]) && $arguments[1] || null, - liveCallback = $.isFunction($arguments[2]) && $arguments[2] || null, - cancelCallback = $.isFunction($arguments[3]) && $arguments[3] || null, - show = - function() - { - color.current.val('ahex', color.active.val('ahex')); - var attachIFrame = function() - { - if (!settings.window.expandable || $.support.boxModel) return; - var table = container.find('table:first'); - container.before('