From b923008f7caf19adb23682fc2541e9ba1b554aa1 Mon Sep 17 00:00:00 2001 From: Juan Cruz Viotti Date: Wed, 22 Jun 2016 10:41:02 -0400 Subject: [PATCH] refactor: make use of `angular-if-state` (#506) We'll use this external module rather than our local `if-state` implementation. Signed-off-by: Juan Cruz Viotti --- lib/gui/app.js | 2 +- .../if-state/directives/hide-if-state.js | 54 --------- .../if-state/directives/show-if-state.js | 54 --------- lib/gui/utils/if-state/if-state.js | 36 ------ npm-shrinkwrap.json | 12 ++ package.json | 1 + tests/gui/utils/if-state.spec.js | 103 ------------------ 7 files changed, 14 insertions(+), 248 deletions(-) delete mode 100644 lib/gui/utils/if-state/directives/hide-if-state.js delete mode 100644 lib/gui/utils/if-state/directives/show-if-state.js delete mode 100644 lib/gui/utils/if-state/if-state.js delete mode 100644 tests/gui/utils/if-state.spec.js diff --git a/lib/gui/app.js b/lib/gui/app.js index ffffe81d..ecbae377 100644 --- a/lib/gui/app.js +++ b/lib/gui/app.js @@ -28,6 +28,7 @@ const app = angular.module('Etcher', [ require('angular-ui-bootstrap'), require('angular-moment'), require('angular-middle-ellipses'), + require('angular-if-state'), // Etcher modules require('./modules/drive-scanner'), @@ -59,7 +60,6 @@ const app = angular.module('Etcher', [ require('./os/dialog/dialog'), // Utils - require('./utils/if-state/if-state'), require('./utils/notifier/notifier'), require('./utils/path/path'), require('./utils/manifest-bind/manifest-bind'), diff --git a/lib/gui/utils/if-state/directives/hide-if-state.js b/lib/gui/utils/if-state/directives/hide-if-state.js deleted file mode 100644 index 9636865a..00000000 --- a/lib/gui/utils/if-state/directives/hide-if-state.js +++ /dev/null @@ -1,54 +0,0 @@ -/* - * Copyright 2016 Resin.io - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -'use strict'; - -/** - * @summary HideIfState directive - * @function - * @public - * - * @description - * This directive provides an attribute to hide an element - * when the current UI Router state matches the specified one. - * - * @param {Object} $state - ui router $state - * @returns {Object} directive - * - * @example - * - */ -module.exports = function($state) { - return { - restrict: 'A', - scope: { - hideIfState: '@' - }, - link: function(scope, element) { - scope.$watch(function() { - return $state.is(scope.hideIfState); - }, function(isState) { - - if (isState) { - element.css('display', 'none'); - } else { - element.css('display', 'initial'); - } - - }); - } - }; -}; diff --git a/lib/gui/utils/if-state/directives/show-if-state.js b/lib/gui/utils/if-state/directives/show-if-state.js deleted file mode 100644 index e0fda652..00000000 --- a/lib/gui/utils/if-state/directives/show-if-state.js +++ /dev/null @@ -1,54 +0,0 @@ -/* - * Copyright 2016 Resin.io - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -'use strict'; - -/** - * @summary ShowIfState directive - * @function - * @public - * - * @description - * This directive provides an attribute to show an element - * when the current UI Router state matches the specified one. - * - * @param {Object} $state - ui router $state - * @returns {Object} directive - * - * @example - * - */ -module.exports = function($state) { - return { - restrict: 'A', - scope: { - showIfState: '@' - }, - link: function(scope, element) { - scope.$watch(function() { - return $state.is(scope.showIfState); - }, function(isState) { - - if (isState) { - element.css('display', 'initial'); - } else { - element.css('display', 'none'); - } - - }); - } - }; -}; diff --git a/lib/gui/utils/if-state/if-state.js b/lib/gui/utils/if-state/if-state.js deleted file mode 100644 index 788458c3..00000000 --- a/lib/gui/utils/if-state/if-state.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Copyright 2016 Resin.io - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -'use strict'; - -/** - * @module Etcher.Utils.IfState - * - * The purpose of this module is to provide an attribute - * directive to show/hide an element when the current UI Router - * state matches the one specified in the attribute. - */ - -const angular = require('angular'); -const MODULE_NAME = 'Etcher.Utils.IfState'; -const IfState = angular.module(MODULE_NAME, [ - require('angular-ui-router') -]); - -IfState.directive('showIfState', require('./directives/show-if-state')); -IfState.directive('hideIfState', require('./directives/hide-if-state')); - -module.exports = MODULE_NAME; diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json index 70f017bf..c5175a08 100644 --- a/npm-shrinkwrap.json +++ b/npm-shrinkwrap.json @@ -42,6 +42,18 @@ "from": "angular@>=1.5.3 <2.0.0", "resolved": "https://registry.npmjs.org/angular/-/angular-1.5.7.tgz" }, + "angular-if-state": { + "version": "1.0.0", + "from": "angular-if-state@>=1.0.0 <2.0.0", + "resolved": "https://registry.npmjs.org/angular-if-state/-/angular-if-state-1.0.0.tgz", + "dependencies": { + "angular-ui-router": { + "version": "0.3.1", + "from": "angular-ui-router@>=0.3.1 <0.4.0", + "resolved": "https://registry.npmjs.org/angular-ui-router/-/angular-ui-router-0.3.1.tgz" + } + } + }, "angular-middle-ellipses": { "version": "1.0.0", "from": "angular-middle-ellipses@>=1.0.0 <2.0.0", diff --git a/package.json b/package.json index 12cc88c1..1ccfe1e7 100644 --- a/package.json +++ b/package.json @@ -55,6 +55,7 @@ }, "dependencies": { "angular": "^1.5.3", + "angular-if-state": "^1.0.0", "angular-middle-ellipses": "^1.0.0", "angular-moment": "^1.0.0-beta.6", "angular-q-promisify": "^1.1.0", diff --git a/tests/gui/utils/if-state.spec.js b/tests/gui/utils/if-state.spec.js deleted file mode 100644 index c032f03d..00000000 --- a/tests/gui/utils/if-state.spec.js +++ /dev/null @@ -1,103 +0,0 @@ -/* - * Copyright 2016 Resin.io - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -'use strict'; - -const m = require('mochainon'); -const angular = require('angular'); -require('angular-mocks'); - -describe('Browser: IfState', function() { - - beforeEach(angular.mock.module( - require('../../../lib/gui/utils/if-state/if-state') - )); - - let $compile; - let $rootScope; - let $state; - - beforeEach(angular.mock.inject(function(_$compile_, _$rootScope_, _$state_) { - $compile = _$compile_; - $rootScope = _$rootScope_; - $state = _$state_; - })); - - describe('given the current state is "foo"', function() { - - beforeEach(function() { - this.stateIsStub = m.sinon.stub($state, 'is'); - this.stateIsStub.withArgs('foo').returns(true); - this.stateIsStub.returns(false); - }); - - afterEach(function() { - this.stateIsStub.restore(); - }); - - describe('hideIfState', function() { - - it('should hide the element if the attribute equals "foo"', function() { - const element = $compile('Resin.io')($rootScope); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('none'); - }); - - it('should show the element if the attribute does not equal "foo"', function() { - const element = $compile('Resin.io')($rootScope); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('initial'); - }); - - it('should show the element if the state changes', function() { - const element = $compile('Resin.io')($rootScope); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('none'); - this.stateIsStub.withArgs('foo').returns(false); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('initial'); - }); - - }); - - describe('showIfState', function() { - - it('should hide the element if the attribute does not equal "foo"', function() { - const element = $compile('Resin.io')($rootScope); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('none'); - }); - - it('should show the element if the attribute equals "foo"', function() { - const element = $compile('Resin.io')($rootScope); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('initial'); - }); - - it('should hide the element if the state changes', function() { - const element = $compile('Resin.io')($rootScope); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('initial'); - this.stateIsStub.withArgs('foo').returns(false); - $rootScope.$digest(); - m.chai.expect(element.css('display')).to.equal('none'); - }); - - }); - - }); - -});