From be8ce0f5d4875db9e804fed50e1f27848b6a3485 Mon Sep 17 00:00:00 2001 From: Kraigo Date: Tue, 27 Dec 2016 09:33:58 +0200 Subject: [PATCH 1/5] Webpack dev server --- index.html | 132 +++++++++++++++++++++++++++++++++++++++++++++++++++ package.json | 9 ++-- 2 files changed, 138 insertions(+), 3 deletions(-) create mode 100644 index.html diff --git a/index.html b/index.html new file mode 100644 index 0000000..a8c214d --- /dev/null +++ b/index.html @@ -0,0 +1,132 @@ + + + + + + Document + + + + + + + + + + +
+
+ Level 1 +
+
+ Welcome to level 1 +
+
+ Level 2 +
+
+

Welcome to level 2

+
+
+ + + + Level 1 + + +

Welcome to level 2

+ + + + +
+
+ Level 1 +
+
+ Welcome to level 1 +
+
+ Level 1A +
+
+

Level 1A Contents

+
+
+ Level 1A-A +
+
+ Level 1A-A Contents +
+
+ Level 1A-B +
+
+ Level 1A-B Contents +
+
+
+
+ Level 1B +
+
+ Level 1B Contents +
+
+ Level 1C +
+
+ Level 1C Contents +
+
+
+
+ Level 2 +
+
+

Welcome to level 2

+
+
+ Level 2A +
+
+

Level 2A Contents

