office-ui-fabric-rails 2.6.1.0 → 3.0.0.0.beta1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (35) hide show
  1. checksums.yaml +4 -4
  2. data/bower.json +3 -3
  3. data/lib/office-ui-fabric-rails/version.rb +2 -2
  4. data/vendor/assets/css/fabric.components.css +1545 -2504
  5. data/vendor/assets/css/fabric.components.min.css +2 -2
  6. data/vendor/assets/css/fabric.components.rtl.css +1499 -2425
  7. data/vendor/assets/css/fabric.components.rtl.min.css +2 -2
  8. data/vendor/assets/css/fabric.css +57 -802
  9. data/vendor/assets/css/fabric.min.css +2 -2
  10. data/vendor/assets/css/fabric.rtl.css +496 -800
  11. data/vendor/assets/css/fabric.rtl.min.css +2 -2
  12. data/vendor/assets/js/fabric.js +5177 -0
  13. data/vendor/assets/js/fabric.min.js +4 -0
  14. data/vendor/assets/js/fabric.templates.js +1942 -0
  15. data/vendor/assets/js/fabric.templates.ts +1832 -0
  16. data/vendor/assets/scss/Fabric.Components.scss +6 -3
  17. data/vendor/assets/scss/Fabric.Icons.Output.scss +6 -0
  18. data/vendor/assets/scss/Fabric.RTL.scss +0 -3
  19. data/vendor/assets/scss/Fabric.Typography.Fonts.Extended.Output.scss +67 -0
  20. data/vendor/assets/scss/Fabric.Typography.Fonts.Output.scss +0 -63
  21. data/vendor/assets/scss/Fabric.Typography.Language.Overrides.Output.scss +32 -35
  22. data/vendor/assets/scss/Fabric.Typography.Output.scss +1 -1
  23. data/vendor/assets/scss/Fabric.scss +0 -4
  24. data/vendor/assets/scss/_Fabric.Common.scss +0 -1
  25. data/vendor/assets/scss/_Fabric.Icons.scss +6 -0
  26. data/vendor/assets/scss/_Fabric.Mixins.RTL.scss +13 -3
  27. data/vendor/assets/scss/_Fabric.Typography.Fonts.scss +19 -22
  28. data/vendor/assets/scss/_Fabric.Typography.Language.Overrides.scss +10 -78
  29. data/vendor/assets/scss/_Fabric.Typography.Variables.scss +6 -4
  30. data/vendor/assets/scss/_Fabric.Typography.scss +26 -37
  31. data/vendor/assets/scss/_Fabric.Utilities.scss +0 -1
  32. metadata +9 -7
  33. data/vendor/assets/js/jquery.fabric.js +0 -2451
  34. data/vendor/assets/js/jquery.fabric.min.js +0 -2
  35. data/vendor/assets/scss/_Office.Color.Variables.scss +0 -34
@@ -5,11 +5,13 @@
5
5
  // --------------------------------------------------
6
6
  // Fabric Core Typography variables
7
7
 
8
+ $ms-font-system-base: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
9
+ $ms-font-family-base: 'Segoe UI WestEuropean', $ms-font-system-base;
8
10
 
9
- $ms-font-family-light: 'Segoe UI Light WestEuropean', 'Segoe UI Light', 'Segoe UI', Tahoma, Arial, sans-serif;
10
- $ms-font-family-regular: 'Segoe UI Regular WestEuropean', 'Segoe UI', Tahoma, Arial, sans-serif;
11
- $ms-font-family-semilight: 'Segoe UI Semilight WestEuropean', 'Segoe UI Semilight', 'Segoe UI', Tahoma, Arial, sans-serif;
12
- $ms-font-family-semibold: 'Segoe UI Semibold WestEuropean', 'Segoe UI Semibold', 'Segoe UI', Tahoma, Arial, sans-serif;
11
+ $ms-font-weight-light: 100;
12
+ $ms-font-weight-regular: 400;
13
+ $ms-font-weight-semilight: 300;
14
+ $ms-font-weight-semibold: 600;
13
15
 
14
16
 
15
17
  //== Type sizes
@@ -7,94 +7,83 @@
7
7
  @import 'Fabric.Typography.Variables';
8
8
 
9
9
  // Super Styles (LIMITED USE)
10
- // Weights: Light
11
10
  @mixin ms-font-su {
12
11
  color: $ms-color-neutralPrimary;
13
- font-family: $ms-font-family-light;
12
+ font-family: $ms-font-family-base;
14
13
  font-size: $ms-font-size-su;
15
- font-weight: normal;
14
+ font-weight: $ms-font-weight-light;
16
15
  }
17
- // No touch class for Super
18
16
 
19
17
  // Extra-Extra-Large
20
- // Allowed weights: Light, SemiLight
21
18
  @mixin ms-font-xxl {
22
19
  color: $ms-color-neutralPrimary;
23
- font-family: $ms-font-family-light;
20
+ font-family: $ms-font-family-base;
24
21
  font-size: $ms-font-size-xxl;
25
- font-weight: normal;
22
+ font-weight: $ms-font-weight-light;
26
23
  }
27
24
 
28
25
  // Extra-Large Styles
29
- // Allowed weights: Light, SemiLight
30
26
  @mixin ms-font-xl {
31
27
  color: $ms-color-neutralPrimary;
32
- font-family: $ms-font-family-light;
28
+ font-family: $ms-font-family-base;
33
29
  font-size: $ms-font-size-xl;
34
- font-weight: normal;
30
+ font-weight: $ms-font-weight-light;
35
31
  }
36
32
 
37
33
  // Large Styles
38
- // Allowed weights: SemiLight, Regular, Semibold
39
34
  @mixin ms-font-l {
40
35
  color: $ms-color-neutralPrimary;
41
- font-family: $ms-font-family-semilight;
36
+ font-family: $ms-font-family-base;
42
37
  font-size: $ms-font-size-l;
43
- font-weight: normal;
38
+ font-weight: $ms-font-weight-semilight;
44
39
  }
45
40
 
46
41
  // Medium Plus Styles
47
- // Allowed weights: SemiLight, Regular, Semibold
48
42
  @mixin ms-font-m-plus {
49
43
  color: $ms-color-neutralPrimary;
50
- font-family: $ms-font-family-regular;
44
+ font-family: $ms-font-family-base;
51
45
  font-size: $ms-font-size-m-plus;
52
- font-weight: normal;
46
+ font-weight: $ms-font-weight-regular;
53
47
  }
54
48
 
55
49
  // Medium Styles
56
- // Allowed weights: SemiLight, Regular, Semibold
57
50
  @mixin ms-font-m {
58
51
  color: $ms-color-neutralPrimary;
59
- font-family: $ms-font-family-regular;
52
+ font-family: $ms-font-family-base;
60
53
  font-size: $ms-font-size-m;
61
- font-weight: normal;
54
+ font-weight: $ms-font-weight-regular;
62
55
  }
63
56
 
64
57
  // Small Plus Styles
65
- // Allowed weights: SemiLight, Regular, Semibold
66
58
  @mixin ms-font-s-plus {
67
59
  color: $ms-color-neutralPrimary;
68
- font-family: $ms-font-family-regular;
60
+ font-family: $ms-font-family-base;
69
61
  font-size: $ms-font-size-s-plus;
70
- font-weight: normal;
62
+ font-weight: $ms-font-weight-regular;
71
63
  }
72
64
 
73
65
  // Small Styles
74
- // Allowed weights: SemiLight, Regular, Semibold
75
66
  @mixin ms-font-s {
76
67
  color: $ms-color-neutralPrimary;
77
- font-family: $ms-font-family-regular;
68
+ font-family: $ms-font-family-base;
78
69
  font-size: $ms-font-size-s;
79
- font-weight: normal;
70
+ font-weight: $ms-font-weight-regular;
80
71
  }
81
72
 
82
73
  // XS Styles
83
- // Allowed weights: SemiLight, Regular, Semibold
84
74
  @mixin ms-font-xs {
85
75
  color: $ms-color-neutralPrimary;
86
- font-family: $ms-font-family-regular;
76
+ font-family: $ms-font-family-base;
87
77
  font-size: $ms-font-size-xs;
88
- font-weight: normal;
78
+ font-weight: $ms-font-weight-regular;
89
79
  }
90
80
 
91
81
  // Micro Styles (LIMITED USE)
92
- // Weights: Semibold
93
82
  @mixin ms-font-mi {
94
83
  color: $ms-color-neutralPrimary;
95
- font-family: $ms-font-family-semibold;
84
+ font-family: $ms-font-family-base;
96
85
  font-size: $ms-font-size-mi;
97
- font-weight: normal;
86
+ font-weight: $ms-font-weight-semibold;
98
87
  }
99
88
 
100
89
  //== Helper classes & mixins
@@ -102,20 +91,20 @@
102
91
  // Helper mixins to override default type values
103
92
 
104
93
  // Font weights
