├── .gitignore ├── Jakefile.js ├── LICENSE.txt ├── README.md ├── package.json ├── src ├── img │ ├── +.png │ ├── +.svg │ ├── -.png │ ├── -.svg │ ├── arrow-down.png │ ├── arrow-down.svg │ ├── arrow-right.png │ ├── arrow-right.svg │ ├── camera.png │ ├── camera.svg │ ├── close.png │ ├── close.svg │ ├── email.png │ ├── email.svg │ ├── go.png │ ├── go.svg │ ├── home.png │ ├── home.svg │ ├── search.png │ ├── search.svg │ ├── spin.png │ ├── spin.svg │ ├── star-average.png │ ├── star-individual.png │ ├── star-select.svg │ ├── star.opacity │ ├── star.png │ ├── star.svg │ ├── stop.png │ ├── stop.svg │ ├── x.png │ ├── x.svg │ ├── yield.png │ └── yield.svg ├── ninjaui.css └── ninjaui.js ├── test ├── css │ ├── normalizer.css │ ├── qunit.css │ └── style.css ├── img │ └── favicon.ico ├── index.html └── js │ ├── lib │ ├── jquery │ │ ├── jquery-1.6.1.min.js │ │ ├── jquery-1.6.2.min.js │ │ ├── jquery-1.6.3.min.js │ │ ├── jquery-1.6.4.min.js │ │ ├── jquery-1.6.min.js │ │ ├── jquery-1.7.1.min.js │ │ └── jquery-1.7.min.js │ ├── pavlov.js │ ├── qunit.js │ └── versions.js │ └── spec.js └── themes ├── bitmap.css └── yugen.css /.gitignore: -------------------------------------------------------------------------------- 1 | # Mac OS 2 | .DS_Store 3 | 4 | # Editors 5 | *.swp 6 | *~ 7 | \#* 8 | .\#* 9 | *.tmproj 10 | tmtags 11 | .idea 12 | .redcar 13 | 14 | node_modules/ 15 | 16 | # Ninja UI built files 17 | jquery.ninjaui.js 18 | jquery.ninjaui.min.js 19 | -------------------------------------------------------------------------------- /Jakefile.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2008-2012 Jamie Hoover. 3 | Licensed per the terms of the Apache License v2.0. See Readme.md for more details. 4 | */ 5 | 6 | /*globals desc: false, task: false, file: false, directory: false*/ 7 | 8 | /*jshint bitwise: true, browser: true, curly: true, eqeqeq: true, forin: true, immed: true, indent: 2, node: true, maxerr: 3, newcap: true, noarg: true, noempty: true, nomen: true, nonew: true, onevar: true, plusplus: false, regexp: true, strict: false, undef: true, white: true*/ 9 | 10 | var 11 | cleanCSS = require('clean-css'), 12 | fs = require('fs'), 13 | uglify = require('uglify-js'), 14 | pkg = JSON.parse(fs.readFileSync(__dirname + '/package.json', 'utf8')), 15 | version = pkg.version; 16 | 17 | desc('Default task.'); 18 | task('default', ['jquery.ninjaui.min.js'], function () { 19 | console.log('Ninja UI ' + version + ' build complete. Test URL: file://' + __dirname + '/test/index.html?environment=production'); 20 | }); 21 | 22 | desc('Display version number.'); 23 | task('version', function () { 24 | console.log(version); 25 | }); 26 | 27 | desc('Build JavaScript file.'); 28 | file('jquery.ninjaui.js', [__dirname + '/src/ninjaui.css', __dirname + '/src/ninjaui.js'], function () { 29 | var 30 | css = new Buffer(cleanCSS.process(fs.readFileSync(__dirname + '/src/ninjaui.css', 'utf8'))), 31 | js = fs.readFileSync(__dirname + '/src/ninjaui.js', 'utf8').replace(/development/g, version).replace('../src/ninjaui.css', 'data:text/css;base64,' + css.toString('base64')); 32 | fs.writeFileSync('jquery.ninjaui.js', js, 'utf8'); 33 | }); 34 | 35 | desc('Minify JavaScript file.'); 36 | file('jquery.ninjaui.min.js', ['jquery.ninjaui.js'], function () { 37 | var 38 | copyright = '/*! Ninja UI v' + version + ' ninjaui.com | ninjaui.com/#license */\n', 39 | js = uglify(fs.readFileSync('jquery.ninjaui.js', 'utf8')); 40 | fs.writeFileSync('jquery.ninjaui.min.js', copyright + js, 'utf8'); 41 | }); 42 | 43 | desc('Remove generated files.'); 44 | task('clean', function () { 45 | fs.unlink('jquery.ninjaui.min.js'); 46 | fs.unlink('jquery.ninjaui.js'); 47 | }); 48 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | 2 | Apache License 3 | Version 2.0, January 2004 4 | http://www.apache.org/licenses/ 5 | 6 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 7 | 8 | 1. Definitions. 9 | 10 | "License" shall mean the terms and conditions for use, reproduction, 11 | and distribution as defined by Sections 1 through 9 of this document. 12 | 13 | "Licensor" shall mean the copyright owner or entity authorized by 14 | the copyright owner that is granting the License. 15 | 16 | "Legal Entity" shall mean the union of the acting entity and all 17 | other entities that control, are controlled by, or are under common 18 | control with that entity. For the purposes of this definition, 19 | "control" means (i) the power, direct or indirect, to cause the 20 | direction or management of such entity, whether by contract or 21 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 22 | outstanding shares, or (iii) beneficial ownership of such entity. 23 | 24 | "You" (or "Your") shall mean an individual or Legal Entity 25 | exercising permissions granted by this License. 26 | 27 | "Source" form shall mean the preferred form for making modifications, 28 | including but not limited to software source code, documentation 29 | source, and configuration files. 30 | 31 | "Object" form shall mean any form resulting from mechanical 32 | transformation or translation of a Source form, including but 33 | not limited to compiled object code, generated documentation, 34 | and conversions to other media types. 35 | 36 | "Work" shall mean the work of authorship, whether in Source or 37 | Object form, made available under the License, as indicated by a 38 | copyright notice that is included in or attached to the work 39 | (an example is provided in the Appendix below). 40 | 41 | "Derivative Works" shall mean any work, whether in Source or Object 42 | form, that is based on (or derived from) the Work and for which the 43 | editorial revisions, annotations, elaborations, or other modifications 44 | represent, as a whole, an original work of authorship. For the purposes 45 | of this License, Derivative Works shall not include works that remain 46 | separable from, or merely link (or bind by name) to the interfaces of, 47 | the Work and Derivative Works thereof. 48 | 49 | "Contribution" shall mean any work of authorship, including 50 | the original version of the Work and any modifications or additions 51 | to that Work or Derivative Works thereof, that is intentionally 52 | submitted to Licensor for inclusion in the Work by the copyright owner 53 | or by an individual or Legal Entity authorized to submit on behalf of 54 | the copyright owner. For the purposes of this definition, "submitted" 55 | means any form of electronic, verbal, or written communication sent 56 | to the Licensor or its representatives, including but not limited to 57 | communication on electronic mailing lists, source code control systems, 58 | and issue tracking systems that are managed by, or on behalf of, the 59 | Licensor for the purpose of discussing and improving the Work, but 60 | excluding communication that is conspicuously marked or otherwise 61 | designated in writing by the copyright owner as "Not a Contribution." 62 | 63 | "Contributor" shall mean Licensor and any individual or Legal Entity 64 | on behalf of whom a Contribution has been received by Licensor and 65 | subsequently incorporated within the Work. 66 | 67 | 2. Grant of Copyright License. Subject to the terms and conditions of 68 | this License, each Contributor hereby grants to You a perpetual, 69 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 70 | copyright license to reproduce, prepare Derivative Works of, 71 | publicly display, publicly perform, sublicense, and distribute the 72 | Work and such Derivative Works in Source or Object form. 73 | 74 | 3. Grant of Patent License. Subject to the terms and conditions of 75 | this License, each Contributor hereby grants to You a perpetual, 76 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 77 | (except as stated in this section) patent license to make, have made, 78 | use, offer to sell, sell, import, and otherwise transfer the Work, 79 | where such license applies only to those patent claims licensable 80 | by such Contributor that are necessarily infringed by their 81 | Contribution(s) alone or by combination of their Contribution(s) 82 | with the Work to which such Contribution(s) was submitted. If You 83 | institute patent litigation against any entity (including a 84 | cross-claim or counterclaim in a lawsuit) alleging that the Work 85 | or a Contribution incorporated within the Work constitutes direct 86 | or contributory patent infringement, then any patent licenses 87 | granted to You under this License for that Work shall terminate 88 | as of the date such litigation is filed. 89 | 90 | 4. Redistribution. You may reproduce and distribute copies of the 91 | Work or Derivative Works thereof in any medium, with or without 92 | modifications, and in Source or Object form, provided that You 93 | meet the following conditions: 94 | 95 | (a) You must give any other recipients of the Work or 96 | Derivative Works a copy of this License; and 97 | 98 | (b) You must cause any modified files to carry prominent notices 99 | stating that You changed the files; and 100 | 101 | (c) You must retain, in the Source form of any Derivative Works 102 | that You distribute, all copyright, patent, trademark, and 103 | attribution notices from the Source form of the Work, 104 | excluding those notices that do not pertain to any part of 105 | the Derivative Works; and 106 | 107 | (d) If the Work includes a "NOTICE" text file as part of its 108 | distribution, then any Derivative Works that You distribute must 109 | include a readable copy of the attribution notices contained 110 | within such NOTICE file, excluding those notices that do not 111 | pertain to any part of the Derivative Works, in at least one 112 | of the following places: within a NOTICE text file distributed 113 | as part of the Derivative Works; within the Source form or 114 | documentation, if provided along with the Derivative Works; or, 115 | within a display generated by the Derivative Works, if and 116 | wherever such third-party notices normally appear. The contents 117 | of the NOTICE file are for informational purposes only and 118 | do not modify the License. You may add Your own attribution 119 | notices within Derivative Works that You distribute, alongside 120 | or as an addendum to the NOTICE text from the Work, provided 121 | that such additional attribution notices cannot be construed 122 | as modifying the License. 123 | 124 | You may add Your own copyright statement to Your modifications and 125 | may provide additional or different license terms and conditions 126 | for use, reproduction, or distribution of Your modifications, or 127 | for any such Derivative Works as a whole, provided Your use, 128 | reproduction, and distribution of the Work otherwise complies with 129 | the conditions stated in this License. 130 | 131 | 5. Submission of Contributions. Unless You explicitly state otherwise, 132 | any Contribution intentionally submitted for inclusion in the Work 133 | by You to the Licensor shall be under the terms and conditions of 134 | this License, without any additional terms or conditions. 135 | Notwithstanding the above, nothing herein shall supersede or modify 136 | the terms of any separate license agreement you may have executed 137 | with Licensor regarding such Contributions. 138 | 139 | 6. Trademarks. This License does not grant permission to use the trade 140 | names, trademarks, service marks, or product names of the Licensor, 141 | except as required for reasonable and customary use in describing the 142 | origin of the Work and reproducing the content of the NOTICE file. 143 | 144 | 7. Disclaimer of Warranty. Unless required by applicable law or 145 | agreed to in writing, Licensor provides the Work (and each 146 | Contributor provides its Contributions) on an "AS IS" BASIS, 147 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 148 | implied, including, without limitation, any warranties or conditions 149 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 150 | PARTICULAR PURPOSE. You are solely responsible for determining the 151 | appropriateness of using or redistributing the Work and assume any 152 | risks associated with Your exercise of permissions under this License. 153 | 154 | 8. Limitation of Liability. In no event and under no legal theory, 155 | whether in tort (including negligence), contract, or otherwise, 156 | unless required by applicable law (such as deliberate and grossly 157 | negligent acts) or agreed to in writing, shall any Contributor be 158 | liable to You for damages, including any direct, indirect, special, 159 | incidental, or consequential damages of any character arising as a 160 | result of this License or out of the use or inability to use the 161 | Work (including but not limited to damages for loss of goodwill, 162 | work stoppage, computer failure or malfunction, or any and all 163 | other commercial damages or losses), even if such Contributor 164 | has been advised of the possibility of such damages. 165 | 166 | 9. Accepting Warranty or Additional Liability. While redistributing 167 | the Work or Derivative Works thereof, You may choose to offer, 168 | and charge a fee for, acceptance of support, warranty, indemnity, 169 | or other liability obligations and/or rights consistent with this 170 | License. However, in accepting such obligations, You may act only 171 | on Your own behalf and on Your sole responsibility, not on behalf 172 | of any other Contributor, and only if You agree to indemnify, 173 | defend, and hold each Contributor harmless for any liability 174 | incurred by, or claims asserted against, such Contributor by reason 175 | of your accepting any such warranty or additional liability. 176 | 177 | END OF TERMS AND CONDITIONS 178 | 179 | APPENDIX: How to apply the Apache License to your work. 180 | 181 | To apply the Apache License to your work, attach the following 182 | boilerplate notice, with the fields enclosed by brackets "[]" 183 | replaced with your own identifying information. (Don't include 184 | the brackets!) The text should be enclosed in the appropriate 185 | comment syntax for the file format. We also recommend that a 186 | file or class name and description of purpose be included on the 187 | same "printed page" as the copyright notice for easier 188 | identification within third-party archives. 189 | 190 | Copyright [yyyy] [name of copyright owner] 191 | 192 | Licensed under the Apache License, Version 2.0 (the "License"); 193 | you may not use this file except in compliance with the License. 194 | You may obtain a copy of the License at 195 | 196 | http://www.apache.org/licenses/LICENSE-2.0 197 | 198 | Unless required by applicable law or agreed to in writing, software 199 | distributed under the License is distributed on an "AS IS" BASIS, 200 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 201 | See the License for the specific language governing permissions and 202 | limitations under the License. 203 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [Ninja User Interface](http://ninjaui.com/) 2 | ================================================= 3 | 4 | the jQuery plugin for lethal interaction 5 | 6 | Production Dependency 7 | --------------------- 8 | 9 | [jQuery](http://jquery.com/) 10 | 11 | Development Dependencies 12 | ------------------------ 13 | [Node.js](http://nodejs.org/) 14 | Jake 15 | CleanCSS 16 | UglifyJS 17 | 18 | Develop 19 | ------- 20 | If you've never previously installed Jake before 21 | 22 | npm install -g jake 23 | 24 | Navigate to wherever you cloned/downloaded Ninja UI and install dependencies 25 | 26 | cd ~/projects/ninjaui 27 | npm install 28 | 29 | Test during development 30 | ----------------------- 31 | Open test page in a web browser 32 | 33 | file:///~/ninjaui/test/index.html 34 | 35 | Test with a theme: 36 | 37 | file:///~/ninjaui/test/index.html?theme=dojo 38 | 39 | Build 40 | ----- 41 | After making changes to either src/ninjaui.js or src/ninjaui.css run jake 42 | 43 | cd ~/projects/ninjaui 44 | jake 45 | 46 | Test after building 47 | ------------------- 48 | Open test page in a web browser 49 | 50 | file:///~/ninjaui/test/index.html?environment=production 51 | 52 | Authors 53 | ------- 54 | 55 | Jamie R. Hoover and Faisal N. Jawdat 56 | 57 | License 58 | ------- 59 | 60 | Copyright 2008-2012 Jamie Hoover. 61 | 62 | Licensed under the Apache License, Version 2.0 (the "License"); 63 | you may not use this file except in compliance with the License. 64 | 65 | You may obtain a copy of the License at 66 | 67 | [ninjaui.com/LICENSE.txt](http://ninjaui.com/LICENSE.txt) 68 | 69 | Unless required by applicable law or agreed to in writing, software 70 | distributed under the License is distributed on an "AS IS" BASIS, 71 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 72 | See the License for the specific language governing permissions and 73 | limitations under the License. 74 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ninjaui", 3 | "version": "1.0.1", 4 | "description": "the jQuery plugin for lethal interaction", 5 | "keywords": ["jquery ui", "jquery", "ui", "user interface", "autocomplete", "button", "dialog", "drawer", "icons", "menu", "rating", "slider", "tabs", "jquery", "plugin", "ninja"], 6 | "authors": ["Jamie R. Hoover ", "Faisal N. Jawdat "], 7 | "homepage": "https://ninjaui.com/", 8 | "repository": { 9 | "type": "git", 10 | "url": "https://github.com/ninja/ui.git" 11 | }, 12 | "engines": { 13 | "node": "0.6.x" 14 | }, 15 | "dependencies": { 16 | "clean-css": "0.3.x", 17 | "uglify-js": "1.2.x" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/img/+.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/+.png -------------------------------------------------------------------------------- /src/img/+.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | + 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | + 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/-.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/-.png -------------------------------------------------------------------------------- /src/img/-.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | - 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | - 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/arrow-down.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/arrow-down.png -------------------------------------------------------------------------------- /src/img/arrow-down.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | arrow-down 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | arrow-down 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/arrow-right.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/arrow-right.png -------------------------------------------------------------------------------- /src/img/arrow-right.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | arrow-right 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | arrow-right 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/camera.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/camera.png -------------------------------------------------------------------------------- /src/img/camera.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | camera 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | camera 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/close.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/close.png -------------------------------------------------------------------------------- /src/img/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | close 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | 20 | 21 | 22 | 23 | 24 | close 25 | 26 | 27 | 28 | image/svg+xml 29 | en 30 | 31 | 32 | 33 | 34 | Layer 1 35 | 36 | 37 | 38 | 39 | 40 | 41 | close 42 | 43 | 44 | 45 | image/svg+xml 46 | en 47 | 48 | 49 | 50 | 51 | Layer 1 52 | X 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /src/img/email.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/email.png -------------------------------------------------------------------------------- /src/img/email.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | email 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | email 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/go.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/go.png -------------------------------------------------------------------------------- /src/img/go.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | go 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | go 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/home.png -------------------------------------------------------------------------------- /src/img/home.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | home 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | home 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/search.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/search.png -------------------------------------------------------------------------------- /src/img/search.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | search 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | 20 | 21 | 22 | 23 | 24 | search 25 | 26 | 27 | 28 | image/svg+xml 29 | en 30 | 31 | 32 | 33 | 34 | Layer 1 35 | search 36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /src/img/spin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/spin.png -------------------------------------------------------------------------------- /src/img/spin.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | spin 12 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | 20 | 21 | 22 | 23 | 24 | spin 12 25 | 26 | 27 | 28 | image/svg+xml 29 | en 30 | 31 | 32 | 33 | 34 | Layer 1 35 | 36 | spin 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /src/img/star-average.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/star-average.png -------------------------------------------------------------------------------- /src/img/star-individual.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/star-individual.png -------------------------------------------------------------------------------- /src/img/star-select.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | star 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | 20 | 21 | 22 | 23 | 24 | star 25 | 26 | 27 | 28 | image/svg+xml 29 | en 30 | 31 | 32 | 33 | 34 | Layer 1 35 | star 36 | 37 | 38 | 39 | 40 | 41 | Color Controls 42 | 43 | 44 | 45 | Color Monochrome 46 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /src/img/star.opacity: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/star.opacity -------------------------------------------------------------------------------- /src/img/star.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/star.png -------------------------------------------------------------------------------- /src/img/star.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | star 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | star 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/stop.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/stop.png -------------------------------------------------------------------------------- /src/img/stop.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | stop 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | stop 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/img/x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/x.png -------------------------------------------------------------------------------- /src/img/x.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | x 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | x 20 | 21 | 22 | Color Invert 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /src/img/yield.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ninja/ui/274a4a702b2926cb9c3db7609655c133ed866a46/src/img/yield.png -------------------------------------------------------------------------------- /src/img/yield.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | yield 9 | 10 | 11 | 12 | image/svg+xml 13 | en 14 | 15 | 16 | 17 | 18 | Layer 1 19 | yield 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/ninjaui.css: -------------------------------------------------------------------------------- 1 | /*! Ninja UI vdevelopment ninjaui.com | ninjaui.com/#license */ 2 | 3 | /* autocomplete, menu, slider-track */ 4 | .nui-atc, 5 | .nui-mnu, 6 | .nui-sld-trk { 7 | position: relative; 8 | } 9 | 10 | /* autocomplete-icon-spin, blocker, dialog, dialog-icon-X, list, slider-button, slider-groove */ 11 | .nui-atc .nui-icn[aria-label=spin], 12 | .nui-blk, 13 | .nui-dlg, 14 | .nui-dlg .nui-icn[aria-label=X], 15 | .nui-lst, 16 | .nui-sld-btn, 17 | .nui-sld-grv { 18 | position: absolute; 19 | } 20 | 21 | /* autocomplete, icon, menu, slider, tabs-horizontal */ 22 | .nui-atc, 23 | .nui-icn, 24 | .nui-mnu, 25 | .nui-sld, 26 | .nui-tab-hrz { 27 | display: inline-block; 28 | } 29 | 30 | /* autocomplete-icon-spin */ 31 | .nui-atc .nui-icn[aria-label=spin] { 32 | opacity: 0.5; 33 | right: 1px; 34 | top: 1px; 35 | } 36 | 37 | /* autocomplete-input */ 38 | .nui-atc input { 39 | padding-right: 17px; 40 | } 41 | 42 | /* blocker, drawer-button, item */ 43 | .nui-blk, 44 | .nui-drw .nui-btn, 45 | .nui-itm { 46 | width: 100%; 47 | } 48 | 49 | /* blocker, slider-button */ 50 | .nui-blk, 51 | .nui-sld-btn { 52 | left: 0; 53 | top: 0; 54 | } 55 | 56 | /* blocker, dialog, list */ 57 | .nui-blk { 58 | background-color: rgba(255,255,255,0.5); 59 | } 60 | 61 | /* button, item.hover, slider-button, slider-level, tab */ 62 | .nui-btn, 63 | .nui-itm.nui-hvr, 64 | .nui-sld-btn, 65 | .nui-sld-lvl, 66 | .nui-tab { 67 | background-image: -webkit-gradient(linear, left top, left bottom, colorstop(0, rgba(255,255,255,0.2)), colorstop(0.5, rgba(255,255,255,0)), colorstop(0.5, rgba(0,0,0,0)), colorstop(1, rgba(0,0,0,0.1))); 68 | background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.1) 100%); 69 | background-image: -moz-linear-gradient(top, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.1) 100%); 70 | background-image: -ms-linear-gradient(top, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.1) 100%); 71 | background-image: -o-linear-gradient(top, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.1) 100%); 72 | } 73 | 74 | /* button, item, tab, tray */ 75 | .nui-btn, 76 | .nui-itm, 77 | .nui-tab, 78 | .nui-try { 79 | padding: 0.2em 1em; 80 | } 81 | 82 | /* button, item, tab */ 83 | .nui-btn, 84 | .nui-itm, 85 | .nui-tab { 86 | line-height: 1em; 87 | text-shadow: 0 1px 0 #fff; 88 | } 89 | 90 | /* button, dialog-icon-X, item, slider-button, slider-groove, star, tab */ 91 | .nui-btn, 92 | .nui-dlg .nui-icn[aria-label=X], 93 | .nui-itm, 94 | .nui-sld-btn, 95 | .nui-sld-grv, 96 | .nui-str, 97 | .nui-tab { 98 | cursor: pointer; 99 | } 100 | 101 | /* button, dialog, list, slider-button, slider-groove, slider-level, tab, tray */ 102 | .nui-btn, 103 | .nui-dlg, 104 | .nui-lst, 105 | .nui-sld-btn, 106 | .nui-sld-grv, 107 | .nui-sld-lvl, 108 | .nui-tab, 109 | .nui-try { 110 | -webkit-background-clip: padding-box; 111 | -moz-background-clip: padding; 112 | background-clip: padding-box; 113 | } 114 | 115 | /* button, slider-button, slider-groove, tab, tray */ 116 | .nui-btn, 117 | .nui-sld-btn, 118 | .nui-sld-grv, 119 | .nui-tab, 120 | .nui-try { 121 | background-color: #eee; 122 | border: 1px solid #999; 123 | } 124 | 125 | /* button, dialog, list */ 126 | .nui-btn, 127 | .nui-dlg, 128 | .nui-lst { 129 | -webkit-border-radius: 0.4em; 130 | -moz-border-radius: 0.4em; 131 | border-radius: 0.4em; 132 | } 133 | 134 | /* button, item, slider-button, star, tab */ 135 | .nui-btn, 136 | .nui-itm, 137 | .nui-sld-btn, 138 | .nui-str, 139 | .nui-tab { 140 | margin: 0; 141 | outline-width: 1px; 142 | } 143 | 144 | /* button, tab */ 145 | .nui-btn, 146 | .nui-tab-hrz .nui-tab { 147 | text-align: center; 148 | } 149 | 150 | /* button-icon, item-icon, tab=icon */ 151 | .nui-btn .nui-icn, 152 | .nui-itm .nui-icn, 153 | .nui-tab .nui-icn { 154 | vertical-align: bottom; 155 | } 156 | 157 | /* dialog, list */ 158 | .nui-dlg, 159 | .nui-lst { 160 | background-color: #fff; 161 | background-color: rgba(255,255,255,0.9); 162 | border: 1px solid #ccc; 163 | -webkit-box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.5); 164 | -moz-box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.5); 165 | -ms-box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.5); 166 | -o-box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.5); 167 | box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.5); 168 | z-index: +1; 169 | } 170 | 171 | /* dialog */ 172 | .nui-dlg { 173 | padding: 0.6em; 174 | } 175 | 176 | /* dialog-icon-X */ 177 | .nui-dlg .nui-icn[aria-label=X] { 178 | right: -11px; 179 | top: -11px; 180 | } 181 | 182 | /* drawer-button, item, tabs-vertical */ 183 | .nui-drw .nui-btn, 184 | .nui-itm, 185 | .nui-tab-vrt .nui-tab { 186 | display: block; 187 | } 188 | 189 | /* drawer-button, item, list */ 190 | .nui-drw .nui-btn, 191 | .nui-itm, 192 | .nui-lst { 193 | text-align: left; 194 | } 195 | 196 | /* drawer-button */ 197 | .nui-drw .nui-btn { 198 | padding-left: 0; 199 | } 200 | 201 | /* drawer-button.select */ 202 | .nui-drw .nui-btn.nui-slc, 203 | .nui-tab-vrt .nui-tab:first-child { 204 | -webkit-border-radius: 0.4em 0.4em 0 0; 205 | -moz-border-radius: 0.4em 0.4em 0 0; 206 | border-radius: 0.4em 0.4em 0 0; 207 | } 208 | 209 | /* icon */ 210 | .nui-icn { 211 | height: 1em; 212 | vertical-align: middle; 213 | width: 1em; 214 | } 215 | 216 | /* icon */ 217 | .nui-icn g { 218 | fill: #333; 219 | stroke: #333; 220 | } 221 | 222 | /* icon-X, item.hover, select */ 223 | .nui-icn[aria-label=X] polygon, 224 | .nui-itm.nui-hvr g, 225 | .nui-slc g { 226 | fill: #fff; 227 | } 228 | 229 | /* icon-X, star */ 230 | .nui-icn[aria-label=X] circle, 231 | .nui-str g { 232 | stroke: #ccc; 233 | } 234 | 235 | /* icon-X */ 236 | .nui-icn[aria-label=X] { 237 | height: 22px; 238 | width: 22px; 239 | } 240 | 241 | 242 | /* item, star */ 243 | .nui-itm, 244 | .nui-str { 245 | background: none; 246 | border: none; 247 | } 248 | 249 | /* list, rating, tabs-horizontal, tabs-vertical */ 250 | .nui-lst, 251 | .nui-rtn, 252 | .nui-tab-hrz, 253 | .nui-tab-vrt { 254 | white-space: nowrap; 255 | } 256 | 257 | /* list */ 258 | .nui-lst { 259 | padding: 0.6em 0; 260 | } 261 | 262 | /* rule */ 263 | .nui-rul { 264 | border-top: 1px solid #ccc; 265 | margin: 0.2em 0 0.4em 0; 266 | } 267 | 268 | /* slider-button, slider-groove, slider-level */ 269 | .nui-sld-btn, 270 | .nui-sld-grv, 271 | .nui-sld-lvl { 272 | -webkit-border-radius: 9px; 273 | -moz-border-radius: 9px; 274 | border-radius: 9px; 275 | } 276 | 277 | /* slider-button, star */ 278 | .nui-sld-btn, 279 | .nui-str { 280 | padding: 0; 281 | } 282 | 283 | /* slider-button, slider-track, star-icon */ 284 | .nui-sld-btn, 285 | .nui-sld-trk, 286 | .nui-str .nui-icn { 287 | height: 18px; 288 | } 289 | 290 | /* slider-button, star-icon */ 291 | .nui-sld-btn, 292 | .nui-str .nui-icn { 293 | width: 18px; 294 | } 295 | 296 | /* slider-groove, slider-level */ 297 | .nui-sld-grv, 298 | .nui-sld-lvl { 299 | height: 4px; 300 | } 301 | 302 | /* slider-groove, select */ 303 | .nui-sld-grv, 304 | .nui-slc { 305 | background-image: -webkit-gradient(linear, left top, left bottom, colorstop(0, rgba(0,0,0,0.3)), colorstop(0.5, rgba(0,0,0,0)), colorstop(0.5, rgba(255,255,255,0)), colorstop(1, rgba(255,255,255,0.1))); 306 | background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0.1) 100%); 307 | background-image: -moz-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0.1) 100%); 308 | background-image: -ms-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0.1) 100%); 309 | background-image: -o-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0.1) 100%); 310 | } 311 | 312 | /* slider-groove */ 313 | .nui-sld-grv { 314 | background-color: #999; 315 | left: 9px; 316 | right: 9px; 317 | top: 5px; 318 | } 319 | 320 | /* slider-title */ 321 | .nui-sld-ttl { 322 | font-weight: bold; 323 | } 324 | 325 | /* star */ 326 | .nui-str g { 327 | fill: #eee; 328 | } 329 | 330 | /* tabs-horizontal */ 331 | .nui-tab-hrz .nui-tab { 332 | border-left-style: none; 333 | } 334 | 335 | /* tab-first */ 336 | .nui-tab-hrz .nui-tab:first-child { 337 | border-left-style: solid; 338 | -webkit-border-radius: 0.4em 0 0 0.4em; 339 | -moz-border-radius: 0.4em 0 0 0.4em; 340 | border-radius: 0.4em 0 0 0.4em; 341 | } 342 | 343 | /* tab-last */ 344 | .nui-tab-hrz .nui-tab:last-child { 345 | -webkit-border-radius: 0 0.4em 0.4em 0; 346 | -moz-border-radius: 0 0.4em 0.4em 0; 347 | border-radius: 0 0.4em 0.4em 0; 348 | } 349 | 350 | /* tabs-vertical */ 351 | .nui-tab-vrt .nui-tab { 352 | border-top-style: none; 353 | display: block; 354 | width: 100%; 355 | } 356 | 357 | /* tab-first */ 358 | .nui-tab-vrt .nui-tab:first-child { 359 | border-top-style: solid; 360 | } 361 | 362 | /* tab-last */ 363 | .nui-tab-vrt .nui-tab:last-child, 364 | .nui-try { 365 | -webkit-border-radius: 0 0 0.4em 0.4em; 366 | -moz-border-radius: 0 0 0.4em 0.4em; 367 | border-radius: 0 0 0.4em 0.4em; 368 | } 369 | 370 | /* tray */ 371 | .nui-try { 372 | border-bottom-color: #ccc; 373 | border-top-style: none; 374 | } 375 | 376 | /* 377 | State changes, keep these last and in order! 378 | */ 379 | 380 | /* item.hover, select, slider-level */ 381 | .nui-itm.nui-hvr, 382 | .nui-slc, 383 | .nui-sld-lvl { 384 | background-color: #06c; 385 | } 386 | 387 | /* item.hover, select */ 388 | .nui-itm.nui-hvr, 389 | .nui-slc { 390 | border-color: #06c; 391 | color: #fff; 392 | text-shadow: 0 -1px 1px #06c; 393 | } 394 | 395 | /* item.hover, select */ 396 | .nui-itm.nui-hvr g, 397 | .nui-slc g { 398 | stroke: #fff; 399 | } 400 | 401 | /* placeholder */ 402 | .nui-plc { 403 | color: #999; 404 | } 405 | 406 | /* slider-button.select */ 407 | .nui-sld-btn.nui-slc { 408 | background-color: #ccc; 409 | border-color: #999; 410 | } 411 | 412 | /* star.average */ 413 | .nui-str.nui-avg g { 414 | fill: #666; 415 | } 416 | 417 | /* star.individual */ 418 | .nui-str.nui-ind g { 419 | fill: #06c; 420 | stroke: #039; 421 | } 422 | 423 | /* disable */ 424 | .nui-dsb, 425 | .nui-tab.nui-slc { 426 | cursor: default; 427 | } 428 | 429 | img[aria-label=spin] { 430 | -webkit-animation: spin 1.5s infinite linear; 431 | -moz-animation: spin 1.5s infinite linear; 432 | -o-animation: spin 1.5s infinite linear; 433 | -ms-animation: spin 1.5s infinite linear; 434 | } 435 | @-webkit-keyframes spin { 436 | 0% { 437 | -webkit-transform: rotate(0deg); 438 | } 439 | 100% { 440 | -webkit-transform: rotate(360deg); 441 | } 442 | } 443 | @-moz-keyframes spin { 444 | 0% { 445 | -moz-transform: rotate(0deg); 446 | } 447 | 100% { 448 | -moz-transform: rotate(360deg); 449 | } 450 | } 451 | @-o-keyframes spin { 452 | 0% { 453 | -o-transform: rotate(0deg); 454 | } 455 | 100% { 456 | -o-transform: rotate(360deg); 457 | } 458 | } 459 | @-ms-keyframes spin { 460 | 0% { 461 | -ms-transform: rotate(0deg); 462 | } 463 | 100% { 464 | -ms-transform: rotate(360deg); 465 | } 466 | } 467 | -------------------------------------------------------------------------------- /src/ninjaui.js: -------------------------------------------------------------------------------- 1 | /*! 2 | Ninja User Interface jQuery Plugin vdevelopment 3 | http://ninjaui.com/ 4 | Copyright 2008-2012 Jamie Hoover 5 | Licensed per the terms of the Apache License v2.0 6 | http://ninjaui.com/#license 7 | */ 8 | 9 | /*jshint bitwise: true, browser: true, curly: true, eqeqeq: true, forin: true, immed: true, indent: 2, jquery: true, maxerr: 3, newcap: true, noarg: true, noempty: true, nomen: true, nonew: true, onevar: true, plusplus: false, regexp: true, strict: true, undef: true, white: true*/ 10 | 11 | /*globals XMLSerializer*/ 12 | 13 | (function ($, window, document, undefined) { 14 | 15 | 'use strict'; 16 | 17 | var 18 | defaults, 19 | keyCodes, 20 | methods, 21 | objects, 22 | svg, 23 | svgInline, 24 | svgInlineMaskMissing, 25 | svgNamespace = 'http://www.w3.org/2000/svg', 26 | then, 27 | version = $.fn.jquery.split('.'), 28 | versionMinor = parseFloat(version[1]), 29 | versionIncrement = parseFloat(version[2] || '0'), 30 | $test = $('
').appendTo('body'); 31 | 32 | if (versionMinor === 4 && versionIncrement < 3 || versionMinor < 4) { 33 | $.error('Ninja UI requires jQuery 1.4.3 or higher.'); 34 | } 35 | 36 | $('', { 37 | rel: 'stylesheet', 38 | href: '../src/ninjaui.css' 39 | }).prependTo('head'); 40 | 41 | $test.html(''); 42 | svgInline = ($test.find('svg')[0] && $test.find('svg')[0].namespaceURI) === svgNamespace; 43 | if (svgInline) { 44 | svg = true; 45 | if ($.browser.safari) { 46 | svgInlineMaskMissing = $.browser.version < 535; 47 | } 48 | } else { 49 | svg = !!document.createElementNS && !!document.createElementNS(svgNamespace, 'svg').createSVGRect; 50 | } 51 | $test.remove(); 52 | 53 | keyCodes = { 54 | tab: 9, 55 | enter: 13, 56 | escape: 27, 57 | arrowLeft: 37, 58 | arrowUp: 38, 59 | arrowRight: 39, 60 | arrowDown: 40 61 | }; 62 | 63 | function isKey(event, name) { 64 | return event.keyCode === keyCodes[name]; 65 | } 66 | 67 | function inKeys(event, names) { 68 | var codes = $.map(names, function (name, i) { 69 | return keyCodes[name]; 70 | }); 71 | return $.inArray(event.keyCode, codes) > -1; 72 | } 73 | 74 | then = $.now(); 75 | 76 | function uniqueId() { 77 | return then ++; 78 | } 79 | 80 | methods = { 81 | 82 | attach: function (callback) { 83 | return this.each(function () { 84 | var $object = $(this).ninja(); 85 | if ($.isFunction(callback)) { 86 | $object.bind('attach.ninja', callback); 87 | } else { 88 | $object.trigger('attach.ninja'); 89 | } 90 | }); 91 | }, 92 | 93 | delist: function (callback) { 94 | return this.each(function () { 95 | var $object = $(this).ninja(); 96 | if ($.isFunction(callback)) { 97 | $object.bind('delist.ninja', callback); 98 | } else { 99 | $object.trigger('delist.ninja'); 100 | } 101 | }); 102 | }, 103 | 104 | deselect: function (callback) { 105 | return this.each(function () { 106 | var $object = $(this).ninja(); 107 | if ($.isFunction(callback)) { 108 | $object.bind('deselect.ninja', callback); 109 | } else if ($object.is('.nui-slc') && !$object.is('.nui-dsb')) { 110 | $object.trigger('deselect.ninja'); 111 | } 112 | }); 113 | }, 114 | 115 | detach: function (callback) { 116 | return this.each(function () { 117 | var $object = $(this).ninja(); 118 | if ($.isFunction(callback)) { 119 | $object.bind('detach.ninja', callback); 120 | } else { 121 | $object.trigger('detach.ninja'); 122 | $.fn.detach.apply($object); 123 | } 124 | }); 125 | }, 126 | 127 | disable: function (callback) { 128 | return this.each(function () { 129 | var $object = $(this).ninja(); 130 | if ($.isFunction(callback)) { 131 | $object.bind('disable.ninja', callback); 132 | } else { 133 | $object.fadeTo('fast', 0.5).addClass('nui-dsb').trigger('disable.ninja'); 134 | } 135 | }); 136 | }, 137 | 138 | enable: function (callback) { 139 | return this.each(function () { 140 | var $object = $(this).ninja(); 141 | if ($.isFunction(callback)) { 142 | $object.bind('enable.ninja', callback); 143 | } else { 144 | $object.fadeTo('fast', 1).removeClass('nui-dsb').trigger('enable.ninja'); 145 | } 146 | }); 147 | }, 148 | 149 | list: function (options) { 150 | return this.each(function () { 151 | options = $.extend({}, defaults, options); 152 | var 153 | $hover = null, 154 | $object = $(this).ninja(), 155 | $button = $object.find('button'), 156 | $input = $object.find('input'), 157 | $list = $('
', { 158 | 'class': 'nui-lst' 159 | }); 160 | if ($object.is('.nui-atc')) { 161 | $object.find('.nui-icn[aria-label=spin]').hide(); 162 | } 163 | if (options.values.length) { 164 | $object.bind({ 165 | 'delist.ninja': function () { 166 | $(document).unbind('click.ninja keydown.ninja keyup.ninja'); 167 | $list.detach(); 168 | if ($hover) { 169 | $hover.removeClass('nui-hvr'); 170 | } 171 | } 172 | }); 173 | $object.append($list); 174 | $(document).bind({ 175 | 'keydown.ninja': function (event) { 176 | if (inKeys(event, ['arrowDown', 'arrowUp', 'tab'])) { 177 | event.preventDefault(); 178 | } 179 | }, 180 | 'keyup.ninja': function (event) { 181 | if (inKeys(event, ['arrowDown', 'arrowUp', 'enter', 'escape', 'tab'])) { 182 | if (isKey(event, 'enter')) { 183 | if ($hover) { 184 | $hover.click(); 185 | } 186 | } else if (isKey(event, 'escape')) { 187 | $object.delist(); 188 | } else if (inKeys(event, ['arrowDown', 'tab']) && !event.shiftKey) { 189 | if ($hover) { 190 | if ($hover.nextAll('.nui-itm').length) { 191 | $hover.nextAll('.nui-itm:first').trigger('mouseenter.ninja'); 192 | } else { 193 | $list.find('.nui-itm:first').trigger('mouseenter.ninja'); 194 | } 195 | } else { 196 | $list.find('.nui-itm:first').trigger('mouseenter.ninja'); 197 | } 198 | } else if (isKey(event, 'arrowUp') || (event.shiftKey && isKey(event, 'tab'))) { 199 | if ($hover) { 200 | if ($hover.prevAll('.nui-itm').length) { 201 | $hover.prevAll('.nui-itm:first').trigger('mouseenter.ninja'); 202 | } else { 203 | $list.find('.nui-itm:last').trigger('mouseenter.ninja'); 204 | } 205 | } else { 206 | $list.find('.nui-itm:last').trigger('mouseenter.ninja'); 207 | } 208 | } 209 | return false; 210 | } 211 | }, 212 | 'click.ninja': function (event) { 213 | $object.delist(); 214 | } 215 | }); 216 | if (options.query) { 217 | options.values = $.map(options.values, function (item) { 218 | item.value = item.value || item.html || item; 219 | if (item.html) { 220 | item.html = item.html.toString().replace(new RegExp(options.query, 'gi'), '' + options.query + ''); 221 | } 222 | return item; 223 | }); 224 | } 225 | $.each(options.values, function (i, value) { 226 | var $value; 227 | if (value.rule) { 228 | $value = $('
', { 229 | 'class': 'nui-rul' 230 | }); 231 | } else { 232 | $value = $('