+
+
+ Level 2A-A +
+
+ Level 2A-A Contents +
+
+ Level 2A-B +
+
+ Level 2A-B Contents +
+
+
+
+ Level 2B +
+
+ Level 2B Contents +
+
+ Level 2C +
+
+ Level 2C Contents +
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/package.json b/package.json index ae42d2d..1dd3488 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,8 @@ "postinstall": "node_modules/.bin/tsd install", "test": "node_modules/karma/bin/karma start", "test-dev": "./node_modules/karma/bin/karma start --auto-watch --no-single-run", - "build": "rm -rf dist && node_modules/.bin/webpack" + "build": "rimraf dist && webpack", + "start": "webpack-dev-server --inline --progress --port 8080" }, "repository": { "type": "git", @@ -42,16 +43,18 @@ "karma-webpack": "1.7.0", "phantomjs": "1.9.19", "phantomjs-polyfill": "0.0.1", + "rimraf": "^2.5.4", "ts-loader": "0.7.2", "tsd": "0.6.5", "tslint": "3.2.1", "tslint-loader": "2.1.0", "typescript": "1.7.5", - "webpack": "1.12.10" + "webpack": "1.12.10", + "webpack-dev-server": "^1.16.2" }, "config": { "commitizen": { "path": "./node_modules/cz-conventional-changelog" } } -} \ No newline at end of file +} From 8af7b3d1d5cf092bf549730e1633988933d2b468 Mon Sep 17 00:00:00 2001 From: Kraigo Date: Tue, 27 Dec 2016 09:34:13 +0200 Subject: [PATCH 2/5] Accordion module --- src/index.ts | 6 +- src/modules/accordion/accordion.module.ts | 92 +++++++++++++++++++++++ 2 files changed, 97 insertions(+), 1 deletion(-) create mode 100644 src/modules/accordion/accordion.module.ts diff --git a/src/index.ts b/src/index.ts index 091759c..8939ce1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,7 @@ /// + +import { smAccordionModule } from './modules/accordion/accordion.module'; import { smButtonModule } from './elements/button/button'; import { smRatingModule } from './modules/rating/rating'; import { smDividerModule } from './elements/divider/divider'; @@ -11,7 +13,9 @@ import { smDividerModule } from './elements/divider/divider'; .module('semantic.ui', [ smButtonModule.name, smRatingModule.name, - smDividerModule.name + smDividerModule.name, + + smAccordionModule.name ]); })(); diff --git a/src/modules/accordion/accordion.module.ts b/src/modules/accordion/accordion.module.ts new file mode 100644 index 0000000..f36cfe8 --- /dev/null +++ b/src/modules/accordion/accordion.module.ts @@ -0,0 +1,92 @@ +/// + +'use strict'; + +interface ISmAccordionSettings { + exclusive: Boolean, + on: String, + animateChildren: Boolean, + closeNested: Boolean, + collapsible: Boolean, + duration: Number, + easing: String +} + +const accordionSettings : ISmAccordionSettings = { + exclusive: true, + on: 'click', + animateChildren: true, + closeNested: true, + collapsible: true, + duration: 500, + easing: 'easeInOutQuint' +}; + +class SmAccordionController { + static $inject = ['$scope', '$element', '$attrs']; + + ngModel: ng.INgModelController; + + constructor(public $scope: ng.IScope, public $element: ng.IAugmentedJQuery, public $attrs) { + $element + .addClass('ui styled accordion'); + + } +} + +class SmAccordionDirective implements ng.IDirective { + static instance(): ng.IDirective { + return new SmAccordionDirective; + } + + restrict = 'E'; + controller = SmAccordionController; + link = ( + scope: ng.IScope, + element: ng.IAugmentedJQuery, + attrs + ) => { + // const [controller, ngModel] = ctrls; + // controller.init(ngModel); + }; +} + +class SmAccordionTitleDirective implements ng.IDirective { + static instance(): ng.IDirective { + return new SmAccordionTitleDirective; + } + + restrict = 'E'; + link = ( + scope: ng.IScope, + element: ng.IAugmentedJQuery, + attrs + ) => { + element.addClass('title'); + // element.bind('click', () => element.toggleClass('active')) + }; +} + +class SmAccordionContentDirective implements ng.IDirective { + static instance(): ng.IDirective { + return new SmAccordionContentDirective; + } + + restrict = 'E'; + link = ( + scope: ng.IScope, + element: ng.IAugmentedJQuery, + attrs + ) => { + element.addClass('content'); + }; +} + + +export const smAccordionModule = angular + .module('semantic.ui.modules.accordion', []) + .directive('smAccordion', SmAccordionDirective.instance) + .directive('smAccordionItem', SmAccordionDirective.instance) + .directive('smAccordionTitle', SmAccordionTitleDirective.instance) + .directive('smAccordionContent', SmAccordionContentDirective.instance) + .constant('smAccordionSettings', accordionSettings); From bc7d451a160529f69af09b2c50cd0922120768f5 Mon Sep 17 00:00:00 2001 From: Igor K Date: Tue, 27 Dec 2016 11:51:44 +0200 Subject: [PATCH 3/5] Accordion collapsing --- index.html | 93 +++++++++++++++++------ src/modules/accordion/accordion.module.ts | 76 +++++++++++++----- webpack.config.js | 80 +++++++++---------- 3 files changed, 165 insertions(+), 84 deletions(-) diff --git a/index.html b/index.html index a8c214d..319a24e 100644 --- a/index.html +++ b/index.html @@ -13,33 +13,76 @@ + + + Level 1 + + +

Welcome to level 1

-
-
- Level 1 -
-
- Welcome to level 1 -
-
- Level 2 -
-
+ + + Level 1A + + + + Level 1A Contents + + + + + Level 1A-A + + + Level 1A-A Contents + + + + Level 1A-B + + + Level 1A-B Contents + + + + + + + Level 1B + + + Level 1B Contents + + + + Level 1C + + + Level 1C Contents + + + + + + + Level 2 + +

Welcome to level 2

-
-
+ - - - Level 1 - - -

Welcome to level 2

- + + Level 3 + + +

Welcome to level 3