105
- @mixin ms-fontWeight-light{
106
- font-family: $ms-font-family-light;
94
+ @mixin ms-fontWeight-light {
95
+ font-weight: $ms-font-weight-light;
107
96
  }
108
97
 
109
- @mixin ms-fontWeight-semilight{
110
- font-family: $ms-font-family-semilight;
98
+ @mixin ms-fontWeight-semilight {
99
+ font-weight: $ms-font-weight-semilight;
111
100
  }
112
101
 
113
102
  @mixin ms-fontWeight-regular {
114
- font-family: $ms-font-family-regular;
103
+ font-weight: $ms-font-weight-regular;
115
104
  }
116
105
 
117
106
  @mixin ms-fontWeight-semibold {
118
- font-family: $ms-font-family-semibold;
107
+ font-weight: $ms-font-weight-semibold;
119
108
  }
120
109
 
121
110
  // Font sizes
@@ -18,7 +18,6 @@
18
18
  }
19
19
 
20
20
  // Ensures the block expands to the full height to enclose its floated childen.
21
-
22
21
  @mixin ms-u-clearfix {
23
22
  *zoom: 1;
24
23
  &:before,
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: office-ui-fabric-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 2.6.1.0
4
+ version: 3.0.0.0.beta1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Craig Plummer
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2016-05-24 00:00:00.000000000 Z
11
+ date: 2016-06-14 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: railties
@@ -109,8 +109,10 @@ files:
109
109
  - vendor/assets/css/fabric.min.css
110
110
  - vendor/assets/css/fabric.rtl.css
111
111
  - vendor/assets/css/fabric.rtl.min.css
112
- - vendor/assets/js/jquery.fabric.js
113
- - vendor/assets/js/jquery.fabric.min.js
112
+ - vendor/assets/js/fabric.js
113
+ - vendor/assets/js/fabric.min.js
114
+ - vendor/assets/js/fabric.templates.js
115
+ - vendor/assets/js/fabric.templates.ts
114
116
  - vendor/assets/scss/Fabric.Animations.Output.scss
115
117
  - vendor/assets/scss/Fabric.Animations.RTL.Output.scss
116
118
  - vendor/assets/scss/Fabric.Color.Mixins.Output.scss
@@ -121,6 +123,7 @@ files:
121
123
  - vendor/assets/scss/Fabric.Icons.RTL.Output.scss
122
124
  - vendor/assets/scss/Fabric.RTL.scss
123
125
  - vendor/assets/scss/Fabric.Responsive.Utilities.Output.scss
126
+ - vendor/assets/scss/Fabric.Typography.Fonts.Extended.Output.scss
124
127
  - vendor/assets/scss/Fabric.Typography.Fonts.Output.scss
125
128
  - vendor/assets/scss/Fabric.Typography.Language.Overrides.Output.scss
126
129
  - vendor/assets/scss/Fabric.Typography.Output.scss
@@ -143,7 +146,6 @@ files:
143
146
  - vendor/assets/scss/_Fabric.Typography.scss
144
147
  - vendor/assets/scss/_Fabric.Utilities.scss
145
148
  - vendor/assets/scss/_Fabric.ZIndex.Variables.scss
146
- - vendor/assets/scss/_Office.Color.Variables.scss
147
149
  homepage: https://github.com/craigplummer/office-ui-fabric-rails
148
150
  licenses:
149
151
  - MIT
@@ -160,9 +162,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
160
162
  version: '0'
161
163
  required_rubygems_version: !ruby/object:Gem::Requirement
162
164
  requirements:
163
- - - ">="
165
+ - - ">"
164
166
  - !ruby/object:Gem::Version
165
- version: '0'
167
+ version: 1.3.1
166
168
  requirements: []
167
169
  rubyforge_project:
168
170
  rubygems_version: 2.5.1
@@ -1,2451 +0,0 @@
1
- //Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
2
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
3
-
4
- /**
5
- * Breadcrumb component
6
- *
7
- * Shows the user's current location in a hierarchy and provides a means of navigating upward.
8
- *
9
- */
10
-
11
- /**
12
- * @namespace fabric
13
- */
14
- var fabric = fabric || {};
15
- /**
16
- *
17
- * @param {HTMLElement} container - the target container for an instance of Breadcrumb
18
- * @constructor
19
- *
20
- * If dynamically populating a list run the constructor after the list has been populated
21
- * in the DOM.
22
- */
23
- fabric.Breadcrumb = function(container) {
24
- this.breadcrumb = container;
25
- this.breadcrumbList = container.querySelector('.ms-Breadcrumb-list');
26
- this.listItems = container.querySelectorAll('.ms-Breadcrumb-listItem');
27
- this.contextMenu = container.querySelector('.ms-ContextualMenu');
28
- this.overflowButton = container.querySelector('.ms-Breadcrumb-overflowButton');
29
- this.overflowMenu = container.querySelector('.ms-Breadcrumb-overflowMenu');
30
- this.itemCollection = [];
31
- this.currentMaxItems = 0;
32
- this.init();
33
-
34
- };
35
-
36
- fabric.Breadcrumb.prototype = (function() {
37
-
38
- //medium breakpoint
39
- var MEDIUM = 639;
40
-
41
- /**
42
- * initializes component
43
- */
44
- var init = function() {
45
- _setListeners.call(this);
46
- _createItemCollection.call(this);
47
- _onResize.call(this, null);
48
- };
49
-
50
- /**
51
- * Adds a breadcrumb item to a breadcrumb
52
- * @param itemLabel {String} the item's text label
53
- * @param itemLink {String} the item's href link
54
- * @param tabIndex {number} the item's tabIndex
55
- */
56
- var addItem = function(itemLabel, itemLink, tabIndex) {
57
- this.itemCollection.push({text: itemLabel, link: itemLink, tabIndex: tabIndex});
58
- _updateBreadcrumbs.call(this);
59
- };
60
-
61
- /**
62
- * Removes a breadcrumb item by item label in the breadcrumbs list
63
- * @param itemLabel {String} the item's text label
64
- */
65
- var removeItemByLabel = function(itemLabel) {
66
- var i = this.itemCollection.length;
67
- while (i--) {
68
- if (this.itemCollection[i].text === itemLabel) {
69
- this.itemCollection.splice(i, 1);
70
- }
71
- }
72
- _updateBreadcrumbs.call(this);
73
- };
74
-
75
- /**
76
- * removes a breadcrumb item by position in the breadcrumbs list
77
- * index starts at 0
78
- * @param itemLabel {String} the item's text label
79
- * @param itemLink {String} the item's href link
80
- * @param tabIndex {number} the item's tabIndex
81
- */
82
- var removeItemByPosition = function(value) {
83
- this.itemCollection.splice(value, 1);
84
- _updateBreadcrumbs.call(this);
85
- };
86
-
87
- /**
88
- * create internal model of list items from DOM
89
- */
90
- var _createItemCollection = function() {
91
- var length = this.listItems.length;
92
- var i = 0;
93
- var item;
94
- var text;
95
- var link;
96
- var tabIndex;
97
-
98
- for (i; i < length; i++) {
99
- item = this.listItems[i].querySelector('.ms-Breadcrumb-itemLink');
100
- text = item.textContent;
101
- link = item.getAttribute('href');
102
- tabIndex = parseInt(item.getAttribute('tabindex'), 10);
103
- this.itemCollection.push({text: text, link: link, tabIndex: tabIndex});
104
- }
105
- };
106
-
107
- /**
108
- * Re-render lists on resize
109
- *
110
- */
111
- var _onResize = function() {
112
- _closeOverflow.call(this, null);
113
- _renderListOnResize.call(this);
114
- };
115
-
116
- /**
117
- * render breadcrumbs and overflow menus on resize
118
- */
119
- var _renderListOnResize = function() {
120
- var maxItems = window.innerWidth > MEDIUM ? 4 : 2;
121
- if (maxItems !== this.currentMaxItems) {
122
- _updateBreadcrumbs.call(this);
123
- }
124
-
125
- this.currentMaxItems = maxItems;
126
- };
127
-
128
- /**
129
- * creates the overflow menu
130
- */
131
- var _addItemsToOverflow = function(maxItems) {
132
- _resetList.call(this, this.contextMenu);
133
- var end = this.itemCollection.length - maxItems;
134
- var overflowItems = this.itemCollection.slice(0, end);
135
- var contextMenu = this.contextMenu;
136
- overflowItems.forEach(function(item) {
137
- var li = document.createElement('li');
138
- li.className = 'ms-ContextualMenu-item';
139
- if(!isNaN(item.tabIndex)) {
140
- li.setAttribute('tabindex', item.tabIndex);
141
- }
142
- var a = document.createElement('a');
143
- a.className = 'ms-ContextualMenu-link';
144
- if (item.link !== null) {
145
- a.setAttribute('href', item.link);
146
- }
147
- a.textContent = item.text;
148
- li.appendChild(a);
149
- contextMenu.appendChild(li);
150
- });
151
- };
152
-
153
- /**
154
- * creates the breadcrumbs
155
- */
156
- var _addBreadcrumbItems = function(maxItems) {
157
- _resetList.call(this, this.breadcrumbList);
158
- var i = this.itemCollection.length - maxItems;
159
- i = i < 0 ? 0 : i;
160
- if (i >= 0) {
161
- for (i; i < this.itemCollection.length; i++) {
162
- var listItem = document.createElement('li');
163
- var item = this.itemCollection[i];
164
- var a = document.createElement('a');
165
- var chevron = document.createElement('i');
166
- listItem.className = 'ms-Breadcrumb-listItem';
167
- a.className = 'ms-Breadcrumb-itemLink';
168
- if (item.link !== null) {
169
- a.setAttribute('href', item.link);
170
- }
171
- if (!isNaN(item.tabIndex)) {
172
- a.setAttribute('tabindex', item.tabIndex);
173
- }
174
- a.textContent = item.text;
175
- chevron.className = 'ms-Breadcrumb-chevron ms-Icon ms-Icon--chevronRight';
176
- listItem.appendChild(a);
177
- listItem.appendChild(chevron);
178
- this.breadcrumbList.appendChild(listItem);
179
- }
180
- }
181
- };
182
-
183
- /**
184
- * resets a list by removing its children
185
- */
186
- var _resetList = function(list) {
187
- while (list.firstChild) {
188
- list.removeChild(list.firstChild);
189
- }
190
- };
191
-
192
- /**
193
- * opens the overflow menu
194
- */
195
- var _openOverflow = function(event) {
196
- if (this.overflowMenu.className.indexOf(' is-open') === -1) {
197
- this.overflowMenu.className += ' is-open';
198
- removeOutlinesOnClick.call(this, event);
199
- // force focus rect onto overflow button
200
- this.overflowButton.focus();
201
- }
202
- };
203
-
204
- var _overflowKeyPress = function(event) {
205
- if (event.keyCode === 13) {
206
- _openOverflow.call(this, event);
207
- }
208
- };
209
-
210
- /**
211
- * closes the overflow menu
212
- */
213
- var _closeOverflow = function(event) {
214
- if (!event || event.target !== this.overflowButton) {
215
- _removeClass.call(this, this.overflowMenu, ' is-open');
216
- }
217
- };
218
-
219
- /**
220
- * utility that removes a class from an element
221
- */
222
- var _removeClass = function (element, value) {
223
- var index = element.className.indexOf(value);
224
- if (index > -1) {
225
- element.className = element.className.substring(0, index);
226
- }
227
- };
228
-
229
- /**
230
- * sets handlers for resize and button click events
231
- */
232
- var _setListeners = function() {
233
- window.addEventListener('resize', _onResize.bind(this), false);
234
- document.addEventListener('click', _closeOverflow.bind(this), false);
235
- this.overflowButton.addEventListener('click', _openOverflow.bind(this), false);
236
- this.overflowButton.addEventListener('keypress', _overflowKeyPress.bind(this), false);
237
- this.breadcrumbList.addEventListener('click', removeOutlinesOnClick.bind(this), false);
238
- };
239
-
240
- /**
241
- * removes focus outlines so they don't linger after click
242
- */
243
- var removeOutlinesOnClick = function(event) {
244
- event.target.blur();
245
- };
246
-
247
- /**
248
- * updates the breadcrumbs and overflow menu
249
- */
250
- var _updateBreadcrumbs = function() {
251
- var maxItems = window.innerWidth > MEDIUM ? 4 : 2;
252
- if (this.itemCollection.length > maxItems) {
253
- this.breadcrumb.className += ' is-overflow';
254
- } else {
255
- _removeClass.call(this, this.breadcrumb, ' is-overflow');
256
- }
257
-
258
- _addBreadcrumbItems.call(this, maxItems);
259
- _addItemsToOverflow.call(this, maxItems);
260
- };
261
-
262
- return {
263
- init: init,
264
- addItem: addItem,
265
- removeItemByLabel: removeItemByLabel,
266
- removeItemByPosition: removeItemByPosition
267
- };
268
-
269
- }());
270
-
271
-
272
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
273
-
274
- /**
275
- * Command Bar Plugin
276
- */
277
-
278
- (function ($) {
279
- $.fn.CommandBar = function () {
280
-
281
- var createMenuItem = function(text) {
282
- var item = '<li class="ms-ContextualMenu-item"><a class="ms-ContextualMenu-link"" href="#">';
283
- item += text;
284
- item += '</a></li>';
285
-
286
- return item;
287
- };
288
-
289
- var saveCommands = function($commands, $commandWidth, $commandarea) {
290
- var commands = [];
291
- $commands.each(function() {
292
- var $Item = $(this);
293
- var $rightOffset = ($Item.position().left + $Item.outerWidth() + $commandWidth + 10) - $commandarea.position().left; // Added padding of 10
294
- commands.push({ jquery: $Item, rightOffset: $rightOffset});
295
- });
296
-
297
- return commands;
298
- };
299
-
300
- var processCommands = function(commands, width, overflowwidth) {
301
- var overFlowCommands = [];
302
-
303
- for(var i=0; i < commands.length; i++) {
304
- var $Item = commands[i].jquery;
305
- var rightOffset = commands[i].rightOffset;
306
-
307
- // If the command is outside the right boundaries add to overflow items
308
- if(!$Item.hasClass('ms-CommandBarItem-overflow')) {
309
- if((rightOffset + overflowwidth) > width) {
310
- overFlowCommands.push($Item);
311
- } else {
312
- // Make sure item is displayed
313
- $Item.removeClass('is-hidden');
314
- }
315
- }
316
- }
317
- return overFlowCommands;
318
- };
319
-
320
- var processOverflow = function(overFlowCommands, $oCommand, $menu) {
321
- var overflowStrings = '';
322
-
323
- if(overFlowCommands.length > 0) {
324
- $oCommand.addClass("is-visible");
325
- // Empty menu
326
- $menu.html('');
327
-
328
- // Add overflowed commands to ContextualMenu
329
- for(var i = 0; i < overFlowCommands.length; i++) {
330
- var $Item = $(overFlowCommands[i]);
331
- // Hide Element in CommandBar
332
- $Item.addClass('is-hidden');
333
- var commandBarItemText = $Item.find('.ms-CommandBarItem-commandText').text();
334
- overflowStrings += createMenuItem(commandBarItemText);
335
- }
336
- $menu.html(overflowStrings);
337
- } else {
338
- $oCommand.removeClass("is-visible");
339
- }
340
- };
341
-
342
- /** Go through each CommandBar we've been given. */
343
- return this.each(function () {
344
- var $CommandBar = $(this);
345
- var $CommandMainArea = $CommandBar.find('.ms-CommandBar-mainArea');
346
- var $CommandBarItems = $CommandMainArea.find('.ms-CommandBarItem').not('.ms-CommandBarItem-overflow');
347
- var $OverflowCommand = $CommandBar.find('.ms-CommandBarItem-overflow');
348
- var $OverflowCommandWidth = $CommandBar.find('.ms-CommandBarItem-overflow').outerWidth();
349
- var $OverflowMenu = $CommandBar.find('.ms-CommandBar-overflowMenu');
350
- var $SearchBox = $CommandBar.find('.ms-CommandBarSearch');
351
- var mobileSwitch = false;
352
- var overFlowCommands;
353
- var allCommands;
354
-
355
- // Go through process and save commands
356
- allCommands = saveCommands($CommandBarItems, $OverflowCommandWidth, $CommandMainArea);
357
-
358
- // Initiate process commands and add commands to overflow on load
359
- overFlowCommands = processCommands(allCommands, $CommandMainArea.innerWidth(), $OverflowCommandWidth);
360
- processOverflow(overFlowCommands, $OverflowCommand, $OverflowMenu);
361
-
362
- // Set Search Behavior
363
- if($(window).width() < 640) {
364
-
365
- $('.ms-CommandBarSearch-iconSearchWrapper').click(function() {
366
- $(this).closest('.ms-CommandBarSearch').addClass('is-active');
367
- });
368
-
369
- }
370
-
371
- // Add resize event handler on commandBar
372
- $(window).resize(function() {
373
- var overFlowCommands;
374
-
375
- if($(window).width() < 640 && mobileSwitch === false) {
376
- // Go through process and save commands
377
- allCommands = saveCommands($CommandBarItems, $OverflowCommandWidth, $CommandMainArea);
378
-
379
- mobileSwitch = true;
380
-
381
- // Search Behavior
382
- $('.ms-CommandBarSearch-iconSearchWrapper').unbind();
383
- $('.ms-CommandBarSearch-iconSearchWrapper').click(function() {
384
- $(this).closest('.ms-CommandBarSearch').addClass('is-active');
385
- });
386
-
387
- } else if($(window).width() > 639 && mobileSwitch === true) {
388
- // Go through process and save commands
389
- allCommands = saveCommands($CommandBarItems, $OverflowCommandWidth, $CommandMainArea);
390
-
391
- mobileSwitch = false;
392
- $('.ms-CommandBarSearch').unbind();
393
-
394
- }
395
-
396
- // Initiate process commands and add commands to overflow on load
397
- overFlowCommands = processCommands(allCommands, $CommandMainArea.innerWidth(), $OverflowCommandWidth);
398
- processOverflow(overFlowCommands, $OverflowCommand, $OverflowMenu);
399
-
400
- });
401
-
402
- // Hook up contextual menu
403
- $OverflowCommand.click(function() {
404
- $OverflowMenu.toggleClass('is-open');
405
- });
406
-
407
- $OverflowCommand.focusout(function() {
408
- $OverflowMenu.removeClass('is-open');
409
- });
410
-
411
- $SearchBox.find('.ms-CommandBarSearch-input').click(function() {
412
- $(this).closest('.ms-CommandBarSearch').addClass('is-active');
413
- });
414
-
415
- $SearchBox.find('.ms-CommandBarSearch-input').on('focus', function() {
416
- $(this).closest('.ms-CommandBarSearch').addClass('is-active');
417
- });
418
-
419
- // When clicking the x clear the SearchBox and put state back to normal
420
- $SearchBox.find('.ms-CommandBarSearch-iconClearWrapper').click(function() {
421
- var $input = $(this).parent().find('.ms-CommandBarSearch-input');
422
- $input.val('');
423
- $input.parent().removeClass('is-active');
424
- });
425
-
426
- $SearchBox.parent().find('.ms-CommandBarSearch-input').blur(function() {
427
- var $input = $(this);
428
- $input.val('');
429
- $input.parent().removeClass('is-active');
430
- });
431
-
432
- });
433
- };
434
- })(jQuery);
435
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
436
-
437
- /**
438
- * Contextual Menu Plugin
439
- */
440
- (function ($) {
441
- $.fn.ContextualMenu = function () {
442
-
443
- /** Go through each nav bar we've been given. */
444
- return this.each(function () {
445
-
446
- var $contextualMenu = $(this);
447
-
448
-
449
- // Set selected states.
450
- $contextualMenu.on('click', '.ms-ContextualMenu-link:not(.is-disabled)', function(event) {
451
- event.preventDefault();
452
-
453
- // Check if multiselect - set selected states
454
- if ( $contextualMenu.hasClass('ms-ContextualMenu--multiselect') ) {
455
-
456
- // If already selected, remove selection; if not, add selection
457
- if ( $(this).hasClass('is-selected') ) {
458
- $(this).removeClass('is-selected');
459
- }
460
- else {
461
- $(this).addClass('is-selected');
462
- }
463
-
464
- }
465
- // All other contextual menu variants
466
- else {
467
-
468
- // Deselect all of the items and close any menus.
469
- $('.ms-ContextualMenu-link')
470
- .removeClass('is-selected')
471
- .siblings('.ms-ContextualMenu')
472
- .removeClass('is-open');
473
-
474
- // Select this item.
475
- $(this).addClass('is-selected');
476
-
477
- // If this item has a menu, open it.
478
- if ($(this).hasClass('ms-ContextualMenu-link--hasMenu')) {
479
- $(this).siblings('.ms-ContextualMenu:first').addClass('is-open');
480
-
481
- // Open the menu without bubbling up the click event,
482
- // which can cause the menu to close.
483
- event.stopPropagation();
484
- }
485
-
486
- }
487
-
488
-
489
- });
490
-
491
- });
492
- };
493
- })(jQuery);
494
-
495
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
496
-
497
- (function ($) {
498
-
499
- /**
500
- * DatePicker Plugin
501
- */
502
-
503
- $.fn.DatePicker = function (options) {
504
-
505
- return this.each(function () {
506
-
507
- /** Set up variables and run the Pickadate plugin. */
508
- var $datePicker = $(this);
509
- var $dateField = $datePicker.find('.ms-TextField-field').pickadate($.extend({
510
- // Strings and translations.
511
- weekdaysShort: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
512
-
513
- // Don't render the buttons
514
- today: '',
515
- clear: '',
516
- close: '',
517
-
518
- // Events
519
- onStart: function() {
520
- initCustomView($datePicker);
521
- },
522
-
523
- // Classes
524
- klass: {
525
-
526
- // The element states
527
- input: 'ms-DatePicker-input',
528
- active: 'ms-DatePicker-input--active',
529
-
530
- // The root picker and states
531
- picker: 'ms-DatePicker-picker',
532
- opened: 'ms-DatePicker-picker--opened',
533
- focused: 'ms-DatePicker-picker--focused',
534
-
535
- // The picker holder
536
- holder: 'ms-DatePicker-holder',
537
-
538
- // The picker frame, wrapper, and box
539
- frame: 'ms-DatePicker-frame',
540
- wrap: 'ms-DatePicker-wrap',
541
- box: 'ms-DatePicker-dayPicker',
542
-
543
- // The picker header
544
- header: 'ms-DatePicker-header',
545
-
546
- // Month & year labels
547
- month: 'ms-DatePicker-month',
548
- year: 'ms-DatePicker-year',
549
-
550
- // Table of dates
551
- table: 'ms-DatePicker-table',
552
-
553
- // Weekday labels
554
- weekdays: 'ms-DatePicker-weekday',
555
-
556
- // Day states
557
- day: 'ms-DatePicker-day',
558
- disabled: 'ms-DatePicker-day--disabled',
559
- selected: 'ms-DatePicker-day--selected',
560
- highlighted: 'ms-DatePicker-day--highlighted',
561
- now: 'ms-DatePicker-day--today',
562
- infocus: 'ms-DatePicker-day--infocus',
563
- outfocus: 'ms-DatePicker-day--outfocus',
564
-
565
- }
566
- },options||{}));
567
- var $picker = $dateField.pickadate('picker');
568
-
569
- /** Respond to built-in picker events. */
570
- $picker.on({
571
- render: function() {
572
- updateCustomView($datePicker);
573
- },
574
- open: function() {
575
- scrollUp($datePicker);
576
- }
577
- });
578
-
579
- });
580
- };
581
-
582
- /**
583
- * After the Pickadate plugin starts, this function
584
- * adds additional controls to the picker view.
585
- */
586
- function initCustomView($datePicker) {
587
-
588
- /** Get some variables ready. */
589
- var $monthControls = $datePicker.find('.ms-DatePicker-monthComponents');
590
- var $goToday = $datePicker.find('.ms-DatePicker-goToday');
591
- var $monthPicker = $datePicker.find('.ms-DatePicker-monthPicker');
592
- var $yearPicker = $datePicker.find('.ms-DatePicker-yearPicker');
593
- var $pickerWrapper = $datePicker.find('.ms-DatePicker-wrap');
594
- var $picker = $datePicker.find('.ms-TextField-field').pickadate('picker');
595
-
596
- /** Move the month picker into position. */
597
- $monthControls.appendTo($pickerWrapper);
598
- $goToday.appendTo($pickerWrapper);
599
- $monthPicker.appendTo($pickerWrapper);
600
- $yearPicker.appendTo($pickerWrapper);
601
-
602
- /** Update the custom view. */
603
- updateCustomView($datePicker);
604
-
605
- /** Move back one month. */
606
- $monthControls.on('click', '.js-prevMonth', function(event) {
607
- event.preventDefault();
608
- var newMonth = $picker.get('highlight').month - 1;
609
- changeHighlightedDate($picker, null, newMonth, null);
610
- });
611
-
612
- /** Move ahead one month. */
613
- $monthControls.on('click', '.js-nextMonth', function(event) {
614
- event.preventDefault();
615
- var newMonth = $picker.get('highlight').month + 1;
616
- changeHighlightedDate($picker, null, newMonth, null);
617
- });
618
-
619
- /** Move back one year. */
620
- $monthPicker.on('click', '.js-prevYear', function(event) {
621
- event.preventDefault();
622
- var newYear = $picker.get('highlight').year - 1;
623
- changeHighlightedDate($picker, newYear, null, null);
624
- });
625
-
626
- /** Move ahead one year. */
627
- $monthPicker.on('click', '.js-nextYear', function(event) {
628
- event.preventDefault();
629
- var newYear = $picker.get('highlight').year + 1;
630
- changeHighlightedDate($picker, newYear, null, null);
631
- });
632
-
633
- /** Move back one decade. */
634
- $yearPicker.on('click', '.js-prevDecade', function(event) {
635
- event.preventDefault();
636
- var newYear = $picker.get('highlight').year - 10;
637
- changeHighlightedDate($picker, newYear, null, null);
638
- });
639
-
640
- /** Move ahead one decade. */
641
- $yearPicker.on('click', '.js-nextDecade', function(event) {
642
- event.preventDefault();
643
- var newYear = $picker.get('highlight').year + 10;
644
- changeHighlightedDate($picker, newYear, null, null);
645
- });
646
-
647
- /** Go to the current date, shown in the day picking view. */
648
- $goToday.click(function(event) {
649
- event.preventDefault();
650
-
651
- /** Select the current date, while keeping the picker open. */
652
- var now = new Date();
653
- $picker.set('select', [now.getFullYear(), now.getMonth(), now.getDate()]);
654
-
655
- /** Switch to the default (calendar) view. */
656
- $datePicker.removeClass('is-pickingMonths').removeClass('is-pickingYears');
657
-
658
- });
659
-
660
- /** Change the highlighted month. */
661
- $monthPicker.on('click', '.js-changeDate', function(event) {
662
- event.preventDefault();
663
-
664
- /** Get the requested date from the data attributes. */
665
- var newYear = $(this).attr('data-year');
666
- var newMonth = $(this).attr('data-month');
667
- var newDay = $(this).attr('data-day');
668
-
669
- /** Update the date. */
670
- changeHighlightedDate($picker, newYear, newMonth, newDay);
671
-
672
- /** If we've been in the "picking months" state on mobile, remove that state so we show the calendar again. */
673
- if ($datePicker.hasClass('is-pickingMonths')) {
674
- $datePicker.removeClass('is-pickingMonths');
675
- }
676
- });
677
-
678
- /** Change the highlighted year. */
679
- $yearPicker.on('click', '.js-changeDate', function(event) {
680
- event.preventDefault();
681
-
682
- /** Get the requested date from the data attributes. */
683
- var newYear = $(this).attr('data-year');
684
- var newMonth = $(this).attr('data-month');
685
- var newDay = $(this).attr('data-day');
686
-
687
- /** Update the date. */
688
- changeHighlightedDate($picker, newYear, newMonth, newDay);
689
-
690
- /** If we've been in the "picking years" state on mobile, remove that state so we show the calendar again. */
691
- if ($datePicker.hasClass('is-pickingYears')) {
692
- $datePicker.removeClass('is-pickingYears');
693
- }
694
- });
695
-
696
- /** Switch to the default state. */
697
- $monthPicker.on('click', '.js-showDayPicker', function() {
698
- $datePicker.removeClass('is-pickingMonths');
699
- $datePicker.removeClass('is-pickingYears');
700
- });
701
-
702
- /** Switch to the is-pickingMonths state. */
703
- $monthControls.on('click', '.js-showMonthPicker', function() {
704
- $datePicker.toggleClass('is-pickingMonths');
705
- });
706
-
707
- /** Switch to the is-pickingYears state. */
708
- $monthPicker.on('click', '.js-showYearPicker', function() {
709
- $datePicker.toggleClass('is-pickingYears');
710
- });
711
-
712
- }
713
-
714
- /** Change the highlighted date. */
715
- function changeHighlightedDate($picker, newYear, newMonth, newDay) {
716
-
717
- /** All letiables are optional. If not provided, default to the current value. */
718
- if (typeof newYear === "undefined" || newYear === null) {
719
- newYear = $picker.get("highlight").year;
720
- }
721
- if (typeof newMonth === "undefined" || newMonth === null) {
722
- newMonth = $picker.get("highlight").month;
723
- }
724
- if (typeof newDay === "undefined" || newDay === null) {
725
- newDay = $picker.get("highlight").date;
726
- }
727
-
728
- /** Update it. */
729
- $picker.set('highlight', [newYear, newMonth, newDay]);
730
-
731
- }
732
-
733
-
734
- /** Whenever the picker renders, do our own rendering on the custom controls. */
735
- function updateCustomView($datePicker) {
736
-
737
- /** Get some variables ready. */
738
- var $monthPicker = $datePicker.find('.ms-DatePicker-monthPicker');
739
- var $yearPicker = $datePicker.find('.ms-DatePicker-yearPicker');
740
- var $picker = $datePicker.find('.ms-TextField-field').pickadate('picker');
741
-
742
- /** Set the correct year. */
743
- $monthPicker.find('.ms-DatePicker-currentYear').text($picker.get('view').year);
744
-
745
- /** Highlight the current month. */
746
- $monthPicker.find('.ms-DatePicker-monthOption').removeClass('is-highlighted');
747
- $monthPicker.find('.ms-DatePicker-monthOption[data-month="' + $picker.get('highlight').month + '"]').addClass('is-highlighted');
748
-
749
- /** Generate the grid of years for the year picker view. */
750
-
751
- // Start by removing any existing generated output. */
752
- $yearPicker.find('.ms-DatePicker-currentDecade').remove();
753
- $yearPicker.find('.ms-DatePicker-optionGrid').remove();
754
-
755
- // Generate the output by going through the years.
756
- var startingYear = $picker.get('highlight').year - 11;
757
- var decadeText = startingYear + " - " + (startingYear + 11);
758
- var output = '<div class="ms-DatePicker-currentDecade">' + decadeText + '</div>';
759
- output += '<div class="ms-DatePicker-optionGrid">';
760
- for (var year = startingYear; year < (startingYear + 12); year++) {
761
- output += '<span class="ms-DatePicker-yearOption js-changeDate" data-year="' + year + '">' + year +'</span>';
762
- }
763
- output += '</div>';
764
-
765
- // Output the title and grid of years generated above.
766
- $yearPicker.append(output);
767
-
768
- /** Highlight the current year. */
769
- $yearPicker.find('.ms-DatePicker-yearOption').removeClass('is-highlighted');
770
- $yearPicker.find('.ms-DatePicker-yearOption[data-year="' + $picker.get('highlight').year + '"]').addClass('is-highlighted');
771
- }
772
-
773
- /** Scroll the page up so that the field the date picker is attached to is at the top. */
774
- function scrollUp($datePicker) {
775
- $('html, body').animate({
776
- scrollTop: $datePicker.offset().top
777
- }, 367);
778
- }
779
-
780
- })(jQuery);
781
-
782
- !function(a){"function"==typeof define&&define.amd?define("picker",["jquery"],a):"object"==typeof exports?module.exports=a(require("jquery")):this.Picker=a(jQuery)}(function(a){function b(f,g,h,k){function l(){return b._.node("div",b._.node("div",b._.node("div",b._.node("div",w.component.nodes(r.open),t.box),t.wrap),t.frame),t.holder)}function m(){u.data(g,w).addClass(t.input).val(u.data("value")?w.get("select",s.format):f.value).on("focus."+r.id+" click."+r.id,p),s.editable||u.on("keydown."+r.id,function(a){var b=a.keyCode,c=/^(8|46)$/.test(b);return 27==b?(w.close(),!1):void((32==b||c||!r.open&&w.component.key[b])&&(a.preventDefault(),a.stopPropagation(),c?w.clear().close():w.open()))}),e(f,{haspopup:!0,expanded:!1,readonly:!1,owns:f.id+"_root"+(w._hidden?" "+w._hidden.id:"")})}function n(){w.$root.on({focusin:function(a){w.$root.removeClass(t.focused),a.stopPropagation()},"mousedown click":function(b){var c=b.target;c!=w.$root.children()[0]&&(b.stopPropagation(),"mousedown"!=b.type||a(c).is(":input")||"OPTION"==c.nodeName||(b.preventDefault(),f.focus()))}}).on("click","[data-pick], [data-nav], [data-clear], [data-close]",function(){var b=a(this),c=b.data(),d=b.hasClass(t.navDisabled)||b.hasClass(t.disabled),e=document.activeElement;e=e&&(e.type||e.href)&&e,(d||e&&!a.contains(w.$root[0],e))&&f.focus(),!d&&c.nav?w.set("highlight",w.component.item.highlight,{nav:c.nav}):!d&&"pick"in c?w.set("select",c.pick).close(!0):c.clear?w.clear().close(!0):c.close&&w.close(!0)}),e(w.$root[0],"hidden",!0)}function o(){var b;s.hiddenName===!0?(b=f.name,f.name=""):(b=["string"==typeof s.hiddenPrefix?s.hiddenPrefix:"","string"==typeof s.hiddenSuffix?s.hiddenSuffix:"_submit"],b=b[0]+f.name+b[1]),w._hidden=a('<input type=hidden name="'+b+'"'+(u.data("value")||f.value?' value="'+w.get("select",s.formatSubmit)+'"':"")+">")[0],u.on("change."+r.id,function(){w._hidden.value=f.value?w.get("select",s.formatSubmit):""}).after(w._hidden)}function p(a){a.stopPropagation(),"focus"==a.type&&w.$root.addClass(t.focused),w.open()}if(!f)return b;var q=!1,r={id:f.id||"P"+Math.abs(~~(Math.random()*new Date))},s=h?a.extend(!0,{},h.defaults,k):k||{},t=a.extend({},b.klasses(),s.klass),u=a(f),v=function(){return this.start()},w=v.prototype={constructor:v,$node:u,start:function(){return r&&r.start?w:(r.methods={},r.start=!0,r.open=!1,r.type=f.type,f.autofocus=f==document.activeElement,f.readOnly=!s.editable,f.id=f.id||r.id,"text"!=f.type&&(f.type="text"),w.component=new h(w,s),w.$root=a(b._.node("div",l(),t.picker,'id="'+f.id+'_root"')),n(),s.formatSubmit&&o(),m(),s.container?a(s.container).append(w.$root):u.after(w.$root),w.on({start:w.component.onStart,render:w.component.onRender,stop:w.component.onStop,open:w.component.onOpen,close:w.component.onClose,set:w.component.onSet}).on({start:s.onStart,render:s.onRender,stop:s.onStop,open:s.onOpen,close:s.onClose,set:s.onSet}),q=c(w.$root.children()[0]),f.autofocus&&w.open(),w.trigger("start").trigger("render"))},render:function(a){return a?w.$root.html(l()):w.$root.find("."+t.box).html(w.component.nodes(r.open)),w.trigger("render")},stop:function(){return r.start?(w.close(),w._hidden&&w._hidden.parentNode.removeChild(w._hidden),w.$root.remove(),u.removeClass(t.input).removeData(g),setTimeout(function(){u.off("."+r.id)},0),f.type=r.type,f.readOnly=!1,w.trigger("stop"),r.methods={},r.start=!1,w):w},open:function(c){return r.open?w:(u.addClass(t.active),e(f,"expanded",!0),setTimeout(function(){w.$root.addClass(t.opened),e(w.$root[0],"hidden",!1)},0),c!==!1&&(r.open=!0,q&&j.css("overflow","hidden").css("padding-right","+="+d()),u.trigger("focus"),i.on("click."+r.id+" focusin."+r.id,function(a){var b=a.target;b!=f&&b!=document&&3!=a.which&&w.close(b===w.$root.children()[0])}).on("keydown."+r.id,function(c){var d=c.keyCode,e=w.component.key[d],g=c.target;27==d?w.close(!0):g!=f||!e&&13!=d?a.contains(w.$root[0],g)&&13==d&&(c.preventDefault(),g.click()):(c.preventDefault(),e?b._.trigger(w.component.key.go,w,[b._.trigger(e)]):w.$root.find("."+t.highlighted).hasClass(t.disabled)||w.set("select",w.component.item.highlight).close())})),w.trigger("open"))},close:function(a){return a&&(u.off("focus."+r.id).trigger("focus"),setTimeout(function(){u.on("focus."+r.id,p)},0)),u.removeClass(t.active),e(f,"expanded",!1),setTimeout(function(){w.$root.removeClass(t.opened+" "+t.focused),e(w.$root[0],"hidden",!0)},0),r.open?(r.open=!1,q&&j.css("overflow","").css("padding-right","-="+d()),i.off("."+r.id),w.trigger("close")):w},clear:function(a){return w.set("clear",null,a)},set:function(b,c,d){var e,f,g=a.isPlainObject(b),h=g?b:{};if(d=g&&a.isPlainObject(c)?c:d||{},b){g||(h[b]=c);for(e in h)f=h[e],e in w.component.item&&(void 0===f&&(f=null),w.component.set(e,f,d)),("select"==e||"clear"==e)&&u.val("clear"==e?"":w.get(e,s.format)).trigger("change");w.render()}return d.muted?w:w.trigger("set",h)},get:function(a,c){if(a=a||"value",null!=r[a])return r[a];if("value"==a)return f.value;if(a in w.component.item){if("string"==typeof c){var d=w.component.get(a);return d?b._.trigger(w.component.formats.toString,w.component,[c,d]):""}return w.component.get(a)}},on:function(b,c,d){var e,f,g=a.isPlainObject(b),h=g?b:{};if(b){g||(h[b]=c);for(e in h)f=h[e],d&&(e="_"+e),r.methods[e]=r.methods[e]||[],r.methods[e].push(f)}return w},off:function(){var a,b,c=arguments;for(a=0,namesCount=c.length;namesCount>a;a+=1)b=c[a],b in r.methods&&delete r.methods[b];return w},trigger:function(a,c){var d=function(a){var d=r.methods[a];d&&d.map(function(a){b._.trigger(a,w,[c])})};return d("_"+a),d(a),w}};return new v}function c(a){var b,c="position";return a.currentStyle?b=a.currentStyle[c]:window.getComputedStyle&&(b=getComputedStyle(a)[c]),"fixed"==b}function d(){if(j.height()<=h.height())return 0;var b=a('<div style="visibility:hidden;width:100px" />').appendTo("body"),c=b[0].offsetWidth;b.css("overflow","scroll");var d=a('<div style="width:100%" />').appendTo(b),e=d[0].offsetWidth;return b.remove(),c-e}function e(b,c,d){if(a.isPlainObject(c))for(var e in c)f(b,e,c[e]);else f(b,c,d)}function f(a,b,c){a.setAttribute(("role"==b?"":"aria-")+b,c)}function g(b,c){a.isPlainObject(b)||(b={attribute:c}),c="";for(var d in b){var e=("role"==d?"":"aria-")+d,f=b[d];c+=null==f?"":e+'="'+b[d]+'"'}return c}var h=a(window),i=a(document),j=a(document.documentElement);return b.klasses=function(a){return a=a||"picker",{picker:a,opened:a+"--opened",focused:a+"--focused",input:a+"__input",active:a+"__input--active",holder:a+"__holder",frame:a+"__frame",wrap:a+"__wrap",box:a+"__box"}},b._={group:function(a){for(var c,d="",e=b._.trigger(a.min,a);e<=b._.trigger(a.max,a,[e]);e+=a.i)c=b._.trigger(a.item,a,[e]),d+=b._.node(a.node,c[0],c[1],c[2]);return d},node:function(b,c,d,e){return c?(c=a.isArray(c)?c.join(""):c,d=d?' class="'+d+'"':"",e=e?" "+e:"","<"+b+d+e+">"+c+"</"+b+">"):""},lead:function(a){return(10>a?"0":"")+a},trigger:function(a,b,c){return"function"==typeof a?a.apply(b,c||[]):a},digits:function(a){return/\d/.test(a[1])?2:1},isDate:function(a){return{}.toString.call(a).indexOf("Date")>-1&&this.isInteger(a.getUTCDate())},isInteger:function(a){return{}.toString.call(a).indexOf("Number")>-1&&a%1===0},ariaAttr:g},b.extend=function(c,d){a.fn[c]=function(e,f){var g=this.data(c);return"picker"==e?g:g&&"string"==typeof e?b._.trigger(g[e],g,[f]):this.each(function(){var f=a(this);f.data(c)||new b(this,c,d,e)})},a.fn[c].defaults=d.defaults},b}),function(a){"function"==typeof define&&define.amd?define(["picker","jquery"],a):"object"==typeof exports?module.exports=a(require("./picker.js"),require("jquery")):a(Picker,jQuery)}(function(a,b){function c(a,b){var c=this,d=a.$node[0],e=d.value,f=a.$node.data("value"),g=f||e,h=f?b.formatSubmit:b.format,i=function(){return d.currentStyle?"rtl"==d.currentStyle.direction:"rtl"==getComputedStyle(a.$root[0]).direction};c.settings=b,c.$node=a.$node,c.queue={min:"measure create",max:"measure create",now:"now create",select:"parse create validate",highlight:"parse navigate create validate",view:"parse create validate viewset",disable:"deactivate",enable:"activate"},c.item={},c.item.clear=null,c.item.disable=(b.disable||[]).slice(0),c.item.enable=-function(a){return a[0]===!0?a.shift():-1}(c.item.disable),c.set("min",b.min).set("max",b.max).set("now"),g?c.set("select",g,{format:h}):c.set("select",null).set("highlight",c.item.now),c.key={40:7,38:-7,39:function(){return i()?-1:1},37:function(){return i()?1:-1},go:function(a){var b=c.item.highlight,d=new Date(Date.UTC(b.year,b.month,b.date+a));c.set("highlight",d,{interval:a}),this.render()}},a.on("render",function(){a.$root.find("."+b.klass.selectMonth).on("change",function(){var c=this.value;c&&(a.set("highlight",[a.get("view").year,c,a.get("highlight").date]),a.$root.find("."+b.klass.selectMonth).trigger("focus"))}),a.$root.find("."+b.klass.selectYear).on("change",function(){var c=this.value;c&&(a.set("highlight",[c,a.get("view").month,a.get("highlight").date]),a.$root.find("."+b.klass.selectYear).trigger("focus"))})},1).on("open",function(){var d="";c.disabled(c.get("now"))&&(d=":not(."+b.klass.buttonToday+")"),a.$root.find("button"+d+", select").attr("disabled",!1)},1).on("close",function(){a.$root.find("button, select").attr("disabled",!0)},1)}var d=7,e=6,f=a._;c.prototype.set=function(a,b,c){var d=this,e=d.item;return null===b?("clear"==a&&(a="select"),e[a]=b,d):(e["enable"==a?"disable":"flip"==a?"enable":a]=d.queue[a].split(" ").map(function(e){return b=d[e](a,b,c)}).pop(),"select"==a?d.set("highlight",e.select,c):"highlight"==a?d.set("view",e.highlight,c):a.match(/^(flip|min|max|disable|enable)$/)&&(e.select&&d.disabled(e.select)&&d.set("select",e.select,c),e.highlight&&d.disabled(e.highlight)&&d.set("highlight",e.highlight,c)),d)},c.prototype.get=function(a){return this.item[a]},c.prototype.create=function(a,c,d){var e,g=this;return c=void 0===c?a:c,c==-1/0||1/0==c?e=c:b.isPlainObject(c)&&f.isInteger(c.pick)?c=c.obj:b.isArray(c)?(c=new Date(Date.UTC(c[0],c[1],c[2])),c=f.isDate(c)?c:g.create().obj):c=f.isInteger(c)?g.normalize(new Date(c),d):f.isDate(c)?g.normalize(c,d):g.now(a,c,d),{year:e||c.getUTCFullYear(),month:e||c.getUTCMonth(),date:e||c.getUTCDate(),day:e||c.getUTCDay(),obj:e||c,pick:e||c.getTime()}},c.prototype.createRange=function(a,c){var d=this,e=function(a){return a===!0||b.isArray(a)||f.isDate(a)?d.create(a):a};return f.isInteger(a)||(a=e(a)),f.isInteger(c)||(c=e(c)),f.isInteger(a)&&b.isPlainObject(c)?a=[c.year,c.month,c.date+a]:f.isInteger(c)&&b.isPlainObject(a)&&(c=[a.year,a.month,a.date+c]),{from:e(a),to:e(c)}},c.prototype.withinRange=function(a,b){return a=this.createRange(a.from,a.to),b.pick>=a.from.pick&&b.pick<=a.to.pick},c.prototype.overlapRanges=function(a,b){var c=this;return a=c.createRange(a.from,a.to),b=c.createRange(b.from,b.to),c.withinRange(a,b.from)||c.withinRange(a,b.to)||c.withinRange(b,a.from)||c.withinRange(b,a.to)},c.prototype.now=function(a,b,c){return b=new Date,c&&c.rel&&b.setUTCDate(b.getUTCDate()+c.rel),this.normalize(b,c)},c.prototype.navigate=function(a,c,d){var e,f,g,h,i=b.isArray(c),j=b.isPlainObject(c),k=this.item.view;if(i||j){for(j?(f=c.year,g=c.month,h=c.date):(f=+c[0],g=+c[1],h=+c[2]),d&&d.nav&&k&&k.month!==g&&(f=k.year,g=k.month),e=new Date(Date.UTC(f,g+(d&&d.nav?d.nav:0),1)),f=e.getUTCFullYear(),g=e.getUTCMonth();new Date(Date.UTC(f,g,h)).getUTCMonth()!==g;)h-=1;c=[f,g,h]}return c},c.prototype.normalize=function(a){return a.setUTCHours(0,0,0,0),a},c.prototype.measure=function(a,b){var c=this;return b?"string"==typeof b?b=c.parse(a,b):f.isInteger(b)&&(b=c.now(a,b,{rel:b})):b="min"==a?-1/0:1/0,b},c.prototype.viewset=function(a,b){return this.create([b.year,b.month,1])},c.prototype.validate=function(a,c,d){var e,g,h,i,j=this,k=c,l=d&&d.interval?d.interval:1,m=-1===j.item.enable,n=j.item.min,o=j.item.max,p=m&&j.item.disable.filter(function(a){if(b.isArray(a)){var d=j.create(a).pick;d<c.pick?e=!0:d>c.pick&&(g=!0)}return f.isInteger(a)}).length;if((!d||!d.nav)&&(!m&&j.disabled(c)||m&&j.disabled(c)&&(p||e||g)||!m&&(c.pick<=n.pick||c.pick>=o.pick)))for(m&&!p&&(!g&&l>0||!e&&0>l)&&(l*=-1);j.disabled(c)&&(Math.abs(l)>1&&(c.month<k.month||c.month>k.month)&&(c=k,l=l>0?1:-1),c.pick<=n.pick?(h=!0,l=1,c=j.create([n.year,n.month,n.date+(c.pick===n.pick?0:-1)])):c.pick>=o.pick&&(i=!0,l=-1,c=j.create([o.year,o.month,o.date+(c.pick===o.pick?0:1)])),!h||!i);)c=j.create([c.year,c.month,c.date+l]);return c},c.prototype.disabled=function(a){var c=this,d=c.item.disable.filter(function(d){return f.isInteger(d)?a.day===(c.settings.firstDay?d:d-1)%7:b.isArray(d)||f.isDate(d)?a.pick===c.create(d).pick:b.isPlainObject(d)?c.withinRange(d,a):void 0});return d=d.length&&!d.filter(function(a){return b.isArray(a)&&"inverted"==a[3]||b.isPlainObject(a)&&a.inverted}).length,-1===c.item.enable?!d:d||a.pick<c.item.min.pick||a.pick>c.item.max.pick},c.prototype.parse=function(a,b,c){var d=this,e={};return b&&"string"==typeof b?(c&&c.format||(c=c||{},c.format=d.settings.format),d.formats.toArray(c.format).map(function(a){var c=d.formats[a],g=c?f.trigger(c,d,[b,e]):a.replace(/^!/,"").length;c&&(e[a]=b.substr(0,g)),b=b.substr(g)}),[e.yyyy||e.yy,+(e.mm||e.m)-1,e.dd||e.d]):b},c.prototype.formats=function(){function a(a,b,c){var d=a.match(/\w+/)[0];return c.mm||c.m||(c.m=b.indexOf(d)+1),d.length}function b(a){return a.match(/\w+/)[0].length}return{d:function(a,b){return a?f.digits(a):b.date},dd:function(a,b){return a?2:f.lead(b.date)},ddd:function(a,c){return a?b(a):this.settings.weekdaysShort[c.day]},dddd:function(a,c){return a?b(a):this.settings.weekdaysFull[c.day]},m:function(a,b){return a?f.digits(a):b.month+1},mm:function(a,b){return a?2:f.lead(b.month+1)},mmm:function(b,c){var d=this.settings.monthsShort;return b?a(b,d,c):d[c.month]},mmmm:function(b,c){var d=this.settings.monthsFull;return b?a(b,d,c):d[c.month]},yy:function(a,b){return a?2:(""+b.year).slice(2)},yyyy:function(a,b){return a?4:b.year},toArray:function(a){return a.split(/(d{1,4}|m{1,4}|y{4}|yy|!.)/g)},toString:function(a,b){var c=this;return c.formats.toArray(a).map(function(a){return f.trigger(c.formats[a],c,[0,b])||a.replace(/^!/,"")}).join("")}}}(),c.prototype.isDateExact=function(a,c){var d=this;return f.isInteger(a)&&f.isInteger(c)||"boolean"==typeof a&&"boolean"==typeof c?a===c:(f.isDate(a)||b.isArray(a))&&(f.isDate(c)||b.isArray(c))?d.create(a).pick===d.create(c).pick:b.isPlainObject(a)&&b.isPlainObject(c)?d.isDateExact(a.from,c.from)&&d.isDateExact(a.to,c.to):!1},c.prototype.isDateOverlap=function(a,c){var d=this,e=d.settings.firstDay?1:0;return f.isInteger(a)&&(f.isDate(c)||b.isArray(c))?(a=a%7+e,a===d.create(c).day+1):f.isInteger(c)&&(f.isDate(a)||b.isArray(a))?(c=c%7+e,c===d.create(a).day+1):b.isPlainObject(a)&&b.isPlainObject(c)?d.overlapRanges(a,c):!1},c.prototype.flipEnable=function(a){var b=this.item;b.enable=a||(-1==b.enable?1:-1)},c.prototype.deactivate=function(a,c){var d=this,e=d.item.disable.slice(0);return"flip"==c?d.flipEnable():c===!1?(d.flipEnable(1),e=[]):c===!0?(d.flipEnable(-1),e=[]):c.map(function(a){for(var c,g=0;g<e.length;g+=1)if(d.isDateExact(a,e[g])){c=!0;break}c||(f.isInteger(a)||f.isDate(a)||b.isArray(a)||b.isPlainObject(a)&&a.from&&a.to)&&e.push(a)}),e},c.prototype.activate=function(a,c){var d=this,e=d.item.disable,g=e.length;return"flip"==c?d.flipEnable():c===!0?(d.flipEnable(1),e=[]):c===!1?(d.flipEnable(-1),e=[]):c.map(function(a){var c,h,i,j;for(i=0;g>i;i+=1){if(h=e[i],d.isDateExact(h,a)){c=e[i]=null,j=!0;break}if(d.isDateOverlap(h,a)){b.isPlainObject(a)?(a.inverted=!0,c=a):b.isArray(a)?(c=a,c[3]||c.push("inverted")):f.isDate(a)&&(c=[a.getUTCFullYear(),a.getUTCMonth(),a.getUTCDate(),"inverted"]);break}}if(c)for(i=0;g>i;i+=1)if(d.isDateExact(e[i],a)){e[i]=null;break}if(j)for(i=0;g>i;i+=1)if(d.isDateOverlap(e[i],a)){e[i]=null;break}c&&e.push(c)}),e.filter(function(a){return null!=a})},c.prototype.nodes=function(a){var b=this,c=b.settings,g=b.item,h=g.now,i=g.select,j=g.highlight,k=g.view,l=g.disable,m=g.min,n=g.max,o=function(a,b){return c.firstDay&&(a.push(a.shift()),b.push(b.shift())),f.node("thead",f.node("tr",f.group({min:0,max:d-1,i:1,node:"th",item:function(d){return[a[d],c.klass.weekdays,'scope=col title="'+b[d]+'"']}})))}((c.showWeekdaysFull?c.weekdaysFull:c.weekdaysShort).slice(0),c.weekdaysFull.slice(0)),p=function(a){return f.node("div"," ",c.klass["nav"+(a?"Next":"Prev")]+(a&&k.year>=n.year&&k.month>=n.month||!a&&k.year<=m.year&&k.month<=m.month?" "+c.klass.navDisabled:""),"data-nav="+(a||-1)+" "+f.ariaAttr({role:"button",components:b.$node[0].id+"_table"})+' title="'+(a?c.labelMonthNext:c.labelMonthPrev)+'"')},q=function(){var d=c.showMonthsShort?c.monthsShort:c.monthsFull;return c.selectMonths?f.node("select",f.group({min:0,max:11,i:1,node:"option",item:function(a){return[d[a],0,"value="+a+(k.month==a?" selected":"")+(k.year==m.year&&a<m.month||k.year==n.year&&a>n.month?" disabled":"")]}}),c.klass.selectMonth,(a?"":"disabled")+" "+f.ariaAttr({components:b.$node[0].id+"_table"})+' title="'+c.labelMonthSelect+'"'):f.node("div",d[k.month],c.klass.month)},r=function(){var d=k.year,e=c.selectYears===!0?5:~~(c.selectYears/2);if(e){var g=m.year,h=n.year,i=d-e,j=d+e;if(g>i&&(j+=g-i,i=g),j>h){var l=i-g,o=j-h;i-=l>o?o:l,j=h}return f.node("select",f.group({min:i,max:j,i:1,node:"option",item:function(a){return[a,0,"value="+a+(d==a?" selected":"")]}}),c.klass.selectYear,(a?"":"disabled")+" "+f.ariaAttr({components:b.$node[0].id+"_table"})+' title="'+c.labelYearSelect+'"')}return f.node("div",d,c.klass.year)};return f.node("div",(c.selectYears?r()+q():q()+r())+p()+p(1),c.klass.header)+f.node("table",o+f.node("tbody",f.group({min:0,max:e-1,i:1,node:"tr",item:function(a){var e=c.firstDay&&0===b.create([k.year,k.month,1]).day?-7:0;return[f.group({min:d*a-k.day+e+1,max:function(){return this.min+d-1},i:1,node:"td",item:function(a){a=b.create([k.year,k.month,a+(c.firstDay?1:0)]);var d=i&&i.pick==a.pick,e=j&&j.pick==a.pick,g=l&&b.disabled(a)||a.pick<m.pick||a.pick>n.pick;return[f.node("div",a.date,function(b){return b.push(k.month==a.month?c.klass.infocus:c.klass.outfocus),h.pick==a.pick&&b.push(c.klass.now),d&&b.push(c.klass.selected),e&&b.push(c.klass.highlighted),g&&b.push(c.klass.disabled),b.join(" ")}([c.klass.day]),"data-pick="+a.pick+" "+f.ariaAttr({role:"gridcell",selected:d&&b.$node.val()===f.trigger(b.formats.toString,b,[c.format,a])?!0:null,activedescendant:e?!0:null,disabled:g?!0:null})),"",f.ariaAttr({role:"presentation"})]}})]}})),c.klass.table,'id="'+b.$node[0].id+'_table" '+f.ariaAttr({role:"grid",components:b.$node[0].id,readonly:!0}))+f.node("div",f.node("button",c.today,c.klass.buttonToday,"type=button data-pick="+h.pick+(a&&!b.disabled(h)?"":" disabled")+" "+f.ariaAttr({components:b.$node[0].id}))+f.node("button",c.clear,c.klass.buttonClear,"type=button data-clear=1"+(a?"":" disabled")+" "+f.ariaAttr({components:b.$node[0].id}))+f.node("button",c.close,c.klass.buttonClose,"type=button data-close=true "+(a?"":" disabled")+" "+f.ariaAttr({components:b.$node[0].id})),c.klass.footer)},c.defaults=function(a){return{labelMonthNext:"Next month",labelMonthPrev:"Previous month",labelMonthSelect:"Select a month",labelYearSelect:"Select a year",monthsFull:["January","February","March","April","May","June","July","August","September","October","November","December"],monthsShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],weekdaysFull:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],weekdaysShort:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],today:"Today",clear:"Clear",close:"Close",format:"d mmmm, yyyy",klass:{table:a+"table",header:a+"header",navPrev:a+"nav--prev",navNext:a+"nav--next",navDisabled:a+"nav--disabled",month:a+"month",year:a+"year",selectMonth:a+"select--month",selectYear:a+"select--year",weekdays:a+"weekday",day:a+"day",disabled:a+"day--disabled",selected:a+"day--selected",highlighted:a+"day--highlighted",now:a+"day--today",infocus:a+"day--infocus",outfocus:a+"day--outfocus",footer:a+"footer",buttonClear:a+"button--clear",buttonToday:a+"button--today",buttonClose:a+"button--close"}}}(a.klasses().picker+"__"),a.extend("pickadate",c)});
783
-
784
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
785
-
786
- /**
787
- * Dialog Plugin
788
- *
789
- * Adds basic demonstration functionality to .ms-Dialog components.
790
- *
791
- * @param {jQuery Object} One or more .ms-Dialog components
792
- * @return {jQuery Object} The same components (allows for chaining)
793
- */
794
- (function ($) {
795
- $.fn.Dialog = function () {
796
-
797
- /** Iterate through the sample buttons, which can be used to open the Dialogs. */
798
- $(".js-DialogAction--open").each(function () {
799
- /** Open the associated dialog on click. */
800
- $(this).on('click', function () {
801
- var target = $(this).data("target");
802
- $(target).show();
803
- });
804
- });
805
-
806
-
807
- return this.each(function () {
808
- var dialog = this;
809
-
810
- /** Have the dialogs hidden for their initial state */
811
- $(dialog).hide();
812
-
813
- /** Have the close buttons close the Dialog. */
814
- $(dialog).find(".js-DialogAction--close").each(function() {
815
- $(this).on('click', function () {
816
- $(dialog).hide();
817
- });
818
- });
819
-
820
- /** Have the action buttons close the Dialog, though you would usually do some specific action per button. */
821
- $(dialog).find(".ms-Dialog-action").on('click', function () {
822
- $(dialog).hide();
823
- });
824
-
825
- });
826
- };
827
- })(jQuery);
828
-
829
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
830
-
831
- /**
832
- * Dropdown Plugin
833
- *
834
- * Given .ms-Dropdown containers with generic <select> elements inside, this plugin hides the original
835
- * dropdown and creates a new "fake" dropdown that can more easily be styled across browsers.
836
- *
837
- * @param {jQuery Object} One or more .ms-Dropdown containers, each with a dropdown (.ms-Dropdown-select)
838
- * @return {jQuery Object} The same containers (allows for chaining)
839
- */
840
- (function ($) {
841
- $.fn.Dropdown = function () {
842
-
843
- /** Go through each dropdown we've been given. */
844
- return this.each(function () {
845
-
846
- var $dropdownWrapper = $(this),
847
- $originalDropdown = $dropdownWrapper.children('.ms-Dropdown-select'),
848
- $originalDropdownOptions = $originalDropdown.children('option'),
849
- newDropdownTitle = '',
850
- newDropdownItems = '',
851
- newDropdownSource = '';
852
-
853
- /** Go through the options to fill up newDropdownTitle and newDropdownItems. */
854
- $originalDropdownOptions.each(function (index, option) {
855
-
856
- /** If the option is selected, it should be the new dropdown's title. */
857
- if (option.selected) {
858
- newDropdownTitle = option.text;
859
- }
860
-
861
- /** Add this option to the list of items. */
862
- newDropdownItems += '<li class="ms-Dropdown-item' + ( (option.disabled) ? ' is-disabled"' : '"' ) + '>' + option.text + '</li>';
863
-
864
- });
865
-
866
- /** Insert the replacement dropdown. */
867
- newDropdownSource = '<span class="ms-Dropdown-title">' + newDropdownTitle + '</span><ul class="ms-Dropdown-items">' + newDropdownItems + '</ul>';
868
- $dropdownWrapper.append(newDropdownSource);
869
-
870
- function _openDropdown(evt) {
871
- if (!$dropdownWrapper.hasClass('is-disabled')) {
872
-
873
- /** First, let's close any open dropdowns on this page. */
874
- $dropdownWrapper.find('.is-open').removeClass('is-open');
875
-
876
- /** Stop the click event from propagating, which would just close the dropdown immediately. */
877
- evt.stopPropagation();
878
-
879
- /** Before opening, size the items list to match the dropdown. */
880
- var dropdownWidth = $(this).parents(".ms-Dropdown").width();
881
- $(this).next(".ms-Dropdown-items").css('width', dropdownWidth + 'px');
882
-
883
- /** Go ahead and open that dropdown. */
884
- $dropdownWrapper.toggleClass('is-open');
885
- $('.ms-Dropdown').each(function(){
886
- if ($(this)[0] !== $dropdownWrapper[0]) {
887
- $(this).removeClass('is-open');
888
- }
889
- });
890
-
891
- /** Temporarily bind an event to the document that will close this dropdown when clicking anywhere. */
892
- $(document).bind("click.dropdown", function() {
893
- $dropdownWrapper.removeClass('is-open');
894
- $(document).unbind('click.dropdown');
895
- });
896
- }
897
- }
898
-
899
- /** Toggle open/closed state of the dropdown when clicking its title. */
900
- $dropdownWrapper.on('click', '.ms-Dropdown-title', function(event) {
901
- _openDropdown(event);
902
- });
903
-
904
- /** Keyboard accessibility */
905
- $dropdownWrapper.on('keyup', function(event) {
906
- var keyCode = event.keyCode || event.which;
907
- // Open dropdown on enter or arrow up or arrow down and focus on first option
908
- if (!$(this).hasClass('is-open')) {
909
- if (keyCode === 13 || keyCode === 38 || keyCode === 40) {
910
- _openDropdown(event);
911
- if (!$(this).find('.ms-Dropdown-item').hasClass('is-selected')) {
912
- $(this).find('.ms-Dropdown-item:first').addClass('is-selected');
913
- }
914
- }
915
- }
916
- else if ($(this).hasClass('is-open')) {
917
- // Up arrow focuses previous option
918
- if (keyCode === 38) {
919
- if ($(this).find('.ms-Dropdown-item.is-selected').prev().siblings().size() > 0) {
920
- $(this).find('.ms-Dropdown-item.is-selected').removeClass('is-selected').prev().addClass('is-selected');
921
- }
922
- }
923
- // Down arrow focuses next option
924
- if (keyCode === 40) {
925
- if ($(this).find('.ms-Dropdown-item.is-selected').next().siblings().size() > 0) {
926
- $(this).find('.ms-Dropdown-item.is-selected').removeClass('is-selected').next().addClass('is-selected');
927
- }
928
- }
929
- // Enter to select item
930
- if (keyCode === 13) {
931
- if (!$dropdownWrapper.hasClass('is-disabled')) {
932
-
933
- // Item text
934
- var selectedItemText = $(this).find('.ms-Dropdown-item.is-selected').text();
935
-
936
- $(this).find('.ms-Dropdown-title').html(selectedItemText);
937
-
938
- /** Update the original dropdown. */
939
- $originalDropdown.find("option").each(function(key, value) {
940
- if (value.text === selectedItemText) {
941
- $(this).prop('selected', true);
942
- } else {
943
- $(this).prop('selected', false);
944
- }
945
- });
946
- $originalDropdown.change();
947
-
948
- $(this).removeClass('is-open');
949
- }
950
- }
951
- }
952
-
953
- // Close dropdown on esc
954
- if (keyCode === 27) {
955
- $(this).removeClass('is-open');
956
- }
957
- });
958
-
959
- /** Select an option from the dropdown. */
960
- $dropdownWrapper.on('click', '.ms-Dropdown-item', function () {
961
- if (!$dropdownWrapper.hasClass('is-disabled') && !$(this).hasClass('is-disabled')) {
962
-
963
- /** Deselect all items and select this one. */
964
- $(this).siblings('.ms-Dropdown-item').removeClass('is-selected');
965
- $(this).addClass('is-selected');
966
-
967
- /** Update the replacement dropdown's title. */
968
- $(this).parents().siblings('.ms-Dropdown-title').html($(this).text());
969
-
970
- /** Update the original dropdown. */
971
- var selectedItemText = $(this).text();
972
- $originalDropdown.find("option").each(function(key, value) {
973
- if (value.text === selectedItemText) {
974
- $(this).prop('selected', true);
975
- } else {
976
- $(this).prop('selected', false);
977
- }
978
- });
979
- $originalDropdown.change();
980
- }
981
- });
982
-
983
- });
984
- };
985
- })(jQuery);
986
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
987
-
988
- /**
989
- * Facepile Plugin
990
- *
991
- * Adds basic demonstration functionality to .ms-Facepile components.
992
- *
993
- * @param {jQuery Object} One or more .ms-Facepile components
994
- * @return {jQuery Object} The same components (allows for chaining)
995
- */
996
- (function ($) {
997
- $.fn.Facepile = function () {
998
-
999
- /** Iterate through each Facepile provided. */
1000
- return this.each(function () {
1001
- $('.ms-PeoplePicker').PeoplePicker();
1002
- $('.ms-Panel').Panel();
1003
-
1004
- var $Facepile = $(this);
1005
- var $membersList = $(".ms-Facepile-members");
1006
- var $membersCount = $(".ms-Facepile-members > .ms-Facepile-itemBtn").length;
1007
- var $panel = $('.ms-Facepile-panel.ms-Panel');
1008
- var $panelMain = $panel.find(".ms-Panel-main");
1009
- var $picker = $('.ms-PeoplePicker.ms-PeoplePicker--Facepile');
1010
- var $pickerMembers = $picker.find('.ms-PeoplePicker-selectedPeople');
1011
- var $personaCard = $('.ms-Facepile').find('.ms-PersonaCard');
1012
-
1013
-
1014
- /** Increment member count and show/hide overflow text */
1015
- var incrementMembers = function() {
1016
- /** Increment person count by one */
1017
- $membersCount += 1;
1018
-
1019
- /** Display a maxiumum of 5 people */
1020
- $(".ms-Facepile-members").children(":gt(4)").hide();
1021
-
1022
- /** Display counter after 5 people are present */
1023
- if ($membersCount > 5) {
1024
- $(".ms-Facepile-itemBtn--overflow").addClass("is-active");
1025
-
1026
- var remainingMembers = $membersCount - 5;
1027
- $(".ms-Facepile-overflowText").text("+" + remainingMembers);
1028
- }
1029
- };
1030
-
1031
- /** Open panel with people picker */
1032
- $Facepile.on("click", ".js-addPerson", function() {
1033
- $panelMain.css({display: "block"});
1034
- $panel.toggleClass("is-open")
1035
- .addClass("ms-Panel-animateIn")
1036
- .removeClass('ms-Facepile-panel--overflow ms-Panel--right')
1037
- .addClass('ms-Facepile-panel--addPerson');
1038
-
1039
- /** Close any open persona cards */
1040
- $personaCard.removeClass('is-active').hide();
1041
- });
1042
-
1043
- $panel.on("click", ".js-togglePanel", function() {
1044
- $panel.toggleClass("is-open")
1045
- .addClass("ms-Panel-animateIn");
1046
- });
1047
-
1048
- /** Open oveflow panel with list of members */
1049
- $Facepile.on("click", ".js-overflowPanel", function() {
1050
- $panelMain.css({display: "block"});
1051
- $panel.toggleClass("is-open")
1052
- .addClass("ms-Panel-animateIn")
1053
- .removeClass('ms-Facepile-panel--addPerson')
1054
- .addClass('ms-Facepile-panel--overflow ms-Panel--right');
1055
- });
1056
-
1057
- /** Display person count on page load */
1058
- $(document).ready(function() {
1059
- $(".ms-Facepile-overflowText").text("+" + $membersCount);
1060
- });
1061
-
1062
- /** Show selected members from PeoplePicker in the Facepile */
1063
- $('.ms-PeoplePicker-result').on('click', function() {
1064
- var $this = $(this);
1065
- var name = $this.find(".ms-Persona-primaryText").html();
1066
- var title = $this.find(".ms-Persona-secondaryText").html();
1067
- var selectedInitials = (function() {
1068
- var nameArray = name.split(' ');
1069
- var nameInitials = '';
1070
- for (var i = 0; i < nameArray.length; i++) {
1071
- nameInitials += nameArray[i].charAt(0);
1072
- }
1073
-
1074
- return nameInitials.substring(0,2);
1075
- })();
1076
- var selectedClasses = $this.find('.ms-Persona-initials').attr('class');
1077
- var selectedImage = (function() {
1078
- if ($this.find('.ms-Persona-image').length) {
1079
- var selectedImageSrc = $this.find('.ms-Persona-image').attr('src');
1080
- return '<img class="ms-Persona-image" src="' + selectedImageSrc + '" alt="Persona image">';
1081
- } else {
1082
- return '';
1083
- }
1084
- })();
1085
-
1086
- var FacepileItem =
1087
- '<button class="ms-Facepile-itemBtn ms-Facepile-itemBtn--member" title="' + name + '">' +
1088
- '<div class="ms-Persona ms-Persona--xs">' +
1089
- '<div class="ms-Persona-imageArea">' +
1090
- '<div class="' + selectedClasses + '">' + selectedInitials + '</div>' +
1091
- selectedImage +
1092
- '</div>' +
1093
- '<div class="ms-Persona-presence"></div>' +
1094
- '<div class="ms-Persona-details">' +
1095
- '<div class="ms-Persona-primaryText">' + name + '</div>' +
1096
- '<div class="ms-Persona-secondaryText">' + title + '</div>' +
1097
- '</div>' +
1098
- '</div>' +
1099
- '</button>';
1100
-
1101
- /** Add new item to members list in Facepile */
1102
- $membersList.prepend(FacepileItem);
1103
-
1104
- /** Increment member count */
1105
- incrementMembers();
1106
- });
1107
-
1108
- /** Remove members in panel people picker */
1109
- $pickerMembers.on('click', '.js-selectedRemove', function() {
1110
- var memberText = $(this).parent().find('.ms-Persona-primaryText').text();
1111
-
1112
- var $FacepileMember = $membersList.find(".ms-Persona-primaryText:contains(" + memberText + ")").first();
1113
-
1114
- if ($FacepileMember) {
1115
- $FacepileMember.parent().closest('.ms-Facepile-itemBtn').remove();
1116
-
1117
- $membersCount -= 1;
1118
-
1119
- /** Display a maxiumum of 5 people */
1120
- $(".ms-Facepile-members").children(":lt(5)").show();
1121
-
1122
- /** Display counter after 5 people are present */
1123
- if ($membersCount <= 5) {
1124
- $(".ms-Facepile-itemBtn--overflow").removeClass("is-active");
1125
- } else {
1126
- var remainingMembers = $membersCount - 5;
1127
- $(".ms-Facepile-overflowText").text("+" + remainingMembers);
1128
- }
1129
- }
1130
- });
1131
-
1132
- /** Show persona card when selecting a Facepile item */
1133
- $membersList.on('click', '.ms-Facepile-itemBtn', function() {
1134
- var selectedName = $(this).find(".ms-Persona-primaryText").html();
1135
- var selectedTitle = $(this).find(".ms-Persona-secondaryText").html();
1136
- var selectedInitials = (function() {
1137
- var name = selectedName.split(' ');
1138
- var nameInitials = '';
1139
- for (var i = 0; i < name.length; i++) {
1140
- nameInitials += name[i].charAt(0);
1141
- }
1142
-
1143
- return nameInitials.substring(0,2);
1144
- })();
1145
- var selectedClasses = $(this).find('.ms-Persona-initials').attr('class');
1146
- var selectedImage = $(this).find('.ms-Persona-image').attr('src');
1147
- var $card = $('.ms-PersonaCard');
1148
- var $cardName = $card.find('.ms-Persona-primaryText');
1149
- var $cardTitle = $card.find('.ms-Persona-secondaryText');
1150
- var $cardInitials = $card.find('.ms-Persona-initials');
1151
- var $cardImage = $card.find('.ms-Persona-image');
1152
-
1153
- /** Close any open persona cards */
1154
- $personaCard.removeClass('is-active');
1155
-
1156
- /** Add data to persona card */
1157
- $cardName.text(selectedName);
1158
- $cardTitle.text(selectedTitle);
1159
- $cardInitials.text(selectedInitials);
1160
- $cardInitials.removeClass();
1161
- $cardInitials.addClass(selectedClasses);
1162
- $cardImage.attr('src', selectedImage);
1163
-
1164
- /** Show persona card */
1165
- setTimeout(function() { $personaCard.addClass('is-active'); }, 100);
1166
-
1167
- /** Align persona card on md and above screens */
1168
- if ($(window).width() > 480) {
1169
- var itemPosition = $(this).offset().left;
1170
- var correctedPosition = itemPosition - 26;
1171
-
1172
- $personaCard.css({'left': correctedPosition});
1173
- } else {
1174
- $personaCard.css({'left': 0, 'top': 'auto', 'position': 'fixed'});
1175
- }
1176
- });
1177
-
1178
- /** Dismiss persona card when clicking on the document */
1179
- $(document).on('click', function(e) {
1180
- var $memberBtn = $('.ms-Facepile-itemBtn--member');
1181
-
1182
- if (!$memberBtn.is(e.target) && $memberBtn.has(e.target).length === 0 && !$personaCard.is(e.target) && $personaCard.has(e.target).length === 0) {
1183
- $personaCard.removeClass('is-active');
1184
- $personaCard.removeAttr('style');
1185
- } else {
1186
- $personaCard.addClass('is-active');
1187
- }
1188
- });
1189
-
1190
- });
1191
- };
1192
- })(jQuery);
1193
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
1194
-
1195
- /**
1196
- * List Item Plugin
1197
- *
1198
- * Adds basic demonstration functionality to .ms-ListItem components.
1199
- *
1200
- * @param {jQuery Object} One or more .ms-ListItem components
1201
- * @return {jQuery Object} The same components (allows for chaining)
1202
- */
1203
- (function ($) {
1204
- $.fn.ListItem = function () {
1205
-
1206
- /** Go through each panel we've been given. */
1207
- return this.each(function () {
1208
-
1209
- var $listItem = $(this);
1210
-
1211
- /** Detect clicks on selectable list items. */
1212
- $listItem.on('click', '.js-toggleSelection', function() {
1213
- $(this).parents('.ms-ListItem').toggleClass('is-selected');
1214
- });
1215
-
1216
- });
1217
-
1218
- };
1219
- })(jQuery);
1220
-
1221
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
1222
-
1223
- /**
1224
- * MessageBanner component
1225
- *
1226
- * A component to display error messages
1227
- *
1228
- */
1229
-
1230
- /**
1231
- * @namespace fabric
1232
- */
1233
- var fabric = fabric || {};
1234
- /**
1235
- *
1236
- * @param {HTMLElement} container - the target container for an instance of MessageBanner
1237
- * @constructor
1238
- */
1239
- fabric.MessageBanner = function(container) {
1240
- this.container = container;
1241
- this.init();
1242
- };
1243
-
1244
- fabric.MessageBanner.prototype = (function() {
1245
-
1246
- var _clipper;
1247
- var _bufferSize;
1248
- var _textContainerMaxWidth = 700;
1249
- var _clientWidth;
1250
- var _textWidth;
1251
- var _initTextWidth;
1252
- var _chevronButton;
1253
- var _errorBanner;
1254
- var _actionButton;
1255
- var _closeButton;
1256
- var _bufferElementsWidth = 88;
1257
- var _bufferElementsWidthSmall = 35;
1258
- var SMALL_BREAK_POINT = 480;
1259
-
1260
- /**
1261
- * sets styles on resize
1262
- */
1263
- var _onResize = function() {
1264
- _clientWidth = _errorBanner.offsetWidth;
1265
- if(window.innerWidth >= SMALL_BREAK_POINT ) {
1266
- _resizeRegular();
1267
- } else {
1268
- _resizeSmall();
1269
- }
1270
- };
1271
-
1272
- /**
1273
- * resize above 480 pixel breakpoint
1274
- */
1275
- var _resizeRegular = function() {
1276
- if ((_clientWidth - _bufferSize) > _initTextWidth && _initTextWidth < _textContainerMaxWidth) {
1277
- _textWidth = "auto";
1278
- _chevronButton.className = "ms-MessageBanner-expand";
1279
- _collapse();
1280
- } else {
1281
- _textWidth = Math.min((_clientWidth - _bufferSize), _textContainerMaxWidth) + "px";
1282
- if(_chevronButton.className.indexOf("is-visible") === -1) {
1283
- _chevronButton.className += " is-visible";
1284
- }
1285
- }
1286
- _clipper.style.width = _textWidth;
1287
- };
1288
-
1289
- /**
1290
- * resize below 480 pixel breakpoint
1291
- */
1292
- var _resizeSmall = function() {
1293
- if (_clientWidth - (_bufferElementsWidthSmall + _closeButton.offsetWidth) > _initTextWidth) {
1294
- _textWidth = "auto";
1295
- _collapse();
1296
- } else {
1297
- _textWidth = (_clientWidth - (_bufferElementsWidthSmall + _closeButton.offsetWidth)) + "px";
1298
- }
1299
- _clipper.style.width = _textWidth;
1300
- };
1301
- /**
1302
- * caches elements and values of the component
1303
- */
1304
- var _cacheDOM = function(context) {
1305
- _errorBanner = context.container;
1306
- _clipper = context.container.querySelector('.ms-MessageBanner-clipper');
1307
- _chevronButton = context.container.querySelector('.ms-MessageBanner-expand');
1308
- _actionButton = context.container.querySelector('.ms-MessageBanner-action');
1309
- _bufferSize = _actionButton.offsetWidth + _bufferElementsWidth;
1310
- _closeButton = context.container.querySelector('.ms-MessageBanner-close');
1311
- };
1312
-
1313
- /**
1314
- * expands component to show full error message
1315
- */
1316
- var _expand = function() {
1317
- var icon = _chevronButton.querySelector('.ms-Icon');
1318
- _errorBanner.className += " is-expanded";
1319
- icon.className = "ms-Icon ms-Icon--chevronsUp";
1320
- };
1321
-
1322
- /**
1323
- * collapses component to only show truncated message
1324
- */
1325
- var _collapse = function() {
1326
- var icon = _chevronButton.querySelector('.ms-Icon');
1327
- _errorBanner.className = "ms-MessageBanner";
1328
- icon.className = "ms-Icon ms-Icon--chevronsDown";
1329
- };
1330
-
1331
- var _toggleExpansion = function() {
1332
- if (_errorBanner.className.indexOf("is-expanded") > -1) {
1333
- _collapse();
1334
- } else {
1335
- _expand();
1336
- }
1337
- };
1338
-
1339
- /**
1340
- * hides banner when close button is clicked
1341
- */
1342
- var _hideBanner = function() {
1343
- if(_errorBanner.className.indexOf("hide") === -1) {
1344
- _errorBanner.className += " hide";
1345
- setTimeout(function() {
1346
- _errorBanner.className = "ms-MessageBanner is-hidden";
1347
- }, 500);
1348
- }
1349
- };
1350
-
1351
- /**
1352
- * shows banner if the banner is hidden
1353
- */
1354
- var _showBanner = function() {
1355
- _errorBanner.className = "ms-MessageBanner";
1356
- };
1357
-
1358
- /**
1359
- * sets handlers for resize and button click events
1360
- */
1361
- var _setListeners = function() {
1362
- window.addEventListener('resize', _onResize, false);
1363
- _chevronButton.addEventListener("click", _toggleExpansion, false);
1364
- _closeButton.addEventListener("click", _hideBanner, false);
1365
- };
1366
-
1367
- /**
1368
- * initializes component
1369
- */
1370
- var init = function() {
1371
- _cacheDOM(this);
1372
- _setListeners();
1373
- _clientWidth = _errorBanner.offsetWidth;
1374
- _initTextWidth = _clipper.offsetWidth;
1375
- _onResize(null);
1376
- };
1377
-
1378
- return {
1379
- init: init,
1380
- showBanner: _showBanner
1381
- };
1382
- }());
1383
-
1384
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
1385
-
1386
- /**
1387
- * Nav Bar Plugin
1388
- */
1389
- (function ($) {
1390
- $.fn.NavBar = function () {
1391
-
1392
- /** Go through each nav bar we've been given. */
1393
- return this.each(function () {
1394
-
1395
- var $navBar = $(this);
1396
-
1397
- // Open the nav bar on mobile.
1398
- $navBar.on('click', '.js-openMenu', function(event) {
1399
- event.stopPropagation();
1400
- $navBar.toggleClass('is-open');
1401
- });
1402
-
1403
- // Close the nav bar on mobile.
1404
- $navBar.click(function() {
1405
- if ($navBar.hasClass('is-open')) {
1406
- $navBar.removeClass('is-open');
1407
- }
1408
- });
1409
-
1410
- // Set selected states and open/close menus.
1411
- $navBar.on('click', '.ms-NavBar-item:not(.is-disabled)', function(event) {
1412
- var $searchBox = $navBar.find('.ms-NavBar-item.ms-NavBar-item--search .ms-TextField-field');
1413
- event.stopPropagation();
1414
-
1415
- // Prevent default actions from firing if links are not found.
1416
- if ($(this).children('.ms-NavBar-link').length === 0) {
1417
- event.preventDefault();
1418
- }
1419
-
1420
- // Deselect all of the items.
1421
- $(this).siblings('.ms-NavBar-item').removeClass('is-selected');
1422
-
1423
- // Close and blur the search box if it doesn't have text.
1424
- if ($searchBox.length > 0 && $searchBox.val().length === 0) {
1425
- $('.ms-NavBar-item.ms-NavBar-item--search').removeClass('is-open').find('.ms-TextField-field').blur();
1426
- }
1427
-
1428
- // Does the selected item have a menu?
1429
- if ($(this).hasClass('ms-NavBar-item--hasMenu')) {
1430
-
1431
- // First, close any neighboring menus.
1432
- $(this).siblings('.ms-NavBar-item--hasMenu').children('.ms-ContextualMenu:first').removeClass('is-open');
1433
-
1434
- // Toggle 'is-open' to open or close it.
1435
- $(this).children('.ms-ContextualMenu:first').toggleClass('is-open');
1436
-
1437
- // Toggle 'is-selected' to indicate whether it is active.
1438
- $(this).toggleClass('is-selected');
1439
- } else {
1440
- // Doesn't have a menu, so just select the item.
1441
- $(this).addClass('is-selected');
1442
-
1443
- // Close the submenu and any open contextual menus.
1444
- $navBar.removeClass('is-open').find('.ms-ContextualMenu').removeClass('is-open');
1445
- }
1446
-
1447
- // Is this the search box? Open it up and focus on the search field.
1448
- if ($(this).hasClass('ms-NavBar-item--search')) {
1449
- $(this).addClass('is-open');
1450
- $(this).find('.ms-TextField-field').focus();
1451
-
1452
- // Close any open menus.
1453
- $navBar.find('.ms-ContextualMenu:first').removeClass('is-open');
1454
- }
1455
- });
1456
-
1457
- // Prevent contextual menus from being hidden when clicking on them.
1458
- $navBar.on('click', '.ms-NavBar-item .ms-ContextualMenu', function(event) {
1459
- event.stopPropagation();
1460
-
1461
- // Collapse the mobile "panel" for nav items.
1462
- $(this).removeClass('is-open');
1463
- $navBar.removeClass('is-open').find('.ms-NavBar-item--hasMenu').removeClass('is-selected');
1464
- });
1465
-
1466
- // Hide any menus and close the search box when clicking anywhere in the document.
1467
- $(document).on('click', 'html', function() {
1468
- var $searchBox = $navBar.find('.ms-NavBar-item.ms-NavBar-item--search .ms-TextField-field');
1469
- $navBar.find('.ms-NavBar-item').removeClass('is-selected').find('.ms-ContextualMenu').removeClass('is-open');
1470
-
1471
- // Close and blur the search box if it doesn't have text.
1472
- if ($searchBox.length > 0 && $searchBox.val().length === 0) {
1473
- $navBar.find('.ms-NavBar-item.ms-NavBar-item--search').removeClass('is-open').find('.ms-TextField-field').blur();
1474
- }
1475
- });
1476
- });
1477
- };
1478
- })(jQuery);
1479
-
1480
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
1481
-
1482
- /**
1483
- * Panel Plugin
1484
- *
1485
- * Adds basic demonstration functionality to .ms-Panel components.
1486
- *
1487
- * @param {jQuery Object} One or more .ms-Panel components
1488
- * @return {jQuery Object} The same components (allows for chaining)
1489
- */
1490
- (function ($) {
1491
- $.fn.Panel = function () {
1492
-
1493
- var pfx = ["webkit", "moz", "MS", "o", ""];
1494
-
1495
- // Prefix function
1496
- function prefixedEvent(element, type, callback) {
1497
- for (var p = 0; p < pfx.length; p++) {
1498
- if (!pfx[p]) { type = type.toLowerCase(); }
1499
- element.addEventListener(pfx[p]+type, callback, false);
1500
- }
1501
- }
1502
-
1503
- /** Go through each panel we've been given. */
1504
- return this.each(function () {
1505
-
1506
- var $panel = $(this);
1507
- var $panelMain = $panel.find(".ms-Panel-main");
1508
-
1509
- /** Hook to open the panel. */
1510
- $(".ms-PanelAction-close").on("click", function() {
1511
-
1512
- // Display Panel first, to allow animations
1513
- $panel.addClass("ms-Panel-animateOut");
1514
-
1515
- });
1516
-
1517
- $(".ms-PanelAction-open").on("click", function() {
1518
-
1519
- // Display Panel first, to allow animations
1520
- $panel.addClass("is-open");
1521
-
1522
- // Add animation class
1523
- $panel.addClass("ms-Panel-animateIn");
1524
-
1525
- });
1526
-
1527
- prefixedEvent($panelMain[0], 'AnimationEnd', function(event) {
1528
- if (event.animationName.indexOf('Out') > -1) {
1529
-
1530
- // Hide and Prevent ms-Panel-main from being interactive
1531
- $panel.removeClass('is-open');
1532
-
1533
- // Remove animating classes for the next time we open panel
1534
- $panel.removeClass('ms-Panel-animateIn ms-Panel-animateOut');
1535
-
1536
- }
1537
- });
1538
-
1539
- // Pivots for sample page to show variant panel sizes
1540
- $(".panelVariant-item").on("click", function() {
1541
- var className = $(this).find('span').attr('class');
1542
-
1543
- $(".panelVariant-item").removeClass('is-selected');
1544
- $(this).addClass('is-selected');
1545
-
1546
- switch (className) {
1547
- case 'is-default':
1548
- $('.ms-Panel').removeClass().addClass('ms-Panel');
1549
- break;
1550
- case 'is-left':
1551
- $('.ms-Panel').removeClass().addClass('ms-Panel ms-Panel--left');
1552
- break;
1553
- case 'is-lightDismiss':
1554
- $('.ms-Panel').removeClass().addClass('ms-Panel ms-Panel--lightDismiss');
1555
- break;
1556
- case 'is-md':
1557
- $('.ms-Panel').removeClass().addClass('ms-Panel ms-Panel--md');
1558
- break;
1559
- case 'is-lgFixed':
1560
- $('.ms-Panel').removeClass().addClass('ms-Panel ms-Panel--lg ms-Panel--fixed');
1561
- break;
1562
- case 'is-lg':
1563
- $('.ms-Panel').removeClass().addClass('ms-Panel ms-Panel--lg');
1564
- break;
1565
- case 'is-xl':
1566
- $('.ms-Panel').removeClass().addClass('ms-Panel ms-Panel--xl');
1567
- break;
1568
- }
1569
- });
1570
- });
1571
-
1572
- };
1573
- })(jQuery);
1574
-
1575
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
1576
-
1577
- var fabric = fabric || {};
1578
-
1579
- /**
1580
- * People Picker Plugin
1581
- *
1582
- * Adds basic demonstration functionality to .ms-PeoplePicker components.
1583
- *
1584
- * @param {jQuery Object} One or more .ms-PeoplePicker components
1585
- * @return {jQuery Object} The same components (allows for chaining)
1586
- */
1587
-
1588
- (function ($) {
1589
- $.fn.PeoplePicker = function () {
1590
-
1591
- /** Iterate through each people picker provided. */
1592
- return this.each(function () {
1593
-
1594
- var $peoplePicker = $(this);
1595
- var $searchField = $peoplePicker.find(".ms-PeoplePicker-searchField");
1596
- var $results = $peoplePicker.find(".ms-PeoplePicker-results");
1597
- var $selected = $peoplePicker.find('.ms-PeoplePicker-selected');
1598
- var $selectedPeople = $peoplePicker.find(".ms-PeoplePicker-selectedPeople");
1599
- var $selectedCount = $peoplePicker.find(".ms-PeoplePicker-selectedCount");
1600
- var $peopleList = $peoplePicker.find(".ms-PeoplePicker-peopleList");
1601
- var isActive = false;
1602
- var spinner;
1603
- var $personaCard = $('.ms-PeoplePicker').find('.ms-PersonaCard');
1604
-
1605
- // Run when focused or clicked
1606
- function peoplePickerActive(event) {
1607
- /** Scroll the view so that the people picker is at the top. */
1608
- $('html, body').animate({
1609
- scrollTop: $peoplePicker.offset().top
1610
- }, 367);
1611
-
1612
- /** Start by closing any open people pickers. */
1613
- if ( $peoplePicker.hasClass('is-active') ) {
1614
- $peoplePicker.removeClass("is-active");
1615
- }
1616
-
1617
- /** Display a maxiumum of 5 people in Facepile variant */
1618
- if ($peoplePicker.hasClass('ms-PeoplePicker--Facepile') && $searchField.val() === "") {
1619
- $peopleList.children(":gt(4)").hide();
1620
- }
1621
-
1622
- /** Animate results and members in Facepile variant. */
1623
- if ($peoplePicker.hasClass('ms-PeoplePicker--Facepile')) {
1624
- // $results.addClass('ms-u-slideDownIn20');
1625
- $selectedPeople.addClass('ms-u-slideDownIn20');
1626
- setTimeout(function() { $results.removeClass('ms-u-slideDownIn20'); $selectedPeople.removeClass('ms-u-slideDownIn20');}, 1000);
1627
- }
1628
-
1629
- isActive = true;
1630
-
1631
- /** Stop the click event from propagating, which would just close the dropdown immediately. */
1632
- event.stopPropagation();
1633
-
1634
- /** Before opening, size the results panel to match the people picker. */
1635
- if (!$peoplePicker.hasClass('ms-PeoplePicker--Facepile')) {
1636
- $results.width($peoplePicker.width() - 2);
1637
- }
1638
-
1639
- /** Show the $results by setting the people picker to active. */
1640
- $peoplePicker.addClass("is-active");
1641
-
1642
- /** Temporarily bind an event to the document that will close the people picker when clicking anywhere. */
1643
- $(document).bind("click.peoplepicker", function() {
1644
- $peoplePicker.removeClass('is-active');
1645
- if ($peoplePicker.hasClass('ms-PeoplePicker--Facepile')) {
1646
- $peoplePicker.removeClass('is-searching');
1647
- $('.ms-PeoplePicker-selected').show();
1648
- $('.ms-PeoplePicker-searchMore').removeClass('is-active');
1649
- $searchField.val("");
1650
- }
1651
- $(document).unbind('click.peoplepicker');
1652
- isActive = false;
1653
- });
1654
- }
1655
-
1656
- /** Set to active when focusing on the input. */
1657
- $peoplePicker.on('focus', '.ms-PeoplePicker-searchField', function(event) {
1658
- peoplePickerActive(event);
1659
- });
1660
-
1661
- /** Set to active when clicking on the input. */
1662
- $peoplePicker.on('click', '.ms-PeoplePicker-searchField', function(event) {
1663
- peoplePickerActive(event);
1664
- });
1665
-
1666
- /** Keep the people picker active when clicking within it. */
1667
- $(this).click(function (event) {
1668
- event.stopPropagation();
1669
- });
1670
-
1671
- /** Add the selected person to the text field or selected list and close the people picker. */
1672
- $results.on('click', '.ms-PeoplePicker-result', function () {
1673
- var $this = $(this);
1674
- var selectedName = $this.find(".ms-Persona-primaryText").html();
1675
- var selectedTitle = $this.find(".ms-Persona-secondaryText").html();
1676
- var selectedInitials = (function() {
1677
- var name = selectedName.split(' ');
1678
- var nameInitials = '';
1679
-
1680
- for (var i = 0; i < name.length; i++) {
1681
- nameInitials += name[i].charAt(0);
1682
- }
1683
-
1684
- return nameInitials.substring(0,2);
1685
- })();
1686
- var selectedClasses = $this.find('.ms-Persona-initials').attr('class');
1687
- var selectedImage = (function() {
1688
- if ($this.find('.ms-Persona-image').length) {
1689
- var selectedImageSrc = $this.find('.ms-Persona-image').attr('src');
1690
- return '<img class="ms-Persona-image" src="' + selectedImageSrc + '" alt="Persona image">';
1691
- } else {
1692
- return '';
1693
- }
1694
- })();
1695
-
1696
- /** Token html */
1697
- var personaHTML = '<div class="ms-PeoplePicker-persona">' +
1698
- '<div class="ms-Persona ms-Persona--xs ms-Persona--square">' +
1699
- '<div class="ms-Persona-imageArea">' +
1700
- '<div class="' + selectedClasses + '">' + selectedInitials + '</div>' +
1701
- selectedImage +
1702
- '</div>' +
1703
- '<div class="ms-Persona-presence"></div>' +
1704
- '<div class="ms-Persona-details">' +
1705
- '<div class="ms-Persona-primaryText">' + selectedName + '</div>' +
1706
- ' </div>' +
1707
- '</div>' +
1708
- '<button class="ms-PeoplePicker-personaRemove">' +
1709
- '<i class="ms-Icon ms-Icon--x"></i>' +
1710
- ' </button>' +
1711
- '</div>';
1712
- /** List item html */
1713
- var personaListItem = '<li class="ms-PeoplePicker-selectedPerson">' +
1714
- '<div class="ms-Persona ms-Persona--sm">' +
1715
- '<div class="ms-Persona-imageArea">' +
1716
- '<div class="' + selectedClasses + '">' + selectedInitials + '</div>' +
1717
- selectedImage +
1718
- '</div>' +
1719
- '<div class="ms-Persona-presence"></div>' +
1720
- '<div class="ms-Persona-details">' +
1721
- '<div class="ms-Persona-primaryText">' + selectedName + '</div>' +
1722
- '<div class="ms-Persona-secondaryText">' + selectedTitle + '</div>' +
1723
- '</div>' +
1724
- '</div>' +
1725
- '<button class="ms-PeoplePicker-resultAction js-selectedRemove"><i class="ms-Icon ms-Icon--x"></i></button>' +
1726
- '</li>';
1727
- /** Tokenize selected persona if not Facepile or memberslist variants */
1728
- if (!$peoplePicker.hasClass('ms-PeoplePicker--Facepile') && !$peoplePicker.hasClass('ms-PeoplePicker--membersList') ) {
1729
- $searchField.before(personaHTML);
1730
- $peoplePicker.removeClass("is-active");
1731
- resizeSearchField($peoplePicker);
1732
- }
1733
- /** Add selected persona to a list if Facepile or memberslist variants */
1734
- else {
1735
- if (!$selected.hasClass('is-active')) {
1736
- $selected.addClass('is-active');
1737
- }
1738
- /** Prepend persona list item html to selected people list */
1739
- $selectedPeople.prepend(personaListItem);
1740
- /** Close the picker */
1741
- $peoplePicker.removeClass("is-active");
1742
- /** Get the total amount of selected personas and display that number */
1743
- var count = $peoplePicker.find('.ms-PeoplePicker-selectedPerson').length;
1744
- $selectedCount.html(count);
1745
- /** Return picker back to default state:
1746
- - Show only the first five results in the people list for when the picker is reopened
1747
- - Make searchMore inactive
1748
- - Clear any search field text
1749
- */
1750
- $peopleList.children().show();
1751
- $peopleList.children(":gt(4)").hide();
1752
-
1753
- $('.ms-PeoplePicker-searchMore').removeClass('is-active');
1754
- $searchField.val("");
1755
- }
1756
- });
1757
-
1758
- /** Remove the persona when clicking the personaRemove button. */
1759
- $peoplePicker.on('click', '.ms-PeoplePicker-personaRemove', function() {
1760
- $(this).parents('.ms-PeoplePicker-persona').remove();
1761
-
1762
- /** Make the search field 100% width if all personas have been removed */
1763
- if ( $('.ms-PeoplePicker-persona').length === 0 ) {
1764
- $peoplePicker.find('.ms-PeoplePicker-searchField').outerWidth('100%');
1765
- } else {
1766
- resizeSearchField($peoplePicker);
1767
- }
1768
- });
1769
-
1770
- /** Trigger additional searching when clicking the search more area. */
1771
- $results.on('click', '.js-searchMore', function() {
1772
- var $searchMore = $(this);
1773
- var primaryLabel = $searchMore.find(".ms-PeoplePicker-searchMorePrimary");
1774
- var originalPrimaryLabelText = primaryLabel.html();
1775
- var searchFieldText = $searchField.val();
1776
-
1777
- /** Change to searching state. */
1778
- $searchMore.addClass("is-searching");
1779
- primaryLabel.html("Searching for " + searchFieldText);
1780
-
1781
- /** Attach Spinner */
1782
- if (!spinner) {
1783
- spinner = new fabric.Spinner($searchMore.get(0));
1784
- } else {
1785
- spinner.start();
1786
- }
1787
-
1788
- /** Show all results in Facepile variant */
1789
- if($peoplePicker.hasClass('ms-PeoplePicker--Facepile')) {
1790
- setTimeout(function() {$peopleList.children().show();}, 1500);
1791
- }
1792
-
1793
- /** Return the original state. */
1794
- setTimeout(function() {
1795
- $searchMore.removeClass("is-searching");
1796
- primaryLabel.html(originalPrimaryLabelText);
1797
- spinner.stop();
1798
- }, 1500);
1799
- });
1800
-
1801
- /** Remove a result using the action icon. */
1802
- $results.on('click', '.js-resultRemove', function(event) {
1803
- event.stopPropagation();
1804
- $(this).parent(".ms-PeoplePicker-result").remove();
1805
- });
1806
-
1807
- /** Expand a result if more details are available. */
1808
- $results.on('click', '.js-resultExpand', function(event) {
1809
- event.stopPropagation();
1810
- $(this).parent(".ms-PeoplePicker-result").toggleClass("is-expanded");
1811
- });
1812
-
1813
- /** Remove a selected person using the action icon. */
1814
- $selectedPeople.on('click', '.js-selectedRemove', function(event) {
1815
- event.stopPropagation();
1816
- $(this).parent(".ms-PeoplePicker-selectedPerson").remove();
1817
- var count = $peoplePicker.find('.ms-PeoplePicker-selectedPerson').length;
1818
- $selectedCount.html(count);
1819
- if ($peoplePicker.find('.ms-PeoplePicker-selectedPerson').length === 0) {
1820
- $selected.removeClass('is-active');
1821
- }
1822
- });
1823
-
1824
- var filterResults = function(results, currentSuggestion, currentValueExists) {
1825
- return results.find('.ms-Persona-primaryText').filter(function() {
1826
- if (currentValueExists) {
1827
- return $(this).text().toLowerCase() === currentSuggestion;
1828
- } else {
1829
- return $(this).text().toLowerCase() !== currentSuggestion;
1830
- }
1831
- }).parents('.ms-PeoplePicker-peopleListItem');
1832
- };
1833
-
1834
- /** Search people picker items */
1835
- $peoplePicker.on('keyup', '.ms-PeoplePicker-searchField', function(evt) {
1836
- var suggested = [];
1837
- var newSuggestions = [];
1838
- var $pickerResult = $results.find('.ms-Persona-primaryText');
1839
-
1840
- $peoplePicker.addClass('is-searching');
1841
-
1842
- /** Hide members */
1843
- $selected.hide();
1844
-
1845
- /** Show 5 results */
1846
- $peopleList.children(":lt(5)").show();
1847
-
1848
- /** Show searchMore button */
1849
- $('.ms-PeoplePicker-searchMore').addClass('is-active');
1850
-
1851
- /** Get array of suggested people */
1852
- $pickerResult.each(function() { suggested.push($(this).text()); });
1853
-
1854
- /** Iterate over array to find matches and show matching items */
1855
- for (var i = 0; i < suggested.length; i++) {
1856
- var currentPersona = suggested[i].toLowerCase();
1857
- var currentValue = evt.target.value.toLowerCase();
1858
- var currentSuggestion;
1859
-
1860
- if (currentPersona.indexOf(currentValue) > -1) {
1861
- currentSuggestion = suggested[i].toLowerCase();
1862
-
1863
- newSuggestions.push(suggested[i]);
1864
-
1865
- filterResults($results, currentSuggestion, true).show();
1866
- } else {
1867
- filterResults($results, currentSuggestion, false).hide();
1868
- }
1869
- }
1870
-
1871
- /** Show members and hide searchmore when field is empty */
1872
- if ($(this).val() === "") {
1873
- $peoplePicker.removeClass('is-searching');
1874
- $selected.show();
1875
- $('.ms-PeoplePicker-searchMore').removeClass('is-active');
1876
- $selectedPeople.addClass('ms-u-slideDownIn20');
1877
- setTimeout(function() { $selectedPeople.removeClass('ms-u-slideDownIn20');}, 1000);
1878
- $peopleList.children(":gt(4)").hide();
1879
- }
1880
- });
1881
-
1882
- /** Show persona card when clicking a persona in the members list */
1883
- $selectedPeople.on('click', '.ms-Persona', function() {
1884
- var selectedName = $(this).find(".ms-Persona-primaryText").html();
1885
- var selectedTitle = $(this).find(".ms-Persona-secondaryText").html();
1886
- var selectedInitials = (function() {
1887
- var name = selectedName.split(' ');
1888
- var nameInitials = '';
1889
-
1890
- for (var i = 0; i < name.length; i++) {
1891
- nameInitials += name[i].charAt(0);
1892
- }
1893
-
1894
- return nameInitials.substring(0,2);
1895
- })();
1896
- var selectedClasses = $(this).find('.ms-Persona-initials').attr('class');
1897
- var selectedImage = $(this).find('.ms-Persona-image').attr('src');
1898
- var $card = $('.ms-PersonaCard');
1899
- var $cardName = $card.find('.ms-Persona-primaryText');
1900
- var $cardTitle = $card.find('.ms-Persona-secondaryText');
1901
- var $cardInitials = $card.find('.ms-Persona-initials');
1902
- var $cardImage = $card.find('.ms-Persona-image');
1903
-
1904
- /** Close any open persona cards */
1905
- $personaCard.removeClass('is-active');
1906
-
1907
- /** Add data to persona card */
1908
- $cardName.text(selectedName);
1909
- $cardTitle.text(selectedTitle);
1910
- $cardInitials.text(selectedInitials);
1911
- $cardInitials.removeClass();
1912
- $cardInitials.addClass(selectedClasses);
1913
- $cardImage.attr('src', selectedImage);
1914
-
1915
- /** Show persona card */
1916
- setTimeout(function() {
1917
- $personaCard.addClass('is-active');
1918
- setTimeout(function(){$personaCard.css({'animation-name': 'none'});}, 300);
1919
- }, 100);
1920
-
1921
- /** Align persona card on md and above screens */
1922
- if ($(window).width() > 480) {
1923
- var itemPositionTop = $(this).offset().top;
1924
- var correctedPositionTop = itemPositionTop + 10;
1925
-
1926
- $personaCard.css({'top': correctedPositionTop, 'left': 0});
1927
- } else {
1928
- $personaCard.css({'top': 'auto'});
1929
- }
1930
- });
1931
-
1932
- /** Dismiss persona card when clicking on the document */
1933
- $(document).on('click', function(e) {
1934
- var $memberBtn = $('.ms-PeoplePicker-selectedPerson').find('.ms-Persona');
1935
-
1936
- if (!$memberBtn.is(e.target) && !$personaCard.is(e.target) && $personaCard.has(e.target).length === 0) {
1937
- $personaCard.removeClass('is-active');
1938
- setTimeout(function(){$personaCard.removeAttr('style');}, 300);
1939
- } else {
1940
- $personaCard.addClass('is-active');
1941
- }
1942
- });
1943
- });
1944
- };
1945
-
1946
- /** Resize the search field to match the search box */
1947
- function resizeSearchField($peoplePicker) {
1948
- var $searchBox = $peoplePicker.find('.ms-PeoplePicker-searchBox');
1949
-
1950
- // Where is the right edge of the search box?
1951
- var searchBoxLeftEdge = $searchBox.position().left;
1952
- var searchBoxWidth = $searchBox.outerWidth();
1953
- var searchBoxRightEdge = searchBoxLeftEdge + searchBoxWidth;
1954
-
1955
- // Where is the right edge of the last persona component?
1956
- var $lastPersona = $searchBox.find('.ms-PeoplePicker-persona:last');
1957
- var lastPersonaLeftEdge = $lastPersona.offset().left;
1958
- var lastPersonaWidth = $lastPersona.outerWidth();
1959
- var lastPersonaRightEdge = lastPersonaLeftEdge + lastPersonaWidth;
1960
-
1961
- // Adjust the width of the field to fit the remaining space.
1962
- var newFieldWidth = searchBoxRightEdge - lastPersonaRightEdge - 7;
1963
-
1964
- // Don't let the field get too tiny.
1965
- if (newFieldWidth < 100) {
1966
- newFieldWidth = "100%";
1967
- }
1968
-
1969
- // Set the width of the search field
1970
- $peoplePicker.find('.ms-PeoplePicker-searchField').outerWidth(newFieldWidth);
1971
- }
1972
- })(jQuery);
1973
-
1974
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
1975
-
1976
- /**
1977
- * Persona Card Plugin
1978
- *
1979
- * Adds basic demonstration functionality to .ms-PersonaCard components.
1980
- *
1981
- * @param {jQuery Object} One or more .ms-PersonaCard components
1982
- * @return {jQuery Object} The same components (allows for chaining)
1983
- */
1984
- (function ($) {
1985
- $.fn.PersonaCard = function () {
1986
-
1987
- /** Go through each file picker we've been given. */
1988
- return this.each(function () {
1989
-
1990
- var $personaCard = $(this);
1991
-
1992
- /** When selecting an action, show its details. */
1993
- $personaCard.on('click', '.ms-PersonaCard-action', function() {
1994
-
1995
- /** Select the correct tab. */
1996
- $personaCard.find('.ms-PersonaCard-action').removeClass('is-active');
1997
- $(this).addClass('is-active');
1998
-
1999
- /** Function for switching selected item into view by adding a class to ul. */
2000
- var updateForItem = function(wrapper, item) {
2001
- var previousItem = wrapper.className + "";
2002
- var detail = item.charAt(0).toUpperCase() + item.slice(1);
2003
- var nextItem = "ms-PersonaCard-detail" + detail;
2004
- if (previousItem !== nextItem){
2005
- wrapper.classList.remove(previousItem);
2006
- wrapper.classList.add(nextItem);
2007
- }
2008
- };
2009
-
2010
- /** Get id of selected item */
2011
- var el = $(this).attr('id');
2012
- /** Add detail class to ul to switch it into view. */
2013
- updateForItem($(this).parent().next().find('#detailList')[0], el);
2014
-
2015
- /** Display the corresponding details. */
2016
- var requestedAction = $(this).attr('id');
2017
- $personaCard.find('.ms-PersonaCard-actionDetails').removeClass('is-active');
2018
- $personaCard.find('#' + requestedAction + '.ms-PersonaCard-actionDetails').addClass('is-active');
2019
-
2020
- });
2021
-
2022
- /** Toggle more details. */
2023
- $personaCard.on('click', '.ms-PersonaCard-detailExpander', function() {
2024
- $(this).parent('.ms-PersonaCard-actionDetails').toggleClass('is-collapsed');
2025
- });
2026
-
2027
- });
2028
-
2029
- };
2030
- })(jQuery);
2031
-
2032
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
2033
-
2034
- /**
2035
- * Pivot Plugin
2036
- *
2037
- * Adds basic demonstration functionality to .ms-Pivot components.
2038
- *
2039
- * @param {jQuery Object} One or more .ms-Pivot components
2040
- * @return {jQuery Object} The same components (allows for chaining)
2041
- */
2042
- (function ($) {
2043
- $.fn.Pivot = function () {
2044
-
2045
- /** Go through each pivot we've been given. */
2046
- return this.each(function () {
2047
-
2048
- var $pivotContainer = $(this);
2049
-
2050
- /** When clicking/tapping a link, select it. */
2051
- $pivotContainer.on('click', '.ms-Pivot-link', function(event) {
2052
- event.preventDefault();
2053
- /** Check if current selection has elipses child element **/
2054
- var $elipsisCheck = $(this).find('.ms-Pivot-ellipsis');
2055
-
2056
- /** Only execute when no elipses element can be found **/
2057
- if($elipsisCheck.length === 0){
2058
-
2059
- $(this).siblings('.ms-Pivot-link').removeClass('is-selected');
2060
- $(this).addClass('is-selected');
2061
- }
2062
-
2063
- });
2064
-
2065
- });
2066
-
2067
- };
2068
- })(jQuery);
2069
-
2070
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
2071
-
2072
- /**
2073
- * ProgressIndicator component
2074
- *
2075
- * A component for outputting determinate progress
2076
- *
2077
- */
2078
-
2079
- /**
2080
- * @namespace fabric
2081
- */
2082
- var fabric = fabric || {};
2083
- /**
2084
- *
2085
- * @param {HTMLDivElement} container - the target container for an instance of ProgressIndicator
2086
- * @constructor
2087
- */
2088
- fabric.ProgressIndicator = function(container) {
2089
- this.container = container;
2090
- this.cacheDOM();
2091
- };
2092
-
2093
- fabric.ProgressIndicator.prototype = (function() {
2094
-
2095
- var _progress;
2096
- var _width;
2097
- var _itemName;
2098
- var _total;
2099
- var _itemDescription;
2100
- var _progressBar;
2101
-
2102
- /**
2103
- * Sets the progress percentage for a determinate
2104
- * operation. Either use this or setProgress
2105
- * and setTotal as setProgressPercent assumes
2106
- * you've done a percentage calculation before
2107
- * injecting it into the function
2108
- * @param {number} percent - a floating point number from 0 to 1
2109
- */
2110
- var setProgressPercent = function(percent) {
2111
- _progressBar.style.width = Math.round(_width * percent) + "px";
2112
- };
2113
-
2114
- /**
2115
- * Sets the progress for a determinate operation.
2116
- * Use this in combination with setTotal.
2117
- * @param {number} progress
2118
- */
2119
- var setProgress = function(progress) {
2120
- _progress = progress;
2121
- var percentage = _progress / _total;
2122
- this.setProgressPercent(percentage);
2123
- };
2124
-
2125
- /**
2126
- * Sets the total file size, etc. for a
2127
- * determinate operation. Use this in
2128
- * combination with setProgress
2129
- * @param {number} total
2130
- */
2131
- var setTotal = function(total) {
2132
- _total = total;
2133
- };
2134
-
2135
- /**
2136
- * Sets the text for the title or label
2137
- * of an instance
2138
- * @param {string} name
2139
- */
2140
- var setName = function(name) {
2141
- _itemName.innerHTML = name;
2142
- };
2143
-
2144
- /**
2145
- * Sets the text for a description
2146
- * of an instance
2147
- * @param {string} name
2148
- */
2149
- var setDescription = function(description) {
2150
- _itemDescription.innerHTML = description;
2151
- };
2152
-
2153
- /**
2154
- * caches elements and values of the component
2155
- *
2156
- */
2157
- var cacheDOM = function() {
2158
- _itemName = this.container.querySelector('.ms-ProgressIndicator-itemName') || null; //an itemName element is optional
2159
- _itemDescription = this.container.querySelector('.ms-ProgressIndicator-itemDescription') || null; //an itemDescription element is optional
2160
- _progressBar = this.container.querySelector('.ms-ProgressIndicator-progressBar');
2161
- _width = this.container.querySelector('.ms-ProgressIndicator-itemProgress').offsetWidth;
2162
- };
2163
-
2164
- return {
2165
- setProgressPercent: setProgressPercent,
2166
- setName: setName,
2167
- setDescription: setDescription,
2168
- setProgress: setProgress,
2169
- setTotal: setTotal,
2170
- cacheDOM: cacheDOM
2171
- };
2172
- }());
2173
-
2174
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
2175
-
2176
- /**
2177
- * SearchBox Plugin
2178
- *
2179
- * Adds basic demonstration functionality to .ms-SearchBox components.
2180
- *
2181
- * @param {jQuery Object} One or more .ms-SearchBox components
2182
- * @return {jQuery Object} The same components (allows for chaining)
2183
- */
2184
- (function ($) {
2185
- $.fn.SearchBox = function () {
2186
-
2187
- /** Iterate through each text field provided. */
2188
- return this.each(function () {
2189
- // Set cancel to false
2190
- var cancel = false;
2191
- var $searchField = $(this).find('.ms-SearchBox-field');
2192
-
2193
- /** SearchBox focus - hide label and show cancel button */
2194
- $searchField.on('focus', function() {
2195
- /** Hide the label on focus. */
2196
- $(this).siblings('.ms-SearchBox-label').hide();
2197
- // Show cancel button by adding is-active class
2198
- $(this).parent('.ms-SearchBox').addClass('is-active');
2199
- });
2200
-
2201
- /** 'hovering' class allows for more fine grained control of hover state */
2202
- $searchField.on('mouseover', function() {
2203
- $searchField.addClass('hovering');
2204
- });
2205
-
2206
- $searchField.on('mouseout', function() {
2207
- $searchField.removeClass('hovering');
2208
- });
2209
-
2210
- // If cancel button is selected, change cancel value to true
2211
- $(this).find('.ms-SearchBox-closeButton').on('mousedown', function() {
2212
- cancel = true;
2213
- });
2214
-
2215
- /** Show the label again when leaving the field. */
2216
- $(this).find('.ms-SearchBox-field').on('blur', function() {
2217
-
2218
- // If cancel button is selected remove the text and show the label
2219
- if (cancel) {
2220
- $(this).val('');
2221
- $searchField.addClass('hovering');
2222
- }
2223
-
2224
- var $searchBox = $(this).parent('.ms-SearchBox');
2225
- // Prevents inputfield from gaining focus too soon
2226
- setTimeout(function() {
2227
- // Remove is-active class - hides cancel button
2228
- $searchBox.removeClass('is-active');
2229
- }, 10);
2230
-
2231
- /** Only do this if no text was entered. */
2232
- if ($(this).val().length === 0 ) {
2233
- $(this).siblings('.ms-SearchBox-label').show();
2234
- }
2235
-
2236
- // Reset cancel to false
2237
- cancel = false;
2238
- });
2239
- });
2240
-
2241
- };
2242
- })(jQuery);
2243
-
2244
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
2245
-
2246
- /**
2247
- * Spinner Component
2248
- *
2249
- * An animating activity indicator.
2250
- *
2251
- */
2252
-
2253
- /**
2254
- * @namespace fabric
2255
- */
2256
- var fabric = fabric || {};
2257
-
2258
- /**
2259
- * @param {HTMLDOMElement} target - The element the Spinner will attach itself to.
2260
- */
2261
-
2262
- fabric.Spinner = function(target) {
2263
-
2264
- var _target = target;
2265
- var eightSize = 0.2;
2266
- var circleObjects = [];
2267
- var animationSpeed = 90;
2268
- var interval;
2269
- var spinner;
2270
- var numCircles;
2271
- var offsetSize;
2272
- var fadeIncrement = 0;
2273
- var parentSize = 20;
2274
-
2275
- /**
2276
- * @function start - starts or restarts the animation sequence
2277
- * @memberOf fabric.Spinner
2278
- */
2279
- function start() {
2280
- stop();
2281
- interval = setInterval(function() {
2282
- var i = circleObjects.length;
2283
- while(i--) {
2284
- _fade(circleObjects[i]);
2285
- }
2286
- }, animationSpeed);
2287
- }
2288
-
2289
- /**
2290
- * @function stop - stops the animation sequence
2291
- * @memberOf fabric.Spinner
2292
- */
2293
- function stop() {
2294
- clearInterval(interval);
2295
- }
2296
-
2297
- //private methods
2298
-
2299
- function _init() {
2300
- _setTargetElement();
2301
- _setPropertiesForSize();
2302
- _createCirclesAndArrange();
2303
- _initializeOpacities();
2304
- start();
2305
- }
2306
-
2307
- function _initializeOpacities() {
2308
- var i = 0;
2309
- var j = 1;
2310
- var opacity;
2311
- fadeIncrement = 1 / numCircles;
2312
-
2313
- for (i; i < numCircles; i++) {
2314
- var circleObject = circleObjects[i];
2315
- opacity = (fadeIncrement * j++);
2316
- _setOpacity(circleObject.element, opacity);
2317
- }
2318
- }
2319
-
2320
- function _fade(circleObject) {
2321
- var opacity = _getOpacity(circleObject.element) - fadeIncrement;
2322
-
2323
- if (opacity <= 0) {
2324
- opacity = 1;
2325
- }
2326
-
2327
- _setOpacity(circleObject.element, opacity);
2328
- }
2329
-
2330
- function _getOpacity(element) {
2331
- return parseFloat(window.getComputedStyle(element).getPropertyValue("opacity"));
2332
- }
2333
-
2334
- function _setOpacity(element, opacity) {
2335
- element.style.opacity = opacity;
2336
- }
2337
-
2338
- function _createCircle() {
2339
- var circle = document.createElement('div');
2340
- circle.className = "ms-Spinner-circle";
2341
- circle.style.width = circle.style.height = parentSize * offsetSize + "px";
2342
- return circle;
2343
- }
2344
-
2345
- function _createCirclesAndArrange() {
2346
-
2347
- var angle = 0;
2348
- var offset = parentSize * offsetSize;
2349
- var step = (2 * Math.PI) / numCircles;
2350
- var i = numCircles;
2351
- var circleObject;
2352
- var radius = (parentSize - offset) * 0.5;
2353
-
2354
- while (i--) {
2355
- var circle = _createCircle();
2356
- var x = Math.round(parentSize * 0.5 + radius * Math.cos(angle) - circle.clientWidth * 0.5) - offset * 0.5;
2357
- var y = Math.round(parentSize * 0.5 + radius * Math.sin(angle) - circle.clientHeight * 0.5) - offset * 0.5;
2358
- spinner.appendChild(circle);
2359
- circle.style.left = x + 'px';
2360
- circle.style.top = y + 'px';
2361
- angle += step;
2362
- circleObject = { element:circle, j:i };
2363
- circleObjects.push(circleObject);
2364
- }
2365
- }
2366
-
2367
- function _setPropertiesForSize() {
2368
- if (spinner.className.indexOf("large") > -1) {
2369
- parentSize = 28;
2370
- eightSize = 0.179;
2371
- }
2372
-
2373
- offsetSize = eightSize;
2374
- numCircles = 8;
2375
- }
2376
-
2377
- function _setTargetElement() {
2378
- //for backwards compatibility
2379
- if (_target.className.indexOf("ms-Spinner") === -1) {
2380
- spinner = document.createElement("div");
2381
- spinner.className = "ms-Spinner";
2382
- _target.appendChild(spinner);
2383
- } else {
2384
- spinner = _target;
2385
- }
2386
- }
2387
-
2388
- _init();
2389
-
2390
- return {
2391
- start:start,
2392
- stop:stop
2393
- };
2394
- };
2395
-
2396
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
2397
-
2398
- /**
2399
- * Text Field Plugin
2400
- *
2401
- * Adds basic demonstration functionality to .ms-TextField components.
2402
- *
2403
- * @param {jQuery Object} One or more .ms-TextField components
2404
- * @return {jQuery Object} The same components (allows for chaining)
2405
- */
2406
- (function ($) {
2407
- $.fn.TextField = function () {
2408
-
2409
- /** Iterate through each text field provided. */
2410
- return this.each(function () {
2411
-
2412
- /** Does it have a placeholder? */
2413
- if ($(this).hasClass("ms-TextField--placeholder")) {
2414
-
2415
- /** Hide the label on click. */
2416
- $(this).on('click', function () {
2417
- $(this).find('.ms-Label').hide();
2418
- });
2419
-
2420
- /** Hide the label on focus. */
2421
- $(this).find('.ms-TextField-field').on('focus', function () {
2422
- $(this).siblings('.ms-Label').hide();
2423
- });
2424
-
2425
- /** Show the label again when leaving the field. */
2426
- $(this).find('.ms-TextField-field').on('blur', function () {
2427
-
2428
- /** Only do this if no text was entered. */
2429
- if ($(this).val().length === 0) {
2430
- $(this).siblings('.ms-Label').show();
2431
- }
2432
- });
2433
- }
2434
-
2435
- /** Underlined - adding/removing a focus class */
2436
- if ($(this).hasClass('ms-TextField--underlined')) {
2437
-
2438
- /** Add is-active class - changes border color to theme primary */
2439
- $(this).find('.ms-TextField-field').on('focus', function() {
2440
- $(this).parent('.ms-TextField--underlined').addClass('is-active');
2441
- });
2442
-
2443
- /** Remove is-active on blur of textfield */
2444
- $(this).find('.ms-TextField-field').on('blur', function() {
2445
- $(this).parent('.ms-TextField--underlined').removeClass('is-active');
2446
- });
2447
- }
2448
-
2449
- });
2450
- };
2451
- })(jQuery);