From 6940bb6beb2f99b38be430f176a4dffe296f0252 Mon Sep 17 00:00:00 2001 From: Rosen Kunev Date: Sun, 5 Nov 2017 16:42:55 +0200 Subject: [PATCH] refactor: Move JSDoc to the module definition --- src/color-picker-core.module.js | 71 +++++++++++++++++++++++++++ src/color-picker-rotator.directive.js | 14 ------ src/color-picker.component.js | 36 -------------- src/color-picker.service.js | 14 ------ 4 files changed, 71 insertions(+), 64 deletions(-) diff --git a/src/color-picker-core.module.js b/src/color-picker-core.module.js index 2adb3a5..95fce49 100644 --- a/src/color-picker-core.module.js +++ b/src/color-picker-core.module.js @@ -3,12 +3,83 @@ import colorPickerRotator from './color-picker-rotator.directive.js'; import ColorPickerController from './color-picker.component.js'; export default angular + /** + * @ngdoc module + * @name color.picker.core + * @description + * + * Angular Radial Color Picker + */ .module('color.picker.core', []) + /** + * @ngdoc service + * @namespace Utilities + * @name ColorPickerService + * @module color.picker.core + * @requires $rootScope + * + * @description + * API for intercomponent comunication and color model conversions. + * + * @example + * // Convert RGB color model to hexadecimal string + * ColorPickerService.rgbToHex(255, 0, 0); // returns 'FF0000' + */ .service('ColorPickerService', ColorPickerService) + /** + * @ngdoc directive + * @name colorPickerRotator + * @module color.picker.core + * @restrict A + * + * @param {expression} [onRotate] Usually a function to invoke when angle changes + * @param {number} [angle] Angle to change the rotator at. A number between 0 and 360 + * + * @description + * Provides rotation capabilities to any element. Also supports touch devices. + * + * @example
+ */ .directive('colorPickerRotator', colorPickerRotator) + /** + * @ngdoc component + * @name colorPicker + * @module color.picker.core + * @restrict E + * + * @param {expression} [onSelect] A function to invoke when user selects a color + * @param {Object} [ngModel] RGBA color model. If provided will set the picker to the provided color + * Defaults to { red: 255, green: 0, blue: 0 } + * @param {number} [ngModel.red] Value between 0 and 255 + * @param {number} [ngModel.green] Value between 0 and 255 + * @param {number} [ngModel.blue] Value between 0 and 255 + * @param {number} [ngModel.alpha] Value between 0 and 1 + * + * @description + * Material design radial color picker. Provides selecting a pure color via dragging the whole color wheel. + * `ng-model` is used to change programatically the active color in the picker. If it's not provided + * the initial color defaults to red (255, 0, 0). + * + * The `on-select` attribute is a function which is called when a user a user selects a color with the color + * selector in the middle. The function is invoked only if the color picker is opened. + * + * For easier communication a set of events are provided that can even programatically open or close the picker + * without interacting with the UI. All events are published/subscribed at the $rootScope so that sibling components + * can subscribe to them too. All events carry the current color in the event data payload. + * + * `color-picker.show` - Fires when the color picker is about to show and *before* any animation is started. + * `color-picker.shown` - Fires when the color picker is shown and has finished animating. + * + * `color-picker.selected` - Fires when a color is selected via the middle selector. Event is fired right before `hide`. + * + * `color-picker.hide` - Fires when the color picker is about to hide and *before* any animation is started. + * `color-picker.hidden` - Fires when the color picker is hidden and has finished animating. + * + * @example + */ .component('colorPicker', { bindings: { onSelect: '&', diff --git a/src/color-picker-rotator.directive.js b/src/color-picker-rotator.directive.js index 3d14321..4dcab0f 100644 --- a/src/color-picker-rotator.directive.js +++ b/src/color-picker-rotator.directive.js @@ -1,17 +1,3 @@ -/** - * @ngdoc directive - * @name colorPickerRotator - * @module color.picker.core - * @restrict A - * - * @param {expression} [onRotate] Usually a function to invoke when angle changes - * @param {number} [angle] Angle to change the rotator at. A number between 0 and 360 - * - * @description - * Provides rotation capabilities to any element. Also supports touch devices. - * - * @example
- */ export default function colorPickerRotator() { var directive = { link: ColorPickerRotatorLink, diff --git a/src/color-picker.component.js b/src/color-picker.component.js index 662c332..2fe0abd 100644 --- a/src/color-picker.component.js +++ b/src/color-picker.component.js @@ -1,39 +1,3 @@ -/** - * @ngdoc component - * @name colorPicker - * @module color.picker.core - * @restrict E - * - * @param {expression} [onSelect] A function to invoke when user selects a color - * @param {Object} [ngModel] RGBA color model. If provided will set the picker to the provided color - * Defaults to { red: 255, green: 0, blue: 0 } - * @param {number} [ngModel.red] Value between 0 and 255 - * @param {number} [ngModel.green] Value between 0 and 255 - * @param {number} [ngModel.blue] Value between 0 and 255 - * @param {number} [ngModel.alpha] Value between 0 and 1 - * - * @description - * Material design radial color picker. Provides selecting a pure color via dragging the whole color wheel. - * `ng-model` is used to change programatically the active color in the picker. If it's not provided - * the initial color defaults to red (255, 0, 0). - * - * The `on-select` attribute is a function which is called when a user a user selects a color with the color - * selector in the middle. The function is invoked only if the color picker is opened. - * - * For easier communication a set of events are provided that can even programatically open or close the picker - * without interacting with the UI. All events are published/subscribed at the $rootScope so that sibling components - * can subscribe to them too. All events carry the current color in the event data payload. - * - * `color-picker.show` - Fires when the color picker is about to show and *before* any animation is started. - * `color-picker.shown` - Fires when the color picker is shown and has finished animating. - * - * `color-picker.selected` - Fires when a color is selected via the middle selector. Event is fired right before `hide`. - * - * `color-picker.hide` - Fires when the color picker is about to hide and *before* any animation is started. - * `color-picker.hidden` - Fires when the color picker is hidden and has finished animating. - * - * @example - */ ColorPickerController.$inject = ['$element', '$rootScope', 'ColorPickerService']; export default function ColorPickerController($element, $rootScope, ColorPickerService) { var vm = this; diff --git a/src/color-picker.service.js b/src/color-picker.service.js index c8ad2e6..1a32c6d 100644 --- a/src/color-picker.service.js +++ b/src/color-picker.service.js @@ -1,17 +1,3 @@ -/** - * @ngdoc service - * @namespace Utilities - * @name ColorPickerService - * @module color.picker.core - * @requires $rootScope - * - * @description - * API for intercomponent comunication and color model conversions. - * - * @example - * // Convert RGB color model to hexadecimal string - * ColorPickerService.rgbToHex(255, 0, 0); // returns 'FF0000' - */ ColorPickerService.$inject = ['$rootScope']; export default function ColorPickerService($rootScope) { this.publish = publish;