From 004225444f82a7532cf3393b8096300c4d7be52d Mon Sep 17 00:00:00 2001 From: Christian Murphy Date: Mon, 30 Oct 2017 20:52:39 -0700 Subject: [PATCH] style(css,js,json,scss): apply prettier auto formatting --- docs/assets/css/style.scss | 17 +- package.json | 1 + src/main/webapp/js/config.js | 2 +- src/main/webapp/js/override.js | 55 ++-- src/main/webapp/json/starter-templates.json | 7 +- src/main/webapp/my-app/main.js | 44 +-- src/main/webapp/my-app/my-app.css | 44 +-- .../webapp/my-app/view-home/controllers.js | 251 +++++++++--------- .../webapp/my-app/view-home/directives.js | 42 +-- src/main/webapp/my-app/view-home/routes.js | 2 +- src/main/webapp/my-app/view-home/services.js | 37 +-- .../my-app/view-home/spec/view-home-spec.js | 78 +++--- 12 files changed, 309 insertions(+), 271 deletions(-) diff --git a/docs/assets/css/style.scss b/docs/assets/css/style.scss index 9ec81c9..139712c 100644 --- a/docs/assets/css/style.scss +++ b/docs/assets/css/style.scss @@ -1,7 +1,4 @@ ---- ---- - -@import "{{ site.theme }}"; +@import '{{ site.theme }}'; .wrapper { width: auto; @@ -27,7 +24,7 @@ header { } } a.button { - box-shadow: 0 2px 5px 0 rgba(0,0,0,.26); + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); background: #39c; color: #fff; display: inline-block; @@ -51,8 +48,10 @@ header { font-weight: 500; text-decoration: none; overflow: hidden; - -webkit-transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1); - transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1); + -webkit-transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), + background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); + transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), + background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); &:hover { background: #069; } @@ -120,7 +119,9 @@ footer { body { margin: 0; padding: 40px 40px 40px 0; - header, section, footer { + header, + section, + footer { padding-left: 40px; } } diff --git a/package.json b/package.json index 5004276..6208c5b 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "build:lint-js": "eslint --ext js --ext json --ext md . --ignore-path .gitignore", "build": "npm run build:pre && npm run build:test && npm run build:lint-js", + "format": "prettier-eslint --write \"**/*.{js,json,css,scss}\"", "test": "npm run build:pre && npm run build:test", "lint-js": "npm run build:pre && npm run build:lint-js", "dev": "npm run build:pre && mvn jetty:run", diff --git a/src/main/webapp/js/config.js b/src/main/webapp/js/config.js index 856eb71..933ab24 100644 --- a/src/main/webapp/js/config.js +++ b/src/main/webapp/js/config.js @@ -1,4 +1,4 @@ /* eslint-disable no-unused-vars */ var config = { - 'gaID': '', + gaID: '', }; diff --git a/src/main/webapp/js/override.js b/src/main/webapp/js/override.js index 59643cc..52e75b9 100644 --- a/src/main/webapp/js/override.js +++ b/src/main/webapp/js/override.js @@ -1,32 +1,31 @@ define(['angular'], function(angular) { // see https://uw-madison-doit.github.io/uw-frame/configuration.html for howto - return angular.module('override', []) - .constant('OVERRIDE', { - 'APP_FLAGS': { - 'defaultTheme': 'uwMadison', - 'showSearch': false, - 'isWeb': false, - 'loginOnLoad': false, + return angular.module('override', []).constant('OVERRIDE', { + APP_FLAGS: { + defaultTheme: 'uwMadison', + showSearch: false, + isWeb: false, + loginOnLoad: false, + }, + NAMES: { + title: 'Widget Creator', + fname: 'widget-creator', + }, + SERVICE_LOC: { + kvURL: null, + groupURL: 'staticFeeds/groups.json', + sessionInfo: 'staticFeeds/guest-session.json', + shibbolethSessionURL: 'staticFeeds/Shibboleth.sso/Session.json', + templates: 'json/starter-templates', + widgetApi: { + // For local testing, change to 'staticFeeds/' + entry: 'data:application/json;base64,', + entrySuffix: '', + entries: null, }, - 'NAMES': { - 'title': 'Widget Creator', - 'fname': 'widget-creator', - }, - 'SERVICE_LOC': { - 'kvURL': null, - 'groupURL': 'staticFeeds/groups.json', - 'sessionInfo': 'staticFeeds/guest-session.json', - 'shibbolethSessionURL': 'staticFeeds/Shibboleth.sso/Session.json', - 'templates': 'json/starter-templates', - 'widgetApi': { - // For local testing, change to 'staticFeeds/' - 'entry': 'data:application/json;base64,', - 'entrySuffix': '', - 'entries': null, - }, - }, - 'MISC_URLS': { - 'rootURL': 'https://my.wisc.edu', - }, - }); + }, + MISC_URLS: { + rootURL: 'https://my.wisc.edu', + }, + }); }); diff --git a/src/main/webapp/json/starter-templates.json b/src/main/webapp/json/starter-templates.json index 0439161..c0b332a 100644 --- a/src/main/webapp/json/starter-templates.json +++ b/src/main/webapp/json/starter-templates.json @@ -169,7 +169,8 @@ "widgetType": "time-sensitive-content", "title": "Time Sensitive Content", "mdIcon": "widgets", - "description": "A widget for displaying content before, during, and after a specified period of time", + "description": + "A widget for displaying content before, during, and after a specified period of time", "widgetConfig": { "callsToAction": [ { @@ -183,8 +184,8 @@ "daysLeftMessage": "to make it happen.", "lastDayMessage": "Today is the last day it could happen.", "actionButton": { - "url": "//www.example.com", - "label": "Do it to it" + "url": "//www.example.com", + "label": "Do it to it" }, "learnMoreUrl": "//www.example.com", "feedbackUrl": "//www.example.com" diff --git a/src/main/webapp/my-app/main.js b/src/main/webapp/my-app/main.js index 60cf45b..ab1743e 100644 --- a/src/main/webapp/my-app/main.js +++ b/src/main/webapp/my-app/main.js @@ -1,4 +1,5 @@ -define([ +define( + [ 'angular', 'require', './view-home/routes', // add all the paths to your routes here @@ -13,15 +14,18 @@ define([ './view-home/controllers', // add all your paths to your other js files here './view-home/directives', './view-home/services', - ], function( + ], + function( angular, require, homeRoutes, settingsRoutes, aboutRoute, mainRoutes - ) { // notice each route file is now an object - return angular.module('my-app', [ + ) { + // notice each route file is now an object + return angular + .module('my-app', [ 'app-config', 'my-app.view-home.controllers', // add in your modules here 'my-app.view-home.directives', @@ -30,17 +34,21 @@ define([ 'ngSanitize', 'ngStorage', 'portal', - ]) - .config(['$routeProvider', '$locationProvider', - function($routeProvider, $locationProvider) { - $locationProvider.html5Mode(true); - // IMPORTANT: Keep theses paths in sync with web.xml for html5mode - $routeProvider - .when('/home', homeRoutes.home) - .when('/settings', settingsRoutes.betaSettings) - .when('/user-settings', settingsRoutes.userSettings) - .when('/about', aboutRoute) - .when('/access-denied', mainRoutes.accessDenied) - .otherwise({'redirectTo': '/home'}); - }]); -}); + ]) + .config([ + '$routeProvider', + '$locationProvider', + function($routeProvider, $locationProvider) { + $locationProvider.html5Mode(true); + // IMPORTANT: Keep theses paths in sync with web.xml for html5mode + $routeProvider + .when('/home', homeRoutes.home) + .when('/settings', settingsRoutes.betaSettings) + .when('/user-settings', settingsRoutes.userSettings) + .when('/about', aboutRoute) + .when('/access-denied', mainRoutes.accessDenied) + .otherwise({redirectTo: '/home'}); + }, + ]); + } +); diff --git a/src/main/webapp/my-app/my-app.css b/src/main/webapp/my-app/my-app.css index af51152..839274f 100644 --- a/src/main/webapp/my-app/my-app.css +++ b/src/main/webapp/my-app/my-app.css @@ -3,26 +3,26 @@ } .widget-creator .portlet-body { - padding: 10px; + padding: 10px; } .widget-creator .container__select-template { - padding-bottom: 20px; + padding-bottom: 20px; } .widget-creator preview-widget { - width: 300px; + width: 300px; } .widget-creator .help-notes p { - color: #999; - font-size: 12px; - margin-bottom: 0; + color: #999; + font-size: 12px; + margin-bottom: 0; } .widget-creator textarea { - padding: 10px 14px; - overflow-y: scroll; + padding: 10px 14px; + overflow-y: scroll; } .widget-creator .hint { @@ -41,26 +41,28 @@ } .widget-creator ::-webkit-input-placeholder { - color: @grayscale6; - font-size: 12px; + color: @grayscale6; + font-size: 12px; } -.widget-creator :-moz-placeholder { /* Firefox 18- */ - color: @grayscale6; - font-size: 12px; +.widget-creator :-moz-placeholder { + /* Firefox 18- */ + color: @grayscale6; + font-size: 12px; } -.widget-creator ::-moz-placeholder { /* Firefox 19+ */ - color: @grayscale6; - font-size: 12px; +.widget-creator ::-moz-placeholder { + /* Firefox 19+ */ + color: @grayscale6; + font-size: 12px; } -.widget-creator :-ms-input-placeholder { - color: @grayscale6; - font-size: 12px; +.widget-creator :-ms-input-placeholder { + color: @grayscale6; + font-size: 12px; } .widget-middle { - width: 315px; - margin: auto; + width: 315px; + margin: auto; } diff --git a/src/main/webapp/my-app/view-home/controllers.js b/src/main/webapp/my-app/view-home/controllers.js index 83bf2d4..da7a1e3 100644 --- a/src/main/webapp/my-app/view-home/controllers.js +++ b/src/main/webapp/my-app/view-home/controllers.js @@ -1,151 +1,164 @@ 'use strict'; define(['angular'], function(angular) { - return angular.module('my-app.view-home.controllers', []) - // WIDGET CREATOR controller - .controller('WidgetCreatorController', [ - '$scope', '$log', 'widgetCreatorService', - function($scope, $log, widgetCreatorService) { - var starterTemplates = []; - /* ---------------- */ - /* Bindable members */ - /* ---------------- */ - $scope.templateOptions = [ - {'value': 'basic', 'name': 'Basic'}, - {'value': 'widget-creator', 'name': 'Custom'}, - {'value': 'list-of-links', 'name': 'List of links'}, - {'value': 'action-items', 'name': 'Action Items'}, - {'value': 'time-sensitive-content', 'name': 'Time Sensitive Content'}, - {'value': 'search-with-links', 'name': 'Search with links'}, - {'value': 'rss', 'name': 'RSS widget'}, - ]; - $scope.selectedTemplate = {}; - $scope.preview = undefined; - $scope.errorJSON = undefined; - $scope.errorConfigJSON = undefined; + return (angular + .module('my-app.view-home.controllers', []) + // WIDGET CREATOR controller + .controller('WidgetCreatorController', [ + '$scope', + '$log', + 'widgetCreatorService', + function($scope, $log, widgetCreatorService) { + var starterTemplates = []; + /* ---------------- */ + /* Bindable members */ + /* ---------------- */ + $scope.templateOptions = [ + {value: 'basic', name: 'Basic'}, + {value: 'widget-creator', name: 'Custom'}, + {value: 'list-of-links', name: 'List of links'}, + {value: 'action-items', name: 'Action Items'}, + {value: 'time-sensitive-content', name: 'Time Sensitive Content'}, + {value: 'search-with-links', name: 'Search with links'}, + {value: 'rss', name: 'RSS widget'}, + ]; + $scope.selectedTemplate = {}; + $scope.preview = undefined; + $scope.errorJSON = undefined; + $scope.errorConfigJSON = undefined; - /* --------------- */ - /* Scope functions */ - /* --------------- */ + /* --------------- */ + /* Scope functions */ + /* --------------- */ - // Reload widget preview - $scope.reload = function() { - $scope.prepareWidgetDataForDisplay($scope.widget); - }; + // Reload widget preview + $scope.reload = function() { + $scope.prepareWidgetDataForDisplay($scope.widget); + }; - // Clear widget configuration - $scope.clear = function() { - if (confirm('Are you sure, all your config will be cleared')) { - $scope.init(); - } - }; + // Clear widget configuration + $scope.clear = function() { + if (confirm('Are you sure, all your config will be cleared')) { + $scope.init(); + } + }; - // Change to newly-selected template type - $scope.changeTemplate = function() { - // Set widget equal to starter template that matches the selected type - angular.forEach(starterTemplates, function(value, key) { - if ($scope.selectedTemplate.value == value.entry.layoutObject.type) { - $scope.widget = $scope.widgetAsEditable(value.entry.layoutObject); - } - }); - $scope.reload(); - }; + // Change to newly-selected template type + $scope.changeTemplate = function() { + // Set widget equal to starter template that matches the selected type + angular.forEach(starterTemplates, function(value, key) { + if ( + $scope.selectedTemplate.value == value.entry.layoutObject.type + ) { + $scope.widget = $scope.widgetAsEditable( + value.entry.layoutObject + ); + } + }); + $scope.reload(); + }; - /* --------------- */ - /* Local functions */ - /* --------------- */ + /* --------------- */ + /* Local functions */ + /* --------------- */ - $scope.wrapLayout = function(preview) { - var wrapped = { - 'entry': { - 'layoutObject': preview, - }, - }; - return btoa(angular.toJson(wrapped)); - }; + $scope.wrapLayout = function(preview) { + var wrapped = { + entry: { + layoutObject: preview, + }, + }; + return btoa(angular.toJson(wrapped)); + }; - /** + /** * Check if json is valid * @param {String} json the json to parse * @return {Object|undefined} */ - $scope.parseJSON = function parseJSON(json) { - try { - return angular.fromJson(json); - } catch (e) { - return undefined; - } - }; + $scope.parseJSON = function parseJSON(json) { + try { + return angular.fromJson(json); + } catch (e) { + return undefined; + } + }; - /** + /** * Convert JSON objects to strings so they can be displayed in HTML * @param {Object} editable The object used to store user edits */ - $scope.prepareWidgetDataForDisplay = function(editable) { - var preview = angular.copy(editable); - var widgetConfig = $scope.parseJSON(editable.widgetConfig); - var sample = $scope.parseJSON(editable.sample); + $scope.prepareWidgetDataForDisplay = function(editable) { + var preview = angular.copy(editable); + var widgetConfig = $scope.parseJSON(editable.widgetConfig); + var sample = $scope.parseJSON(editable.sample); - $scope.errorJSON = (!sample) ? 'JSON NOT VALID' : undefined; - $scope.errorConfigJSON = (!widgetConfig) ? 'JSON NOT VALID' : undefined; + $scope.errorJSON = !sample ? 'JSON NOT VALID' : undefined; + $scope.errorConfigJSON = !widgetConfig + ? 'JSON NOT VALID' + : undefined; - if (widgetConfig && (!editable.jsonSample || sample)) { - preview.widgetConfig = widgetConfig; - if (sample) { - preview.widgetURL = 'data:application/json;base64,' - + btoa(angular.toJson(sample)); - } - $scope.preview = $scope.wrapLayout(preview); - } - }; + if (widgetConfig && (!editable.jsonSample || sample)) { + preview.widgetConfig = widgetConfig; + if (sample) { + preview.widgetURL = + 'data:application/json;base64,' + + btoa(angular.toJson(sample)); + } + $scope.preview = $scope.wrapLayout(preview); + } + }; - /** + /** * Takes a valid widget configuration and creates an user-editable version. * @param {Object} widget widget configuration * @return {Object} user-editable widget config */ - $scope.widgetAsEditable = function(widget) { - var editable = angular.copy(widget); - $scope.errorConfigJSON = undefined; - if (!angular.isString(editable.widgetConfig)) { - editable.widgetConfig = angular.toJson(editable.widgetConfig); - } - $scope.errorJSON = undefined; - if (editable.jsonSample) { - editable.sample = angular.toJson(editable.jsonSample); - } - return editable; - }; + $scope.widgetAsEditable = function(widget) { + var editable = angular.copy(widget); + $scope.errorConfigJSON = undefined; + if (!angular.isString(editable.widgetConfig)) { + editable.widgetConfig = angular.toJson(editable.widgetConfig); + } + $scope.errorJSON = undefined; + if (editable.jsonSample) { + editable.sample = angular.toJson(editable.jsonSample); + } + return editable; + }; - /** + /** * Initialize widget creator * @return {Promise} starter templates */ - $scope.init = function() { - return widgetCreatorService.getStarterTemplates() - .then(function(templates) { - starterTemplates = templates; - $log.log('Got starter templates'); - if (templates[0].entry.layoutObject) { - // Set default widget type - $scope.widget = $scope.widgetAsEditable( - templates[0].entry.layoutObject); - $scope.prepareWidgetDataForDisplay($scope.widget); + $scope.init = function() { + return widgetCreatorService + .getStarterTemplates() + .then(function(templates) { + starterTemplates = templates; + $log.log('Got starter templates'); + if (templates[0].entry.layoutObject) { + // Set default widget type + $scope.widget = $scope.widgetAsEditable( + templates[0].entry.layoutObject + ); + $scope.prepareWidgetDataForDisplay($scope.widget); - // Set selected template - angular.forEach($scope.templateOptions, function(value, key) { - if ($scope.widget.type === value.value) { - $scope.selectedTemplate = value; - } - }); - } - return templates; - }); - }; + // Set selected template + angular.forEach($scope.templateOptions, function(value, key) { + if ($scope.widget.type === value.value) { + $scope.selectedTemplate = value; + } + }); + } + return templates; + }); + }; - $scope.init().catch(function(error) { - $log.warn('WidgetCreatorController couldn\'t get starter templates'); - $log.error(error); - }); - }]); + $scope.init().catch(function(error) { + $log.warn('WidgetCreatorController couldn\'t get starter templates'); + $log.error(error); + }); + }, + ]) ); }); diff --git a/src/main/webapp/my-app/view-home/directives.js b/src/main/webapp/my-app/view-home/directives.js index b684968..c7b8326 100644 --- a/src/main/webapp/my-app/view-home/directives.js +++ b/src/main/webapp/my-app/view-home/directives.js @@ -1,24 +1,26 @@ 'use strict'; define(['angular', 'require'], function(angular, require) { - return angular.module('my-app.view-home.directives', []) - .directive('previewWidget', function() { - return { - restrict: 'E', - transclude: true, - scope: { - fname: '@', - }, - templateUrl: require.toUrl( - '../../portal/widgets/partials/widget-card.html'), - controller: 'WidgetCardController', - link: function(scope, element, attrs) { - scope.$watch('fname', function(newValue, oldValue) { - if (newValue) { - scope.initializeWidget(newValue); - } - }); - }, - }; - }); + return angular + .module('my-app.view-home.directives', []) + .directive('previewWidget', function() { + return { + restrict: 'E', + transclude: true, + scope: { + fname: '@', + }, + templateUrl: require.toUrl( + '../../portal/widgets/partials/widget-card.html' + ), + controller: 'WidgetCardController', + link: function(scope, element, attrs) { + scope.$watch('fname', function(newValue, oldValue) { + if (newValue) { + scope.initializeWidget(newValue); + } + }); + }, + }; + }); }); diff --git a/src/main/webapp/my-app/view-home/routes.js b/src/main/webapp/my-app/view-home/routes.js index 0b3d4f1..e14153e 100644 --- a/src/main/webapp/my-app/view-home/routes.js +++ b/src/main/webapp/my-app/view-home/routes.js @@ -1,5 +1,5 @@ define(['require'], function(require) { return { - 'home': {templateUrl: require.toUrl('./view-home.html')}, + home: {templateUrl: require.toUrl('./view-home.html')}, }; }); diff --git a/src/main/webapp/my-app/view-home/services.js b/src/main/webapp/my-app/view-home/services.js index fd8d7fd..79dfe65 100644 --- a/src/main/webapp/my-app/view-home/services.js +++ b/src/main/webapp/my-app/view-home/services.js @@ -1,23 +1,28 @@ 'use strict'; define(['angular'], function(angular) { - return angular.module('my-app.view-home.services', []) + return angular + .module('my-app.view-home.services', []) .factory('widgetCreatorService', [ - '$log', '$http', 'SERVICE_LOC', + '$log', + '$http', + 'SERVICE_LOC', function($log, $http, SERVICE_LOC) { - var getStarterTemplates = function() { - return $http.get(SERVICE_LOC.templates + '.json') - .then(function(result) { - return result.data.templates; - }) - .catch(function(error) { - $log.warn('Error getting starter templates'); - $log.error(error); - }); - }; + var getStarterTemplates = function() { + return $http + .get(SERVICE_LOC.templates + '.json') + .then(function(result) { + return result.data.templates; + }) + .catch(function(error) { + $log.warn('Error getting starter templates'); + $log.error(error); + }); + }; - return { - 'getStarterTemplates': getStarterTemplates, - }; - }]); + return { + getStarterTemplates: getStarterTemplates, + }; + }, + ]); }); diff --git a/src/main/webapp/my-app/view-home/spec/view-home-spec.js b/src/main/webapp/my-app/view-home/spec/view-home-spec.js index 20048a9..ecd9f68 100644 --- a/src/main/webapp/my-app/view-home/spec/view-home-spec.js +++ b/src/main/webapp/my-app/view-home/spec/view-home-spec.js @@ -2,45 +2,51 @@ /* eslint-env node */ /* global inject readJSON */ define(['angular-mocks', 'my-app'], function() { - describe('WidgetCreatorController', function() { - var scope; - var deferred; - var service; - var templateURL; - var templates; + describe('WidgetCreatorController', function() { + var scope; + var deferred; + var service; + var templateURL; + var templates; - beforeEach(function() { - module('my-app'); - }); - - beforeEach(inject(function( - _$controller_, _$q_, _$rootScope_, _$templateCache_, - _widgetCreatorService_, _SERVICE_LOC_) { - scope = _$rootScope_.$new(); - templateURL = _SERVICE_LOC_.templates + '.json'; - templates = readJSON(templateURL).templates; - spyOn(_$templateCache_, 'get').and.callFake(function(path) { - return '
'; - }); - service = _widgetCreatorService_; - deferred = _$q_.defer(); - spyOn(service, 'getStarterTemplates') - .and.returnValue(deferred.promise); - _$controller_('WidgetCreatorController', { - '$scope': scope, - 'widgetCreatorService': service, - }); - deferred.resolve(templates); - scope.$apply(); - })); + beforeEach(function() { + module('my-app'); + }); - it('should set selectedTemplate in scope', function() { - expect(scope.selectedTemplate).toBeTruthy(); - expect(scope.selectedTemplate).not.toEqual({}); + beforeEach( + inject(function( + _$controller_, + _$q_, + _$rootScope_, + _$templateCache_, + _widgetCreatorService_, + _SERVICE_LOC_ + ) { + scope = _$rootScope_.$new(); + templateURL = _SERVICE_LOC_.templates + '.json'; + templates = readJSON(templateURL).templates; + spyOn(_$templateCache_, 'get').and.callFake(function(path) { + return '
'; }); - - it('should set the preview widget configuration', function() { - expect(scope.preview).toBeTruthy(); + service = _widgetCreatorService_; + deferred = _$q_.defer(); + spyOn(service, 'getStarterTemplates').and.returnValue(deferred.promise); + _$controller_('WidgetCreatorController', { + $scope: scope, + widgetCreatorService: service, }); + deferred.resolve(templates); + scope.$apply(); + }) + ); + + it('should set selectedTemplate in scope', function() { + expect(scope.selectedTemplate).toBeTruthy(); + expect(scope.selectedTemplate).not.toEqual({}); + }); + + it('should set the preview widget configuration', function() { + expect(scope.preview).toBeTruthy(); }); + }); });