+ +
-
+ +
Level 1
@@ -120,12 +163,12 @@
- + - + diff --git a/src/modules/accordion/accordion.module.ts b/src/modules/accordion/accordion.module.ts index f36cfe8..3fc4936 100644 --- a/src/modules/accordion/accordion.module.ts +++ b/src/modules/accordion/accordion.module.ts @@ -3,16 +3,16 @@ 'use strict'; interface ISmAccordionSettings { - exclusive: Boolean, - on: String, - animateChildren: Boolean, - closeNested: Boolean, - collapsible: Boolean, - duration: Number, - easing: String + exclusive: Boolean, + on: String, + animateChildren: Boolean, + closeNested: Boolean, + collapsible: Boolean, + duration: Number, + easing: String } -const accordionSettings : ISmAccordionSettings = { +const accordionSettings: ISmAccordionSettings = { exclusive: true, on: 'click', animateChildren: true, @@ -26,11 +26,30 @@ class SmAccordionController { static $inject = ['$scope', '$element', '$attrs']; ngModel: ng.INgModelController; + accordionGroups = []; constructor(public $scope: ng.IScope, public $element: ng.IAugmentedJQuery, public $attrs) { - $element - .addClass('ui styled accordion'); - + + } + + addGroup = function (element) { + this.accordionGroups.push(element); + } + setActive = function (title) { + + var content = this.accordionGroups[this.accordionGroups.indexOf(title) + 1]; + + if (content && content.hasClass('content')) { + content.toggleClass('active'); + } + title.toggleClass('active'); + + if (accordionSettings.exclusive) { + this.accordionGroups.forEach(e => { + if (e != title && e != content) + e.removeClass('active') + }); + } } } @@ -41,13 +60,16 @@ class SmAccordionDirective implements ng.IDirective { restrict = 'E'; controller = SmAccordionController; + controllerAs = 'accordion'; + replace = true; + transclude = true; + template = '
'; link = ( scope: ng.IScope, element: ng.IAugmentedJQuery, attrs ) => { - // const [controller, ngModel] = ctrls; - // controller.init(ngModel); + }; } @@ -57,13 +79,24 @@ class SmAccordionTitleDirective implements ng.IDirective { } restrict = 'E'; + replace = true; + transclude = true; + require = '^smAccordion'; + + template = '
'; + link = ( scope: ng.IScope, element: ng.IAugmentedJQuery, - attrs + attrs, + ctrl ) => { - element.addClass('title'); - // element.bind('click', () => element.toggleClass('active')) + ctrl.addGroup(element); + + element.bind('click', () => { + ctrl.setActive(element); + }); + }; } @@ -73,12 +106,18 @@ class SmAccordionContentDirective implements ng.IDirective { } restrict = 'E'; + replace = true; + transclude = true; + require = '^smAccordion'; + + template = '
'; link = ( scope: ng.IScope, element: ng.IAugmentedJQuery, - attrs + attrs, + ctrl ) => { - element.addClass('content'); + ctrl.addGroup(element); }; } @@ -86,7 +125,6 @@ class SmAccordionContentDirective implements ng.IDirective { export const smAccordionModule = angular .module('semantic.ui.modules.accordion', []) .directive('smAccordion', SmAccordionDirective.instance) - .directive('smAccordionItem', SmAccordionDirective.instance) .directive('smAccordionTitle', SmAccordionTitleDirective.instance) .directive('smAccordionContent', SmAccordionContentDirective.instance) .constant('smAccordionSettings', accordionSettings); diff --git a/webpack.config.js b/webpack.config.js index e493a20..67a6a63 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -3,46 +3,46 @@ var webpack = require('webpack'); var VERSION = require('./package.json').version; var banner = - '/*!\n' + - ' * Semantic-UI AngularJS integration\n' + - ' * https://github.com/semantic-org/semantic-ui-angular\n' + - ' * @license MIT\n' + - ' * v' + VERSION + '\n' + - ' */\n'; + '/*!\n' + + ' * Semantic-UI AngularJS integration\n' + + ' * https://github.com/semantic-org/semantic-ui-angular\n' + + ' * @license MIT\n' + + ' * v' + VERSION + '\n' + + ' */\n'; module.exports = { - context: path.resolve('src'), - devtool: "source-map", - entry: { - 'semantic-ui-angular': './index', - 'semantic-ui-angular.min': './index' - }, - output: { - path: path.resolve('dist'), - filename: '[name].js' - }, - plugins: [ - new webpack.optimize.UglifyJsPlugin({ - include: /\.min\.js$/, - minimize: true - }), - new webpack.BannerPlugin(banner, {raw: true}) - ], - module: { - preLoaders: [ - { test: /\.ts$/, exclude: /node_modules/, loader: 'tslint-loader' }, - // TODO(m0t0r): JSCS complains on TS code, decide if we actually can/need make it work - //{ test: /\.ts$/, exclude: /node_modules/, loader: 'jscs-loader' } + context: path.resolve('src'), + devtool: "source-map", + entry: { + 'semantic-ui-angular': './index', + 'semantic-ui-angular.min': './index' + }, + output: { + path: path.resolve('dist'), + filename: '[name].js' + }, + plugins: [ + // new webpack.optimize.UglifyJsPlugin({ + // include: /\.min\.js$/, + // minimize: true + // }), + // new webpack.BannerPlugin(banner, {raw: true}) ], - loaders: [ - { test: /\.ts?$/, exclude: /node_modules/, loader: 'ts-loader' }, - { test: /\.json?$/, exclude: /node_modules/, loader: 'json-loader' } - ] - }, - tslint: { - configuration: require('./tslint.json') - }, - resolve: { - extensions: ['', '.ts', '.js'] - } -}; + module: { + preLoaders: [ + { test: /\.ts$/, exclude: /node_modules/, loader: 'tslint-loader' }, + // TODO(m0t0r): JSCS complains on TS code, decide if we actually can/need make it work + //{ test: /\.ts$/, exclude: /node_modules/, loader: 'jscs-loader' } + ], + loaders: [ + { test: /\.ts?$/, exclude: /node_modules/, loader: 'ts-loader' }, + { test: /\.json?$/, exclude: /node_modules/, loader: 'json-loader' } + ] + }, + tslint: { + configuration: require('./tslint.json') + }, + resolve: { + extensions: ['', '.ts', '.js'] + } +}; \ No newline at end of file From 2a3f60e7b4c089714bfc18e51e09ffc630607801 Mon Sep 17 00:00:00 2001 From: Igor K Date: Tue, 27 Dec 2016 14:59:29 +0200 Subject: [PATCH 4/5] update package versions --- karma.conf.js | 133 +++++++++++++++++++++++++------------------------- package.json | 116 +++++++++++++++++++++---------------------- 2 files changed, 124 insertions(+), 125 deletions(-) diff --git a/karma.conf.js b/karma.conf.js index bac5982..c81af87 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -1,91 +1,90 @@ module.exports = function(config) { - config.set({ + config.set({ - // base path that will be used to resolve all patterns (eg. files, exclude) - basePath: '', + // base path that will be used to resolve all patterns (eg. files, exclude) + basePath: '', - // frameworks to use - // available frameworks: https://npmjs.org/browse/keyword/karma-adapter - frameworks: ['jasmine'], + // frameworks to use + // available frameworks: https://npmjs.org/browse/keyword/karma-adapter + frameworks: ['jasmine'], - // list of files / patterns to load in the browser - files: [ - './node_modules/jquery/dist/jquery.js', - './node_modules/phantomjs-polyfill/bind-polyfill.js', - './node_modules/angular/angular.js', - './node_modules/angular-mocks/angular-mocks.js', - { pattern: 'spec.bundle.js', watched: false } - ], + // list of files / patterns to load in the browser + files: [ + './node_modules/jquery/dist/jquery.js', + './node_modules/phantomjs-polyfill/bind-polyfill.js', + './node_modules/angular/angular.js', + './node_modules/angular-mocks/angular-mocks.js', + { pattern: 'spec.bundle.js', watched: false } + ], - // list of files to exclude - exclude: [ - ], + // list of files to exclude + exclude: [], - plugins: [ - require("karma-phantomjs-launcher"), - require("karma-sourcemap-loader"), - require('karma-jasmine'), - require('karma-webpack') - ], + plugins: [ + require("karma-phantomjs-launcher"), + require("karma-sourcemap-loader"), + require('karma-jasmine'), + require('karma-webpack') + ], - // preprocess matching files before serving them to the browser - // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor - preprocessors: { - 'spec.bundle.js': ['webpack', 'sourcemap'] - }, + // preprocess matching files before serving them to the browser + // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor + preprocessors: { + 'spec.bundle.js': ['webpack', 'sourcemap'] + }, - webpack: { - devtools: 'inline-source-map', - module: { - preLoaders: [ - { test: /\.ts$/, exclude: /node_modules/, loader: 'tslint-loader' } - ], - loaders: [ - { test: /\.ts?$/, exclude: /node_modules/, loader: 'ts-loader' }, - { test: /\.json?$/, exclude: /node_modules/, loader: 'json-loader' } - ] - }, - tslint: { - configuration: require('./tslint.json') - }, - resolve: { - extensions: ['', '.ts', '.js'] - } - }, + webpack: { + devtools: 'inline-source-map', + module: { + preLoaders: [ + { test: /\.ts$/, exclude: /node_modules/, loader: 'tslint-loader' } + ], + loaders: [ + { test: /\.ts?$/, exclude: /node_modules/, loader: 'ts-loader' }, + { test: /\.json?$/, exclude: /node_modules/, loader: 'json-loader' } + ] + }, + tslint: { + configuration: require('./tslint.json') + }, + resolve: { + extensions: ['', '.ts', '.js'] + } + }, - // test results reporter to use - // possible values: 'dots', 'progress' - // available reporters: https://npmjs.org/browse/keyword/karma-reporter - reporters: ['progress'], + // test results reporter to use + // possible values: 'dots', 'progress' + // available reporters: https://npmjs.org/browse/keyword/karma-reporter + reporters: ['progress'], - // web server port - port: 9876, + // web server port + port: 9876, - // enable / disable colors in the output (reporters and logs) - colors: true, + // enable / disable colors in the output (reporters and logs) + colors: true, - // level of logging - // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG - logLevel: config.LOG_INFO, + // level of logging + // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG + logLevel: config.LOG_INFO, - // enable / disable watching file and executing tests whenever any file changes - autoWatch: false, + // enable / disable watching file and executing tests whenever any file changes + autoWatch: false, - // start these browsers - // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher - browsers: ['PhantomJS'], + // start these browsers + // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher + browsers: ['PhantomJS'], - // Continuous Integration mode - // if true, Karma captures browsers, runs the tests and exits - singleRun: true - }); -}; + // Continuous Integration mode + // if true, Karma captures browsers, runs the tests and exits + singleRun: true + }); +}; \ No newline at end of file diff --git a/package.json b/package.json index 1dd3488..d0d135f 100644 --- a/package.json +++ b/package.json @@ -1,60 +1,60 @@ { - "name": "semantic-ui-angular", - "version": "0.0.0", - "description": "Pure AngularJS directives to support Semantic-UI components", - "main": "index.js", - "scripts": { - "postinstall": "node_modules/.bin/tsd install", - "test": "node_modules/karma/bin/karma start", - "test-dev": "./node_modules/karma/bin/karma start --auto-watch --no-single-run", - "build": "rimraf dist && webpack", - "start": "webpack-dev-server --inline --progress --port 8080" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/Semantic-Org/Semantic-UI-Angular" - }, - "keywords": [ - "angularjs", - "semantic-ui", - "directives", - "components", - "typescript" - ], - "author": "", - "license": "MIT", - "bugs": { - "url": "https://github.com/Semantic-Org/Semantic-UI-Angular/issues" - }, - "homepage": "https://github.com/Semantic-Org/Semantic-UI-Angular#readme", - "devDependencies": { - "angular": "1.4.8", - "angular-mocks": "1.4.8", - "cz-conventional-changelog": "^1.1.5", - "jasmine-core": "2.4.1", - "jquery": "2.2.0", - "jscs": "2.8.0", - "jscs-loader": "0.2.0", - "json-loader": "0.5.4", - "karma": "0.13.19", - "karma-jasmine": "0.3.6", - "karma-phantomjs-launcher": "0.2.3", - "karma-sourcemap-loader": "0.3.6", - "karma-webpack": "1.7.0", - "phantomjs": "1.9.19", - "phantomjs-polyfill": "0.0.1", - "rimraf": "^2.5.4", - "ts-loader": "0.7.2", - "tsd": "0.6.5", - "tslint": "3.2.1", - "tslint-loader": "2.1.0", - "typescript": "1.7.5", - "webpack": "1.12.10", - "webpack-dev-server": "^1.16.2" - }, - "config": { - "commitizen": { - "path": "./node_modules/cz-conventional-changelog" + "name": "semantic-ui-angular", + "version": "0.0.0", + "description": "Pure AngularJS directives to support Semantic-UI components", + "main": "index.js", + "scripts": { + "postinstall": "node_modules/.bin/tsd install", + "test": "karma start", + "test-dev": "karma start --auto-watch --no-single-run", + "build": "rimraf dist && webpack", + "start": "webpack-dev-server --inline --progress --port 8080" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/Semantic-Org/Semantic-UI-Angular" + }, + "keywords": [ + "angularjs", + "semantic-ui", + "directives", + "components", + "typescript" + ], + "author": "", + "license": "MIT", + "bugs": { + "url": "https://github.com/Semantic-Org/Semantic-UI-Angular/issues" + }, + "homepage": "https://github.com/Semantic-Org/Semantic-UI-Angular#readme", + "devDependencies": { + "angular": "1.6.1", + "angular-mocks": "1.6.1", + "cz-conventional-changelog": "^1.1.5", + "jasmine-core": "2.5.2", + "jquery": "3.1.1", + "jscs": "3.0.7", + "jscs-loader": "0.3.0", + "json-loader": "0.5.4", + "karma": "1.3.0", + "karma-jasmine": "1.1.0", + "karma-phantomjs-launcher": "1.0.2", + "karma-sourcemap-loader": "0.3.7", + "karma-webpack": "1.8.1", + "phantomjs": "2.1.7", + "phantomjs-polyfill": "0.0.2", + "rimraf": "^2.5.4", + "ts-loader": "1.3.3", + "tsd": "0.6.5", + "tslint": "4.2.0", + "tslint-loader": "3.3.0", + "typescript": "2.1.4", + "webpack": "1.14.0", + "webpack-dev-server": "^1.16.2" + }, + "config": { + "commitizen": { + "path": "./node_modules/cz-conventional-changelog" + } } - } -} +} \ No newline at end of file From c1ed9da603f06e73c4caa56d26a98703ee02ee61 Mon Sep 17 00:00:00 2001 From: Igor K Date: Tue, 27 Dec 2016 14:59:42 +0200 Subject: [PATCH 5/5] added specs for accordion --- index.html | 94 +------------ src/modules/accordion/accordion.spec.ts | 180 ++++++++++++++++++++++++ 2 files changed, 182 insertions(+), 92 deletions(-) create mode 100644 src/modules/accordion/accordion.spec.ts diff --git a/index.html b/index.html index 319a24e..dfcc3bd 100644 --- a/index.html +++ b/index.html @@ -12,7 +12,8 @@ - + + Level 1 @@ -79,97 +80,6 @@ -
- - - -
- Level 1 -
-
- Welcome to level 1 -
-
- Level 1A -
-
-

Level 1A Contents

-
-
- Level 1A-A -
-
- Level 1A-A Contents -
-
- Level 1A-B -
-
- Level 1A-B Contents -
-
-
-
- Level 1B -
-
- Level 1B Contents -
-
- Level 1C -
-
- Level 1C Contents -
-
-
-
- Level 2 -
-
-

Welcome to level 2

-
-
- Level 2A -
-
-

Level 2A Contents

-
-
- Level 2A-A -
-
- Level 2A-A Contents -
-
- Level 2A-B -
-
- Level 2A-B Contents -
-
-
-
- Level 2B -
-
- Level 2B Contents -
-
- Level 2C -
-
- Level 2C Contents -
-
-
- - - - - \ No newline at end of file diff --git a/src/modules/accordion/accordion.spec.ts b/src/modules/accordion/accordion.spec.ts new file mode 100644 index 0000000..bde5f1f --- /dev/null +++ b/src/modules/accordion/accordion.spec.ts @@ -0,0 +1,180 @@ +/// +/// + +import { smAccordionModule } from './accordion.module'; + +describe('Semantic-UI: Components - smAccordion', function () { + 'use strict'; + + let $scope, $compile, element, settings; + + beforeEach(angular.mock.module(smAccordionModule.name)); + + beforeEach(inject(function ($rootScope, $injector, smAccordionSettings) { + $scope = $rootScope.$new(); + $compile = $injector.get('$compile'); + element = $compile(template)($scope); + settings = smAccordionModule; + $scope.$digest(); + })); + + it('expected elements length', function () { + expect(element.find('.title').length).toBe(8); + expect(element.find('.content').length).toBe(8); + }); + + it('no one active by default', function () { + expect(element.find('.active').length).toBe(0); + }); + + it('all title have icon', function () { + expect(element.find('.title:first').children('i.icon').length).toBe(1); + }); + + + it('open first group', function () { + var firstTitle = element.find('.title:first'); + firstTitle.click(); + $scope.$digest(); + + expect(firstTitle.hasClass('active')).toBe(true); + expect(firstTitle.next().hasClass('active')).toBe(true); + + var activeTitle = element.find('.title.active'); + expect(activeTitle.length > 0).toBe(true); + activeTitle.click(); + $scope.$digest(); + expect(element.find('.title.active').length).toBe(0); + expect(element.find('.content.active').length).toBe(0); + + }); + + it('exclusive setting', function () { + var firstTitle = element.find('.title:first'); + var lastTitle = element.find('.title:last'); + firstTitle.click(); + $scope.$digest(); + + expect(firstTitle.hasClass('active')).toBe(true); + expect(firstTitle.next().hasClass('active')).toBe(true); + + lastTitle.click(); + $scope.$digest(); + + expect(firstTitle.hasClass('active')).toBe(false); + expect(firstTitle.next().hasClass('active')).toBe(false); + expect(lastTitle.hasClass('active')).toBe(true); + expect(lastTitle.next().hasClass('active')).toBe(true); + + }); + +}); + +describe('Semantic-UI: Components - smAccordion - Custom Settings', function () { + 'use strict'; + + let $scope, $compile, element; + let settings = { + exclusive: false + } + + beforeEach(angular.mock.module(smAccordionModule.name)); + + beforeEach(inject(function ($rootScope, $injector, smAccordionSettings) { + $scope = $rootScope.$new(); + $compile = $injector.get('$compile'); + element = $compile(template)($scope); + angular.extend(smAccordionSettings, settings); + $scope.$digest(); + })); + + + + it('exclusive setting is false', function () { + var firstTitle = element.find('.title:first'); + var lastTitle = element.find('.title:last'); + firstTitle.click(); + $scope.$digest(); + + expect(firstTitle.hasClass('active')).toBe(true); + expect(firstTitle.next().hasClass('active')).toBe(true); + + lastTitle.click(); + $scope.$digest(); + + expect(firstTitle.hasClass('active')).toBe(true); + expect(firstTitle.next().hasClass('active')).toBe(true); + expect(lastTitle.hasClass('active')).toBe(true); + expect(lastTitle.next().hasClass('active')).toBe(true); + + }); + +}); + + +var template = ` + + + Level 1 + + +

Welcome to level 1

+ + + + Level 1A + + + + Level 1A Contents + + + + + Level 1A-A + + + Level 1A-A Contents + + + + Level 1A-B + + + Level 1A-B Contents + + + + + + + Level 1B + + + Level 1B Contents + + + + Level 1C + + + Level 1C Contents + + + + + + + Level 2 + + +

Welcome to level 2

+ + + + Level 3 + + +

Welcome to level 3

+ + `; \ No newline at end of file