UNPKG

pip-webui

Version:

HTML5 UI for LOB applications

1,226 lines (1,110 loc) 122 kB
/** * @file Registration of basic WebUI controls * @copyright Digital Living Software Corp. 2014-2016 */ /* global angular */ (function (angular) { 'use strict'; angular.module('pipControls', [ 'pipMarkdown', 'pipToggleButtons', 'pipRefreshButton', 'pipColorPicker', 'pipRoutingProgress', 'pipPopover', 'pipImageSlider', 'pipToasts', 'pipTagList', 'pipDate', 'pipDateRange', 'pipTimeRangeEdit', 'pipTimeRange', 'pipInformationDialog', 'pipConfirmationDialog', 'pipOptionsDialog', 'pipOptionsBigDialog', 'pipErrorDetailsDialog' ]); angular.module('pipBasicControls', ['pipControls']); })(window.angular); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('color_picker/color_picker.html', '<ul class="pip-color-picker lp0 {{class}}" pip-selected="currentColorIndex" pip-enter-space-press="enterSpacePress($event)">\n' + ' <li tabindex="-1" ng-repeat="color in colors track by color">\n' + ' <md-button tabindex="-1" class="md-icon-button pip-selectable" ng-click="selectColor($index)" aria-label="color" ng-disabled="disabled()">\n' + ' <md-icon ng-style="{\'color\': color}" md-svg-icon="icons:{{ color == currentColor ? \'circle\' : \'radio-off\' }}">\n' + ' </md-icon>\n' + ' </md-button>\n' + ' </li>\n' + '</ul>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('confirmation_dialog/confirmation_dialog.html', '<!--\n' + '@file Confirmation dialog template\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<md-dialog class="pip-dialog pip-confirmation-dialog layout-column" width="400" md-theme="{{::theme}}">\n' + ' <div class="pip-header text-subhead1">\n' + ' <h3 class="m0">{{:: title | translate }}</h3>\n' + ' </div>\n' + ' <div class="pip-footer">\n' + ' <div>\n' + ' <md-button ng-click="onCancel()">{{:: cancel | translate }}</md-button>\n' + ' <md-button class="md-accent" ng-click="onOk()">{{:: ok | translate }}</md-button>\n' + ' </div>\n' + ' </div>\n' + '</md-dialog>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('date_range/date_range.html', '<!--\n' + '@file Date range control content\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<div class="pip-date-range layout-row flex" tabindex="-1">\n' + ' <md-input-container ng-show="isDay()" class="tm0 pip-day flex"\n' + ' ng-class="{\'flex-fixed\' : $mdMedia(\'gt-xs\')}">\n' + ' <md-select class="select-day w-stretch"\n' + ' ng-class="{\'pip-no-line\' : pipNoLine}"\n' + ' ng-disable="{{disableControls}}"\n' + ' md-on-open="onDayClick()"\n' + ' ng-model="day"\n' + ' ng-change="onDayChanged()"\n' + ' placeholder="{{dayLabel}}"\n' + ' aria-label="DAY">\n' + '\n' + ' <md-option ng-value="opt" ng-repeat="opt in days track by opt ">\n' + ' {{nameDays[$index]}} {{ opt }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' <md-input-container ng-show="isWeek()" class="tm0 flex"\n' + ' ng-class="{\'flex-fixed\' : $mdMedia(\'gt-xs\')}">\n' + ' <md-select class="select-week w-stretch"\n' + ' ng-class="{\'pip-no-line\' : pipNoLine}"\n' + ' ng-disable="{{disableControls}}"\n' + ' ng-model="week"\n' + ' ng-change="onWeekChange()"\n' + ' placeholder="{{weekLabel}}"\n' + ' aria-label="WEEK">\n' + '\n' + ' <md-option ng-value="opt.id" ng-repeat="opt in weeks track by opt.id">\n' + ' {{ opt.name }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container >\n' + ' <div class="flex-fixed"\n' + ' ng-class="{\'w16\': $mdMedia(\'gt-xs\'), \'w8\': $mdMedia(\'xs\')}"\n' + ' ng-show="isDay() || isWeek()">\n' + ' </div>\n' + ' <md-input-container ng-show="isMonth() && !monthFormatShort " class="tm0 flex min-w72"\n' + ' ng-class="{\'flex-fixed\' : $mdMedia(\'gt-xs\')}">\n' + ' <md-select class="select-month w-stretch"\n' + ' ng-class="{\'pip-no-line\' : pipNoLine}"\n' + ' ng-disable="{{disableControls}}"\n' + ' md-on-open="onMonthClick()"\n' + ' ng-model="month"\n' + ' ng-change="onMonthChanged()"\n' + ' placeholder="{{monthLabel}}"\n' + ' aria-label="MONTH">\n' + '\n' + ' <md-option ng-value="opt.id" ng-repeat="opt in months track by opt.id">\n' + ' {{ opt.name }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' <md-input-container ng-show="isMonth() && monthFormatShort" class="flex tm0"\n' + ' ng-class="{\'flex-fixed\' : $mdMedia(\'gt-xs\')}">\n' + ' <md-select class="select-month w-stretch"\n' + ' ng-class="{\'pip-no-line\' : pipNoLine}"\n' + ' ng-disable="{{disableControls}}"\n' + ' md-on-open="onMonthClick()"\n' + ' ng-model="month"\n' + ' ng-change="onMonthChanged()"\n' + ' placeholder="{{monthLabel}}"\n' + ' aria-label="MONTH">\n' + '\n' + ' <md-option ng-value="opt.id" ng-repeat="opt in shortMonths track by opt.id">\n' + ' {{ opt.name }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' <div class="flex-fixed"\n' + ' ng-class="{\'w16\': $mdMedia(\'gt-xs\'), \'w8\': $mdMedia(\'xs\')}"\n' + ' ng-show="isMonth()">\n' + ' </div>\n' + ' <md-input-container class="tm0 flex"\n' + ' ng-class="{\'flex-fixed\' : $mdMedia(\'gt-xs\')}">\n' + ' <md-select class="select-year w-stretch"\n' + ' ng-class="{\'pip-no-line\' : pipNoLine}"\n' + ' ng-disable="{{disableControls}}"\n' + ' md-on-open="onYearClick()"\n' + ' ng-model="year"\n' + ' ng-change="onYearChanged()"\n' + ' placeholder="{{yearLabel}}"\n' + ' aria-label="YEAR">\n' + '\n' + ' <md-option ng-value="opt" ng-repeat="opt in years track by opt">\n' + ' {{ opt }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + '</div>'); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('date/date.html', '<!--\n' + '@file Date control content\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<div class="pip-date layout-row flex" tabindex="-1">\n' + ' <md-input-container class="tm0 flex">\n' + ' <md-select class="pip-date-day tm0 flex" ng-disabled="disableControls"\n' + ' ng-model="day" placeholder="{{dayLabel}}" ng-change="onDayChanged()">\n' + ' <md-option ng-value="opt" ng-repeat="opt in days track by opt">{{:: opt }}</md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' <div class="w16 flex-fixed"></div>\n' + ' <md-input-container class="tm0 flex">\n' + ' <md-select class="pip-date-month tm0 flex" ng-disabled="disableControls"\n' + ' ng-model="month" placeholder="{{monthLabel}}" ng-change="onMonthChanged()">\n' + ' <md-option ng-value="opt.id" ng-repeat="opt in months track by opt.id">{{:: opt.name }}</md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' <div class="w16 flex-fixed"></div>\n' + ' <md-input-container class="tm0 flex">\n' + ' <md-select class="pip-date-year tm0 flex" ng-disabled="disableControls"\n' + ' ng-model="year" placeholder="{{yearLabel}}" ng-change="onYearChanged()">\n' + ' <md-option ng-value="opt" ng-repeat="opt in years track by opt">{{:: opt }}</md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + '</div>\n' + ' '); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('error_details_dialog/error_details_dialog.html', '<!--\n' + '@file Confirmation dialog template\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<md-dialog class="pip-dialog pip-details-dialog layout-column" width="400" md-theme="{{theme}}">\n' + ' <div class="pip-body">\n' + '\n' + ' <div class="pip-header p0 bp8 text-subhead1">{{::\'ERROR_DETAILS\' | translate}}</div>\n' + ' <div class="layout-row layout-align-start-center h48 text-body2 color-secondary-text"\n' + ' ng-if="error.code || (error.data && error.data.code)">\n' + ' {{::\'CODE\' | translate}}\n' + ' </div>\n' + ' <div class="layout-row layout-align-start-center" ng-if="error.code || (error.data && error.data.code)">\n' + ' {{error.code || error.data.code}}\n' + ' </div>\n' + '\n' + ' <div class="layout-row layout-align-start-center h48 text-body2 color-secondary-text"\n' + ' ng-if="error.path || (error.data && error.data.path)">\n' + ' {{::\'PATH\' | translate}}\n' + ' </div>\n' + ' <div class="layout-row layout-align-start-center" ng-if="error.path || (error.data && error.data.path)">\n' + ' {{error.path || error.data.path}}\n' + ' </div>\n' + '\n' + ' <div class="h48 text-body2 color-secondary-text layout-row layout-align-start-center"\n' + ' ng-if="error.error || (error.data && error.data.error)">\n' + ' {{::\'ERROR\' | translate}}\n' + ' </div>\n' + ' <div class="layout-row layout-align-start-center" ng-if="error.error || (error.data && error.data.error)">\n' + ' {{error.error || error.data.error}}\n' + ' </div>\n' + '\n' + ' <div class="h48 text-body2 color-secondary-text layout-row layout-align-start-center"\n' + ' ng-if="error.method || (error.data && error.data.method)">\n' + ' {{::\'METHOD\' | translate}}\n' + ' </div>\n' + ' <div class="layout-row layout-align-start-center" ng-if="error.method || (error.data && error.data.method)">\n' + ' {{error.method || error.data.method}}\n' + ' </div>\n' + '\n' + ' <div class="h48 text-body2 color-secondary-text layout-row layout-align-start-center"\n' + ' ng-if="error.message || (error.data && error.data.message)">\n' + ' {{::\'MESSAGE\' | translate}}\n' + ' </div>\n' + ' <div class="layout-row layout-align-start-center"\n' + ' ng-if="error.message || (error.data && error.data.message)">\n' + ' {{error.message || error.data.message}}\n' + ' </div>\n' + ' </div>\n' + ' <div class="pip-footer rp16">\n' + ' <div>\n' + ' <md-button class="md-accent m0" ng-click="onOk()">{{::\'DISMISS\' | translate }}</md-button>\n' + ' </div>\n' + ' </div>\n' + '</md-dialog>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('information_dialog/information_dialog.html', '<!--\n' + '@file Information dialog content\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<md-dialog class="pip-dialog pip-information-dialog layout-column"\n' + ' width="400" md-theme="{{theme}}">\n' + ' <div class="pip-header">\n' + ' <h3 class="m0">{{ title | translate }}</h3>\n' + ' </div>\n' + ' <div class="pip-body">\n' + ' <div class="pip-content">\n' + ' {{ content }}\n' + ' </div>\n' + ' </div>\n' + ' <div class="pip-footer">\n' + ' <div>\n' + ' <md-button class="md-accent" ng-click="onOk()">{{ ok | translate }}</md-button>\n' + ' </div>\n' + ' </div>\n' + '</md-dialog>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('options_dialog/options_dialog.html', '<!--\n' + '@file Options dialog content\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<md-dialog class="pip-dialog pip-options-dialog layout-column"\n' + ' min-width="400" md-theme="{{theme}}">\n' + ' <md-dialog-content class="pip-body lp0 tp0 rp0 bp24 pip-scroll">\n' + ' <div class="pip-header" >\n' + ' <h3 class="m0 bm16 text-title">{{::title | translate}}</h3>\n' + ' <div ng-show="deletedTitle" class="bp16 tp8 text-subhead1 divider-bottom">\n' + ' <md-checkbox ng-model="deleted" aria-label="CHECKBOX" class="m0">{{::deletedTitle | translate}}</md-checkbox>\n' + ' </div>\n' + ' </div>\n' + ' <div class="pip-content">\n' + ' <md-radio-group ng-model="selectedOptionName" class="pip-list md-primary" md-no-ink="true"\n' + ' ng-keypress="onKeyPress($event)" tabindex="0">\n' + ' <div ng-repeat="option in options" class="pip-list-item p0" md-ink-ripple\n' + ' ui-event="{ click: \'onOptionSelect($event, option)\' }"\n' + ' ng-class="{ selected: option.name == selectedOptionName }">\n' + ' <div class="pip-list-item">\n' + ' <md-icon class="pip-option-icon rm12" md-svg-icon="icons:{{option.icon}}" ng-if="option.icon">\n' + ' </md-icon>\n' + ' <div class="pip-option-title">\n' + ' {{::option.title | translate}}\n' + ' </div>\n' + ' <md-radio-button ng-value="option.name" tabindex="-1"\n' + ' aria-label="{{::option.title | translate}}">\n' + ' </md-radio-button>\n' + ' </div>\n' + '\n' + ' </div>\n' + ' </md-radio-group>\n' + ' </div>\n' + ' </md-dialog-content>\n' + ' <div class="pip-footer">\n' + ' <div>\n' + ' <md-button class="pip-cancel" ng-click="onCancel()">{{::\'CANCEL\' | translate}}</md-button>\n' + ' <md-button class="pip-submit md-accent" ng-click="onSelect()">{{::applyButtonTitle | translate}}</md-button>\n' + ' </div>\n' + ' </div>\n' + '</md-dialog>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('options_dialog/options_dialog_big.html', '<!--\n' + '@file Options dialog content\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<md-dialog class="pip-dialog pip-options-dialog-big layout-column"\n' + ' min-width="400" md-theme="{{theme}}">\n' + ' <md-dialog-content class="pip-body p0 pip-scroll" ng-class="{\'bp24\': !noActions}">\n' + ' <div class="pip-header" ng-class="{\'header-hint\': noTitle && hint}">\n' + ' <h3 class="m0 text-title" ng-if="!noTitle">\n' + ' {{::title | translate}}\n' + ' </h3>\n' + ' <div ng-show="noTitle && hint" class="dialog-hint layout-row layout-align-start-center">\n' + ' <div class="w40" flex-fixed>\n' + ' <md-icon md-svg-icon="icons:info-circle-outline"></md-icon>\n' + ' </div>\n' + ' <div>{{::hint | translate}}</div>\n' + ' </div>\n' + ' </div>\n' + ' <div class="pip-divider" ng-if="!noTitle"></div>\n' + ' <div class="pip-content">\n' + ' <div class="h8" ng-if="noTitle && hint"></div>\n' + ' <md-list class="pip-menu pip-ref-list w-stretch"\n' + ' pip-selected="optionIndex" index="{{optionIndex }}"\n' + ' pip-select="onSelected($event)">\n' + '\n' + ' <md-list-item class="pip-ref-list-item pip-selectable layout-row layout-align-start-center"\n' + ' ng-class="{\'selected\' : option.name == selectedOptionName,\n' + ' \'divider-bottom\': $index != options.length - 1}"\n' + ' md-ink-ripple xxxxng-keypress="onKeyPress($event)"\n' + ' ng-keyup="onKeyUp($event, $index)"\n' + ' ng-repeat="option in options" ng-click="onOptionSelect($event, option)">\n' + '\n' + ' <div class="pip-content line-height-string max-w100-stretch">\n' + ' <p class="pip-title rp24-flex" ng-if="option.title" style="margin-bottom: 4px !important;">\n' + ' {{::option.title | translate}}\n' + ' </p>\n' + ' <div class="pip-subtitle rp24-flex"\n' + ' style="height: inherit"\n' + ' ng-if="option.subtitle">\n' + ' {{::option.subtitle | translate}}\n' + ' </div>\n' + ' <div class="pip-subtitle rp24-flex"\n' + ' style="height: inherit" ng-if="option.text"\n' + ' pip-translate-html="{{::option.text | translate}}">\n' + ' </div>\n' + ' </div>\n' + '\n' + ' </md-list-item>\n' + '\n' + ' </md-list>\n' + ' <!--\n' + ' <md-radio-group ng-model="selectedOptionName" class="pip-list md-primary" md-no-ink="true"\n' + ' ng-keypress="onKeyPress($event)" tabindex="0">\n' + ' <div ng-repeat="option in options" class="pip-list-item p0" md-ink-ripple\n' + ' ui-event="{ click: \'onOptionSelect($event, option)\' }"\n' + ' ng-class="{ selected: option.name == selectedOptionName }">\n' + ' <div class="pip-list-item">\n' + '\n' + ' <div class="pip-content lp24-flex rp24-flex" flex>\n' + ' <div class="pip-title" ng-if="option.title">\n' + ' {{::option.title | translate}}\n' + ' </div>\n' + ' <div class="pip-subtitle" ng-if="option.subtitle">\n' + ' {{::option.subtitle | translate}}\n' + ' </div>\n' + ' <div class="pip-text" ng-if="option.text">\n' + '\n' + ' <span pip-translate-html="{{::option.text | translate}}"/>\n' + ' </div>\n' + ' </div>\n' + '\n' + ' <md-radio-button ng-value="option.name" tabindex="-1" class="rm24-flex"\n' + ' aria-label="{{::option.title | translate}}">\n' + ' </md-radio-button>\n' + ' </div>\n' + '\n' + ' </div>\n' + ' </md-radio-group> -->\n' + ' </div>\n' + ' <div class="h8" ng-if="noActions"></div>\n' + ' </md-dialog-content>\n' + '\n' + ' <div class="pip-footer" ng-if="!noActions">\n' + ' <div>\n' + ' <md-button class="pip-cancel" ng-click="onCancel()">{{::\'CANCEL\' | translate}}</md-button>\n' + ' <md-button class="pip-submit md-accent" ng-click="onSelect()" style="margin-right: -6px">\n' + ' {{::applyButtonTitle | translate}}\n' + ' </md-button>\n' + ' </div>\n' + ' </div>\n' + '</md-dialog>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('popover/popover.template.html', '<div ng-if="params.templateUrl" class=\'pip-popover flex layout-column\'\n' + ' ng-click="onPopoverClick($event)" ng-include="params.templateUrl">\n' + '</div>\n' + '\n' + '<div ng-if="params.template" class=\'pip-popover\' ng-click="onPopoverClick($event)">\n' + '</div>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('progress/routing_progress.html', '<div class="pip-routing-progress layout-column layout-align-center-center"\n' + ' ng-show="$routing || $reset || toolInitialized">\n' + ' <div class="loader">\n' + ' <svg class="circular" viewBox="25 25 50 50">\n' + ' <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>\n' + ' </svg>\n' + ' </div>\n' + '\n' + ' <img src="images/Logo_animation.svg" height="40" width="40" class="pip-img">\n' + '\n' + ' <md-progress-circular md-diameter="96"\n' + ' class="fix-ie"></md-progress-circular>\n' + '\n' + '</div>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('tags/tag_list.html', '<div class="pip-chip rm4 pip-type-chip pip-type-chip-left {{\'bg-\' + pipType + \'-chips\'}}"\n' + ' ng-if="pipType && !pipTypeLocal">\n' + '\n' + ' <span>{{pipType.toUpperCase() | translate | uppercase}}</span>\n' + '</div>\n' + '<div class="pip-chip rm4 pip-type-chip pip-type-chip-left {{\'bg-\' + pipType + \'-chips\'}}"\n' + ' ng-if="pipType && pipTypeLocal">\n' + '\n' + ' <span>{{pipTypeLocal.toUpperCase() | translate | uppercase}}</span>\n' + '</div>\n' + '<div class="pip-chip rm4" ng-repeat="tag in pipTags">\n' + ' <span>{{::tag}}</span>\n' + '</div>'); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('time_range/time_range.html', '<p>\n' + ' <span ng-if="data.start != null">{{data.start | formatShortDateTime}}</span>\n' + ' <span class="rm4 lm4" ng-if="data.start && data.end"> - </span>\n' + ' <span ng-if="data.end != null">{{data.end | formatShortDateTime}}</span>\n' + '</p>'); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('time_range_edit/time_range_edit.html', '<!--\n' + '@file Time edit control content\n' + '@copyright Digital Living Software Corp. 2014-2016\n' + '-->\n' + '\n' + '<div class="event-edit layout-row layout-xs-column flex layout-align-start-start">\n' + ' <div flex="47" class="w-stretch rm24-flex0">\n' + ' <p class="text-caption text-grey tm0">{{startLabel}}</p>\n' + '\n' + ' <div class="layout-row layout-align-space-between-center">\n' + ' <div class="rm16 pip-datepicker-container" flex="49">\n' + ' <md-datepicker ng-model="data.startDate"\n' + ' xmd-placeholder="{{startLabel}}"\n' + ' ng-change="onChangeStartDate()"\n' + ' ng-disabled="isDisabled()"\n' + ' aria-label="START-DATE">\n' + ' </md-datepicker>\n' + ' </div>\n' + ' <div flex>\n' + ' <md-input-container class="w-stretch tm0">\n' + ' <md-select aria-label="START-TIME" class="tm0 bm0" ng-model="data.startTime" ng-disabled="isDisabled()"\n' + ' ng-change="onChangeStartTime()">\n' + ' <md-option ng-value="opt.id" ng-repeat="opt in intervalTimeCollection track by opt.id">{{ opt.time }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' </div>\n' + ' </div>\n' + ' </div>\n' + ' <div flex="47" class="w-stretch">\n' + ' <p class="text-caption text-grey tm0">{{endLabel}}</p>\n' + '\n' + ' <div class="layout-row layout-align-space-between-center">\n' + ' <div class="rm16 pip-datepicker-container flex-49">\n' + ' <md-datepicker ng-model="data.endDate"\n' + ' xmd-placeholder="{{endLabel}}"\n' + ' ng-disabled="isDisabled()"\n' + ' ng-change="onChangeEndDate()"\n' + ' aria-label="END-DATE">\n' + ' </md-datepicker>\n' + ' </div>\n' + ' <div flex>\n' + ' <md-input-container class="w-stretch tm0">\n' + ' <md-select aria-label="END-TIME" class="tm0 bm0" ng-model="data.endTime" ng-change="onChangeEndTime()"\n' + ' ng-disabled="isDisabled()">\n' + ' <md-option ng-value="opt.id" ng-repeat="opt in intervalTimeCollection track by opt.id">{{\n' + ' opt.time }}\n' + ' </md-option>\n' + ' </md-select>\n' + ' </md-input-container>\n' + ' </div>\n' + ' </div>\n' + ' </div>\n' + '</div>\n' + ''); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('toast/toast.html', '<md-toast class="md-action pip-toast"\n' + ' ng-class="{\'pip-error\': toast.type==\'error\',\n' + ' \'pip-column-toast\': toast.type == \'error\' || toast.actions.length > 1 || actionLenght > 4,\n' + ' \'pip-no-action-toast\': actionLenght == 0}"\n' + ' style="height:initial; max-height: initial; ">\n' + '\n' + ' <span class="flex-var m0 pip-text" ng-bind-html="message"></span>\n' + ' <div class="layout-row layout-align-end-start" class="pip-actions" ng-if="actions.length > 0 || (toast.type==\'error\' && toast.error)">\n' + ' <md-button class="flex-fixed m0 lm8" ng-if="toast.type==\'error\' && toast.error" ng-click="onDetails()">Details</md-button>\n' + ' <md-button class="flex-fixed m0 lm8"\n' + ' ng-click="onAction(action)"\n' + ' ng-repeat="action in actions"\n' + ' aria-label="{{::action| translate}}">\n' + ' {{::action| translate}}\n' + ' </md-button>\n' + ' </div>\n' + '\n' + '</md-toast>'); }]); })(); (function(module) { try { module = angular.module('pipBasicControls.Templates'); } catch (e) { module = angular.module('pipBasicControls.Templates', []); } module.run(['$templateCache', function($templateCache) { $templateCache.put('toggle_buttons/toggle_buttons.html', '<div class="pip-toggle-buttons flex layout-row {{class}}" pip-selected="bufButtonIndex" pip-enter-space-press="enterSpacePress($event)"\n' + ' ng-if="$mdMedia(\'gt-xs\')">\n' + ' <md-button tabindex="-1" ng-repeat="button in buttons"\n' + ' ng-class="{\'md-accent md-raised selected color-accent-bg\' : currentButtonIndex == $index}"\n' + ' ng-attr-style="{{ \'background-color:\' + (currentButtonIndex == $index ? button.backgroundColor : \'\') + \'!important\' }}"\n' + ' class="pip-selectable pip-chip-button flex" ng-click="buttonSelected($index, $event)"\n' + ' ng-disabled="button.disabled || disabled()">\n' + ' {{button.name || button.title | translate}}\n' + ' <span ng-if="button.checked || button.complete || button.filled" class="pip-tagged">*</span>\n' + ' </md-button>\n' + '</div>\n' + '\n' + '<md-input-container class="md-block" ng-if="$mdMedia(\'xs\')">\n' + ' <md-select ng-model="currentButtonIndex" ng-disabled="disabled()" aria-label="DROPDOWN" md-on-close="buttonSelected(currentButtonIndex)">\n' + ' <md-option ng-repeat="action in buttons" value="{{ ::$index }}">\n' + ' {{ (action.title || action.name) | translate }}\n' + ' <span ng-if="action.checked || action.complete || action.filled" class="pip-tagged">*</span>\n' + ' </md-option>\n' + ' </md-select>\n' + '</md-input-container>\n' + ''); }]); })(); /** * @file Color picker control * @copyright Digital Living Software Corp. 2014-2016 */ (function (angular, _) { 'use strict'; var thisModule = angular.module('pipColorPicker', ['pipUtils', 'pipFocused', 'pipBasicControls.Templates']); thisModule.directive('pipColorPicker', function () { return { restrict: 'EA', scope: { ngDisabled: '&', colors: '=pipColors', currentColor: '=ngModel', colorChange: '&ngChange' }, templateUrl: 'color_picker/color_picker.html', controller: 'pipColorPickerController' }; } ); thisModule.controller('pipColorPickerController', ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) { var DEFAULT_COLORS = ['purple', 'lightgreen', 'green', 'darkred', 'pink', 'yellow', 'cyan']; $scope.class = $attrs.class || ''; if (!$scope.colors || _.isArray($scope.colors) && $scope.colors.length === 0) { $scope.colors = DEFAULT_COLORS; } $scope.currentColor = $scope.currentColor || $scope.colors[0]; $scope.currentColorIndex = $scope.colors.indexOf($scope.currentColor); $scope.disabled = function () { if ($scope.ngDisabled) { return $scope.ngDisabled(); } return true; }; $scope.selectColor = function (index) { if ($scope.disabled()) { return; } $scope.currentColorIndex = index; $scope.currentColor = $scope.colors[$scope.currentColorIndex]; $timeout(function () { $scope.$apply(); }); if ($scope.colorChange) { $scope.colorChange(); } }; $scope.enterSpacePress = function (event) { $scope.selectColor(event.index); }; }] ); })(window.angular, window._); /** * @file Confirmation dialog * @copyright Digital Living Software Corp. 2014-2016 */ (function (angular) { 'use strict'; var thisModule = angular.module('pipConfirmationDialog', ['ngMaterial', 'pipUtils', 'pipTranslate', 'pipBasicControls.Templates']); /* eslint-disable quote-props */ thisModule.config(['pipTranslateProvider', function (pipTranslateProvider) { pipTranslateProvider.translations('en', { 'CONFIRM_TITLE': 'Confirm' }); pipTranslateProvider.translations('ru', { 'CONFIRM_TITLE': 'Подтвердите' }); }]); /* eslint-enable quote-props */ thisModule.factory('pipConfirmationDialog', ['$mdDialog', function ($mdDialog) { return { show: function (params, successCallback, cancelCallback) { $mdDialog.show({ targetEvent: params.event, templateUrl: 'confirmation_dialog/confirmation_dialog.html', controller: 'pipConfirmationDialogController', locals: { params: params }, clickOutsideToClose: true }) .then(function () { if (successCallback) { successCallback(); } }, function () { if (cancelCallback) { cancelCallback(); } }); } }; }] ); thisModule.controller('pipConfirmationDialogController', ['$scope', '$rootScope', '$mdDialog', 'pipTranslate', 'params', function ($scope, $rootScope, $mdDialog, pipTranslate, params) { $scope.theme = $rootScope.$theme; $scope.title = params.title || 'CONFIRM_TITLE'; $scope.ok = params.ok || 'OK'; $scope.cancel = params.cancel || 'CANCEL'; $scope.onCancel = function () { $mdDialog.cancel(); }; $scope.onOk = function () { $mdDialog.hide(); }; }] ); })(window.angular); /** * @file Date control * @copyright Digital Living Software Corp. 2014-2016 * @todo * - Improve samples int sampler app * - Optimize. It is way to slow on samples */ (function (angular, _) { 'use strict'; var thisModule = angular.module('pipDate', ['pipBasicControls.Templates']); thisModule.directive('pipDate', function () { return { restrict: 'EA', require: 'ngModel', scope: { timeMode: '@pipTimeMode', disabled: '&ngDisabled', model: '=ngModel', ngChange: '&' }, templateUrl: 'date/date.html', controller: 'pipDateController' }; } ); thisModule.controller('pipDateController', ['$scope', '$element', 'pipTranslate', function ($scope, $element, pipTranslate) { var value; function dayList(month, year) { var count = 31, days = [], i; if (month === 4 || month === 6 || month === 9 || month === 11) { count = 30; } else if (month === 2) { if (year) { // Calculate leap year (primitive) count = year % 4 === 0 ? 29 : 28; } else { count = 28; } } for (i = 1; i <= count; i++) { days.push(i); } return days; } function monthList() { var months = [], i; for (i = 1; i <= 12; i++) { months.push({ id: i, name: pipTranslate.translate('MONTH_' + i) }); } return months; } function yearList() { var i, currentYear = new Date().getFullYear(), startYear = $scope.timeMode === 'future' ? currentYear : currentYear - 100, endYear = $scope.timeMode === 'past' ? currentYear : currentYear + 100, years = []; if ($scope.timeMode === 'past') { for (i = endYear; i >= startYear; i--) { years.push(i); } } else { for (i = startYear; i <= endYear; i++) { years.push(i); } } return years; } function adjustDay() { var days = dayList($scope.month, $scope.year); if ($scope.days.length !== days.length) { if ($scope.day > days.length) { $scope.day = days.length; } $scope.days = days; } } function getValue(v) { var value = v ? _.isDate(v) ? v : new Date(v) : null, day = value ? value.getDate() : null, month = value ? value.getMonth() + 1 : null, year = value ? value.getFullYear() : null; // Update day list if month and year were changed if ($scope.month !== month && $scope.year !== year) { $scope.days = dayList($scope.month, $scope.year); } // Assign values to scope $scope.day = day; $scope.month = month; $scope.year = year; } function setValue() { var value; if ($scope.day && $scope.month && $scope.year) { value = new Date($scope.year, $scope.month - 1, $scope.day, 0, 0, 0, 0); $scope.model = value; $scope.ngChange(); } } $scope.onDayChanged = function () { setValue(); }; $scope.onMonthChanged = function () { adjustDay(); setValue(); }; $scope.onYearChanged = function () { adjustDay(); setValue(); }; // Set initial values value = $scope.model ? _.isDate($scope.model) ? $scope.model : new Date($scope.model) : null; $scope.day = value ? value.getDate() : null; $scope.month = value ? value.getMonth() + 1 : null; $scope.year = value ? value.getFullYear() : null; $scope.dayLabel = pipTranslate.translate('DAY'); $scope.monthLabel = pipTranslate.translate('MONTH'); $scope.yearLabel = pipTranslate.translate('YEAR'); $scope.days = dayList($scope.month, $scope.year); $scope.months = monthList(); $scope.years = yearList(); $scope.disableControls = $scope.disabled ? $scope.disabled() : false; // React on changes $scope.$watch('model', function (newValue) { getValue(newValue); }); $scope.$watch($scope.disabled, function (newValue) { $scope.disableControls = newValue; }); }] ); })(window.angular, window._); /** * @file Date range control * @copyright Digital Living Software Corp. 2014-2016 * @todo * - Improve samples int sampler app * - Optimize. It is way to slow on samples */ /* pip-date-range-type [ daily, weekly, monthly, yearly ] */ (function (angular, _) { 'use strict'; var thisModule = angular.module('pipDateRange', []); thisModule.directive('pipDateRange', function () { return { restrict: 'EA', require: 'ngModel', scope: { timeMode: '@pipTimeMode', disabled: '&ngDisabled', model: '=ngModel', pipChanged: '&', pipDateRangeType: '@', pipDateFormat: '@', pipNoLine: '@' }, templateUrl: 'date_range/date_range.html', controller: 'pipDateRangeController' }; }); thisModule.controller('pipDateRangeController', ['$scope', '$element', 'pipTranslate', '$mdMedia', '$rootScope', function ($scope, $element, pipTranslate, $mdMedia, $rootScope) { var currentDate, currentYear, currentMonth, currentDay, prevState = {}, currentState = {}; currentDate = new Date(); currentYear = currentDate.getUTCFullYear(); currentMonth = currentDate.getUTCMonth() + 1; currentDay = currentDate.getUTCDate(); $scope.daysWeek = { en: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], ru: ['Вс', 'Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб'] }; $scope.onDayChanged = function () { setValue(); }; $scope.onMonthChanged = function () { if ($scope.pipDateRangeType === 'weekly') { var date, dayOfWeek; date = new Date(Date.UTC($scope.year, $scope.month - 1, 1)); dayOfWeek = date.getUTCDay() ? date.getUTCDay() : 7; $scope.week = getWeekByDate(dayOfWeek, $scope.month - 1, $scope.year); correctWeek(); adjustWeek(); } else { adjustDay(); } setValue(); }; $scope.onYearChanged = function () { var date, dayOfWeek; date = new Date(Date.UTC($scope.year, $scope.month - 1, 1)); dayOfWeek = date.getUTCDay() ? date.getUTCDay() : 7; if ($scope.pipDateRangeType === 'weekly') { $scope.week = getWeekByDate(dayOfWeek, $scope.month - 1, $scope.year); adjustWeek(); correctWeek(); } else { adjustDay(); } setValue(); }; $scope.onWeekChange = function () { if ($scope.pipDateRangeType === 'weekly') { adjustWeek(); correctWeek(); } else { adjustDay(); } setValue(); }; // visibility $scope.isDay = function () { return $scope.pipDateRangeType === 'daily'; }; $scope.isWeek = function () { return $scope.pipDateRangeType === 'weekly'; }; $scope.isMonth = function () { return $scope.pipDateRangeType === 'daily' || $scope.pipDateRangeType === 'weekly' || $scope.pipDateRangeType === 'monthly'; }; $scope.onChange = function () { if ($scope.pipChanged) { $scope.pipChanged(); } }; function setCurrent() { currentState.day = $scope.day; currentState.month = $scope.month; currentState.year = $scope.year; currentState.week = $scope.week; currentState.dateRangeType = $scope.pipDateRangeType; currentState.model = $scope.model; } function fillLists() { $scope.days = dayList($scope.month, $scope.year); $scope.weeks = weekList($scope.month, $scope.year); $scope.months = monthList(); $scope.shortMonths = monthList(true); $scope.years = yearList(); } function correctWeek() { if (!prevState.model || prevState.model && prevState.model.getTime() >= $scope.model.getTime()) { // if shift week -> increase month if ($scope.weeks && $scope.weeks[$scope.week] && $scope.weeks[$scope.week].id <= 0) { if ($scope.month < 12) { $scope.month += 1; } else { $scope.month = 1; $scope.year += 1; } fillLists(); } } } function init() { var value; value = $scope.model ? new Date($scope.model) : null; $scope.day = value ? value.getUTCDate() : null; $scope.month = value ? value.getUTCMonth() + 1 : null; $scope.year = value ? value.getUTCFullYear() : null; $scope.week = value ? getWeekByDate($scope.day, $scope.month - 1, $scope.year) : null; fillLists(); if ($scope.pipDateRangeType === 'weekly') { correctWeek(); adjustWeek(); } else { adjustDay(); } setValue(); } // Set initial values $scope.$mdMedia = $mdMedia; init(); $scope.disableControls = $scope.disabled ? $scope.disabled() : false; // React on changes $scope.$watch('model', function (newValue, oldValue) { if (newValue !== oldValue) { getValue(newValue); } }); $scope.$watch($scope.disabled, function (newValue) { $scope.disableControls = newValue; }); $scope.$watch('pipDateRangeType', function (newValue, oldValue) { if (newValue !== oldValue && oldValue) { init(); } }); $scope.onYearClick = function () { if (!$scope.year) { $scope.year = currentYear; } }; $scope.onMonthClick = function () { if (!$scope.month) { $scope.month = currentMonth; } }; $scope.onDayClick = function () { if (!$scope.year) { $scope.day = currentDay; } }; // --------------------------------------------------------------------------------------- function getCountDay(month, year) { var coun