├── .gitignore ├── LICENSE ├── README.md ├── css ├── bootstrap │ ├── bootstrap-switch.css │ ├── bootstrap-theme.css │ ├── bootstrap-theme.css.map │ ├── bootstrap-theme.min.css │ ├── bootstrap.css │ ├── bootstrap.css.map │ └── bootstrap.min.css ├── fonts │ ├── .DS_Store │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── intro │ └── intro.min.css ├── please-wait │ └── please-wait.css └── style.css ├── docs ├── animate1.gif ├── animate2.gif ├── animate3.gif ├── how-to-2.png ├── how-to-3.gif ├── how-to-4.gif ├── how-to-5.gif ├── how-to-6.gif └── how-to-7.gif ├── examples ├── Health.zip ├── Radial - Single Arc.zip └── Radial - Triple Arc.zip ├── index.html └── js ├── bootstrap ├── bootstrap-switch.min.js ├── bootstrap.js └── bootstrap.min.js ├── excanvas.js ├── filesaver ├── FileSaver.js └── FileSaver.min.js ├── intro └── intro.min.js ├── jquery └── jquery.min.js ├── jscolor ├── .DS_Store ├── arrow.gif ├── cross.gif ├── hs.png ├── hv.png └── jscolor.js ├── jszip └── jszip.min.js ├── knob └── jquery.knob.js ├── main.js ├── npm.js ├── options.js └── please-wait ├── .DS_Store ├── please-wait.js └── please-wait.min.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Hitesh Maidasani 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # RadialChartImageGenerator 2 | A simple tool that generates images for animating radial or circular progress charts for the Apple Watch and WatchKit. The charts are referred to as rings, dials, radials or circles. 3 | 4 | ![animation1](docs/animate1.gif) ![animation2](docs/animate2.gif) ![animation3](docs/animate3.gif) 5 | 6 | ## Overview 7 | 8 | #### Why care about radial progress charts? 9 | * Clearly, Apple likes radial progress charts which are used in their activity monitor health watch app ([Apple Health & Fitness Watch App](https://www.apple.com/watch/health-and-fitness/)). 10 | 11 | * Radial charts are just the right way to display a large amount of data on such a small screen size. 12 | 13 | * We as humans have been trained to read radial progress charts from a very young age - clocks. That's why it makes a lot of sense to use them on a watch. 14 | 15 | #### Why use the RadialChartImageGenerator? 16 | 17 | * The Apple WatchKit SDK does not have a built-in tool or library to create these charts or any visualization. 18 | 19 | * The way Apple WatchKit SDK allows animations or visualizations is to use a sequence of static images ([WatchKit Design Guidelines](https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/WatchHumanInterfaceGuidelines/Animation.html#//apple_ref/doc/uid/TP40014992-CH7-SW1)). In fact, Apple's own WatchKit sample app called [Lister](https://developer.apple.com/library/prerelease/ios/samplecode/Lister/Introduction/Intro.html) does animations of this radial progress chart using 360 different static images of the chart. The reason for this is that drawing pixels or shapes would require a lot of computation and drain the battery of the watch. So, good luck creating hundreds of images by yourself. 20 | 21 | * The RadialChartImageGenerator comes in to the rescue. With a few clicks, you can select whether you want a single, double, or triple arc radial chart (images shown above), customize the colors and text, and choose how many values or capacity the chart should have. The generator will finally generate every permutation of the radial progress chart and download a zip file with all the images. The alternative is to create these images manually in an image editor program like Photoshop, which would require a lot of effort and time. The RadialChartImageGenerator is a very simple tool that saves so much time with minimal effort. 22 | 23 | ## How To Use 24 | 25 | #### Instructions 26 | 27 | 1. Go to http://hmaidasani.github.io/RadialChartImageGenerator/ or open index.html (Chrome and Firefox recommended). 28 | 29 | 2. Decide on whether you need a single, double, or triple arc radial chart. 30 | ![animation1](docs/how-to-2.png) 31 | 32 | 3. Choose the max value or the capacity of the appropriate arc. 33 | ![animation2](docs/how-to-3.gif) 34 | 35 | 4. Choose the arc background color. 36 | ![animation3](docs/how-to-4.gif) 37 | 38 | 5. Decide the color scheme for each appropriate arc. If you would like a gradient color scheme, choose three different colors for the foreground start, mid, and end colors. In order to see how this looks, choose the current value to be equal to the max value to see the full arc gradient. **Note: the current value has no effect on the output of the images - it is merely there to see how the arc would look at a given value.** 39 | ![animation4](docs/how-to-5.gif) 40 | 41 | 6. For the single arc, you may select if text should appear in the center. You may also select the text color and the units of the subtext. 42 | ![animation5](docs/how-to-6.gif) 43 | 44 | 7. Once you have modified each arc to your preference, click the Generate Images button to generate each permutation of images for the given arc structure. Enter the filename prefix of your choice and click on Continue. The double and triple arcs images can optionally be merged to have all the arc layers combined into a single image. The preferred method is to download the arc layers separately. 45 | ![animation6](docs/how-to-7.gif) 46 | 47 | 8. The images should download in a zip file. 48 | 49 | 9. Repeat for all the other arcs if needed. 50 | 51 | 10. Import the downloaded images into your WatchKit Xcode project. The below example projects show how this is done. 52 | 53 | #### Examples 54 | 55 | Here are some sample WatchKit apps using the images generated using the RadialChartImageGenerator. Note: the most recent version of Xcode is required to run these. 56 | 57 | * Simple single arc app - [Radial - Single Arc.zip](https://github.com/hmaidasani/RadialChartImageGenerator/blob/master/examples/Radial%20-%20Single%20Arc.zip?raw=true) 58 | 59 | * Simple triple arc app - [Radial - Triple Arc.zip](https://github.com/hmaidasani/RadialChartImageGenerator/blob/master/examples/Radial%20-%20Triple%20Arc.zip?raw=true) 60 | 61 | * Health and Activity app - [Health.zip](https://github.com/hmaidasani/RadialChartImageGenerator/blob/master/examples/Health.zip?raw=true) 62 | 63 | ## Questions & Feature Requests 64 | 65 | Report all of your questions and feature requests to the issues section of git repository. 66 | -------------------------------------------------------------------------------- /css/bootstrap/bootstrap-switch.css: -------------------------------------------------------------------------------- 1 | /* ======================================================================== 2 | * bootstrap-switch - v3.3.2 3 | * http://www.bootstrap-switch.org 4 | * ======================================================================== 5 | * Copyright 2012-2013 Mattia Larentis 6 | * 7 | * ======================================================================== 8 | * Licensed under the Apache License, Version 2.0 (the "License"); 9 | * you may not use this file except in compliance with the License. 10 | * You may obtain a copy of the License at 11 | * 12 | * http://www.apache.org/licenses/LICENSE-2.0 13 | * 14 | * Unless required by applicable law or agreed to in writing, software 15 | * distributed under the License is distributed on an "AS IS" BASIS, 16 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 17 | * See the License for the specific language governing permissions and 18 | * limitations under the License. 19 | * ======================================================================== 20 | */ 21 | 22 | .bootstrap-switch { 23 | display: inline-block; 24 | direction: ltr; 25 | cursor: pointer; 26 | border-radius: 4px; 27 | border: 1px solid; 28 | border-color: #cccccc; 29 | position: relative; 30 | text-align: left; 31 | overflow: hidden; 32 | line-height: 8px; 33 | z-index: 0; 34 | -webkit-user-select: none; 35 | -moz-user-select: none; 36 | -ms-user-select: none; 37 | user-select: none; 38 | vertical-align: middle; 39 | -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 40 | transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 41 | } 42 | .bootstrap-switch .bootstrap-switch-container { 43 | display: inline-block; 44 | top: 0; 45 | border-radius: 4px; 46 | -webkit-transform: translate3d(0, 0, 0); 47 | transform: translate3d(0, 0, 0); 48 | } 49 | .bootstrap-switch .bootstrap-switch-handle-on, 50 | .bootstrap-switch .bootstrap-switch-handle-off, 51 | .bootstrap-switch .bootstrap-switch-label { 52 | -webkit-box-sizing: border-box; 53 | -moz-box-sizing: border-box; 54 | box-sizing: border-box; 55 | cursor: pointer; 56 | display: inline-block !important; 57 | height: 100%; 58 | padding: 6px 12px; 59 | font-size: 14px; 60 | line-height: 20px; 61 | } 62 | .bootstrap-switch .bootstrap-switch-handle-on, 63 | .bootstrap-switch .bootstrap-switch-handle-off { 64 | text-align: center; 65 | z-index: 1; 66 | } 67 | .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, 68 | .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary { 69 | color: #fff; 70 | background: #428bca; 71 | } 72 | .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info, 73 | .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info { 74 | color: #fff; 75 | background: #5bc0de; 76 | } 77 | .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success, 78 | .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success { 79 | color: #fff; 80 | background: #5cb85c; 81 | } 82 | .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning, 83 | .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning { 84 | background: #f0ad4e; 85 | color: #fff; 86 | } 87 | .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger, 88 | .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger { 89 | color: #fff; 90 | background: #d9534f; 91 | } 92 | .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default, 93 | .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default { 94 | color: #000; 95 | background: #eeeeee; 96 | } 97 | .bootstrap-switch .bootstrap-switch-label { 98 | text-align: center; 99 | margin-top: -1px; 100 | margin-bottom: -1px; 101 | z-index: 100; 102 | color: #333333; 103 | background: #ffffff; 104 | } 105 | .bootstrap-switch .bootstrap-switch-handle-on { 106 | border-bottom-left-radius: 3px; 107 | border-top-left-radius: 3px; 108 | } 109 | .bootstrap-switch .bootstrap-switch-handle-off { 110 | border-bottom-right-radius: 3px; 111 | border-top-right-radius: 3px; 112 | } 113 | .bootstrap-switch input[type='radio'], 114 | .bootstrap-switch input[type='checkbox'] { 115 | position: absolute !important; 116 | top: 0; 117 | left: 0; 118 | opacity: 0; 119 | filter: alpha(opacity=0); 120 | z-index: -1; 121 | } 122 | .bootstrap-switch input[type='radio'].form-control, 123 | .bootstrap-switch input[type='checkbox'].form-control { 124 | height: auto; 125 | } 126 | .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on, 127 | .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off, 128 | .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label { 129 | padding: 1px 5px; 130 | font-size: 12px; 131 | line-height: 1.5; 132 | } 133 | .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on, 134 | .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off, 135 | .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label { 136 | padding: 5px 10px; 137 | font-size: 12px; 138 | line-height: 1.5; 139 | } 140 | .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on, 141 | .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off, 142 | .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label { 143 | padding: 6px 16px; 144 | font-size: 18px; 145 | line-height: 1.33; 146 | } 147 | .bootstrap-switch.bootstrap-switch-disabled, 148 | .bootstrap-switch.bootstrap-switch-readonly, 149 | .bootstrap-switch.bootstrap-switch-indeterminate { 150 | cursor: default !important; 151 | } 152 | .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on, 153 | .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on, 154 | .bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on, 155 | .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off, 156 | .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off, 157 | .bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off, 158 | .bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-label, 159 | .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label, 160 | .bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label { 161 | opacity: 0.5; 162 | filter: alpha(opacity=50); 163 | cursor: default !important; 164 | } 165 | .bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container { 166 | -webkit-transition: margin-left 0.5s; 167 | transition: margin-left 0.5s; 168 | } 169 | .bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-on { 170 | border-bottom-left-radius: 0; 171 | border-top-left-radius: 0; 172 | border-bottom-right-radius: 3px; 173 | border-top-right-radius: 3px; 174 | } 175 | .bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-off { 176 | border-bottom-right-radius: 0; 177 | border-top-right-radius: 0; 178 | border-bottom-left-radius: 3px; 179 | border-top-left-radius: 3px; 180 | } 181 | .bootstrap-switch.bootstrap-switch-focused { 182 | border-color: #66afe9; 183 | outline: 0; 184 | -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); 185 | box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); 186 | } 187 | .bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label, 188 | .bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-off .bootstrap-switch-label { 189 | border-bottom-right-radius: 3px; 190 | border-top-right-radius: 3px; 191 | } 192 | .bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label, 193 | .bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label { 194 | border-bottom-left-radius: 3px; 195 | border-top-left-radius: 3px; 196 | } 197 | -------------------------------------------------------------------------------- /css/bootstrap/bootstrap-theme.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.3.1 (http://getbootstrap.com) 3 | * Copyright 2011-2014 Twitter, Inc. 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 5 | */ 6 | 7 | .btn-default, 8 | .btn-primary, 9 | .btn-success, 10 | .btn-info, 11 | .btn-warning, 12 | .btn-danger { 13 | text-shadow: 0 -1px 0 rgba(0, 0, 0, .2); 14 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); 15 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); 16 | } 17 | .btn-default:active, 18 | .btn-primary:active, 19 | .btn-success:active, 20 | .btn-info:active, 21 | .btn-warning:active, 22 | .btn-danger:active, 23 | .btn-default.active, 24 | .btn-primary.active, 25 | .btn-success.active, 26 | .btn-info.active, 27 | .btn-warning.active, 28 | .btn-danger.active { 29 | -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 30 | box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 31 | } 32 | .btn-default .badge, 33 | .btn-primary .badge, 34 | .btn-success .badge, 35 | .btn-info .badge, 36 | .btn-warning .badge, 37 | .btn-danger .badge { 38 | text-shadow: none; 39 | } 40 | .btn:active, 41 | .btn.active { 42 | background-image: none; 43 | } 44 | .btn-default { 45 | text-shadow: 0 1px 0 #fff; 46 | background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%); 47 | background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%); 48 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0)); 49 | background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%); 50 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0); 51 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 52 | background-repeat: repeat-x; 53 | border-color: #dbdbdb; 54 | border-color: #ccc; 55 | } 56 | .btn-default:hover, 57 | .btn-default:focus { 58 | background-color: #e0e0e0; 59 | background-position: 0 -15px; 60 | } 61 | .btn-default:active, 62 | .btn-default.active { 63 | background-color: #e0e0e0; 64 | border-color: #dbdbdb; 65 | } 66 | .btn-default:disabled, 67 | .btn-default[disabled] { 68 | background-color: #e0e0e0; 69 | background-image: none; 70 | } 71 | .btn-primary { 72 | background-image: -webkit-linear-gradient(top, #337ab7 0%, #265a88 100%); 73 | background-image: -o-linear-gradient(top, #337ab7 0%, #265a88 100%); 74 | background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#265a88)); 75 | background-image: linear-gradient(to bottom, #337ab7 0%, #265a88 100%); 76 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0); 77 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 78 | background-repeat: repeat-x; 79 | border-color: #245580; 80 | } 81 | .btn-primary:hover, 82 | .btn-primary:focus { 83 | background-color: #265a88; 84 | background-position: 0 -15px; 85 | } 86 | .btn-primary:active, 87 | .btn-primary.active { 88 | background-color: #265a88; 89 | border-color: #245580; 90 | } 91 | .btn-primary:disabled, 92 | .btn-primary[disabled] { 93 | background-color: #265a88; 94 | background-image: none; 95 | } 96 | .btn-success { 97 | background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%); 98 | background-image: -o-linear-gradient(top, #5cb85c 0%, #419641 100%); 99 | background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641)); 100 | background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%); 101 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0); 102 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 103 | background-repeat: repeat-x; 104 | border-color: #3e8f3e; 105 | } 106 | .btn-success:hover, 107 | .btn-success:focus { 108 | background-color: #419641; 109 | background-position: 0 -15px; 110 | } 111 | .btn-success:active, 112 | .btn-success.active { 113 | background-color: #419641; 114 | border-color: #3e8f3e; 115 | } 116 | .btn-success:disabled, 117 | .btn-success[disabled] { 118 | background-color: #419641; 119 | background-image: none; 120 | } 121 | .btn-info { 122 | background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%); 123 | background-image: -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%); 124 | background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2)); 125 | background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%); 126 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0); 127 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 128 | background-repeat: repeat-x; 129 | border-color: #28a4c9; 130 | } 131 | .btn-info:hover, 132 | .btn-info:focus { 133 | background-color: #2aabd2; 134 | background-position: 0 -15px; 135 | } 136 | .btn-info:active, 137 | .btn-info.active { 138 | background-color: #2aabd2; 139 | border-color: #28a4c9; 140 | } 141 | .btn-info:disabled, 142 | .btn-info[disabled] { 143 | background-color: #2aabd2; 144 | background-image: none; 145 | } 146 | .btn-warning { 147 | background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%); 148 | background-image: -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%); 149 | background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316)); 150 | background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%); 151 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0); 152 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 153 | background-repeat: repeat-x; 154 | border-color: #e38d13; 155 | } 156 | .btn-warning:hover, 157 | .btn-warning:focus { 158 | background-color: #eb9316; 159 | background-position: 0 -15px; 160 | } 161 | .btn-warning:active, 162 | .btn-warning.active { 163 | background-color: #eb9316; 164 | border-color: #e38d13; 165 | } 166 | .btn-warning:disabled, 167 | .btn-warning[disabled] { 168 | background-color: #eb9316; 169 | background-image: none; 170 | } 171 | .btn-danger { 172 | background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%); 173 | background-image: -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%); 174 | background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a)); 175 | background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%); 176 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0); 177 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 178 | background-repeat: repeat-x; 179 | border-color: #b92c28; 180 | } 181 | .btn-danger:hover, 182 | .btn-danger:focus { 183 | background-color: #c12e2a; 184 | background-position: 0 -15px; 185 | } 186 | .btn-danger:active, 187 | .btn-danger.active { 188 | background-color: #c12e2a; 189 | border-color: #b92c28; 190 | } 191 | .btn-danger:disabled, 192 | .btn-danger[disabled] { 193 | background-color: #c12e2a; 194 | background-image: none; 195 | } 196 | .thumbnail, 197 | .img-thumbnail { 198 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 199 | box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 200 | } 201 | .dropdown-menu > li > a:hover, 202 | .dropdown-menu > li > a:focus { 203 | background-color: #e8e8e8; 204 | background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); 205 | background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); 206 | background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8)); 207 | background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%); 208 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0); 209 | background-repeat: repeat-x; 210 | } 211 | .dropdown-menu > .active > a, 212 | .dropdown-menu > .active > a:hover, 213 | .dropdown-menu > .active > a:focus { 214 | background-color: #2e6da4; 215 | background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%); 216 | background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%); 217 | background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4)); 218 | background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%); 219 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0); 220 | background-repeat: repeat-x; 221 | } 222 | .navbar-default { 223 | background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%); 224 | background-image: -o-linear-gradient(top, #fff 0%, #f8f8f8 100%); 225 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f8f8f8)); 226 | background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%); 227 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0); 228 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 229 | background-repeat: repeat-x; 230 | border-radius: 4px; 231 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); 232 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); 233 | } 234 | .navbar-default .navbar-nav > .open > a, 235 | .navbar-default .navbar-nav > .active > a { 236 | background-image: -webkit-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%); 237 | background-image: -o-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%); 238 | background-image: -webkit-gradient(linear, left top, left bottom, from(#dbdbdb), to(#e2e2e2)); 239 | background-image: linear-gradient(to bottom, #dbdbdb 0%, #e2e2e2 100%); 240 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0); 241 | background-repeat: repeat-x; 242 | -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075); 243 | box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075); 244 | } 245 | .navbar-brand, 246 | .navbar-nav > li > a { 247 | text-shadow: 0 1px 0 rgba(255, 255, 255, .25); 248 | } 249 | .navbar-inverse { 250 | background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%); 251 | background-image: -o-linear-gradient(top, #3c3c3c 0%, #222 100%); 252 | background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222)); 253 | background-image: linear-gradient(to bottom, #3c3c3c 0%, #222 100%); 254 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0); 255 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 256 | background-repeat: repeat-x; 257 | } 258 | .navbar-inverse .navbar-nav > .open > a, 259 | .navbar-inverse .navbar-nav > .active > a { 260 | background-image: -webkit-linear-gradient(top, #080808 0%, #0f0f0f 100%); 261 | background-image: -o-linear-gradient(top, #080808 0%, #0f0f0f 100%); 262 | background-image: -webkit-gradient(linear, left top, left bottom, from(#080808), to(#0f0f0f)); 263 | background-image: linear-gradient(to bottom, #080808 0%, #0f0f0f 100%); 264 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0); 265 | background-repeat: repeat-x; 266 | -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25); 267 | box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25); 268 | } 269 | .navbar-inverse .navbar-brand, 270 | .navbar-inverse .navbar-nav > li > a { 271 | text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); 272 | } 273 | .navbar-static-top, 274 | .navbar-fixed-top, 275 | .navbar-fixed-bottom { 276 | border-radius: 0; 277 | } 278 | @media (max-width: 767px) { 279 | .navbar .navbar-nav .open .dropdown-menu > .active > a, 280 | .navbar .navbar-nav .open .dropdown-menu > .active > a:hover, 281 | .navbar .navbar-nav .open .dropdown-menu > .active > a:focus { 282 | color: #fff; 283 | background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%); 284 | background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%); 285 | background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4)); 286 | background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%); 287 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0); 288 | background-repeat: repeat-x; 289 | } 290 | } 291 | .alert { 292 | text-shadow: 0 1px 0 rgba(255, 255, 255, .2); 293 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); 294 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); 295 | } 296 | .alert-success { 297 | background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); 298 | background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); 299 | background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc)); 300 | background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%); 301 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0); 302 | background-repeat: repeat-x; 303 | border-color: #b2dba1; 304 | } 305 | .alert-info { 306 | background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%); 307 | background-image: -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%); 308 | background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0)); 309 | background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%); 310 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0); 311 | background-repeat: repeat-x; 312 | border-color: #9acfea; 313 | } 314 | .alert-warning { 315 | background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%); 316 | background-image: -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%); 317 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0)); 318 | background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%); 319 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0); 320 | background-repeat: repeat-x; 321 | border-color: #f5e79e; 322 | } 323 | .alert-danger { 324 | background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); 325 | background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); 326 | background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3)); 327 | background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%); 328 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0); 329 | background-repeat: repeat-x; 330 | border-color: #dca7a7; 331 | } 332 | .progress { 333 | background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%); 334 | background-image: -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%); 335 | background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5)); 336 | background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%); 337 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0); 338 | background-repeat: repeat-x; 339 | } 340 | .progress-bar { 341 | background-image: -webkit-linear-gradient(top, #337ab7 0%, #286090 100%); 342 | background-image: -o-linear-gradient(top, #337ab7 0%, #286090 100%); 343 | background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#286090)); 344 | background-image: linear-gradient(to bottom, #337ab7 0%, #286090 100%); 345 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0); 346 | background-repeat: repeat-x; 347 | } 348 | .progress-bar-success { 349 | background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%); 350 | background-image: -o-linear-gradient(top, #5cb85c 0%, #449d44 100%); 351 | background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44)); 352 | background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%); 353 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0); 354 | background-repeat: repeat-x; 355 | } 356 | .progress-bar-info { 357 | background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%); 358 | background-image: -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%); 359 | background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5)); 360 | background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%); 361 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0); 362 | background-repeat: repeat-x; 363 | } 364 | .progress-bar-warning { 365 | background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%); 366 | background-image: -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%); 367 | background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f)); 368 | background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%); 369 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0); 370 | background-repeat: repeat-x; 371 | } 372 | .progress-bar-danger { 373 | background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%); 374 | background-image: -o-linear-gradient(top, #d9534f 0%, #c9302c 100%); 375 | background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c)); 376 | background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%); 377 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0); 378 | background-repeat: repeat-x; 379 | } 380 | .progress-bar-striped { 381 | background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); 382 | background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); 383 | background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); 384 | } 385 | .list-group { 386 | border-radius: 4px; 387 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 388 | box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 389 | } 390 | .list-group-item.active, 391 | .list-group-item.active:hover, 392 | .list-group-item.active:focus { 393 | text-shadow: 0 -1px 0 #286090; 394 | background-image: -webkit-linear-gradient(top, #337ab7 0%, #2b669a 100%); 395 | background-image: -o-linear-gradient(top, #337ab7 0%, #2b669a 100%); 396 | background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2b669a)); 397 | background-image: linear-gradient(to bottom, #337ab7 0%, #2b669a 100%); 398 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0); 399 | background-repeat: repeat-x; 400 | border-color: #2b669a; 401 | } 402 | .list-group-item.active .badge, 403 | .list-group-item.active:hover .badge, 404 | .list-group-item.active:focus .badge { 405 | text-shadow: none; 406 | } 407 | .panel { 408 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05); 409 | box-shadow: 0 1px 2px rgba(0, 0, 0, .05); 410 | } 411 | .panel-default > .panel-heading { 412 | background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); 413 | background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); 414 | background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8)); 415 | background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%); 416 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0); 417 | background-repeat: repeat-x; 418 | } 419 | .panel-primary > .panel-heading { 420 | background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%); 421 | background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%); 422 | background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4)); 423 | background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%); 424 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0); 425 | background-repeat: repeat-x; 426 | } 427 | .panel-success > .panel-heading { 428 | background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%); 429 | background-image: -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%); 430 | background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6)); 431 | background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%); 432 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0); 433 | background-repeat: repeat-x; 434 | } 435 | .panel-info > .panel-heading { 436 | background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%); 437 | background-image: -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%); 438 | background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3)); 439 | background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%); 440 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0); 441 | background-repeat: repeat-x; 442 | } 443 | .panel-warning > .panel-heading { 444 | background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%); 445 | background-image: -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%); 446 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc)); 447 | background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%); 448 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0); 449 | background-repeat: repeat-x; 450 | } 451 | .panel-danger > .panel-heading { 452 | background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%); 453 | background-image: -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%); 454 | background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc)); 455 | background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%); 456 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0); 457 | background-repeat: repeat-x; 458 | } 459 | .well { 460 | background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%); 461 | background-image: -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%); 462 | background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5)); 463 | background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%); 464 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0); 465 | background-repeat: repeat-x; 466 | border-color: #dcdcdc; 467 | -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); 468 | box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); 469 | } 470 | /*# sourceMappingURL=bootstrap-theme.css.map */ 471 | -------------------------------------------------------------------------------- /css/bootstrap/bootstrap-theme.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.3.1 (http://getbootstrap.com) 3 | * Copyright 2011-2014 Twitter, Inc. 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 5 | */.btn-default,.btn-primary,.btn-success,.btn-info,.btn-warning,.btn-danger{text-shadow:0 -1px 0 rgba(0,0,0,.2);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 1px rgba(0,0,0,.075)}.btn-default:active,.btn-primary:active,.btn-success:active,.btn-info:active,.btn-warning:active,.btn-danger:active,.btn-default.active,.btn-primary.active,.btn-success.active,.btn-info.active,.btn-warning.active,.btn-danger.active{-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn-default .badge,.btn-primary .badge,.btn-success .badge,.btn-info .badge,.btn-warning .badge,.btn-danger .badge{text-shadow:none}.btn:active,.btn.active{background-image:none}.btn-default{text-shadow:0 1px 0 #fff;background-image:-webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);background-image:-o-linear-gradient(top,#fff 0,#e0e0e0 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));background-image:linear-gradient(to bottom,#fff 0,#e0e0e0 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#dbdbdb;border-color:#ccc}.btn-default:hover,.btn-default:focus{background-color:#e0e0e0;background-position:0 -15px}.btn-default:active,.btn-default.active{background-color:#e0e0e0;border-color:#dbdbdb}.btn-default:disabled,.btn-default[disabled]{background-color:#e0e0e0;background-image:none}.btn-primary{background-image:-webkit-linear-gradient(top,#337ab7 0,#265a88 100%);background-image:-o-linear-gradient(top,#337ab7 0,#265a88 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#337ab7),to(#265a88));background-image:linear-gradient(to bottom,#337ab7 0,#265a88 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#245580}.btn-primary:hover,.btn-primary:focus{background-color:#265a88;background-position:0 -15px}.btn-primary:active,.btn-primary.active{background-color:#265a88;border-color:#245580}.btn-primary:disabled,.btn-primary[disabled]{background-color:#265a88;background-image:none}.btn-success{background-image:-webkit-linear-gradient(top,#5cb85c 0,#419641 100%);background-image:-o-linear-gradient(top,#5cb85c 0,#419641 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#5cb85c),to(#419641));background-image:linear-gradient(to bottom,#5cb85c 0,#419641 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#3e8f3e}.btn-success:hover,.btn-success:focus{background-color:#419641;background-position:0 -15px}.btn-success:active,.btn-success.active{background-color:#419641;border-color:#3e8f3e}.btn-success:disabled,.btn-success[disabled]{background-color:#419641;background-image:none}.btn-info{background-image:-webkit-linear-gradient(top,#5bc0de 0,#2aabd2 100%);background-image:-o-linear-gradient(top,#5bc0de 0,#2aabd2 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#5bc0de),to(#2aabd2));background-image:linear-gradient(to bottom,#5bc0de 0,#2aabd2 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#28a4c9}.btn-info:hover,.btn-info:focus{background-color:#2aabd2;background-position:0 -15px}.btn-info:active,.btn-info.active{background-color:#2aabd2;border-color:#28a4c9}.btn-info:disabled,.btn-info[disabled]{background-color:#2aabd2;background-image:none}.btn-warning{background-image:-webkit-linear-gradient(top,#f0ad4e 0,#eb9316 100%);background-image:-o-linear-gradient(top,#f0ad4e 0,#eb9316 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#f0ad4e),to(#eb9316));background-image:linear-gradient(to bottom,#f0ad4e 0,#eb9316 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#e38d13}.btn-warning:hover,.btn-warning:focus{background-color:#eb9316;background-position:0 -15px}.btn-warning:active,.btn-warning.active{background-color:#eb9316;border-color:#e38d13}.btn-warning:disabled,.btn-warning[disabled]{background-color:#eb9316;background-image:none}.btn-danger{background-image:-webkit-linear-gradient(top,#d9534f 0,#c12e2a 100%);background-image:-o-linear-gradient(top,#d9534f 0,#c12e2a 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#d9534f),to(#c12e2a));background-image:linear-gradient(to bottom,#d9534f 0,#c12e2a 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#b92c28}.btn-danger:hover,.btn-danger:focus{background-color:#c12e2a;background-position:0 -15px}.btn-danger:active,.btn-danger.active{background-color:#c12e2a;border-color:#b92c28}.btn-danger:disabled,.btn-danger[disabled]{background-color:#c12e2a;background-image:none}.thumbnail,.img-thumbnail{-webkit-box-shadow:0 1px 2px rgba(0,0,0,.075);box-shadow:0 1px 2px rgba(0,0,0,.075)}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus{background-color:#e8e8e8;background-image:-webkit-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);background-image:-o-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#f5f5f5),to(#e8e8e8));background-image:linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);background-repeat:repeat-x}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus{background-color:#2e6da4;background-image:-webkit-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-o-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#337ab7),to(#2e6da4));background-image:linear-gradient(to bottom,#337ab7 0,#2e6da4 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);background-repeat:repeat-x}.navbar-default{background-image:-webkit-linear-gradient(top,#fff 0,#f8f8f8 100%);background-image:-o-linear-gradient(top,#fff 0,#f8f8f8 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#f8f8f8));background-image:linear-gradient(to bottom,#fff 0,#f8f8f8 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 5px rgba(0,0,0,.075);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 5px rgba(0,0,0,.075)}.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.active>a{background-image:-webkit-linear-gradient(top,#dbdbdb 0,#e2e2e2 100%);background-image:-o-linear-gradient(top,#dbdbdb 0,#e2e2e2 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#dbdbdb),to(#e2e2e2));background-image:linear-gradient(to bottom,#dbdbdb 0,#e2e2e2 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0);background-repeat:repeat-x;-webkit-box-shadow:inset 0 3px 9px rgba(0,0,0,.075);box-shadow:inset 0 3px 9px rgba(0,0,0,.075)}.navbar-brand,.navbar-nav>li>a{text-shadow:0 1px 0 rgba(255,255,255,.25)}.navbar-inverse{background-image:-webkit-linear-gradient(top,#3c3c3c 0,#222 100%);background-image:-o-linear-gradient(top,#3c3c3c 0,#222 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#3c3c3c),to(#222));background-image:linear-gradient(to bottom,#3c3c3c 0,#222 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x}.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.active>a{background-image:-webkit-linear-gradient(top,#080808 0,#0f0f0f 100%);background-image:-o-linear-gradient(top,#080808 0,#0f0f0f 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#080808),to(#0f0f0f));background-image:linear-gradient(to bottom,#080808 0,#0f0f0f 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0);background-repeat:repeat-x;-webkit-box-shadow:inset 0 3px 9px rgba(0,0,0,.25);box-shadow:inset 0 3px 9px rgba(0,0,0,.25)}.navbar-inverse .navbar-brand,.navbar-inverse .navbar-nav>li>a{text-shadow:0 -1px 0 rgba(0,0,0,.25)}.navbar-static-top,.navbar-fixed-top,.navbar-fixed-bottom{border-radius:0}@media (max-width:767px){.navbar .navbar-nav .open .dropdown-menu>.active>a,.navbar .navbar-nav .open .dropdown-menu>.active>a:hover,.navbar .navbar-nav .open .dropdown-menu>.active>a:focus{color:#fff;background-image:-webkit-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-o-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#337ab7),to(#2e6da4));background-image:linear-gradient(to bottom,#337ab7 0,#2e6da4 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);background-repeat:repeat-x}}.alert{text-shadow:0 1px 0 rgba(255,255,255,.2);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 2px rgba(0,0,0,.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 2px rgba(0,0,0,.05)}.alert-success{background-image:-webkit-linear-gradient(top,#dff0d8 0,#c8e5bc 100%);background-image:-o-linear-gradient(top,#dff0d8 0,#c8e5bc 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#dff0d8),to(#c8e5bc));background-image:linear-gradient(to bottom,#dff0d8 0,#c8e5bc 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);background-repeat:repeat-x;border-color:#b2dba1}.alert-info{background-image:-webkit-linear-gradient(top,#d9edf7 0,#b9def0 100%);background-image:-o-linear-gradient(top,#d9edf7 0,#b9def0 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#d9edf7),to(#b9def0));background-image:linear-gradient(to bottom,#d9edf7 0,#b9def0 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);background-repeat:repeat-x;border-color:#9acfea}.alert-warning{background-image:-webkit-linear-gradient(top,#fcf8e3 0,#f8efc0 100%);background-image:-o-linear-gradient(top,#fcf8e3 0,#f8efc0 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fcf8e3),to(#f8efc0));background-image:linear-gradient(to bottom,#fcf8e3 0,#f8efc0 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);background-repeat:repeat-x;border-color:#f5e79e}.alert-danger{background-image:-webkit-linear-gradient(top,#f2dede 0,#e7c3c3 100%);background-image:-o-linear-gradient(top,#f2dede 0,#e7c3c3 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#f2dede),to(#e7c3c3));background-image:linear-gradient(to bottom,#f2dede 0,#e7c3c3 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);background-repeat:repeat-x;border-color:#dca7a7}.progress{background-image:-webkit-linear-gradient(top,#ebebeb 0,#f5f5f5 100%);background-image:-o-linear-gradient(top,#ebebeb 0,#f5f5f5 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#ebebeb),to(#f5f5f5));background-image:linear-gradient(to bottom,#ebebeb 0,#f5f5f5 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);background-repeat:repeat-x}.progress-bar{background-image:-webkit-linear-gradient(top,#337ab7 0,#286090 100%);background-image:-o-linear-gradient(top,#337ab7 0,#286090 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#337ab7),to(#286090));background-image:linear-gradient(to bottom,#337ab7 0,#286090 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0);background-repeat:repeat-x}.progress-bar-success{background-image:-webkit-linear-gradient(top,#5cb85c 0,#449d44 100%);background-image:-o-linear-gradient(top,#5cb85c 0,#449d44 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#5cb85c),to(#449d44));background-image:linear-gradient(to bottom,#5cb85c 0,#449d44 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);background-repeat:repeat-x}.progress-bar-info{background-image:-webkit-linear-gradient(top,#5bc0de 0,#31b0d5 100%);background-image:-o-linear-gradient(top,#5bc0de 0,#31b0d5 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#5bc0de),to(#31b0d5));background-image:linear-gradient(to bottom,#5bc0de 0,#31b0d5 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);background-repeat:repeat-x}.progress-bar-warning{background-image:-webkit-linear-gradient(top,#f0ad4e 0,#ec971f 100%);background-image:-o-linear-gradient(top,#f0ad4e 0,#ec971f 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#f0ad4e),to(#ec971f));background-image:linear-gradient(to bottom,#f0ad4e 0,#ec971f 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);background-repeat:repeat-x}.progress-bar-danger{background-image:-webkit-linear-gradient(top,#d9534f 0,#c9302c 100%);background-image:-o-linear-gradient(top,#d9534f 0,#c9302c 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#d9534f),to(#c9302c));background-image:linear-gradient(to bottom,#d9534f 0,#c9302c 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);background-repeat:repeat-x}.progress-bar-striped{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.list-group{border-radius:4px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.075);box-shadow:0 1px 2px rgba(0,0,0,.075)}.list-group-item.active,.list-group-item.active:hover,.list-group-item.active:focus{text-shadow:0 -1px 0 #286090;background-image:-webkit-linear-gradient(top,#337ab7 0,#2b669a 100%);background-image:-o-linear-gradient(top,#337ab7 0,#2b669a 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#337ab7),to(#2b669a));background-image:linear-gradient(to bottom,#337ab7 0,#2b669a 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0);background-repeat:repeat-x;border-color:#2b669a}.list-group-item.active .badge,.list-group-item.active:hover .badge,.list-group-item.active:focus .badge{text-shadow:none}.panel{-webkit-box-shadow:0 1px 2px rgba(0,0,0,.05);box-shadow:0 1px 2px rgba(0,0,0,.05)}.panel-default>.panel-heading{background-image:-webkit-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);background-image:-o-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#f5f5f5),to(#e8e8e8));background-image:linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);background-repeat:repeat-x}.panel-primary>.panel-heading{background-image:-webkit-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-o-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#337ab7),to(#2e6da4));background-image:linear-gradient(to bottom,#337ab7 0,#2e6da4 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);background-repeat:repeat-x}.panel-success>.panel-heading{background-image:-webkit-linear-gradient(top,#dff0d8 0,#d0e9c6 100%);background-image:-o-linear-gradient(top,#dff0d8 0,#d0e9c6 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#dff0d8),to(#d0e9c6));background-image:linear-gradient(to bottom,#dff0d8 0,#d0e9c6 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);background-repeat:repeat-x}.panel-info>.panel-heading{background-image:-webkit-linear-gradient(top,#d9edf7 0,#c4e3f3 100%);background-image:-o-linear-gradient(top,#d9edf7 0,#c4e3f3 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#d9edf7),to(#c4e3f3));background-image:linear-gradient(to bottom,#d9edf7 0,#c4e3f3 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);background-repeat:repeat-x}.panel-warning>.panel-heading{background-image:-webkit-linear-gradient(top,#fcf8e3 0,#faf2cc 100%);background-image:-o-linear-gradient(top,#fcf8e3 0,#faf2cc 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fcf8e3),to(#faf2cc));background-image:linear-gradient(to bottom,#fcf8e3 0,#faf2cc 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);background-repeat:repeat-x}.panel-danger>.panel-heading{background-image:-webkit-linear-gradient(top,#f2dede 0,#ebcccc 100%);background-image:-o-linear-gradient(top,#f2dede 0,#ebcccc 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#f2dede),to(#ebcccc));background-image:linear-gradient(to bottom,#f2dede 0,#ebcccc 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);background-repeat:repeat-x}.well{background-image:-webkit-linear-gradient(top,#e8e8e8 0,#f5f5f5 100%);background-image:-o-linear-gradient(top,#e8e8e8 0,#f5f5f5 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#e8e8e8),to(#f5f5f5));background-image:linear-gradient(to bottom,#e8e8e8 0,#f5f5f5 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);background-repeat:repeat-x;border-color:#dcdcdc;-webkit-box-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 rgba(255,255,255,.1)} -------------------------------------------------------------------------------- /css/fonts/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/css/fonts/.DS_Store -------------------------------------------------------------------------------- /css/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/css/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /css/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/css/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /css/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/css/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /css/intro/intro.min.css: -------------------------------------------------------------------------------- 1 | .introjs-overlay{position:absolute;z-index:999999;background-color:#000;opacity:0;background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.4)),color-stop(100%,rgba(0,0,0,0.9)));background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);background:radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#66000000',endColorstr='#e6000000',GradientType=1);-ms-filter:"alpha(opacity=50)";filter:alpha(opacity=50);-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-ms-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.introjs-fixParent{z-index:auto!important;opacity:1.0!important;position:absolute!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;-o-transform:none!important;transform:none!important}.introjs-showElement,tr.introjs-showElement>td,tr.introjs-showElement>th{z-index:9999999!important}.introjs-disableInteraction{z-index:99999999!important;position:absolute}.introjs-relativePosition,tr.introjs-showElement>td,tr.introjs-showElement>th{position:relative}.introjs-helperLayer{position:absolute;z-index:9999998;background-color:#FFF;background-color:rgba(255,255,255,.9);border:1px solid #777;border:1px solid rgba(0,0,0,.5);border-radius:4px;box-shadow:0 2px 15px rgba(0,0,0,.4);-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-ms-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.introjs-tooltipReferenceLayer{position:absolute;z-index:10000000;background-color:transparent;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-ms-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.introjs-helperLayer *,.introjs-helperLayer *:before,.introjs-helperLayer *:after{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;-ms-box-sizing:content-box;-o-box-sizing:content-box;box-sizing:content-box}.introjs-helperNumberLayer{position:absolute;top:-16px;left:-16px;z-index:9999999999!important;padding:2px;font-family:Arial,verdana,tahoma;font-size:13px;font-weight:bold;color:white;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,.3);background:#ff3019;background:-webkit-linear-gradient(top,#ff3019 0,#cf0404 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ff3019),color-stop(100%,#cf0404));background:-moz-linear-gradient(top,#ff3019 0,#cf0404 100%);background:-ms-linear-gradient(top,#ff3019 0,#cf0404 100%);background:-o-linear-gradient(top,#ff3019 0,#cf0404 100%);background:linear-gradient(to bottom,#ff3019 0,#cf0404 100%);width:20px;height:20px;line-height:20px;border:3px solid white;border-radius:50%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3019',endColorstr='#cf0404',GradientType=0);filter:progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=2,color=ff0000);box-shadow:0 2px 5px rgba(0,0,0,.4)}.introjs-arrow{border:5px solid white;content:'';position:absolute}.introjs-arrow.top{top:-10px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:white;border-left-color:transparent}.introjs-arrow.top-right{top:-10px;right:10px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:white;border-left-color:transparent}.introjs-arrow.top-middle{top:-10px;left:50%;margin-left:-5px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:white;border-left-color:transparent}.introjs-arrow.right{right:-10px;top:10px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:white}.introjs-arrow.right-bottom{bottom:10px;right:-10px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:white}.introjs-arrow.bottom{bottom:-10px;border-top-color:white;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}.introjs-arrow.left{left:-10px;top:10px;border-top-color:transparent;border-right-color:white;border-bottom-color:transparent;border-left-color:transparent}.introjs-arrow.left-bottom{left:-10px;bottom:10px;border-top-color:transparent;border-right-color:white;border-bottom-color:transparent;border-left-color:transparent}.introjs-tooltip{position:absolute;padding:10px;background-color:white;min-width:200px;max-width:300px;border-radius:3px;box-shadow:0 1px 10px rgba(0,0,0,.4);-webkit-transition:opacity .1s ease-out;-moz-transition:opacity .1s ease-out;-ms-transition:opacity .1s ease-out;-o-transition:opacity .1s ease-out;transition:opacity .1s ease-out}.introjs-tooltipbuttons{text-align:right;white-space:nowrap}.introjs-button{position:relative;overflow:visible;display:inline-block;padding:.3em .8em;border:1px solid #d4d4d4;margin:0;text-decoration:none;text-shadow:1px 1px 0 #fff;font:11px/normal sans-serif;color:#333;white-space:nowrap;cursor:pointer;outline:0;background-color:#ececec;background-image:-webkit-gradient(linear,0 0,0 100%,from(#f4f4f4),to(#ececec));background-image:-moz-linear-gradient(#f4f4f4,#ececec);background-image:-o-linear-gradient(#f4f4f4,#ececec);background-image:linear-gradient(#f4f4f4,#ececec);-webkit-background-clip:padding;-moz-background-clip:padding;-o-background-clip:padding-box;-webkit-border-radius:.2em;-moz-border-radius:.2em;border-radius:.2em;zoom:1;*display:inline;margin-top:10px}.introjs-button:hover{border-color:#bcbcbc;text-decoration:none;box-shadow:0 1px 1px #e3e3e3}.introjs-button:focus,.introjs-button:active{background-image:-webkit-gradient(linear,0 0,0 100%,from(#ececec),to(#f4f4f4));background-image:-moz-linear-gradient(#ececec,#f4f4f4);background-image:-o-linear-gradient(#ececec,#f4f4f4);background-image:linear-gradient(#ececec,#f4f4f4)}.introjs-button::-moz-focus-inner{padding:0;border:0}.introjs-skipbutton{margin-right:5px;color:#7a7a7a}.introjs-prevbutton{-webkit-border-radius:.2em 0 0 .2em;-moz-border-radius:.2em 0 0 .2em;border-radius:.2em 0 0 .2em;border-right:0}.introjs-nextbutton{-webkit-border-radius:0 .2em .2em 0;-moz-border-radius:0 .2em .2em 0;border-radius:0 .2em .2em 0}.introjs-disabled,.introjs-disabled:hover,.introjs-disabled:focus{color:#9a9a9a;border-color:#d4d4d4;box-shadow:none;cursor:default;background-color:#f4f4f4;background-image:none;text-decoration:none}.introjs-bullets{text-align:center}.introjs-bullets ul{clear:both;margin:15px auto 0;padding:0;display:inline-block}.introjs-bullets ul li{list-style:none;float:left;margin:0 2px}.introjs-bullets ul li a{display:block;width:6px;height:6px;background:#ccc;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;text-decoration:none}.introjs-bullets ul li a:hover{background:#999}.introjs-bullets ul li a.active{background:#999}.introjs-progress{overflow:hidden;height:10px;margin:10px 0 5px 0;border-radius:4px;background-color:#ecf0f1}.introjs-progressbar{float:left;width:0;height:100%;font-size:10px;line-height:10px;text-align:center;background-color:#08c}.introjsFloatingElement{position:absolute;height:0;width:0;left:50%;top:50%} -------------------------------------------------------------------------------- /css/please-wait/please-wait.css: -------------------------------------------------------------------------------- 1 | /* line 17, ../src/please-wait.scss */ 2 | body.pg-loading { 3 | overflow: hidden; 4 | } 5 | 6 | /* line 21, ../src/please-wait.scss */ 7 | .pg-loading-screen { 8 | position: fixed; 9 | bottom: 0; 10 | left: 0; 11 | right: 0; 12 | top: 0; 13 | z-index: 1000000; 14 | opacity: 1; 15 | background-color: #FFF; 16 | -webkit-transition: background-color 0.4s ease-in-out 0s; 17 | -moz-transition: background-color 0.4s ease-in-out 0s; 18 | -ms-transition: background-color 0.4s ease-in-out 0s; 19 | -o-transition: background-color 0.4s ease-in-out 0s; 20 | transition: background-color 0.4s ease-in-out 0s; 21 | } 22 | /* line 32, ../src/please-wait.scss */ 23 | .pg-loading-screen.pg-loaded { 24 | opacity: 0; 25 | -webkit-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both; 26 | -moz-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both; 27 | -ms-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both; 28 | -o-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both; 29 | animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both; 30 | } 31 | /* line 38, ../src/please-wait.scss */ 32 | .pg-loading-screen.pg-loading .pg-loading-logo-header, .pg-loading-screen.pg-loading .pg-loading-html { 33 | opacity: 1; 34 | } 35 | /* line 42, ../src/please-wait.scss */ 36 | .pg-loading-screen.pg-loading .pg-loading-logo-header, .pg-loading-screen.pg-loading .pg-loading-html:not(.pg-loaded) { 37 | -webkit-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both; 38 | -moz-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both; 39 | -ms-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both; 40 | -o-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both; 41 | animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both; 42 | } 43 | /* line 46, ../src/please-wait.scss */ 44 | .pg-loading-screen.pg-loading .pg-loading-html:not(.pg-loaded) { 45 | -webkit-animation-delay: 0.3s; 46 | -moz-animation-delay: 0.3s; 47 | -ms-animation-delay: 0.3s; 48 | -o-animation-delay: 0.3s; 49 | animation-delay: 0.3s; 50 | } 51 | /* line 51, ../src/please-wait.scss */ 52 | .pg-loading-screen .pg-loading-inner { 53 | height: 100%; 54 | width: 100%; 55 | margin: 0; 56 | padding: 0; 57 | position: static; 58 | } 59 | /* line 59, ../src/please-wait.scss */ 60 | .pg-loading-screen .pg-loading-center-outer { 61 | width: 100%; 62 | padding: 0; 63 | display: table !important; 64 | height: 100%; 65 | position: absolute; 66 | top: 0; 67 | left: 0; 68 | margin: 0; 69 | } 70 | /* line 70, ../src/please-wait.scss */ 71 | .pg-loading-screen .pg-loading-center-middle { 72 | padding: 0; 73 | vertical-align: middle; 74 | display: table-cell !important; 75 | margin: 0; 76 | text-align: center; 77 | } 78 | /* line 78, ../src/please-wait.scss */ 79 | .pg-loading-screen .pg-loading-logo-header, .pg-loading-screen .pg-loading-html { 80 | width: 100%; 81 | opacity: 0; 82 | } 83 | /* line 83, ../src/please-wait.scss */ 84 | .pg-loading-screen .pg-loading-logo-header { 85 | text-align: center; 86 | } 87 | /* line 86, ../src/please-wait.scss */ 88 | .pg-loading-screen .pg-loading-logo-header img { 89 | display: inline-block !important; 90 | } 91 | /* line 91, ../src/please-wait.scss */ 92 | .pg-loading-screen .pg-loading-html { 93 | margin-top: 90px; 94 | } 95 | /* line 94, ../src/please-wait.scss */ 96 | .pg-loading-screen .pg-loading-html.pg-loaded { 97 | -webkit-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1); 98 | -moz-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1); 99 | -ms-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1); 100 | -o-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1); 101 | transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1); 102 | } 103 | /* line 97, ../src/please-wait.scss */ 104 | .pg-loading-screen .pg-loading-html.pg-loaded.pg-removing { 105 | opacity: 0; 106 | } 107 | /* line 101, ../src/please-wait.scss */ 108 | .pg-loading-screen .pg-loading-html.pg-loaded.pg-loading { 109 | opacity: 1; 110 | } 111 | 112 | @-webkit-keyframes pgAnimLoading { 113 | from { 114 | opacity: 0; 115 | } 116 | } 117 | @-moz-keyframes pgAnimLoading { 118 | from { 119 | opacity: 0; 120 | } 121 | } 122 | @-o-keyframes pgAnimLoading { 123 | from { 124 | opacity: 0; 125 | } 126 | } 127 | @-ms-keyframes pgAnimLoading { 128 | from { 129 | opacity: 0; 130 | } 131 | } 132 | @keyframes pgAnimLoading { 133 | from { 134 | opacity: 0; 135 | } 136 | } 137 | @-webkit-keyframes pgAnimLoaded { 138 | from { 139 | opacity: 1; 140 | } 141 | } 142 | @-moz-keyframes pgAnimLoaded { 143 | from { 144 | opacity: 1; 145 | } 146 | } 147 | @-o-keyframes pgAnimLoaded { 148 | from { 149 | opacity: 1; 150 | } 151 | } 152 | @-ms-keyframes pgAnimLoaded { 153 | from { 154 | opacity: 1; 155 | } 156 | } 157 | @keyframes pgAnimLoaded { 158 | from { 159 | opacity: 1; 160 | } 161 | } 162 | -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * RadialChartImageGenerator 3 | * Copyright 2015 Hitesh Maidasani 4 | * Licensed under MIT (https://github.com/hmaidasani/RadialChartImageGenerator/blob/master/LICENSE) 5 | */ 6 | 7 | body{ 8 | padding: 0; 9 | /*margin: 0px 50px;*/ 10 | /*font-family: Comfortaa, sans-serif;*/ 11 | /*font-weight: 300;*/ 12 | text-rendering: optimizelegibility; 13 | background-color: #000000; 14 | } 15 | 16 | .navbar { 17 | border-radius: 0px !important; 18 | border: none; 19 | background-color: #ddd; 20 | } 21 | .navbar .navbar-brand { 22 | color: #111; 23 | } 24 | @media (max-width: 420px) { 25 | .navbar .navbar-brand { 26 | font-size: 14px; 27 | } 28 | } 29 | .nav a { 30 | color: #000 !important; 31 | } 32 | 33 | .charts-row { 34 | text-align: center; 35 | } 36 | .charts-row, .charts-row h3, .charts-row h4, .charts-row h5 { 37 | color: #fff; 38 | } 39 | .chart-box { 40 | position:relative; 41 | height:300px; 42 | width:300px; 43 | margin: 10px auto; 44 | } 45 | .chart-options { 46 | padding: 5px 0; 47 | } 48 | .options { 49 | text-align: left; 50 | background-color: #e2e2e2; 51 | padding: 10px; 52 | color: #000000; 53 | } 54 | .options h4 { 55 | color: #000000; 56 | } 57 | .options .input-area { 58 | width: 185px; 59 | display: inline-block; 60 | } 61 | 62 | .options .text { 63 | display: inline-block; 64 | line-height: 36px; 65 | vertical-align: middle; 66 | margin-top: -26px; 67 | margin-right: 5px; 68 | } 69 | 70 | .options input { 71 | color: #000000; 72 | text-align: center; 73 | } 74 | .options .btn-refresh { 75 | background-color: transparent; 76 | } 77 | .btn-number[data-type="plus"], input.color, .single-input { 78 | border-top-left-radius: 0; 79 | border-bottom-left-radius: 0; 80 | margin-left: -1px; 81 | } 82 | .btn { 83 | outline: none !important; 84 | } 85 | .btn-number { 86 | color: #333 !important; 87 | background-color: #fff !important; 88 | border-color: #ccc !important; 89 | } 90 | footer { 91 | padding: 20px 0; 92 | margin-top: 30px; 93 | background-color: #ddd; 94 | } 95 | 96 | .loading-message { 97 | color: #ffffff; 98 | } 99 | /* 100 | Spinner by https://github.com/tobiasahlin/SpinKit 101 | * Usage: 102 | * 103 | * 108 | * 109 | */ 110 | .sk-spinner-three-bounce.sk-spinner { 111 | margin: 0 auto; 112 | width: 70px; 113 | text-align: center; } 114 | .sk-spinner-three-bounce div { 115 | width: 18px; 116 | height: 18px; 117 | background-color: #ffffff; 118 | border-radius: 100%; 119 | display: inline-block; 120 | -webkit-animation: sk-threeBounceDelay 1.4s infinite ease-in-out; 121 | animation: sk-threeBounceDelay 1.4s infinite ease-in-out; 122 | /* Prevent first frame from flickering when animation starts */ 123 | -webkit-animation-fill-mode: both; 124 | animation-fill-mode: both; } 125 | .sk-spinner-three-bounce .sk-bounce1 { 126 | -webkit-animation-delay: -0.32s; 127 | animation-delay: -0.32s; } 128 | .sk-spinner-three-bounce .sk-bounce2 { 129 | -webkit-animation-delay: -0.16s; 130 | animation-delay: -0.16s; } 131 | 132 | @-webkit-keyframes sk-threeBounceDelay { 133 | 0%, 80%, 100% { 134 | -webkit-transform: scale(0); 135 | transform: scale(0); } 136 | 137 | 40% { 138 | -webkit-transform: scale(1); 139 | transform: scale(1); } } 140 | 141 | @keyframes sk-threeBounceDelay { 142 | 0%, 80%, 100% { 143 | -webkit-transform: scale(0); 144 | transform: scale(0); } 145 | 146 | 40% { 147 | -webkit-transform: scale(1); 148 | transform: scale(1); } } 149 | 150 | .knob { 151 | font-family: 'Roboto','Myriad Set Pro', 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif !important; 152 | color: #fff; 153 | } 154 | .knob.with-subtext { 155 | margin-top: 85px !important; 156 | } 157 | .subtext { 158 | position: absolute; 159 | width: 100%; 160 | text-align: center; 161 | font-family: 'Roboto','Myriad Set Pro', 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, Verdana, sans-serif; 162 | color: #fff; 163 | text-transform: uppercase; 164 | top: 180px; 165 | font-size: 20px; 166 | } 167 | .checkbox-inline { 168 | margin-top: -26px; 169 | margin-right: 5px; 170 | padding-left: 0px; 171 | } 172 | .checkbox-inline input[type=checkbox] { 173 | position: relative; 174 | /*margin-top: 4px \9;*/ 175 | margin-left: 5px; 176 | } 177 | 178 | .introjs-helperNumberLayer { 179 | display: none !important; 180 | } 181 | .introjs-tooltip { 182 | top: 0 !important; 183 | } 184 | a:focus { 185 | outline: none; 186 | text-decoration: none; 187 | } 188 | #question-merge { 189 | background-color: #E2E2E2; 190 | border-radius: 30px; 191 | padding: 2px 6px; 192 | } 193 | 194 | .linecap-toggle { 195 | margin-bottom: 5px; 196 | } 197 | .linecap-toggle .control-label { 198 | font-weight: 400; 199 | margin-right: 5px; 200 | } -------------------------------------------------------------------------------- /docs/animate1.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/animate1.gif -------------------------------------------------------------------------------- /docs/animate2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/animate2.gif -------------------------------------------------------------------------------- /docs/animate3.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/animate3.gif -------------------------------------------------------------------------------- /docs/how-to-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/how-to-2.png -------------------------------------------------------------------------------- /docs/how-to-3.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/how-to-3.gif -------------------------------------------------------------------------------- /docs/how-to-4.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/how-to-4.gif -------------------------------------------------------------------------------- /docs/how-to-5.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/how-to-5.gif -------------------------------------------------------------------------------- /docs/how-to-6.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/how-to-6.gif -------------------------------------------------------------------------------- /docs/how-to-7.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/docs/how-to-7.gif -------------------------------------------------------------------------------- /examples/Health.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/examples/Health.zip -------------------------------------------------------------------------------- /examples/Radial - Single Arc.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/examples/Radial - Single Arc.zip -------------------------------------------------------------------------------- /examples/Radial - Triple Arc.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/examples/Radial - Triple Arc.zip -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 6 | 7 | 8 | 9 | Radial/Ring/Circle Progress Chart Generator for Apple Watch. 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 33 | 34 | 35 | 57 |
58 |
59 | 60 |
61 |

