|
1 | 1 | /*! |
2 | | - * angularjs-color-picker v2.0.0 |
| 2 | + * angularjs-color-picker v2.1.0 |
3 | 3 | * https://github.com/ruhley/angular-color-picker/ |
4 | 4 | * |
5 | 5 | * Copyright 2016 ruhley |
6 | 6 | * |
7 | | - * 2016-07-11 16:31:21 |
| 7 | + * 2016-07-13 08:32:24 |
8 | 8 | * |
9 | 9 | */ |
10 | 10 |
|
|
100 | 100 | _this.$document.off('mouseup', _this.onMouseUp); |
101 | 101 | _this.$document.off('mousemove', _this.onMouseMove); |
102 | 102 |
|
103 | | - _this.callApiFunction('onDestroy'); |
| 103 | + _this.eventApiDispatch('onDestroy'); |
104 | 104 | }); |
105 | 105 |
|
106 | 106 | //--------------------------- |
|
178 | 178 | this.api = {}; |
179 | 179 | } |
180 | 180 |
|
181 | | - this.api.open = function () { |
| 181 | + this.api.open = function (event) { |
182 | 182 | // if already visible then don't run show again |
183 | 183 | if (_this4.visible) { |
184 | 184 | return true; |
|
195 | 195 | _this4.lightnessUpdate(); |
196 | 196 | _this4.opacityUpdate(); |
197 | 197 |
|
198 | | - _this4.callApiFunction('onOpen'); |
| 198 | + _this4.eventApiDispatch('onOpen', [event]); |
199 | 199 | }; |
200 | 200 |
|
201 | 201 | this.api.close = function () { |
|
204 | 204 | _this4.visible = false; |
205 | 205 | _this4.$scope.$apply(); |
206 | 206 |
|
207 | | - _this4.callApiFunction('onClose'); |
| 207 | + _this4.eventApiDispatch('onClose', [event]); |
208 | 208 | } |
209 | 209 | }; |
| 210 | + |
| 211 | + this.api.getElement = function () { |
| 212 | + return _this4.$element; |
| 213 | + }; |
210 | 214 | } |
211 | 215 | }, { |
212 | 216 | key: 'reInit', |
|
278 | 282 | value: function onMouseUp(event) { |
279 | 283 | // no current mouse events and not an element in the picker |
280 | 284 | if (!this.colorMouse && !this.hueMouse && !this.opacityMouse && this.find(event.target).length === 0) { |
281 | | - this.api.close(); |
| 285 | + this.api.close(event); |
282 | 286 | // mouse event on color grid |
283 | 287 | } else if (this.colorMouse) { |
284 | 288 | this.colorUp(event); |
|
346 | 350 | if (this.ngModel !== this.onChangeValue) { |
347 | 351 | this.onChangeValue = this.ngModel; |
348 | 352 |
|
349 | | - this.callApiFunction('onChange', [event, this.ngModel]); |
| 353 | + this.eventApiDispatch('onChange', [event]); |
350 | 354 | } |
351 | 355 | } |
352 | 356 | }, { |
|
357 | 361 | this.update(); |
358 | 362 | } |
359 | 363 |
|
360 | | - this.callApiFunction('onBlur', [event, this.ngModel]); |
| 364 | + this.eventApiDispatch(this.api, 'onBlur', [event]); |
361 | 365 | } |
362 | 366 | }, { |
363 | 367 | key: 'initConfig', |
|
723 | 727 | //--------------------------- |
724 | 728 |
|
725 | 729 | }, { |
726 | | - key: 'callApiFunction', |
727 | | - value: function callApiFunction(name, args) { |
728 | | - if (this.api && typeof this.api[name] === 'function') { |
729 | | - this.api[name].apply(this, args); |
| 730 | + key: 'eventApiDispatch', |
| 731 | + value: function eventApiDispatch(name, args) { |
| 732 | + if (this.eventApi && typeof this.eventApi[name] === 'function') { |
| 733 | + if (!args) { |
| 734 | + args = []; |
| 735 | + } |
| 736 | + |
| 737 | + args.unshift(this.ngModel); |
| 738 | + args.unshift(this.api); |
| 739 | + |
| 740 | + this.eventApi[name].apply(this, args); |
730 | 741 | } |
731 | 742 | } |
732 | 743 |
|
|
819 | 830 | scope: { |
820 | 831 | ngModel: '=', |
821 | 832 | options: '=?', |
822 | | - api: '=?' |
| 833 | + api: '=?', |
| 834 | + eventApi: '=?' |
823 | 835 | }, |
824 | 836 | bindToController: true, |
825 | 837 | templateUrl: 'template/color-picker/directive.html', |
|
832 | 844 | } |
833 | 845 |
|
834 | 846 | function template($templateCache) { |
835 | | - $templateCache.put('template/color-picker/directive.html', '<div class="color-picker-wrapper" ng-class="{\n' + '\'color-picker-disabled\': AngularColorPickerController.options.disabled,\n' + '\'color-picker-swatch-only\': AngularColorPickerController.options.swatchOnly,\n' + '}">\n' + ' <div class="color-picker-input-wrapper" ng-class="{\'input-group\': AngularColorPickerController.options.swatchBootstrap && AngularColorPickerController.options.swatch}">\n' + ' <span ng-if="AngularColorPickerController.options.swatchPos === \'left\'" class="color-picker-swatch" ng-click="AngularColorPickerController.focus()" ng-show="AngularColorPickerController.options.swatch" ng-class="{\'color-picker-swatch-left\': AngularColorPickerController.options.swatchPos !== \'right\', \'color-picker-swatch-right\': AngularColorPickerController.options.swatchPos === \'right\', \'input-group-addon\': AngularColorPickerController.options.swatchBootstrap}"></span>\n' + ' <input class="color-picker-input form-control" type="text" ng-model="AngularColorPickerController.ngModel" ng-readonly="AngularColorPickerController.options.swatchOnly" ng-disabled="AngularColorPickerController.options.disabled" ng-blur="AngularColorPickerController.onBlur($event)" ng-change="AngularColorPickerController.onChange($event)" size="7" ng-focus="AngularColorPickerController.api.open()" ng-class="{\'color-picker-input-swatch\': AngularColorPickerController.options.swatch && !AngularColorPickerController.options.swatchOnly && AngularColorPickerController.options.swatchPos === \'left\'}">\n' + ' <span ng-if="AngularColorPickerController.options.swatchPos === \'right\'" class="color-picker-swatch" ng-click="AngularColorPickerController.focus()" ng-show="AngularColorPickerController.options.swatch" ng-class="{\'color-picker-swatch-left\': AngularColorPickerController.options.swatchPos !== \'right\', \'color-picker-swatch-right\': AngularColorPickerController.options.swatchPos === \'right\', \'input-group-addon\': AngularColorPickerController.options.swatchBootstrap}"></span>\n' + ' </div>\n' + ' <div class="color-picker-panel" ng-show="AngularColorPickerController.visible" ng-class="{\n' + ' \'color-picker-panel-top color-picker-panel-right\': AngularColorPickerController.options.pos === \'top right\',\n' + ' \'color-picker-panel-top color-picker-panel-left\': AngularColorPickerController.options.pos === \'top left\',\n' + ' \'color-picker-panel-bottom color-picker-panel-right\': AngularColorPickerController.options.pos === \'bottom right\',\n' + ' \'color-picker-panel-bottom color-picker-panel-left\': AngularColorPickerController.options.pos === \'bottom left\',\n' + ' \'color-picker-show-alpha\': AngularColorPickerController.options.alpha && AngularColorPickerController.options.format !== \'hex\',\n' + ' \'color-picker-show-inline\': AngularColorPickerController.options.inline,\n' + ' }">\n' + ' <div class="color-picker-row">\n' + ' <div class="color-picker-grid color-picker-sprite">\n' + ' <div class="color-picker-grid-inner"></div>\n' + ' <div class="color-picker-picker">\n' + ' <div></div>\n' + ' </div>\n' + ' </div>\n' + ' <div class="color-picker-hue color-picker-sprite">\n' + ' <div class="color-picker-slider"></div>\n' + ' </div>\n' + ' <div class="color-picker-opacity color-picker-sprite" ng-show="AngularColorPickerController.options.alpha && AngularColorPickerController.options.format !== \'hex\'">\n' + ' <div class="color-picker-slider"></div>\n' + ' </div>\n' + ' </div>\n' + ' </div>\n' + '</div>'); |
| 847 | + $templateCache.put('template/color-picker/directive.html', '<div class="color-picker-wrapper" ng-class="{\n' + '\'color-picker-disabled\': AngularColorPickerController.options.disabled,\n' + '\'color-picker-swatch-only\': AngularColorPickerController.options.swatchOnly,\n' + '}">\n' + ' <div class="color-picker-input-wrapper" ng-class="{\'input-group\': AngularColorPickerController.options.swatchBootstrap && AngularColorPickerController.options.swatch}">\n' + ' <span ng-if="AngularColorPickerController.options.swatchPos === \'left\'" class="color-picker-swatch" ng-click="AngularColorPickerController.focus()" ng-show="AngularColorPickerController.options.swatch" ng-class="{\'color-picker-swatch-left\': AngularColorPickerController.options.swatchPos !== \'right\', \'color-picker-swatch-right\': AngularColorPickerController.options.swatchPos === \'right\', \'input-group-addon\': AngularColorPickerController.options.swatchBootstrap}"></span>\n' + ' <input class="color-picker-input form-control" type="text" ng-model="AngularColorPickerController.ngModel" ng-readonly="AngularColorPickerController.options.swatchOnly" ng-disabled="AngularColorPickerController.options.disabled" ng-blur="AngularColorPickerController.onBlur($event)" ng-change="AngularColorPickerController.onChange($event)" size="7" ng-focus="AngularColorPickerController.api.open($event)" ng-class="{\'color-picker-input-swatch\': AngularColorPickerController.options.swatch && !AngularColorPickerController.options.swatchOnly && AngularColorPickerController.options.swatchPos === \'left\'}">\n' + ' <span ng-if="AngularColorPickerController.options.swatchPos === \'right\'" class="color-picker-swatch" ng-click="AngularColorPickerController.focus()" ng-show="AngularColorPickerController.options.swatch" ng-class="{\'color-picker-swatch-left\': AngularColorPickerController.options.swatchPos !== \'right\', \'color-picker-swatch-right\': AngularColorPickerController.options.swatchPos === \'right\', \'input-group-addon\': AngularColorPickerController.options.swatchBootstrap}"></span>\n' + ' </div>\n' + ' <div class="color-picker-panel" ng-show="AngularColorPickerController.visible" ng-class="{\n' + ' \'color-picker-panel-top color-picker-panel-right\': AngularColorPickerController.options.pos === \'top right\',\n' + ' \'color-picker-panel-top color-picker-panel-left\': AngularColorPickerController.options.pos === \'top left\',\n' + ' \'color-picker-panel-bottom color-picker-panel-right\': AngularColorPickerController.options.pos === \'bottom right\',\n' + ' \'color-picker-panel-bottom color-picker-panel-left\': AngularColorPickerController.options.pos === \'bottom left\',\n' + ' \'color-picker-show-alpha\': AngularColorPickerController.options.alpha && AngularColorPickerController.options.format !== \'hex\',\n' + ' \'color-picker-show-inline\': AngularColorPickerController.options.inline,\n' + ' }">\n' + ' <div class="color-picker-row">\n' + ' <div class="color-picker-grid color-picker-sprite">\n' + ' <div class="color-picker-grid-inner"></div>\n' + ' <div class="color-picker-picker">\n' + ' <div></div>\n' + ' </div>\n' + ' </div>\n' + ' <div class="color-picker-hue color-picker-sprite">\n' + ' <div class="color-picker-slider"></div>\n' + ' </div>\n' + ' <div class="color-picker-opacity color-picker-sprite" ng-show="AngularColorPickerController.options.alpha && AngularColorPickerController.options.format !== \'hex\'">\n' + ' <div class="color-picker-slider"></div>\n' + ' </div>\n' + ' </div>\n' + ' </div>\n' + '</div>'); |
836 | 848 | } |
837 | 849 | template.$inject = ['$templateCache']; |
838 | 850 |
|
|
0 commit comments