├── .gitignore
├── LICENSE.md
├── README.md
├── dist
├── styles
│ └── timezone-picker.css
└── timezone-picker.min.js
├── example
└── index-external-vendor.html
├── package-lock.json
├── package.json
├── src
├── TimezonePicker.js
├── index-external-vendor.ejs
├── index.ejs
├── styles
│ ├── _colors.scss
│ └── style.scss
├── timezones.json
└── utils
│ ├── Plugin.js
│ └── Utils.js
└── webpack.config.js
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_store
2 | node_modules/
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2015 Keval Bhatt
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # timezone-picker
2 |
3 | timezone-picker is the plugin to select and get timezone value of selected area(country) from WorldMap.
4 |
5 | [](https://www.npmjs.com/package/timezone-picker)
6 | [](https://www.npmjs.com/package/timezone-picker)
7 | [](https://www.jsdelivr.com/package/npm/timezone-picker)
8 | [](https://opensource.org/licenses/mit-license.php)
9 | []()
10 | [](https://github.com/kevalbhatt/timezone-picker/issues)
11 | [](http://github.com/kevalbhatt/timezone-picker)
12 |
13 |
14 | ### Live Demo: http://kevalbhatt.github.io/timezone-picker/
15 | ---------------------
16 |
17 | 
18 |
19 | # Dependency
20 | ---------------------
21 | * moment-timezone
22 | * jquery
23 | * select2 (optional)
24 |
25 |
26 | # Installation
27 | ---------------------
28 |
29 | ### Use package Using npm
30 |
31 | ```sh
32 | npm install --save timezone-picker
33 | ```
34 | or
35 |
36 | ### Use package Using CDN
37 |
38 | ```html
39 |
40 | ```
41 |
42 | Include the following lines of code in the section of your HTML.
43 |
44 | ```html
45 |
46 |
47 |
48 |
49 |
50 |
51 | ```
52 |
53 |
54 | # Usage
55 | ---------------------
56 |
57 | ## Select any dom element where you want to create the map.
58 |
59 | ```js
60 | $(selector).timezonePicker();
61 | ```
62 |
63 | ## defaultValue
64 |
65 | Set a custom value on load
66 |
67 | If defaultValue is null then system timezone is selected
68 |
69 | * ### Select value based on zonename.
70 |
71 | ```js
72 | $(selector).timezonePicker({ defaultValue: { value: "EAT", attribute: "zonename" }});
73 | ```
74 |
75 | * ### Select value based on country code.
76 |
77 | ```js
78 | $(selector).timezonePicker({ defaultValue: { value: "IN", attribute: "country" }});
79 | ```
80 |
81 | * ### Select value based on timezone.
82 |
83 | ```js
84 | $(selector).timezonePicker({ defaultValue: { value: "Asia/Calcutta", attribute: "timezone" }});
85 | ```
86 |
87 | * ### Select value based on offset.
88 |
89 | ```js
90 | $(selector).timezonePicker({ defaultValue: { value: "5.5", attribute: "offset" }});
91 | ```
92 |
93 | ## quickLink
94 |
95 | You can create custom shortcuts link using quickLink options.
96 |
97 | ```js
98 | $(selector).timezonePicker({
99 | quickLink: [{
100 | "IST": "IST",
101 | "LONDON": "Europe/London"
102 | }]
103 | });
104 | ```
105 |
106 | * "LONDON": This key is used as a display string for shortcut button.
107 | * "Europe/London": This value is used when user click on a button and based on value, map is highlighted
108 |
109 |
110 | Example:
111 |
112 | You can pass following value.
113 |
114 | * **timezone** : Europe/London
115 | * **zonename** : GMT
116 | * **country code** : GB
117 |
118 | ```js
119 | $(selector).timezonePicker({
120 | quickLink: [{
121 | "LONDON1": "Europe/London"
122 | }]
123 | });
124 |
125 | $(selector).timezonePicker({
126 | quickLink: [{
127 | "LONDON2": "GB"
128 | }]
129 | });
130 |
131 | $(selector).timezonePicker({
132 | quickLink: [{
133 | "LONDON3": "GMT"
134 | }]
135 | });
136 |
137 | $(selector).timezonePicker({
138 | quickLink: [{
139 | "GMT": "GMT"
140 | }]
141 | });
142 | ```
143 |
144 | ## hoverText
145 |
146 | ```js
147 | $(selector).timezonePicker({
148 | hoverText: function(e, data){
149 | return (data.timezone + " (" + data.zonename + ")");
150 | }
151 | });
152 | ```
153 |
154 | ## quickLinkClass
155 |
156 | Class name for the quickLink container.
157 |
158 | ```js
159 | $(selector).timezonePicker({
160 | quickLinkClass: "quick-class"
161 | });
162 | ```
163 |
164 | **Output**
165 |
166 | ```diff
167 |
168 |
169 | +
170 |
171 |
186 | +
187 |
188 |
189 |
224 |
225 |
226 | +
227 |