Single Arc

62 |
63 | 64 |
65 | 66 |
of 100 cals
67 |
68 | 69 |
70 | 71 |
72 | 73 |
74 | 75 |
76 |

Double Arc

77 |
78 | 79 |
80 | 81 |
82 | 83 |
84 | 85 |
86 | 87 |
88 | 89 |
90 | 91 |
92 | 93 |
94 |

Triple Arc

95 |
96 | 97 |
98 | 99 |
100 | 101 |
102 | 103 |
104 | 105 |
106 | 107 |
108 | 109 |
110 | 111 |
112 | 113 |
114 | 115 |
116 |
117 | 118 | 131 | 132 | 133 | 196 | 197 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | -------------------------------------------------------------------------------- /js/bootstrap/bootstrap-switch.min.js: -------------------------------------------------------------------------------- 1 | /* ======================================================================== 2 | * bootstrap-switch - v3.3.2 3 | * http://www.bootstrap-switch.org 4 | * ======================================================================== 5 | * Copyright 2012-2013 Mattia Larentis 6 | * 7 | * ======================================================================== 8 | * Licensed under the Apache License, Version 2.0 (the "License"); 9 | * you may not use this file except in compliance with the License. 10 | * You may obtain a copy of the License at 11 | * 12 | * http://www.apache.org/licenses/LICENSE-2.0 13 | * 14 | * Unless required by applicable law or agreed to in writing, software 15 | * distributed under the License is distributed on an "AS IS" BASIS, 16 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 17 | * See the License for the specific language governing permissions and 18 | * limitations under the License. 19 | * ======================================================================== 20 | */ 21 | 22 | (function(){var t=[].slice;!function(e,i){"use strict";var n;return n=function(){function t(t,i){null==i&&(i={}),this.$element=e(t),this.options=e.extend({},e.fn.bootstrapSwitch.defaults,{state:this.$element.is(":checked"),size:this.$element.data("size"),animate:this.$element.data("animate"),disabled:this.$element.is(":disabled"),readonly:this.$element.is("[readonly]"),indeterminate:this.$element.data("indeterminate"),inverse:this.$element.data("inverse"),radioAllOff:this.$element.data("radio-all-off"),onColor:this.$element.data("on-color"),offColor:this.$element.data("off-color"),onText:this.$element.data("on-text"),offText:this.$element.data("off-text"),labelText:this.$element.data("label-text"),handleWidth:this.$element.data("handle-width"),labelWidth:this.$element.data("label-width"),baseClass:this.$element.data("base-class"),wrapperClass:this.$element.data("wrapper-class")},i),this.$wrapper=e("
",{"class":function(t){return function(){var e;return e=[""+t.options.baseClass].concat(t._getClasses(t.options.wrapperClass)),e.push(t.options.state?""+t.options.baseClass+"-on":""+t.options.baseClass+"-off"),null!=t.options.size&&e.push(""+t.options.baseClass+"-"+t.options.size),t.options.disabled&&e.push(""+t.options.baseClass+"-disabled"),t.options.readonly&&e.push(""+t.options.baseClass+"-readonly"),t.options.indeterminate&&e.push(""+t.options.baseClass+"-indeterminate"),t.options.inverse&&e.push(""+t.options.baseClass+"-inverse"),t.$element.attr("id")&&e.push(""+t.options.baseClass+"-id-"+t.$element.attr("id")),e.join(" ")}}(this)()}),this.$container=e("
",{"class":""+this.options.baseClass+"-container"}),this.$on=e("",{html:this.options.onText,"class":""+this.options.baseClass+"-handle-on "+this.options.baseClass+"-"+this.options.onColor}),this.$off=e("",{html:this.options.offText,"class":""+this.options.baseClass+"-handle-off "+this.options.baseClass+"-"+this.options.offColor}),this.$label=e("",{html:this.options.labelText,"class":""+this.options.baseClass+"-label"}),this.$element.on("init.bootstrapSwitch",function(e){return function(){return e.options.onInit.apply(t,arguments)}}(this)),this.$element.on("switchChange.bootstrapSwitch",function(e){return function(){return e.options.onSwitchChange.apply(t,arguments)}}(this)),this.$container=this.$element.wrap(this.$container).parent(),this.$wrapper=this.$container.wrap(this.$wrapper).parent(),this.$element.before(this.options.inverse?this.$off:this.$on).before(this.$label).before(this.options.inverse?this.$on:this.$off),this.options.indeterminate&&this.$element.prop("indeterminate",!0),this._init(),this._elementHandlers(),this._handleHandlers(),this._labelHandlers(),this._formHandler(),this._externalLabelHandler(),this.$element.trigger("init.bootstrapSwitch")}return t.prototype._constructor=t,t.prototype.state=function(t,e){return"undefined"==typeof t?this.options.state:this.options.disabled||this.options.readonly?this.$element:this.options.state&&!this.options.radioAllOff&&this.$element.is(":radio")?this.$element:(this.options.indeterminate&&this.indeterminate(!1),t=!!t,this.$element.prop("checked",t).trigger("change.bootstrapSwitch",e),this.$element)},t.prototype.toggleState=function(t){return this.options.disabled||this.options.readonly?this.$element:this.options.indeterminate?(this.indeterminate(!1),this.state(!0)):this.$element.prop("checked",!this.options.state).trigger("change.bootstrapSwitch",t)},t.prototype.size=function(t){return"undefined"==typeof t?this.options.size:(null!=this.options.size&&this.$wrapper.removeClass(""+this.options.baseClass+"-"+this.options.size),t&&this.$wrapper.addClass(""+this.options.baseClass+"-"+t),this._width(),this._containerPosition(),this.options.size=t,this.$element)},t.prototype.animate=function(t){return"undefined"==typeof t?this.options.animate:(t=!!t,t===this.options.animate?this.$element:this.toggleAnimate())},t.prototype.toggleAnimate=function(){return this.options.animate=!this.options.animate,this.$wrapper.toggleClass(""+this.options.baseClass+"-animate"),this.$element},t.prototype.disabled=function(t){return"undefined"==typeof t?this.options.disabled:(t=!!t,t===this.options.disabled?this.$element:this.toggleDisabled())},t.prototype.toggleDisabled=function(){return this.options.disabled=!this.options.disabled,this.$element.prop("disabled",this.options.disabled),this.$wrapper.toggleClass(""+this.options.baseClass+"-disabled"),this.$element},t.prototype.readonly=function(t){return"undefined"==typeof t?this.options.readonly:(t=!!t,t===this.options.readonly?this.$element:this.toggleReadonly())},t.prototype.toggleReadonly=function(){return this.options.readonly=!this.options.readonly,this.$element.prop("readonly",this.options.readonly),this.$wrapper.toggleClass(""+this.options.baseClass+"-readonly"),this.$element},t.prototype.indeterminate=function(t){return"undefined"==typeof t?this.options.indeterminate:(t=!!t,t===this.options.indeterminate?this.$element:this.toggleIndeterminate())},t.prototype.toggleIndeterminate=function(){return this.options.indeterminate=!this.options.indeterminate,this.$element.prop("indeterminate",this.options.indeterminate),this.$wrapper.toggleClass(""+this.options.baseClass+"-indeterminate"),this._containerPosition(),this.$element},t.prototype.inverse=function(t){return"undefined"==typeof t?this.options.inverse:(t=!!t,t===this.options.inverse?this.$element:this.toggleInverse())},t.prototype.toggleInverse=function(){var t,e;return this.$wrapper.toggleClass(""+this.options.baseClass+"-inverse"),e=this.$on.clone(!0),t=this.$off.clone(!0),this.$on.replaceWith(t),this.$off.replaceWith(e),this.$on=t,this.$off=e,this.options.inverse=!this.options.inverse,this.$element},t.prototype.onColor=function(t){var e;return e=this.options.onColor,"undefined"==typeof t?e:(null!=e&&this.$on.removeClass(""+this.options.baseClass+"-"+e),this.$on.addClass(""+this.options.baseClass+"-"+t),this.options.onColor=t,this.$element)},t.prototype.offColor=function(t){var e;return e=this.options.offColor,"undefined"==typeof t?e:(null!=e&&this.$off.removeClass(""+this.options.baseClass+"-"+e),this.$off.addClass(""+this.options.baseClass+"-"+t),this.options.offColor=t,this.$element)},t.prototype.onText=function(t){return"undefined"==typeof t?this.options.onText:(this.$on.html(t),this._width(),this._containerPosition(),this.options.onText=t,this.$element)},t.prototype.offText=function(t){return"undefined"==typeof t?this.options.offText:(this.$off.html(t),this._width(),this._containerPosition(),this.options.offText=t,this.$element)},t.prototype.labelText=function(t){return"undefined"==typeof t?this.options.labelText:(this.$label.html(t),this._width(),this.options.labelText=t,this.$element)},t.prototype.handleWidth=function(t){return"undefined"==typeof t?this.options.handleWidth:(this.options.handleWidth=t,this._width(),this._containerPosition(),this.$element)},t.prototype.labelWidth=function(t){return"undefined"==typeof t?this.options.labelWidth:(this.options.labelWidth=t,this._width(),this._containerPosition(),this.$element)},t.prototype.baseClass=function(){return this.options.baseClass},t.prototype.wrapperClass=function(t){return"undefined"==typeof t?this.options.wrapperClass:(t||(t=e.fn.bootstrapSwitch.defaults.wrapperClass),this.$wrapper.removeClass(this._getClasses(this.options.wrapperClass).join(" ")),this.$wrapper.addClass(this._getClasses(t).join(" ")),this.options.wrapperClass=t,this.$element)},t.prototype.radioAllOff=function(t){return"undefined"==typeof t?this.options.radioAllOff:(t=!!t,t===this.options.radioAllOff?this.$element:(this.options.radioAllOff=t,this.$element))},t.prototype.onInit=function(t){return"undefined"==typeof t?this.options.onInit:(t||(t=e.fn.bootstrapSwitch.defaults.onInit),this.options.onInit=t,this.$element)},t.prototype.onSwitchChange=function(t){return"undefined"==typeof t?this.options.onSwitchChange:(t||(t=e.fn.bootstrapSwitch.defaults.onSwitchChange),this.options.onSwitchChange=t,this.$element)},t.prototype.destroy=function(){var t;return t=this.$element.closest("form"),t.length&&t.off("reset.bootstrapSwitch").removeData("bootstrap-switch"),this.$container.children().not(this.$element).remove(),this.$element.unwrap().unwrap().off(".bootstrapSwitch").removeData("bootstrap-switch"),this.$element},t.prototype._width=function(){var t,e;return t=this.$on.add(this.$off),t.add(this.$label).css("width",""),e="auto"===this.options.handleWidth?Math.max(this.$on.width(),this.$off.width()):this.options.handleWidth,t.width(e),this.$label.width(function(t){return function(i,n){return"auto"!==t.options.labelWidth?t.options.labelWidth:e>n?e:n}}(this)),this._handleWidth=this.$on.outerWidth(),this._labelWidth=this.$label.outerWidth(),this.$container.width(2*this._handleWidth+this._labelWidth),this.$wrapper.width(this._handleWidth+this._labelWidth)},t.prototype._containerPosition=function(t,e){return null==t&&(t=this.options.state),this.$container.css("margin-left",function(e){return function(){var i;return i=[0,"-"+e._handleWidth+"px"],e.options.indeterminate?"-"+e._handleWidth/2+"px":t?e.options.inverse?i[1]:i[0]:e.options.inverse?i[0]:i[1]}}(this)),e?setTimeout(function(){return e()},50):void 0},t.prototype._init=function(){var t,e;return t=function(t){return function(){return t._width(),t._containerPosition(null,function(){return t.options.animate?t.$wrapper.addClass(""+t.options.baseClass+"-animate"):void 0})}}(this),this.$wrapper.is(":visible")?t():e=i.setInterval(function(n){return function(){return n.$wrapper.is(":visible")?(t(),i.clearInterval(e)):void 0}}(this),50)},t.prototype._elementHandlers=function(){return this.$element.on({"change.bootstrapSwitch":function(t){return function(i,n){var o;return i.preventDefault(),i.stopImmediatePropagation(),o=t.$element.is(":checked"),t._containerPosition(o),o!==t.options.state?(t.options.state=o,t.$wrapper.toggleClass(""+t.options.baseClass+"-off").toggleClass(""+t.options.baseClass+"-on"),n?void 0:(t.$element.is(":radio")&&e("[name='"+t.$element.attr("name")+"']").not(t.$element).prop("checked",!1).trigger("change.bootstrapSwitch",!0),t.$element.trigger("switchChange.bootstrapSwitch",[o]))):void 0}}(this),"focus.bootstrapSwitch":function(t){return function(e){return e.preventDefault(),t.$wrapper.addClass(""+t.options.baseClass+"-focused")}}(this),"blur.bootstrapSwitch":function(t){return function(e){return e.preventDefault(),t.$wrapper.removeClass(""+t.options.baseClass+"-focused")}}(this),"keydown.bootstrapSwitch":function(t){return function(e){if(e.which&&!t.options.disabled&&!t.options.readonly)switch(e.which){case 37:return e.preventDefault(),e.stopImmediatePropagation(),t.state(!1);case 39:return e.preventDefault(),e.stopImmediatePropagation(),t.state(!0)}}}(this)})},t.prototype._handleHandlers=function(){return this.$on.on("click.bootstrapSwitch",function(t){return function(e){return e.preventDefault(),e.stopPropagation(),t.state(!1),t.$element.trigger("focus.bootstrapSwitch")}}(this)),this.$off.on("click.bootstrapSwitch",function(t){return function(e){return e.preventDefault(),e.stopPropagation(),t.state(!0),t.$element.trigger("focus.bootstrapSwitch")}}(this))},t.prototype._labelHandlers=function(){return this.$label.on({"mousedown.bootstrapSwitch touchstart.bootstrapSwitch":function(t){return function(e){return t._dragStart||t.options.disabled||t.options.readonly?void 0:(e.preventDefault(),e.stopPropagation(),t._dragStart=(e.pageX||e.originalEvent.touches[0].pageX)-parseInt(t.$container.css("margin-left"),10),t.options.animate&&t.$wrapper.removeClass(""+t.options.baseClass+"-animate"),t.$element.trigger("focus.bootstrapSwitch"))}}(this),"mousemove.bootstrapSwitch touchmove.bootstrapSwitch":function(t){return function(e){var i;if(null!=t._dragStart&&(e.preventDefault(),i=(e.pageX||e.originalEvent.touches[0].pageX)-t._dragStart,!(i<-t._handleWidth||i>0)))return t._dragEnd=i,t.$container.css("margin-left",""+t._dragEnd+"px")}}(this),"mouseup.bootstrapSwitch touchend.bootstrapSwitch":function(t){return function(e){var i;if(t._dragStart)return e.preventDefault(),t.options.animate&&t.$wrapper.addClass(""+t.options.baseClass+"-animate"),t._dragEnd?(i=t._dragEnd>-(t._handleWidth/2),t._dragEnd=!1,t.state(t.options.inverse?!i:i)):t.state(!t.options.state),t._dragStart=!1}}(this),"mouseleave.bootstrapSwitch":function(t){return function(){return t.$label.trigger("mouseup.bootstrapSwitch")}}(this)})},t.prototype._externalLabelHandler=function(){var t;return t=this.$element.closest("label"),t.on("click",function(e){return function(i){return i.preventDefault(),i.stopImmediatePropagation(),i.target===t[0]?e.toggleState():void 0}}(this))},t.prototype._formHandler=function(){var t;return t=this.$element.closest("form"),t.data("bootstrap-switch")?void 0:t.on("reset.bootstrapSwitch",function(){return i.setTimeout(function(){return t.find("input").filter(function(){return e(this).data("bootstrap-switch")}).each(function(){return e(this).bootstrapSwitch("state",this.checked)})},1)}).data("bootstrap-switch",!0)},t.prototype._getClasses=function(t){var i,n,o,s;if(!e.isArray(t))return[""+this.options.baseClass+"-"+t];for(n=[],o=0,s=t.length;s>o;o++)i=t[o],n.push(""+this.options.baseClass+"-"+i);return n},t}(),e.fn.bootstrapSwitch=function(){var i,o,s;return o=arguments[0],i=2<=arguments.length?t.call(arguments,1):[],s=this,this.each(function(){var t,a;return t=e(this),a=t.data("bootstrap-switch"),a||t.data("bootstrap-switch",a=new n(this,o)),"string"==typeof o?s=a[o].apply(a,i):void 0}),s},e.fn.bootstrapSwitch.Constructor=n,e.fn.bootstrapSwitch.defaults={state:!0,size:null,animate:!0,disabled:!1,readonly:!1,indeterminate:!1,inverse:!1,radioAllOff:!1,onColor:"primary",offColor:"default",onText:"ON",offText:"OFF",labelText:" ",handleWidth:"auto",labelWidth:"auto",baseClass:"bootstrap-switch",wrapperClass:"wrapper",onInit:function(){},onSwitchChange:function(){}}}(window.jQuery,window)}).call(this); -------------------------------------------------------------------------------- /js/excanvas.js: -------------------------------------------------------------------------------- 1 | // Copyright 2006 Google Inc. 2 | // 3 | // Licensed under the Apache License, Version 2.0 (the "License"); 4 | // you may not use this file except in compliance with the License. 5 | // You may obtain a copy of the License at 6 | // 7 | // http://www.apache.org/licenses/LICENSE-2.0 8 | // 9 | // Unless required by applicable law or agreed to in writing, software 10 | // distributed under the License is distributed on an "AS IS" BASIS, 11 | // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | // See the License for the specific language governing permissions and 13 | // limitations under the License. 14 | 15 | 16 | // Known Issues: 17 | // 18 | // * Patterns are not implemented. 19 | // * Radial gradient are not implemented. The VML version of these look very 20 | // different from the canvas one. 21 | // * Clipping paths are not implemented. 22 | // * Coordsize. The width and height attribute have higher priority than the 23 | // width and height style values which isn't correct. 24 | // * Painting mode isn't implemented. 25 | // * Canvas width/height should is using content-box by default. IE in 26 | // Quirks mode will draw the canvas using border-box. Either change your 27 | // doctype to HTML5 28 | // (http://www.whatwg.org/specs/web-apps/current-work/#the-doctype) 29 | // or use Box Sizing Behavior from WebFX 30 | // (http://webfx.eae.net/dhtml/boxsizing/boxsizing.html) 31 | // * Non uniform scaling does not correctly scale strokes. 32 | // * Optimize. There is always room for speed improvements. 33 | 34 | // Only add this code if we do not already have a canvas implementation 35 | if (!document.createElement('canvas').getContext) { 36 | 37 | (function() { 38 | 39 | // alias some functions to make (compiled) code shorter 40 | var m = Math; 41 | var mr = m.round; 42 | var ms = m.sin; 43 | var mc = m.cos; 44 | var abs = m.abs; 45 | var sqrt = m.sqrt; 46 | 47 | // this is used for sub pixel precision 48 | var Z = 10; 49 | var Z2 = Z / 2; 50 | 51 | /** 52 | * This funtion is assigned to the elements as element.getContext(). 53 | * @this {HTMLElement} 54 | * @return {CanvasRenderingContext2D_} 55 | */ 56 | function getContext() { 57 | return this.context_ || 58 | (this.context_ = new CanvasRenderingContext2D_(this)); 59 | } 60 | 61 | var slice = Array.prototype.slice; 62 | 63 | /** 64 | * Binds a function to an object. The returned function will always use the 65 | * passed in {@code obj} as {@code this}. 66 | * 67 | * Example: 68 | * 69 | * g = bind(f, obj, a, b) 70 | * g(c, d) // will do f.call(obj, a, b, c, d) 71 | * 72 | * @param {Function} f The function to bind the object to 73 | * @param {Object} obj The object that should act as this when the function 74 | * is called 75 | * @param {*} var_args Rest arguments that will be used as the initial 76 | * arguments when the function is called 77 | * @return {Function} A new function that has bound this 78 | */ 79 | function bind(f, obj, var_args) { 80 | var a = slice.call(arguments, 2); 81 | return function() { 82 | return f.apply(obj, a.concat(slice.call(arguments))); 83 | }; 84 | } 85 | 86 | var G_vmlCanvasManager_ = { 87 | init: function(opt_doc) { 88 | if (/MSIE/.test(navigator.userAgent) && !window.opera) { 89 | var doc = opt_doc || document; 90 | // Create a dummy element so that IE will allow canvas elements to be 91 | // recognized. 92 | doc.createElement('canvas'); 93 | doc.attachEvent('onreadystatechange', bind(this.init_, this, doc)); 94 | } 95 | }, 96 | 97 | init_: function(doc) { 98 | // create xmlns 99 | if (!doc.namespaces['g_vml_']) { 100 | doc.namespaces.add('g_vml_', 'urn:schemas-microsoft-com:vml', 101 | '#default#VML'); 102 | 103 | } 104 | if (!doc.namespaces['g_o_']) { 105 | doc.namespaces.add('g_o_', 'urn:schemas-microsoft-com:office:office', 106 | '#default#VML'); 107 | } 108 | 109 | // Setup default CSS. Only add one style sheet per document 110 | if (!doc.styleSheets['ex_canvas_']) { 111 | var ss = doc.createStyleSheet(); 112 | ss.owningElement.id = 'ex_canvas_'; 113 | ss.cssText = 'canvas{display:inline-block;overflow:hidden;' + 114 | // default size is 300x150 in Gecko and Opera 115 | 'text-align:left;width:300px;height:150px}' + 116 | 'g_vml_\\:*{behavior:url(#default#VML)}' + 117 | 'g_o_\\:*{behavior:url(#default#VML)}'; 118 | 119 | } 120 | 121 | // find all canvas elements 122 | var els = doc.getElementsByTagName('canvas'); 123 | for (var i = 0; i < els.length; i++) { 124 | this.initElement(els[i]); 125 | } 126 | }, 127 | 128 | /** 129 | * Public initializes a canvas element so that it can be used as canvas 130 | * element from now on. This is called automatically before the page is 131 | * loaded but if you are creating elements using createElement you need to 132 | * make sure this is called on the element. 133 | * @param {HTMLElement} el The canvas element to initialize. 134 | * @return {HTMLElement} the element that was created. 135 | */ 136 | initElement: function(el) { 137 | if (!el.getContext) { 138 | 139 | el.getContext = getContext; 140 | 141 | // Remove fallback content. There is no way to hide text nodes so we 142 | // just remove all childNodes. We could hide all elements and remove 143 | // text nodes but who really cares about the fallback content. 144 | el.innerHTML = ''; 145 | 146 | // do not use inline function because that will leak memory 147 | el.attachEvent('onpropertychange', onPropertyChange); 148 | el.attachEvent('onresize', onResize); 149 | 150 | var attrs = el.attributes; 151 | if (attrs.width && attrs.width.specified) { 152 | // TODO: use runtimeStyle and coordsize 153 | // el.getContext().setWidth_(attrs.width.nodeValue); 154 | el.style.width = attrs.width.nodeValue + 'px'; 155 | } else { 156 | el.width = el.clientWidth; 157 | } 158 | if (attrs.height && attrs.height.specified) { 159 | // TODO: use runtimeStyle and coordsize 160 | // el.getContext().setHeight_(attrs.height.nodeValue); 161 | el.style.height = attrs.height.nodeValue + 'px'; 162 | } else { 163 | el.height = el.clientHeight; 164 | } 165 | //el.getContext().setCoordsize_() 166 | } 167 | return el; 168 | } 169 | }; 170 | 171 | function onPropertyChange(e) { 172 | var el = e.srcElement; 173 | 174 | switch (e.propertyName) { 175 | case 'width': 176 | el.style.width = el.attributes.width.nodeValue + 'px'; 177 | el.getContext().clearRect(); 178 | break; 179 | case 'height': 180 | el.style.height = el.attributes.height.nodeValue + 'px'; 181 | el.getContext().clearRect(); 182 | break; 183 | } 184 | } 185 | 186 | function onResize(e) { 187 | var el = e.srcElement; 188 | if (el.firstChild) { 189 | el.firstChild.style.width = el.clientWidth + 'px'; 190 | el.firstChild.style.height = el.clientHeight + 'px'; 191 | } 192 | } 193 | 194 | G_vmlCanvasManager_.init(); 195 | 196 | // precompute "00" to "FF" 197 | var dec2hex = []; 198 | for (var i = 0; i < 16; i++) { 199 | for (var j = 0; j < 16; j++) { 200 | dec2hex[i * 16 + j] = i.toString(16) + j.toString(16); 201 | } 202 | } 203 | 204 | function createMatrixIdentity() { 205 | return [ 206 | [1, 0, 0], 207 | [0, 1, 0], 208 | [0, 0, 1] 209 | ]; 210 | } 211 | 212 | function matrixMultiply(m1, m2) { 213 | var result = createMatrixIdentity(); 214 | 215 | for (var x = 0; x < 3; x++) { 216 | for (var y = 0; y < 3; y++) { 217 | var sum = 0; 218 | 219 | for (var z = 0; z < 3; z++) { 220 | sum += m1[x][z] * m2[z][y]; 221 | } 222 | 223 | result[x][y] = sum; 224 | } 225 | } 226 | return result; 227 | } 228 | 229 | function copyState(o1, o2) { 230 | o2.fillStyle = o1.fillStyle; 231 | o2.lineCap = o1.lineCap; 232 | o2.lineJoin = o1.lineJoin; 233 | o2.lineWidth = o1.lineWidth; 234 | o2.miterLimit = o1.miterLimit; 235 | o2.shadowBlur = o1.shadowBlur; 236 | o2.shadowColor = o1.shadowColor; 237 | o2.shadowOffsetX = o1.shadowOffsetX; 238 | o2.shadowOffsetY = o1.shadowOffsetY; 239 | o2.strokeStyle = o1.strokeStyle; 240 | o2.globalAlpha = o1.globalAlpha; 241 | o2.arcScaleX_ = o1.arcScaleX_; 242 | o2.arcScaleY_ = o1.arcScaleY_; 243 | o2.lineScale_ = o1.lineScale_; 244 | } 245 | 246 | function processStyle(styleString) { 247 | var str, alpha = 1; 248 | 249 | styleString = String(styleString); 250 | if (styleString.substring(0, 3) == 'rgb') { 251 | var start = styleString.indexOf('(', 3); 252 | var end = styleString.indexOf(')', start + 1); 253 | var guts = styleString.substring(start + 1, end).split(','); 254 | 255 | str = '#'; 256 | for (var i = 0; i < 3; i++) { 257 | str += dec2hex[Number(guts[i])]; 258 | } 259 | 260 | if (guts.length == 4 && styleString.substr(3, 1) == 'a') { 261 | alpha = guts[3]; 262 | } 263 | } else { 264 | str = styleString; 265 | } 266 | 267 | return {color: str, alpha: alpha}; 268 | } 269 | 270 | function processLineCap(lineCap) { 271 | switch (lineCap) { 272 | case 'butt': 273 | return 'flat'; 274 | case 'round': 275 | return 'round'; 276 | case 'square': 277 | default: 278 | return 'square'; 279 | } 280 | } 281 | 282 | /** 283 | * This class implements CanvasRenderingContext2D interface as described by 284 | * the WHATWG. 285 | * @param {HTMLElement} surfaceElement The element that the 2D context should 286 | * be associated with 287 | */ 288 | function CanvasRenderingContext2D_(surfaceElement) { 289 | this.m_ = createMatrixIdentity(); 290 | 291 | this.mStack_ = []; 292 | this.aStack_ = []; 293 | this.currentPath_ = []; 294 | 295 | // Canvas context properties 296 | this.strokeStyle = '#000'; 297 | this.fillStyle = '#000'; 298 | 299 | this.lineWidth = 1; 300 | this.lineJoin = 'miter'; 301 | this.lineCap = 'butt'; 302 | this.miterLimit = Z * 1; 303 | this.globalAlpha = 1; 304 | this.canvas = surfaceElement; 305 | 306 | var el = surfaceElement.ownerDocument.createElement('div'); 307 | el.style.width = surfaceElement.clientWidth + 'px'; 308 | el.style.height = surfaceElement.clientHeight + 'px'; 309 | el.style.overflow = 'hidden'; 310 | el.style.position = 'absolute'; 311 | surfaceElement.appendChild(el); 312 | 313 | this.element_ = el; 314 | this.arcScaleX_ = 1; 315 | this.arcScaleY_ = 1; 316 | this.lineScale_ = 1; 317 | } 318 | 319 | var contextPrototype = CanvasRenderingContext2D_.prototype; 320 | contextPrototype.clearRect = function() { 321 | this.element_.innerHTML = ''; 322 | }; 323 | 324 | contextPrototype.beginPath = function() { 325 | // TODO: Branch current matrix so that save/restore has no effect 326 | // as per safari docs. 327 | this.currentPath_ = []; 328 | }; 329 | 330 | contextPrototype.moveTo = function(aX, aY) { 331 | var p = this.getCoords_(aX, aY); 332 | this.currentPath_.push({type: 'moveTo', x: p.x, y: p.y}); 333 | this.currentX_ = p.x; 334 | this.currentY_ = p.y; 335 | }; 336 | 337 | contextPrototype.lineTo = function(aX, aY) { 338 | var p = this.getCoords_(aX, aY); 339 | this.currentPath_.push({type: 'lineTo', x: p.x, y: p.y}); 340 | 341 | this.currentX_ = p.x; 342 | this.currentY_ = p.y; 343 | }; 344 | 345 | contextPrototype.bezierCurveTo = function(aCP1x, aCP1y, 346 | aCP2x, aCP2y, 347 | aX, aY) { 348 | var p = this.getCoords_(aX, aY); 349 | var cp1 = this.getCoords_(aCP1x, aCP1y); 350 | var cp2 = this.getCoords_(aCP2x, aCP2y); 351 | bezierCurveTo(this, cp1, cp2, p); 352 | }; 353 | 354 | // Helper function that takes the already fixed cordinates. 355 | function bezierCurveTo(self, cp1, cp2, p) { 356 | self.currentPath_.push({ 357 | type: 'bezierCurveTo', 358 | cp1x: cp1.x, 359 | cp1y: cp1.y, 360 | cp2x: cp2.x, 361 | cp2y: cp2.y, 362 | x: p.x, 363 | y: p.y 364 | }); 365 | self.currentX_ = p.x; 366 | self.currentY_ = p.y; 367 | } 368 | 369 | contextPrototype.quadraticCurveTo = function(aCPx, aCPy, aX, aY) { 370 | // the following is lifted almost directly from 371 | // http://developer.mozilla.org/en/docs/Canvas_tutorial:Drawing_shapes 372 | 373 | var cp = this.getCoords_(aCPx, aCPy); 374 | var p = this.getCoords_(aX, aY); 375 | 376 | var cp1 = { 377 | x: this.currentX_ + 2.0 / 3.0 * (cp.x - this.currentX_), 378 | y: this.currentY_ + 2.0 / 3.0 * (cp.y - this.currentY_) 379 | }; 380 | var cp2 = { 381 | x: cp1.x + (p.x - this.currentX_) / 3.0, 382 | y: cp1.y + (p.y - this.currentY_) / 3.0 383 | }; 384 | 385 | bezierCurveTo(this, cp1, cp2, p); 386 | }; 387 | 388 | contextPrototype.arc = function(aX, aY, aRadius, 389 | aStartAngle, aEndAngle, aClockwise) { 390 | aRadius *= Z; 391 | var arcType = aClockwise ? 'at' : 'wa'; 392 | 393 | var xStart = aX + mc(aStartAngle) * aRadius - Z2; 394 | var yStart = aY + ms(aStartAngle) * aRadius - Z2; 395 | 396 | var xEnd = aX + mc(aEndAngle) * aRadius - Z2; 397 | var yEnd = aY + ms(aEndAngle) * aRadius - Z2; 398 | 399 | // IE won't render arches drawn counter clockwise if xStart == xEnd. 400 | if (xStart == xEnd && !aClockwise) { 401 | xStart += 0.125; // Offset xStart by 1/80 of a pixel. Use something 402 | // that can be represented in binary 403 | } 404 | 405 | var p = this.getCoords_(aX, aY); 406 | var pStart = this.getCoords_(xStart, yStart); 407 | var pEnd = this.getCoords_(xEnd, yEnd); 408 | 409 | this.currentPath_.push({type: arcType, 410 | x: p.x, 411 | y: p.y, 412 | radius: aRadius, 413 | xStart: pStart.x, 414 | yStart: pStart.y, 415 | xEnd: pEnd.x, 416 | yEnd: pEnd.y}); 417 | 418 | }; 419 | 420 | contextPrototype.rect = function(aX, aY, aWidth, aHeight) { 421 | this.moveTo(aX, aY); 422 | this.lineTo(aX + aWidth, aY); 423 | this.lineTo(aX + aWidth, aY + aHeight); 424 | this.lineTo(aX, aY + aHeight); 425 | this.closePath(); 426 | }; 427 | 428 | contextPrototype.strokeRect = function(aX, aY, aWidth, aHeight) { 429 | var oldPath = this.currentPath_; 430 | this.beginPath(); 431 | 432 | this.moveTo(aX, aY); 433 | this.lineTo(aX + aWidth, aY); 434 | this.lineTo(aX + aWidth, aY + aHeight); 435 | this.lineTo(aX, aY + aHeight); 436 | this.closePath(); 437 | this.stroke(); 438 | 439 | this.currentPath_ = oldPath; 440 | }; 441 | 442 | contextPrototype.fillRect = function(aX, aY, aWidth, aHeight) { 443 | var oldPath = this.currentPath_; 444 | this.beginPath(); 445 | 446 | this.moveTo(aX, aY); 447 | this.lineTo(aX + aWidth, aY); 448 | this.lineTo(aX + aWidth, aY + aHeight); 449 | this.lineTo(aX, aY + aHeight); 450 | this.closePath(); 451 | this.fill(); 452 | 453 | this.currentPath_ = oldPath; 454 | }; 455 | 456 | contextPrototype.createLinearGradient = function(aX0, aY0, aX1, aY1) { 457 | var gradient = new CanvasGradient_('gradient'); 458 | gradient.x0_ = aX0; 459 | gradient.y0_ = aY0; 460 | gradient.x1_ = aX1; 461 | gradient.y1_ = aY1; 462 | return gradient; 463 | }; 464 | 465 | contextPrototype.createRadialGradient = function(aX0, aY0, aR0, 466 | aX1, aY1, aR1) { 467 | var gradient = new CanvasGradient_('gradientradial'); 468 | gradient.x0_ = aX0; 469 | gradient.y0_ = aY0; 470 | gradient.r0_ = aR0; 471 | gradient.x1_ = aX1; 472 | gradient.y1_ = aY1; 473 | gradient.r1_ = aR1; 474 | return gradient; 475 | }; 476 | 477 | contextPrototype.drawImage = function(image, var_args) { 478 | var dx, dy, dw, dh, sx, sy, sw, sh; 479 | 480 | // to find the original width we overide the width and height 481 | var oldRuntimeWidth = image.runtimeStyle.width; 482 | var oldRuntimeHeight = image.runtimeStyle.height; 483 | image.runtimeStyle.width = 'auto'; 484 | image.runtimeStyle.height = 'auto'; 485 | 486 | // get the original size 487 | var w = image.width; 488 | var h = image.height; 489 | 490 | // and remove overides 491 | image.runtimeStyle.width = oldRuntimeWidth; 492 | image.runtimeStyle.height = oldRuntimeHeight; 493 | 494 | if (arguments.length == 3) { 495 | dx = arguments[1]; 496 | dy = arguments[2]; 497 | sx = sy = 0; 498 | sw = dw = w; 499 | sh = dh = h; 500 | } else if (arguments.length == 5) { 501 | dx = arguments[1]; 502 | dy = arguments[2]; 503 | dw = arguments[3]; 504 | dh = arguments[4]; 505 | sx = sy = 0; 506 | sw = w; 507 | sh = h; 508 | } else if (arguments.length == 9) { 509 | sx = arguments[1]; 510 | sy = arguments[2]; 511 | sw = arguments[3]; 512 | sh = arguments[4]; 513 | dx = arguments[5]; 514 | dy = arguments[6]; 515 | dw = arguments[7]; 516 | dh = arguments[8]; 517 | } else { 518 | throw Error('Invalid number of arguments'); 519 | } 520 | 521 | var d = this.getCoords_(dx, dy); 522 | 523 | var w2 = sw / 2; 524 | var h2 = sh / 2; 525 | 526 | var vmlStr = []; 527 | 528 | var W = 10; 529 | var H = 10; 530 | 531 | // For some reason that I've now forgotten, using divs didn't work 532 | vmlStr.push(' ' , 571 | '', 579 | ''); 580 | 581 | this.element_.insertAdjacentHTML('BeforeEnd', 582 | vmlStr.join('')); 583 | }; 584 | 585 | contextPrototype.stroke = function(aFill) { 586 | var lineStr = []; 587 | var lineOpen = false; 588 | var a = processStyle(aFill ? this.fillStyle : this.strokeStyle); 589 | var color = a.color; 590 | var opacity = a.alpha * this.globalAlpha; 591 | 592 | var W = 10; 593 | var H = 10; 594 | 595 | lineStr.push(''); 662 | 663 | if (!aFill) { 664 | var lineWidth = this.lineScale_ * this.lineWidth; 665 | 666 | // VML cannot correctly render a line if the width is less than 1px. 667 | // In that case, we dilute the color to make the line look thinner. 668 | if (lineWidth < 1) { 669 | opacity *= lineWidth; 670 | } 671 | 672 | lineStr.push( 673 | '' 680 | ); 681 | } else if (typeof this.fillStyle == 'object') { 682 | var fillStyle = this.fillStyle; 683 | var angle = 0; 684 | var focus = {x: 0, y: 0}; 685 | 686 | // additional offset 687 | var shift = 0; 688 | // scale factor for offset 689 | var expansion = 1; 690 | 691 | if (fillStyle.type_ == 'gradient') { 692 | var x0 = fillStyle.x0_ / this.arcScaleX_; 693 | var y0 = fillStyle.y0_ / this.arcScaleY_; 694 | var x1 = fillStyle.x1_ / this.arcScaleX_; 695 | var y1 = fillStyle.y1_ / this.arcScaleY_; 696 | var p0 = this.getCoords_(x0, y0); 697 | var p1 = this.getCoords_(x1, y1); 698 | var dx = p1.x - p0.x; 699 | var dy = p1.y - p0.y; 700 | angle = Math.atan2(dx, dy) * 180 / Math.PI; 701 | 702 | // The angle should be a non-negative number. 703 | if (angle < 0) { 704 | angle += 360; 705 | } 706 | 707 | // Very small angles produce an unexpected result because they are 708 | // converted to a scientific notation string. 709 | if (angle < 1e-6) { 710 | angle = 0; 711 | } 712 | } else { 713 | var p0 = this.getCoords_(fillStyle.x0_, fillStyle.y0_); 714 | var width = max.x - min.x; 715 | var height = max.y - min.y; 716 | focus = { 717 | x: (p0.x - min.x) / width, 718 | y: (p0.y - min.y) / height 719 | }; 720 | 721 | width /= this.arcScaleX_ * Z; 722 | height /= this.arcScaleY_ * Z; 723 | var dimension = m.max(width, height); 724 | shift = 2 * fillStyle.r0_ / dimension; 725 | expansion = 2 * fillStyle.r1_ / dimension - shift; 726 | } 727 | 728 | // We need to sort the color stops in ascending order by offset, 729 | // otherwise IE won't interpret it correctly. 730 | var stops = fillStyle.colors_; 731 | stops.sort(function(cs1, cs2) { 732 | return cs1.offset - cs2.offset; 733 | }); 734 | 735 | var length = stops.length; 736 | var color1 = stops[0].color; 737 | var color2 = stops[length - 1].color; 738 | var opacity1 = stops[0].alpha * this.globalAlpha; 739 | var opacity2 = stops[length - 1].alpha * this.globalAlpha; 740 | 741 | var colors = []; 742 | for (var i = 0; i < length; i++) { 743 | var stop = stops[i]; 744 | colors.push(stop.offset * expansion + shift + ' ' + stop.color); 745 | } 746 | 747 | // When colors attribute is used, the meanings of opacity and o:opacity2 748 | // are reversed. 749 | lineStr.push(''); 758 | } else { 759 | lineStr.push(''); 761 | } 762 | 763 | lineStr.push(''); 764 | 765 | this.element_.insertAdjacentHTML('beforeEnd', lineStr.join('')); 766 | }; 767 | 768 | contextPrototype.fill = function() { 769 | this.stroke(true); 770 | } 771 | 772 | contextPrototype.closePath = function() { 773 | this.currentPath_.push({type: 'close'}); 774 | }; 775 | 776 | /** 777 | * @private 778 | */ 779 | contextPrototype.getCoords_ = function(aX, aY) { 780 | var m = this.m_; 781 | return { 782 | x: Z * (aX * m[0][0] + aY * m[1][0] + m[2][0]) - Z2, 783 | y: Z * (aX * m[0][1] + aY * m[1][1] + m[2][1]) - Z2 784 | } 785 | }; 786 | 787 | contextPrototype.save = function() { 788 | var o = {}; 789 | copyState(this, o); 790 | this.aStack_.push(o); 791 | this.mStack_.push(this.m_); 792 | this.m_ = matrixMultiply(createMatrixIdentity(), this.m_); 793 | }; 794 | 795 | contextPrototype.restore = function() { 796 | copyState(this.aStack_.pop(), this); 797 | this.m_ = this.mStack_.pop(); 798 | }; 799 | 800 | function matrixIsFinite(m) { 801 | for (var j = 0; j < 3; j++) { 802 | for (var k = 0; k < 2; k++) { 803 | if (!isFinite(m[j][k]) || isNaN(m[j][k])) { 804 | return false; 805 | } 806 | } 807 | } 808 | return true; 809 | } 810 | 811 | function setM(ctx, m, updateLineScale) { 812 | if (!matrixIsFinite(m)) { 813 | return; 814 | } 815 | ctx.m_ = m; 816 | 817 | if (updateLineScale) { 818 | // Get the line scale. 819 | // Determinant of this.m_ means how much the area is enlarged by the 820 | // transformation. So its square root can be used as a scale factor 821 | // for width. 822 | var det = m[0][0] * m[1][1] - m[0][1] * m[1][0]; 823 | ctx.lineScale_ = sqrt(abs(det)); 824 | } 825 | } 826 | 827 | contextPrototype.translate = function(aX, aY) { 828 | var m1 = [ 829 | [1, 0, 0], 830 | [0, 1, 0], 831 | [aX, aY, 1] 832 | ]; 833 | 834 | setM(this, matrixMultiply(m1, this.m_), false); 835 | }; 836 | 837 | contextPrototype.rotate = function(aRot) { 838 | var c = mc(aRot); 839 | var s = ms(aRot); 840 | 841 | var m1 = [ 842 | [c, s, 0], 843 | [-s, c, 0], 844 | [0, 0, 1] 845 | ]; 846 | 847 | setM(this, matrixMultiply(m1, this.m_), false); 848 | }; 849 | 850 | contextPrototype.scale = function(aX, aY) { 851 | this.arcScaleX_ *= aX; 852 | this.arcScaleY_ *= aY; 853 | var m1 = [ 854 | [aX, 0, 0], 855 | [0, aY, 0], 856 | [0, 0, 1] 857 | ]; 858 | 859 | setM(this, matrixMultiply(m1, this.m_), true); 860 | }; 861 | 862 | contextPrototype.transform = function(m11, m12, m21, m22, dx, dy) { 863 | var m1 = [ 864 | [m11, m12, 0], 865 | [m21, m22, 0], 866 | [dx, dy, 1] 867 | ]; 868 | 869 | setM(this, matrixMultiply(m1, this.m_), true); 870 | }; 871 | 872 | contextPrototype.setTransform = function(m11, m12, m21, m22, dx, dy) { 873 | var m = [ 874 | [m11, m12, 0], 875 | [m21, m22, 0], 876 | [dx, dy, 1] 877 | ]; 878 | 879 | setM(this, m, true); 880 | }; 881 | 882 | /******** STUBS ********/ 883 | contextPrototype.clip = function() { 884 | // TODO: Implement 885 | }; 886 | 887 | contextPrototype.arcTo = function() { 888 | // TODO: Implement 889 | }; 890 | 891 | contextPrototype.createPattern = function() { 892 | return new CanvasPattern_; 893 | }; 894 | 895 | // Gradient / Pattern Stubs 896 | function CanvasGradient_(aType) { 897 | this.type_ = aType; 898 | this.x0_ = 0; 899 | this.y0_ = 0; 900 | this.r0_ = 0; 901 | this.x1_ = 0; 902 | this.y1_ = 0; 903 | this.r1_ = 0; 904 | this.colors_ = []; 905 | } 906 | 907 | CanvasGradient_.prototype.addColorStop = function(aOffset, aColor) { 908 | aColor = processStyle(aColor); 909 | this.colors_.push({offset: aOffset, 910 | color: aColor.color, 911 | alpha: aColor.alpha}); 912 | }; 913 | 914 | function CanvasPattern_() {} 915 | 916 | // set up externs 917 | G_vmlCanvasManager = G_vmlCanvasManager_; 918 | CanvasRenderingContext2D = CanvasRenderingContext2D_; 919 | CanvasGradient = CanvasGradient_; 920 | CanvasPattern = CanvasPattern_; 921 | 922 | })(); 923 | 924 | } // if 925 | -------------------------------------------------------------------------------- /js/filesaver/FileSaver.js: -------------------------------------------------------------------------------- 1 | /* FileSaver.js 2 | * A saveAs() FileSaver implementation. 3 | * 2014-12-17 4 | * 5 | * By Eli Grey, http://eligrey.com 6 | * License: X11/MIT 7 | * See https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md 8 | */ 9 | 10 | /*global self */ 11 | /*jslint bitwise: true, indent: 4, laxbreak: true, laxcomma: true, smarttabs: true, plusplus: true */ 12 | 13 | /*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */ 14 | 15 | var saveAs = saveAs 16 | // IE 10+ (native saveAs) 17 | || (typeof navigator !== "undefined" && 18 | navigator.msSaveOrOpenBlob && navigator.msSaveOrOpenBlob.bind(navigator)) 19 | // Everyone else 20 | || (function(view) { 21 | "use strict"; 22 | // IE <10 is explicitly unsupported 23 | if (typeof navigator !== "undefined" && 24 | /MSIE [1-9]\./.test(navigator.userAgent)) { 25 | return; 26 | } 27 | var 28 | doc = view.document 29 | // only get URL when necessary in case Blob.js hasn't overridden it yet 30 | , get_URL = function() { 31 | return view.URL || view.webkitURL || view; 32 | } 33 | , save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a") 34 | , can_use_save_link = "download" in save_link 35 | , click = function(node) { 36 | var event = doc.createEvent("MouseEvents"); 37 | event.initMouseEvent( 38 | "click", true, false, view, 0, 0, 0, 0, 0 39 | , false, false, false, false, 0, null 40 | ); 41 | node.dispatchEvent(event); 42 | } 43 | , webkit_req_fs = view.webkitRequestFileSystem 44 | , req_fs = view.requestFileSystem || webkit_req_fs || view.mozRequestFileSystem 45 | , throw_outside = function(ex) { 46 | (view.setImmediate || view.setTimeout)(function() { 47 | throw ex; 48 | }, 0); 49 | } 50 | , force_saveable_type = "application/octet-stream" 51 | , fs_min_size = 0 52 | // See https://code.google.com/p/chromium/issues/detail?id=375297#c7 and 53 | // https://github.com/eligrey/FileSaver.js/commit/485930a#commitcomment-8768047 54 | // for the reasoning behind the timeout and revocation flow 55 | , arbitrary_revoke_timeout = 500 // in ms 56 | , revoke = function(file) { 57 | var revoker = function() { 58 | if (typeof file === "string") { // file is an object URL 59 | get_URL().revokeObjectURL(file); 60 | } else { // file is a File 61 | file.remove(); 62 | } 63 | }; 64 | if (view.chrome) { 65 | revoker(); 66 | } else { 67 | setTimeout(revoker, arbitrary_revoke_timeout); 68 | } 69 | } 70 | , dispatch = function(filesaver, event_types, event) { 71 | event_types = [].concat(event_types); 72 | var i = event_types.length; 73 | while (i--) { 74 | var listener = filesaver["on" + event_types[i]]; 75 | if (typeof listener === "function") { 76 | try { 77 | listener.call(filesaver, event || filesaver); 78 | } catch (ex) { 79 | throw_outside(ex); 80 | } 81 | } 82 | } 83 | } 84 | , FileSaver = function(blob, name) { 85 | // First try a.download, then web filesystem, then object URLs 86 | var 87 | filesaver = this 88 | , type = blob.type 89 | , blob_changed = false 90 | , object_url 91 | , target_view 92 | , dispatch_all = function() { 93 | dispatch(filesaver, "writestart progress write writeend".split(" ")); 94 | } 95 | // on any filesys errors revert to saving with object URLs 96 | , fs_error = function() { 97 | // don't create more object URLs than needed 98 | if (blob_changed || !object_url) { 99 | object_url = get_URL().createObjectURL(blob); 100 | } 101 | if (target_view) { 102 | target_view.location.href = object_url; 103 | } else { 104 | var new_tab = view.open(object_url, "_blank"); 105 | if (new_tab == undefined && typeof safari !== "undefined") { 106 | //Apple do not allow window.open, see http://bit.ly/1kZffRI 107 | view.location.href = object_url 108 | } 109 | } 110 | filesaver.readyState = filesaver.DONE; 111 | dispatch_all(); 112 | revoke(object_url); 113 | } 114 | , abortable = function(func) { 115 | return function() { 116 | if (filesaver.readyState !== filesaver.DONE) { 117 | return func.apply(this, arguments); 118 | } 119 | }; 120 | } 121 | , create_if_not_found = {create: true, exclusive: false} 122 | , slice 123 | ; 124 | filesaver.readyState = filesaver.INIT; 125 | if (!name) { 126 | name = "download"; 127 | } 128 | if (can_use_save_link) { 129 | object_url = get_URL().createObjectURL(blob); 130 | save_link.href = object_url; 131 | save_link.download = name; 132 | click(save_link); 133 | filesaver.readyState = filesaver.DONE; 134 | dispatch_all(); 135 | revoke(object_url); 136 | return; 137 | } 138 | // Object and web filesystem URLs have a problem saving in Google Chrome when 139 | // viewed in a tab, so I force save with application/octet-stream 140 | // http://code.google.com/p/chromium/issues/detail?id=91158 141 | // Update: Google errantly closed 91158, I submitted it again: 142 | // https://code.google.com/p/chromium/issues/detail?id=389642 143 | if (view.chrome && type && type !== force_saveable_type) { 144 | slice = blob.slice || blob.webkitSlice; 145 | blob = slice.call(blob, 0, blob.size, force_saveable_type); 146 | blob_changed = true; 147 | } 148 | // Since I can't be sure that the guessed media type will trigger a download 149 | // in WebKit, I append .download to the filename. 150 | // https://bugs.webkit.org/show_bug.cgi?id=65440 151 | if (webkit_req_fs && name !== "download") { 152 | name += ".download"; 153 | } 154 | if (type === force_saveable_type || webkit_req_fs) { 155 | target_view = view; 156 | } 157 | if (!req_fs) { 158 | fs_error(); 159 | return; 160 | } 161 | fs_min_size += blob.size; 162 | req_fs(view.TEMPORARY, fs_min_size, abortable(function(fs) { 163 | fs.root.getDirectory("saved", create_if_not_found, abortable(function(dir) { 164 | var save = function() { 165 | dir.getFile(name, create_if_not_found, abortable(function(file) { 166 | file.createWriter(abortable(function(writer) { 167 | writer.onwriteend = function(event) { 168 | target_view.location.href = file.toURL(); 169 | filesaver.readyState = filesaver.DONE; 170 | dispatch(filesaver, "writeend", event); 171 | revoke(file); 172 | }; 173 | writer.onerror = function() { 174 | var error = writer.error; 175 | if (error.code !== error.ABORT_ERR) { 176 | fs_error(); 177 | } 178 | }; 179 | "writestart progress write abort".split(" ").forEach(function(event) { 180 | writer["on" + event] = filesaver["on" + event]; 181 | }); 182 | writer.write(blob); 183 | filesaver.abort = function() { 184 | writer.abort(); 185 | filesaver.readyState = filesaver.DONE; 186 | }; 187 | filesaver.readyState = filesaver.WRITING; 188 | }), fs_error); 189 | }), fs_error); 190 | }; 191 | dir.getFile(name, {create: false}, abortable(function(file) { 192 | // delete file if it already exists 193 | file.remove(); 194 | save(); 195 | }), abortable(function(ex) { 196 | if (ex.code === ex.NOT_FOUND_ERR) { 197 | save(); 198 | } else { 199 | fs_error(); 200 | } 201 | })); 202 | }), fs_error); 203 | }), fs_error); 204 | } 205 | , FS_proto = FileSaver.prototype 206 | , saveAs = function(blob, name) { 207 | return new FileSaver(blob, name); 208 | } 209 | ; 210 | FS_proto.abort = function() { 211 | var filesaver = this; 212 | filesaver.readyState = filesaver.DONE; 213 | dispatch(filesaver, "abort"); 214 | }; 215 | FS_proto.readyState = FS_proto.INIT = 0; 216 | FS_proto.WRITING = 1; 217 | FS_proto.DONE = 2; 218 | 219 | FS_proto.error = 220 | FS_proto.onwritestart = 221 | FS_proto.onprogress = 222 | FS_proto.onwrite = 223 | FS_proto.onabort = 224 | FS_proto.onerror = 225 | FS_proto.onwriteend = 226 | null; 227 | 228 | return saveAs; 229 | }( 230 | typeof self !== "undefined" && self 231 | || typeof window !== "undefined" && window 232 | || this.content 233 | )); 234 | // `self` is undefined in Firefox for Android content script context 235 | // while `this` is nsIContentFrameMessageManager 236 | // with an attribute `content` that corresponds to the window 237 | 238 | if (typeof module !== "undefined" && module.exports) { 239 | module.exports = saveAs; 240 | } else if ((typeof define !== "undefined" && define !== null) && (define.amd != null)) { 241 | define([], function() { 242 | return saveAs; 243 | }); 244 | } 245 | -------------------------------------------------------------------------------- /js/filesaver/FileSaver.min.js: -------------------------------------------------------------------------------- 1 | /*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */ 2 | var saveAs=saveAs||typeof navigator!=="undefined"&&navigator.msSaveOrOpenBlob&&navigator.msSaveOrOpenBlob.bind(navigator)||function(view){"use strict";if(typeof navigator!=="undefined"&&/MSIE [1-9]\./.test(navigator.userAgent)){return}var doc=view.document,get_URL=function(){return view.URL||view.webkitURL||view},save_link=doc.createElementNS("http://www.w3.org/1999/xhtml","a"),can_use_save_link="download"in save_link,click=function(node){var event=doc.createEvent("MouseEvents");event.initMouseEvent("click",true,false,view,0,0,0,0,0,false,false,false,false,0,null);node.dispatchEvent(event)},webkit_req_fs=view.webkitRequestFileSystem,req_fs=view.requestFileSystem||webkit_req_fs||view.mozRequestFileSystem,throw_outside=function(ex){(view.setImmediate||view.setTimeout)(function(){throw ex},0)},force_saveable_type="application/octet-stream",fs_min_size=0,arbitrary_revoke_timeout=500,revoke=function(file){var revoker=function(){if(typeof file==="string"){get_URL().revokeObjectURL(file)}else{file.remove()}};if(view.chrome){revoker()}else{setTimeout(revoker,arbitrary_revoke_timeout)}},dispatch=function(filesaver,event_types,event){event_types=[].concat(event_types);var i=event_types.length;while(i--){var listener=filesaver["on"+event_types[i]];if(typeof listener==="function"){try{listener.call(filesaver,event||filesaver)}catch(ex){throw_outside(ex)}}}},FileSaver=function(blob,name){var filesaver=this,type=blob.type,blob_changed=false,object_url,target_view,dispatch_all=function(){dispatch(filesaver,"writestart progress write writeend".split(" "))},fs_error=function(){if(blob_changed||!object_url){object_url=get_URL().createObjectURL(blob)}if(target_view){target_view.location.href=object_url}else{var new_tab=view.open(object_url,"_blank");if(new_tab==undefined&&typeof safari!=="undefined"){view.location.href=object_url}}filesaver.readyState=filesaver.DONE;dispatch_all();revoke(object_url)},abortable=function(func){return function(){if(filesaver.readyState!==filesaver.DONE){return func.apply(this,arguments)}}},create_if_not_found={create:true,exclusive:false},slice;filesaver.readyState=filesaver.INIT;if(!name){name="download"}if(can_use_save_link){object_url=get_URL().createObjectURL(blob);save_link.href=object_url;save_link.download=name;click(save_link);filesaver.readyState=filesaver.DONE;dispatch_all();revoke(object_url);return}if(view.chrome&&type&&type!==force_saveable_type){slice=blob.slice||blob.webkitSlice;blob=slice.call(blob,0,blob.size,force_saveable_type);blob_changed=true}if(webkit_req_fs&&name!=="download"){name+=".download"}if(type===force_saveable_type||webkit_req_fs){target_view=view}if(!req_fs){fs_error();return}fs_min_size+=blob.size;req_fs(view.TEMPORARY,fs_min_size,abortable(function(fs){fs.root.getDirectory("saved",create_if_not_found,abortable(function(dir){var save=function(){dir.getFile(name,create_if_not_found,abortable(function(file){file.createWriter(abortable(function(writer){writer.onwriteend=function(event){target_view.location.href=file.toURL();filesaver.readyState=filesaver.DONE;dispatch(filesaver,"writeend",event);revoke(file)};writer.onerror=function(){var error=writer.error;if(error.code!==error.ABORT_ERR){fs_error()}};"writestart progress write abort".split(" ").forEach(function(event){writer["on"+event]=filesaver["on"+event]});writer.write(blob);filesaver.abort=function(){writer.abort();filesaver.readyState=filesaver.DONE};filesaver.readyState=filesaver.WRITING}),fs_error)}),fs_error)};dir.getFile(name,{create:false},abortable(function(file){file.remove();save()}),abortable(function(ex){if(ex.code===ex.NOT_FOUND_ERR){save()}else{fs_error()}}))}),fs_error)}),fs_error)},FS_proto=FileSaver.prototype,saveAs=function(blob,name){return new FileSaver(blob,name)};FS_proto.abort=function(){var filesaver=this;filesaver.readyState=filesaver.DONE;dispatch(filesaver,"abort")};FS_proto.readyState=FS_proto.INIT=0;FS_proto.WRITING=1;FS_proto.DONE=2;FS_proto.error=FS_proto.onwritestart=FS_proto.onprogress=FS_proto.onwrite=FS_proto.onabort=FS_proto.onerror=FS_proto.onwriteend=null;return saveAs}(typeof self!=="undefined"&&self||typeof window!=="undefined"&&window||this.content);if(typeof module!=="undefined"&&module.exports){module.exports=saveAs}else if(typeof define!=="undefined"&&define!==null&&define.amd!=null){define([],function(){return saveAs})} 3 | -------------------------------------------------------------------------------- /js/intro/intro.min.js: -------------------------------------------------------------------------------- 1 | (function(w,p){"object"===typeof exports?p(exports):"function"===typeof define&&define.amd?define(["exports"],p):p(w)})(this,function(w){function p(a){this._targetElement=a;this._options={nextLabel:"Next →",prevLabel:"← Back",skipLabel:"Skip",doneLabel:"Done",tooltipPosition:"bottom",tooltipClass:"",highlightClass:"",exitOnEsc:!0,exitOnOverlayClick:!0,showStepNumbers:!0,keyboardNavigation:!0,showButtons:!0,showBullets:!0,showProgress:!1,scrollToElement:!0,overlayOpacity:0.8,positionPrecedence:["bottom", 2 | "top","right","left"],disableInteraction:!1}}function J(a){var b=[],c=this;if(this._options.steps)for(var d=[],e=0,d=this._options.steps.length;ed.length)return!1;e=0;for(f=d.length;eh.width||0>l.left+l.width/2-s?(q(f,"bottom"),q(f,"top")):(l.height+l.top+p>h.height&& 12 | q(f,"bottom"),0>l.top-p&&q(f,"top"));l.width+l.left+s>h.width&&q(f,"right");0>l.left-s&&q(f,"left");0h.height&&(c.className="introjs-arrow left-bottom",b.style.top="-"+(f-e.height-20)+"px");c.className="introjs-arrow left"; 13 | break;case "left":!0==this._options.showStepNumbers&&(b.style.top="15px");e.top+f>h.height?(b.style.top="-"+(f-e.height-20)+"px",c.className="introjs-arrow right-bottom"):c.className="introjs-arrow right";b.style.right=e.width+20+"px";break;case "floating":c.style.display="none";a=k(b);b.style.left="50%";b.style.top="50%";b.style.marginLeft="-"+a.width/2+"px";b.style.marginTop="-"+a.height/2+"px";"undefined"!=typeof d&&null!=d&&(d.style.left="-"+(a.width/2+18)+"px",d.style.top="-"+(a.height/2+18)+ 14 | "px");break;case "bottom-right-aligned":c.className="introjs-arrow top-right";b.style.right="0px";b.style.bottom="-"+(k(b).height+10)+"px";break;case "bottom-middle-aligned":d=k(a);a=k(b);c.className="introjs-arrow top-middle";b.style.left=d.width/2-a.width/2+"px";b.style.bottom="-"+(a.height+10)+"px";break;default:b.style.bottom="-"+(k(b).height+10)+"px",b.style.left=k(a).width/2-k(b).width/2+"px",c.className="introjs-arrow top"}}}function q(a,b){-1 a.active").className="";d.querySelector('.introjs-bullets li > a[data-stepnumber="'+ 19 | a.step+'"]').className="active";d.querySelector(".introjs-progress .introjs-progressbar").setAttribute("style","width:"+I.call(b)+"%;");s.style.opacity=1;f&&(f.style.opacity=1);-1===r.tabIndex?l.focus():r.focus()},350)}else{var q=document.createElement("div"),m=document.createElement("div"),c=document.createElement("div"),n=document.createElement("div"),w=document.createElement("div"),D=document.createElement("div"),E=document.createElement("div"),u=document.createElement("div");q.className=e;m.className= 20 | "introjs-tooltipReferenceLayer";t.call(b,q);t.call(b,m);this._targetElement.appendChild(q);this._targetElement.appendChild(m);c.className="introjs-arrow";w.className="introjs-tooltiptext";w.innerHTML=a.intro;D.className="introjs-bullets";!1===this._options.showBullets&&(D.style.display="none");for(var q=document.createElement("ul"),e=0,B=this._introItems.length;en||"none"!==u)g.className+=" introjs-fixParent";g=g.parentNode}M(a.element)||!0!==this._options.scrollToElement||(n=a.element.getBoundingClientRect(),g=F().height,c=n.bottom-(n.bottom-n.top),n=n.bottom-g,0>c||a.element.clientHeight>g?window.scrollBy(0,c-30):window.scrollBy(0,n+100));"undefined"!== 27 | typeof this._introAfterChangeCallback&&this._introAfterChangeCallback.call(this,a.element)}function v(a,b){var c="";a.currentStyle?c=a.currentStyle[b]:document.defaultView&&document.defaultView.getComputedStyle&&(c=document.defaultView.getComputedStyle(a,null).getPropertyValue(b));return c&&c.toLowerCase?c.toLowerCase():c}function F(){if(void 0!=window.innerWidth)return{width:window.innerWidth,height:window.innerHeight};var a=document.documentElement;return{width:a.clientWidth,height:a.clientHeight}} 28 | function M(a){a=a.getBoundingClientRect();return 0<=a.top&&0<=a.left&&a.bottom+80<=window.innerHeight&&a.right<=window.innerWidth}function K(a){var b=document.createElement("div"),c="",d=this;b.className="introjs-overlay";if("body"===a.tagName.toLowerCase())c+="top: 0;bottom: 0; left: 0;right: 0;position: fixed;",b.setAttribute("style",c);else{var e=k(a);e&&(c+="width: "+e.width+"px; height:"+e.height+"px; top:"+e.top+"px;left: "+e.left+"px;",b.setAttribute("style",c))}a.appendChild(b);b.onclick= 29 | function(){!0==d._options.exitOnOverlayClick&&(y.call(d,a),void 0!=d._introExitCallback&&d._introExitCallback.call(d))};setTimeout(function(){c+="opacity: "+d._options.overlayOpacity.toString()+";";b.setAttribute("style",c)},10);return!0}function k(a){var b={};b.width=a.offsetWidth;b.height=a.offsetHeight;for(var c=0,d=0;a&&!isNaN(a.offsetLeft)&&!isNaN(a.offsetTop);)c+=a.offsetLeft,d+=a.offsetTop,a=a.offsetParent;b.top=d;b.left=c;return b}function I(){return 100*(parseInt(this._currentStep+1,10)/ 30 | this._introItems.length)}var B=function(a){if("object"===typeof a)return new p(a);if("string"===typeof a){if(a=document.querySelector(a))return new p(a);throw Error("There is no element with given selector.");}return new p(document.body)};B.version="1.0.0";B.fn=p.prototype={clone:function(){return new p(this)},setOption:function(a,b){this._options[a]=b;return this},setOptions:function(a){var b=this._options,c={},d;for(d in b)c[d]=b[d];for(d in a)c[d]=a[d];this._options=c;return this},start:function(){J.call(this, 31 | this._targetElement);return this},goToStep:function(a){this._currentStep=a-2;"undefined"!==typeof this._introItems&&x.call(this);return this},nextStep:function(){x.call(this);return this},previousStep:function(){C.call(this);return this},exit:function(){y.call(this,this._targetElement);return this},refresh:function(){t.call(this,document.querySelector(".introjs-helperLayer"));t.call(this,document.querySelector(".introjs-tooltipReferenceLayer"));return this},onbeforechange:function(a){if("function"=== 32 | typeof a)this._introBeforeChangeCallback=a;else throw Error("Provided callback for onbeforechange was not a function");return this},onchange:function(a){if("function"===typeof a)this._introChangeCallback=a;else throw Error("Provided callback for onchange was not a function.");return this},onafterchange:function(a){if("function"===typeof a)this._introAfterChangeCallback=a;else throw Error("Provided callback for onafterchange was not a function");return this},oncomplete:function(a){if("function"=== 33 | typeof a)this._introCompleteCallback=a;else throw Error("Provided callback for oncomplete was not a function.");return this},onexit:function(a){if("function"===typeof a)this._introExitCallback=a;else throw Error("Provided callback for onexit was not a function.");return this}};return w.introJs=B}); 34 | -------------------------------------------------------------------------------- /js/jscolor/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/js/jscolor/.DS_Store -------------------------------------------------------------------------------- /js/jscolor/arrow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/js/jscolor/arrow.gif -------------------------------------------------------------------------------- /js/jscolor/cross.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/js/jscolor/cross.gif -------------------------------------------------------------------------------- /js/jscolor/hs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/js/jscolor/hs.png -------------------------------------------------------------------------------- /js/jscolor/hv.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hmaidasani/RadialChartImageGenerator/bd648c7dc728d3123eba1c554ba57abcb1a8c5de/js/jscolor/hv.png -------------------------------------------------------------------------------- /js/main.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * RadialChartImageGenerator 3 | * Copyright 2015 Hitesh Maidasani 4 | * Licensed under MIT (https://github.com/hmaidasani/RadialChartImageGenerator/blob/master/LICENSE) 5 | */ 6 | 7 | $(function($) { 8 | // error handling 9 | var gOldOnError = window.onerror; 10 | window.onerror = function myErrorHandler(errorMsg, url, lineNumber) { 11 | ga('send', 'exception', { 12 | 'exDescription': errorMsg, 13 | 'exFatal': true, 14 | 'url': url, 15 | 'lineNumber': lineNumber 16 | }); 17 | if (gOldOnError) { 18 | return gOldOnError(errorMsg, url, lineNumber); 19 | } 20 | return false; 21 | } 22 | var d = new Date(); 23 | $('#copyrightYear').text(d.getFullYear()); 24 | // setup knob arcs 25 | $(".knob").knob({ 26 | }); 27 | $('.shadow-checkbox').change(function() { 28 | $($(this).attr('arc-id')).attr('data-shadow', $(this).is(':checked')).trigger("configure"); 29 | }); 30 | $('.text-checkbox').change(function() { 31 | if($(this).is(':checked')) { 32 | if($(this).attr('data') == 'all-text') { 33 | $($(this).attr('arc-id')).attr('data-displayinput', true).trigger("configure", 34 | {'displayInput': true}); 35 | $('.subtext').removeClass('hidden'); 36 | $($(this).attr('arc-id')).css('color', $($(this).attr('arc-id')).attr('data-inputColor')); 37 | } else if($(this).attr('data') == 'only-subtext') { 38 | $('.subtext').removeClass('hidden'); 39 | $($(this).attr('arc-id')).addClass('with-subtext'); 40 | } 41 | } else { 42 | if($(this).attr('data') == 'all-text') { 43 | $($(this).attr('arc-id')).attr('data-displayinput', false).trigger("configure", 44 | {'displayInput': false}); 45 | $('.subtext').addClass('hidden'); 46 | } else if($(this).attr('data') == 'only-subtext') { 47 | $('.subtext').addClass('hidden'); 48 | $($(this).attr('arc-id')).removeClass('with-subtext'); 49 | } 50 | } 51 | }); 52 | $('.btn-refresh').click(function(e){ 53 | ga('send', 'event', 'button', 'click', 'refresh'); 54 | e.preventDefault(); 55 | 56 | fieldName = $(this).attr('data-field'); 57 | console.log(fieldName); 58 | var input = $("input[name='"+fieldName+"']"); 59 | input.val(input.attr('default-val')).trigger('change'); 60 | if(input.hasClass('color')) { 61 | input.css('background-color', input.attr('default-val')); 62 | rgb = hexToRgb(input.attr('default-val')); 63 | txtcolor = 64 | 0.213 * rgb.r + 65 | 0.715 * rgb.g + 66 | 0.072 * rgb.b 67 | < 0.5 ? '#FFF' : '#000'; 68 | input.css('color', txtcolor); 69 | } 70 | }); 71 | $('.btn-number').click(function(e){ 72 | e.preventDefault(); 73 | 74 | fieldName = $(this).attr('data-field'); 75 | type = $(this).attr('data-type'); 76 | step = Number($(this).attr('data-step')); 77 | var input = $("input[name='"+fieldName+"']"); 78 | var currentVal = Number(input.val()); 79 | 80 | if (!isNaN(currentVal)) { 81 | if(type == 'minus') { 82 | 83 | if(currentVal > input.attr('min')) { 84 | curr = (currentVal - step).toFixed(countDecimals(step)); 85 | input.val(curr).change(); 86 | } 87 | if(Number(input.val()) == Number(input.attr('min'))) { 88 | $(this).attr('disabled', true); 89 | } 90 | 91 | } else if(type == 'plus') { 92 | 93 | if(currentVal < input.attr('max')) { 94 | curr = (currentVal + step).toFixed(countDecimals(step)); 95 | input.val(curr).change(); 96 | } 97 | if(Number(input.val()) == Number(input.attr('max'))) { 98 | $(this).attr('disabled', true); 99 | } 100 | 101 | } 102 | } else { 103 | input.val(0); 104 | } 105 | }); 106 | $('.input-number').focusin(function(){ 107 | $(this).data('oldValue', $(this).val()); 108 | }); 109 | $('.input-number').change(function() { 110 | minValue = parseInt($(this).attr('min')); 111 | maxValue = parseInt($(this).attr('max')); 112 | valueCurrent = parseInt($(this).val()); 113 | 114 | name = $(this).attr('name'); 115 | if(typeof $(this).attr('min') !== 'undefined') 116 | if(valueCurrent >= minValue) { 117 | $(".btn-number[data-type='minus'][data-field='"+name+"']").removeAttr('disabled') 118 | } else { 119 | alert('Sorry, the minimum value was reached'); 120 | $(this).val($(this).data('oldValue')); 121 | return; 122 | } 123 | if(typeof $(this).attr('max') !== 'undefined') 124 | if(valueCurrent <= maxValue) { 125 | $(".btn-number[data-type='plus'][data-field='"+name+"']").removeAttr('disabled') 126 | } else { 127 | alert('Sorry, the maximum value was reached'); 128 | $(this).val($(this).data('oldValue')); 129 | return; 130 | } 131 | changeArc($(this).attr('arc-id'), $(this).attr('data-mod'), $(this).val()); 132 | }); 133 | $(".input-number.only-number").keydown(function (e) { 134 | // Allow: backspace, delete, tab, escape, enter and . 135 | if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 190]) !== -1 || 136 | // Allow: Ctrl+A 137 | (e.keyCode == 65 && e.ctrlKey === true) || 138 | // Allow: home, end, left, right 139 | (e.keyCode >= 35 && e.keyCode <= 39)) { 140 | // let it happen, don't do anything 141 | return; 142 | } 143 | // Ensure that it is a number and stop the keypress 144 | if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) { 145 | e.preventDefault(); 146 | } 147 | }); 148 | 149 | $('#how-to-btn').click(function(e){ 150 | ga('send', 'event', 'button', 'click', 'how-to-btn'); 151 | var intro = introJs(); 152 | intro.setOptions({ 153 | steps: [ 154 | { 155 | intro: "First, decide on whether you need a single, double, or triple arc radial chart." 156 | }, 157 | { 158 | element: '.options .max-value', 159 | intro: "Choose the max value or the capacity of the appropriate arc.", 160 | position: 'right' 161 | }, 162 | { 163 | element: '.options .background-color', 164 | intro: "Choose the arc background color.", 165 | position: 'right' 166 | }, 167 | { 168 | element: '.options .foreground-colors', 169 | intro: 'Decide the color scheme for each appropriate arc. If you would like a gradient color scheme, choose three different colors for the foreground start, mid, and end colors.', 170 | position: 'right' 171 | }, 172 | { 173 | element: '.options .current-value', 174 | intro: "
In order to see how the full arc colors look, choose the current value to be equal to the max value.
Note: the current value has no effect on the output of the images - it is merely there to see how the arc would look at a given value.
", 175 | position: 'right' 176 | }, 177 | { 178 | element: '.options .arc-thickness', 179 | intro: "
Adjust the thickness of the arc.
", 180 | position: 'right' 181 | }, 182 | { 183 | element: '.options .text-color', 184 | intro: 'For the single arc, you may select if text should be visible in the center. You may also select the text color.', 185 | position: 'right' 186 | }, 187 | { 188 | element: '.options .sub-text', 189 | intro: 'You may also select if subtext should be visible and the units to show.', 190 | position: 'right' 191 | }, 192 | { 193 | element: '.generate-btn', 194 | intro: 'Click Generate Images to generate each permutation of images for the given arc structure. Enter the filename prefix of your choice and click on Continue.', 195 | position: 'right' 196 | }, 197 | { 198 | intro: "The images should download in a zip file." 199 | }, 200 | { 201 | intro: "Repeat for all the other arcs if needed." 202 | } 203 | ] 204 | }); 205 | intro.start(); 206 | }); 207 | 208 | var isSafari = /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor); 209 | if (isSafari) $('#browser-alert').modal(); 210 | }); 211 | 212 | 213 | function changeArc(arcId, dataChange, value, doNotLog) { 214 | if(doNotLog) { 215 | // don't send to ga 216 | } else { 217 | ga('send', 'event', 'button', 'click', 'changeArc_' + arcId + '_' + dataChange); 218 | } 219 | var obj = {}; 220 | color = $(arcId).css('color'); 221 | if(dataChange === 'max-value') { 222 | obj = {"max":value}; 223 | $(arcId).attr('data-max', value); 224 | $(arcId).parents('.chart-box').find('.subtext-max').text(value); 225 | } else if(dataChange === 'foreground-color-start') { 226 | obj = {"fgColor":value}; 227 | $(arcId).attr('data-fgcolor', value); 228 | } else if(dataChange === 'foreground-color-mid') { 229 | obj = {"fgColorMid":value}; 230 | $(arcId).attr('data-fgcolormid', value); 231 | } else if(dataChange === 'foreground-color-end') { 232 | obj = {"fgColorEnd":value}; 233 | $(arcId).attr('data-fgcolorend', value); 234 | } else if(dataChange === 'background-color') { 235 | obj = {"bgColor":value, "bgColorMid":value, "bgColorEnd":value}; 236 | $(arcId).attr('data-bgcolor', value); 237 | } else if(dataChange === 'arc-thickness') { 238 | obj = {"thickness":value}; 239 | $(arcId).attr('data-thickness', value); 240 | } else if(dataChange === 'background-thickness') { 241 | obj = {"bgthickness":value}; 242 | $(arcId).attr('data-bgthickness', value); 243 | } else if(dataChange === 'size') { 244 | obj = {"width":value, "height": value}; 245 | $(arcId).attr('data-width', value); 246 | $(arcId).attr('data-height', value); 247 | } else if(dataChange === 'x-position') { 248 | $(arcId).closest('.canvas-box').css('left', value+'px'); 249 | } else if(dataChange === 'y-position') { 250 | $(arcId).closest('.canvas-box').css('top', value+'px'); 251 | } else if(dataChange === 'data-linecap') { 252 | obj = {"lineCap":value}; 253 | $(arcId).attr('data-linecap', value); 254 | } else if(dataChange === 'shadow-color') { 255 | $(arcId).attr('data-shadowColor', value); 256 | } else if(dataChange === 'text-color') { 257 | obj = {"inputColor":value}; 258 | $('.knob').css('color', value); 259 | $('.subtext').css('color', value); 260 | $(arcId).attr('data-inputColor', value); 261 | return; 262 | } else if (dataChange === 'units') { 263 | $('.subtext-units').text(value); 264 | return; 265 | } 266 | obj['inputColor'] = color; 267 | if(dataChange !== 'current-value') { 268 | $(arcId).attr(dataChange, value).trigger("configure", obj); 269 | } else if(dataChange === 'current-value') { 270 | $(arcId).val(value).trigger("change"); 271 | $(arcId).attr('value', value); 272 | } 273 | } 274 | 275 | function showFilenamePrompt(el) { 276 | chart = $(el).attr('chart-box'); 277 | $('#filenamePrompt-submit').attr('chart-box', chart); 278 | chart = chart.replace('#', ''); 279 | chart = chart.replace('arc', ''); 280 | // $('#file-prefix').val(chart); 281 | // $('#file-prefix-output').text(chart); 282 | $("#merge-checkbox").bootstrapSwitch(); 283 | $("#merge-checkbox").bootstrapSwitch('state', false); 284 | handleFilenamePromptEvents(chart, false); 285 | 286 | $('#merge-checkbox').on('switchChange.bootstrapSwitch', function(event, state) { 287 | handleFilenamePromptEvents($("#merge-checkbox").attr('chart-box'), state) 288 | }); 289 | 290 | $('.file-prefix').keyup(function (e) { 291 | $('#file-prefix-output').text($(this).val()); 292 | }); 293 | $('.file-prefix').focus(function (e) { 294 | $('#file-prefix-output').text($(this).val()); 295 | }); 296 | 297 | $('.file-suffix').keyup(function (e) { 298 | $('#file-suffix-output').text($(this).val()); 299 | }); 300 | $('.file-suffix').focus(function (e) { 301 | $('#file-suffix-output').text($(this).val()); 302 | }); 303 | 304 | $('#question-merge').tooltip({title: "This will merge all the arcs into a single image", placement: "right"}); 305 | $('#filenamePrompt').modal('show'); 306 | } 307 | 308 | function handleFilenamePromptEvents(chart, mergeState) { 309 | if(!mergeState) { //called on init, unmerged images 310 | if(chart.indexOf('single') > -1) { 311 | $('#merge-group').hide(); 312 | $("#merge-checkbox").attr('chart-box', ''); 313 | $("#merge-checkbox").attr('chart-box', chart); 314 | $('#filename-group-outer').hide(); 315 | $('#filename-group-middle').hide(); 316 | $('#filename-group-inner').hide(); 317 | $('#filename-group').show(); 318 | $('#file-prefix').val("single"); 319 | $('#file-prefix-output').text("prefix"); 320 | $('#double-file-output').addClass('hidden'); 321 | $('#triple-file-output').addClass('hidden'); 322 | } else if(chart.indexOf('double') > -1) { 323 | $('#merge-group').show(); 324 | $("#merge-checkbox").attr('chart-box', ''); 325 | $("#merge-checkbox").attr('chart-box', chart); 326 | $('#filename-group-outer').show(); 327 | $('#filename-group-middle').hide(); 328 | $('#filename-group-inner').show(); 329 | $('#filename-group').hide(); 330 | $('#file-prefix-output').text("prefix"); 331 | $('#double-file-output').addClass('hidden'); 332 | $('#triple-file-output').addClass('hidden'); 333 | } else if(chart.indexOf('triple') > -1) { 334 | $('#merge-group').show(); 335 | $("#merge-checkbox").attr('chart-box', ''); 336 | $("#merge-checkbox").attr('chart-box', chart); 337 | $('#filename-group-outer').show(); 338 | $('#filename-group-middle').show(); 339 | $('#filename-group-inner').show(); 340 | $('#filename-group').hide(); 341 | $('#file-prefix-output').text("prefix"); 342 | $('#double-file-output').addClass('hidden'); 343 | $('#triple-file-output').addClass('hidden'); 344 | } 345 | } else { //merged images 346 | if(chart.indexOf('double') > -1) { 347 | $('#filename-group-outer').hide(); 348 | $('#filename-group-middle').hide(); 349 | $('#filename-group-inner').hide(); 350 | $('#filename-group').show(); 351 | $('#file-prefix-output').text("prefix"); 352 | $('#double-file-output').removeClass('hidden'); 353 | $('#triple-file-output').addClass('hidden'); 354 | } else if(chart.indexOf('triple') > -1) { 355 | $('#filename-group-outer').hide(); 356 | $('#filename-group-middle').hide(); 357 | $('#filename-group-inner').hide(); 358 | $('#filename-group').show(); 359 | $('#file-prefix-output').text("prefix"); 360 | $('#double-file-output').removeClass('hidden'); 361 | $('#triple-file-output').removeClass('hidden'); 362 | } 363 | } 364 | } 365 | 366 | function generateImages(el) { 367 | $('#filenamePrompt').modal('hide'); 368 | var loading_screen = pleaseWait({ 369 | logo: "", 370 | backgroundColor: 'rgba(0,0,0,0.7)', 371 | loadingHtml: "

Generating images. Please wait a minute.

" 372 | }); 373 | setTimeout(function() { 374 | var merge = $('#merge-checkbox').bootstrapSwitch('state'); 375 | var filePrefix = $('#file-prefix').val(); 376 | var filePrefixOuter = $('#outer-file-prefix').val(); 377 | var filePrefixMiddle = $('#middle-file-prefix').val(); 378 | var filePrefixInner = $('#inner-file-prefix').val(); 379 | var fileSuffix = $('#file-suffix').val(); 380 | var canvasList = $($(el).attr('chart-box') + ' canvas'); 381 | var can = document.createElement('canvas'); 382 | offset = 0; 383 | can.width = 300 + offset; 384 | can.height = 300 + offset; 385 | var ctx = can.getContext('2d'); 386 | 387 | var zip = new JSZip(); 388 | var img = zip.folder("images"); 389 | ga('send', 'event', 'button', 'click', 'generateImages_arc'+canvasList.length); 390 | 391 | if(canvasList.length == 3) { 392 | var size = calculateSize(canvasList, 3); 393 | can.width = size.width; 394 | can.height = size.height; 395 | if(merge) { 396 | for(i = parseInt($(canvasList[0]).next().attr('data-min')); i <= parseInt($(canvasList[0]).next().attr('data-max')); i++) { 397 | for(j = parseInt($(canvasList[1]).next().attr('data-min')); j <= parseInt($(canvasList[1]).next().attr('data-max')); j++) { 398 | for(k = parseInt($(canvasList[2]).next().attr('data-min')); k <= parseInt($(canvasList[2]).next().attr('data-max')); k++) { 399 | changeArc('#'+$(canvasList[0]).next().attr('id'), 'current-value', i, true); 400 | changeArc('#'+$(canvasList[1]).next().attr('id'), 'current-value', j, true); 401 | changeArc('#'+$(canvasList[2]).next().attr('id'), 'current-value', k, true); 402 | //merge arcs 403 | for(x = 0; x < canvasList.length; x++) { 404 | ctx.drawImage(canvasList[x], parseInt($(canvasList[x]).closest('.canvas-box').css('left'))+offset/2, parseInt($(canvasList[x]).closest('.canvas-box').css('top'))+offset/2, parseInt($(canvasList[x]).css('width')), parseInt($(canvasList[x]).css('height'))); 405 | } 406 | filename = filePrefix+i+'-'+j+'-'+k+fileSuffix+".png"; 407 | img.file(filename, can.toDataURL("image/png").substring(22), {base64: true}); 408 | ctx.clearRect(0, 0, can.width, can.height); 409 | } 410 | } 411 | } 412 | } else { 413 | for(x = 0; x < canvasList.length; x++) { 414 | for(i = parseInt($(canvasList[x]).next().attr('data-min')); i <= parseInt($(canvasList[x]).next().attr('data-max')); i++) { 415 | changeArc('#'+$(canvasList[x]).next().attr('id'), 'current-value', i, true); 416 | ctx.drawImage(canvasList[x], parseInt($(canvasList[x]).closest('.canvas-box').css('left'))+offset/2, parseInt($(canvasList[x]).closest('.canvas-box').css('top'))+offset/2, parseInt($(canvasList[x]).css('width')), parseInt($(canvasList[x]).css('height'))); 417 | if(x === 0) 418 | filename = filePrefixOuter; 419 | if(x === 1) 420 | filename = filePrefixMiddle; 421 | if(x === 2) 422 | filename = filePrefixInner; 423 | filename += i+fileSuffix+".png"; 424 | img.file(filename, can.toDataURL("image/png").substring(22), {base64: true}); 425 | ctx.clearRect(0, 0, can.width, can.height); 426 | } 427 | } 428 | } 429 | } else if(canvasList.length == 2) { 430 | var size = calculateSize(canvasList, 2); 431 | can.width = size.width; 432 | can.height = size.height; 433 | if(merge) { 434 | for(i = parseInt($(canvasList[0]).next().attr('data-min')); i <= parseInt($(canvasList[0]).next().attr('data-max')); i++) { 435 | for(j = parseInt($(canvasList[1]).next().attr('data-min')); j <= parseInt($(canvasList[1]).next().attr('data-max')); j++) { 436 | changeArc('#'+$(canvasList[0]).next().attr('id'), 'current-value', i, true); 437 | changeArc('#'+$(canvasList[1]).next().attr('id'), 'current-value', j, true); 438 | //merge arcs 439 | for(x = 0; x < canvasList.length; x++) { 440 | ctx.drawImage(canvasList[x], parseInt($(canvasList[x]).closest('.canvas-box').css('left'))+offset/2, parseInt($(canvasList[x]).closest('.canvas-box').css('top'))+offset/2, parseInt($(canvasList[x]).css('width')), parseInt($(canvasList[x]).css('height'))); 441 | } 442 | filename = filePrefix+i+'-'+j+fileSuffix+".png"; 443 | img.file(filename, can.toDataURL("image/png").substring(22), {base64: true}); 444 | ctx.clearRect(0, 0, can.width, can.height); 445 | } 446 | } 447 | } else { 448 | for(x = 0; x < canvasList.length; x++) { 449 | for(i = parseInt($(canvasList[x]).next().attr('data-min')); i <= parseInt($(canvasList[x]).next().attr('data-max')); i++) { 450 | changeArc('#'+$(canvasList[x]).next().attr('id'), 'current-value', i, true); 451 | ctx.drawImage(canvasList[x], parseInt($(canvasList[x]).closest('.canvas-box').css('left'))+offset/2, parseInt($(canvasList[x]).closest('.canvas-box').css('top'))+offset/2, parseInt($(canvasList[x]).css('width')), parseInt($(canvasList[x]).css('height'))); 452 | if(x === 0) 453 | filename = filePrefixOuter; 454 | if(x === 1) 455 | filename = filePrefixInner; 456 | filename += i+fileSuffix+".png"; 457 | img.file(filename, can.toDataURL("image/png").substring(22), {base64: true}); 458 | ctx.clearRect(0, 0, can.width, can.height); 459 | } 460 | } 461 | } 462 | } else if(canvasList.length == 1) { 463 | var size = calculateSize(canvasList, 1); 464 | can.width = size.width; 465 | can.height = size.height; 466 | for(i = parseInt($(canvasList[0]).next().attr('data-min')); i <= parseInt($(canvasList[0]).next().attr('data-max')); i++) { 467 | changeArc('#'+$(canvasList[0]).next().attr('id'), 'current-value', i, true); 468 | //merge arcs 469 | ctx.drawImage(canvasList[0], parseInt($(canvasList[0]).closest('.canvas-box').css('left'))+offset/2, parseInt($(canvasList[0]).closest('.canvas-box').css('top'))+offset/2, parseInt($(canvasList[0]).css('width')), parseInt($(canvasList[0]).css('height'))); 470 | //add text 471 | if($('#'+$(canvasList[0]).next().attr('id')).attr('data-displayinput') == 'true' 472 | && $('.subtext').hasClass('hidden')) { 473 | value = $('#'+$(canvasList[0]).next().attr('id')).val(); 474 | font = $('#'+$(canvasList[0]).next().attr('id')).css('font-size') + ' ' + $('#'+$(canvasList[0]).next().attr('id')).css('font-family').split(',')[0]; 475 | color = $('#'+$(canvasList[0]).next().attr('id')).css('color'); 476 | ctx.font=font; 477 | ctx.fillStyle = color; 478 | textWidth = ctx.measureText(value).width; 479 | ctx.textAlign = 'center'; 480 | ctx.textBaseline = 'middle'; 481 | ctx.fillText(value, (can.width/2), (can.height/2)); 482 | } else if($('#'+$(canvasList[0]).next().attr('id')).attr('data-displayinput') == 'true' 483 | && !$('.subtext').hasClass('hidden')) { 484 | value = $('#'+$(canvasList[0]).next().attr('id')).val(); 485 | font = $('#'+$(canvasList[0]).next().attr('id')).css('font-size') + ' ' + $('#'+$(canvasList[0]).next().attr('id')).css('font-family').split(',')[0]; 486 | color = $('#'+$(canvasList[0]).next().attr('id')).css('color'); 487 | ctx.font=font; 488 | ctx.fillStyle = color; 489 | textWidth = ctx.measureText(value).width; 490 | textHeight = ctx.measureText(value).height; 491 | ctx.textAlign = 'center'; 492 | ctx.textBaseline = 'middle'; 493 | ctx.fillText(value, (can.width/2), (can.height/2)-15); 494 | 495 | value = $('.subtext').text().toUpperCase(); 496 | font = $('.subtext').css('font-size') + ' ' + $('.subtext').css('font-family').split(',')[0]; 497 | color = $('.subtext').css('color'); 498 | ctx.font=font; 499 | ctx.fillStyle = color; 500 | textWidth2 = ctx.measureText(value).width; 501 | ctx.textAlign = 'center'; 502 | ctx.textBaseline = 'middle'; 503 | ctx.fillText(value, (can.width/2), (can.height/2)+35); 504 | } 505 | filename = filePrefix+i+fileSuffix+".png"; 506 | img.file(filename, can.toDataURL("image/png").substring(22), {base64: true}); 507 | ctx.clearRect(0, 0, can.width, can.height); 508 | } 509 | } 510 | var content = zip.generate({type:"blob"}); 511 | saveAs(content, "images.zip"); 512 | },1000); 513 | 514 | loading_screen.finish(); 515 | } 516 | 517 | function calculateSize(canvasList, arcs) { 518 | var obj = {}; 519 | if(arcs === 3) { 520 | var left0 = $(canvasList[0]).closest('.canvas-box').offset().left; 521 | var left1 = $(canvasList[1]).closest('.canvas-box').offset().left; 522 | var left2 = $(canvasList[2]).closest('.canvas-box').offset().left; 523 | var top0 = $(canvasList[0]).closest('.canvas-box').offset().top; 524 | var top1 = $(canvasList[1]).closest('.canvas-box').offset().top; 525 | var top2 = $(canvasList[2]).closest('.canvas-box').offset().top; 526 | var right0 = left0 + parseInt($(canvasList[0]).next().attr('data-width')); 527 | var right1 = left1 + parseInt($(canvasList[1]).next().attr('data-width')); 528 | var right2 = left2 + parseInt($(canvasList[2]).next().attr('data-width')); 529 | var bottom0 = top0 + parseInt($(canvasList[0]).next().attr('data-height')); 530 | var bottom1 = top1 + parseInt($(canvasList[1]).next().attr('data-height')); 531 | var bottom2 = top2 + parseInt($(canvasList[2]).next().attr('data-height')); 532 | obj.width = Math.max(right0, right1, right2) - Math.min(left0, left1, left2); 533 | obj.height = Math.max(bottom0, bottom1, bottom2) - Math.min(top0, top1, top2); 534 | } else if(arcs === 2) { 535 | var left0 = $(canvasList[0]).closest('.canvas-box').offset().left; 536 | var left1 = $(canvasList[1]).closest('.canvas-box').offset().left; 537 | var top0 = $(canvasList[0]).closest('.canvas-box').offset().top; 538 | var top1 = $(canvasList[1]).closest('.canvas-box').offset().top; 539 | var right0 = left0 + parseInt($(canvasList[0]).next().attr('data-width')); 540 | var right1 = left1 + parseInt($(canvasList[1]).next().attr('data-width')); 541 | var bottom0 = top0 + parseInt($(canvasList[0]).next().attr('data-height')); 542 | var bottom1 = top1 + parseInt($(canvasList[1]).next().attr('data-height')); 543 | obj.width = Math.max(right0, right1) - Math.min(left0, left1); 544 | obj.height = Math.max(bottom0, bottom1) - Math.min(top0, top1); 545 | } else if(arcs === 1) { 546 | var left0 = $(canvasList[0]).closest('.canvas-box').offset().left; 547 | var top0 = $(canvasList[0]).closest('.canvas-box').offset().top; 548 | var right0 = left0 + parseInt($(canvasList[0]).next().attr('data-width')); 549 | var bottom0 = top0 + parseInt($(canvasList[0]).next().attr('data-height')); 550 | obj.width = right0 - left0; 551 | obj.height = bottom0 - top0; 552 | } 553 | return obj; 554 | } 555 | 556 | function hexToRgb(hex) { 557 | // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF") 558 | var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i; 559 | hex = hex.replace(shorthandRegex, function(m, r, g, b) { 560 | return r + r + g + g + b + b; 561 | }); 562 | 563 | var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); 564 | return result ? { 565 | r: parseInt(result[1], 16)/255, 566 | g: parseInt(result[2], 16)/255, 567 | b: parseInt(result[3], 16)/255 568 | } : null; 569 | } 570 | 571 | var countDecimals = function (value) { 572 | if(Math.floor(value) === value) return 0; 573 | return value.toString().split(".")[1].length || 0; 574 | } 575 | 576 | 577 | -------------------------------------------------------------------------------- /js/npm.js: -------------------------------------------------------------------------------- 1 | // This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment. 2 | require('../../js/transition.js') 3 | require('../../js/alert.js') 4 | require('../../js/button.js') 5 | require('../../js/carousel.js') 6 | require('../../js/collapse.js') 7 | require('../../js/dropdown.js') 8 | require('../../js/modal.js') 9 | require('../../js/tooltip.js') 10 | require('../../js/popover.js') 11 | require('../../js/scrollspy.js') 12 | require('../../js/tab.js') 13 | require('../../js/affix.js') -------------------------------------------------------------------------------- /js/options.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * RadialChartImageGenerator 3 | * Copyright 2015 Hitesh Maidasani 4 | * Licensed under MIT (https://github.com/hmaidasani/RadialChartImageGenerator/blob/master/LICENSE) 5 | */ 6 | 7 | $(function($) { 8 | chartcolList = $('.charts-row .col-md-4'); 9 | for(i = 0; i < chartcolList.length; i++) { 10 | arcInputs = $(chartcolList[i]).find('input.knob'); 11 | optionsDiv = $(chartcolList[i]).find('.chart-options'); 12 | 13 | for(j=0; j', {class:'options'}).append($('

', {text:title})).appendTo(optionsDiv); 48 | for(option in data) { 49 | var divoptionrow = $('
', {class:'option-row '+option.replace(/ /g, '-').toLowerCase()}).appendTo(divoptions).append($('
', {class:'text', text:option+':'})); 50 | var divinputarea = $('
', {class:'input-area'}).appendTo(divoptionrow); 51 | var divinputgroup = $('
', {class:'input-group'}).appendTo(divinputarea); 52 | var inputbox = $('', { 53 | class:'form-control input-number', 54 | 'type':'text', 55 | 'name':titleArr[0].toLowerCase()+titleArr[1].toLowerCase()+'_'+option.split(' ').join('-').toLowerCase(), 56 | 'default-val':data[option], 57 | 'value':data[option], 58 | 'arc-id':"#"+arcId, 59 | 'data-mod':option.split(' ').join('-').toLowerCase() 60 | }); 61 | if(typeof data[option] === "number") { 62 | var datastep = 1; 63 | if(data[option] % 1 !== 0) { 64 | datastep = 0.01; 65 | } 66 | // minus button 67 | var spaninputbtnminus = $('', {class:'input-group-btn'}).appendTo(divinputgroup); 68 | var btnminus = $('