angular-ui-rails 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- data/MIT-LICENSE +22 -0
- data/README.md +21 -0
- data/lib/angular-ui-rails.rb +8 -0
- data/lib/angular-ui-rails/version.rb +5 -0
- data/vendor/assets/javascripts/angular-ui-ieshiv.js +84 -0
- data/vendor/assets/javascripts/angular-ui-ieshiv.min.js +7 -0
- data/vendor/assets/javascripts/angular-ui.js +1138 -0
- data/vendor/assets/javascripts/angular-ui.min.js +7 -0
- data/vendor/assets/stylesheets/angular-ui.css +46 -0
- data/vendor/assets/stylesheets/angular-ui.min.css +1 -0
- metadata +54 -0
data/MIT-LICENSE
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
Angular-UI-Rails RubyGem Copyright (c) 2012 Mike Park
|
2
|
+
|
3
|
+
Angular.JS and related components Copyright (c) 2010-2012 Google Inc.
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
6
|
+
a copy of this software and associated documentation files (the
|
7
|
+
"Software"), to deal in the Software without restriction, including
|
8
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
9
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
10
|
+
permit persons to whom the Software is furnished to do so, subject to
|
11
|
+
the following conditions:
|
12
|
+
|
13
|
+
The above copyright notice and this permission notice shall be
|
14
|
+
included in all copies or substantial portions of the Software.
|
15
|
+
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
17
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
18
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
19
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
20
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
21
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
22
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,21 @@
|
|
1
|
+
# angular-ui-rails
|
2
|
+
|
3
|
+
angular-ui-rails wraps the [Angular.js UI](http://angular-ui.github.com/) library for use in Rails 3.1 and above. Assets will minify automatically during production.
|
4
|
+
|
5
|
+
## Usage
|
6
|
+
|
7
|
+
Add the following to your gemfile:
|
8
|
+
|
9
|
+
gem 'angular-ui-rails'
|
10
|
+
|
11
|
+
Add the following directive to your Javascript manifest file (application.js):
|
12
|
+
|
13
|
+
//= require angular-ui
|
14
|
+
|
15
|
+
Add the following directive to your Stylesheet manifest file (application.css):
|
16
|
+
|
17
|
+
/*
|
18
|
+
*= require angular-ui
|
19
|
+
*/
|
20
|
+
|
21
|
+
Gem based on Angularjs-rails(https://github.com/confuseddesi/angularjs-rails) by Hirav Gandhi
|
@@ -0,0 +1,84 @@
|
|
1
|
+
/**
|
2
|
+
* AngularUI - The companion suite for AngularJS
|
3
|
+
* @version v0.2.0 - 2012-08-06
|
4
|
+
* @link http://angular-ui.github.com
|
5
|
+
* @license MIT License, http://www.opensource.org/licenses/MIT
|
6
|
+
*/
|
7
|
+
|
8
|
+
// READ: http://docs-next.angularjs.org/guide/ie
|
9
|
+
(function(exports){
|
10
|
+
|
11
|
+
var debug = window.ieShivDebug || false;
|
12
|
+
|
13
|
+
var getIE = function() {
|
14
|
+
// Returns the version of Internet Explorer or a -1
|
15
|
+
// (indicating the use of another browser).
|
16
|
+
var rv = -1; // Return value assumes failure.
|
17
|
+
if (navigator.appName == 'Microsoft Internet Explorer') {
|
18
|
+
var ua = navigator.userAgent;
|
19
|
+
var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
|
20
|
+
if (re.exec(ua) != null) {
|
21
|
+
rv = parseFloat( RegExp.$1 );
|
22
|
+
}
|
23
|
+
}
|
24
|
+
return rv;
|
25
|
+
};
|
26
|
+
|
27
|
+
var toCustomElements = function(str,delim) {
|
28
|
+
var result = [];
|
29
|
+
var dashed = str.replace(/([A-Z])/g, function($1) { return " "+$1.toLowerCase();} );
|
30
|
+
var tokens = dashed.split(' ');
|
31
|
+
var ns = tokens[0];
|
32
|
+
var dirname = tokens.slice(1).join('-');
|
33
|
+
|
34
|
+
// this is finite list and it seemed senseless to create a custom method
|
35
|
+
result.push(ns + ":" + dirname);
|
36
|
+
result.push(ns + "-" + dirname);
|
37
|
+
result.push("x-" + ns + "-" + dirname);
|
38
|
+
result.push("data-" + ns + "-" + dirname);
|
39
|
+
return result;
|
40
|
+
};
|
41
|
+
|
42
|
+
var shiv = function() {
|
43
|
+
// TODO: unfortunately, angular is not exposing these in 'ng' module
|
44
|
+
var tags = [ 'ngInclude', 'ngPluralize', 'ngView' ]; // angular specific,
|
45
|
+
|
46
|
+
// TODO: unfortunately, angular does not expose module names, it is a simple change to angular's loader.js
|
47
|
+
// however, not sure if something happens when referencing them, so maybe an OK thing.
|
48
|
+
|
49
|
+
var moduleNames = window.myAngularModules || []; // allow user to inject their own directives
|
50
|
+
moduleNames.push('ui.directives');
|
51
|
+
|
52
|
+
if(debug) console.log('moduleNames', moduleNames);
|
53
|
+
for(var k = 0, mlen = moduleNames.length; k < mlen; k++) {
|
54
|
+
var modules = angular.module(moduleNames[k]); // will throw runtime exception
|
55
|
+
angular.forEach(modules._invokeQueue, function(item) {
|
56
|
+
// only allow directives
|
57
|
+
if(item[1] === "directive") {
|
58
|
+
var dirname = item[2][0];
|
59
|
+
tags.push(dirname);
|
60
|
+
} else {
|
61
|
+
if(debug) console.log("skipping",item[1], item[2][0]);
|
62
|
+
}
|
63
|
+
});
|
64
|
+
}
|
65
|
+
|
66
|
+
if(debug) console.log("tags found", tags);
|
67
|
+
for(var i = 0, tlen = tags.length; i < tlen; i++) {
|
68
|
+
if(debug) console.log("tag",tags[i]);
|
69
|
+
var customElements = toCustomElements(tags[i],':');
|
70
|
+
for(var j = 0, clen = customElements.length; j < clen; j++) {
|
71
|
+
var customElement = customElements[j];
|
72
|
+
if(debug) console.log("shivving",customElement);
|
73
|
+
document.createElement(customElement);
|
74
|
+
}
|
75
|
+
}
|
76
|
+
};
|
77
|
+
|
78
|
+
var ieVersion = getIE();
|
79
|
+
|
80
|
+
if ((ieVersion > -1 && ieVersion < 9) || debug) {
|
81
|
+
shiv();
|
82
|
+
}
|
83
|
+
|
84
|
+
})(window);
|
@@ -0,0 +1,7 @@
|
|
1
|
+
/**
|
2
|
+
* AngularUI - The companion suite for AngularJS
|
3
|
+
* @version v0.2.0 - 2012-08-06
|
4
|
+
* @link http://angular-ui.github.com
|
5
|
+
* @license MIT License, http://www.opensource.org/licenses/MIT
|
6
|
+
*/
|
7
|
+
(function(a){var b=window.ieShivDebug||!1,c=function(){var a=-1;if(navigator.appName=="Microsoft Internet Explorer"){var b=navigator.userAgent,c=new RegExp("MSIE ([0-9]{1,}[.0-9]{0,})");c.exec(b)!=null&&(a=parseFloat(RegExp.$1))}return a},d=function(a,b){var c=[],d=a.replace(/([A-Z])/g,function(a){return" "+a.toLowerCase()}),e=d.split(" "),f=e[0],g=e.slice(1).join("-");return c.push(f+":"+g),c.push(f+"-"+g),c.push("x-"+f+"-"+g),c.push("data-"+f+"-"+g),c},e=function(){var a=["ngInclude","ngPluralize","ngView"],c=window.myAngularModules||[];c.push("ui.directives"),b&&console.log("moduleNames",c);for(var e=0,f=c.length;e<f;e++){var g=angular.module(c[e]);angular.forEach(g._invokeQueue,function(c){if(c[1]==="directive"){var d=c[2][0];a.push(d)}else b&&console.log("skipping",c[1],c[2][0])})}b&&console.log("tags found",a);for(var h=0,i=a.length;h<i;h++){b&&console.log("tag",a[h]);var j=d(a[h],":");for(var k=0,l=j.length;k<l;k++){var m=j[k];b&&console.log("shivving",m),document.createElement(m)}}},f=c();(f>-1&&f<9||b)&&e()})(window);
|
@@ -0,0 +1,1138 @@
|
|
1
|
+
/**
|
2
|
+
* AngularUI - The companion suite for AngularJS
|
3
|
+
* @version v0.2.0 - 2012-08-06
|
4
|
+
* @link http://angular-ui.github.com
|
5
|
+
* @license MIT License, http://www.opensource.org/licenses/MIT
|
6
|
+
*/
|
7
|
+
|
8
|
+
|
9
|
+
angular.module('ui.config', []).value('ui.config', {});
|
10
|
+
angular.module('ui.filters', ['ui.config']);
|
11
|
+
angular.module('ui.directives', ['ui.config']);
|
12
|
+
angular.module('ui', ['ui.filters', 'ui.directives', 'ui.config']);
|
13
|
+
|
14
|
+
|
15
|
+
/**
|
16
|
+
* Animates the injection of new DOM elements by simply creating the DOM with a class and then immediately removing it
|
17
|
+
* Animations must be done using CSS3 transitions, but provide excellent flexibility
|
18
|
+
*
|
19
|
+
* @todo Add proper support for animating out
|
20
|
+
* @param [options] {mixed} Can be an object with multiple options, or a string with the animation class
|
21
|
+
* class {string} the CSS class(es) to use. For example, 'ui-hide' might be an excellent alternative class.
|
22
|
+
* @example <li ng-repeat="item in items" ui-animate=" 'ui-hide' ">{{item}}</li>
|
23
|
+
*/
|
24
|
+
angular.module('ui.directives').directive('uiAnimate', ['ui.config', '$timeout', function(uiConfig, $timeout) {
|
25
|
+
var options = {};
|
26
|
+
if (angular.isString(uiConfig.animate)) {
|
27
|
+
options['class'] = uiConfig.animate;
|
28
|
+
} else if (uiConfig.animate) {
|
29
|
+
options = uiConfig.animate;
|
30
|
+
}
|
31
|
+
return {
|
32
|
+
restrict: 'A', // supports using directive as element, attribute and class
|
33
|
+
link: function($scope, element, attrs) {
|
34
|
+
var opts = {};
|
35
|
+
if (attrs.uiAnimate) {
|
36
|
+
opts = $scope.$eval(attrs.uiAnimate);
|
37
|
+
if (angular.isString(opts)) {
|
38
|
+
opts = {'class': opts};
|
39
|
+
}
|
40
|
+
}
|
41
|
+
opts = angular.extend({'class': 'ui-animate'}, options, opts);
|
42
|
+
|
43
|
+
element.addClass(opts['class']);
|
44
|
+
$timeout(function(){
|
45
|
+
element.removeClass(opts['class']);
|
46
|
+
}, false);
|
47
|
+
}
|
48
|
+
};
|
49
|
+
}]);
|
50
|
+
|
51
|
+
|
52
|
+
/*global angular, CodeMirror, Error*/
|
53
|
+
/**
|
54
|
+
* Binds a CodeMirror widget to a <textarea> element.
|
55
|
+
*/
|
56
|
+
angular.module('ui.directives').directive('uiCodemirror', ['ui.config', '$parse', function (uiConfig, $parse) {
|
57
|
+
'use strict';
|
58
|
+
|
59
|
+
uiConfig.codemirror = uiConfig.codemirror || {};
|
60
|
+
return {
|
61
|
+
require: 'ngModel',
|
62
|
+
link: function (scope, elm, attrs, ngModel) {
|
63
|
+
// Only works on textareas
|
64
|
+
if ( !elm.is('textarea') ) {
|
65
|
+
throw new Error('ui-codemirror can only be applied to a textarea element');
|
66
|
+
}
|
67
|
+
|
68
|
+
var codemirror;
|
69
|
+
// This is the method that we use to get the value of the ui-codemirror attribute expression.
|
70
|
+
var uiCodemirrorGet = $parse(attrs.uiCodemirror);
|
71
|
+
// This method will be called whenever the code mirror widget content changes
|
72
|
+
var onChangeHandler = function (ed) {
|
73
|
+
// We only update the model if the value has changed - this helps get around a little problem where $render triggers a change despite already being inside a $apply loop.
|
74
|
+
var newValue = ed.getValue();
|
75
|
+
if ( newValue !== ngModel.$viewValue ) {
|
76
|
+
ngModel.$setViewValue(newValue);
|
77
|
+
scope.$apply();
|
78
|
+
}
|
79
|
+
};
|
80
|
+
// Create and wire up a new code mirror widget (unwiring a previous one if necessary)
|
81
|
+
var updateCodeMirror = function(options) {
|
82
|
+
// Merge together the options from the uiConfig and the attribute itself with the onChange event above.
|
83
|
+
options = angular.extend({}, options, uiConfig.codemirror);
|
84
|
+
|
85
|
+
// We actually want to run both handlers if the user has provided their own onChange handler.
|
86
|
+
var userOnChange = options.onChange;
|
87
|
+
if ( userOnChange ) {
|
88
|
+
options.onChange = function(ed) {
|
89
|
+
onChangeHandler(ed);
|
90
|
+
userOnChange(ed);
|
91
|
+
};
|
92
|
+
} else {
|
93
|
+
options.onChange = onChangeHandler;
|
94
|
+
}
|
95
|
+
|
96
|
+
// If there is a codemirror widget for this element already then we need to unwire if first
|
97
|
+
if ( codemirror ) {
|
98
|
+
codemirror.toTextArea();
|
99
|
+
}
|
100
|
+
// Create the new codemirror widget
|
101
|
+
codemirror = CodeMirror.fromTextArea(elm[0], options);
|
102
|
+
};
|
103
|
+
|
104
|
+
// Initialize the code mirror widget
|
105
|
+
updateCodeMirror(uiCodemirrorGet());
|
106
|
+
|
107
|
+
// Now watch to see if the codemirror attribute gets updated
|
108
|
+
scope.$watch(uiCodemirrorGet, updateCodeMirror, true);
|
109
|
+
|
110
|
+
// CodeMirror expects a string, so make sure it gets one.
|
111
|
+
// This does not change the model.
|
112
|
+
ngModel.$formatters.push(function(value) {
|
113
|
+
if(angular.isUndefined(value) || value === null) {
|
114
|
+
return '';
|
115
|
+
}
|
116
|
+
else if (angular.isObject(value) || angular.isArray(value)) {
|
117
|
+
throw new Error('ui-codemirror cannot use an object or an array as a model');
|
118
|
+
}
|
119
|
+
return value;
|
120
|
+
});
|
121
|
+
|
122
|
+
// Override the ngModelController $render method, which is what gets called when the model is updated.
|
123
|
+
// This takes care of the synchronizing the codeMirror element with the underlying model, in the case that it is changed by something else.
|
124
|
+
ngModel.$render = function() {
|
125
|
+
codemirror.setValue(ngModel.$viewValue);
|
126
|
+
};
|
127
|
+
}
|
128
|
+
};
|
129
|
+
}]);
|
130
|
+
|
131
|
+
/*
|
132
|
+
Gives the ability to style currency based on its sign.
|
133
|
+
*/
|
134
|
+
angular.module('ui.directives').directive('uiCurrency', ['ui.config','currencyFilter' , function(uiConfig, currencyFilter) {
|
135
|
+
var options = {
|
136
|
+
pos: 'ui-currency-pos',
|
137
|
+
neg: 'ui-currency-neg',
|
138
|
+
zero: 'ui-currency-zero'
|
139
|
+
};
|
140
|
+
if (uiConfig.currency) {
|
141
|
+
angular.extend(options, uiConfig.currency);
|
142
|
+
}
|
143
|
+
return {
|
144
|
+
restrict: 'EAC',
|
145
|
+
require: 'ngModel',
|
146
|
+
link: function(scope, element, attrs, controller) {
|
147
|
+
var opts, // instance-specific options
|
148
|
+
renderview,
|
149
|
+
value;
|
150
|
+
|
151
|
+
opts = angular.extend({}, options, scope.$eval(attrs.uiCurrency));
|
152
|
+
|
153
|
+
renderview = function(viewvalue) {
|
154
|
+
var num;
|
155
|
+
num = viewvalue * 1;
|
156
|
+
if (num > 0) {
|
157
|
+
element.addClass(opts.pos);
|
158
|
+
} else {
|
159
|
+
element.removeClass(opts.pos);
|
160
|
+
}
|
161
|
+
if (num < 0) {
|
162
|
+
element.addClass(opts.neg);
|
163
|
+
} else {
|
164
|
+
element.removeClass(opts.neg);
|
165
|
+
}
|
166
|
+
if (num === 0) {
|
167
|
+
element.addClass(opts.zero);
|
168
|
+
} else {
|
169
|
+
element.removeClass(opts.zero);
|
170
|
+
}
|
171
|
+
if (viewvalue === '') {
|
172
|
+
element.text('');
|
173
|
+
} else {
|
174
|
+
element.text(currencyFilter(num, opts.symbol));
|
175
|
+
}
|
176
|
+
return true;
|
177
|
+
};
|
178
|
+
|
179
|
+
controller.$render = function() {
|
180
|
+
value = controller.$viewValue;
|
181
|
+
element.val(value);
|
182
|
+
renderview(value);
|
183
|
+
};
|
184
|
+
|
185
|
+
}
|
186
|
+
};
|
187
|
+
}]);
|
188
|
+
|
189
|
+
/*
|
190
|
+
jQuery UI Datepicker plugin wrapper
|
191
|
+
|
192
|
+
@param [ui-date] {object} Options to pass to $.fn.datepicker() merged onto ui.config
|
193
|
+
*/
|
194
|
+
|
195
|
+
angular.module('ui.directives').directive('uiDate', [
|
196
|
+
'ui.config', function(uiConfig) {
|
197
|
+
var options;
|
198
|
+
options = {};
|
199
|
+
if (uiConfig.date != null) {
|
200
|
+
angular.extend(options, uiConfig.date);
|
201
|
+
}
|
202
|
+
return {
|
203
|
+
require: '?ngModel',
|
204
|
+
link: function(scope, element, attrs, controller) {
|
205
|
+
var opts, updateModel, usersOnSelectHandler;
|
206
|
+
opts = angular.extend({}, options, scope.$eval(attrs.uiDate));
|
207
|
+
/* If we have a controller (i.e. ngModelController) then wire it up
|
208
|
+
*/
|
209
|
+
|
210
|
+
if (controller != null) {
|
211
|
+
updateModel = function(value, picker) {
|
212
|
+
return scope.$apply(function() {
|
213
|
+
return controller.$setViewValue(element.datepicker("getDate"));
|
214
|
+
});
|
215
|
+
};
|
216
|
+
if (opts.onSelect != null) {
|
217
|
+
/* Caller has specified onSelect to call this as well as updating the model
|
218
|
+
*/
|
219
|
+
|
220
|
+
usersOnSelectHandler = opts.onSelect;
|
221
|
+
opts.onSelect = function(value, picker) {
|
222
|
+
updateModel(value);
|
223
|
+
return usersOnSelectHandler(value, picker);
|
224
|
+
};
|
225
|
+
} else {
|
226
|
+
/* No onSelect already specified so just update the model
|
227
|
+
*/
|
228
|
+
|
229
|
+
opts.onSelect = updateModel;
|
230
|
+
}
|
231
|
+
/* Update the date picker when the model changes
|
232
|
+
*/
|
233
|
+
|
234
|
+
controller.$render = function() {
|
235
|
+
var date;
|
236
|
+
date = controller.$viewValue;
|
237
|
+
if (!(date instanceof Date)) {
|
238
|
+
date = new Date(date);
|
239
|
+
}
|
240
|
+
return element.datepicker("setDate", date);
|
241
|
+
};
|
242
|
+
}
|
243
|
+
/* Create the datepicker widget
|
244
|
+
*/
|
245
|
+
|
246
|
+
return element.datepicker(opts);
|
247
|
+
}
|
248
|
+
};
|
249
|
+
}
|
250
|
+
]);
|
251
|
+
|
252
|
+
|
253
|
+
/**
|
254
|
+
* General-purpose Event binding. Bind any event not natively supported by Angular
|
255
|
+
* Pass an object with keynames for events to ui-event
|
256
|
+
* Allows $event object and $params object to be passed
|
257
|
+
*
|
258
|
+
* @example <input ui-event="{ focus : 'counter++', blur : 'someCallback()' }">
|
259
|
+
* @example <input ui-event="{ myCustomEvent : 'myEventHandler($event, $params)'}">
|
260
|
+
*
|
261
|
+
* @param ui-event {string|object literal} The event to bind to as a string or a hash of events with their callbacks
|
262
|
+
*/
|
263
|
+
angular.module('ui.directives').directive('uiEvent', ['$parse',
|
264
|
+
function($parse) {
|
265
|
+
return function(scope, elm, attrs) {
|
266
|
+
var events = scope.$eval(attrs.uiEvent);
|
267
|
+
angular.forEach(events, function(uiEvent, eventName){
|
268
|
+
var fn = $parse(uiEvent);
|
269
|
+
elm.bind(eventName, function(evt) {
|
270
|
+
var params = Array.prototype.slice.call(arguments);
|
271
|
+
//Take out first paramater (event object);
|
272
|
+
params = params.splice(1);
|
273
|
+
scope.$apply(function() {
|
274
|
+
fn(scope, {$event: evt, $params: params})
|
275
|
+
});
|
276
|
+
});
|
277
|
+
});
|
278
|
+
};
|
279
|
+
}]);
|
280
|
+
|
281
|
+
/*
|
282
|
+
* Defines the ui-if tag. This removes/adds an element from the dom depending on a condition
|
283
|
+
* Originally created by @tigbro, for the @jquery-mobile-angular-adapter
|
284
|
+
* https://github.com/tigbro/jquery-mobile-angular-adapter
|
285
|
+
*/
|
286
|
+
angular.module('ui.directives').directive('uiIf', [function() {
|
287
|
+
return {
|
288
|
+
transclude: 'element',
|
289
|
+
priority: 1000,
|
290
|
+
terminal: true,
|
291
|
+
restrict: 'A',
|
292
|
+
compile: function(element, attr, linker) {
|
293
|
+
return function(scope, iterStartElement, attr) {
|
294
|
+
iterStartElement[0].doNotMove = true;
|
295
|
+
var expression = attr.uiIf;
|
296
|
+
var lastElement;
|
297
|
+
var lastScope;
|
298
|
+
scope.$watch(expression, function(newValue) {
|
299
|
+
if (lastElement) {
|
300
|
+
lastElement.remove();
|
301
|
+
lastElement = null;
|
302
|
+
}
|
303
|
+
lastScope && lastScope.$destroy();
|
304
|
+
if (newValue) {
|
305
|
+
lastScope = scope.$new();
|
306
|
+
linker(lastScope, function(clone) {
|
307
|
+
lastElement = clone;
|
308
|
+
iterStartElement.after(clone);
|
309
|
+
});
|
310
|
+
}
|
311
|
+
// Note: need to be parent() as jquery cannot trigger events on comments
|
312
|
+
// (angular creates a comment node when using transclusion, as ng-repeat does).
|
313
|
+
iterStartElement.parent().trigger("$childrenChanged");
|
314
|
+
});
|
315
|
+
};
|
316
|
+
}
|
317
|
+
};
|
318
|
+
}]);
|
319
|
+
|
320
|
+
/**
|
321
|
+
* General-purpose jQuery wrapper. Simply pass the plugin name as the expression.
|
322
|
+
*
|
323
|
+
* It is possible to specify a default set of parameters for each jQuery plugin.
|
324
|
+
* Under the jq key, namespace each plugin by that which will be passed to ui-jq.
|
325
|
+
* Unfortunately, at this time you can only pre-define the first parameter.
|
326
|
+
* @example { jq : { datepicker : { showOn:'click' } } }
|
327
|
+
*
|
328
|
+
* @param ui-jq {string} The $elm.[pluginName]() to call.
|
329
|
+
* @param [ui-options] {mixed} Expression to be evaluated and passed as options to the function
|
330
|
+
* Multiple parameters can be separated by commas
|
331
|
+
* Set {ngChange:false} to disable passthrough support for change events ( since angular watches 'input' events, not 'change' events )
|
332
|
+
*
|
333
|
+
* @example <input ui-jq="datepicker" ui-options="{showOn:'click'},secondParameter,thirdParameter">
|
334
|
+
*/
|
335
|
+
angular.module('ui.directives').directive('uiJq', ['ui.config', function(uiConfig) {
|
336
|
+
return {
|
337
|
+
restrict: 'A',
|
338
|
+
compile: function(tElm, tAttrs) {
|
339
|
+
if (!angular.isFunction(tElm[tAttrs.uiJq])) {
|
340
|
+
throw new Error('ui-jq: The "'+tAttrs.uiJq+'" function does not exist');
|
341
|
+
return;
|
342
|
+
}
|
343
|
+
var options = uiConfig['jq'] && uiConfig['jq'][tAttrs.uiJq];
|
344
|
+
return function (scope, elm, attrs) {
|
345
|
+
var linkOptions = [], ngChange = 'change';
|
346
|
+
|
347
|
+
if (attrs.uiOptions) {
|
348
|
+
linkOptions = scope.$eval('['+attrs.uiOptions+']');
|
349
|
+
if (angular.isObject(options) && angular.isObject(linkOptions[0])) {
|
350
|
+
linkOptions[0] = angular.extend(options, linkOptions[0]);
|
351
|
+
}
|
352
|
+
} else if (options) {
|
353
|
+
linkOptions = [options];
|
354
|
+
}
|
355
|
+
if (attrs.ngModel && elm.is('select,input,textarea')) {
|
356
|
+
if (linkOptions && angular.isObject(linkOptions[0]) && linkOptions[0].ngChange !== undefined) {
|
357
|
+
ngChange = linkOptions[0].ngChange;
|
358
|
+
}
|
359
|
+
ngChange && elm.on(ngChange, function(){
|
360
|
+
elm.trigger('input');
|
361
|
+
});
|
362
|
+
}
|
363
|
+
elm[attrs.uiJq].apply(elm, linkOptions);
|
364
|
+
};
|
365
|
+
}
|
366
|
+
};
|
367
|
+
}]);
|
368
|
+
|
369
|
+
|
370
|
+
/**
|
371
|
+
* Bind one or more handlers to particular keys or their combination
|
372
|
+
* @param hash {mixed} keyBindings Can be an object or string where keybinding expression of keys or keys combinations and AngularJS Exspressions are set. Object syntax: "{ keys1: expression1 [, keys2: expression2 [ , ... ]]}". String syntax: ""expression1 on keys1 [ and expression2 on keys2 [ and ... ]]"". Expression is an AngularJS Expression, and key(s) are dash-separated combinations of keys and modifiers (one or many, if any. Order does not matter). Supported modifiers are 'ctrl', 'shift', 'alt' and key can be used either via its keyCode (13 for Return) or name. Named keys are 'backspace', 'tab', 'enter', 'esc', 'space', 'pageup', 'pagedown', 'end', 'home', 'left', 'up', 'right', 'down', 'insert', 'delete'.
|
373
|
+
* @example <input ui-keypress="{enter:'x = 1', 'ctrl-shift-space':'foo()', 'shift-13':'bar()'}" /> <input ui-keypress="foo = 2 on ctrl-13 and bar('hello') on shift-esc" />
|
374
|
+
**/
|
375
|
+
angular.module('ui.directives').directive('uiKeypress', ['$parse', function($parse){
|
376
|
+
return {
|
377
|
+
link: function(scope, elm, attrs) {
|
378
|
+
var keysByCode = {
|
379
|
+
8: 'backspace',
|
380
|
+
9: 'tab',
|
381
|
+
13: 'enter',
|
382
|
+
27: 'esc',
|
383
|
+
32: 'space',
|
384
|
+
33: 'pageup',
|
385
|
+
34: 'pagedown',
|
386
|
+
35: 'end',
|
387
|
+
36: 'home',
|
388
|
+
37: 'left',
|
389
|
+
38: 'up',
|
390
|
+
39: 'right',
|
391
|
+
40: 'down',
|
392
|
+
45: 'insert',
|
393
|
+
46: 'delete'
|
394
|
+
};
|
395
|
+
|
396
|
+
var params, paramsParsed, expression, keys, combinations = [];
|
397
|
+
try {
|
398
|
+
params = scope.$eval(attrs.uiKeypress);
|
399
|
+
paramsParsed = true;
|
400
|
+
} catch (error) {
|
401
|
+
params = attrs.uiKeypress.split(/\s+and\s+/i);
|
402
|
+
paramsParsed = false;
|
403
|
+
}
|
404
|
+
|
405
|
+
// Prepare combinations for simple checking
|
406
|
+
angular.forEach(params, function(v, k) {
|
407
|
+
var combination = {};
|
408
|
+
if(paramsParsed) {
|
409
|
+
// An object passed
|
410
|
+
combination.expression = $parse(v);
|
411
|
+
combination.keys = k;
|
412
|
+
} else {
|
413
|
+
// A string passed
|
414
|
+
v = v.split(/\s+on\s+/i);
|
415
|
+
combination.expression = $parse(v[0]);
|
416
|
+
combination.keys = v[1];
|
417
|
+
}
|
418
|
+
|
419
|
+
keys = {};
|
420
|
+
angular.forEach(combination.keys.split('-'), function(value) {
|
421
|
+
keys[value] = true;
|
422
|
+
});
|
423
|
+
combination.keys = keys;
|
424
|
+
combinations.push(combination);
|
425
|
+
});
|
426
|
+
|
427
|
+
// Check only mathcing of pressed keys one of the conditions
|
428
|
+
elm.bind('keydown', function(event) {
|
429
|
+
// No need to do that inside the cycle
|
430
|
+
var altPressed = event.metaKey || event.altKey;
|
431
|
+
var ctrlPressed = event.ctrlKey;
|
432
|
+
var shiftPressed = event.shiftKey;
|
433
|
+
|
434
|
+
// Iterate over prepared combinations
|
435
|
+
angular.forEach(combinations, function(combination) {
|
436
|
+
|
437
|
+
var mainKeyPressed = (combination.keys[keysByCode[event.keyCode]] || combination.keys[event.keyCode.toString()]) || false;
|
438
|
+
|
439
|
+
var altRequired = combination.keys.alt || false;
|
440
|
+
var ctrlRequired = combination.keys.ctrl || false;
|
441
|
+
var shiftRequired = combination.keys.shift || false;
|
442
|
+
|
443
|
+
if( mainKeyPressed &&
|
444
|
+
( altRequired == altPressed ) &&
|
445
|
+
( ctrlRequired == ctrlPressed ) &&
|
446
|
+
( shiftRequired == shiftPressed )
|
447
|
+
) {
|
448
|
+
// Run the function
|
449
|
+
scope.$apply(function(){
|
450
|
+
combination.expression(scope, { '$event' : event });
|
451
|
+
});
|
452
|
+
}
|
453
|
+
});
|
454
|
+
});
|
455
|
+
}
|
456
|
+
};
|
457
|
+
}]);
|
458
|
+
|
459
|
+
(function() {
|
460
|
+
var app = angular.module('ui.directives');
|
461
|
+
|
462
|
+
//Setup map events from a google map object to trigger on a given element too,
|
463
|
+
//then we just use ui-event to catch events from an element
|
464
|
+
function bindMapEvents(scope, eventsStr, googleObject, element) {
|
465
|
+
angular.forEach(eventsStr.split(' '), function(eventName) {
|
466
|
+
var $event = { type: 'map-'+eventName };
|
467
|
+
google.maps.event.addListener(googleObject, eventName, function(evt) {
|
468
|
+
element.trigger(angular.extend({}, $event, evt));
|
469
|
+
//We create an $apply if it isn't happening. we need better support for this
|
470
|
+
//We don't want to use timeout because tons of these events fire at once,
|
471
|
+
//and we only need one $apply
|
472
|
+
if (!scope.$$phase) scope.$apply();
|
473
|
+
});
|
474
|
+
});
|
475
|
+
}
|
476
|
+
|
477
|
+
app.directive('uiMap',
|
478
|
+
['ui.config', '$parse', function(uiConfig, $parse) {
|
479
|
+
|
480
|
+
var mapEvents = 'bounds_changed center_changed click dblclick drag dragend '+
|
481
|
+
'dragstart heading_changed idle maptypeid_changed mousemove mouseout '+
|
482
|
+
'mouseover projection_changed resize rightclick tilesloaded tilt_changed '+
|
483
|
+
'zoom_changed';
|
484
|
+
var options = uiConfig.map || {};
|
485
|
+
|
486
|
+
return {
|
487
|
+
restrict: 'A',
|
488
|
+
//doesn't work as E for unknown reason
|
489
|
+
link: function(scope, elm, attrs) {
|
490
|
+
var opts = angular.extend({}, options, scope.$eval(attrs.uiOptions));
|
491
|
+
var map = new google.maps.Map(elm[0], opts);
|
492
|
+
var model = $parse(attrs.uiMap);
|
493
|
+
|
494
|
+
//Set scope variable for the map
|
495
|
+
model.assign(scope, map);
|
496
|
+
|
497
|
+
bindMapEvents(scope, mapEvents, map, elm);
|
498
|
+
}
|
499
|
+
};
|
500
|
+
}]);
|
501
|
+
|
502
|
+
app.directive('uiMapInfoWindow',
|
503
|
+
['ui.config', '$parse', '$compile', function(uiConfig, $parse, $compile) {
|
504
|
+
|
505
|
+
var infoWindowEvents = 'closeclick content_change domready '+
|
506
|
+
'position_changed zindex_changed';
|
507
|
+
var options = uiConfig.mapInfoWindow || {};
|
508
|
+
|
509
|
+
return {
|
510
|
+
link: function(scope, elm, attrs) {
|
511
|
+
var opts = angular.extend({}, options, scope.$eval(attrs.uiOptions));
|
512
|
+
opts.content = elm[0];
|
513
|
+
var model = $parse(attrs.uiMapInfoWindow);
|
514
|
+
var infoWindow = model(scope);
|
515
|
+
|
516
|
+
if (!infoWindow) {
|
517
|
+
infoWindow = new google.maps.InfoWindow(opts);
|
518
|
+
model.assign(scope, infoWindow);
|
519
|
+
}
|
520
|
+
|
521
|
+
bindMapEvents(scope, infoWindowEvents, infoWindow, elm);
|
522
|
+
|
523
|
+
/* The info window's contents dont' need to be on the dom anymore,
|
524
|
+
google maps has them stored. So we just replace the infowindow element
|
525
|
+
with an empty div. (we don't just straight remove it from the dom because
|
526
|
+
straight removing things from the dom can mess up angular) */
|
527
|
+
elm.replaceWith('<div></div>');
|
528
|
+
|
529
|
+
//Decorate infoWindow.open to $compile contents before opening
|
530
|
+
var _open = infoWindow.open;
|
531
|
+
infoWindow.open = function open(a1,a2,a3,a4,a5,a6) {
|
532
|
+
$compile(elm.contents())(scope);
|
533
|
+
_open.call(infoWindow, a1,a2,a3,a4,a5,a6);
|
534
|
+
};
|
535
|
+
}
|
536
|
+
};
|
537
|
+
}]);
|
538
|
+
|
539
|
+
/*
|
540
|
+
* Map overlay directives all work the same. Take map marker for example
|
541
|
+
* <ui-map-marker="myMarker"> will $watch 'myMarker' and each time it changes,
|
542
|
+
* it will hook up myMarker's events to the directive dom element. Then
|
543
|
+
* ui-event will be able to catch all of myMarker's events. Super simple.
|
544
|
+
*/
|
545
|
+
function mapOverlayDirective(directiveName, events) {
|
546
|
+
app.directive(directiveName, [function() {
|
547
|
+
return {
|
548
|
+
restrict: 'A',
|
549
|
+
link: function(scope, elm, attrs) {
|
550
|
+
scope.$watch(attrs[directiveName], function(newObject) {
|
551
|
+
bindMapEvents(scope, events, newObject, elm);
|
552
|
+
});
|
553
|
+
}
|
554
|
+
};
|
555
|
+
}]);
|
556
|
+
};
|
557
|
+
|
558
|
+
mapOverlayDirective('uiMapMarker',
|
559
|
+
'animation_changed click clickable_changed cursor_changed '+
|
560
|
+
'dblclick drag dragend draggable_changed dragstart flat_changed icon_changed '+
|
561
|
+
'mousedown mouseout mouseover mouseup position_changed rightclick '+
|
562
|
+
'shadow_changed shape_changed title_changed visible_changed zindex_changed');
|
563
|
+
|
564
|
+
mapOverlayDirective('uiMapPolyline',
|
565
|
+
'click dblclick mousedown mousemove mouseout mouseover mouseup rightclick');
|
566
|
+
|
567
|
+
mapOverlayDirective('uiMapPolygon',
|
568
|
+
'click dblclick mousedown mousemove mouseout mouseover mouseup rightclick');
|
569
|
+
|
570
|
+
mapOverlayDirective('uiMapRectangle',
|
571
|
+
'bounds_changed click dblclick mousedown mousemove mouseout mouseover '+
|
572
|
+
'mouseup rightclick');
|
573
|
+
|
574
|
+
mapOverlayDirective('uiMapCircle',
|
575
|
+
'center_changed click dblclick mousedown mousemove '+
|
576
|
+
'mouseout mouseover mouseup radius_changed rightclick');
|
577
|
+
|
578
|
+
mapOverlayDirective('uiMapGroundOverlay',
|
579
|
+
'click dblclick');
|
580
|
+
|
581
|
+
})();
|
582
|
+
/*
|
583
|
+
Attaches jquery-ui input mask onto input element
|
584
|
+
*/
|
585
|
+
|
586
|
+
angular.module('ui.directives').directive('uiMask', [
|
587
|
+
function() {
|
588
|
+
return {
|
589
|
+
require: 'ngModel',
|
590
|
+
scope: {
|
591
|
+
uiMask: '='
|
592
|
+
},
|
593
|
+
link: function($scope, element, attrs, controller) {
|
594
|
+
/* We override the render method to run the jQuery mask plugin
|
595
|
+
*/
|
596
|
+
controller.$render = function() {
|
597
|
+
var value;
|
598
|
+
value = controller.$viewValue || '';
|
599
|
+
element.val(value);
|
600
|
+
return element.mask($scope.uiMask);
|
601
|
+
};
|
602
|
+
/* Add a parser that extracts the masked value into the model but only if the mask is valid
|
603
|
+
*/
|
604
|
+
|
605
|
+
controller.$parsers.push(function(value) {
|
606
|
+
var isValid;
|
607
|
+
isValid = element.data('mask-isvalid');
|
608
|
+
controller.$setValidity('mask', isValid);
|
609
|
+
return element.mask();
|
610
|
+
});
|
611
|
+
/* When keyup, update the viewvalue
|
612
|
+
*/
|
613
|
+
|
614
|
+
return element.bind('keyup', function() {
|
615
|
+
return $scope.$apply(function() {
|
616
|
+
return controller.$setViewValue(element.mask());
|
617
|
+
});
|
618
|
+
});
|
619
|
+
}
|
620
|
+
};
|
621
|
+
}
|
622
|
+
]);
|
623
|
+
|
624
|
+
angular.module('ui.directives')
|
625
|
+
.directive('uiModal', ['$timeout', function($timeout) {
|
626
|
+
return {
|
627
|
+
restrict: 'EAC',
|
628
|
+
require: 'ngModel',
|
629
|
+
link: function(scope, elm, attrs, model) {
|
630
|
+
//helper so you don't have to type class="modal hide"
|
631
|
+
elm.addClass('modal hide');
|
632
|
+
scope.$watch(attrs.ngModel, function(value) {
|
633
|
+
elm.modal(value && 'show' || 'hide');
|
634
|
+
});
|
635
|
+
elm.on('show.ui', function() {
|
636
|
+
$timeout(function() {
|
637
|
+
model.$setViewValue(true);
|
638
|
+
});
|
639
|
+
});
|
640
|
+
elm.on('hide.ui', function() {
|
641
|
+
$timeout(function() {
|
642
|
+
model.$setViewValue(false);
|
643
|
+
});
|
644
|
+
});
|
645
|
+
}
|
646
|
+
};
|
647
|
+
}]);
|
648
|
+
|
649
|
+
/**
|
650
|
+
* Add a clear button to form inputs to reset their value
|
651
|
+
*/
|
652
|
+
angular.module('ui.directives').directive('uiReset', ['$parse', function($parse) {
|
653
|
+
return {
|
654
|
+
require:'ngModel',
|
655
|
+
link: function(scope, elm, attrs, ctrl) {
|
656
|
+
elm.wrap('<span class="ui-resetwrap" />').after('<a class="ui-reset" />').next().click(function(e){
|
657
|
+
e.preventDefault();
|
658
|
+
scope.$apply(function(){
|
659
|
+
// This lets you SET the value of the 'parsed' model
|
660
|
+
ctrl.$setViewValue(null);
|
661
|
+
});
|
662
|
+
});
|
663
|
+
}
|
664
|
+
};
|
665
|
+
}]);
|
666
|
+
|
667
|
+
/*global angular, $*/
|
668
|
+
/**
|
669
|
+
* Adds a 'ui-scrollfix' class to the element when the page scrolls past it's position.
|
670
|
+
* @param [offset] {int} optional Y-offset to override the detected offset.
|
671
|
+
* Takes 300 (absolute) or -300 or +300 (relative to detected)
|
672
|
+
*/
|
673
|
+
angular.module('ui.directives').directive('uiScrollfix', ['$window', function ($window) {
|
674
|
+
'use strict';
|
675
|
+
return {
|
676
|
+
link: function (scope, elm, attrs) {
|
677
|
+
var top = elm.offset().top;
|
678
|
+
if (!attrs.uiScrollfix) {
|
679
|
+
attrs.uiScrollfix = top;
|
680
|
+
} else {
|
681
|
+
// chartAt is generally faster than indexOf: http://jsperf.com/indexof-vs-chartat
|
682
|
+
if (attrs.uiScrollfix.charAt(0) === '-') {
|
683
|
+
attrs.uiScrollfix = top - attrs.uiScrollfix.substr(1);
|
684
|
+
} else if (attrs.uiScrollfix.charAt(0) === '+') {
|
685
|
+
attrs.uiScrollfix = top + parseFloat(attrs.uiScrollfix.substr(1));
|
686
|
+
}
|
687
|
+
}
|
688
|
+
angular.element($window).on('scroll.ui-scrollfix', function () {
|
689
|
+
// if pageYOffset is defined use it, otherwise use other crap for IE
|
690
|
+
var offset;
|
691
|
+
if (angular.isDefined($window.pageYOffset)) {
|
692
|
+
offset = $window.pageYOffset;
|
693
|
+
} else {
|
694
|
+
var iebody = (document.compatMode && document.compatMode !== "BackCompat") ? document.documentElement : document.body;
|
695
|
+
offset = iebody.scrollTop;
|
696
|
+
}
|
697
|
+
if (!elm.hasClass('ui-scrollfix') && offset > attrs.uiScrollfix) {
|
698
|
+
elm.addClass('ui-scrollfix');
|
699
|
+
} else if (elm.hasClass('ui-scrollfix') && offset < attrs.uiScrollfix) {
|
700
|
+
elm.removeClass('ui-scrollfix');
|
701
|
+
}
|
702
|
+
});
|
703
|
+
}
|
704
|
+
};
|
705
|
+
}]);
|
706
|
+
|
707
|
+
|
708
|
+
/**
|
709
|
+
* Enhanced Select2 Dropmenus
|
710
|
+
*
|
711
|
+
* @AJAX Mode - When in this mode, your value will be an object (or array of objects) of the data used by Select2
|
712
|
+
* This change is so that you do not have to do an additional query yourself on top of Select2's own query
|
713
|
+
* @params [options] {object} The configuration options passed to $.fn.select2(). Refer to the documentation
|
714
|
+
*/
|
715
|
+
angular.module('ui.directives').directive('uiSelect2', ['ui.config', '$http', function(uiConfig, $http){
|
716
|
+
var options = {};
|
717
|
+
if (uiConfig.select2) {
|
718
|
+
angular.extend(options, uiConfig.select2);
|
719
|
+
}
|
720
|
+
return {
|
721
|
+
require: '?ngModel',
|
722
|
+
compile: function(tElm, tAttrs) {
|
723
|
+
var watch,
|
724
|
+
repeatOption,
|
725
|
+
isSelect = tElm.is('select'),
|
726
|
+
isMultiple = (tAttrs.multiple !== undefined);
|
727
|
+
|
728
|
+
// Enable watching of the options dataset if in use
|
729
|
+
if (tElm.is('select')) {
|
730
|
+
repeatOption = tElm.find('option[ng-repeat]');
|
731
|
+
if (repeatOption.length) {
|
732
|
+
watch = repeatOption.attr('ng-repeat').split(' ').pop();
|
733
|
+
}
|
734
|
+
}
|
735
|
+
|
736
|
+
return function(scope, elm, attrs, controller) {
|
737
|
+
// instance-specific options
|
738
|
+
var opts = angular.extend({}, options, scope.$eval(attrs.uiSelect2));
|
739
|
+
|
740
|
+
if (isSelect) {
|
741
|
+
// Use <select multiple> instead
|
742
|
+
delete opts.multiple;
|
743
|
+
delete opts.initSelection;
|
744
|
+
} else if (isMultiple) {
|
745
|
+
opts.multiple = true;
|
746
|
+
}
|
747
|
+
|
748
|
+
if (controller) {
|
749
|
+
// Watch the model for programmatic changes
|
750
|
+
controller.$render = function() {
|
751
|
+
if (isSelect) {
|
752
|
+
elm.select2('val', controller.$modelValue);
|
753
|
+
} else {
|
754
|
+
if (isMultiple && !controller.$modelValue) {
|
755
|
+
elm.select2('data', []);
|
756
|
+
} else {
|
757
|
+
elm.select2('data', controller.$modelValue);
|
758
|
+
}
|
759
|
+
}
|
760
|
+
};
|
761
|
+
|
762
|
+
|
763
|
+
// Watch the options dataset for changes
|
764
|
+
if (watch) {
|
765
|
+
scope.$watch(watch, function(newVal, oldVal, scope){
|
766
|
+
if (!newVal) return;
|
767
|
+
// Delayed so that the options have time to be rendered
|
768
|
+
setTimeout(function(){
|
769
|
+
elm.select2('val', controller.$viewValue);
|
770
|
+
// Refresh angular to remove the superfluous option
|
771
|
+
elm.trigger('change');
|
772
|
+
});
|
773
|
+
});
|
774
|
+
}
|
775
|
+
|
776
|
+
if (!isSelect) {
|
777
|
+
// Set the view and model value and update the angular template manually for the ajax/multiple select2.
|
778
|
+
elm.bind("change", function(){
|
779
|
+
scope.$apply(function(){
|
780
|
+
controller.$setViewValue(elm.select2('data'));
|
781
|
+
});
|
782
|
+
});
|
783
|
+
|
784
|
+
if (opts.initSelection) {
|
785
|
+
var initSelection = opts.initSelection;
|
786
|
+
opts.initSelection = function(element, callback) {
|
787
|
+
initSelection(element, function(value){
|
788
|
+
controller.$setViewValue(value);
|
789
|
+
callback(value);
|
790
|
+
});
|
791
|
+
}
|
792
|
+
}
|
793
|
+
}
|
794
|
+
}
|
795
|
+
|
796
|
+
attrs.$observe('disabled', function(value){
|
797
|
+
elm.select2(value && 'disable' || 'enable');
|
798
|
+
});
|
799
|
+
|
800
|
+
// Set initial value since Angular doesn't
|
801
|
+
elm.val(scope.$eval(attrs.ngModel));
|
802
|
+
|
803
|
+
// Initialize the plugin late so that the injected DOM does not disrupt the template compiler
|
804
|
+
setTimeout(function(){
|
805
|
+
elm.select2(opts);
|
806
|
+
});
|
807
|
+
}
|
808
|
+
}
|
809
|
+
};
|
810
|
+
}]);
|
811
|
+
|
812
|
+
|
813
|
+
/**
|
814
|
+
* uiShow Directive
|
815
|
+
*
|
816
|
+
* Adds a 'ui-show' class to the element instead of display:block
|
817
|
+
* Created to allow tighter control of CSS without bulkier directives
|
818
|
+
*
|
819
|
+
* @param expression {boolean} evaluated expression to determine if the class should be added
|
820
|
+
*/
|
821
|
+
angular.module('ui.directives').directive('uiShow', [function() {
|
822
|
+
return function(scope, elm, attrs) {
|
823
|
+
scope.$watch(attrs.uiShow, function(newVal, oldVal){
|
824
|
+
if (newVal) {
|
825
|
+
elm.addClass('ui-show');
|
826
|
+
} else {
|
827
|
+
elm.removeClass('ui-show');
|
828
|
+
}
|
829
|
+
});
|
830
|
+
};
|
831
|
+
}])
|
832
|
+
|
833
|
+
/**
|
834
|
+
* uiHide Directive
|
835
|
+
*
|
836
|
+
* Adds a 'ui-hide' class to the element instead of display:block
|
837
|
+
* Created to allow tighter control of CSS without bulkier directives
|
838
|
+
*
|
839
|
+
* @param expression {boolean} evaluated expression to determine if the class should be added
|
840
|
+
*/
|
841
|
+
.directive('uiHide', [function() {
|
842
|
+
return function(scope, elm, attrs) {
|
843
|
+
scope.$watch(attrs.uiHide, function(newVal, oldVal){
|
844
|
+
if (newVal) {
|
845
|
+
elm.addClass('ui-hide');
|
846
|
+
} else {
|
847
|
+
elm.removeClass('ui-hide');
|
848
|
+
}
|
849
|
+
});
|
850
|
+
};
|
851
|
+
}])
|
852
|
+
|
853
|
+
/**
|
854
|
+
* uiToggle Directive
|
855
|
+
*
|
856
|
+
* Adds a class 'ui-show' if true, and a 'ui-hide' if false to the element instead of display:block/display:none
|
857
|
+
* Created to allow tighter control of CSS without bulkier directives. This also allows you to override the
|
858
|
+
* default visibility of the element using either class.
|
859
|
+
*
|
860
|
+
* @param expression {boolean} evaluated expression to determine if the class should be added
|
861
|
+
*/
|
862
|
+
.directive('uiToggle', [function() {
|
863
|
+
return function(scope, elm, attrs) {
|
864
|
+
scope.$watch(attrs.uiToggle, function(newVal, oldVal){
|
865
|
+
if (newVal) {
|
866
|
+
elm.removeClass('ui-hide').addClass('ui-show');
|
867
|
+
} else {
|
868
|
+
elm.removeClass('ui-show').addClass('ui-hide');
|
869
|
+
}
|
870
|
+
});
|
871
|
+
};
|
872
|
+
}]);
|
873
|
+
|
874
|
+
/*
|
875
|
+
jQuery UI Sortable plugin wrapper
|
876
|
+
|
877
|
+
@param [ui-sortable] {object} Options to pass to $.fn.sortable() merged onto ui.config
|
878
|
+
*/
|
879
|
+
|
880
|
+
angular.module('ui.directives').directive('uiSortable', [
|
881
|
+
'ui.config', function(uiConfig) {
|
882
|
+
var options;
|
883
|
+
options = {};
|
884
|
+
if (uiConfig.sortable != null) {
|
885
|
+
angular.extend(options, uiConfig.sortable);
|
886
|
+
}
|
887
|
+
return {
|
888
|
+
require: '?ngModel',
|
889
|
+
link: function(scope, element, attrs, ngModel) {
|
890
|
+
var onStart, onUpdate, opts, _start, _update;
|
891
|
+
opts = angular.extend({}, options, scope.$eval(attrs.uiOptions));
|
892
|
+
if (ngModel != null) {
|
893
|
+
onStart = function(e, ui) {
|
894
|
+
return ui.item.data('ui-sortable-start', ui.item.index());
|
895
|
+
};
|
896
|
+
onUpdate = function(e, ui) {
|
897
|
+
var end, start;
|
898
|
+
start = ui.item.data('ui-sortable-start');
|
899
|
+
end = ui.item.index();
|
900
|
+
ngModel.$modelValue.splice(end, 0, ngModel.$modelValue.splice(start, 1)[0]);
|
901
|
+
return scope.$apply();
|
902
|
+
};
|
903
|
+
_start = opts.start;
|
904
|
+
opts.start = function(e, ui) {
|
905
|
+
onStart(e, ui);
|
906
|
+
if (typeof _start === "function") {
|
907
|
+
_start(e, ui);
|
908
|
+
}
|
909
|
+
return scope.$apply();
|
910
|
+
};
|
911
|
+
_update = opts.update;
|
912
|
+
opts.update = function(e, ui) {
|
913
|
+
onUpdate(e, ui);
|
914
|
+
if (typeof _update === "function") {
|
915
|
+
_update(e, ui);
|
916
|
+
}
|
917
|
+
return scope.$apply();
|
918
|
+
};
|
919
|
+
}
|
920
|
+
return element.sortable(opts);
|
921
|
+
}
|
922
|
+
};
|
923
|
+
}
|
924
|
+
]);
|
925
|
+
|
926
|
+
|
927
|
+
/**
|
928
|
+
* Binds a TinyMCE widget to <textarea> elements.
|
929
|
+
*/
|
930
|
+
angular.module('ui.directives').directive('uiTinymce', ['ui.config', function(uiConfig){
|
931
|
+
uiConfig.tinymce = uiConfig.tinymce || {};
|
932
|
+
return {
|
933
|
+
require: 'ngModel',
|
934
|
+
link: function(scope, elm, attrs, ngModel) {
|
935
|
+
var expression,
|
936
|
+
options = {
|
937
|
+
// Update model on button click
|
938
|
+
onchange_callback: function(inst) {
|
939
|
+
if (inst.isDirty()) {
|
940
|
+
inst.save();
|
941
|
+
ngModel.$setViewValue(elm.val());
|
942
|
+
scope.$apply();
|
943
|
+
}
|
944
|
+
},
|
945
|
+
// Update model on keypress
|
946
|
+
handle_event_callback: function(e) {
|
947
|
+
if (this.isDirty()) {
|
948
|
+
this.save();
|
949
|
+
ngModel.$setViewValue(elm.val());
|
950
|
+
scope.$apply();
|
951
|
+
}
|
952
|
+
return true; // Continue handling
|
953
|
+
},
|
954
|
+
// Update model when calling setContent (such as from the source editor popup)
|
955
|
+
setup : function(ed) {
|
956
|
+
ed.onSetContent.add(function(ed, o) {
|
957
|
+
if (ed.isDirty()) {
|
958
|
+
ed.save();
|
959
|
+
ngModel.$setViewValue(elm.val());
|
960
|
+
scope.$apply();
|
961
|
+
}
|
962
|
+
});
|
963
|
+
}
|
964
|
+
};
|
965
|
+
if (attrs.uiTinymce) {
|
966
|
+
expression = scope.$eval(attrs.uiTinymce);
|
967
|
+
} else {
|
968
|
+
expression = {};
|
969
|
+
}
|
970
|
+
angular.extend(options, uiConfig.tinymce, expression);
|
971
|
+
setTimeout(function(){
|
972
|
+
elm.tinymce(options);
|
973
|
+
});
|
974
|
+
}
|
975
|
+
};
|
976
|
+
}]);
|
977
|
+
|
978
|
+
/**
|
979
|
+
* General-purpose validator for ngModel.
|
980
|
+
* angular.js comes with several built-in validation mechanism for input fields (ngRequired, ngPattern etc.) but using
|
981
|
+
* an arbitrary validation function requires creation of a custom formatters and / or parsers.
|
982
|
+
* The ui-validate directive makes it easy to use any function(s) defined in scope as a validator function(s).
|
983
|
+
* A validator function will trigger validation on both model and input changes.
|
984
|
+
*
|
985
|
+
* @example <input ui-validate="myValidatorFunction">
|
986
|
+
* @example <input ui-validate="{foo : validateFoo, bar : validateBar}">
|
987
|
+
*
|
988
|
+
* @param ui-validate {string|object literal} If strings is passed it should be a scope's function to be used as a validator.
|
989
|
+
* If an object literal is passed a key denotes a validation error key while a value should be a validator function.
|
990
|
+
* In both cases validator function should take a value to validate as its argument and should return true/false indicating a validation result.
|
991
|
+
*/
|
992
|
+
angular.module('ui.directives').directive('uiValidate', function () {
|
993
|
+
|
994
|
+
return {
|
995
|
+
restrict:'A',
|
996
|
+
require:'ngModel',
|
997
|
+
link:function (scope, elm, attrs, ctrl) {
|
998
|
+
|
999
|
+
var validateFn, validateExpr = attrs.uiValidate;
|
1000
|
+
|
1001
|
+
validateExpr = scope.$eval(validateExpr);
|
1002
|
+
if (!validateExpr) {
|
1003
|
+
return;
|
1004
|
+
}
|
1005
|
+
|
1006
|
+
if (angular.isFunction(validateExpr)) {
|
1007
|
+
validateExpr = { validator: validateExpr };
|
1008
|
+
}
|
1009
|
+
|
1010
|
+
angular.forEach(validateExpr, function(validatorFn, key){
|
1011
|
+
validateFn = function (valueToValidate) {
|
1012
|
+
if (validatorFn(valueToValidate)) {
|
1013
|
+
ctrl.$setValidity(key, true);
|
1014
|
+
return valueToValidate;
|
1015
|
+
} else {
|
1016
|
+
ctrl.$setValidity(key, false);
|
1017
|
+
return undefined;
|
1018
|
+
}
|
1019
|
+
};
|
1020
|
+
ctrl.$formatters.push(validateFn);
|
1021
|
+
ctrl.$parsers.push(validateFn);
|
1022
|
+
});
|
1023
|
+
}
|
1024
|
+
};
|
1025
|
+
});
|
1026
|
+
|
1027
|
+
/**
|
1028
|
+
* Wraps the
|
1029
|
+
* @param text {string} haystack to search through
|
1030
|
+
* @param search {string} needle to search for
|
1031
|
+
* @param [caseSensitive] {boolean} optional boolean to use case-sensitive searching
|
1032
|
+
*/
|
1033
|
+
angular.module('ui.filters').filter('highlight', function() {
|
1034
|
+
return function(text, search, caseSensitive) {
|
1035
|
+
if (search || angular.isNumber(search)) {
|
1036
|
+
text = text.toString();
|
1037
|
+
search = search.toString();
|
1038
|
+
if (caseSensitive) {
|
1039
|
+
return text.split(search).join('<span class="ui-match">'+search+'</span>');
|
1040
|
+
} else {
|
1041
|
+
return text.replace(new RegExp(search, 'gi'), '<span class="ui-match">$&</span>');
|
1042
|
+
}
|
1043
|
+
} else {
|
1044
|
+
return text;
|
1045
|
+
}
|
1046
|
+
};
|
1047
|
+
});
|
1048
|
+
|
1049
|
+
|
1050
|
+
/**
|
1051
|
+
* Converts variable-esque naming conventions to something presentational, capitalized words separated by space.
|
1052
|
+
* @param {String} value The value to be parsed and prettified.
|
1053
|
+
* @param {String} [inflector] The inflector to use. Default: humanize.
|
1054
|
+
* @return {String}
|
1055
|
+
* @example {{ 'Here Is my_phoneNumber' | inflector:'humanize' }} => Here Is My Phone Number
|
1056
|
+
* {{ 'Here Is my_phoneNumber' | inflector:'underscore' }} => here_is_my_phone_number
|
1057
|
+
* {{ 'Here Is my_phoneNumber' | inflector:'variable' }} => hereIsMyPhoneNumber
|
1058
|
+
*/
|
1059
|
+
angular.module('ui.filters').filter('inflector', function () {
|
1060
|
+
function ucwords(text) {
|
1061
|
+
return text.replace(/^([a-z])|\s+([a-z])/g, function ($1) {
|
1062
|
+
return $1.toUpperCase();
|
1063
|
+
});
|
1064
|
+
}
|
1065
|
+
function breakup(text, separator) {
|
1066
|
+
return text.replace(/[A-Z]/g, function(match){
|
1067
|
+
return separator + match;
|
1068
|
+
});
|
1069
|
+
}
|
1070
|
+
var inflectors = {
|
1071
|
+
humanize: function(value) {
|
1072
|
+
return ucwords(breakup(value, ' ').split('_').join(' '));
|
1073
|
+
},
|
1074
|
+
underscore: function(value) {
|
1075
|
+
return value.substr(0,1).toLowerCase() + breakup(value.substr(1), '_').toLowerCase().split(' ').join('_');
|
1076
|
+
},
|
1077
|
+
variable: function(value) {
|
1078
|
+
value = value.substr(0,1).toLowerCase() + ucwords(value.split('_').join(' ')).substr(1).split(' ').join('');
|
1079
|
+
return value;
|
1080
|
+
}
|
1081
|
+
};
|
1082
|
+
|
1083
|
+
return function (text, inflector, separator) {
|
1084
|
+
if (inflector !== false && angular.isString(text)) {
|
1085
|
+
inflector = inflector || 'humanize';
|
1086
|
+
return inflectors[inflector](text);
|
1087
|
+
} else {
|
1088
|
+
return text;
|
1089
|
+
}
|
1090
|
+
};
|
1091
|
+
});
|
1092
|
+
|
1093
|
+
|
1094
|
+
/**
|
1095
|
+
* Filters out all duplicate items from an array by checking the specified key
|
1096
|
+
* @param [key] {string} the name of the attribute of each object to compare for uniqueness
|
1097
|
+
if the key is empty, the entire object will be compared
|
1098
|
+
if the key === false then no filtering will be performed
|
1099
|
+
* @return {array}
|
1100
|
+
*/
|
1101
|
+
angular.module('ui.filters').filter('unique', function() {
|
1102
|
+
|
1103
|
+
return function(items, filterOn) {
|
1104
|
+
|
1105
|
+
if (filterOn===false){
|
1106
|
+
return items;
|
1107
|
+
}
|
1108
|
+
|
1109
|
+
if ((filterOn || angular.isUndefined(filterOn))&& angular.isArray(items)) {
|
1110
|
+
var hashCheck = {}, newItems = [];
|
1111
|
+
|
1112
|
+
var extractValueToCompare = function(item) {
|
1113
|
+
if (angular.isObject(item) && angular.isString(filterOn)) {
|
1114
|
+
return item[filterOn];
|
1115
|
+
} else {
|
1116
|
+
return item;
|
1117
|
+
}
|
1118
|
+
};
|
1119
|
+
|
1120
|
+
angular.forEach(items, function (item) {
|
1121
|
+
var valueToCheck, isDuplicate = false;
|
1122
|
+
|
1123
|
+
for (var i = 0; i < newItems.length; i++) {
|
1124
|
+
if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
|
1125
|
+
isDuplicate = true;
|
1126
|
+
break;
|
1127
|
+
}
|
1128
|
+
}
|
1129
|
+
if (!isDuplicate){
|
1130
|
+
newItems.push(item);
|
1131
|
+
}
|
1132
|
+
|
1133
|
+
});
|
1134
|
+
items = newItems;
|
1135
|
+
}
|
1136
|
+
return items;
|
1137
|
+
};
|
1138
|
+
});
|