-
-
-
-
-
-
-
-
-
- angular.module('patternfly.tableview.demo', ['patternfly.views','patternfly.table']);
-
-
-
- angular.module('patternfly.tableview.demo').controller('TableCtrl', ['$scope', '$timeout', 'itemsService',
- function ($scope, $timeout, itemsService) {
- $scope.dtOptions = {
- // order column(s) should NOT account for 1st checkbox column, table component will adjust col. numbers accordingly
- // Sort by City, then Name
- order: [[3, "asc"], [1, "desc"]],
- };
-
- $scope.columns = [
- { header: "Status", itemField: "status", htmlTemplate: "status_template.html" },
- { header: "Name", itemField: "name", htmlTemplate: "name_template.html", colActionFn: onNameClick },
- { header: "Address", itemField: "address"},
- { header: "City", itemField: "city", templateFn: function(value, item) { return '' + value + '' } },
- { header: "State", itemField: "state"}
- ];
-
- $scope.items = null;
-
- $scope.eventText = "";
-
- $scope.config = {
- onCheckBoxChange: handleCheckBoxChange,
- selectionMatchProp: "name",
- itemsAvailable: true,
- showCheckboxes: true
- };
-
- var performEmptyStateAction = function (action) {
- $scope.eventText = action.name + "\r\n" + $scope.eventText;
- };
-
- $scope.emptyStateConfig = {
- icon: 'pficon-warning-triangle-o',
- title: 'No Items Available',
- info: "This is the Empty State component. The goal of a empty state pattern is to provide a good first impression that helps users to achieve their goals. It should be used when a view is empty because no objects exists and you want to guide the user to perform specific actions.",
- helpLink: {
- label: 'For more information please see',
- urlLabel: 'pfExample',
- url : '#/api/patternfly.views.directive:pfEmptyState'
- }
- };
-
- $scope.emptyStateActionButtons = [
- {
- name: 'Main Action',
- title: 'Perform an action',
- actionFn: performEmptyStateAction,
- type: 'main'
- },
- {
- name: 'Secondary Action 1',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- },
- {
- name: 'Secondary Action 2',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- },
- {
- name: 'Secondary Action 3',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- }
- ];
-
- function handleCheckBoxChange (item) {
- $scope.eventText = item.name + ' checked: ' + item.selected + '\r\n' + $scope.eventText;
- };
-
- var performAction = function (action, item) {
- $scope.eventText = item.name + " : " + action.name + "\r\n" + $scope.eventText;
- };
-
- function onNameClick (name) {
- $scope.eventText = "You clicked on " + name + "\n" + $scope.eventText;
- }
-
- $scope.actionButtons = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- }
- ];
-
- $scope.menuActions = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performAction
- },
- {
- name: 'Grouped Action 2',
- title: 'Do something similar',
- actionFn: performAction
- }
- ];
-
- $scope.showComponent = true;
-
- $scope.addNewComponentToDOM = function () {
- $scope.showComponent = false;
- $timeout(() => $scope.showComponent = true);
- };
-
- (function init() {
- itemsService.getItems()
- .then(items => $scope.items = items);
- })();
- }
- ]);
-
-
-
- angular.module('patternfly.tableview.demo').service('itemsService', ['$q', function($q) {
-
- this.getItems = function() {
- return $q((resolve, reject) => {
- setTimeout(function() {
- let items = [
- {
- status: "error",
- name: "Fred Flintstone",
- address: "20 Dinosaur Way",
- city: "Bedrock",
- state: "Washingstone"
- },
- {
- status: "error",
- name: "John Smith",
- address: "415 East Main Street",
- city: "Norfolk",
- state: "Virginia",
- },
- {
- status: "warning",
- name: "Frank Livingston",
- address: "234 Elm Street",
- city: "Pittsburgh",
- state: "Pennsylvania"
- },
- {
- status: "ok",
- name: "Linda McGovern",
- address: "22 Oak Street",
- city: "Denver",
- state: "Colorado"
- },
- {
- status: "error",
- name: "Jim Brown",
- address: "72 Bourbon Way",
- city: "Nashville",
- state: "Tennessee"
- },
- {
- status: "ok",
- name: "Holly Nichols",
- address: "21 Jump Street",
- city: "Hollywood",
- state: "California"
- },
- {
- status: "error",
- name: "Marie Edwards",
- address: "17 Cross Street",
- city: "Boston",
- state: "Massachusetts"
- },
- {
- status: "ok",
- name: "Pat Thomas",
- address: "50 Second Street",
- city: "New York",
- state: "New York"
- },
- {
- status: "warning",
- name: "Mike Bird",
- address: "50 Forth Street",
- city: "New York",
- state: "New York"
- },
- {
- status: "error",
- name: "Cheryl Taylor",
- address: "2 Main Street",
- city: "New York",
- state: "New York"
- },
- {
- status: "ok",
- name: "Ren DiLorenzo",
- address: "10 Chase Lane",
- city: "Boston",
- state: "Massacusetts"
- },
- {
- status: "ok",
- name: "Kim Livingston",
- address: "5 Tree Hill Lane",
- city: "Boston",
- state: "Massacusetts"
- }
- ];
- resolve(items);
- }, 10);
- });
- }
-
- }]);
-
-
-
-*/
diff --git a/src/table/tableview/examples/table-view-with-toolbar.js b/src/table/tableview/examples/table-view-with-toolbar.js
deleted file mode 100644
index bdeb0f3b1..000000000
--- a/src/table/tableview/examples/table-view-with-toolbar.js
+++ /dev/null
@@ -1,597 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.table.directive:pfTableView-with-Toolbar
- *
- * @description
- * Example configuring a table view with a toolbar.
- * Please see {@link patternfly.toolbars.directive:pfToolbar pfToolbar} for use in Toolbar View Switcher
- *
- * @param {object} config Optional configuration object
- *
- * .selectionMatchProp - (string) Property of the items to use for determining matching, default is 'uuid'
- * .onCheckBoxChange - ( function(item) ) Called to notify when a checkbox selection changes, default is none
- * .itemsAvailable - (boolean) If 'false', displays the {@link patternfly.views.directive:pfEmptyState Empty State} component.
- * .showCheckboxes - (boolean) Show checkboxes for row selection, default is true
- *
- * @param {object} dtOptions Optional angular-datatables DTOptionsBuilder configuration object. Note: paginationType, displayLength, and dom:"p" are no longer being used for pagination, but are allowed for backward compatibility.
- * Please switch to prefered 'pageConfig' settings for pf pagination controls.
- * Other dtOptions can still be used, such as 'order' See {@link http://l-lin.github.io/angular-datatables/archives/#/api angular-datatables: DTOptionsBuilder}
- * @param {object} pageConfig Optional pagination configuration object. Since all properties are optional it is ok to specify: 'pageConfig = {}' to indicate that you want to
- * use pagination with the default parameters.
- *
- * .pageNumber - (number) Optional Initial page number to display. Default is page 1.
- * .pageSize - (number) Optional Initial page size/display length to use. Ie. Number of "Items per Page". Default is 10 items per page
- * .pageSizeIncrements - (Array[Number]) Optional Page size increments for the 'per page' dropdown. If not specified, the default values are: [5, 10, 20, 40, 80, 100]
- *
- * @param {array} items Array of items to display in the table view.
- * @param {array} columns Array of table column information to display in the table's header row and optionaly render the cells of a column.
- *
- *
Tip: For templating, use `tempateFn` unless you really need to use AngularJS directives. `templateFn` performs better than `htmlTemplate`.
- * @param {array} actionButtons List of action buttons in each row
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .actionFn - (function(action)) Function to invoke when the action selected
- *
- * @param {array} menuActions List of actions for dropdown menu in each row
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .actionFn - (function(action)) Function to invoke when the action selected
- *
- * @param {object} emptyStateConfig Optional configuration settings for the empty state component. See the {@link patternfly.views.directive:pfEmptyState Empty State} component
- * @param {array} emptyStateActionButtons Optional buttons to display under the icon, title, and informational paragraph. See the {@link patternfly.views.directive:pfEmptyState Empty State} component
- * @example
-
-
-
-
-
-
-
-
-
- Actions:
-
-
-
-
-
-
-
-
-
-
-
- angular.module('patternfly.tableview.demo', ['patternfly.toolbars','patternfly.table']);
-
-
-
- angular.module('patternfly.tableview.demo').controller('ViewCtrl', ['$scope', '$timeout', 'pfViewUtils', '$filter',
- function ($scope, $timeout, pfViewUtils, $filter) {
- $scope.actionsText = "";
-
- $scope.columns = [
- {
- header: "Status",
- itemField: "status",
- htmlTemplate: "status_template.html"
- },
- {
- header: "Name",
- itemField: "name",
- htmlTemplate: "name_template.html",
- colActionFn: onNameClick
- },
- {
- header: "Age",
- itemField: "age",
- templateFn: function(value) {
- var className = value > 30 ? 'text-success' : 'text-warning';
- return '' + value + ' ';
- }
- },
- {
- header: "Address",
- itemField: "address",
- htmlTemplate: "address_template.html"
- },
- {
- header: "BirthMonth",
- itemField: "birthMonth"
- }
- ];
-
- // dtOptions paginationType, displayLength, and dom:"p" are no longer being
- // used, but are allowed for backward compatibility.
- // Please switch to prefered 'pageConfig' settings for pf pagination controls
- // Other dtOptions can still be used, such as 'order'
- // $scope.dtOptions = {
- // paginationType: 'full',
- // displayLength: 10,
- // dom: "tp"
- // }
-
- // New pagination config settings
- $scope.pageConfig = {
- pageNumber: 1,
- pageSize: 10,
- pageSizeIncrements: [5, 10, 15]
- };
-
- $scope.allItems = [
- {
- status: "error",
- name: "Fred Flintstone",
- age: 57,
- address: "20 Dinosaur Way, Bedrock, Washingstone",
- birthMonth: 'February'
- },
- {
- status: "ok",
- name: "John Smith",
- age: 23,
- address: "415 East Main Street, Norfolk, Virginia",
- birthMonth: 'October'
- },
- {
- status: "warning",
- name: "Frank Livingston",
- age: 71,
- address: "234 Elm Street, Pittsburgh, Pennsylvania",
- birthMonth: 'March'
- },
- {
- status: "ok",
- name: "Judy Green",
- age: 21,
- address: "2 Apple Boulevard, Cincinatti, Ohio",
- birthMonth: 'December'
- },
- {
- status: "ok",
- name: "Pat Thomas",
- age: 19,
- address: "50 Second Street, New York, New York",
- birthMonth: 'February'
- },
- {
- status: "error",
- name: "Linda McGovern",
- age: 32,
- address: "22 Oak Stree, Denver, Colorado",
- birthMonth: 'March'
- },
- {
- status: "warning",
- name: "Jim Brown",
- age: 55,
- address: "72 Bourbon Way. Nashville. Tennessee",
- birthMonth: 'March'
- },
- {
- status: "ok",
- name: "Holly Nichols",
- age: 34,
- address: "21 Jump Street, Hollywood, California",
- birthMonth: 'March'
- },
- {
- status: "ok",
- name: "Wilma Flintstone",
- age: 47,
- address: "20 Dinosaur Way, Bedrock, Washingstone",
- birthMonth: 'February'
- },
- {
- status: "warning",
- name: "Jane Smith",
- age: 22,
- address: "415 East Main Street, Norfolk, Virginia",
- birthMonth: 'April'
- },
- {
- status: "error",
- name: "Liz Livingston",
- age: 65,
- address: "234 Elm Street, Pittsburgh, Pennsylvania",
- birthMonth: 'November'
- },
- {
- status: "ok",
- name: "Jim Green",
- age: 23,
- address: "2 Apple Boulevard, Cincinatti, Ohio",
- birthMonth: 'January'
- },
- {
- status: "ok",
- name: "Chris Thomas",
- age: 21,
- address: "50 Second Street, New York, New York",
- birthMonth: 'October'
- },
- {
- status: "error",
- name: "Larry McGovern",
- age: 34,
- address: "22 Oak Stree, Denver, Colorado",
- birthMonth: 'September'
- },
- {
- status: "warning",
- name: "July Brown",
- age: 51,
- address: "72 Bourbon Way. Nashville. Tennessee",
- birthMonth: 'May'
- },
- {
- status: "error",
- name: "Henry Nichols",
- age: 36,
- address: "21 Jump Street, Hollywood, California",
- birthMonth: 'March'
- }
- ];
-
- $scope.items = $scope.allItems;
-
- var matchesFilter = function (item, filter) {
- var match = true;
-
- if (filter.id === 'name') {
- match = item.name.match(filter.value) !== null;
- } else if (filter.id === 'age') {
- match = item.age === parseInt(filter.value);
- } else if (filter.id === 'address') {
- match = item.address.match(filter.value) !== null;
- } else if (filter.id === 'birthMonth') {
- match = item.birthMonth === filter.value;
- } else if (filter.id === 'status') {
- match = item.status === filter.value;
- }
- return match;
- };
-
- var matchesFilters = function (item, filters) {
- var matches = true;
-
- filters.forEach(function(filter) {
- if (!matchesFilter(item, filter)) {
- matches = false;
- return false;
- }
- });
- return matches;
- };
-
- var applyFilters = function (filters) {
- $scope.items = [];
- if (filters && filters.length > 0) {
- $scope.allItems.forEach(function (item) {
- if (matchesFilters(item, filters)) {
- $scope.items.push(item);
- }
- });
- } else {
- $scope.items = $scope.allItems;
- }
- if (filters && (filters.length === 0 || filters.length > 1)) {
- $scope.addNewComponentToDOM();
- }
- };
-
- var filterChange = function (filters) {
- applyFilters(filters);
- $scope.toolbarConfig.filterConfig.resultsCount = $scope.items.length;
- };
-
- var performAction = function (action) {
- var selectedItems = $filter('filter')($scope.allItems, {selected: true});
- if(!selectedItems) {
- selectedItems = [];
- }
- $scope.actionsText = "Toolbar Action: " + action.name + " on " + selectedItems.length + " selected items\n" + $scope.actionsText;
- };
-
- var performTableAction = function (action, item) {
- $scope.actionsText = "Table Row Action on '" + item.name + "' : " + action.name + "\r\n" + $scope.actionsText;
- };
-
- function handleCheckBoxChange (item) {
- var selectedItems = $filter('filter')($scope.allItems, {selected: true});
- if (selectedItems) {
- $scope.toolbarConfig.filterConfig.selectedCount = selectedItems.length;
- }
- }
-
- function onNameClick (name) {
- $scope.actionsText = "You clicked on " + name + "\n" + $scope.actionsText;
- }
-
- $scope.filterConfig = {
- fields: [
- {
- id: 'status',
- title: 'Status',
- placeholder: 'Filter by Status...',
- filterType: 'select',
- filterValues: ['error', 'warning', 'ok']
- },
- {
- id: 'name',
- title: 'Name',
- placeholder: 'Filter by Name...',
- filterType: 'text'
- },
- {
- id: 'age',
- title: 'Age',
- placeholder: 'Filter by Age...',
- filterType: 'text'
- },
- {
- id: 'address',
- title: 'Address',
- placeholder: 'Filter by Address...',
- filterType: 'text'
- },
- {
- id: 'birthMonth',
- title: 'Birth Month',
- placeholder: 'Filter by Birth Month...',
- filterType: 'select',
- filterValues: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
- }
- ],
- resultsCount: $scope.items.length,
- totalCount: $scope.allItems.length,
- appliedFilters: [],
- onFilterChange: filterChange
- };
-
- var monthVals = {
- 'January': 1,
- 'February': 2,
- 'March': 3,
- 'April': 4,
- 'May': 5,
- 'June': 6,
- 'July': 7,
- 'August': 8,
- 'September': 9,
- 'October': 10,
- 'November': 11,
- 'December': 12
- };
-
- $scope.toolbarActionsConfig = {
- primaryActions: [
- {
- name: 'Action 1',
- title: 'Do the first thing',
- actionFn: performAction
- },
- {
- name: 'Action 2',
- title: 'Do something else',
- actionFn: performAction
- }
- ],
- moreActions: [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performAction
- },
- {
- name: 'Grouped Action 2',
- actionFn: performAction,
- title: 'Do something similar'
- }
- ],
- actionsInclude: true
- };
-
- $scope.toolbarConfig = {
- filterConfig: $scope.filterConfig,
- sortConfig: $scope.sortConfig,
- actionsConfig: $scope.toolbarActionsConfig,
- isTableView: true
- };
-
- $scope.tableConfig = {
- onCheckBoxChange: handleCheckBoxChange,
- selectionMatchProp: "name",
- itemsAvailable: true,
- showCheckboxes: true
- };
-
- $scope.emptyStateConfig = {
- icon: 'pficon-warning-triangle-o',
- title: 'No Items Available',
- info: "This is the Empty State component. The goal of a empty state pattern is to provide a good first impression that helps users to achieve their goals. It should be used when a view is empty because no objects exists and you want to guide the user to perform specific actions.",
- helpLink: {
- label: 'For more information please see',
- urlLabel: 'pfExample',
- url : '#/api/patternfly.views.directive:pfEmptyState'
- }
- };
-
- $scope.tableActionButtons = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performTableAction
- }
- ];
-
- $scope.tableMenuActions = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performTableAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performTableAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performTableAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performTableAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performTableAction
- },
- {
- name: 'Grouped Action 2',
- title: 'Do something similar',
- actionFn: performTableAction
- }
- ];
-
- $scope.updateItemsAvailable = function () {
- if(!$scope.tableConfig.itemsAvailable) {
- $scope.toolbarConfig.filterConfig.resultsCount = 0;
- $scope.toolbarConfig.filterConfig.totalCount = 0;
- $scope.toolbarConfig.filterConfig.selectedCount = 0;
- } else {
- $scope.toolbarConfig.filterConfig.resultsCount = $scope.items.length;
- $scope.toolbarConfig.filterConfig.totalCount = $scope.allItems.length;
- handleCheckBoxChange();
- }
- };
-
- $scope.showComponent = true;
-
- $scope.addNewComponentToDOM = function () {
- $scope.showComponent = false;
- $timeout(() => $scope.showComponent = true);
-
- };
- }
- ]);
-
-
- */
diff --git a/src/table/tableview/table-view.component.js b/src/table/tableview/table-view.component.js
deleted file mode 100644
index 70e0e9629..000000000
--- a/src/table/tableview/table-view.component.js
+++ /dev/null
@@ -1,491 +0,0 @@
-angular.module('patternfly.table').component('pfTableView', {
- bindings: {
- config: '',
- dtOptions: '',
- colummns: '',
- columns: '',
- items: '<',
- actionButtons: '',
- menuActions: '',
- pageConfig: '=?',
- emptyStateConfig: '=?',
- emptyStateActionButtons: '=?'
- },
- templateUrl: 'table/tableview/table-view.html',
- controller: function (DTOptionsBuilder, DTColumnDefBuilder, $element, pfUtils, $log, $filter, $timeout, $sce) {
- 'use strict';
- var ctrl = this, prevDtOptions, prevItems, prevPageConfig, prevShowCheckboxes;
-
- // Once datatables is out of active development I'll remove log statements
- ctrl.debug = false;
-
- ctrl.selectAll = false;
- ctrl.dtInstance = {};
- ctrl.dropdownClass = 'dropdown';
-
- ctrl.defaultDtOptions = {
- autoWidth: false,
- destroy: true,
- order: [[0, "asc"]], //default to 1st (col 0) for sorting, updateConfigOptions() will adjust based on showCheckboxes
- dom: "t",
- paging: false,
- select: {
- selector: 'td:first-child input[type="checkbox"]',
- style: 'multi'
- }
- };
-
- ctrl.defaultConfig = {
- selectionMatchProp: 'uuid',
- onCheckBoxChange: null,
- showCheckboxes: true
- };
-
- function setPagination () {
- if (angular.isUndefined(ctrl.dtOptions)) {
- ctrl.dtOptions = {};
- } else {
- // Switch dtOption pagination properties to new pagination schema
- if (angular.isDefined(ctrl.dtOptions.paginationType)) {
- ctrl.dtOptions.paging = true;
- if (angular.isUndefined(ctrl.pageConfig)) {
- ctrl.pageConfig = {};
- }
- if (!angular.isNumber(ctrl.pageConfig.pageNumber)) {
- ctrl.pageConfig.pageNumber = 1;
- }
- }
- if (angular.isNumber(ctrl.dtOptions.displayLength)) {
- ctrl.dtOptions.paging = true;
- if (angular.isUndefined(ctrl.pageConfig)) {
- ctrl.pageConfig = {};
- }
- if (!angular.isNumber(ctrl.pageConfig.pageSize)) {
- ctrl.pageConfig.pageSize = ctrl.dtOptions.displayLength;
- }
- }
- if (angular.isDefined(ctrl.dtOptions.dom)) {
- if (ctrl.dtOptions.dom.indexOf("p") !== -1) {
- // No longer show angular-datatables pagination controls
- ctrl.dtOptions.dom = ctrl.dtOptions.dom.replace(/p/gi, "");
- }
- }
- }
-
- // Use new paging schema to set dtOptions paging properties
- if (angular.isDefined(ctrl.pageConfig)) {
- ctrl.dtOptions.paging = true;
- ctrl.pageConfig.numTotalItems = ctrl.items.length;
- if (angular.isUndefined(ctrl.pageConfig.pageSize)) {
- ctrl.pageConfig.pageSize = 10;
- }
- ctrl.dtOptions.displayLength = ctrl.pageConfig.pageSize;
- if (angular.isUndefined(ctrl.pageConfig.pageNumber)) {
- ctrl.pageConfig.pageNumber = 1;
- }
- }
- }
-
- ctrl.$onInit = function () {
-
- if (ctrl.debug) {
- $log.debug("$onInit");
- }
-
- if (angular.isDefined(ctrl.colummns) && angular.isUndefined(ctrl.columns)) {
- ctrl.columns = ctrl.colummns;
- }
-
- if (angular.isUndefined(ctrl.config)) {
- ctrl.config = {};
- }
-
- ctrl.updateConfigOptions();
-
- setColumnDefs();
- };
-
- ctrl.updateConfigOptions = function () {
- var props = "";
-
- if (ctrl.debug) {
- $log.debug(" updateConfigOptions");
- }
-
- setPagination();
-
- if (angular.isDefined(ctrl.dtOptions) && angular.isDefined(ctrl.dtOptions.displayLength)) {
- ctrl.dtOptions.displayLength = Number(ctrl.dtOptions.displayLength);
- }
-
- _.defaults(ctrl.dtOptions, ctrl.defaultDtOptions);
- _.defaults(ctrl.config, ctrl.defaultConfig);
-
- if (ctrl.config.showCheckboxes !== prevShowCheckboxes) {
- // adjust column numbers based on whether or not there is a checkbox column
- // multi-col order may be used. Ex: [[ 0, 'asc' ], [ 1, 'desc' ]]
- _.each(ctrl.dtOptions.order, function (col) {
- col[0] = ctrl.config.showCheckboxes ? col[0] + 1 : col[0] - 1;
- col[0] = col[0] < 0 ? 0 : col[0]; //no negative col numbers
- });
- }
-
- // Need to deep watch changes in dtOptions and items
- prevDtOptions = angular.copy(ctrl.dtOptions);
- prevItems = angular.copy(ctrl.items);
- prevPageConfig = angular.copy(ctrl.pageConfig);
- prevShowCheckboxes = angular.copy(ctrl.config.showCheckboxes);
-
- if (!validSelectionMatchProp()) {
- angular.forEach(ctrl.columns, function (col) {
- if (props.length === 0) {
- props = col.itemField;
- } else {
- props += ", " + col.itemField;
- }
- });
- throw new Error("pfTableView - " +
- "config.selectionMatchProp '" + ctrl.config.selectionMatchProp +
- "' does not match any property in 'config.columns'! Please set config.selectionMatchProp " +
- "to one of these properties: " + props);
- }
- };
-
- ctrl.dtInstanceCallback = function (_dtInstance) {
- if (ctrl.debug) {
- $log.debug("--> dtInstanceCallback");
- }
-
- ctrl.dtInstance = _dtInstance;
- listenForDraw();
- selectRowsByChecked();
- };
-
- ctrl.$onChanges = function (changesObj) {
- if (ctrl.debug) {
- $log.debug("$onChanges");
- }
- if ((changesObj.config && !changesObj.config.isFirstChange()) ) {
- if (ctrl.debug) {
- $log.debug("...updateConfigOptions");
- }
- ctrl.updateConfigOptions();
- }
- if (changesObj.items && changesObj.items.currentValue) {
- ctrl.config.itemsAvailable = changesObj.items.currentValue.length > 0;
- }
- };
-
- ctrl.updatePageSize = function (event) {
- ctrl.pageConfig.pageSize = event.pageSize;
- ctrl.dtOptions.displayLength = ctrl.pageConfig.pageSize;
- ctrl.pageConfig.pageNumber = 1; // goto first page after pageSize/displayLength change
- };
-
- ctrl.updatePageNumber = function (event) {
- if (ctrl.dtInstance) {
- ctrl.pageConfig.pageNumber = event.pageNumber;
- if (ctrl.dtInstance && ctrl.dtInstance.dataTable) {
- ctrl.dtInstance.dataTable.fnPageChange(ctrl.pageConfig.pageNumber - 1);
- }
- }
- };
-
- ctrl.$doCheck = function () {
- if (ctrl.debug) {
- $log.debug("$doCheck");
- }
- // do a deep compare on dtOptions and items
- if (!angular.equals(ctrl.dtOptions, prevDtOptions) ||
- !angular.equals(ctrl.pageConfig, prevPageConfig)) {
- if (ctrl.debug) {
- $log.debug(" dtOptions !== prevDtOptions");
- }
- ctrl.updateConfigOptions();
- }
- if (!angular.equals(ctrl.items, prevItems)) {
- if (ctrl.debug) {
- $log.debug(" items !== prevItems");
- }
- if (ctrl.items) {
- ctrl.config.itemsAvailable = ctrl.items.length > 0;
- }
- if (angular.isDefined(ctrl.pageConfig) && angular.isDefined(ctrl.pageConfig.numTotalItems)) {
- ctrl.pageConfig.numTotalItems = ctrl.items.length;
- }
- prevItems = angular.copy(ctrl.items);
- }
- };
-
- ctrl.$postLink = function () {
- if (ctrl.debug) {
- $log.debug(" $postLink");
- }
- };
-
- ctrl.$onDestroy = function () {
- if (ctrl.debug) {
- $log.debug(" $onDestroy");
- }
- ctrl.dtInstance = {};
- };
-
- function setColumnDefs () {
- var i = 0, actnBtns = 1;
- var offset;
- ctrl.dtColumnDefs = [];
-
- // add checkbox col, not sortable
- if (ctrl.config.showCheckboxes) {
- ctrl.dtColumnDefs.push(DTColumnDefBuilder.newColumnDef(i++).notSortable());
- }
-
- // add column definitions
- _.forEach(ctrl.columns, function (column) {
- ctrl.dtColumnDefs.push(DTColumnDefBuilder.newColumnDef(i++));
- });
-
- // Determine selectionMatchProp column number (add offset due to the checkbox column)
- offset = ctrl.config.showCheckboxes ? 1 : 0;
- ctrl.selectionMatchPropColNum = _.findIndex(ctrl.columns, ['itemField', ctrl.config.selectionMatchProp]) + offset;
-
- // add actions col.
- if (ctrl.actionButtons && ctrl.actionButtons.length > 0) {
- for (actnBtns = 1; actnBtns <= ctrl.actionButtons.length; actnBtns++) {
- ctrl.dtColumnDefs.push(DTColumnDefBuilder.newColumnDef(i++).notSortable());
- }
- }
- if (ctrl.menuActions && ctrl.menuActions.length > 0) {
- ctrl.dtColumnDefs.push(DTColumnDefBuilder.newColumnDef(i++).notSortable());
- }
- }
-
- function listenForDraw () {
- var oTable;
- var dtInstance = ctrl.dtInstance;
-
- if (dtInstance && dtInstance.dataTable) {
- oTable = dtInstance.dataTable;
- if (angular.isDefined(ctrl.pageConfig) && angular.isDefined(ctrl.pageConfig.pageNumber)) {
- oTable.fnPageChange(ctrl.pageConfig.pageNumber - 1);
- }
- ctrl.tableId = oTable[0].id;
- oTable.off('draw.dt');
- oTable.on('draw.dt', function () {
- if (ctrl.debug) {
- $log.debug("--> redraw");
- }
- selectRowsByChecked();
- });
- }
- }
-
- function validSelectionMatchProp () {
- return _.find(ctrl.columns, ['itemField', ctrl.config.selectionMatchProp]) !== undefined;
- }
-
- /*
- * Checkbox Selections
- */
-
- ctrl.toggleAll = function () {
- var item;
- var visibleRows = getVisibleRows();
- angular.forEach(visibleRows, function (row) {
- item = getItemFromRow(row);
- if (item.selected !== ctrl.selectAll) {
- item.selected = ctrl.selectAll;
- if (ctrl.config && ctrl.config.onCheckBoxChange) {
- ctrl.config.onCheckBoxChange(item);
- }
- }
- });
- selectRowsByChecked();
- };
-
- ctrl.toggleOne = function (item) {
- if (ctrl.config && ctrl.config.onCheckBoxChange) {
- ctrl.config.onCheckBoxChange(item);
- }
- };
-
- function getItemFromRow (matchPropValue) {
- return _.find(ctrl.items, function (item) {
- return _.toString(item[ctrl.config.selectionMatchProp]) === _.toString(matchPropValue);
- });
- }
-
- function selectRowsByChecked () {
- if (ctrl.config.showCheckboxes) {
- $timeout(function () {
- var oTable, rows, checked;
-
- oTable = ctrl.dtInstance.DataTable;
-
- if (ctrl.debug) {
- $log.debug(" selectRowsByChecked");
- }
-
- if (angular.isUndefined(oTable)) {
- return;
- }
-
- if (ctrl.debug) {
- $log.debug(" ...oTable defined");
- }
-
- // deselect all
- rows = oTable.rows();
- rows.deselect();
-
- // select those with checked checkboxes
- rows = oTable.rows( function ( idx, data, node ) {
- // row td input type=checkbox
- checked = node.children[0].children[0].checked;
- return checked;
- });
-
- if (ctrl.debug) {
- $log.debug(" ... #checkedRows = " + rows[0].length);
- }
-
- if (rows[0].length > 0) {
- rows.select();
- }
- setSelectAllCheckbox();
- });
- }
- }
-
- function setSelectAllCheckbox () {
- var numVisibleRows, numCheckedRows;
-
- if (ctrl.debug) {
- $log.debug(" setSelectAllCheckbox");
- }
-
- numVisibleRows = getVisibleRows().length;
- numCheckedRows = document.querySelectorAll("#" + ctrl.tableId + " tbody tr.even.selected").length +
- document.querySelectorAll("#" + ctrl.tableId + " tbody tr.odd.selected").length;
- ctrl.selectAll = (numVisibleRows === numCheckedRows);
- }
-
- function getVisibleRows () {
- // Returns an array of visible 'selectionMatchProp' values
- // Ex. if selectionMatchProp === 'name' & selectionMatchPropColNum === 1 &
- // page length === 3
- // returns ['Mary Jane', 'Fred Flinstone', 'Frank Livingston']
- //
- var i, rowData, visibleRows = [];
-
- var anNodes = document.querySelectorAll("#" + ctrl.tableId + " tbody tr");
-
- for (i = 0; i < anNodes.length; ++i) {
- rowData = anNodes[i].cells;
- if (rowData !== null && rowData.length > ctrl.selectionMatchPropColNum) {
- visibleRows.push(_.trim(rowData[ctrl.selectionMatchPropColNum].innerText));
- }
- }
-
- if (ctrl.debug) {
- $log.debug(" getVisibleRows (" + visibleRows.length + ")");
- }
-
- return visibleRows;
- }
-
- /*
- * Action Buttons and Menus
- */
-
- ctrl.handleButtonAction = function (action, item) {
- if (action && action.actionFn) {
- action.actionFn(action, item);
- }
- };
-
- ctrl.handleColAction = function (key, value) {
- var tableCol = $filter('filter')(ctrl.columns, {itemField: key});
-
- if (tableCol && tableCol.length === 1 && tableCol[0].hasOwnProperty('colActionFn')) {
- tableCol[0].colActionFn(value);
- }
- };
-
- ctrl.areActions = function () {
- return (ctrl.actionButtons && ctrl.actionButtons.length > 0) ||
- (ctrl.menuActions && ctrl.menuActions.length > 0);
- };
-
- ctrl.calcActionsColspan = function () {
- var colspan = 0;
-
- if (ctrl.actionButtons && ctrl.actionButtons.length > 0) {
- colspan += ctrl.actionButtons.length;
- }
-
- if (ctrl.menuActions && ctrl.menuActions.length > 0) {
- colspan += 1;
- }
-
- return colspan;
- };
-
- ctrl.handleMenuAction = function (action, item) {
- if (!ctrl.checkDisabled(item) && action && action.actionFn && (action.isDisabled !== true)) {
- action.actionFn(action, item);
- }
- };
-
- ctrl.setupActions = function (item, event) {
- /* Ignore disabled items completely
- if (ctrl.checkDisabled(item)) {
- return;
- }*/
-
- // update the actions based on the current item
- // $scope.updateActions(item);
-
- $timeout(function () {
- var parentDiv = undefined;
- var nextElement;
-
- nextElement = event.target;
- while (nextElement && !parentDiv) {
- if (nextElement.className.indexOf('dropdown-kebab-pf') !== -1) {
- parentDiv = nextElement;
- if (nextElement.className.indexOf('open') !== -1) {
- setDropMenuLocation (parentDiv);
- }
- }
- nextElement = nextElement.parentElement;
- }
- });
- };
-
- ctrl.checkDisabled = function () {
- //TODO: implement checkDisabled
- return false;
- };
-
- function setDropMenuLocation (parentDiv) {
- var dropButton = parentDiv.querySelector('.dropdown-toggle');
- var dropMenu = parentDiv.querySelector('.dropdown-menu');
- var parentRect = $element[0].getBoundingClientRect();
- var buttonRect = dropButton.getBoundingClientRect();
- var menuRect = dropMenu.getBoundingClientRect();
- var menuTop = buttonRect.top - menuRect.height;
- var menuBottom = buttonRect.top + buttonRect.height + menuRect.height;
-
- if ((menuBottom <= parentRect.top + parentRect.height) || (menuTop < parentRect.top)) {
- ctrl.dropdownClass = 'dropdown';
- } else {
- ctrl.dropdownClass = 'dropup';
- }
- }
-
- ctrl.trustAsHtml = function (html) {
- return $sce.trustAsHtml(html);
- };
- }
-});
diff --git a/src/table/tableview/table-view.html b/src/table/tableview/table-view.html
deleted file mode 100644
index 788b0d00f..000000000
--- a/src/table/tableview/table-view.html
+++ /dev/null
@@ -1,65 +0,0 @@
-
diff --git a/src/toolbars/examples/toolbar.js b/src/toolbars/examples/toolbar.js
deleted file mode 100644
index 3f6c60e61..000000000
--- a/src/toolbars/examples/toolbar.js
+++ /dev/null
@@ -1,560 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.toolbars.directive:pfToolbar
- * @restrict E
- *
- * @description
- * Standard toolbar component. Includes filtering and view selection capabilities
- *
- *
- * @param {object} config configuration settings for the toolbar:
- *
- * .filterConfig - (Object) Optional filter config. If undefined, no filtering capabilities are shown.
- * See pfSimpleFilter for filter config options.
- * .sortConfig - (Object) Optional sort config. If undefined, no sort capabilities are shown.
- * See pfSort for sort config options.
- * .viewsConfig - (Object) Optional configuration settings for view type selection
- *
- * .views - (Array) List of available views for selection. See pfViewUtils for standard available views
- *
- * .id - (String) Unique id for the view, used for comparisons
- * .title - (String) Optional title, uses as a tooltip for the view selector
- * .iconClass - (String) Icon class to use for the view selector
- *
- * .onViewSelect - ( function(view) ) Function to call when a view is selected
- * .currentView - the id of the currently selected view
- *
- * .actionsConfig - (Object) Optional configuration settings for toolbar actions
- *
- * .primaryActions - (Array) List of primary actions to display on the toolbar
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .actionFn - (function(action)) Function to invoke when the action selected
- * .isDisabled - (Boolean) set to true to disable the action
- *
- * .moreActions - (Array) List of secondary actions to display on the toolbar action pulldown menu
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .actionFn - (function(action)) Function to invoke when the action selected
- * .isDisabled - (Boolean) set to true to disable the action
- * .isSeparator - (Boolean) set to true if this is a placehodler for a separator rather than an action
- *
- * .actionsInclude - (Boolean) set to true if using the actions transclude to add custom action buttons (only available if using Angular 1.5 or later)
- *
- * .isTableView - (Boolean) set to true if toolbar is only being used with a table view and viewsConfig is not defined.
- *
- *
- * @example
-
-
-
-
-
-
-
-
- Menu Action
-
-
-
-
-
-
- Add Action
-
-
-
-
-
-
-
-
- {{item.name}}
-
-
- {{item.address}}
-
-
-
-
- {{item.age}}
-
-
- {{item.birthMonth}}
-
-
-
-
-
-
-
- {{item.name}}
-
-
- {{item.address}}
-
-
- {{item.birthMonth}}
-
-
-
-
-
-
-
- Current Filters:
-
-
-
-
-
- Actions:
-
-
-
-
-
-
-
-
- angular.module('patternfly.toolbars.demo', ['patternfly.toolbars','patternfly.table']);
-
-
-
- angular.module('patternfly.toolbars.demo').controller('ViewCtrl', ['$scope', '$timeout', 'pfViewUtils', '$filter',
- function ($scope, $timeout, pfViewUtils, $filter) {
- $scope.filtersText = '';
- $scope.showPagination = false;
-
- $scope.columns = [
- { header: "Name", itemField: "name" },
- { header: "Age", itemField: "age"},
- { header: "Address", itemField: "address" },
- { header: "BirthMonth", itemField: "birthMonth"}
- ];
-
- $scope.allItems = [
- {
- name: "Fred Flintstone",
- age: 57,
- address: "20 Dinosaur Way, Bedrock, Washingstone",
- birthMonth: 'February'
- },
- {
- name: "John Smith",
- age: 23,
- address: "415 East Main Street, Norfolk, Virginia",
- birthMonth: 'October'
- },
- {
- name: "Frank Livingston",
- age: 71,
- address: "234 Elm Street, Pittsburgh, Pennsylvania",
- birthMonth: 'March'
- },
- {
- name: "Judy Green",
- age: 21,
- address: "2 Apple Boulevard, Cincinatti, Ohio",
- birthMonth: 'December'
- },
- {
- name: "Pat Thomas",
- age: 19,
- address: "50 Second Street, New York, New York",
- birthMonth: 'February'
- },
- {
- name: "Linda McGovern",
- age: 32,
- address: "22 Oak Stree, Denver, Colorado",
- birthMonth: 'March'
- },
- {
- name: "Jim Brown",
- age: 55,
- address: "72 Bourbon Way. Nashville. Tennessee",
- birthMonth: 'March'
- },
- {
- name: "Holly Nichols",
- age: 34,
- address: "21 Jump Street, Hollywood, California",
- birthMonth: 'March'
- },
- {
- name: "Chris Thomas",
- age: 21,
- address: "50 Second Street, New York, New York",
- birthMonth: 'April'
- },
- {
- name: "Jeff McGovern",
- age: 30,
- address: "22 Oak Stree, Denver, Colorado",
- birthMonth: 'November'
- },
- {
- name: "Jessica Brown",
- age: 50,
- address: "72 Bourbon Way. Nashville. Tennessee",
- birthMonth: 'January'
- },
- {
- name: "Dave Nichols",
- age: 32,
- address: "21 Jump Street, Hollywood, California",
- birthMonth: 'June'
- }
- ];
- $scope.items = $scope.allItems;
-
- var matchesFilter = function (item, filter) {
- var match = true;
- var re = new RegExp(filter.value, 'i');
-
- if (filter.id === 'name') {
- match = item.name.match(re) !== null;
- } else if (filter.id === 'age') {
- match = item.age === parseInt(filter.value);
- } else if (filter.id === 'address') {
- match = item.address.match(re) !== null;
- } else if (filter.id === 'birthMonth') {
- match = item.birthMonth === filter.value;
- }
- return match;
- };
-
- var matchesFilters = function (item, filters) {
- var matches = true;
-
- filters.forEach(function(filter) {
- if (!matchesFilter(item, filter)) {
- matches = false;
- return false;
- }
- });
- return matches;
- };
-
- var applyFilters = function (filters) {
- $scope.items = [];
- if (filters && filters.length > 0) {
- $scope.allItems.forEach(function (item) {
- if (matchesFilters(item, filters)) {
- $scope.items.push(item);
- }
- });
- } else {
- $scope.items = $scope.allItems;
- }
- };
-
- var clearFilters = function() {
- filterChange([]);
- $scope.filterConfig.appliedFilters = [];
- };
-
- var filterChange = function (filters) {
- $scope.filtersText = "";
- filters.forEach(function (filter) {
- $scope.filtersText += filter.title + " : " + filter.value + "\n";
- });
- applyFilters(filters);
- $scope.toolbarConfig.filterConfig.resultsCount = $scope.items.length;
- };
-
- $scope.filterConfig = {
- fields: [
- {
- id: 'name',
- title: 'Name',
- placeholder: 'Filter by Name...',
- filterType: 'text'
- },
- {
- id: 'age',
- title: 'Age',
- placeholder: 'Filter by Age...',
- filterType: 'text'
- },
- {
- id: 'address',
- title: 'Address',
- placeholder: 'Filter by Address...',
- filterType: 'text'
- },
- {
- id: 'birthMonth',
- title: 'Birth Month',
- placeholder: 'Filter by Birth Month...',
- filterType: 'select',
- filterValues: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
- }
- ],
- resultsCount: $scope.items.length,
- totalCount: $scope.allItems.length,
- appliedFilters: [],
- onFilterChange: filterChange
- };
-
- var viewSelected = function(viewId) {
- $scope.viewType = viewId;
- $scope.sortConfig.show = ($scope.viewType !== "tableView");
- };
-
- $scope.viewsConfig = {
- views: [pfViewUtils.getListView(), pfViewUtils.getCardView(), pfViewUtils.getTableView()],
- onViewSelect: viewSelected
- };
-
- $scope.viewsConfig.currentView = $scope.viewsConfig.views[0].id;
- $scope.viewType = $scope.viewsConfig.currentView;
-
- var monthVals = {
- 'January': 1,
- 'February': 2,
- 'March': 3,
- 'April': 4,
- 'May': 5,
- 'June': 6,
- 'July': 7,
- 'August': 8,
- 'September': 9,
- 'October': 10,
- 'November': 11,
- 'December': 12
- };
- var compareFn = function(item1, item2) {
- var compValue = 0;
- if ($scope.sortConfig.currentField.id === 'name') {
- compValue = item1.name.localeCompare(item2.name);
- } else if ($scope.sortConfig.currentField.id === 'age') {
- compValue = item1.age - item2.age;
- } else if ($scope.sortConfig.currentField.id === 'address') {
- compValue = item1.address.localeCompare(item2.address);
- } else if ($scope.sortConfig.currentField.id === 'birthMonth') {
- compValue = monthVals[item1.birthMonth] - monthVals[item2.birthMonth];
- }
-
- if (!$scope.sortConfig.isAscending) {
- compValue = compValue * -1;
- }
-
- return compValue;
- };
-
- var sortChange = function (sortId, isAscending) {
- $scope.items.sort(compareFn);
- };
-
- $scope.sortConfig = {
- fields: [
- {
- id: 'name',
- title: 'Name',
- sortType: 'alpha'
- },
- {
- id: 'age',
- title: 'Age',
- sortType: 'numeric'
- },
- {
- id: 'address',
- title: 'Address',
- sortType: 'alpha'
- },
- {
- id: 'birthMonth',
- title: 'Birth Month',
- sortType: 'alpha'
- }
- ],
- onSortChange: sortChange
- };
-
- $scope.actionsText = "";
- var performAction = function (action) {
- $scope.actionsText = action.name + "\n" + $scope.actionsText;
- };
-
- $scope.actionsConfig = {
- primaryActions: [
- {
- name: 'Action 1',
- title: 'Do the first thing',
- actionFn: performAction
- },
- {
- name: 'Action 2',
- title: 'Do something else',
- actionFn: performAction
- }
- ],
- moreActions: [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performAction
- },
- {
- name: 'Grouped Action 2',
- actionFn: performAction,
- title: 'Do something similar'
- }
- ],
- actionsInclude: true
- };
-
- $scope.toolbarConfig = {
- viewsConfig: $scope.viewsConfig,
- filterConfig: $scope.filterConfig,
- sortConfig: $scope.sortConfig,
- actionsConfig: $scope.actionsConfig
- };
-
- $scope.listConfig = {
- selectionMatchProp: 'name',
- checkDisabled: false,
- itemsAvailable: true,
- onCheckBoxChange: handleCheckBoxChange
- };
-
- $scope.emptyStateConfig = {
- icon: 'pficon-warning-triangle-o',
- title: 'No Items Available',
- info: "This is the Empty State component. The goal of a empty state pattern is to provide a good first impression that helps users to achieve their goals. It should be used when a view is empty because no objects exists and you want to guide the user to perform specific actions.",
- helpLink: {
- label: 'For more information please see',
- urlLabel: 'pfExample',
- url : '#/api/patternfly.views.directive:pfEmptyState'
- }
- };
-
- $scope.noItemsConfig = {
- title: 'No Results Match the Filter Criteria',
- info: 'The active filters are hiding all items.',
- helpLink: {
- urlLabel: 'Clear All Filters',
- urlAction: clearFilters
- }
- };
-
- $scope.tableConfig = {
- onCheckBoxChange: handleCheckBoxChange,
- selectionMatchProp: "name",
- itemsAvailable: true
- };
-
- $scope.doAdd = function () {
- $scope.actionsText = "Add Action\n" + $scope.actionsText;
- };
-
- $scope.optionSelected = function (option) {
- $scope.actionsText = "Option " + option + " selected\n" + $scope.actionsText;
- };
-
- $scope.updateItemsAvailable = function () {
- $scope.tableConfig.itemsAvailable = $scope.listConfig.itemsAvailable;
- if(!$scope.listConfig.itemsAvailable) {
- $scope.toolbarConfig.filterConfig.resultsCount = 0;
- $scope.toolbarConfig.filterConfig.totalCount = 0;
- $scope.toolbarConfig.filterConfig.selectedCount = 0;
- } else {
- $scope.toolbarConfig.filterConfig.resultsCount = $scope.items.length;
- $scope.toolbarConfig.filterConfig.totalCount = $scope.allItems.length;
- handleCheckBoxChange();
- }
- };
-
- function handleCheckBoxChange (item) {
- var selectedItems = $filter('filter')($scope.allItems, {selected: true});
- if (selectedItems) {
- $scope.toolbarConfig.filterConfig.selectedCount = selectedItems.length;
- }
- }
-
- $scope.togglePagination = function () {
- if ($scope.showPagination) {
- $scope.pageConfig = {
- pageSize: 5
- }
- } else {
- delete $scope.pageConfig;
- }
- $scope.addNewComponentToDOM();
- };
-
- $scope.showComponent = true;
-
- $scope.addNewComponentToDOM = function () {
- $scope.showComponent = false;
- $timeout(() => $scope.showComponent = true);
- };
- }
- ]);
-
-
- */
diff --git a/src/toolbars/toolbar-component.js b/src/toolbars/toolbar-component.js
deleted file mode 100644
index 127c08dcd..000000000
--- a/src/toolbars/toolbar-component.js
+++ /dev/null
@@ -1,106 +0,0 @@
-angular.module('patternfly.toolbars').component('pfToolbar', {
- bindings: {
- config: '='
- },
- transclude: {
- 'actions': '?'
- },
- templateUrl: 'toolbars/toolbar.html',
- controller: function () {
- 'use strict';
-
- var ctrl = this;
- var prevConfig;
-
- ctrl.$onInit = function () {
- if (angular.isDefined(ctrl.config.sortConfig) && angular.isUndefined(ctrl.config.sortConfig.show)) {
- // default to true
- ctrl.config.sortConfig.show = true;
- }
-
- angular.extend(ctrl, {
- viewSelected: viewSelected,
- isViewSelected: isViewSelected,
- isTableViewSelected: isTableViewSelected,
- checkViewDisabled: checkViewDisabled,
- addFilter: addFilter,
- handleAction: handleAction
- });
- };
-
- ctrl.$onChanges = function () {
- setupConfig ();
- };
-
- ctrl.$doCheck = function () {
- // do a deep compare on config
- if (!angular.equals(ctrl.config, prevConfig)) {
- setupConfig();
- }
- };
-
- function setupConfig () {
- prevConfig = angular.copy(ctrl.config);
-
- if (ctrl.config && ctrl.config.viewsConfig && ctrl.config.viewsConfig.views) {
- ctrl.config.viewsConfig.viewsList = angular.copy(ctrl.config.viewsConfig.views);
-
- if (!ctrl.config.viewsConfig.currentView) {
- ctrl.config.viewsConfig.currentView = ctrl.config.viewsConfig.viewsList[0].id;
- }
- }
- }
-
- function viewSelected (viewId) {
- ctrl.config.viewsConfig.currentView = viewId;
- if (ctrl.config.viewsConfig.onViewSelect && !ctrl.checkViewDisabled(viewId)) {
- ctrl.config.viewsConfig.onViewSelect(viewId);
- }
- }
-
- function isViewSelected (viewId) {
- return ctrl.config.viewsConfig && (ctrl.config.viewsConfig.currentView === viewId);
- }
-
- function isTableViewSelected () {
- return ctrl.config.viewsConfig ? (ctrl.config.viewsConfig.currentView === 'tableView') : ctrl.config.isTableView;
- }
-
- function checkViewDisabled (view) {
- return ctrl.config.viewsConfig.checkViewDisabled && ctrl.config.viewsConfig.checkViewDisabled(view);
- }
-
- function filterExists (filter) {
- var foundFilter = _.find(ctrl.config.filterConfig.appliedFilters, {title: filter.title, value: filter.value});
- return foundFilter !== undefined;
- }
-
- function enforceSingleSelect (filter) {
- _.remove(ctrl.config.filterConfig.appliedFilters, {title: filter.title});
- }
-
- function addFilter (field, value) {
- var newFilter = {
- id: field.id,
- title: field.title,
- value: value
- };
- if (!filterExists(newFilter)) {
- if (field.filterType === 'select') {
- enforceSingleSelect(newFilter);
- }
- ctrl.config.filterConfig.appliedFilters.push(newFilter);
-
- if (ctrl.config.filterConfig.onFilterChange) {
- ctrl.config.filterConfig.onFilterChange(ctrl.config.filterConfig.appliedFilters);
- }
- }
- }
-
- function handleAction (action) {
- if (action && action.actionFn && (action.isDisabled !== true)) {
- action.actionFn(action);
- }
- }
- }
-});
diff --git a/src/toolbars/toolbar.html b/src/toolbars/toolbar.html
deleted file mode 100644
index e9c5f1f6a..000000000
--- a/src/toolbars/toolbar.html
+++ /dev/null
@@ -1,54 +0,0 @@
-
diff --git a/src/toolbars/toolbars.less b/src/toolbars/toolbars.less
deleted file mode 100644
index 67f962c32..000000000
--- a/src/toolbars/toolbars.less
+++ /dev/null
@@ -1,32 +0,0 @@
-@media (min-width: 768px) {
- .toolbar-pf-actions .toolbar-apf-filter {
- padding-left: 0;
- }
-}
-.toolbar-pf-actions {
- .toolbar-pf-view-selector {
- a {
- cursor: pointer;
- }
- }
- .dropdown-menu {
- a {
- cursor: pointer;
- }
- }
- .dropdown-kebab-pf {
- float: right;
- }
-}
-.toolbar-pf-include-actions {
- display: inline-block;
- margin: 0 5px;
-}
-.dropdown-kebab-pf.invisible {
- opacity: 0;
- pointer-events: none;
-}
-.toolbar-pf-actions.no-filter {
- margin-left: -30px;
- margin-bottom: 10px;
-}
diff --git a/src/toolbars/toolbars.module.js b/src/toolbars/toolbars.module.js
deleted file mode 100644
index 6ee7aeb3d..000000000
--- a/src/toolbars/toolbars.module.js
+++ /dev/null
@@ -1,12 +0,0 @@
-/**
- * @name patternfly toolbars
- *
- * @description
- * Filters module for patternfly.
- *
- */
-angular.module('patternfly.toolbars', [
- 'patternfly.utils',
- 'patternfly.filters',
- 'patternfly.sort',
- 'patternfly.views']);
diff --git a/src/utils/fixed-accordion.directive.js b/src/utils/fixed-accordion.directive.js
deleted file mode 100644
index b2b7e6846..000000000
--- a/src/utils/fixed-accordion.directive.js
+++ /dev/null
@@ -1,165 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.utils:pfFixedAccordion
- * @restrict A
- * @element ANY
- * @param {string} scrollSelector specifies the selector to be used to find the element that should scroll (optional, the entire collapse area scrolls by default)
- * @param {string} groupHeight Height to set for uib-accordion group (optional)
- * @param {string} groupClass Class to set for uib-accordion group (optional)
- *
- * @description
- * Directive for setting a ui-bootstrap uib-accordion to use a fixed height (collapse elements scroll when necessary)
- *
- * @example
-
-
-
-
-
-
- {{item.content}}
-
-
-
-
-
-
-
- angular.module('patternfly.utils').controller( 'AccordionCntrl', function ($scope) {
- $scope.items = [
- { heading: 'Lorem ipsum', isOpen: false, content: 'Praesent sagittis est et arcu fringilla placerat. Cras erat ante, dapibus non mauris ac, volutpat sollicitudin ligula. Morbi gravida nisl vel risus tempor, sit amet luctus erat tempus. Curabitur blandit sem non pretium bibendum. Donec eleifend non turpis vitae vestibulum. Vestibulum ut sem ac nunc posuere blandit sed porta lorem. Cras rutrum velit vel leo iaculis imperdiet.' },
- { heading: 'Dolor sit amet', isOpen: false, content: 'Donec consequat dignissim neque, sed suscipit quam egestas in. Fusce bibendum laoreet lectus commodo interdum. Vestibulum odio ipsum, tristique et ante vel, iaculis placerat nulla. Suspendisse iaculis urna feugiat lorem semper, ut iaculis risus tempus.' },
- { heading: 'Consectetur', isOpen: false, content: 'Curabitur nisl quam, interdum a venenatis a, consequat a ligula. Nunc nec lorem in erat rhoncus lacinia at ac orci. Sed nec augue congue, vehicula justo quis, venenatis turpis. Nunc quis consectetur purus. Nam vitae viverra lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum eu augue felis. Maecenas in dignissim purus, quis pulvinar lectus. Vivamus euismod ultrices diam, in mattis nibh.' },
- { heading: 'Adipisicing elit', isOpen: false, content: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.' },
- { heading: 'Suspendisse lectus tortor', isOpen: false, content: 'Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.' },
- { heading: 'Velit mauris', isOpen: false, content: 'Ut velit mauris, egestas sed, gravida nec, ornare ut, mi. Aenean ut orci vel massa suscipit pulvinar. Nulla sollicitudin. Fusce varius, ligula non tempus aliquam, nunc turpis ullamcorper nibh, in tempus sapien eros vitae ligula. Pellentesque rhoncus nunc et augue. Integer id felis. Curabitur aliquet pellentesque diam. Integer quis metus vitae elit lobortis egestas. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vel erat non mauris convallis vehicula. Nulla et sapien. Integer tortor tellus, aliquam faucibus, convallis id, congue eu, quam. Mauris ullamcorper felis vitae erat. Proin feugiat, augue non elementum posuere, metus purus iaculis lectus, et tristique ligula justo vitae magna.' },
- { heading: 'Aliquam convallis', isOpen: false, content: 'Aliquam convallis sollicitudin purus. Praesent aliquam, enim at fermentum mollis, ligula massa adipiscing nisl, ac euismod nibh nisl eu lectus. Fusce vulputate sem at sapien. Vivamus leo. Aliquam euismod libero eu enim. Nulla nec felis sed leo placerat imperdiet. Aenean suscipit nulla in justo. Suspendisse cursus rutrum augue. Nulla tincidunt tincidunt mi. Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus. Curabitur eu amet.' },
- { heading: 'Vulputate dictum', isOpen: false, content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at ante. Mauris eleifend, quam a vulputate dictum, massa quam dapibus leo, eget vulputate orci purus ut lorem. In fringilla mi in ligula. Pellentesque aliquam quam vel dolor. Nunc adipiscing. Sed quam odio, tempus ac, aliquam molestie, varius ac, tellus. Vestibulum ut nulla aliquam risus rutrum interdum. Pellentesque lorem. Curabitur sit amet erat quis risus feugiat viverra. Pellentesque augue justo, sagittis et, lacinia at, venenatis non, arcu. Nunc nec libero. In cursus dictum risus. Etiam tristique nisl a nulla. Ut a orci. Curabitur dolor nunc, egestas at, accumsan at, malesuada nec, magna.' }
- ];
- });
-
-
- */
-angular.module('patternfly.utils').directive('pfFixedAccordion', function ($window, $timeout) {
- 'use strict';
- return {
- restrict: 'A',
- scope: {
- scrollSelector: '@',
- groupHeight: '@',
- groupClass: '@'
- },
- link: function ($scope, $element, $attrs) {
- var contentElementHeight = function (contentElement) {
- var contentHeight = contentElement.offsetHeight;
- contentHeight += parseInt(getComputedStyle(contentElement).marginTop);
- contentHeight += parseInt(getComputedStyle(contentElement).marginBottom);
-
- return contentHeight;
- };
-
- var setBodyScrollHeight = function (parentElement, bodyHeight) {
- // Set the max-height for the fixed height components
- var collapsePanels = parentElement[0].querySelectorAll('.panel-collapse');
- var collapsePanel;
- var scrollElement;
- var panelContents;
- var innerHeight;
- var scroller;
-
- angular.forEach(collapsePanels, function (collapseElement) {
- collapsePanel = angular.element(collapseElement);
- scrollElement = collapsePanel;
- innerHeight = 0;
-
- if (angular.isDefined($scope.scrollSelector)) {
- scroller = angular.element(collapsePanel[0].querySelector($scope.scrollSelector));
- if (scroller.length) {
- scrollElement = angular.element(scroller[0]);
-
- panelContents = collapsePanel.children();
- angular.forEach(panelContents, function (contentElement) {
- // Get the height of all the non-scroll element contents
- if (contentElement !== scrollElement[0]) {
- innerHeight += contentElementHeight(contentElement);
- }
- });
- }
- }
-
- // Make sure we have enough height to be able to scroll the contents if necessary
- angular.element(scrollElement).css('max-height', Math.max((bodyHeight - innerHeight), 25) + 'px');
- angular.element(scrollElement).css('overflow-y', 'auto');
- });
- };
-
- var setCollapseHeights = function () {
- var height, openPanel, contentHeight, bodyHeight, overflowY = 'hidden';
- var parentElement = angular.element($element[0].querySelector('.panel-group'));
- var headings = angular.element(parentElement).children();
-
- height = parentElement[0].clientHeight;
-
- // Close any open panel
- openPanel = parentElement[0].querySelectorAll('.collapse.in');
- if (openPanel && openPanel.length > 0) {
- angular.element(openPanel).removeClass('in');
- }
-
- // Determine the necessary height for the closed content
- contentHeight = 0;
-
- angular.forEach(headings, function (heading) {
- contentHeight += contentElementHeight(heading);
- });
-
- // Determine the height remaining for opened collapse panels
- bodyHeight = height - contentHeight;
-
- // Make sure we have enough height to be able to scroll the contents if necessary
- if (bodyHeight < 25) {
- bodyHeight = 25;
-
- // Allow the parent to scroll so the child elements are accessible
- overflowY = 'auto';
- }
-
- // Reopen the initially opened panel
- if (openPanel && openPanel.length > 0) {
- angular.element(openPanel).addClass("in");
- }
-
- angular.element(parentElement).css('overflow-y', overflowY);
-
- // Update body scroll element's height after allowing these changes to set in
- $timeout(function () {
- setBodyScrollHeight(parentElement, bodyHeight);
- });
- };
-
- var debounceResize = _.debounce(setCollapseHeights, 150, {
- maxWait: 250
- });
-
- if ($scope.groupHeight) {
- angular.element($element[0].querySelector('.panel-group')).css('height', $scope.groupHeight);
- }
- if ($scope.groupClass) {
- angular.element($element[0].querySelector(".panel-group")).addClass($scope.groupClass);
- }
-
- $timeout(function () {
- setCollapseHeights();
- }, 100);
-
- // Update on window resizing
- $element.on('resize', function () {
- debounceResize();
- });
-
- angular.element($window).on('resize', function () {
- debounceResize();
- });
- }
- };
-});
diff --git a/src/utils/transclude-directive.js b/src/utils/transclude-directive.js
deleted file mode 100644
index 0cacb7926..000000000
--- a/src/utils/transclude-directive.js
+++ /dev/null
@@ -1,139 +0,0 @@
-
-/**
- * @ngdoc directive
- * @name patternfly.utils.directive:pfTransclude
- * @restrict A
- * @element ANY
- * @param {string} pfTransclude specifies the type of transclusion to use.
- *
Values:
- *
- * 'sibling' - The transcluded contents scope is a sibling one to the element where transclusion happens (default)
- * 'parent' - The transcluded contents scope is that of the element where transclusion happens.
- * 'child' - The transcluded contents scope is child scope to the scope of the element where transclusion happens.
- *
- *
- * @description
- * Directive for transcluding in directives and setting up scope of children of parent directives. This is a workaround
- * for https://github.com/angular/angular.js/issues/5489
- *
- * @example
-
-
-
-
Here the scope id is: {{$id}}
-
-
- This content was transcluded using pf-transclude or pf-transclude="sibling" . Its scope is: {{$id}} the parent of which is {{$parent.$id}}
-
-
-
- This content was transcluded using pf-transclude="parent" . Its scope is: {{$id}} the parent of which is {{$parent.$id}}
-
-
-
- This content was transcluded using pf-transclude="child" . Its scope is: {{$id}} the parent of which is {{$parent.$id}}
-
-
-
-
-
- angular.module('patternfly.utils')
- .controller( 'UtilCtrl', function($scope) {
-
- })
-
- .config(function($provide){
- $provide.decorator('ngTranscludeDirective', ['$delegate', function($delegate) {
- // Remove the original directive
- $delegate.shift();
- return $delegate;
- }]);
- })
-
- .directive( 'transcludeSibling', function() {
- return {
- restrict: 'E',
- transclude: true,
- scope: {},
- template:
- '' +
- '
I am a directive with scope {{$id}}
' +
- '
' +
- '
'
- }
- })
-
- .directive( 'transcludeParent', function() {
- return {
- restrict: 'E',
- transclude: true,
- scope: {},
- template:
- '' +
- '
I am a directive with scope {{$id}}
' +
- '
' +
- '
'
- }
- })
-
- .directive( 'transcludeChild', function() {
- return {
- restrict: 'E',
- transclude: true,
- scope: {},
- template:
- '' +
- '
I am a directive with scope {{$id}}
' +
- '
' +
- '
'
- }
- })
- ;
-
-
- */
-angular
- .module('patternfly.utils').directive('pfTransclude', function () {
- 'use strict';
- return {
- restrict: 'A',
- link: function ($scope, $element, $attrs, controller, $transclude) {
- var iChildScope;
- var iScopeType;
-
- if (!$transclude) {
- throw new Error('pfTransclude - ' +
- 'Illegal use of pfTransclude directive in the template! ' +
- 'No parent directive that requires a transclusion found. ' +
- 'Element: {0}');
- }
-
- iScopeType = $attrs.pfTransclude || 'sibling';
-
- switch (iScopeType) {
- case 'sibling':
- $transclude(function (clone) {
- $element.empty();
- $element.append(clone);
- });
- break;
- case 'parent':
- $transclude($scope, function (clone) {
- $element.empty();
- $element.append( clone );
- });
- break;
- case 'child':
- iChildScope = $scope.$new();
- $transclude( iChildScope, function (clone) {
- $element.empty();
- $element.append( clone );
- $element.on( '$destroy', function () {
- iChildScope.$destroy();
- });
- });
- break;
- }
- }
- };
- });
diff --git a/src/utils/utils.js b/src/utils/utils.js
deleted file mode 100644
index 49a91dcd5..000000000
--- a/src/utils/utils.js
+++ /dev/null
@@ -1,103 +0,0 @@
-(function () {
- 'use strict';
-
- angular.module('patternfly.utils').constant('pfUtils', {
- merge: function (source1, source2) {
- var retValue;
-
- if (typeof angular.merge === 'function') {
- retValue = this.angularMerge(source1, source2);
- } else if (typeof _.merge === 'function') {
- retValue = this._merge(source1, source2);
- } else if (typeof $.extend === 'function') {
- retValue = this.$extend(source1, source2);
- } else {
- retValue = this.mergeDeep(source1, source2);
- }
-
- return retValue;
- },
- angularMerge: function (source1, source2) {
- return angular.merge({}, source1, source2);
- },
- _merge: function (source1, source2) {
- return _.merge({}, source1, source2);
- },
- $extend: function (source1, source2) {
- return $.extend(true, angular.copy(source1), source2);
- },
- mergeDeep: function (source1, source2) {
- return mergeDeep({}, angular.copy(source1), angular.copy(source2));
- },
- utilizationToColor: function (utilization) {
- return utilizationToColor(utilization);
- },
- colorPalette: patternfly.pfPaletteColors
- });
-})();
-
-/* This function does not merge/concat Arrays.
- * It replaces the earlier Array with any latter Array.
- */
-function mergeDeep (dst) {
- 'use strict';
- angular.forEach(arguments, function (obj) {
- if (obj !== dst) {
- angular.forEach(obj, function (value, key) {
- if (dst[key] && dst[key].constructor && dst[key].constructor === Object) {
- mergeDeep(dst[key], value);
- } else {
- dst[key] = value;
- }
- });
- }
- });
- return dst;
-}
-
-function utilizationToColor (number) {
- 'use strict';
- // as the function expects a value between 0 and 1, and green = 0° and red = 120°
- // we convert the input to the appropriate hue value
- var invert = 100 - number;
- var hue = invert * 1.2 / 360;
- // we convert hsl to rgb (saturation 100%, lightness 50%)
- var rgb = hslToRgb(hue, 1, .5);
- // we format to css value and return
- return 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')';
-}
-
-function hue2rgb (p, q, t) {
- 'use strict';
- if (t < 0) {
- t += 1;
- }
- if (t > 1) {
- t -= 1;
- }
- if (t < 1 / 6) {
- return p + (q - p) * 6 * t;
- }
- if (t < 1 / 2) {
- return q;
- }
- if (t < 2 / 3) {
- return p + (q - p) * (2 / 3 - t) * 6;
- }
- return p;
-}
-
-function hslToRgb (h, s, l) {
- 'use strict';
- var r, g, b, q, p;
- if (s === 0) {
- r = g = b = l; // achromatic
- } else {
- q = l < 0.5 ? l * (1 + s) : l + s - l * s;
- p = 2 * l - q;
- r = hue2rgb(p, q, h + 1 / 3);
- g = hue2rgb(p, q, h);
- b = hue2rgb(p, q, h - 1 / 3);
- }
- return [Math.floor(r * 255), Math.floor(g * 255), Math.floor(b * 255)];
-}
diff --git a/src/utils/utils.module.js b/src/utils/utils.module.js
deleted file mode 100644
index 0a35118cd..000000000
--- a/src/utils/utils.module.js
+++ /dev/null
@@ -1,2 +0,0 @@
-
-angular.module( 'patternfly.utils', ['ui.bootstrap'] );
diff --git a/src/validation/validation.js b/src/validation/validation.js
deleted file mode 100644
index 1d7a9ed3a..000000000
--- a/src/validation/validation.js
+++ /dev/null
@@ -1,167 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.validation:pfValidation
- * @restrict E
- * @element INPUT
- * @scope
- *
- * @description
- * Directive used for input validation based on custom function.
- *
- * @param {expression=} pfValidationDisabled If true, the validation is disabled, it is enabled otherwise.
- *
- * @example
-
-
-
-
-
-
-
- angular.module( 'patternfly.validation' ).controller( 'ValidationDemoCtrl', function( $scope ) {
- $scope.myValue = "Change this value to be a number";
- $scope.myValueValid = 42;
- $scope.isValidationDisabled = false;
-
- $scope.isNumber = function (value) {
- if (isNaN(value)) {
- return false;
- }
-
- return true;
- }
- });
-
-
-
- */
-angular.module('patternfly.validation', []).directive('pfValidation', function ($timeout) {
- 'use strict';
-
- return {
- restrict: 'A',
- require: 'ngModel',
- scope: {
- pfValidation: '&',
- pfValidationDisabled: '='
- },
- link: function (scope, element, attrs, ctrl) {
-
- scope.inputCtrl = ctrl;
- scope.valEnabled = !attrs.pfValidationDisabled;
-
- scope.$watch('pfValidationDisabled', function (newVal) {
- scope.valEnabled = !newVal;
- if (newVal) {
- scope.inputCtrl.$setValidity('pfValidation', true);
- toggleErrorClass(false);
- } else {
- validate();
- }
- });
-
- // If validation function is set
- if (attrs.pfValidation) {
- // using $timeout(0) to get the actual $modelValue
- $timeout(function () {
- validate();
- }, 0);
- } else if (!scope.inputCtrl.$valid && scope.inputCtrl.$dirty) {
- toggleErrorClass(true);
- }
-
- scope.$watch('inputCtrl.$valid', function (isValid) {
- if (isValid) {
- toggleErrorClass(false);
- } else {
- toggleErrorClass(true);
- }
- });
-
- scope.$watch('inputCtrl.$modelValue', function () {
- validate();
- });
-
- function validate () {
- var valid;
-
- var val = scope.inputCtrl.$modelValue;
-
- var valFunc = scope.pfValidation({'input': val});
-
- if (!attrs.pfValidation) {
- valFunc = true;
- }
-
- valid = !val || valFunc || val === '';
-
- if (scope.valEnabled && !valid) {
- toggleErrorClass(true);
- } else {
- toggleErrorClass(false);
- }
- }
-
- function toggleErrorClass (add) {
- var messageElement = element.next();
- var parentElement = element.parent();
- var hasErrorM = parentElement.hasClass('has-error');
- var wasHidden = messageElement.hasClass('ng-hide');
-
- scope.inputCtrl.$setValidity('pf-validation', !add);
-
- if (add) {
- if (!hasErrorM) {
- parentElement.addClass('has-error');
- }
- if (wasHidden) {
- messageElement.removeClass('ng-hide');
- }
- }
-
- if (!add) {
- if (hasErrorM) {
- parentElement.removeClass('has-error');
- }
- if (!wasHidden) {
- messageElement.addClass('ng-hide');
- }
- }
- }
- }
- };
-});
diff --git a/src/views/cardview/card-view.component.js b/src/views/cardview/card-view.component.js
deleted file mode 100644
index 1de0295cc..000000000
--- a/src/views/cardview/card-view.component.js
+++ /dev/null
@@ -1,488 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.views.directive:pfCardView
- * @restrict E
- *
- * @description
- * Component for rendering cards in a view
- *
- *
- * @param {object} config configuration settings for the cards:
- *
- * .showSelectBox - (boolean) Show item selection boxes for each item, default is true
- * .selectItems - (boolean) Allow card selection, default is false
- * .dlbClick - (boolean) Handle double clicking (item remains selected on a double click). Default is false.
- * .multiSelect - (boolean) Allow multiple card selections, selectItems must also be set, not applicable when dblClick is true. Default is false
- * .selectionMatchProp - (string) Property of the items to use for determining matching, default is 'uuid'
- * .selectedItems - (array) Current set of selected items
- * .checkDisabled - ( function(item) ) Function to call to determine if an item is disabled, default is none
- * .onCheckBoxChange - ( function(item) ) Called to notify when a checkbox selection changes, default is none
- * .onSelect - ( function(item, event) ) Called to notify of item selection, default is none
- * .onSelectionChange - ( function(items) ) Called to notify when item selections change, default is none
- * .onClick - ( function(item, event) ) Called to notify when an item is clicked, default is none
- * .onDblClick - ( function(item, event) ) Called to notify when an item is double clicked, default is none
- * .itemsAvailable - (boolean) If 'false', displays the {@link patternfly.views.directive:pfEmptyState Empty State} component.
- *
- * @param {object} pageConfig Optional pagination configuration object. Since all properties are optional it is ok to specify: 'pageConfig = {}' to indicate that you want to
- * use pagination with the default parameters.
- *
- * .pageNumber - (number) Optional Initial page number to display. Default is page 1.
- * .pageSize - (number) Optional Initial page size/display length to use. Ie. Number of "Items per Page". Default is 10 items per page
- * .pageSizeIncrements - (Array[Number]) Optional Page size increments for the 'per page' dropdown. If not specified, the default values are: [5, 10, 20, 40, 80, 100]
- *
- * @param {object} emptyStateConfig Optional configuration settings for the empty state component. See the {@link patternfly.views.directive:pfEmptyState Empty State} component
- * @param {array} emptyStateActionButtons Optional buttons to display under the icon, title, and informational paragraph in the empty state component. See the {@link patternfly.views.directive:pfEmptyState Empty State} component
- * @param {Array} items the data to be shown in the cards
- *
- * @example
-
-
-
-
-
-
-
- {{item.name}}
-
-
- {{item.address}}
-
-
- {{item.city}}, {{item.state}}
-
-
-
-
-
-
-
-
- Events:
-
-
-
-
-
-
-
-
- angular.module('patternfly.views').controller('ViewCtrl', ['$scope',
- function ($scope) {
- $scope.showPagination = false;
- $scope.eventText = '';
- var handleSelect = function (item, e) {
- $scope.eventText = item.name + ' selected\n' + $scope.eventText;
- };
- var handleSelectionChange = function (selectedItems, e) {
- $scope.eventText = selectedItems.length + ' items selected\n' + $scope.eventText;
- };
- var handleClick = function (item, e) {
- $scope.eventText = item.name + ' clicked\n' + $scope.eventText;
- };
- var handleDblClick = function (item, e) {
- $scope.eventText = item.name + ' double clicked\n' + $scope.eventText;
- };
- var handleCheckBoxChange = function (item, selected, e) {
- $scope.eventText = item.name + ' checked: ' + item.selected + '\n' + $scope.eventText;
- };
- $scope.togglePagination = function () {
- if ($scope.showPagination) {
- $scope.pageConfig = {
- pageSize: 5
- }
- } else {
- delete $scope.pageConfig;
- }
- };
-
- var checkDisabledItem = function(item) {
- return $scope.showDisabled && (item.name === "John Smith");
- };
-
- $scope.selectType = 'checkbox';
- $scope.updateSelectionType = function() {
- if ($scope.selectType === 'checkbox') {
- $scope.config.selectItems = false;
- $scope.config.showSelectBox = true;
- } else if ($scope.selectType === 'card') {
- $scope.config.selectItems = true;
- $scope.config.showSelectBox = false;
- } else {
- $scope.config.selectItems = false;
- $scope.config.showSelectBox = false;
- }
- };
-
- $scope.showDisabled = false;
-
- $scope.config = {
- selectItems: false,
- itemsAvailable: true,
- multiSelect: false,
- dblClick: false,
- selectionMatchProp: 'name',
- selectedItems: [],
- checkDisabled: checkDisabledItem,
- showSelectBox: true,
- onSelect: handleSelect,
- onSelectionChange: handleSelectionChange,
- onCheckBoxChange: handleCheckBoxChange,
- onClick: handleClick,
- onDblClick: handleDblClick
- };
-
- $scope.items = [
- {
- name: "Fred Flintstone",
- address: "20 Dinosaur Way",
- city: "Bedrock",
- state: "Washingstone"
- },
- {
- name: "John Smith",
- address: "415 East Main Street",
- city: "Norfolk",
- state: "Virginia"
- },
- {
- name: "Frank Livingston",
- address: "234 Elm Street",
- city: "Pittsburgh",
- state: "Pennsylvania"
- },
- {
- name: "Judy Green",
- address: "2 Apple Boulevard",
- city: "Cincinatti",
- state: "Ohio"
- },
- {
- name: "Pat Thomas",
- address: "50 Second Street",
- city: "New York",
- state: "New York"
- },
- {
- name: "Betty Rubble",
- address: "30 Dinosaur Way",
- city: "Bedrock",
- state: "Washingstone"
- },
- {
- name: "Martha Smith",
- address: "415 East Main Street",
- city: "Norfolk",
- state: "Virginia"
- },
- {
- name: "Liz Livingston",
- address: "234 Elm Street",
- city: "Pittsburgh",
- state: "Pennsylvania"
- },
- {
- name: "Howard McGovern",
- address: "22 Oak Street",
- city: "Denver",
- state: "Colorado"
- },
- {
- name: "Joyce Brown",
- address: "72 Bourbon Way",
- city: "Nashville",
- state: "Tennessee"
- },
- {
- name: "Mike Nichols",
- address: "21 Jump Street",
- city: "Hollywood",
- state: "California"
- },
- {
- name: "Mark Edwards",
- address: "17 Cross Street",
- city: "Boston",
- state: "Massachusetts"
- },
- {
- name: "Chris Thomas",
- address: "50 Second Street",
- city: "New York",
- state: "New York"
- }
- ];
-
- var performEmptyStateAction = function (action) {
- $scope.eventText = action.name + "\r\n" + $scope.eventText;
- };
-
- $scope.emptyStateConfig = {
- icon: 'pficon-warning-triangle-o',
- title: 'No Items Available',
- info: "This is the Empty State component. The goal of a empty state pattern is to provide a good first impression that helps users to achieve their goals. It should be used when a view is empty because no objects exists and you want to guide the user to perform specific actions.",
- helpLink: {
- label: 'For more information please see',
- urlLabel: 'pfExample',
- url : '#/api/patternfly.views.directive:pfEmptyState'
- }
- };
-
- $scope.emptyStateActionButtons = [
- {
- name: 'Main Action',
- title: 'Perform an action',
- actionFn: performEmptyStateAction,
- type: 'main'
- },
- {
- name: 'Secondary Action 1',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- },
- {
- name: 'Secondary Action 2',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- },
- {
- name: 'Secondary Action 3',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- }
- ];
- }
- ]);
-
-
- */
-angular.module('patternfly.views').component('pfCardView', {
- bindings: {
- config: '=?',
- pageConfig: '=?',
- emptyStateConfig: '=?',
- emptyStateActionButtons: '=?',
- items: '=',
- eventId: '@id'
- },
- transclude: true,
- templateUrl: 'views/cardview/card-view.html',
- controller: function () {
- 'use strict';
- var ctrl = this;
- var prevPageConfig, prevItems;
-
- ctrl.defaultConfig = {
- selectItems: false,
- multiSelect: false,
- dblClick: false,
- selectionMatchProp: 'uuid',
- selectedItems: [],
- checkDisabled: false,
- showSelectBox: true,
- onSelect: null,
- onSelectionChange: null,
- onCheckBoxChange: null,
- onClick: null,
- onDblClick: null,
- itemsAvailable: true
- };
-
- ctrl.itemClick = function (e, item) {
- var alreadySelected;
- var selectionChanged = false;
- var continueEvent = true;
-
- // Ignore disabled item clicks completely
- if (ctrl.checkDisabled(item)) {
- return continueEvent;
- }
-
- if (ctrl.config && ctrl.config.selectItems && item) {
- if (ctrl.config.multiSelect && !ctrl.config.dblClick) {
-
- alreadySelected = _.find(ctrl.config.selectedItems, function (itemObj) {
- return itemObj === item;
- });
-
- if (alreadySelected) {
- // already selected so deselect
- ctrl.config.selectedItems = _.without(ctrl.config.selectedItems, item);
- } else {
- // add the item to the selected items
- ctrl.config.selectedItems.push(item);
- selectionChanged = true;
- }
- } else {
- if (ctrl.config.selectedItems[0] === item) {
- if (!ctrl.config.dblClick) {
- ctrl.config.selectedItems = [];
- selectionChanged = true;
- }
- continueEvent = false;
- } else {
- ctrl.config.selectedItems = [item];
- selectionChanged = true;
- }
- }
-
- if (selectionChanged && ctrl.config.onSelect) {
- ctrl.config.onSelect(item, e);
- }
- if (selectionChanged && ctrl.config.onSelectionChange) {
- ctrl.config.onSelectionChange(ctrl.config.selectedItems, e);
- }
- }
- if (ctrl.config.onClick) {
- ctrl.config.onClick(item, e);
- }
-
- return continueEvent;
- };
-
- ctrl.dblClick = function (e, item) {
- if (ctrl.config.onDblClick) {
- ctrl.config.onDblClick(item, e);
- }
- };
-
- ctrl.checkBoxChange = function (item) {
- if (ctrl.config.onCheckBoxChange) {
- ctrl.config.onCheckBoxChange(item);
- }
- };
-
- ctrl.isSelected = function (item) {
- var matchProp = ctrl.config.selectionMatchProp;
- var selected = false;
-
- if (ctrl.config.showSelectBox) {
- selected = item.selected;
- } else {
- if (ctrl.config.selectedItems.length) {
- return _.find(ctrl.config.selectedItems, function (itemObj) {
- return itemObj[matchProp] === item[matchProp];
- });
- }
- }
- return selected;
- };
-
- ctrl.checkDisabled = function (item) {
- return ctrl.config.checkDisabled && ctrl.config.checkDisabled(item);
- };
-
- function setPagination () {
- if (angular.isUndefined(ctrl.pageConfig)) {
- ctrl.pageConfig = {
- pageNumber: 1,
- pageSize: ctrl.items.length,
- numTotalItems: ctrl.items.length,
- showPaginationControls: false
- };
- } else {
- if (angular.isUndefined(ctrl.pageConfig.showPaginationControls)) {
- ctrl.pageConfig.showPaginationControls = true;
- }
- if (!angular.isNumber(ctrl.pageConfig.pageNumber)) {
- ctrl.pageConfig.pageNumber = 1;
- }
- if (!angular.isNumber(ctrl.pageConfig.pageSize)) {
- ctrl.pageConfig.pageSize = 10;
- }
- if (!angular.isNumber(ctrl.pageConfig.numTotalItems)) {
- ctrl.pageConfig.numTotalItems = ctrl.items.length;
- }
- // if not showing pagination, keep pageSize equal to numTotalItems
- if (!ctrl.pageConfig.showPaginationControls) {
- ctrl.pageConfig.pageSize = ctrl.pageConfig.numTotalItems;
- }
- }
- prevPageConfig = angular.copy(ctrl.pageConfig);
- }
-
- ctrl.$onInit = function () {
-
- _.defaults(ctrl.config, ctrl.defaultConfig);
-
- if (ctrl.config.selectItems && ctrl.config.showSelectBox) {
- throw new Error('pfCardView - ' +
- 'Illegal use of pfCardView component! ' +
- 'Cannot allow both select box and click selection in the same card view.');
- }
-
- prevItems = angular.copy(ctrl.items);
- setPagination();
- };
-
-
- ctrl.$doCheck = function () {
- if (!angular.equals(ctrl.pageConfig, prevPageConfig)) {
- setPagination();
- }
- if (!angular.equals(ctrl.items, prevItems)) {
- if (ctrl.items) {
- ctrl.config.itemsAvailable = ctrl.items.length > 0;
- }
- if (angular.isDefined(ctrl.pageConfig)) {
- ctrl.pageConfig.numTotalItems = ctrl.items.length;
- }
- prevItems = angular.copy(ctrl.items);
- }
- };
- }
-});
diff --git a/src/views/cardview/card-view.html b/src/views/cardview/card-view.html
deleted file mode 100755
index bb6a80b96..000000000
--- a/src/views/cardview/card-view.html
+++ /dev/null
@@ -1,22 +0,0 @@
-
-
-
-
-
-
diff --git a/src/views/empty-state.component.js b/src/views/empty-state.component.js
deleted file mode 100644
index 8b5a76192..000000000
--- a/src/views/empty-state.component.js
+++ /dev/null
@@ -1,177 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.views.directive:pfEmptyState
- * @restrict E
- *
- * @description
- * Component for rendering an empty state.
- *
- * @param {object} config Optional configuration object
- *
- * .icon - (string) class for main icon. Ex. 'pficon pficon-add-circle-o'
- * .title - (string) Text for the main title
- * .info - (string) Text for the main informational paragraph
- * .helpLink - (object) Contains url specific properties and actions
- *
- * .label - (string) Optional text label which appears before the urlLabel
- * .urlLabel - (string) Optional text for the clickable portion of the link
- * .url - (string) Optional text for url path
- * .urlAction - (function) Optional function to invoke a url action when a callback method is specified.
- * When both urlAction and url are specified the component will first execute urlAction then nagivate to the url.
- *
- *
- * @param {array} actionButtons Buttons to display under the icon, title, and informational paragraph.
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .actionFn - (function(action)) Function to invoke when the action selected
- * .type - (String) Optional type property. Set to 'main' to be displayed as a main action button.
- * If unspecified, action button will be displayed as a secondary action button.
- *
- * @example
-
-
-
-
-
-
- Events:
-
-
-
-
-
-
-
-
- angular.module('patternfly.views').controller('ViewCtrl', ['$scope',
- function ($scope) {
-
- $scope.eventText = '';
-
- var performEmptyStateAction = function () {
- $scope.eventText += 'Empty State Action Executed \r\n';
- };
-
- $scope.config = {
- icon: 'pficon-add-circle-o',
- title: 'Empty State Title',
- info: "This is the Empty State component. The goal of a empty state pattern is to provide a good first impression that helps users to achieve their goals. It should be used when a view is empty because no objects exists and you want to guide the user to perform specific actions.",
- helpLink: {
- label: 'For more information please see',
- urlLabel: 'pfExample',
- url: '#/api/patternfly.views.directive:pfEmptyState',
- urlAction: performEmptyStateAction
- }
- };
-
- var performAction = function (action) {
- $scope.eventText = action.name + " executed. \r\n" + $scope.eventText;
- };
-
- $scope.actionButtons = [
- {
- name: 'Main Action',
- title: 'Perform an action',
- actionFn: performAction,
- type: 'main'
- },
- {
- name: 'Secondary Action 1',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Secondary Action 2',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Secondary Action 3',
- title: 'Perform an action',
- actionFn: performAction
- }
- ];
- }
- ]);
-
-
-*/
-angular.module('patternfly.views').component('pfEmptyState', {
- bindings: {
- config: '',
- actionButtons: ""
- },
- templateUrl: 'views/empty-state.html',
- controller: function ($filter) {
- 'use strict';
- var ctrl = this, prevConfig;
-
- ctrl.defaultConfig = {
- title: 'No Items Available'
- };
-
- ctrl.$onInit = function () {
- if (angular.isUndefined(ctrl.config)) {
- ctrl.config = {};
- }
- ctrl.updateConfig();
- };
-
- ctrl.updateConfig = function () {
- prevConfig = angular.copy(ctrl.config);
- _.defaults(ctrl.config, ctrl.defaultConfig);
- };
-
- ctrl.$onChanges = function (changesObj) {
- if ((changesObj.config && !changesObj.config.isFirstChange()) ) {
- ctrl.updateConfig();
- }
- };
-
- ctrl.$doCheck = function () {
- // do a deep compare on config
- if (!angular.equals(ctrl.config, prevConfig)) {
- ctrl.updateConfig();
- }
- };
-
- ctrl.hasMainActions = function () {
- var mainActions;
-
- if (ctrl.actionButtons) {
- mainActions = $filter('filter')(ctrl.actionButtons, {type: 'main'});
- return mainActions.length;
- }
-
- return false;
- };
-
- ctrl.hasSecondaryActions = function () {
- var secondaryActions;
-
- if (ctrl.actionButtons) {
- secondaryActions = $filter('filter')(ctrl.actionButtons, {type: undefined});
- return secondaryActions.length;
- }
-
- return false;
- };
-
- ctrl.filterMainActions = function (action) {
- return action.type === 'main';
- };
-
- ctrl.filterSecondaryActions = function (action) {
- return action.type !== 'main';
- };
-
- ctrl.handleButtonAction = function (action) {
- if (action && action.actionFn) {
- action.actionFn(action);
- }
- };
- }
-});
diff --git a/src/views/empty-state.html b/src/views/empty-state.html
deleted file mode 100644
index 7a8d96f85..000000000
--- a/src/views/empty-state.html
+++ /dev/null
@@ -1,32 +0,0 @@
-
-
-
-
-
- {{$ctrl.config.title}}
-
-
- {{$ctrl.config.info}}
-
-
- {{$ctrl.config.helpLink.label}}
- {{$ctrl.config.helpLink.urlLabel}}
- {{$ctrl.config.helpLink.urlLabel}}
-
-
-
- {{actionButton.name}}
-
-
-
-
- {{actionButton.name}}
-
-
-
diff --git a/src/views/listview/examples/clusters-content.html b/src/views/listview/examples/clusters-content.html
deleted file mode 100644
index bf770259c..000000000
--- a/src/views/listview/examples/clusters-content.html
+++ /dev/null
@@ -1,37 +0,0 @@
-
-
- Clusters for {{$ctrl.item.name}}
-
-
-
- Cluster 1
- Cluster 2
- Cluster 3
- Cluster 4
- Cluster 5
- Cluster 6
-
-
-
-
- Host Name
- file1.nay.redhat.com
- Device Path
- /dev/disk/pci-0000.05:00-sas-0.2-part1
- Time
- January 15, 2016 10:45:11 AM
- Severity
- Warning
- Cluster
- Cluster 1
-
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
- consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
- cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
- proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-
-
-
diff --git a/src/views/listview/examples/hosts-content.html b/src/views/listview/examples/hosts-content.html
deleted file mode 100644
index 47a5854d7..000000000
--- a/src/views/listview/examples/hosts-content.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
- Hosts for {{$ctrl.item.name}}
-
-
-
- Host 1
- Host 2
- Host 3
- Host 4
- Host 5
- Host 6
- Host 7
- Host 8
-
-
-
-
- Host Name
- file1.nay.redhat.com
- Device Path
- /dev/disk/pci-0000.05:00-sas-0.2-part1
- Time
- January 15, 2016 10:45:11 AM
- Severity
- Warning
- Cluster
- Cluster 1
-
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
- consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
- cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
- proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-
-
-
diff --git a/src/views/listview/examples/images-content.html b/src/views/listview/examples/images-content.html
deleted file mode 100644
index c68cadeca..000000000
--- a/src/views/listview/examples/images-content.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
- Images for {{$ctrl.item.name}}
-
-
-
- Image 1
- Image 2
- Image 3
- Image 4
- Image 5
- Image 6
- Image 7
- Image 8
-
-
-
-
- Host Name
- file1.nay.redhat.com
- Device Path
- /dev/disk/pci-0000.05:00-sas-0.2-part1
- Time
- January 15, 2016 10:45:11 AM
- Severity
- Warning
- Cluster
- Cluster 1
-
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
- consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
- cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
- proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-
-
-
diff --git a/src/views/listview/examples/list-view.js b/src/views/listview/examples/list-view.js
deleted file mode 100644
index 6aea24174..000000000
--- a/src/views/listview/examples/list-view.js
+++ /dev/null
@@ -1,977 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.views.directive:pfListView
- * @restrict E
- *
- * @description
- * Component for rendering a list view.
- * Pass a customScope object containing any scope variables/functions you need to access from the transcluded source, access these
- * via '$ctrl.customScope' in your transcluded hmtl.
- *
- * If using expanding rows, use a list-expanded-content element containing expandable content for each row. Item data can be accessed inside list-expanded-content by using $parent.item.property. For each item in the items array, the expansion can be disabled by setting disableRowExpansion to true on the item.
- * Setting compoundExpanion requires the applicatiot to set/unset the items' isExpanded field and to handle the contents in the list-expanded-content element based on what is expanded.
- *
- * @param {array} items Array of items to display in the list view. If an item in the array has a 'rowClass' field, the value of this field will be used as a class specified on the row (list-group-item).
- * @param {object} config Configuration settings for the list view:
- *
- * .showSelectBox - (boolean) Show item selection boxes for each item, default is true
- * .selectItems - (boolean) Allow row selection, default is false
- * .dlbClick - (boolean) Handle double clicking (item remains selected on a double click). Default is false.
- * .dragEnabled - (boolean) Enable drag and drop. Default is false.
- * .dragEnd - ( function() ) Function to call when the drag operation ended, default is none
- * .dragMoved - ( function() ) Function to call when the drag operation moved an element, default is none
- * .dragStart - ( function(item) ) Function to call when the drag operation started, default is none
- * .multiSelect - (boolean) Allow multiple row selections, selectItems must also be set, not applicable when dblClick is true. Default is false
- * .useExpandingRows - (boolean) Allow row expansion for each list item.
- * .compoundExpansionOnly - (boolean) Use compound row expansion only. Hides the row expander and pointer cursor on the row while allowing the row to expand via transcluded items functionality, only valid if useExpandRows is true.
- * .selectionMatchProp - (string) Property of the items to use for determining matching, default is 'uuid'
- * .selectedItems - (array) Current set of selected items
- * .itemsAvailable - (boolean) If 'false', displays the {@link patternfly.views.directive:pfEmptyState Empty State} component.
- * .checkDisabled - ( function(item) ) Function to call to determine if an item is disabled, default is none
- * .onCheckBoxChange - ( function(item) ) Called to notify when a checkbox selection changes, default is none
- * .onSelect - ( function(item, event) ) Called to notify of item selection, default is none
- * .onSelectionChange - ( function(items) ) Called to notify when item selections change, default is none
- * .onClick - ( function(item, event) ) Called to notify when an item is clicked, default is none. Note: row expansion is the default behavior after onClick performed, but user can stop such default behavior by adding the sentence "return false;" to the end of onClick function body
- * .onDblClick - ( function(item, event) ) Called to notify when an item is double clicked, default is none
- *
- * @param {object} pageConfig Optional pagination configuration object. Since all properties are optional it is ok to specify: 'pageConfig = {}' to indicate that you want to
- * use pagination with the default parameters.
- *
- * .pageNumber - (number) Optional Initial page number to display. Default is page 1.
- * .pageSize - (number) Optional Initial page size/display length to use. Ie. Number of "Items per Page". Default is 10 items per page
- * .pageSizeIncrements - (Array[Number]) Optional Page size increments for the 'per page' dropdown. If not specified, the default values are: [5, 10, 20, 40, 80, 100]
- *
- * @param {array} actionButtons List of action buttons in each row
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .class - (String) Optional class to add to the action button
- * .include - (String) Optional include src for the button. Used for custom button layouts (icons, dropdowns, etc)
- * .includeClass - (String) Optional class to set on the include src div (only relevant when include is set).
- * .actionFn - (function(action)) Function to invoke when the action selected
- *
- * @param {function (action, item))} enableButtonForItemFn function(action, item) Used to enabled/disable an action button based on the current item
- * @param {array} menuActions List of actions for dropdown menu in each row
- *
- * .name - (String) The name of the action, displayed on the button
- * .title - (String) Optional title, used for the tooltip
- * .actionFn - (function(action)) Function to invoke when the action selected
- * .isVisible - (Boolean) set to false to hide the action
- * .isDisabled - (Boolean) set to true to disable the action
- * .isSeparator - (Boolean) set to true if this is a placeholder for a separator rather than an action
- *
- * @param {function (item))} hideMenuForItemFn function(item) Used to hide all menu actions for a particular item
- * @param {function (item))} menuClassForItemFn function(item) Used to specify a class for an item's dropdown kebab
- * @param {function (action, item))} updateMenuActionForItemFn function(action, item) Used to update a menu action based on the current item
- * @param {object} customScope Object containing any variables/functions used by the transcluded html, access via $ctrl.customScope.
- * @param {object} emptyStateConfig Optional configuration settings for the empty state component. See the {@link patternfly.views.directive:pfEmptyState Empty State} component
- * @param {array} emptyStateActionButtons Optional buttons to display under the icon, title, and informational paragraph in the empty state component. See the {@link patternfly.views.directive:pfEmptyState Empty State} component
- * @example
-
-
-
-
-
- angular.module('patternfly.views').controller('ViewCtrl', ['$scope',
- function ($scope) {
- $scope.viewType = 'basic';
-
- $scope.setView = function(viewType) {
- $scope.viewType = viewType;
- };
- }
- ]);
-
-
-
-
-
-
-
- {{item.name}}
-
-
- {{item.address}}
-
-
-
-
- {{item.city}}
-
-
- {{item.state}}
-
-
-
-
-
-
-
- Host
- {{$parent.item.city}}
- Admin
- {{$parent.item.name}}
- Time
- January 15, 2016 10:45:11 AM
- Severity
- Warning
- Cluster
- Cluster 1
-
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
- consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
- cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
- proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-
-
-
-
-
-
-
-
-
-
-
-
- Events:
-
-
-
-
-
-
-
-
- angular.module('patternfly.views').controller('BasicCtrl', ['$scope', '$templateCache',
- function ($scope, $templateCache) {
- $scope.eventText = '';
- var handleSelect = function (item, e) {
- $scope.eventText = item.name + ' selected\r\n' + $scope.eventText;
- };
- var handleSelectionChange = function (selectedItems, e) {
- $scope.eventText = selectedItems.length + ' items selected\r\n' + $scope.eventText;
- };
- var handleClick = function (item, e) {
- $scope.eventText = item.name + ' clicked\r\n' + $scope.eventText;
- };
- var handleDblClick = function (item, e) {
- $scope.eventText = item.name + ' double clicked\r\n' + $scope.eventText;
- };
- var handleCheckBoxChange = function (item, selected, e) {
- $scope.eventText = item.name + ' checked: ' + item.selected + '\r\n' + $scope.eventText;
- };
-
- var checkDisabledItem = function(item) {
- return $scope.showDisabled && (item.name === "John Smith");
- };
-
- var dragEnd = function() {
- $scope.eventText = 'drag end\r\n' + $scope.eventText;
- };
- var dragMoved = function() {
- var index = -1;
-
- for (var i = 0; i < $scope.items.length; i++) {
- if ($scope.items[i] === $scope.dragItem) {
- index = i;
- break;
- }
- }
- if (index >= 0) {
- $scope.items.splice(index, 1);
- }
- $scope.eventText = 'drag moved\r\n' + $scope.eventText;
- };
- var dragStart = function(item) {
- $scope.dragItem = item;
- $scope.eventText = item.name + ': drag start\r\n' + $scope.eventText;
- };
-
- $scope.enableButtonForItemFn = function(action, item) {
- return !((action.name ==='Action 2') && (item.name === "Frank Livingston")) &&
- !(action.name === 'Start' && item.started);
- };
-
- $scope.updateMenuActionForItemFn = function(action, item) {
- if (action.name === 'Another Action') {
- action.isVisible = (item.name !== "John Smith");
- }
- };
-
- $scope.exampleChartConfig = {
- 'chartId': 'pctChart',
- 'units': 'GB',
- 'thresholds': {
- 'warning':'60',
- 'error':'90'
- }
- };
-
- $scope.selectType = 'checkbox';
- $scope.updateSelectionType = function() {
- if ($scope.selectType === 'checkbox') {
- $scope.config.selectItems = false;
- $scope.config.showSelectBox = true;
- } else if ($scope.selectType === 'row') {
- $scope.config.selectItems = true;
- $scope.config.showSelectBox = false;
- } else {
- $scope.config.selectItems = false;
- $scope.config.showSelectBox = false;
- }
- };
-
- $scope.showDisabled = false;
-
- $scope.config = {
- selectItems: false,
- multiSelect: false,
- dblClick: false,
- dragEnabled: false,
- dragEnd: dragEnd,
- dragMoved: dragMoved,
- dragStart: dragStart,
- selectionMatchProp: 'name',
- selectedItems: [],
- itemsAvailable: true,
- checkDisabled: checkDisabledItem,
- showSelectBox: true,
- useExpandingRows: false,
- onSelect: handleSelect,
- onSelectionChange: handleSelectionChange,
- onCheckBoxChange: handleCheckBoxChange,
- onClick: handleClick,
- onDblClick: handleDblClick
- };
-
- var performEmptyStateAction = function (action) {
- $scope.eventText = action.name + "\r\n" + $scope.eventText;
- };
-
- $scope.emptyStateConfig = {
- icon: 'pficon-warning-triangle-o',
- title: 'No Items Available',
- info: "This is the Empty State component. The goal of a empty state pattern is to provide a good first impression that helps users to achieve their goals. It should be used when a view is empty because no objects exists and you want to guide the user to perform specific actions.",
- helpLink: {
- label: 'For more information please see',
- urlLabel: 'pfExample',
- url : '#/api/patternfly.views.directive:pfEmptyState'
- }
- };
-
- $scope.emptyStateActionButtons = [
- {
- name: 'Main Action',
- title: 'Perform an action',
- actionFn: performEmptyStateAction,
- type: 'main'
- },
- {
- name: 'Secondary Action 1',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- },
- {
- name: 'Secondary Action 2',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- },
- {
- name: 'Secondary Action 3',
- title: 'Perform an action',
- actionFn: performEmptyStateAction
- }
- ];
-
- $scope.items = [
- {
- name: "Fred Flintstone",
- address: "20 Dinosaur Way",
- city: "Bedrock",
- state: "Washingstone"
- },
- {
- name: "John Smith",
- address: "415 East Main Street",
- city: "Norfolk",
- state: "Virginia",
- disableRowExpansion: true
- },
- {
- name: "Frank Livingston",
- address: "234 Elm Street",
- city: "Pittsburgh",
- state: "Pennsylvania"
- },
- {
- name: "Linda McGovern",
- address: "22 Oak Street",
- city: "Denver",
- state: "Colorado"
- },
- {
- name: "Jim Brown",
- address: "72 Bourbon Way",
- city: "Nashville",
- state: "Tennessee"
- },
- {
- name: "Holly Nichols",
- address: "21 Jump Street",
- city: "Hollywood",
- state: "California"
- },
- {
- name: "Marie Edwards",
- address: "17 Cross Street",
- city: "Boston",
- state: "Massachusetts"
- },
- {
- name: "Pat Thomas",
- address: "50 Second Street",
- city: "New York",
- state: "New York"
- }
- ];
-
- $scope.getMenuClass = function (item) {
- var menuClass = "";
- if (item.name === "Jim Brown") {
- menuClass = 'red';
- }
- return menuClass;
- };
-
- $scope.hideMenuActions = function (item) {
- return (item.name === "Marie Edwards");
- };
-
- var performAction = function (action, item) {
- $scope.eventText = item.name + " : " + action.name + "\r\n" + $scope.eventText;
- };
-
- var startServer = function (action, item) {
- $scope.eventText = item.name + " : " + action.name + "\r\n" + $scope.eventText;
- item.started = true;
- };
-
- var buttonInclude = ' {{actionButton.name}}';
- $templateCache.put('my-button-template', buttonInclude);
-
- var startButtonInclude = '{{item.started ? "Starting" : "Start"}} ';
- $templateCache.put('start-button-template', startButtonInclude);
-
- $scope.actionButtons = [
- {
- name: 'Start',
- class: 'btn-primary',
- include: 'start-button-template',
- title: 'Start the server',
- actionFn: startServer
- },
- {
- name: 'Action 1',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Action 2',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Action 3',
- include: 'my-button-template',
- title: 'Do something special',
- actionFn: performAction
- }
- ];
- $scope.menuActions = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performAction
- },
- {
- name: 'Grouped Action 2',
- title: 'Do something similar',
- actionFn: performAction
- }
- ];
- }
- ]);
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{item.hostCount}} Hosts
-
-
-
-
-
-
- {{item.clusterCount}} Clusters
-
-
-
-
-
-
- {{item.nodeCount}} Nodes
-
-
-
-
-
-
- {{item.imageCount}} Images
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Events:
-
-
-
-
-
-
-
- angular.module('patternfly.views').controller('CompoundExanspansionCtrl', ['$scope', '$templateCache',
- function ($scope, $templateCache) {
- $scope.eventText = '';
- var handleCheckBoxChange = function (item, selected, e) {
- $scope.eventText = item.name + ' checked: ' + item.selected + '\r\n' + $scope.eventText;
- };
-
- $scope.enableButtonForItemFn = function(action, item) {
- return !((action.name ==='Action 2') && (item.name === "Frank Livingston")) &&
- !(action.name === 'Start' && item.started);
- };
-
- $scope.updateMenuActionForItemFn = function(action, item) {
- if (action.name === 'Another Action') {
- action.isVisible = (item.name !== "John Smith");
- }
- };
-
- $scope.customScope = {
- toggleExpandItemField: function(item, field) {
- if (item.isExpanded && item.expandField === field) {
- item.isExpanded = false;
- } else {
- item.isExpanded = true;
- item.expandField = field;
- }
- },
- collapseItem: function(item) {
- item.isExpanded = false;
- },
- isItemExpanded: function(item, field) {
- return item.isExpanded && item.expandField === field;
- }
- };
-
- $scope.selectType = 'checkbox';
- $scope.showDisabled = false;
-
- $scope.config = {
- selectionMatchProp: 'name',
- selectedItems: [],
- itemsAvailable: true,
- showSelectBox: true,
- useExpandingRows: true,
- compoundExpansionOnly: true,
- onCheckBoxChange: handleCheckBoxChange
- };
-
- $scope.items = [
- {
- name: "Event One",
- typeIcon: "fa fa-plane ",
- hostCount: 8,
- clusterCount: 6,
- nodeCount: 10,
- imageCount: 8
- },
- {
- name: "Event Two",
- typeIcon: "fa fa-magic ",
- hostCount: 8,
- clusterCount: 6,
- nodeCount: 10,
- imageCount: 8
- },
- {
- name: "Event Three",
- typeIcon: "fa fa-gamepad ",
- hostCount: 8,
- clusterCount: 6,
- nodeCount: 10,
- imageCount: 8
- },
- {
- name: "Event Four",
- typeIcon: "fa fa-linux ",
- hostCount: 8,
- clusterCount: 6,
- nodeCount: 10,
- imageCount: 8
- },
- {
- name: "Event Five",
- typeIcon: "fa fa-briefcase ",
- hostCount: 8,
- clusterCount: 6,
- nodeCount: 10,
- imageCount: 8
- },
- {
- name: "Event Six",
- typeIcon: "fa fa-coffee ",
- hostCount: 8,
- clusterCount: 6,
- nodeCount: 10,
- imageCount: 8
- }
- ];
-
- $scope.getMenuClass = function (item) {
- var menuClass = "";
- if (item.name === "Jim Brown") {
- menuClass = 'red';
- }
- return menuClass;
- };
-
- $scope.hideMenuActions = function (item) {
- return (item.name === "Marie Edwards");
- };
-
- var performAction = function (action, item) {
- $scope.eventText = item.name + " : " + action.name + "\r\n" + $scope.eventText;
- };
-
- var startServer = function (action, item) {
- $scope.eventText = item.name + " : " + action.name + "\r\n" + $scope.eventText;
- item.started = true;
- };
-
- var buttonInclude = ' {{actionButton.name}}';
- $templateCache.put('my-button-template', buttonInclude);
-
- var startButtonInclude = '{{item.started ? "Starting" : "Start"}} ';
- $templateCache.put('start-button-template', startButtonInclude);
-
- $scope.actionButtons = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- }
- ];
- $scope.menuActions = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performAction
- },
- {
- name: 'Grouped Action 2',
- title: 'Do something similar',
- actionFn: performAction
- }
- ];
- }
- ]);
-
-
- angular.module('patternfly.views').component('itemExpansion', {
- bindings: {
- item: '<'
- },
- templateUrl: 'itemExpansion.html',
- controller: function () {
- 'use strict';
- var ctrl = this;
- }
- });
-
-
-
-
-
-
-
-
-
-
-
-
-
- angular.module('patternfly.views').controller('PaginationCtrl', ['$scope', '$templateCache',
- function ($scope, $templateCache) {
-
- $scope.pageConfig = {
- pageSize: 5
- };
-
- var startServer = function (action, item) {
- console.log(item.name + " : " + action.name);
- };
-
- var performAction = function (action, item) {
- console.log(item.name + " : " + action.name);
- };
-
- $scope.items = [
- {
- name: "Fred Flintstone",
- address: "20 Dinosaur Way",
- city: "Bedrock",
- state: "Washingstone"
- },
- {
- name: "John Smith",
- address: "415 East Main Street",
- city: "Norfolk",
- state: "Virginia"
- },
- {
- name: "Frank Livingston",
- address: "234 Elm Street",
- city: "Pittsburgh",
- state: "Pennsylvania"
- },
- {
- name: "Linda McGovern",
- address: "22 Oak Street",
- city: "Denver",
- state: "Colorado"
- },
- {
- name: "Jim Brown",
- address: "72 Bourbon Way",
- city: "Nashville",
- state: "Tennessee"
- },
- {
- name: "Holly Nichols",
- address: "21 Jump Street",
- city: "Hollywood",
- state: "California"
- },
- {
- name: "Marie Edwards",
- address: "17 Cross Street",
- city: "Boston",
- state: "Massachusetts"
- },
- {
- name: "Pat Thomas",
- address: "50 Second Street",
- city: "New York",
- state: "New York"
- },
- {
- name: "Betty Rubble",
- address: "30 Dinosaur Way",
- city: "Bedrock",
- state: "Washingstone"
- },
- {
- name: "Martha Smith",
- address: "415 East Main Street",
- city: "Norfolk",
- state: "Virginia"
- },
- {
- name: "Liz Livingston",
- address: "234 Elm Street",
- city: "Pittsburgh",
- state: "Pennsylvania"
- },
- {
- name: "Howard McGovern",
- address: "22 Oak Street",
- city: "Denver",
- state: "Colorado"
- },
- {
- name: "Joyce Brown",
- address: "72 Bourbon Way",
- city: "Nashville",
- state: "Tennessee"
- },
- {
- name: "Mike Nichols",
- address: "21 Jump Street",
- city: "Hollywood",
- state: "California"
- },
- {
- name: "Mark Edwards",
- address: "17 Cross Street",
- city: "Boston",
- state: "Massachusetts"
- },
- {
- name: "Chris Thomas",
- address: "50 Second Street",
- city: "New York",
- state: "New York"
- }
- ];
-
- $scope.actionButtons = [
- {
- name: 'Start',
- class: 'btn-primary',
- include: 'start-button-template',
- title: 'Start the server',
- actionFn: startServer
- },
- {
- name: 'Action 1',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Action 2',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Action 3',
- include: 'my-button-template',
- title: 'Do something special',
- actionFn: performAction
- }
- ];
- $scope.menuActions = [
- {
- name: 'Action',
- title: 'Perform an action',
- actionFn: performAction
- },
- {
- name: 'Another Action',
- title: 'Do something else',
- actionFn: performAction
- },
- {
- name: 'Disabled Action',
- title: 'Unavailable action',
- actionFn: performAction,
- isDisabled: true
- },
- {
- name: 'Something Else',
- title: '',
- actionFn: performAction
- },
- {
- isSeparator: true
- },
- {
- name: 'Grouped Action 1',
- title: 'Do something',
- actionFn: performAction
- },
- {
- name: 'Grouped Action 2',
- title: 'Do something similar',
- actionFn: performAction
- }
- ];
- }
- ]);
-
-
- */
diff --git a/src/views/listview/examples/nodes-content.html b/src/views/listview/examples/nodes-content.html
deleted file mode 100644
index 897c4d0fb..000000000
--- a/src/views/listview/examples/nodes-content.html
+++ /dev/null
@@ -1,41 +0,0 @@
-
-
- Nodes for {{$ctrl.item.name}}
-
-
-
- Node 1
- Node 2
- Node 3
- Node 4
- Node 5
- Node 6
- Node 7
- Node 8
- Node 9
- Node 10
-
-
-
-
- Host Name
- file1.nay.redhat.com
- Device Path
- /dev/disk/pci-0000.05:00-sas-0.2-part1
- Time
- January 15, 2016 10:45:11 AM
- Severity
- Warning
- Cluster
- Cluster 1
-
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
- consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
- cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
- proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-
-
-
diff --git a/src/views/listview/list-view.component.js b/src/views/listview/list-view.component.js
deleted file mode 100644
index bd483f834..000000000
--- a/src/views/listview/list-view.component.js
+++ /dev/null
@@ -1,336 +0,0 @@
-angular.module('patternfly.views').component('pfListView', {
- bindings: {
- config: '=?',
- pageConfig: '=?',
- items: '=',
- actionButtons: '=?',
- enableButtonForItemFn: '=?',
- menuActions: '=?',
- hideMenuForItemFn: '=?',
- menuClassForItemFn: '=?',
- updateMenuActionForItemFn: '=?',
- actions: '=?',
- updateActionForItemFn: '=?',
- customScope: '=?',
- emptyStateConfig: '=?',
- emptyStateActionButtons: '=?'
- },
- transclude: {
- expandedContent: '?listExpandedContent'
- },
- templateUrl: 'views/listview/list-view.html',
- controller: function ($window, $element, $timeout) {
- 'use strict';
- var ctrl = this;
- var prevPageConfig, prevItems;
-
- var setDropMenuLocation = function (parentDiv) {
- var dropButton = parentDiv.querySelector('.dropdown-toggle');
- var dropMenu = parentDiv.querySelector('.dropdown-menu');
-
- var parentRect = $element[0].querySelector('.list-view-pf.list-view-pf-view').getBoundingClientRect();
- var buttonRect = dropButton.getBoundingClientRect();
- var menuRect = dropMenu.getBoundingClientRect();
-
- var buttonTop = buttonRect.top - parentRect.top;
- var buttonBottom = buttonTop + buttonRect.height;
- var menuTop = buttonTop - menuRect.height;
- var menuBottom = buttonBottom + menuRect.height;
-
- if ((menuBottom <= parentRect.height) || (menuTop < 0)) {
- ctrl.dropdownClass = 'dropdown';
- } else {
- ctrl.dropdownClass = 'dropup';
- }
-
- // OK to display the menu now
- ctrl.kebabMenuReady = true;
- };
-
- ctrl.defaultConfig = {
- selectItems: false,
- multiSelect: false,
- dblClick: false,
- dragEnabled: false,
- dragEnd: null,
- dragMoved: null,
- dragStart: null,
- selectionMatchProp: 'uuid',
- selectedItems: [],
- checkDisabled: false,
- useExpandingRows: false,
- showSelectBox: true,
- onSelect: null,
- onSelectionChange: null,
- onCheckBoxChange: null,
- onClick: null,
- onDblClick: null,
- itemsAvailable: true
- };
-
-
- ctrl.dropdownClass = 'dropdown';
-
- ctrl.handleButtonAction = function (action, item) {
- if (!ctrl.checkDisabled(item) && action && action.actionFn && ctrl.enableButtonForItem(action, item)) {
- action.actionFn(action, item);
- }
- };
-
- ctrl.handleMenuAction = function (action, item) {
- if (!ctrl.checkDisabled(item) && action && action.actionFn && (action.isDisabled !== true)) {
- action.actionFn(action, item);
- }
- };
-
- ctrl.enableButtonForItem = function (action, item) {
- var enable = true;
- if (typeof ctrl.enableButtonForItemFn === 'function') {
- return ctrl.enableButtonForItemFn(action, item);
- }
- return enable;
- };
-
- ctrl.updateActions = function (item) {
- if (typeof ctrl.updateMenuActionForItemFn === 'function') {
- ctrl.menuActions.forEach(function (action) {
- ctrl.updateMenuActionForItemFn(action, item);
- });
- }
- };
-
- ctrl.getMenuClassForItem = function (item) {
- var menuClass = '';
- if (angular.isFunction(ctrl.menuClassForItemFn)) {
- menuClass = ctrl.menuClassForItemFn(item);
- }
-
- return menuClass;
- };
-
- ctrl.hideMenuForItem = function (item) {
- var hideMenu = false;
- if (angular.isFunction(ctrl.hideMenuForItemFn)) {
- hideMenu = ctrl.hideMenuForItemFn(item);
- }
-
- return hideMenu;
- };
-
- ctrl.toggleItemExpansion = function (item) {
- item.isExpanded = !item.isExpanded;
- };
-
- ctrl.setupActions = function (item, event) {
- // Ignore disabled items completely
- if (ctrl.checkDisabled(item)) {
- return;
- }
-
- // update the actions based on the current item
- ctrl.updateActions(item);
-
- // Hide the kebab until we determine dropup or dropdown to avoid flicker
- ctrl.kebabMenuReady = false;
-
- $timeout(function() {
- var parentDiv = undefined;
- var nextElement;
-
- nextElement = event.target;
- while (nextElement && !parentDiv) {
- if (nextElement.className.indexOf('dropdown-kebab-pf') !== -1) {
- parentDiv = nextElement;
- if (nextElement.className.indexOf('open') !== -1) {
- setDropMenuLocation(parentDiv);
- }
- }
- nextElement = nextElement.parentElement;
- }
- });
- };
-
- ctrl.itemClick = function (e, item) {
- var alreadySelected;
- var selectionChanged = false;
- var continueEvent = true;
- var enableRowExpansion = ctrl.config && ctrl.config.useExpandingRows && !ctrl.config.compoundExpansionOnly && item && !item.disableRowExpansion;
-
- // Ignore disabled item clicks completely
- if (ctrl.checkDisabled(item)) {
- return continueEvent;
- }
-
- if (ctrl.config && ctrl.config.selectItems && item) {
- if (ctrl.config.multiSelect && !ctrl.config.dblClick) {
-
- alreadySelected = _.find(ctrl.config.selectedItems, function (itemObj) {
- return itemObj === item;
- });
-
- if (alreadySelected) {
- // already selected so deselect
- ctrl.config.selectedItems = _.without(ctrl.config.selectedItems, item);
- } else {
- // add the item to the selected items
- ctrl.config.selectedItems.push(item);
- selectionChanged = true;
- }
- } else {
- if (ctrl.config.selectedItems[0] === item) {
- if (!ctrl.config.dblClick) {
- ctrl.config.selectedItems = [];
- selectionChanged = true;
- }
- continueEvent = false;
- } else {
- ctrl.config.selectedItems = [item];
- selectionChanged = true;
- }
- }
-
- if (selectionChanged && ctrl.config.onSelect) {
- ctrl.config.onSelect(item, e);
- }
- if (selectionChanged && ctrl.config.onSelectionChange) {
- ctrl.config.onSelectionChange(ctrl.config.selectedItems, e);
- }
- }
- if (ctrl.config.onClick) {
- if (ctrl.config.onClick(item, e) !== false && enableRowExpansion) {
- ctrl.toggleItemExpansion(item);
- }
- } else if (enableRowExpansion) {
- ctrl.toggleItemExpansion(item);
- }
-
- return continueEvent;
- };
-
- ctrl.dblClick = function (e, item) {
- // Ignore disabled item clicks completely
- if (ctrl.checkDisabled(item)) {
- return continueEvent;
- }
-
- if (ctrl.config.onDblClick) {
- ctrl.config.onDblClick(item, e);
- }
- return true;
- };
-
- ctrl.checkBoxChange = function (item) {
- if (ctrl.config.onCheckBoxChange) {
- ctrl.config.onCheckBoxChange(item);
- }
- };
-
- ctrl.isSelected = function (item) {
- var matchProp = ctrl.config.selectionMatchProp;
- var selected = false;
-
- if (ctrl.config.showSelectBox) {
- selected = item.selected;
- } else if (ctrl.config.selectItems && ctrl.config.selectedItems.length) {
- selected = _.find(ctrl.config.selectedItems, function (itemObj) {
- return itemObj[matchProp] === item[matchProp];
- });
- }
- return selected;
- };
-
- ctrl.checkDisabled = function (item) {
- return ctrl.config.checkDisabled && ctrl.config.checkDisabled(item);
- };
-
- function setPagination () {
- if (angular.isUndefined(ctrl.pageConfig)) {
- ctrl.pageConfig = {
- pageNumber: 1,
- pageSize: ctrl.items.length,
- numTotalItems: ctrl.items.length,
- showPaginationControls: false
- };
- } else {
- if (angular.isUndefined(ctrl.pageConfig.showPaginationControls)) {
- ctrl.pageConfig.showPaginationControls = true;
- }
- if (!angular.isNumber(ctrl.pageConfig.pageNumber)) {
- ctrl.pageConfig.pageNumber = 1;
- }
- if (!angular.isNumber(ctrl.pageConfig.pageSize)) {
- ctrl.pageConfig.pageSize = 10;
- }
- if (!angular.isNumber(ctrl.pageConfig.numTotalItems)) {
- ctrl.pageConfig.numTotalItems = ctrl.items.length;
- }
- // if not showing pagination, keep pageSize equal to numTotalItems
- if (!ctrl.pageConfig.showPaginationControls) {
- ctrl.pageConfig.pageSize = ctrl.pageConfig.numTotalItems;
- }
- }
- prevPageConfig = angular.copy(ctrl.pageConfig);
- }
-
- ctrl.$onInit = function () {
- if (angular.isUndefined(ctrl.config)) {
- ctrl.config = {};
- }
-
- _.defaults(ctrl.config, ctrl.defaultConfig);
-
- if (!ctrl.config.selectItems) {
- ctrl.config.selectedItems = [];
- }
- if (!ctrl.config.multiSelect && ctrl.config.selectedItems && ctrl.config.selectedItems.length > 0) {
- ctrl.config.selectedItems = [ctrl.config.selectedItems[0]];
- }
- if (ctrl.config.selectItems && ctrl.config.showSelectBox) {
- throw new Error('pfListView - ' +
- 'Illegal use of pListView component! ' +
- 'Cannot allow both select box and click selection in the same list view.');
- }
- prevItems = angular.copy(ctrl.items);
- setPagination();
- };
-
- ctrl.$doCheck = function () {
- if (!angular.equals(ctrl.pageConfig, prevPageConfig)) {
- setPagination();
- }
- if (!angular.equals(ctrl.items, prevItems)) {
- if (ctrl.items) {
- ctrl.config.itemsAvailable = ctrl.items.length > 0;
- }
- if (angular.isDefined(ctrl.pageConfig)) {
- ctrl.pageConfig.numTotalItems = ctrl.items.length;
- }
- prevItems = angular.copy(ctrl.items);
- }
- };
-
- ctrl.dragEnd = function () {
- if (angular.isFunction(ctrl.config.dragEnd)) {
- ctrl.config.dragEnd();
- }
- };
-
- ctrl.dragMoved = function () {
- if (angular.isFunction(ctrl.config.dragMoved)) {
- ctrl.config.dragMoved();
- }
- };
-
- ctrl.isDragOriginal = function (item) {
- return (item === ctrl.dragItem);
- };
-
- ctrl.dragStart = function (item) {
- ctrl.dragItem = item;
-
- if (angular.isFunction(ctrl.config.dragStart)) {
- ctrl.config.dragStart(item);
- }
- };
- }
-});
diff --git a/src/views/listview/list-view.html b/src/views/listview/list-view.html
deleted file mode 100644
index 415139f8e..000000000
--- a/src/views/listview/list-view.html
+++ /dev/null
@@ -1,76 +0,0 @@
-
-
-
-
diff --git a/src/views/listview/list-view.less b/src/views/listview/list-view.less
deleted file mode 100644
index 5f0fe07b8..000000000
--- a/src/views/listview/list-view.less
+++ /dev/null
@@ -1,5 +0,0 @@
-.list-group-item-header {
- &.list-group-item-not-selectable {
- cursor: inherit;
- }
-}
diff --git a/src/views/view-utils.js b/src/views/view-utils.js
deleted file mode 100644
index bca93a90e..000000000
--- a/src/views/view-utils.js
+++ /dev/null
@@ -1,60 +0,0 @@
-(function () {
- 'use strict';
-
- /**
- * @ngdoc object
- * @name patternfly.views.pfViewUtils
- * @description
- * A utility constant to return view objects used for Dashboard, Card, Table, List, and Topology view switcher types.
- * @example
- *
- * $scope.viewsConfig = {
- * views: [pfViewUtils.getListView(), pfViewUtils.getCardView(), pfViewUtils.getTableView()]
- * };
- *
- * Each getXxxxView() returns an object:
- *
- * .id - (String) Unique id for the view, used for comparisons
- * .title - (String) Optional title, uses as a tooltip for the view selector
- * .iconClass - (String) Icon class to use for the view selector
- *
- * Please see {@link patternfly.toolbars.directive:pfToolbar pfToolbar} for use in Toolbar View Switcher
- */
- angular.module('patternfly.views').constant('pfViewUtils', {
- getDashboardView: function (title) {
- return {
- id: 'dashboardView',
- title: title || 'Dashboard View',
- iconClass: 'fa fa-dashboard'
- };
- },
- getCardView: function (title) {
- return {
- id: 'cardView',
- title: title || 'Card View',
- iconClass: 'fa fa-th'
- };
- },
- getListView: function (title) {
- return {
- id: 'listView',
- title: title || 'List View',
- iconClass: 'fa fa-th-list'
- };
- },
- getTableView: function (title) {
- return {
- id: 'tableView',
- title: title || 'Table View',
- iconClass: 'fa fa-table'
- };
- },
- getTopologyView: function (title) {
- return {
- id: 'topologyView',
- title: title || 'Topology View',
- iconClass: 'fa fa-sitemap'
- };
- }
- });
-})();
diff --git a/src/views/views.less b/src/views/views.less
deleted file mode 100644
index f552814db..000000000
--- a/src/views/views.less
+++ /dev/null
@@ -1,120 +0,0 @@
-.card-view-pf {
- overflow: auto;
- padding-left: 2px;
- padding-top: 20px;
- .card {
- -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .175);
- background: @color-pf-white;
- border-top: 2px solid transparent;
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.175);
- display: block;
- float: left;
- height: 290px;
- margin-bottom: 20px;
- margin-right: 20px;
- padding: 10px;
- position: relative;
- text-align: center;
- width: 260px;
- .card-check-box {
- left: 10px;
- position: absolute;
- top: 8px;
- visibility: hidden;
- width: 20px;
- z-index: 3;
- }
- &:hover {
- -moz-box-shadow: 0px 3px 10px -2px rgba(0,0,0,0.24);
- -webkit-box-shadow: 0px 3px 10px -2px rgba(0,0,0,0.24);
- border: 1px solid @color-pf-black-300;
- box-shadow: 0px 3px 10px -2px rgba(0,0,0,0.24);
- .card-check-box {
- visibility: visible;
- }
- }
- &:focus {
- -moz-box-shadow: 0px 3px 10px -2px rgba(0,0,0,0.24);
- -webkit-box-shadow: 0px 3px 10px -2px rgba(0,0,0,0.24);
- border: 1px solid @color-pf-black-300;
- box-shadow: 0px 3px 10px -2px rgba(0,0,0,0.24);
- }
- }
- .card-content {
- height: 100%;
- margin: 2px 0 10px 0;
- overflow: auto;
- width: 100%;
- }
- .card-title {
- color: #1186C1;
- font-size: 16px;
- font-weight: 500;
- line-height: 1.1;
- margin-top: 0px;
- }
- .card.active {
- border: solid 3px @color-pf-blue-300;
- &:hover {
- border: solid 3px @color-pf-blue-300;
- .pficon {
- color: @color-pf-white;
- }
- }
- &:focus {
- border: solid 3px @color-pf-blue-300;
- .pficon {
- color: @color-pf-white;
- }
- }
- .pficon {
- color: @color-pf-white;
- }
- .card-check-box {
- visibility: visible;
- }
- }
- .card.disabled {
- -moz-box-shadow: none;
- -webkit-box-shadow: none;
- border: 1px solid @color-pf-black-200;
- box-shadow: none;
- color: @color-pf-black-500;
- cursor: not-allowed;
- }
-}
-.card.disabled {
- &:hover {
- -moz-box-shadow: none;
- -webkit-box-shadow: none;
- border: 1px solid @color-pf-black-200;
- box-shadow: none;
- color: @color-pf-black-500;
- cursor: not-allowed;
- }
- &:focus {
- -moz-box-shadow: none;
- -webkit-box-shadow: none;
- border: 1px solid @color-pf-black-200;
- box-shadow: none;
- color: @color-pf-black-500;
- cursor: not-allowed;
- }
-}
-/* overriding pf base so that blank slate fills entire parent container */
-.blank-slate-pf {
- height:100%;
- margin-bottom: 0px;
- button {
- margin-right: 4px;
- }
- .blank-state-pf-helpbutton {
- padding-left: 0;
- padding-right: 0;
- vertical-align: baseline;
- }
-}
-/* overriding pf base so that buttons have spaces between them */
-.pf-expand-placeholder {
- margin-right: 15px;
-}
diff --git a/src/views/views.module.js b/src/views/views.module.js
deleted file mode 100644
index 2e2296b65..000000000
--- a/src/views/views.module.js
+++ /dev/null
@@ -1,9 +0,0 @@
-/**
- * @name patternfly
- *
- * @description
- * Views module for patternfly.
- *
- */
-angular.module('patternfly.views', ['patternfly.utils', 'patternfly.filters', 'patternfly.sort', 'patternfly.charts',
- 'dndLists', 'patternfly.pagination']);
diff --git a/src/wizard/examples/wizard.js b/src/wizard/examples/wizard.js
deleted file mode 100644
index f504a0ca3..000000000
--- a/src/wizard/examples/wizard.js
+++ /dev/null
@@ -1,340 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.wizard.directive:pfWizard
- * @restrict E
- *
- * @description
- * Component for rendering a Wizard modal. Each wizard dynamically creates the step navigation both in the header and the left-hand side based on nested steps.
- * Use pf-wizard-step to define individual steps within a wizard and pf-wizard-substep to define portions of pf-wizard-steps if so desired. For instance, Step one can have two substeps - 1A and 1B when it is logical to group those together.
- *
- * The basic structure should be:
- *
- *
- *
- *
- *
- *
- *
- *
- *
- *
- *
- * @param {string} wizardTitle The wizard title displayed in the header
- * @param {boolean=} hideIndicators Hides the step indicators in the header of the wizard
- * @param {boolean=} activeStepTitleOnly Shows the title only for the active step in the step indicators, optional, default is false.
- * @param {boolean=} hideSidebar Hides page navigation sidebar on the wizard pages
- * @param {boolean=} hideHeader Optional value to hide the title bar. Default is false.
- * @param {boolean=} hideBackButton Optional value to hide the back button, useful in 2 step wizards. Default is false.
- * @param {string=} stepClass Optional CSS class to be given to the steps page container. Used for the sidebar panel as well unless a sidebarClass is provided.
- * @param {string=} sidebarClass Optional CSS class to be give to the sidebar panel. Only used if the stepClass is also provided.
- * @param {string=} contentHeight The height the wizard content should be set to. This is used ONLY if the stepClass is not given. This defaults to 300px if the property is not supplied.
- * @param {boolean=} hideIndicators Hides the step indicators in the header of the wizard
- * @param {string=} currentStep The current step can be changed externally - this is the title of the step to switch the wizard to
- * @param {string=} cancelTitle The text to display on the cancel button
- * @param {string=} backTitle The text to display on the back button
- * @param {string=} nextTitle The text to display on the next button
- * @param {function(step)=} backCallback Called to notify when the back button is clicked
- * @param {function(step)=} nextCallback Called to notify when the next button is clicked
- * @param {function()=} onFinish Called to notify when when the wizard is complete. Returns a boolean value to indicate if the finish operation is complete
- * @param {function()=} onCancel Called when the wizard is canceled, returns a boolean value to indicate if cancel is successful
- * @param {boolean} wizardReady Value that is set when the wizard is ready
- * @param {boolean=} wizardDone Value that is set when the wizard is done
- * @param {string} loadingWizardTitle The text displayed when the wizard is loading
- * @param {string=} loadingSecondaryInformation Secondary descriptive information to display when the wizard is loading
- * @param {boolean=} embedInPage Value that indicates wizard is embedded in a page (not a modal). This moves the navigation buttons to the left hand side of the footer and removes the close button.
- * @param {function(step, index)=} onStepChanged Called when the wizard step is changed, passes in the step and the step index of the step changed to
- * @deprecated {string} title The wizard title displayed in the head (use wizardTitle instead)
- * @example
-
-
-
- Launch Wizard
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Deployment in progress
-
Lorem ipsum dolor sit amet, porta at suspendisse ac, ut wisi vivamus, lorem sociosqu eget nunc amet.
-
-
-
-
Deployment was successful
-
Lorem ipsum dolor sit amet, porta at suspendisse ac, ut wisi vivamus, lorem sociosqu eget nunc amet.
-
View Deployment
-
-
-
-
-
-
- angular.module('patternfly.wizard').controller('WizardModalController', ['$scope', '$timeout', '$uibModal', '$rootScope',
- function ($scope, $timeout, $uibModal, $rootScope) {
- $scope.openWizardModel = function () {
- var wizardDoneListener,
- modalInstance = $uibModal.open({
- animation: true,
- backdrop: 'static',
- templateUrl: 'wizard-container.html',
- controller: 'WizardController',
- size: 'lg'
- });
-
- var closeWizard = function (e, reason) {
- modalInstance.dismiss(reason);
- wizardDoneListener();
- };
-
- modalInstance.result.then(function () { }, function () { });
-
- wizardDoneListener = $rootScope.$on('wizard.done', closeWizard);
- };
- }
- ]);
- angular.module('patternfly.wizard').controller('WizardController', ['$scope', '$timeout', '$rootScope',
- function ($scope, $timeout, $rootScope) {
-
-
- var initializeWizard = function () {
- $scope.data = {
- name: '',
- description: '',
- lorem: 'default setting',
- ipsum: ''
- };
- $scope.secondaryLoadInformation = 'ipsum dolor sit amet, porta at suspendisse ac, ut wisi vivamus, lorem sociosqu eget nunc amet.';
-
- $scope.wizardReady = false;
- $timeout(function () {
- $scope.wizardReady = true;
- }, 1000);
-
- $scope.nextButtonTitle = "Next >";
- };
-
- var startDeploy = function () {
- $timeout(function() { }, 10000);
- $scope.deployInProgress = true;
- };
-
- $scope.data = {};
-
- $scope.firstStepNextTooltip = "First step next";
- $scope.firstStepPrevTooltip = "First step back";
- $scope.secondStepNextTooltip = "Second step next";
- $scope.secondStepPrevTooltip = "Second step back";
- $scope.reviewStepNextTooltip = "Review step next";
- $scope.reviewStepPrevTooltip = "Review step back";
-
- $scope.nextCallback = function (step) {
- // call startdeploy after deploy button is clicked on review-summary tab
- if (step.stepId === 'review-summary') {
- startDeploy();
- }
- return true;
- };
- $scope.backCallback = function (step) {
- return true;
- };
-
- $scope.stepChanged = function (step, index) {
- if (step.stepId === 'review-summary') {
- $scope.nextButtonTitle = "Deploy";
- } else if (step.stepId === 'review-progress') {
- $scope.nextButtonTitle = "Close";
- } else {
- $scope.nextButtonTitle = "Next >";
- }
- };
-
- $scope.cancelDeploymentWizard = function () {
- $rootScope.$emit('wizard.done', 'cancel');
- };
-
- $scope.finishedWizard = function () {
- $rootScope.$emit('wizard.done', 'done');
- return true;
- };
-
- initializeWizard();
- }
- ]);
-
- angular.module('patternfly.wizard').controller('DetailsGeneralController', ['$rootScope', '$scope',
- function ($rootScope, $scope) {
- 'use strict';
-
- $scope.reviewTemplate = "review-template.html";
- $scope.detailsGeneralComplete = false;
- $scope.focusSelectors = ['#new-name'];
- $scope.onShow = function() { };
-
- $scope.updateName = function() {
- $scope.detailsGeneralComplete = angular.isDefined($scope.data.name) && $scope.data.name.length > 0;
- };
- }
- ]);
-
- angular.module('patternfly.wizard').controller('DetailsReviewController', ['$rootScope', '$scope',
- function ($rootScope, $scope) {
- 'use strict';
-
- // Find the data!
- var next = $scope;
- while (angular.isUndefined($scope.data)) {
- next = next.$parent;
- if (angular.isUndefined(next)) {
- $scope.data = {};
- } else {
- $scope.data = next.$ctrl.wizardData;
- }
- }
- }
- ]);
-
- angular.module('patternfly.wizard').controller('SecondStepController', ['$rootScope', '$scope',
- function ($rootScope, $scope) {
- 'use strict';
-
- $scope.focusSelectors = ['.invalid-classname', '#step-two-new-lorem'];
- }
- ]);
-
- angular.module('patternfly.wizard').controller('SummaryController', ['$rootScope', '$scope', '$timeout',
- function ($rootScope, $scope, $timeout) {
- 'use strict';
- $scope.pageShown = false;
-
- $scope.onShow = function () {
- $scope.pageShown = true;
- $timeout(function () {
- $scope.pageShown = false; // done so the next time the page is shown it updates
- });
- }
- }
- ]);
-
- angular.module('patternfly.wizard').controller('DeploymentController', ['$rootScope', '$scope', '$timeout',
- function ($rootScope, $scope, $timeout) {
- 'use strict';
-
- $scope.onShow = function() {
- $scope.deploymentComplete = false;
- $timeout(function() {
- $scope.deploymentComplete = true;
- }, 2500);
- };
- }
- ]);
-
-
-*/
diff --git a/src/wizard/wizard-buttons.js b/src/wizard/wizard-buttons.js
deleted file mode 100644
index 2dc7c79a2..000000000
--- a/src/wizard/wizard-buttons.js
+++ /dev/null
@@ -1,112 +0,0 @@
-(function () {
- 'use strict';
-
- var findWizard = function (scope) {
- var wizard;
-
- if (scope) {
- if (angular.isDefined(scope.wizard)) {
- wizard = scope.wizard;
- } else {
- wizard = findWizard(scope.$parent);
- }
- }
-
- return wizard;
- };
-
- var setupCallback = function (scope, button, fnName, callback) {
- button.on("click", function (e) {
- e.preventDefault();
- scope.$apply(function () {
- // scope apply in button module
- scope.wizard[fnName](callback);
- });
- });
- };
-
- angular.module('patternfly.wizard').component('pfWizNext', {
- bindings: {
- callback: "=?"
- },
- controller: function ($element, $scope) {
- var ctrl = this;
-
- ctrl.$onInit = function () {
- $scope.wizard = findWizard($scope);
- };
-
- ctrl.$postLink = function () {
- setupCallback($scope, $element, 'next', ctrl.callback);
- };
- }
- });
-
- angular.module('patternfly.wizard').component('pfWizPrevious', {
- bindings: {
- callback: "=?"
- },
- controller: function ($element, $scope) {
- var ctrl = this;
-
- ctrl.$onInit = function () {
- $scope.wizard = findWizard($scope);
- };
-
- ctrl.$postLink = function () {
- setupCallback($scope, $element, 'previous', ctrl.callback);
- };
- }
- });
-
- angular.module('patternfly.wizard').component('pfWizFinish', {
- bindings: {
- callback: "=?"
- },
- controller: function ($element, $scope) {
- var ctrl = this;
-
- ctrl.$onInit = function () {
- $scope.wizard = findWizard($scope);
- };
-
- ctrl.$postLink = function () {
- setupCallback($scope, $element, 'finish', ctrl.callback);
- };
- }
- });
-
- angular.module('patternfly.wizard').component('pfWizCancel', {
- bindings: {
- callback: "=?"
- },
- controller: function ($element, $scope) {
- var ctrl = this;
-
- ctrl.$onInit = function () {
- $scope.wizard = findWizard($scope);
- };
-
- ctrl.$postLink = function () {
- setupCallback($scope, $element, 'cancel', ctrl.callback);
- };
- }
- });
-
- angular.module('patternfly.wizard').component('pfWizReset', {
- bindings: {
- callback: "=?"
- },
- controller: function ($element, $scope) {
- var ctrl = this;
-
- ctrl.$onInit = function () {
- $scope.wizard = findWizard($scope);
- };
-
- ctrl.$postLink = function () {
- setupCallback($scope, $element, 'reset', ctrl.callback);
- };
- }
- });
-})();
diff --git a/src/wizard/wizard-review-page.component.js b/src/wizard/wizard-review-page.component.js
deleted file mode 100644
index b6b05bb63..000000000
--- a/src/wizard/wizard-review-page.component.js
+++ /dev/null
@@ -1,69 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.wizard.directive:pfWizardReviewPage
- * @restrict E
- *
- * @description
- * Component for rendering a Wizard Review Page - should only be used within a wizard.
- *
- * @param {boolean} shown Value watched internally by the wizard review page to know when it is visible.
- * @param {object} wizardData Sets the internal content of the review page to apply wizard data to the review templates.
- *
- */
-angular.module('patternfly.wizard').component('pfWizardReviewPage', {
- bindings: {
- shown: '<',
- wizardData: "<"
- },
- templateUrl: 'wizard/wizard-review-page.html',
- controller: function ($scope) {
- 'use strict';
- var ctrl = this;
-
- var findWizard = function (scope) {
- var wizard;
- if (scope) {
- if (angular.isDefined(scope.wizard)) {
- wizard = scope.wizard;
- } else {
- wizard = findWizard(scope.$parent);
- }
- }
-
- return wizard;
- };
-
- ctrl.$onInit = function () {
- ctrl.reviewSteps = [];
- ctrl.wizard = findWizard($scope.$parent);
- };
-
- ctrl.$onChanges = function (changesObj) {
- if (changesObj.shown) {
- if (changesObj.shown.currentValue) {
- ctrl.updateReviewSteps();
- }
- }
- };
-
- ctrl.toggleShowReviewDetails = function (step) {
- if (step.showReviewDetails === true) {
- step.showReviewDetails = false;
- } else {
- step.showReviewDetails = true;
- }
- };
-
- ctrl.getSubStepNumber = function (step, substep) {
- return step.getStepDisplayNumber(substep);
- };
-
- ctrl.getReviewSubSteps = function (reviewStep) {
- return reviewStep.getReviewSteps();
- };
-
- ctrl.updateReviewSteps = function () {
- ctrl.reviewSteps = ctrl.wizard.getReviewSteps();
- };
- }
-});
diff --git a/src/wizard/wizard-review-page.html b/src/wizard/wizard-review-page.html
deleted file mode 100644
index f276656ba..000000000
--- a/src/wizard/wizard-review-page.html
+++ /dev/null
@@ -1,27 +0,0 @@
-
diff --git a/src/wizard/wizard-step.component.js b/src/wizard/wizard-step.component.js
deleted file mode 100644
index 8dba62939..000000000
--- a/src/wizard/wizard-step.component.js
+++ /dev/null
@@ -1,350 +0,0 @@
-/**
- * @ngdoc directive
- * @name patternfly.wizard.directive:pfWizardStep
- * @restrict E
- *
- * @description
- * Component for rendering a Wizard step. Each step can stand alone or have substeps. This directive can only be used as a child of pf-wizard.
- *
- * @param {string} stepTitle The step title displayed in the header and used for the review screen when displayed
- * @param {string} stepId Sets the text identifier of the step
- * @param {number} stepPriority This sets the priority of this wizard step relative to other wizard steps. They should be numbered sequentially in the order they should be viewed.
- * @param {boolean} substeps Sets whether this step has substeps
- * @param {boolean=} nextEnabled Sets whether the next button should be enabled when this step is first displayed
- * @param {boolean=} prevEnabled Sets whether the back button should be enabled when this step is first displayed
- * @param {string=} nextTooltip The text to display as a tooltip on the next button
- * @param {string=} prevTooltip The text to display as a tooltip on the back button
- * @param {boolean=} wzDisabled Hides the step when set to True
- * @param {boolean} okToNavAway Sets whether or not it's ok for the user to leave this page
- * @param {boolean} allowClickNav Sets whether the user can click on the numeric step indicators to navigate directly to this step
- * @param {string=} description The step description (optional)
- * @param {object} wizardData Data passed to the step that is shared by the entire wizard
- * @param {function()=} onShow The function called when the wizard shows this step
- * @param {object=} focusSelectors Array of selectors to be used (in the order given) to find the initial focus component for the page
- * @param {boolean=} showReview Indicates whether review information should be displayed for this step when the review step is reached
- * @param {boolean=} showReviewDetails Indicators whether the review information should be expanded by default when the review step is reached
- * @param {string=} reviewTemplate The template that should be used for the review details screen
- */
-angular.module('patternfly.wizard').component('pfWizardStep', {
- transclude: true,
- bindings: {
- stepTitle: '@',
- stepId: '@',
- stepPriority: '@',
- substeps: '=?',
- nextEnabled: '',
- prevEnabled: '',
- nextTooltip: '',
- prevTooltip: '',
- disabled: '@?wzDisabled',
- okToNavAway: '',
- allowClickNav: '',
- description: '@',
- wizardData: '=',
- onShow: '=?',
- focusSelectors: '',
- showReview: '@?',
- showReviewDetails: '@?',
- reviewTemplate: '@?'
- },
- templateUrl: 'wizard/wizard-step.html',
- controller: function ($timeout, $scope) {
- 'use strict';
-
- var ctrl = this,
- firstRun;
-
- var stepIdx = function (step) {
- var idx = 0;
- var res = -1;
- angular.forEach(ctrl.getEnabledSteps(), function (currStep) {
- if (currStep === step) {
- res = idx;
- }
- idx++;
- });
- return res;
- };
-
- var unselectAll = function () {
- //traverse steps array and set each "selected" property to false
- angular.forEach(ctrl.getEnabledSteps(), function (step) {
- step.selected = false;
- });
- //set selectedStep variable to null
- ctrl.selectedStep = null;
- };
-
- var stepByTitle = function (titleToFind) {
- var foundStep = null;
- angular.forEach(ctrl.getEnabledSteps(), function (step) {
- if (step.stepTitle === titleToFind) {
- foundStep = step;
- }
- });
- return foundStep;
- };
-
- var findWizard = function (scope) {
- var wizard;
- if (scope) {
- if (angular.isDefined(scope.wizard)) {
- wizard = scope.wizard;
- } else {
- wizard = findWizard(scope.$parent);
- }
- }
-
- return wizard;
- };
-
- ctrl.$onInit = function () {
- firstRun = true;
- ctrl.steps = [];
- ctrl.context = {};
- ctrl.title = ctrl.stepTitle;
- ctrl.wizard = findWizard($scope.$parent);
- ctrl.contentStyle = ctrl.wizard.contentStyle;
-
- // Provide wizard step controls to sub-steps
- $scope.wizardStep = this;
-
- ctrl.wizard.addStep(ctrl);
- ctrl.pageNumber = ctrl.wizard.getStepNumber(ctrl);
-
- if (angular.isUndefined(ctrl.nextEnabled)) {
- ctrl.nextEnabled = true;
- }
- if (angular.isUndefined(ctrl.prevEnabled)) {
- ctrl.prevEnabled = true;
- }
- if (angular.isUndefined(ctrl.showReview)) {
- ctrl.showReview = false;
- }
- if (angular.isUndefined(ctrl.showReviewDetails)) {
- ctrl.showReviewDetails = false;
- }
- if (angular.isUndefined(ctrl.stepPriority)) {
- ctrl.stepPriority = 999;
- } else {
- ctrl.stepPriority = parseInt(ctrl.stepPriority);
- }
- if (angular.isUndefined(ctrl.okToNavAway)) {
- ctrl.okToNavAway = true;
- }
- if (angular.isUndefined(ctrl.allowClickNav)) {
- ctrl.allowClickNav = true;
- }
-
- if (ctrl.substeps && !ctrl.onShow) {
- ctrl.onShow = function () {
- $timeout(function () {
- if (!ctrl.selectedStep) {
- ctrl.goTo(ctrl.getEnabledSteps()[0]);
- }
- }, 10);
- };
- }
- };
-
- ctrl.$onChanges = function (changesObj) {
- if (changesObj.nextTooltip) {
- if (_.get(ctrl.wizard, 'selectedStep') === ctrl) {
- ctrl.wizard.nextTooltip = changesObj.nextTooltip.currentValue;
- }
- }
-
- if (changesObj.prevTooltip) {
- if (_.get(ctrl.wizard, 'selectedStep') === ctrl) {
- ctrl.wizard.prevTooltip = changesObj.prevTooltip.currentValue;
- }
- }
- };
-
- ctrl.getEnabledSteps = function () {
- return ctrl.steps.filter(function (step) {
- return step.disabled !== 'true';
- });
- };
-
- ctrl.getReviewSteps = function () {
- var reviewSteps = ctrl.getEnabledSteps().filter(function (step) {
- return !angular.isUndefined(step.reviewTemplate);
- });
- return reviewSteps;
- };
-
- ctrl.resetNav = function () {
- ctrl.goTo(ctrl.getEnabledSteps()[0]);
- };
-
- ctrl.currentStepNumber = function () {
- //retrieve current step number
- return stepIdx(ctrl.selectedStep) + 1;
- };
-
- ctrl.getStepNumber = function (step) {
- return stepIdx(step) + 1;
- };
-
- ctrl.isNextEnabled = function () {
- var enabled = angular.isUndefined(ctrl.nextEnabled) || ctrl.nextEnabled;
- if (ctrl.substeps && ctrl.selectedStep) {
- enabled = enabled && ctrl.selectedStep.isNextEnabled();
- }
- return enabled;
- };
-
- ctrl.isPrevEnabled = function () {
- var enabled = angular.isUndefined(ctrl.prevEnabled) || ctrl.prevEnabled;
- if (ctrl.substeps && ctrl.selectedStep) {
- enabled = enabled && ctrl.selectedStep.isPrevEnabled();
- }
- return enabled;
- };
-
- ctrl.getStepDisplayNumber = function (step) {
- return ctrl.pageNumber + String.fromCharCode(65 + stepIdx(step)) + ".";
- };
-
- ctrl.prevStepsComplete = function (nextStep) {
- var nextIdx = stepIdx(nextStep);
- var complete = true;
- angular.forEach(ctrl.getEnabledSteps(), function (step, stepIndex) {
- if (stepIndex < nextIdx) {
- complete = complete && step.nextEnabled;
- }
- });
- return complete;
- };
-
- ctrl.goTo = function (step) {
- var focusElement = null;
-
- if (ctrl.wizard.isWizardDone() || !step.okToNavAway || step === ctrl.selectedStep) {
- return;
- }
-
- if (firstRun || (ctrl.getStepNumber(step) < ctrl.currentStepNumber() && ctrl.selectedStep.prevEnabled) || ctrl.prevStepsComplete(step)) {
- unselectAll();
- ctrl.selectedStep = step;
- if (step) {
- step.selected = true;
- ctrl.wizard.setPageSelected(step);
-
- if (angular.isFunction (ctrl.selectedStep.onShow)) {
- ctrl.selectedStep.onShow();
- }
-
- // Give time for onShow to do its thing (maybe update the selectors), then time to display the elements
- $timeout(function () {
- if (step.focusSelectors) {
- _.find(step.focusSelectors, function (selector) {
- return focusElement = document.querySelector(selector);
- });
- }
-
- // Default to next button if it is enabled
- if (!focusElement && step.nextEnabled) {
- focusElement = document.querySelector('.wizard-pf-next');
- }
-
- // Use cancel button if we haven't found anything else to set focus on
- if (!focusElement) {
- focusElement = document.querySelector('.wizard-pf-cancel');
- }
-
- if (focusElement) {
- focusElement.focus();
- }
- }, 300);
-
- ctrl.currentStep = step.stepTitle;
-
- firstRun = false;
- }
- ctrl.wizard.updateSubStepNumber (stepIdx(ctrl.selectedStep));
- }
- };
-
- ctrl.stepClick = function (step) {
- if (step.allowClickNav) {
- ctrl.goTo(step);
- }
- };
-
- ctrl.addStep = function (step) {
- // Insert the step into step array
- var insertBefore = _.find(ctrl.steps, function (nextStep) {
- return nextStep.stepPriority > step.stepPriority;
- });
- if (insertBefore) {
- ctrl.steps.splice(ctrl.steps.indexOf(insertBefore), 0, step);
- } else {
- ctrl.steps.push(step);
- }
- };
-
- ctrl.currentStepTitle = function () {
- return ctrl.selectedStep.stepTitle;
- };
-
- ctrl.currentStepDescription = function () {
- return ctrl.selectedStep.description;
- };
-
- ctrl.currentStep = function () {
- return ctrl.selectedStep;
- };
-
- ctrl.totalStepCount = function () {
- return ctrl.getEnabledSteps().length;
- };
-
- // Method used for next button within step
- ctrl.next = function (callback) {
- var enabledSteps = ctrl.getEnabledSteps();
-
- // Save the step you were on when next() was invoked
- var index = stepIdx(ctrl.selectedStep);
-
- // Check if callback is a function
- if (angular.isFunction (callback)) {
- if (callback(ctrl.selectedStep)) {
- if (index === enabledSteps.length - 1) {
- return false;
- }
- // Go to the next step
- ctrl.goTo(enabledSteps[index + 1]);
- return true;
- }
- return true;
- }
-
- // Completed property set on scope which is used to add class/remove class from progress bar
- ctrl.selectedStep.completed = true;
-
- // Check to see if this is the last step. If it is next behaves the same as finish()
- if (index === enabledSteps.length - 1) {
- return false;
- }
- // Go to the next step
- ctrl.goTo(enabledSteps[index + 1]);
- return true;
- };
-
- ctrl.previous = function (callback) {
- var index = stepIdx(ctrl.selectedStep);
- var goPrev = false;
-
- // Check if callback is a function
- if (!angular.isFunction (callback) || callback(ctrl.selectedStep)) {
- if (index !== 0) {
- ctrl.goTo(ctrl.getEnabledSteps()[index - 1]);
- goPrev = true;
- }
- }
- return goPrev;
- };
- }
-});
diff --git a/src/wizard/wizard-step.html b/src/wizard/wizard-step.html
deleted file mode 100644
index 9f463af98..000000000
--- a/src/wizard/wizard-step.html
+++ /dev/null
@@ -1,15 +0,0 @@
-
diff --git a/src/wizard/wizard-substep.component.js b/src/wizard/wizard-substep.component.js
deleted file mode 100644
index 89872efa4..000000000
--- a/src/wizard/wizard-substep.component.js
+++ /dev/null
@@ -1,113 +0,0 @@
-/** @ngdoc directive
-* @name patternfly.wizard.directive:pfWizardSubstep
-* @restrict E
-*
-* @description
-* Component for rendering a Wizard substep. Each substep must be a child of a pf-wizardstep in a pf-wizard directive.
-*
-* @param {string} stepTitle The step title displayed in the header and used for the review screen when displayed
-* @param {string} stepId Sets the text identifier of the step
-* @param {number} stepPriority This sets the priority of this wizard step relative to other wizard steps. They should be numbered sequentially in the order they should be viewed.
-* @param {boolean=} nextEnabled Sets whether the next button should be enabled when this step is first displayed
-* @param {boolean=} prevEnabled Sets whether the back button should be enabled when this step is first displayed
-* @param {boolean=} wzDisabled Hides the step when set to True
-* @param {boolean} okToNavAway Sets whether or not it's ok for the user to leave this page
-* @param {boolean=} allowClickNav Sets whether the user can click on the numeric step indicators to navigate directly to this step
-* @param {string=} description The step description
-* @param {object} wizardData Data passed to the step that is shared by the entire wizard
-* @param {function()=} onShow The function called when the wizard shows this step
-* @param {object=} focusSelectors Array of selectors to be used (in the order given) to find the initial focus component for the page
-* @param {boolean=} showReviewDetails Indicators whether the review information should be expanded by default when the review step is reached
-* @param {string=} reviewTemplate The template that should be used for the review details screen
-*/
-angular.module('patternfly.wizard').component('pfWizardSubstep', {
- transclude: true,
- bindings: {
- stepTitle: '@',
- stepId: '@',
- stepPriority: '@',
- nextEnabled: '',
- prevEnabled: '',
- okToNavAway: '',
- allowClickNav: '',
- disabled: '@?wzDisabled',
- description: '@',
- wizardData: '=',
- onShow: '=?',
- focusSelectors: '',
- showReviewDetails: '@?',
- reviewTemplate: '@?'
- },
- templateUrl: 'wizard/wizard-substep.html',
- controller: function ($scope) {
- 'use strict';
- var ctrl = this;
-
- ctrl.$onInit = function () {
- var findWizardStep = function (scope) {
- var wizardStep;
-
- if (scope) {
- if (angular.isDefined(scope.wizardStep)) {
- wizardStep = scope.wizardStep;
- } else {
- wizardStep = findWizardStep(scope.$parent);
- }
- }
-
- return wizardStep;
- };
-
- ctrl.step = findWizardStep($scope);
-
- if (angular.isUndefined(ctrl.nextEnabled)) {
- ctrl.nextEnabled = true;
- }
- if (angular.isUndefined(ctrl.prevEnabled)) {
- ctrl.prevEnabled = true;
- }
- if (angular.isUndefined(ctrl.showReviewDetails)) {
- ctrl.showReviewDetails = false;
- }
- if (angular.isUndefined(ctrl.stepPriority)) {
- ctrl.stepPriority = 999;
- } else {
- ctrl.stepPriority = parseInt(ctrl.stepPriority);
- }
- if (angular.isUndefined(ctrl.okToNavAway)) {
- ctrl.okToNavAway = true;
- }
- if (angular.isUndefined(ctrl.allowClickNav)) {
- ctrl.allowClickNav = true;
- }
-
- ctrl.step.okToNavAway = ctrl.okToNavAway;
- ctrl.step.allowClickNav = ctrl.allowClickNav;
-
- ctrl.title = ctrl.stepTitle;
- ctrl.step.addStep(ctrl);
- };
-
- ctrl.$onChanges = function (changesObj) {
- if (!ctrl.step) {
- return;
- }
-
- if (changesObj.okToNavAway) {
- ctrl.step.okToNavAway = changesObj.okToNavAway.currentValue;
- }
-
- if (changesObj.allowClickNav) {
- ctrl.step.allowClickNav = changesObj.allowClickNav.currentValue;
- }
- };
-
- ctrl.isNextEnabled = function () {
- return angular.isUndefined(ctrl.nextEnabled) || ctrl.nextEnabled;
- };
-
- ctrl.isPrevEnabled = function () {
- return angular.isUndefined(ctrl.prevEnabled) || ctrl.prevEnabled;
- };
- }
-});
diff --git a/src/wizard/wizard-substep.html b/src/wizard/wizard-substep.html
deleted file mode 100644
index 557252dcc..000000000
--- a/src/wizard/wizard-substep.html
+++ /dev/null
@@ -1,2 +0,0 @@
-
-
diff --git a/src/wizard/wizard.component.js b/src/wizard/wizard.component.js
deleted file mode 100644
index cecb4ed39..000000000
--- a/src/wizard/wizard.component.js
+++ /dev/null
@@ -1,405 +0,0 @@
-angular.module('patternfly.wizard').component('pfWizard', {
- transclude: true,
- bindings: {
- title: '@',
- wizardTitle: '@',
- hideIndicators: '',
- activeStepTitleOnly: '',
- hideSidebar: '@',
- hideHeader: '@',
- hideBackButton: '@',
- sidebarClass: '@',
- stepClass: '@',
- contentHeight: '',
- currentStep: '',
- cancelTitle: '',
- backTitle: '',
- nextTitle: '',
- backCallback: '',
- nextCallback: '',
- onFinish: '&',
- onCancel: '&',
- wizardReady: '',
- wizardDone: '',
- loadingWizardTitle: '',
- loadingSecondaryInformation: '',
- embedInPage: '',
- onStepChanged: '&?'
- },
- templateUrl: 'wizard/wizard.html',
- controller: function ($timeout, $scope) {
- 'use strict';
- var ctrl = this,
- firstRun;
-
- var stepIdx = function (step) {
- var idx = 0;
- var res = -1;
- angular.forEach(ctrl.getEnabledSteps(), function (currStep) {
- if (currStep === step) {
- res = idx;
- }
- idx++;
- });
- return res;
- };
-
- var unselectAll = function () {
- //traverse steps array and set each "selected" property to false
- angular.forEach(ctrl.getEnabledSteps(), function (step) {
- step.selected = false;
- });
- //set selectedStep variable to null
- ctrl.selectedStep = null;
- };
-
- var stepByTitle = function (titleToFind) {
- var foundStep = null;
- angular.forEach(ctrl.getEnabledSteps(), function (step) {
- if (step.title === titleToFind) {
- foundStep = step;
- }
- });
- return foundStep;
- };
-
- ctrl.$onInit = function () {
- firstRun = true;
- ctrl.steps = [];
- ctrl.context = {};
- ctrl.hideHeader = ctrl.hideHeader === 'true';
- ctrl.hideSidebar = ctrl.hideSidebar === 'true';
- ctrl.hideBackButton = ctrl.hideBackButton === 'true';
- ctrl.activeStepTitleOnly = ctrl.activeStepTitleOnly === true;
-
- // Use the wizardTitle first, if non-existent use the deprecated title parameter
- ctrl.wizardTitle = ctrl.wizardTitle || ctrl.title;
-
- // If a step class is given use it for all steps
- if (angular.isDefined(ctrl.stepClass)) {
-
- // If a sidebarClass is given, us it for sidebar panel, if not, apply the stepsClass to the sidebar panel
- if (angular.isUndefined(ctrl.sidebarClass)) {
- ctrl.sidebarClass = ctrl.stepClass;
- }
- } else {
- // No step class give, setup the content style to allow scrolling and a fixed height
- if (angular.isUndefined(ctrl.contentHeight)) {
- ctrl.contentHeight = '300px';
- }
- ctrl.contentStyle = {
- 'height': ctrl.contentHeight,
- 'max-height': ctrl.contentHeight,
- 'overflow-y': 'auto'
- };
- }
-
- if (angular.isUndefined(ctrl.wizardReady)) {
- ctrl.wizardReady = true;
- }
-
- if (!ctrl.cancelTitle) {
- ctrl.cancelTitle = "Cancel";
- }
- if (!ctrl.backTitle) {
- ctrl.backTitle = "< Back";
- }
- if (!ctrl.nextTitle) {
- ctrl.nextTitle = "Next >";
- }
- };
-
- ctrl.$onChanges = function (changesObj) {
- var step;
-
- if (changesObj.hideHeader) {
- ctrl.hideHeader = ctrl.hideHeader === 'true';
- }
-
- if (changesObj.hideSidebar) {
- ctrl.hideSidebar = ctrl.hideSidebar === 'true';
- }
-
- if (changesObj.hideBackButton) {
- ctrl.hideBackButton = ctrl.hideBackButton === 'true';
- }
-
- if (changesObj.wizardReady && changesObj.wizardReady.currentValue) {
- ctrl.goTo(ctrl.getEnabledSteps()[0]);
- }
-
- if (changesObj.currentStep) {
- //checking to make sure currentStep is truthy value
- step = changesObj.currentStep.currentValue;
- if (!step) {
- return;
- }
-
- //setting stepTitle equal to current step title or default title
- if (ctrl.selectedStep && ctrl.selectedStep.title !== step) {
- ctrl.goTo(stepByTitle(step));
- }
- }
- };
-
- ctrl.getEnabledSteps = function () {
- return ctrl.steps.filter(function (step) {
- return step.disabled !== 'true';
- });
- };
-
- ctrl.getReviewSteps = function () {
- return ctrl.steps.filter(function (step) {
- return !step.disabled &&
- (!angular.isUndefined(step.reviewTemplate) || step.getReviewSteps().length > 0);
- });
- };
-
- ctrl.currentStepNumber = function () {
- //retrieve current step number
- return stepIdx(ctrl.selectedStep) + 1;
- };
-
- ctrl.getStepNumber = function (step) {
- return stepIdx(step) + 1;
- };
-
- ctrl.goTo = function (step, resetStepNav) {
- var focusElement = null;
-
- if (ctrl.wizardDone || (ctrl.selectedStep && !ctrl.selectedStep.okToNavAway) || step === ctrl.selectedStep) {
- return;
- }
-
- if (firstRun || (ctrl.getStepNumber(step) < ctrl.currentStepNumber() && ctrl.selectedStep.isPrevEnabled()) || ctrl.selectedStep.isNextEnabled()) {
- unselectAll();
-
- if (!firstRun && resetStepNav && step.substeps) {
- step.resetNav();
- }
-
- ctrl.selectedStep = step;
- step.selected = true;
-
- $timeout(function () {
- if (angular.isFunction(step.onShow)) {
- step.onShow();
- }
- // Give time for onShow to do its thing (maybe update the selectors), then time to display the elements
- $timeout(function () {
- if (step.focusSelectors) {
- _.find(step.focusSelectors, function (selector) {
- return focusElement = document.querySelector(selector);
- });
- }
-
- // Default to next button if it is enabled
- if (!focusElement && step.nextEnabled) {
- focusElement = document.querySelector('.wizard-pf-next');
- }
-
- // Use cancel button if we haven't found anything else to set focus on
- if (!focusElement) {
- focusElement = document.querySelector('.wizard-pf-cancel');
- }
-
- if (focusElement) {
- focusElement.focus();
- }
- }, 300);
- }, 100);
-
- // Make sure current step is not undefined
- ctrl.currentStep = step.title;
-
- ctrl.nextTooltip = step.nextTooltip;
- ctrl.prevTooltip = step.prevTooltip;
-
- //emit event upwards with data on goTo() invocation
- if (!step.substeps) {
- ctrl.setPageSelected(step);
- }
- firstRun = false;
- }
-
- if (!ctrl.selectedStep.substeps) {
- ctrl.firstStep = stepIdx(ctrl.selectedStep) === 0;
- } else {
- ctrl.firstStep = stepIdx(ctrl.selectedStep) === 0 && ctrl.selectedStep.currentStepNumber() === 1;
- }
- };
-
- ctrl.allowStepIndicatorClick = function (step) {
- return step.allowClickNav &&
- !ctrl.wizardDone &&
- ctrl.selectedStep &&
- ctrl.selectedStep.okToNavAway &&
- (ctrl.selectedStep.nextEnabled || (step.stepPriority < ctrl.selectedStep.stepPriority)) &&
- (ctrl.selectedStep.prevEnabled || (step.stepPriority > ctrl.selectedStep.stepPriority));
- };
-
- ctrl.stepClick = function (step) {
- if (step.allowClickNav &&
- ctrl.selectedStep &&
- !ctrl.wizardDone &&
- ctrl.selectedStep.okToNavAway &&
- (ctrl.selectedStep.nextEnabled || (step.stepPriority < ctrl.selectedStep.stepPriority)) &&
- (ctrl.selectedStep.prevEnabled || (step.stepPriority > ctrl.selectedStep.stepPriority))) {
- ctrl.goTo(step, true);
- }
- };
-
- ctrl.setPageSelected = function (step) {
- if (angular.isFunction(ctrl.onStepChanged)) {
- ctrl.onStepChanged({step: step, index: stepIdx(step)});
- }
- };
-
- ctrl.addStep = function (step) {
- // Insert the step into step array
- var insertBefore = _.find(ctrl.steps, function (nextStep) {
- return nextStep.stepPriority > step.stepPriority;
- });
- if (insertBefore) {
- ctrl.steps.splice(ctrl.steps.indexOf(insertBefore), 0, step);
- } else {
- ctrl.steps.push(step);
- }
-
- if (ctrl.wizardReady && (ctrl.getEnabledSteps().length > 0) && (step === ctrl.getEnabledSteps()[0])) {
- ctrl.goTo(ctrl.getEnabledSteps()[0]);
- }
- };
-
- ctrl.isWizardDone = function () {
- return ctrl.wizardDone;
- };
-
- ctrl.updateSubStepNumber = function (value) {
- ctrl.firstStep = stepIdx(ctrl.selectedStep) === 0 && value === 0;
- };
-
- ctrl.currentStepTitle = function () {
- return ctrl.selectedStep.title;
- };
-
- ctrl.currentStepDescription = function () {
- return ctrl.selectedStep.description;
- };
-
- ctrl.currentStep = function () {
- return ctrl.selectedStep;
- };
-
- ctrl.totalStepCount = function () {
- return ctrl.getEnabledSteps().length;
- };
-
- // Allow access to any step
- ctrl.goToStep = function (step, resetStepNav) {
- var enabledSteps = ctrl.getEnabledSteps();
- var stepTo;
-
- if (angular.isNumber(step)) {
- stepTo = enabledSteps[step];
- } else {
- stepTo = stepByTitle(step);
- }
-
- ctrl.goTo(stepTo, resetStepNav);
- };
-
- // Method used for next button within step
- ctrl.next = function (callback) {
- var enabledSteps = ctrl.getEnabledSteps();
-
- // Save the step you were on when next() was invoked
- var index = stepIdx(ctrl.selectedStep);
-
- callback = callback || ctrl.nextCallback;
-
- if (ctrl.selectedStep.substeps) {
- if (ctrl.selectedStep.next(callback)) {
- return;
- }
- }
-
- // Check if callback is a function
- if (angular.isFunction(callback)) {
- if (callback(ctrl.selectedStep)) {
- if (index < enabledSteps.length - 1) {
- // Go to the next step
- if (enabledSteps[index + 1].substeps) {
- enabledSteps[index + 1].resetNav();
- }
- } else {
- ctrl.finish();
- }
- } else {
- return;
- }
- }
-
- // Completed property set on ctrl which is used to add class/remove class from progress bar
- ctrl.selectedStep.completed = true;
-
- // Check to see if this is the last step. If it is next behaves the same as finish()
- if (index === enabledSteps.length - 1) {
- ctrl.finish();
- } else {
- // Go to the next step
- ctrl.goTo(enabledSteps[index + 1]);
- }
- };
-
- ctrl.previous = function (callback) {
- var index = stepIdx(ctrl.selectedStep);
- callback = callback || ctrl.backCallback;
-
- if (ctrl.selectedStep.substeps) {
- if (ctrl.selectedStep.previous(callback)) {
- return;
- }
- }
-
- // Check if callback is a function
- if (!angular.isFunction(callback) || callback(ctrl.selectedStep)) {
-
- if (index === 0) {
- throw new Error("Can't go back. It's already in step 0");
- } else {
- ctrl.goTo(ctrl.getEnabledSteps()[index - 1]);
- }
- }
- };
-
- ctrl.finish = function () {
- if (ctrl.onFinish) {
- if (ctrl.onFinish() !== false) {
- ctrl.reset();
- }
- }
- };
-
- ctrl.cancel = function () {
- if (ctrl.onCancel) {
- if (ctrl.onCancel() !== false) {
- ctrl.reset();
- }
- }
- };
-
- //reset
- ctrl.reset = function () {
- //traverse steps array and set each "completed" property to false
- angular.forEach(ctrl.getEnabledSteps(), function (step) {
- step.completed = false;
- });
- //go to first step
- ctrl.goToStep(0);
- };
-
- // Provide wizard controls to steps and sub-steps
- $scope.wizard = this;
- }
-});
diff --git a/src/wizard/wizard.html b/src/wizard/wizard.html
deleted file mode 100644
index 68aa93534..000000000
--- a/src/wizard/wizard.html
+++ /dev/null
@@ -1,65 +0,0 @@
-
-
-
-
-
-
-
-
-
-
{{$ctrl.loadingWizardTitle}}
-
{{$ctrl.loadingSecondaryInformation}}
-
-
-
-
-
-
diff --git a/src/wizard/wizard.less b/src/wizard/wizard.less
deleted file mode 100644
index ab8f12234..000000000
--- a/src/wizard/wizard.less
+++ /dev/null
@@ -1,30 +0,0 @@
-.wizard-pf-footer {
- .btn-cancel {
- &.wizard-pf-cancel-no-back {
- margin-right: 0;
- }
- }
-}
-.wizard-pf-singlestep {
- margin-left: 0;
-}
-.wizard-pf-position-override {
- position: relative;
-}
-.wizard-pf-footer-inline {
- text-align: left;
-}
-.wizard-pf-cancel-inline {
- margin-left: 25px;
-}
-
-.wizard-pf-steps-indicator li a.disabled {
- cursor: default;
- &:hover {
- .wizard-pf-step-number {
- background-color: @color-pf-white;
- border-color: @color-pf-black-400;
- color: @color-pf-black-400;
- }
- }
-}
diff --git a/src/wizard/wizard.module.js b/src/wizard/wizard.module.js
deleted file mode 100644
index 1e24f88cd..000000000
--- a/src/wizard/wizard.module.js
+++ /dev/null
@@ -1,12 +0,0 @@
-/**
- * @name PatternFly Wizard
- *
- * @description
- * Wizard module.
- *
- */
-angular.module('patternfly.wizard', ['ui.bootstrap.modal',
- 'ui.bootstrap',
- 'patternfly.form']);
-
-
diff --git a/styles/_angular-patternfly.scss b/styles/_angular-patternfly.scss
deleted file mode 100644
index 28def3bc9..000000000
--- a/styles/_angular-patternfly.scss
+++ /dev/null
@@ -1,18 +0,0 @@
-@import 'patternfly/color-variables';
-@import 'misc';
-@import 'card';
-@import 'charts';
-@import 'views';
-@import 'toolbars';
-@import 'filters';
-@import 'sort';
-@import 'notification';
-@import 'list-view';
-@import 'table';
-@import 'wizard';
-@import 'canvas';
-@import 'canvas-editor';
-@import 'pagination';
-@import 'datepicker';
-@import 'modal-overlay';
-@import 'vertical-navigation';
diff --git a/styles/angular-patternfly.less b/styles/angular-patternfly.less
deleted file mode 100644
index f7820896b..000000000
--- a/styles/angular-patternfly.less
+++ /dev/null
@@ -1,19 +0,0 @@
-@import "../node_modules/patternfly/dist/less/color-variables.less";
-@import "../node_modules/bootstrap/less/variables.less";
-@import "misc.less";
-@import "../src/card/card.less";
-@import "../src/charts/charts.less";
-@import "../src/views/views.less";
-@import "../src/toolbars/toolbars.less";
-@import "../src/filters/filters.less";
-@import "../src/sort/sort.less";
-@import "../src/notification/notification.less";
-@import "../src/views/listview/list-view.less";
-@import "../src/table/table.less";
-@import "../src/wizard/wizard.less";
-@import "../src/canvas-view/canvas/canvas.less";
-@import "../src/canvas-view/canvas-editor/canvas-editor.less";
-@import "../src/pagination/pagination.less";
-@import "../src/datepicker/datepicker.less";
-@import "../src/modals/modal-overlay/modal-overlay.less";
-@import "../src/navigation/vertical-navigation.less";
diff --git a/styles/build.scss b/styles/build.scss
deleted file mode 100644
index 6dfb46c50..000000000
--- a/styles/build.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import 'angular-patternfly';
diff --git a/styles/misc.less b/styles/misc.less
deleted file mode 100644
index 4f97408b0..000000000
--- a/styles/misc.less
+++ /dev/null
@@ -1,19 +0,0 @@
-.navbar-brand-txt {
- line-height: 34px;
-}
-uib-accordion > .panel-group, accordion > .panel-group {
- .panel-default {
- .panel-title > a {
- &:before {
- content: "\f105";
- }
- }
- }
- .panel-open {
- .panel-title > a {
- &:before {
- content: "\f107";
- }
- }
- }
-}
diff --git a/test/autofocus/autofocus.spec.js b/test/autofocus/autofocus.spec.js
deleted file mode 100644
index 264685bc0..000000000
--- a/test/autofocus/autofocus.spec.js
+++ /dev/null
@@ -1,114 +0,0 @@
-describe('pf-autofocus', function () {
- var $scope;
- var $compile;
- var $timeout;
-
- beforeEach(module('patternfly.autofocus'));
- beforeEach(inject(function (_$rootScope_, _$compile_, _$timeout_) {
- $scope = _$rootScope_;
- $compile = _$compile_;
- $timeout = _$timeout_;
- }));
-
- describe('Input with pf-focused directive', function () {
-
- var compileElement = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return el;
- };
-
- it('should be focused when set true', function () {
-
- $scope.iFocused = true;
-
- var page = compileElement('', $scope);
-
- var body = angular.element(document.body);
- body.html(page);
-
- var eFocused = page.find("#i2")[0];
- var eUnfocused = page.find("#i1")[0];
-
- $timeout.flush();
-
- expect(eFocused === document.activeElement).toBe(true);
- expect(eUnfocused === document.activeElement).toBe(false);
-
- });
-
- it('should be focused when set false', function () {
-
- $scope.iFocused1 = false;
- $scope.iFocused2 = false;
-
- var page = compileElement('', $scope);
-
- body = angular.element(document.body);
- body.html(page);
-
- var eUnFocused1 = page.find("#i1")[0];
- var eUnFocused2 = page.find("#i2")[0];
-
- $scope.$apply(function () {
- $scope.iFocused1 = true;
- $scope.iFocused2 = false;
- });
-
- $timeout.flush();
-
- expect(eUnFocused1 === document.activeElement).toBe(true);
- expect(eUnFocused2 === document.activeElement).toBe(false);
-
- $scope.$apply(function () {
- $scope.iFocused1 = false;
- $scope.iFocused2 = true;
- });
-
- $timeout.flush();
-
- expect(eUnFocused1 === document.activeElement).toBe(false);
- expect(eUnFocused2 === document.activeElement).toBe(true);
-
- });
-
- it('should respond to its attribute value', function () {
-
- $scope.iFocused = false;
-
- var page = compileElement('', $scope);
-
- var body = angular.element(document.body);
- body.html(page);
-
- var eUnFocused1 = page.find("#i1")[0];
- var eUnfocused2 = page.find("#i2")[0];
-
- $timeout.flush();
-
- expect(eUnFocused1 === document.activeElement).toBe(false);
- expect(eUnfocused2 === document.activeElement).toBe(false);
-
- $scope.$apply(function () {
- $scope.iFocused = true;
- });
-
- $timeout.flush();
-
- expect(eUnFocused1 === document.activeElement).toBe(false);
- expect(eUnfocused2 === document.activeElement).toBe(true);
-
- $scope.$apply(function () {
- $scope.iFocused = false;
- });
-
- $timeout.flush();
-
- expect(eUnFocused1 === document.activeElement).toBe(false);
-
- // The focus set to true doesn't mean the element looses focus, only that the focus is not guaranteed
- expect(eUnfocused2 === document.activeElement).toBe(true);
-
- });
- });
-});
diff --git a/test/card/aggregate-status/aggregate-status-card.component.spec.js b/test/card/aggregate-status/aggregate-status-card.component.spec.js
deleted file mode 100644
index d1834ec94..000000000
--- a/test/card/aggregate-status/aggregate-status-card.component.spec.js
+++ /dev/null
@@ -1,272 +0,0 @@
-describe('Component: pfAggregateStatusCard', function () {
- var $scope;
- var $compile;
- var element;
- var cardClass;
- var notifications;
-
- beforeEach(module('patternfly.card', 'card/aggregate-status/aggregate-status-card.html'));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- describe('Page with pf-aggregate-status-card component', function () {
-
- var compileCard = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return el;
- };
-
- it("should set the title link, count, and icons class", function () {
-
- $scope.status = {
- "title":"Nodes",
- "count":793,
- "href":"#",
- "iconClass": "fa fa-shield"
- };
-
- element = compileCard(' ', $scope);
-
- //Make sure the count is getting set properly in the title
- expect(angular.element(element).find('.card-pf-aggregate-status-count').html()).toBe("793");
-
- //Make sure a link renders in the title
- expect(angular.element(element).find('.card-pf-title').find('a').length).toBe(1);
-
- //Make sure the class is getting set for the title icon
- expect(angular.element(element).find('.card-pf-title').find('.fa').hasClass('fa-shield')).toBeTruthy();
-
- // By default, showTopBorder if not defined, should be false, resulting in hiding the top
- // border, ie. having a .card-pf class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeFalsy();
- });
-
- it("No link should be present in the title", function () {
-
- $scope.status = {
- "title":"Nodes",
- "count":793,
- "iconClass": "fa fa-shield"
- };
-
- element = compileCard(' ', $scope);
-
- //Make sure a link renders in the title
- expect(angular.element(element).find('.card-pf-title').find('a').length).toBe(0);
- });
-
- it("should set the notifications", function () {
-
- $scope.status = {
- "title":"Nodes",
- "count":793,
- "href":"#",
- "iconClass": "fa fa-shield",
- "notifications":[
- {
- "iconClass":"pficon pficon-error-circle-o",
- "count":4,
- "href":"#"
- },
- {
- "iconClass":"pficon pficon-warning-triangle-o",
- "count":1
- }
- ]
- };
-
- element = compileCard(' ', $scope);
-
- notifications = angular.element(element).find('.card-pf-aggregate-status-notification');
-
- //Make sure two notifications render
- expect(notifications.length).toBe(2);
-
- //First notification should have a link
- expect(notifications.eq(0).find('a').length).toBe(1);
-
- //Second notification should not have a link
- expect(notifications.eq(1).find('a').length).toBe(0);
-
- //first notification should have the following class
- expect(notifications.eq(0).find('span')).toHaveClass('pficon pficon-error-circle-o');
-
- //second notification should have the following class
- expect(notifications.eq(1).find('span')).toHaveClass('pficon pficon-warning-triangle-o');
- });
-
- it("should show the top border", function () {
- element = compileCard(' ', $scope);
-
- // showTopBorder set to true, results in having the .card-pf-accented class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeTruthy();
-
- });
-
- it("should hide the top border", function () {
- element = compileCard(' ', $scope);
-
- // showTopBorder set to false, results in not having the .card-pf-accented class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeFalsy();
- });
-
- it("should show and hide the spinner", function() {
-
- // When data is loaded, spinner should be hidden
- $scope.dataLoading = false;
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.spinner-lg');
- expect(cardClass.length).toBe(0);
-
- // When data is loading, spinner should be present
- $scope.dataLoading = true;
- $scope.$digest();
- cardClass = angular.element(element).find('.spinner-lg');
- expect(cardClass.length).toBe(1);
- });
-
- it("should show and hide the spinner text", function() {
-
- // When no spinner text is given, it should be undefined
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.loading-text');
- expect(cardClass.html()).toBeUndefined();
-
- // When data is loading, spinner text should be present
- $scope.dataLoading = true;
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.loading-text');
- expect(cardClass.html()).toContain('Test Loading Message');
- });
-
- it("should have a loading card height when specified", function() {
-
- // When a height is specified it should be present
- $scope.dataLoading = true;
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.card-pf');
- expect(cardClass.css('height')).toBe('150px');
-
- // When a height is not specified there should be none
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.card-pf');
- expect(cardClass.css('height')).toBe('0px');
- });
-
- it("should show mini layout", function () {
-
- $scope.status = {
- "title":"Nodes",
- "count":793,
- "href":"#",
- "iconClass": "fa fa-shield",
- "notification": {
- "iconClass": "pficon pficon-error-circle-o",
- "count": 4,
- "href": "#"
- }
- };
-
- element = compileCard(' ', $scope);
-
- // should have the mini layout class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-aggregate-status-mini');
- expect(cardClass).toBeTruthy();
-
- // should show the main icon
- cardClass = angular.element(element).find('.fa-shield');
- expect(cardClass.length).toBe(1);
-
- notifications = angular.element(element).find('.card-pf-aggregate-status-notification');
-
- //notification should have an icon
- expect(notifications.eq(0).find('span').hasClass('pficon-error-circle-o')).toBeTruthy();
-
- //notification should have a count
- expect(notifications.eq(0).find('span').eq(1).html()).toBe('4');
-
- });
-
- it("should show mini layout, and hide optional items", function () {
-
- $scope.status = {
- "title":"Nodes",
- "count":793,
- "notification": {
- "count":6
- }
- };
-
- element = compileCard(' ', $scope);
-
- // should have the mini layout class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-aggregate-status-mini');
- expect(cardClass).toBeTruthy();
-
- // should not show the main icon
- cardClass = angular.element(element).find('.fa-shield');
- expect(cardClass.length).toBe(0);
-
- notifications = angular.element(element).find('.card-pf-aggregate-status-notification');
-
- //notification should not have an icon
- expect(notifications.eq(0).find('span').hasClass('pficon-error-circle-o')).toBeFalsy();
-
- //notification should have a count
- expect(notifications.eq(0).find('span').eq(1).html()).toBe('6');
-
-
- $scope.status = {
- "title":"Nodes",
- "count":793,
- "notification": {
- "iconClass":"pficon pficon-error-circle-o"
- }
- };
-
- element = compileCard(' ', $scope);
-
- notifications = angular.element(element).find('.card-pf-aggregate-status-notification');
-
- //notification should have an icon
- expect(notifications.eq(0).find('span').hasClass('pficon-error-circle-o')).toBeTruthy();
-
- //notification should not have a count
- expect(notifications.eq(0).find('span').eq(1).html()).not.toBe('6');
- });
-
- it("should set of the iconImage value", function () {
-
- $scope.aggStatusAlt = {
- "title":"Providers",
- "count":3,
- "notifications":[
- {
- "iconImage":"img/kubernetes.svg",
- "count":1,
- "href":"#"
- },
- {
- "iconImage":"img/OpenShift-logo.svg",
- "count":2
- }
- ]
- };
-
- element = compileCard(' ', $scope);
-
- // should have the images
- imageElements = angular.element(element).find('.card-pf-icon-image');
- expect(imageElements.length).toBe(2);
- expect(angular.element(imageElements[0]).attr('src')).toBe('img/kubernetes.svg');
- expect(angular.element(imageElements[1]).attr('src')).toBe('img/OpenShift-logo.svg');
- });
- });
-});
diff --git a/test/card/basic/card.spec.js b/test/card/basic/card.spec.js
deleted file mode 100644
index 89340e78b..000000000
--- a/test/card/basic/card.spec.js
+++ /dev/null
@@ -1,271 +0,0 @@
-describe('Component: pfCard', function () {
- var $scope;
- var $compile;
- var element;
- var headTitle;
- var subTitle;
- var cardClass;
- var innerContent;
- var isoScope;
-
- beforeEach(module(
- 'patternfly.card',
- 'card/basic/card.html',
- 'card/basic/card-filter.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- describe('Page with pf-card component', function () {
-
- var compileCard = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- isoScope = el.controller("pf-card");
- return el;
- };
-
- it("should set the headTitle and subTitle and inner content", function () {
-
- element = compileCard('Inner content goes here ', $scope);
-
- headTitle = angular.element(element).find('.card-pf-title').html();
- expect(headTitle).toBe("My card title");
-
- subTitle = angular.element(element).find('.card-pf-subtitle').html();
- expect(subTitle).toBe("My card subtitle title");
-
- innerContent = angular.element(element).find('.card-pf-body span').html();
- expect(innerContent).toBe("Inner content goes here");
-
- // By default, showTopBorder if not defined, should be false, resulting in hiding the top
- // border, ie. having a .card-pf class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeFalsy();
- });
-
- it("should show the top border", function () {
-
- element = compileCard('Inner content goes here ', $scope);
-
- // showTopBorder set to true, results in having the .card-pf-accented class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeTruthy();
-
- });
-
- it("should hide the top border", function () {
-
- element = compileCard('Inner content goes here ', $scope);
-
- // showTopBorder set to false, results in not having the .card-pf-accented class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeFalsy();
-
- });
-
- it("should show and hide the bottom border", function () {
-
- // by default, bottom border should be shown
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.card-pf-heading');
- expect(cardClass.length).toBe(1);
- cardClass = angular.element(element).find('.card-pf-heading-no-bottom');
- expect(cardClass.length).toBe(0);
-
- // setting to false should hide the bottom border
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.card-pf-heading');
- expect(cardClass.length).toBe(0);
- cardClass = angular.element(element).find('.card-pf-heading-no-bottom');
- expect(cardClass.length).toBe(1);
-
- // setting to true should show the bottom border
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.card-pf-heading');
- expect(cardClass.length).toBe(1);
- cardClass = angular.element(element).find('.card-pf-heading-no-bottom');
- expect(cardClass.length).toBe(0);
-
- });
-
- it("should show and hide the spinner", function () {
-
- // When data is loaded, spinner should be hidden
- $scope.dataLoading = false;
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.spinner-lg');
- expect(cardClass.length).toBe(0);
-
- // When data is loading, spinner should be present
- $scope.dataLoading = true;
- $scope.$digest();
- cardClass = angular.element(element).find('.spinner-lg');
- expect(cardClass.length).toBe(1);
- });
-
- it("should show and hide the spinner text", function () {
-
- // When no spinner text is given, it should be undefined
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.loading-text');
- expect(cardClass.html()).toBeUndefined();
-
- // When data is loading, spinner text should be present
- $scope.dataLoading = true;
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.loading-text');
- expect(cardClass.html()).toContain('Test Loading Message');
-
- });
-
- it("should hide the action bar footer by default", function () {
-
- // by default, if footer not defined, footer should not be shown
- element = compileCard('Inner content goes here ', $scope);
- cardClass = angular.element(element).find('.card-pf-footer');
- expect(cardClass.length).toBe(0);
- });
-
- it("should show the action bar footer", function () {
-
- // show a footer with a href
- $scope.actionBarConfig = {
- 'href' : '#addCluster',
- 'iconClass' : 'fa fa-plus-circle',
- 'text' : 'Add New Cluster'
- };
-
- element = compileCard('Inner content ', $scope);
- cardClass = angular.element(element).find('a');
- expect(cardClass.attr('href')).toBe('#addCluster');
- var spans = cardClass.find('span');
- expect(spans.length).toBe(2);
- expect(spans.eq(0)).toHaveClass('fa fa-plus-circle');
- expect(spans.eq(1).html()).toBe('Add New Cluster');
-
- // show a footer with a callback function
- $scope.actionBarConfig = {
- 'iconClass' : 'fa fa-flag',
- 'text' : 'View All Events',
- 'callBackFn': function () {
- return "Footer Callback Fn Called";
- }
- };
-
- element = compileCard('Inner content ', $scope);
- cardClass = angular.element(element).find('a');
- expect(cardClass.attr('href')).toBeUndefined();
-
- cardClass.click();
- $scope.$digest();
-
- expect(isoScope.footerCallBackResult).toEqual('Footer Callback Fn Called');
-
- spans = cardClass.find('span');
- expect(spans.length).toBe(2);
- expect(spans.eq(0)).toHaveClass('fa fa-flag');
- expect(spans.eq(1).html()).toBe('View All Events');
- });
-
- it("should hide the filter in the footer by default", function () {
-
- // show a footer with a href
- $scope.actionBarConfig = {
- 'href' : '#addCluster',
- 'iconClass' : 'fa fa-plus-circle',
- 'text' : 'Add New Cluster'
- };
-
- element = compileCard('Inner content ', $scope);
- cardClass = angular.element(element).find('.card-pf-footer').find('button');
- expect(cardClass.length).toBe(0);
- });
-
- it("should show the filter in the footer if specified", function () {
-
- $scope.filterConfig = {
- 'filters' : [
- {label:'Last 30 Days', value:'30'},
- {label:'Last 15 Days', value:'15'},
- {label:'Today', value:'today'}
- ],
- 'callBackFn': function (f) {
- return "Footer Filter Callback Fn Called: label='" + f.label + "' value = " + f.value;
- },
- 'defaultFilter' : 2
- };
-
- element = compileCard('Inner content ', $scope);
-
- // should find 3 filters
- cardClass = angular.element(element).find('.card-pf-footer').find('a');
- expect(cardClass.length).toBe(3);
-
- // test setting default menu item
- var filterItem = angular.element(element).find('.card-pf-footer').find('button');
- expect(filterItem.html()).toContain('Today');
-
- // test callbackfn gets called
- eventFire(cardClass[0], 'click');
- $scope.$digest();
- expect(isoScope.filterCallBackResult).toEqual("Footer Filter Callback Fn Called: label='Last 30 Days' value = 30");
- // test dropdown set after selection
- filterItem = angular.element(element).find('.card-pf-footer').find('button');
- expect(filterItem.html()).toContain('Last 30 Days');
- });
-
- it("should show the filter in the header if specified", function () {
-
- $scope.filterConfig = {
- 'filters' : [{label:'Last 30 Days', value:'30'},
- {label:'Last 15 Days', value:'15'},
- {label:'Today', value:'today'}],
- 'callBackFn': function (f) {
- return "Header Filter Callback Fn Called: label='" + f.label + "' value = " + f.value;
- },
- 'defaultFilter' : 2,
- 'position' : 'header'
- };
-
- element = compileCard('Inner content ', $scope);
-
- // should NOT find any filters in the footer
- cardClass = angular.element(element).find('.card-pf-footer').find('a');
- expect(cardClass.length).toBe(0);
-
- // should find filters in the header
- cardClass = angular.element(element).find('.card-pf-heading').find('a');
- expect(cardClass.length).toBe(3);
-
- // test setting default menu item
- var filterItem = angular.element(element).find('.card-pf-heading').find('button');
- expect(filterItem.html()).toContain('Today');
-
- // test callbackfn gets called
- eventFire(cardClass[0], 'click');
- $scope.$digest();
- expect(isoScope.filterCallBackResult).toEqual("Header Filter Callback Fn Called: label='Last 30 Days' value = 30");
- // test dropdown set after selection
- filterItem = angular.element(element).find('.card-pf-heading').find('button');
- expect(filterItem.html()).toContain('Last 30 Days');
- });
-
- it("should not show the header if no title or filter specified", function () {
-
- element = compileCard('Inner content ', $scope);
-
- // should NOT find any header artifacts
- cardClass = angular.element(element).find('.card-pf-heading');
- expect(cardClass.length).toBe(0);
-
- // should find filters in the header
- cardClass = angular.element(element).find('.card-pf-heading-no-bottom');
- expect(cardClass.length).toBe(0);
- });
- });
-
-});
diff --git a/test/card/info-status/info-status-card.component.spec.js b/test/card/info-status/info-status-card.component.spec.js
deleted file mode 100644
index b59d0210c..000000000
--- a/test/card/info-status/info-status-card.component.spec.js
+++ /dev/null
@@ -1,164 +0,0 @@
-describe('Component: pfInfoStatusCard', function () {
- var $scope;
- var $compile;
- var element;
- var cardClass;
-
- beforeEach(module('patternfly.card', 'card/info-status/info-status-card.html'));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- describe('Page with pf-info-status-card component', function () {
-
- var compileCard = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return el;
- };
-
- it('should set the title link, and icons class', function () {
-
- $scope.status = {
- 'title': 'TinyCore-local',
- 'href': '#',
- 'iconClass': 'fa fa-shield',
- 'info': [
- 'VM Name: aapdemo002'
- ]
- };
-
- element = compileCard(' ', $scope);
-
- //Make sure a link renders in the title
- expect(angular.element(element).find('.card-pf-title').find('a').length).toBe(1);
-
- //Make sure the class is getting set for the title icon
- expect(angular.element(element).find('.fa').hasClass('fa-shield')).toBeTruthy();
-
- // By default, showTopBorder if not defined, should be false, resulting in hiding the top
- // border, ie. having a .card-pf class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeFalsy();
- });
-
- it('No link should be present in the title', function () {
-
- $scope.status = {
- 'title': 'TinyCore-local',
- 'iconClass': 'fa fa-shield',
- 'info': [
- 'VM Name: aapdemo002'
- ]
- };
-
- element = compileCard(' ', $scope);
-
- //Make sure a link renders in the title
- expect(angular.element(element).find('.card-pf-title').find('a').length).toBe(0);
- });
-
- it('should set the info', function () {
-
- $scope.status = {
- 'title': 'TinyCore-local',
- 'href': '#',
- 'iconClass': 'fa fa-shield',
- 'info': [
- 'VM Name: aapdemo002',
- 'Host Name: localhost.localdomian',
- 'IP Address: 10.9.62.100',
- 'Power status: on'
- ]
- };
-
- element = compileCard(' ', $scope);
-
- info = angular.element(element).find('.card-pf-info-item');
-
- //Make sure four info blocks render
- expect(info.length).toBe(4);
- });
-
- it('should show the top border', function () {
- element = compileCard(' ', $scope);
-
- // showTopBorder set to true, results in having the .card-pf-accented class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeTruthy();
- });
-
- it('should hide the top border', function () {
- element = compileCard(' ', $scope);
-
- // showTopBorder set to false, results in not having the .card-pf-accented class
- cardClass = angular.element(element).find('.card-pf').hasClass('card-pf-accented');
- expect(cardClass).toBeFalsy();
- });
-
- it("should show and hide the spinner", function() {
-
- // When data is loaded, spinner should be hidden
- $scope.dataLoading = false;
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.spinner-lg');
- expect(cardClass.length).toBe(0);
-
- // When data is loading, spinner should be present
- $scope.dataLoading = true;
- $scope.$digest();
- cardClass = angular.element(element).find('.spinner-lg');
- expect(cardClass.length).toBe(1);
- });
-
- it("should show and hide the spinner text", function() {
-
- // When no spinner text is given, it should be undefined
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.loading-text');
- expect(cardClass.html()).toBeUndefined();
-
- // When data is loading, spinner text should be present
- $scope.dataLoading = true;
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.loading-text');
- expect(cardClass.html()).toContain('Test Loading Message');
- });
-
- it("should have a loading card height when specified", function() {
-
- // When a height is specified it should be present
- $scope.dataLoading = true;
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.card-pf');
- expect(cardClass.css('height')).toBe('200px');
-
- // When a height is not specified there should be none
- element = compileCard(' ', $scope);
- cardClass = angular.element(element).find('.card-pf');
- expect(cardClass.css('height')).toBe('0px');
- });
-
- it('should set of the iconImage value', function () {
-
- $scope.status = {
- 'iconImage': 'img/OpenShift-logo.svg',
- 'info': [
- 'Infastructure: VMware',
- 'Vmware: 1 CPU (1 socket x 1 core), 1024 MB',
- '12 Snapshots',
- 'Drift History: 1'
- ]
- };
-
- element = compileCard(' ', $scope);
-
- // should have the images
- imageElements = angular.element(element).find('.info-img');
- expect(imageElements.length).toBe(1);
- expect(angular.element(imageElements[0]).attr('src')).toBe('img/OpenShift-logo.svg');
- });
- });
-});
diff --git a/test/charts/c3/c3.spec.js b/test/charts/c3/c3.spec.js
deleted file mode 100644
index f1a221030..000000000
--- a/test/charts/c3/c3.spec.js
+++ /dev/null
@@ -1,27 +0,0 @@
-describe('Directive: pfC3Chart', function () {
- var $scope;
- var $compile;
- var element;
-
- beforeEach(module(
- 'patternfly.charts'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- beforeEach(function () {
- $scope.myChart = "myChartId";
- $scope.chartConfig = {};
- element = ' ';
- element = $compile(element)($scope);
- $scope.$digest();
- });
-
- it("chart should find empty template", function () {
- expect(angular.element(element).html()).toBe('
');
- });
-
-});
diff --git a/test/charts/donut/donut-pct.spec.js b/test/charts/donut/donut-pct.spec.js
deleted file mode 100644
index 6e88deaa9..000000000
--- a/test/charts/donut/donut-pct.spec.js
+++ /dev/null
@@ -1,203 +0,0 @@
-describe('Directive: pfDonutPctChart', function () {
- var $scope;
- var ctrl;
- var $compile;
- var $timeout;
- var element;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/empty-chart.html',
- 'charts/donut/donut-pct-chart.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$timeout_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $timeout = _$timeout_;
- }));
-
- beforeEach(function () {
- $scope.config = {
- 'units': 'MHz',
- 'thresholds':{'warning':'75.0','error':'90.00'},
- 'labelConfig': {
- 'orientation': 'right',
- 'title': 'Lorem Ipsum',
- 'label': 'available',
- 'units': 'MHz'
- }
- };
-
- $scope.data = {
- "used": 950,
- "total": 1000
- };
-
- });
-
- var compileDonut = function (markup) {
- var el = $compile(angular.element(markup))($scope);
- $scope.$apply();
- ctrl = el.controller('pfDonutPctChart');
- return el;
- };
-
- var compileSimpleDonut = function () {
- element = compileDonut(' ');
- };
-
- var compileDonutCenterLabel = function () {
- element = compileDonut(' ');
- };
-
- var compileTooltipDonut = function () {
- element = compileDonut(' ');
- };
-
- it("should have an external label", function () {
- compileSimpleDonut();
- expect(element.find('.pct-donut-chart-pf-right').length).toEqual(1);
- expect(element.find('.pct-donut-chart-pf-label')[0].innerText).toContain('Lorem Ipsum');
- expect(element.find('.pct-donut-chart-pf-label > span')[0].innerText).toContain('50 MHz available');
- });
-
- it("should trigger error threshold", function () {
- compileSimpleDonut();
- expect(ctrl.statusDonutColor().pattern[0]).toBe('#cc0000'); //red
- });
-
- it("should trigger warning threshold", function () {
- compileSimpleDonut();
- $scope.data.used = 850;
- $scope.$digest();
- expect(ctrl.statusDonutColor().pattern[0]).toBe('#ec7a08'); //orange
- });
-
- it("should trigger ok threshold", function () {
- compileSimpleDonut();
- $scope.data.used = 550;
- $scope.$digest();
- expect(ctrl.statusDonutColor().pattern[0]).toBe('#3f9c35'); //green
- });
-
- it("should show no threshold", function () {
- $scope.config = {
- 'units': 'MHz'
- };
- compileSimpleDonut();
- expect(ctrl.statusDonutColor().pattern[0]).toBe('#0088ce'); //blue
- });
-
- it("should show 'used' center label by default", function () {
- compileSimpleDonut();
- expect(ctrl.getCenterLabelText().smText).toContain('Used');
- });
-
- it("should show 'available' center label", function () {
- compileDonutCenterLabel();
- $scope.cntrLabel = 'available';
- $scope.$digest();
- expect(ctrl.getCenterLabelText().smText).toContain('Available');
- });
-
- it("should show 'percent' center label", function () {
- compileDonutCenterLabel();
- $scope.cntrLabel = 'percent';
- $scope.$digest();
- expect(ctrl.getCenterLabelText().bigText).toContain('%');
- });
-
- it("should show no center label", function () {
- compileDonutCenterLabel();
- $scope.cntrLabel = 'none';
- $scope.$digest();
- expect(ctrl.getCenterLabelText().bigText).toBe('');
- expect(ctrl.getCenterLabelText().smText).toBe('');
- });
-
- it("should show 'used' center label", function () {
- compileDonutCenterLabel();
- $scope.cntrLabel = 'used';
- $scope.$digest();
- expect(ctrl.getCenterLabelText().smText).toContain('Used');
- });
-
- it("should use center label funtion", function () {
- compileDonutCenterLabel();
-
- $scope.config.centerLabelFn = function () {
- return '' + $scope.data.available + ' ' +
- 'Free ';
- };
-
- // hack to trigger component $onChanges
- $scope.config = angular.copy($scope.config);
-
- $scope.$digest();
- expect(ctrl.getCenterLabelText().bigText).toContain('50');
- expect(ctrl.getCenterLabelText().bigText).toContain('Free');
- expect(ctrl.getCenterLabelText().smText).toBe('');
- });
-
- it("should show empty chart when the dataAvailable is set to false", function () {
- element = compileDonut(' ');
- var emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(0);
-
- $scope.data.dataAvailable = false;
- $scope.$digest();
-
- emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(1);
- });
-
- it('should have percentage in the tooltip content', function() {
- var d = [{
- name: "Used",
- ratio: .35,
- value: 350
- }];
- compileSimpleDonut();
- expect(ctrl.donutTooltip().contents(d)).toContain('35% Used');
- });
-
- it('should have value and units in tooltip content', function() {
- var d = [{
- name: "Used",
- ratio: .35,
- value: 350
- }];
- compileTooltipDonut();
- $scope.tooltip = "amount";
- $scope.$digest();
- expect(ctrl.donutTooltip().contents(d)).toContain('350 MHz Used');
- });
-
- it('should have value, units, and percentage in tooltip content', function() {
- var d = [{
- name: "Used",
- ratio: .35,
- value: 350
- }];
- compileTooltipDonut();
- $scope.tooltip = "both";
- $scope.$digest();
- expect(ctrl.donutTooltip().contents(d)).toContain('350 MHz Used');
- expect(ctrl.donutTooltip().contents(d)).toContain('35%');
- });
-
- it('should have use config.tooltipFn for tooltip content', function() {
- var d = [{
- name: "Used",
- ratio: .35,
- value: 350
- }];
- $scope.config.tooltipFn = function(d) {
- return "This is the tooltip content.";
- };
- compileSimpleDonut();
- expect(ctrl.donutTooltip().contents(d)).toContain('This is the tooltip content.');
- });
-});
-
diff --git a/test/charts/heatmap/heatmap-legend.spec.js b/test/charts/heatmap/heatmap-legend.spec.js
deleted file mode 100644
index ce648ab9c..000000000
--- a/test/charts/heatmap/heatmap-legend.spec.js
+++ /dev/null
@@ -1,51 +0,0 @@
-describe('Directive: pfHeatmapLegend', function () {
- var $scope;
- var $compile;
- var element;
- var legendItem;
- var legendText;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/heatmap/heatmap-legend.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileChart = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return angular.element(el);
- };
-
- beforeEach(function () {
- });
-
- it("should use the default legend text and colors", function () {
- element = compileChart(' ',$scope);
- expect(angular.element(element).find('li').length).toBe(4);
-
- legendItem = angular.element(element).find('li')[0];
- legendText = legendItem.querySelector('.legend-pf-text');
-
- expect(legendText.innerHTML).toBe("> 90%");
- });
-
- it("should set the legend text and colors", function () {
- $scope.legendLabels = ['<= 70%', '> 70%'];
- $scope.heatmapColorPattern = ['#d4f0fa', '#F9D67A'];
-
- element = compileChart(' ',$scope);
- expect(angular.element(element).find('li').length).toBe(2);
-
- legendItem = angular.element(element).find('li')[0];
- legendText = legendItem.querySelector('.legend-pf-text');
-
- expect(legendText.innerHTML).toBe("> 70%");
- });
-
-
-});
diff --git a/test/charts/heatmap/heatmap.spec.js b/test/charts/heatmap/heatmap.spec.js
deleted file mode 100644
index ee5fa7e58..000000000
--- a/test/charts/heatmap/heatmap.spec.js
+++ /dev/null
@@ -1,123 +0,0 @@
-
-describe('Component: pfHeatmap', function () {
- var $scope;
- var $compile;
- var element;
- var block;
- var tooltip;
- var color;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/empty-chart.html',
- 'charts/heatmap/heatmap.html',
- 'charts/heatmap/heatmap-legend.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$timeout_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $timeout = _$timeout_;
- }));
-
- var compileChart = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- $timeout.flush();
- return angular.element(el);
- };
-
- beforeEach(function () {
- $scope.title = 'Utilization';
- $scope.data = [
- {'id': 9,'value': 0.96,'tooltip': 'Node 8 : My OpenShift Provider 96% : 96 Used of 100 Total 4 Available'},
- {'id': 44, 'value': 0.94, 'tooltip': 'Node 19 : My Kubernetes Provider 94% : 94 Used of 100 Total 6 Available'},
- {'id': 0, 'value': 0.91, 'tooltip': 'Node 9 : My OpenShift Provider 91% : 91 Used of 100 Total 9 Available'},
- {'id': 43, 'value': 0.9, 'tooltip': 'Node 18 : My Kubernetes Provider 90% : 90 Used of 100 Total 10 Available'},
- {'id': 7, 'value': 0.89, 'tooltip': 'Node 12 : My OpenShift Provider 89% : 89 Used of 100 Total 11 Available'},
- {'id': 41, 'value': 0.82, 'tooltip': 'Node 16 : My Kubernetes Provider 82% : 82 Used of 100 Total 18 Available'},
- {'id': 21, 'value': 0.81, 'tooltip': 'Node 21 : My OpenShift Provider 81% : 81 Used of 100 Total 19 Available'}];
- });
-
-
- it("should set the heatmap title", function () {
- element = compileChart(' ',$scope);
-
- expect(angular.element(element).find('h3').html()).toBe('Utilization');
- });
-
- it("should generate 7 blocks", function () {
- element = compileChart(' ',$scope);
-
- expect(angular.element(element).find('.heatmap-pf-svg').find('rect').length).toBe(7);
- });
-
- it("should set color and tooltip of the block based on defaults", function () {
- element = compileChart(' ',$scope);
-
- block = angular.element(element).find('.heatmap-pf-svg').children().first();
- tooltip = block.attr('uib-tooltip-html');
-
- expect(tooltip).toBe("'Node 8 : My OpenShift Provider 96% : 96 Used of 100 Total 4 Available'");
-
- color = block.attr('style');
- var result = color.trim() === 'fill: #ce0000;' || color.trim() === 'fill: rgb(206, 0, 0);';
- expect(result).toBe(true);
- });
-
- it("should block color based on color pattern overrides", function () {
- $scope.legendLabels = ['< 60%','70%', '70-80%' ,'80-90%', '> 90%'];
- $scope.thresholds = [0.6, 0.7, 0.8, 0.9];
- $scope.heatmapColorPattern = ['#d4f0fa', '#F9D67A', '#EC7A08', '#CE0000', '#ff0000'];
-
- element = compileChart(' ',$scope);
-
- block = angular.element(element).find('.heatmap-pf-svg').children().first();
-
- color = block.attr('style');
-
- var result = color.trim() === 'fill: #ff0000;' || color.trim() === 'fill: rgb(255, 0, 0);';
- expect(result).toBe(true);
- });
-
- it("should set color based on threshold overrides", function () {
- $scope.legendLabels = ['< 60%','70%', '70-80%' ,'80-90%', '> 98%'];
- $scope.thresholds = [0.6, 0.7, 0.8, 0.98];
- $scope.heatmapColorPattern = ['#d4f0fa', '#F9D67A', '#EC7A08', '#CE0000', '#ff0000'];
-
- element = compileChart(' ',$scope);
- block = angular.element(element).find('.heatmap-pf-svg').children().first();
- color = block.attr('style');
-
- var result = color.trim() === 'fill: #ce0000;' || color.trim() === 'fill: rgb(206, 0, 0);';
- expect(result).toBe(true);
- });
-
- it("should show a legend by default", function () {
- element = compileChart(' ',$scope);
- var legend = element.find('.heatmap-pf-legend-container');
- expect(legend.length).toBe(1);
- });
-
- it("should not show a legend when set not to", function () {
- $scope.showLegend = false;
- element = compileChart(' ',$scope);
- var legend = element.find('.heatmap-pf-legend-container');
- expect(legend.length).toBe(0);
- });
-
- it("should show empty chart when the chartDataAvailable flag is set to false", function () {
- $scope.chartDataAvailable = true;
- element = compileChart(' ',$scope);
-
- var emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(0);
-
- $scope.chartDataAvailable = false;
-
- $scope.$digest();
-
- emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(1);
- });
-});
diff --git a/test/charts/sparkline/sparkline-chart.spec.js b/test/charts/sparkline/sparkline-chart.spec.js
deleted file mode 100644
index 51e42c7bb..000000000
--- a/test/charts/sparkline/sparkline-chart.spec.js
+++ /dev/null
@@ -1,185 +0,0 @@
-describe('Component: pfSparklineChart', function () {
- var $scope;
- var $compile;
- var $timeout;
- var element;
- var isoloateScope;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/empty-chart.html',
- 'charts/sparkline/sparkline-chart.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$timeout_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $timeout = _$timeout_;
- }));
-
- beforeEach(function () {
- $scope.config = {
- 'chartId': 'testSparklineChart',
- 'totalUnits': 'MHz'
- };
-
- var today = new Date();
- var dates = ['dates'];
- for (var d = 20 - 1; d >= 0; d--) {
- dates.push(new Date(today.getTime() - (d * 24 * 60 * 60 * 1000)));
- }
-
- $scope.data = {
- 'total': '100',
- 'yData': ['used', '10', '20', '30', '20', '30', '10', '14', '20', '25', '68', '54', '56', '78', '56', '67', '88', '76', '65', '87', '76'],
- 'xData': dates
- };
- });
-
- var compileChart = function (markup, scope) {
- element = $compile(angular.element(markup))(scope);
- scope.$apply();
- isolateScope = element.controller('pfSparklineChart');
-
- return element;
- };
-
- it("should not show axis by default", function () {
- element = compileChart(' ',$scope);
-
- expect(isolateScope.sparklineChartId).toBe("testSparklineChartsparklineChart");
- expect(isolateScope.chartConfig.axis.x.show).toBe(false);
- expect(isolateScope.chartConfig.axis.y.show).toBe(false);
- });
-
- it("should allow attribute specifications to show x and y axis", function () {
- element = compileChart(' ', $scope);
-
- expect(isolateScope.sparklineChartId).toBe("testSparklineChartsparklineChart");
- expect(isolateScope.chartConfig.axis.x.show).toBe(true);
- expect(isolateScope.chartConfig.axis.y.show).toBe(true);
- });
-
- it("should update when the show x and y axis attributes change", function () {
- $scope.showX = false;
- $scope.showY = false;
- element = compileChart(' ', $scope);
-
- expect(isolateScope.chartConfig.axis.x.show).toBe(false);
- expect(isolateScope.chartConfig.axis.y.show).toBe(false);
-
- $scope.showX = true;
- $scope.showY = true;
-
- $scope.$digest();
-
- expect(isolateScope.chartConfig.axis.x.show).toBe(true);
- expect(isolateScope.chartConfig.axis.y.show).toBe(true);
- });
-
- it("should allow attribute specification of chart height", function () {
- element = compileChart(' ', $scope);
-
- expect(isolateScope.sparklineChartId).toBe("testSparklineChartsparklineChart");
- expect(isolateScope.chartConfig.size.height).toBe(120);
- });
-
- it("should update when the chart height attribute changes", function () {
- $scope.chartHeight = 120;
- element = compileChart(' ', $scope);
-
- expect(isolateScope.sparklineChartId).toBe("testSparklineChartsparklineChart");
- expect(isolateScope.chartConfig.size.height).toBe(120);
-
- $scope.chartHeight = 100;
- $scope.$digest();
- expect(isolateScope.chartConfig.size.height).toBe(100);
- });
-
- it("should setup C3 chart data correctly", function () {
- element = compileChart(' ', $scope);
-
- expect(isolateScope.config.data.x).toBe("dates");
- expect(isolateScope.config.data.columns.length).toBe(2);
- expect(isolateScope.config.data.columns[0][0]).toBe("dates");
- expect(isolateScope.config.data.columns[1][0]).toBe("used");
- });
-
- it("should update C3 chart data when data changes", function () {
- element = compileChart(' ', $scope);
-
- expect(isolateScope.config.data.x).toBe("dates");
- expect(isolateScope.config.data.columns.length).toBe(2);
- expect(isolateScope.config.data.columns[0][1].toString()).toBe($scope.data.xData[1].toString());
- expect(isolateScope.config.data.columns[1][1]).toBe('10');
-
- var now = new Date();
- $scope.data.xData[1] = now;
- $scope.data.yData[1] = '1000';
-
- $scope.$digest();
-
- expect(isolateScope.chartConfig.data.columns[0][1].toString()).toBe(now.toString());
- expect(isolateScope.chartConfig.data.columns[1][1]).toBe('1000');
- });
-
- it("should allow tooltip type specification", function () {
- $scope.config.tooltipType = "percentage";
- element = compileChart(' ', $scope);
-
- expect(isolateScope.config.tooltipType).toBe("percentage");
- });
-
- it("should allow using a tooltip function", function () {
- var functionCalled = false;
- var myTooltipFn = function (d) {
- if (d && d.length === 2) {
- functionCalled = true;
- }
- };
-
- $scope.config.tooltipFn = myTooltipFn;
- element = compileChart(' ', $scope);
- var dataPoint = [{value: 0, name: 'used'}, 0];
- isolateScope.sparklineTooltip(isolateScope).contents(dataPoint);
-
- expect(functionCalled).toBe(true);
- });
-
- it("should allow using C3 chart data formats", function () {
- $scope.config = {
- chartId: 'testSparklineChart',
- totalUnits: 'MHz',
- data: {
- xFormat: '%Y-%m-%d %H:%M:%S',
- x: 'dates',
- columns: [$scope.data.xData, $scope.data.yData]
- }
- };
- $scope.data = {
- total: 100
- };
-
- element = compileChart(' ', $scope);
-
- expect(isolateScope.config.data.x).toBe("dates");
- expect(isolateScope.config.data.columns.length).toBe(2);
- expect(isolateScope.config.data.columns[0][0]).toBe("dates");
- expect(isolateScope.config.data.columns[1][0]).toBe("used");
- });
-
- it("should show empty chart when the dataAvailable is set to false", function () {
- element = compileChart(' ', $scope);
- var emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(0);
-
- $scope.data.dataAvailable = false;
-
-
- $scope.$digest();
-
- emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(1);
- });
-
-});
diff --git a/test/charts/topology-map/topology-map.spec.js b/test/charts/topology-map/topology-map.spec.js
deleted file mode 100644
index a2d20366f..000000000
--- a/test/charts/topology-map/topology-map.spec.js
+++ /dev/null
@@ -1,152 +0,0 @@
-describe('Component: pfTopologyMap', function () {
- var $compile;
- var $scope;
- var $httpBackend;
- var element;
- var controller;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/topology-map/topology-map.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$httpBackend_) {
- $scope = _$rootScope_;
- $httpBackend = _$httpBackend_;
- $compile = _$compile_;
- $scope.nodes = [
- {
- id: 1,
- title: 'foo',
- size: 16,
- x: 30,
- y: 30,
- fonticon: "fa fa-cog",
- },
- {
- id: 2,
- title: 'foo2',
- x: 150,
- y: 150,
- size: 32,
- }
- ];
- $scope.tooltipStyle = {
- background: 'rgba(0, 0, 0, .5)',
- size: 50,
- };
- $scope.edges = [
- {
- source: 1,
- target: 2,
- }
- ];
- $scope.selectNode = function (node) {};
- $scope.nodeMultiSelect = function (nodes) {};
- compileChart(' ', $scope);
- }));
-
- var compileChart = function (markup, scope) {
- element = $compile(angular.element(markup))(scope);
- scope.$apply();
- controller = element.controller('pfTopologyMap');
- controller.canvasW = 200;
- controller.canvasH = 200;
- return element;
- };
-
- it('Should render canvas element', function () {
- expect(element.find('canvas')).not.toBe(undefined);
- });
-
- it('Component controller should be defined', function () {
- expect(controller).toBeDefined();
- });
-
- it('Component should have nodes', function () {
- expect(controller.nodes).toBeDefined();
- expect(controller.nodes.length).toBe($scope.nodes.length);
- });
-
- it('method findNode() should find correct node', function () {
- expect(controller.findNode(30,30)).toBeDefined();
- expect(controller.findNode(30,30).id).toBe(1);
- expect(controller.findNode(100, 3100)).toBeUndefined();
- });
-
- it('normalizeNode should add node size', function () {
- var node = {};
- controller.normalizeNode(node);
- expect(node.size).toBe(17);
- node.size = 32;
- controller.normalizeNode(node);
- expect(node.size).toBe(32);
- });
-
- it('normalizeNode should prevent node to get out of bounds', function () {
- var node = {x: -10, y: 25};
- controller.normalizeNode(node);
- expect(node.x).toBe(node.size + 1);
- expect(node.y).toBe(25);
-
- node.x = 500;
- node.y = 500;
- controller.normalizeNode(node);
- expect(node.x).toBe(controller.canvasW - node.size - 1);
- expect(node.y).toBe(controller.canvasH - node.size - 1);
-
- node.x = 50;
- node.y = 500;
- controller.normalizeNode(node);
- expect(node.x).toBe(50);
- expect(node.y).toBe(controller.canvasH - node.size - 1);
- });
-
- it('getRealCoordinates should return correct point coordinates', function () {
- var x = 10;
- var y = 10;
- var coordinates = controller.getRealCoordinates(x, y);
- expect(coordinates[0]).toBe(10);
- expect(coordinates[1]).toBe(10);
-
- controller.transform.k = 1.25;
- coordinates = controller.getRealCoordinates(x, y);
- expect(coordinates[0]).toBe(8);
- expect(coordinates[1]).toBe(8);
-
- controller.transform.k = 1.25;
- controller.transform.x = 33;
- controller.transform.y = -16;
- coordinates = controller.getRealCoordinates(x, y);
- expect(coordinates[0]).toBe(-18.4);
- expect(coordinates[1]).toBe(20.8);
- });
-
- it('should return if node is colliding', function () {
- var node = {x: 10, y: 35, size: 17};
- var collision = controller.collide(node);
- expect(collision).toBeTruthy();
- });
-
- it('point over edge should return edge', function () {
- var x = 30;
- var y = 30;
- var edge = controller.pointOverEdge(x, y);
- expect(edge).toBeDefined();
-
- x = 30;
- y = 150;edge = controller.pointOverEdge(x, y);
- expect(edge).toBeUndefined();
- });
-
- it ('should correctly select node', function () {
- var node = controller.nodes[0];
-
- spyOn(controller, 'selectNode');
- spyOn(controller, 'multiSelectNodes');
- controller.assignNode(node, false);
- expect(controller.selectedNode).toBe(node);
- expect(controller.selectNode).toHaveBeenCalled();
- expect(controller.multiSelectNodes).toHaveBeenCalled();
- });
-});
diff --git a/test/charts/topology/topology.spec.js b/test/charts/topology/topology.spec.js
deleted file mode 100644
index aa69d70e8..000000000
--- a/test/charts/topology/topology.spec.js
+++ /dev/null
@@ -1,258 +0,0 @@
-
-describe('Component: pfTopology', function () {
- var $scope;
- var $compile;
- var $timeout;
-
- beforeEach(module(
- 'patternfly.charts'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$timeout_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $timeout = _$timeout_;
- }));
-
- var compileTopology = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return angular.element(el);
- };
-
- beforeEach(function () {
- var index = 0;
- var datasets = [];
-
- function sink (dataset) {
- datasets.push(dataset);
- }
-
- sink({
- "items": {
- "ContainerManager10r20": {
- "name": "ocp-master.example.com",
- "kind": "ContainerManager",
- "miq_id": 10000000000020,
- "status": "Valid",
- "display_kind": "OpenshiftEnterprise"
- },
- "ContainerNode10r14": {
- "name": "ocp-master.example.com",
- "kind": "ContainerNode",
- "miq_id": 10000000000014,
- "status": "Ready",
- "display_kind": "Node"
- },
- "ContainerGroup10r240": {
- "name": "docker-registry-2-vrguw",
- "kind": "ContainerGroup",
- "miq_id": 10000000000240,
- "status": "Running",
- "display_kind": "Pod"
- },
- "Container10r235": {
- "name": "registry",
- "kind": "Container",
- "miq_id": 10000000000235,
- "status": "Running",
- "display_kind": "Container"
- },
- "ContainerReplicator10r56": {
- "name": "docker-registry-2",
- "kind": "ContainerReplicator",
- "miq_id": 10000000000056,
- "status": "OK",
- "display_kind": "Replicator"
- },
- "ContainerService10r61": {
- "name": "docker-registry",
- "kind": "ContainerService",
- "miq_id": 10000000000061,
- "status": "Unknown",
- "display_kind": "Service"
- }
- },
- "relations": [
- {
- "source": "ContainerManager10r20",
- "target": "ContainerNode10r14"
- }, {
- "source": "ContainerNode10r14",
- "target": "ContainerGroup10r240"
- }, {
- "source": "ContainerGroup10r240",
- "target": "Container10r235"
- }, {
- "source": "ContainerGroup10r240",
- "target": "ContainerReplicator10r56"
- }, {
- "source": "ContainerGroup10r240",
- "target": "ContainerService10r61"
- }, {
- "source": "ContainerNode10r14",
- "target": "ContainerGroup10r241"
- }
- ],
- "icons": {
- "AvailabilityZone": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "ContainerReplicator": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "ContainerGroup": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "FontAwesome"
- },
- "ContainerNode": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "ContainerService": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "ContainerRoute": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "Container": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "FontAwesome"
- },
- "Host": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "Vm": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- },
- "ContainerManager": {
- "type": "glyph",
- "icon": "",
- "fontfamily": "PatternFlyIcons-webfont"
- }
- }
- });
-
- $scope.data = datasets[index];
-
- var nodeKinds = {
- "ContainerReplicator": true,
- "ContainerGroup": true,
- "Container": true,
- "ContainerNode": true,
- "ContainerService": true,
- "Host": true,
- "Vm": true,
- "ContainerRoute": true,
- "ContainerManager": true
- };
-
- $scope.kinds = nodeKinds;
-
- var icons = $scope.data.icons;
- $scope.nodes = {};
-
- Object.keys(nodeKinds).forEach(function (kind) {
- var icon = icons[kind];
- $scope.nodes[kind] = {
- "name": kind,
- "enabled": nodeKinds[kind],
- "radius": 16,
- "textX": 0,
- "textY": 5,
- "height": 18,
- "width": 18,
- "icon": icon.icon,
- "fontFamily": icon.fontfamily
- };
- });
-
- // Individual values can also be set for specific icons
- $scope.nodes.ContainerService.textY = 9;
- $scope.nodes.ContainerService.textX = -1;
-
- $scope.itemSelected = function (item) {
- var text = "";
- if (item) {
- text = "Selected: " + item.name;
- }
- angular.element(document.getElementById("selected")).text(text);
- };
-
- $scope.tooltip = function (node) {
- var status = [
- 'Name: ' + node.item.name,
- 'Type: ' + node.item.kind,
- 'Status: ' + node.item.status
- ];
- return status;
- };
- });
-
- afterEach(function () {
- d3.selectAll('pf-topology').remove();
- });
-
- it("should create an svg internally", function () {
- var element = compileTopology('', $scope);
- expect(element.find('svg')).not.toBe(undefined);
- });
-
- it("should generate 6 nodes", function () {
- var elementDiv = ' ';
- var body = angular.element(document.body);
- body.append(elementDiv);
- compileTopology(body, $scope);
- var topologyElement = body.find('pf-topology svg g');
- expect(topologyElement.length).toBe(6);
- });
-
- it("should generate 5 lines", function () {
- var elementDiv = ' ';
- var body = angular.element(document.body);
- body.append(elementDiv);
- compileTopology(body, $scope);
- var topologyElement = body.find('pf-topology svg line');
- expect(topologyElement.length).toBe(5);
- });
-
- it("should hide/show the text labels", function () {
- var elementDiv = ' ';
- var body = angular.element(document.body);
- body.append(elementDiv);
- compileTopology(body, $scope);
- var topologyElement = body.find('pf-topology svg');
- expect(topologyElement.find('text.visible').length).toBe(0);
- $scope.showLabels = true;
- $scope.$digest();
- expect(topologyElement.find('text.visible').length).toBe(6);
- });
-
- it("should update view on search", function () {
- var elementDiv = ' ';
- var body = angular.element(document.body);
- body.append(elementDiv);
- compileTopology(body, $scope);
- var disabledNodes = body.find('g[style="opacity: 0.2;"]');
- expect(disabledNodes.length).toBe(0);
- $scope.searchText = 'vrguw';
- $scope.$digest();
- disabledNodes = body.find('g[style="opacity: 0.2;"]');
- expect(disabledNodes.length).toBe(5);
- });
-});
diff --git a/test/charts/trends/trends-chart.spec.js b/test/charts/trends/trends-chart.spec.js
deleted file mode 100644
index 18f6c5757..000000000
--- a/test/charts/trends/trends-chart.spec.js
+++ /dev/null
@@ -1,143 +0,0 @@
-describe('Directive: pfTrendsChart', function () {
- var $scope;
- var $compile;
- var element;
- var isolateScope;
- var trendCard;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/empty-chart.html',
- 'charts/trends/trends-chart.html',
- 'card/basic/card.html',
- 'charts/sparkline/sparkline-chart.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- beforeEach(function () {
-
- $scope.config = {
- chartId : 'testSparklineChart',
- title : 'Network Utilization Trends',
- timeFrame: 'Last 15 Minutes',
- units : 'MHz'
- };
-
- var today = new Date();
- var dates = ['dates'];
- for (var d = 20 - 1; d >= 0; d--) {
- dates.push(new Date(today.getTime() - (d * 24 * 60 * 60 * 1000)));
- }
-
- $scope.data = {
- total: 100,
- yData: ['used', 10, 20, 30, 20, 30, 10, 14, 20, 25, 68, 54, 56, 78, 56, 67, 88, 76, 65, 87, 76],
- xData: dates
- };
-
- element = compileChart(' ',$scope);
- });
-
- var compileChart = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return angular.element(el);
- };
-
- it("should show the last data point of sparkline chart as the trend heading", function () {
- expect(element.find('.trend-title-big-pf').html()).toBe("76");
- expect(element.find('.trend-title-small-pf').html()).toBe("MHz");
- });
-
- it("should show the correct card heading and time frame", function () {
- expect(element.find('.trend-header-pf').html()).toBe("Network Utilization Trends");
- expect(element.find('.trend-footer-pf').html()).toBe("Last 15 Minutes");
- });
-
- it("should show the percentage in the trend heading", function () {
-
- $scope.config.valueType = 'percentage';
- $scope.$digest();
-
- expect(element.find('.trend-title-big-pf').html()).toBe("76%");
- expect(element.find('.trend-title-small-pf').html()).toBe("of 100 MHz");
- });
-
- it("should show large or small trend card layouts", function () {
- // by default, should show a large card
- trendCard = element.find('.trend-card-large-pf');
- expect(trendCard.length).toBe(1);
- // check small card isn't being shown by default
- expect(trendCard.hasClass('trend-card-small-pf')).toBe(false);
-
- $scope.config.layout = 'small';
- $scope.$digest();
- trendCard = element.find('.trend-card-small-pf');
- expect(trendCard.length).toBe(1);
- expect(trendCard.hasClass('trend-card-large-pf')).toBe(false);
-
- $scope.config.layout = 'large';
- $scope.$digest();
- trendCard = element.find('.trend-card-large-pf');
- expect(trendCard.length).toBe(1);
- expect(trendCard.hasClass('trend-card-small-pf')).toBe(false);
- });
-
- it("should show compact card layout", function () {
- $scope.config.layout = 'compact';
- $scope.$digest();
-
- trendCard = element.find('.trend-row');
- expect(trendCard.length).toBe(1);
- trendCard = element.find('.trend-title-compact-big-pf');
- expect(trendCard.length).toBe(1);
- trendCard = element.find('.trend-title-compact-small-pf');
- expect(trendCard.length).toBe(1);
- });
-
- it("should push/pull label to the right when compactLabelPosition is 'right'", function () {
- $scope.config.layout = 'compact';
- $scope.config.compactLabelPosition = 'right';
- $scope.$digest();
-
- trendCard = element.find('.col-sm-2');
- expect(trendCard.hasClass('col-sm-push-10')).toEqual(true);
-
- trendCard = element.find('.col-sm-10');
- expect(trendCard.hasClass('col-sm-pull-2')).toEqual(true);
- });
-
- it("should show inline card layout", function () {
- $scope.config.layout = 'inline';
- $scope.$digest();
-
- trendCard = element.find('.trend-row');
- expect(trendCard.length).toBe(1);
- trendCard = element.find('.trend-flat-col');
- expect(trendCard.length).toBe(2);
- trendCard = element.find('.trend-label-flat-strong-pf');
- expect(trendCard.length).toBe(1);
-
- trendCard = element.find('.trend-title-flat-big-pf');
- expect(trendCard.html()).toBe('76%');
-
- trendCard = element.find('.trend-label-flat-pf');
- expect(trendCard.html()).toBe('76 of 100 MHz');
- });
-
- it("should show empty chart when the dataAvailable is set to false", function () {
- var emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(0);
-
- $scope.data.dataAvailable = false;
-
- $scope.$digest();
-
- emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(1);
- });
-});
diff --git a/test/charts/utilization-bar/utilization-bar.spec.js b/test/charts/utilization-bar/utilization-bar.spec.js
deleted file mode 100644
index 892d950ec..000000000
--- a/test/charts/utilization-bar/utilization-bar.spec.js
+++ /dev/null
@@ -1,121 +0,0 @@
-describe('Directive: pfUtilizationBarChart', function () {
- var $scope;
- var $compile;
- var $sanitize;
- var element;
- var utilizationBar;
- var title;
- var subTitle;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/empty-chart.html',
- 'charts/utilization-bar/utilization-bar-chart.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$sanitize_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $sanitize = _$sanitize_;
- }));
-
- beforeEach(function () {
-
- $scope.data = {
- 'used': '8',
- 'total': '10'
- };
-
- $scope.title = 'CPU Usage';
- $scope.units = 'GB';
-
- element = compileChart(' ', $scope);
-
- });
-
- var compileChart = function (markup, scope) {
- var el = $compile(markup)(scope);
- scope.$digest();
- return el;
- };
-
- it("should set the width of the inner bar to be 80%", function () {
- utilizationBar = angular.element(element).find('.progress-bar').css('width');
- expect(utilizationBar).toBe("80%");
- });
-
- it("should set aria-valuenow values", function () {
- used = angular.element(element).find('.progress-bar').not('.progress-bar-remaining');
- expect(used.attr('aria-valuenow')).toBe("80");
- });
-
- it("should set the charts title and usage label", function () {
- title = angular.element(element).find('.progress-description').html();
- expect(title).toBe("CPU Usage");
-
- subTitle = angular.element(element).find('.progress-bar span').text();
- expect(subTitle).toBe("8 of 10 GB Used");
-
- //test 'percent' used-label-format
- element = compileChart(" ", $scope);
- subTitle = angular.element(element).find('.progress-bar span').text();
- expect(subTitle).toBe("80% Used");
- });
-
- it("should set the layout to be 'inline', and use custom widths", function () {
- $scope.layoutInline = {
- 'type': 'inline',
- 'titleLabelWidth': '120px',
- 'footerLabelWidth': '60px'
- };
-
- element = compileChart(" ", $scope);
- utilizationBar = angular.element(element).find('.progress-container');
- expect(utilizationBar.length).toBe(1);
-
- utilizationBar = angular.element(element).find('.progress-container').css('padding-left');
- expect(utilizationBar).toBe("120px");
- utilizationBar = angular.element(element).find('.progress-container').css('padding-right');
- expect(utilizationBar).toBe("60px");
- });
-
- it("should set the error and warning thresholds", function () {
- element = compileChart(" ", $scope);
-
- utilizationBar = angular.element(element).find('.progress-bar-warning');
- expect(utilizationBar.length).toBe(1);
-
- element = compileChart(" ", $scope);
-
- utilizationBar = angular.element(element).find('.progress-bar-danger');
- expect(utilizationBar.length).toBe(1);
- });
-
- it("should use custom footer labels", function () {
- $scope.custfooter = '500 TB Total';
-
- element = compileChart(" ", $scope);
-
- subTitle = angular.element(element).find('.progress-bar span').html();
- expect(subTitle).toBe("500 TB Total");
- });
-
- it("should show empty chart when the dataAvailable is set to false", function () {
- var emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(0);
-
- $scope.data.dataAvailable = false;
-
- $scope.$digest();
-
- emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(1);
- });
-
- it("should handle no data given", function () {
- element = compileChart(' ', $scope);
- utilizationBar = angular.element(element).find('.progress-bar-remaining').css('width');
- expect(utilizationBar).toBe("100%");
- });
-
-});
diff --git a/test/charts/utilization-trend/utilization-trend-chart.spec.js b/test/charts/utilization-trend/utilization-trend-chart.spec.js
deleted file mode 100644
index a69c2b0b2..000000000
--- a/test/charts/utilization-trend/utilization-trend-chart.spec.js
+++ /dev/null
@@ -1,113 +0,0 @@
-describe('Component: pfUtilizationTrendChart', function () {
- var $scope;
- var $compile;
- var $timeout;
- var element;
- var isolateScope;
-
- beforeEach(module(
- 'patternfly.charts',
- 'charts/empty-chart.html',
- 'charts/utilization-trend/utilization-trend-chart.html',
- 'charts/donut/donut-pct-chart.html',
- 'charts/sparkline/sparkline-chart.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$timeout_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $timeout = _$timeout_;
- }));
-
- beforeEach(function () {
-
- $scope.config = {
- title: 'Memory',
- units: 'GB'
- };
- $scope.donutConfig = {
- chartId: 'testDonutChart',
- units: 'GB',
- thresholds: {'warning':'60','error':'90'}
- };
- $scope.sparklineConfig = {
- chartId: 'testSparklineChart',
- tooltipType: 'default'
- };
-
- var today = new Date();
- var dates = ['dates'];
- for (var d = 20 - 1; d >= 0; d--) {
- dates.push(new Date(today.getTime() - (d * 24 * 60 * 60 * 1000)));
- }
-
- $scope.data = {
- used: 76,
- total: 100,
- yData: ['used', 10, 20, 30, 20, 30, 10, 14, 20, 25, 68, 54, 56, 78, 56, 67, 88, 76, 65, 87, 76],
- xData: dates
- };
- });
-
- var compileChart = function (markup, scope) {
- element = $compile(angular.element(markup))(scope);
- scope.$apply();
- isolateScope = element.controller('pfUtilizationTrendChart');
-
- return element;
- };
-
- it("should show used for the center label by default", function () {
- element = compileChart(' ',$scope);
-
- expect(isolateScope.centerLabel).toBe('used');
- });
-
- it("should show 'Available' for the current label by default", function () {
- element = compileChart(' ',$scope);
-
- expect(isolateScope.currentText).toBe('Available');
- expect(isolateScope.currentValue).toBe(24);
- });
-
- it("should show the correct available value when only used and total are given", function () {
- element = compileChart(' ',$scope);
-
- expect(isolateScope.chartData.available).toBe(24);
- });
-
- it("should show correct units", function () {
- element = compileChart(' ',$scope);
- expect(isolateScope.config.units).toBe('GB');
- });
-
- it("should update the current and center labels when attribute changes", function () {
- $scope.cLabel = 'used';
- element = compileChart(' ',$scope);
-
- var emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(0);
-
- $scope.data.dataAvailable = false;
-
- $scope.$digest();
-
- emptyChart = element.find('.empty-chart-content');
- expect(emptyChart.length).toBe(1);
- });
-});
diff --git a/test/datepicker/bootstrap-datepicker.spec.js b/test/datepicker/bootstrap-datepicker.spec.js
deleted file mode 100644
index cc522ef16..000000000
--- a/test/datepicker/bootstrap-datepicker.spec.js
+++ /dev/null
@@ -1,95 +0,0 @@
-describe('Component: pfBootstrapDatepicker', function () {
- var $scope;
- var $compile;
- var element;
-
- // load the controller's module
- beforeEach(function () {
- module('patternfly.datepicker', 'datepicker/datepicker.html');
- });
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileHTML = function (markup, scope) {
- element = angular.element(markup);
- $compile(element)(scope);
-
- scope.$digest();
- };
-
- beforeEach(function () {
- $scope.date = new Date("Jan 1, 2000");
- $scope.format = "MMM dd, yyyy";
- $scope.dateOptions = {
- showWeeks : true
- };
- $scope.callbackExecuted = false;
- $scope.dateChangedCallback = function (newDate) {
- $scope.callbackExecuted = true;
- };
-
- var htmlTmp = ' ';
-
- compileHTML(htmlTmp, $scope);
- });
-
- it('should display the date in the correct format', function () {
- var input = element.find('input.datepicker')[0];
- expect(input.value).toBe("Jan 01, 2000");
- });
-
- it('should open datepicker when button clicked', function () {
- var button = element.find('button.datepicker')[0],
- datepicker;
-
- datepicker = element.find('ul.uib-datepicker-popup');
- expect(datepicker.length).toBe(0);
-
- eventFire(button, 'click');
-
- datepicker = element.find('ul.uib-datepicker-popup');
- expect(datepicker.length).toBe(1);
- });
-
- it('should not display week numbers by default on datepicker', function () {
- var button = element.find('button.datepicker')[0],
- week;
-
- eventFire(button, 'click');
- week = $(element.find('.uib-weeks')[0]);
- expect($("td", week).length).toBe(7);
-
- });
-
- it('should display week numbers if dateOptions is modified', function () {
-
- // rebuild the element with the dateOptions included
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- // check each uib-weeks row in the datepicker has the week number + the seven days
- var button = element.find('button.datepicker')[0],
- week;
- eventFire(button, 'click');
- week = $(element.find('.uib-weeks')[0]);
- expect($("td", week).length).toBe(8);
-
- });
-
- it('should execute callback when date changed', function () {
- expect($scope.callbackExecuted).toBeFalsy();
-
- var button = element.find('button.datepicker')[0];
- eventFire(button, 'click');
-
- // click on the tenth date in calendar popup
- var dateButton = element.find('button.btn-sm')[10];
- eventFire(dateButton, 'click');
-
- expect($scope.callbackExecuted).toBeTruthy();
- });
-
-});
diff --git a/test/eslint.yaml b/test/eslint.yaml
deleted file mode 100644
index 0691cd487..000000000
--- a/test/eslint.yaml
+++ /dev/null
@@ -1,43 +0,0 @@
----
-env:
- browser: true
- node: true
-
-globals:
- angular: true
- _: true
- $: true
-
-rules:
- strict: 0
- quotes: 0
- camelcase: 2
- indent: [2, 2]
- new-cap:
- - 2
- - {"newIsCap": true, "capIsNew": false}
- no-mixed-spaces-and-tabs: 2
- no-multiple-empty-lines: 2
- no-trailing-spaces: 2
- keyword-spacing: 2
- space-before-blocks: 2
- space-before-function-paren: 0
- space-infix-ops: 2
- brace-style: 2
- semi: 2
- block-scoped-var: 2
- consistent-return: 2
- curly: 2
- eqeqeq: 2
- guard-for-in: 2
- no-else-return: 2
- no-loop-func: 2
- vars-on-top: 0
- no-debugger: 1
- no-cond-assign: 2
- no-console: 1
- no-extra-semi: 2
- no-irregular-whitespace: 2
- dot-notation:
- - 2
- - {"allowPattern": "^[a-z]+(_[a-z]+)+$"}
diff --git a/test/filters/filter-panel.spec.js b/test/filters/filter-panel.spec.js
deleted file mode 100644
index b8535796a..000000000
--- a/test/filters/filter-panel.spec.js
+++ /dev/null
@@ -1,164 +0,0 @@
-describe('Directive: pfFilterPanel', function () {
- var $scope;
- var $compile;
- var element;
-
- // load the controller's module
- beforeEach(function () {
- module('patternfly.filters', 'filters/filter-panel/filter-panel.html', 'filters/filter-panel/filter-panel-results.html');
- });
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileHTML = function (markup, scope) {
- element = angular.element(markup);
- var el = $compile(element)(scope);
-
- scope.$digest();
- };
-
- var init = function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
- };
-
- it('should show the default filter panel and results label', function () {
- $scope.filterConfig = {
- resultsCount: 9
- };
- init();
-
- expect(element.find('.dropdown').length).toBe(1);
- var resultsLabel = angular.element(element).find('h5').text().trim();
- expect(resultsLabel).toContain("9");
- expect(resultsLabel).toContain("Results");
- });
-
- it('should show custom results label', function () {
- $scope.filterConfig = {
- resultsCount: 4,
- resultsLabel: "Items"
- };
- init();
-
- expect(element.find('.dropdown').length).toBe(1);
- var resultsLabel = angular.element(element).find('h5').text().trim();
- expect(resultsLabel).toContain("4");
- expect(resultsLabel).toContain("Items");
- });
-
- it("should show 'n' of 'm' results label", function () {
- $scope.filterConfig = {
- resultsCount: 4,
- totalCount: 8,
- resultsLabel: "Items",
- appliedFilters: [
- {
- id: 'keyword',
- title: 'Keyword',
- values: ['Foobar']
- }
- ]
- };
- init();
-
- var resultsLabel = angular.element(element).find('h5').text().trim();
- expect(resultsLabel).toContain("4");
- expect(resultsLabel).toContain("of");
- expect(resultsLabel).toContain("8");
- expect(resultsLabel).toContain("Items");
- });
-
- it('should show correct filter tags', function () {
- $scope.filterConfig = {
- resultsCount: 4,
- resultsLabel: "Items",
- appliedFilters: [
- {
- id: 'keyword',
- title: 'Keyword',
- values: ['Foobar']
- },
- {
- id: 'category1',
- title: 'Category One',
- values: ['Value 1', 'Value 2', 'Value 3']
- }
- ]
- };
- init();
-
- // [cateogry: [value 1 x] [value 2 x] ]
- var categoryTags = element.find('.pf-filter-category-label');
- var tagOne = angular.element(categoryTags[0]).text();
- var tagValues = element.find('.label.label-info');
- var tagOneValue = angular.element(tagValues[0]).text();
- var tagTwo = angular.element(categoryTags[1]).text();
- expect(categoryTags.length).toBe(2);
- expect(tagOne).toContain("Keyword");
- expect(tagOneValue).toContain("Foobar");
- expect(tagTwo).toContain("Category One");
- expect(tagTwo).toContain("Value 1");
- expect(tagTwo).toContain("Value 2");
- expect(tagTwo).toContain("Value 3");
- });
-
- it('should clear filters correctly', function () {
- $scope.filterConfig = {
- resultsCount: 4,
- resultsLabel: "Items",
- appliedFilters: [
- {
- id: 'keyword',
- title: 'Keyword',
- values: ['Foobar']
- },
- {
- id: 'category1',
- title: 'Category One',
- values: ['Value 1', 'Value 2', 'Value 3']
- }
- ]
- };
- init();
-
- // Filter Tag = [cateogry: [value 1 x] [value 2 x] ...]
- var categoryTags = element.find('.pf-filter-category-label');
- expect(categoryTags.length).toBe(2);
-
- var clearFilterLinks = element.find('.pficon-close');
- expect(clearFilterLinks.length).toBe(4);
-
- // Clear the one and only Keyword filter
- eventFire(clearFilterLinks[0], 'click');
- $scope.$digest();
-
- categoryTags = element.find('.label.pf-filter-category-label');
- expect(categoryTags.length).toBe(1);
-
- // Clear one of the Category One filters
- clearFilterLinks = element.find('.pficon-close');
- expect(clearFilterLinks.length).toBe(3);
-
- // Clear the 'Value 3' filter
- eventFire(clearFilterLinks[2], 'click');
- $scope.$digest();
-
- var tagOne = angular.element(categoryTags[0]).text();
- expect(tagOne).toContain("Category One");
- expect(tagOne).toContain("Value 1");
- expect(tagOne).toContain("Value 2");
- expect(tagOne).not.toContain("Value 3");
-
- var clearAll = element.find('.toolbar-pf-results > p');
- expect(clearAll.length).toBe(2);
- eventFire(clearAll[1], 'click');
- $scope.$digest();
-
- categoryTags = element.find('.active-filter.label.pf-filter-label-category');
- expect(categoryTags.length).toBe(0);
- });
-});
diff --git a/test/filters/filter.spec.js b/test/filters/filter.spec.js
deleted file mode 100644
index 047a8b3bc..000000000
--- a/test/filters/filter.spec.js
+++ /dev/null
@@ -1,265 +0,0 @@
-describe('Directive: pfFilter', function () {
- var $scope;
- var $compile;
- var element;
-
- // load the controller's module
- beforeEach(function () {
- module('patternfly.filters', 'filters/simple-filter/filter.html', 'filters/simple-filter/filter-fields.html', 'filters/simple-filter/filter-results.html');
- });
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileHTML = function (markup, scope) {
- element = angular.element(markup);
- var el = $compile(element)(scope);
-
- scope.$digest();
- };
-
- beforeEach(function () {
- $scope.filterConfig = {
- fields: [
- {
- id: 'name',
- title: 'Name',
- placeholder: 'Filter by Name',
- filterType: 'text'
- },
- {
- id: 'address',
- title: 'Address',
- placeholder: 'Filter by Address',
- filterType: 'text'
- },
- {
- id: 'birthMonth',
- title: 'Birth Month',
- placeholder: 'Filter by Birth Month',
- filterType: 'select',
- filterValues: [{title:'January', id:'jan'}, {title:'Feb', id:'February'}, 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
- },
- {
- id: 'car',
- title: 'Car',
- placeholder: 'Filter by Car Make',
- filterType: 'complex-select',
- filterValues: [{title:'Subaru', id:'subie'}, 'Toyota'],
- filterDelimiter: '-',
- filterCategoriesPlaceholder: 'Filter by Car Model',
- filterCategories: {
- subie: {
- id: 'subie',
- title: 'Subaru',
- filterValues: [{title:'Outback', id:'out'}, 'Crosstrek', 'Impreza']},
- toyota: {
- id: 'toyota',
- title: 'Toyota',
- filterValues: [{title:'Prius', id:'pri'}, 'Corolla', 'Echo']}
- }
- }
- ],
- resultsCount: 5,
- appliedFilters: []
- };
-
- var htmlTmp = ' ';
-
- compileHTML(htmlTmp, $scope);
- });
-
- it('should have correct number of filter fields', function () {
- var fields = element.find('.filter-field');
- expect(fields.length).toBe(4);
- });
-
- it('should have correct number of results', function () {
- var results = element.find('h5');
- expect(results.length).toBe(1);
- expect(results.html()).toBe("5 Results");
-
- $scope.filterConfig.resultsCount = 10;
-
- $scope.$digest();
-
- results = element.find('h5');
- expect(results.length).toBe(1);
- expect(results.html()).toBe("10 Results");
- });
-
- it('should show active filters and clear filters button when there are filters', function () {
- var activeFilters = element.find('.active-filter');
- expect(activeFilters.length).toBe(0);
- expect(element.find('.clear-filters').length).toBe(0);
-
- $scope.filterConfig.appliedFilters = [
- {
- id: 'address',
- title: 'Address',
- value: 'New York'
- }
- ];
-
- $scope.$digest();
- activeFilters = element.find('.active-filter');
- expect(activeFilters.length).toBe(1);
- expect(element.find('.clear-filters').length).toBe(1);
- });
-
- it ('should add a dropdown select when a select type is chosen', function () {
- var filterSelect = element.find('.filter-select');
- var fields = element.find('.filter-field');
-
- expect(filterSelect.length).toBe(0);
- eventFire(fields[2], 'click');
- $scope.$digest();
- filterSelect = element.find('.filter-select');
- expect(filterSelect.length).toBe(1);
-
- var items = filterSelect.find('li');
- expect(items.length).toBe($scope.filterConfig.fields[2].filterValues.length + 1); // +1 for the null value
- });
-
- it ('should add a dropdown complex-select when a select type is chosen', function () {
- var filterSelect = element.find('.filter-select');
- var fields = element.find('.filter-field');
-
- expect(filterSelect.length).toBe(0);
- eventFire(fields[3], 'click');
- $scope.$digest();
- filterSelect = element.find('.filter-select');
- expect(filterSelect.length).toBe(2);
-
- var items = filterSelect.find('li');
- expect(items.length).toBe($scope.filterConfig.fields[3].filterValues.length + 2); // +2 for the null category and value
- });
-
- it ('should clear a filter when the close button is clicked', function () {
- var closeButtons;
-
- closeButtons = element.find('.pficon-close');
- expect(closeButtons.length).toBe(0);
-
- $scope.filterConfig.appliedFilters = [
- {
- id: 'address',
- title: 'Address',
- value: 'New York'
- }
- ];
-
- $scope.$digest();
-
- closeButtons = element.find('.pficon-close');
- expect(closeButtons.length).toBe(1);
-
- eventFire(closeButtons[0], 'click');
- $scope.$digest();
- expect(element.find('.pficon-close').length).toBe(0);
- });
-
- it ('should clear all filters when the clear all filters button is clicked', function () {
- var clearButtons = element.find('.clear-filters');
- var activeFilters = element.find('.active-filter');
-
- expect(activeFilters.length).toBe(0);
- expect(clearButtons.length).toBe(0);
-
- $scope.filterConfig.appliedFilters = [
- {
- id: 'address',
- title: 'Address',
- value: 'New York'
- }
- ];
-
- $scope.$digest();
-
- activeFilters = element.find('.active-filter');
- clearButtons = element.find('.clear-filters');
-
- expect(activeFilters.length).toBe(1);
- expect(clearButtons.length).toBe(1);
-
- eventFire(clearButtons[0], 'click');
- $scope.$digest();
-
- activeFilters = element.find('.active-filter');
- clearButtons = element.find('.clear-filters');
- expect(activeFilters.length).toBe(0);
- expect(clearButtons.length).toBe(0);
- });
-
- it('should not show selected results when selectedCount and totalCount are undefined', function () {
- $scope.filterConfig.selectedCount = undefined;
- $scope.filterConfig.totalCount = undefined;
- $scope.$digest();
-
- expect(element.find('.pf-table-view-selected-label').length).toBe(0);
- });
-
- it('should show selected results and totalCount are defined', function () {
- $scope.filterConfig.selectedCount = 0;
- $scope.filterConfig.totalCount = 10;
- $scope.$digest();
-
- expect(element.find('.pf-table-view-selected-label').text()).toContain('0 of 10 selected');
- });
-
- it('should show results inline only when specified', function () {
- expect(element.find('.filter-pf.inline-filter-pf').length).toBe(0);
-
- $scope.filterConfig.inlineResults = true;
-
- $scope.$digest();
-
- expect(element.find('.filter-pf.inline-filter-pf').length).toBe(1);
- });
-
- it('should show the total count in the results only when specified', function () {
- $scope.filterConfig.appliedFilters = [
- {
- id: 'address',
- title: 'Address',
- value: 'New York'
- }
- ];
- $scope.$digest();
-
- expect(element.find('.toolbar-pf-results h5').text()).toContain('5 Results');
-
- $scope.filterConfig.showTotalCountResults = true;
- $scope.filterConfig.totalCount = 10;
-
- $scope.$digest();
-
- expect(element.find('.toolbar-pf-results h5').text()).toContain('5 of 10 Results');
- });
-
- it('should use the given results label when specified', function () {
- $scope.filterConfig.showTotalCountResults = true;
- $scope.filterConfig.resultsCount = 1;
- $scope.filterConfig.totalCount = 1;
- $scope.filterConfig.itemsLabel = 'Item';
- $scope.filterConfig.itemsLabelPlural = 'Items';
-
- $scope.filterConfig.appliedFilters = [
- {
- id: 'address',
- title: 'Address',
- value: 'New York'
- }
- ];
- $scope.$digest();
-
- expect(element.find('.toolbar-pf-results h5').text()).toContain('1 of 1 Item');
-
- $scope.filterConfig.totalCount = 2;
- $scope.$digest();
-
- expect(element.find('.toolbar-pf-results h5').text()).toContain('1 of 2 Items');
- });
-});
diff --git a/test/form/form-buttons/form-buttons.component.spec.js b/test/form/form-buttons/form-buttons.component.spec.js
deleted file mode 100644
index 9524bde8f..000000000
--- a/test/form/form-buttons/form-buttons.component.spec.js
+++ /dev/null
@@ -1,42 +0,0 @@
-describe('Component: pfFormButtons', function () {
- var $scope;
- var $compile;
- var element;
- var button;
-
- beforeEach(module(
- 'patternfly.form',
- 'form/form-buttons/form-buttons.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- beforeEach(function () {
- element = '';
-
- element = $compile(element)($scope);
- $scope.$digest();
- });
-
- it("should set create button to disabled if no server validator is set but the form is invalid", function () {
- button = angular.element(element).find('.btn-primary').attr('disabled');
- expect(button).toBe('disabled');
- });
-
- it("should set create button to enabled if a server validator is set", function () {
- $scope.testForm.name.$error.server = true;
- $scope.$digest();
- button = angular.element(element).find('.btn-primary').attr('disabled');
- expect(button).toBe(undefined);
- });
-});
diff --git a/test/form/form-group/form-group.component.spec.js b/test/form/form-group/form-group.component.spec.js
deleted file mode 100644
index 4cf60ab1f..000000000
--- a/test/form/form-group/form-group.component.spec.js
+++ /dev/null
@@ -1,64 +0,0 @@
-describe('Directive: pfFormGroup', function () {
- var $scope;
- var $compile;
- var element;
-
- beforeEach(module(
- 'patternfly.form',
- 'form/form-group/form-group.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- beforeEach(function () {
- element = '';
-
- $scope.fake = {name: ''};
- element = $compile(element)($scope);
- $scope.$digest();
- });
-
- it("should add a 'form-control' class to the input", function () {
- expect(element.find('input').hasClass('form-control')).toBe(true);
- });
-
- it("should display validation error messages if they exist", function () {
- $scope.testForm.name.$error.messages = ['Error message'];
- $scope.$digest();
-
- expect(element.find('.help-block').hasClass('ng-hide')).toBe(false);
- expect(element.find('li').length).toBeGreaterThan(0);
- });
-
- it("should set the form group to an error state if the form is invalid and dirty", function () {
- $scope.testForm.name.$dirty = true;
- $scope.$digest();
-
- expect($scope.testForm.name.$invalid).toBe(true);
- expect($scope.testForm.name.$dirty).toBe(true);
- expect(element.find('.has-error').length).toBeGreaterThan(0);
- });
-
- it("should not set the form group to an error state if the form is invalid but not dirty", function () {
- expect(element.find('.has-errors').length).toBe(0);
- });
-
- it("should do nothing if valid and dirty", function () {
- $scope.testForm.name.$dirty = true;
- $scope.$digest();
-
- expect(element.find('.has-errors').length).toBe(0);
- });
-});
diff --git a/test/form/remaining-chars-count/remaining-chars-count.directive.spec.js b/test/form/remaining-chars-count/remaining-chars-count.directive.spec.js
deleted file mode 100644
index b752bc2eb..000000000
--- a/test/form/remaining-chars-count/remaining-chars-count.directive.spec.js
+++ /dev/null
@@ -1,71 +0,0 @@
-describe('Directive: pfRemainingCharsCount', function () {
- var $scope;
- var $compile;
- var isoScope;
- var element;
-
- beforeEach(module(
- 'patternfly.form'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileRemainingCharsCount = function (markup, $scope) {
- var el = $compile(markup)($scope);
- $scope.$apply();
- isoScope = el.isolateScope();
- return el;
- };
-
- it("should count remaining characters", function () {
- $scope.messageAreaText = "initial Text";
-
- element = compileRemainingCharsCount('' +
- ' ', $scope);
-
- expect(isoScope.ngModel).toBe('initial Text');
- expect(isoScope.remainingChars).toBe(8);
- expect(isoScope.remainingCharsWarning).toBeFalsy();
- });
-
- it("should warn when remaining characters threshold met", function () {
- $scope.messageAreaText = "initial Text";
-
- element = compileRemainingCharsCount('' +
- ' ', $scope);
-
- expect(isoScope.ngModel).toBe('initial Text');
- expect(isoScope.remainingChars).toBe(8);
- expect(isoScope.remainingCharsWarning).toBeTruthy();
- });
-
- it("should allow negative remaining characters by default", function () {
- $scope.messageAreaText = "initial Text";
-
- element = compileRemainingCharsCount('' +
- ' ', $scope);
-
- expect(isoScope.ngModel).toBe('initial Text');
- expect(isoScope.remainingChars).toBe(-7);
- expect(isoScope.remainingCharsWarning).toBeTruthy();
- });
-
- it("should not allow negative remaining characters when blockInputAtMaxLimit is true", function () {
- $scope.messageAreaText = "initial Text";
-
- element = compileRemainingCharsCount(' ', $scope);
-
- expect(isoScope.ngModel).toBe('initi');
- expect(isoScope.remainingChars).toBe(0);
- expect(isoScope.remainingCharsWarning).toBeTruthy();
- });
-
-});
diff --git a/test/karma.conf.js b/test/karma.conf.js
deleted file mode 100644
index 70397dd2a..000000000
--- a/test/karma.conf.js
+++ /dev/null
@@ -1,109 +0,0 @@
-
-module.exports = function (config) {
- config.set({
- // base path, that will be used to resolve files and exclude
- basePath: '../',
-
- frameworks: ['jasmine'],
-
- // list of files / patterns to load in the browser
- files: [
- 'node_modules/jquery/dist/jquery.js',
- 'node_modules/datatables.net/js/jquery.dataTables.js',
- 'node_modules/moment/moment.js',
- 'node_modules/bootstrap-select/js/bootstrap-select.js',
- 'node_modules/d3/d3.js',
- 'node_modules/c3/c3.js',
- 'node_modules/patternfly/dist/js/patternfly.js',
- 'node_modules/angular/angular.js',
- 'node_modules/angular-sanitize/angular-sanitize.js',
- 'node_modules/angular-animate/angular-animate.js',
- 'node_modules/angular-mocks/angular-mocks.js',
- 'node_modules/angular-ui-bootstrap/dist/ui-bootstrap.js',
- 'node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js',
- 'misc/angular-bootstrap-prettify.js',
- 'node_modules/angularjs-datatables/dist/angular-datatables.min.js',
- 'node_modules/lodash/lodash.js',
- 'misc/test-lib/helpers.js',
- 'src/**/*.module.js',
- 'src/**/*.js',
- 'src/**/*.html',
- 'test/utils/*.js',
- 'test/wizard/script.js',
- 'test/**/*.spec.js',
- 'test/**/*.html',
- 'node_modules/angular-ui-router/release/angular-ui-router.min.js',
- 'node_modules/angular-drag-and-drop-lists/angular-drag-and-drop-lists.js'
- ],
-
- // list of files to exclude
- exclude: [
- 'client/main.js'
- ],
-
- preprocessors: {
- 'src/**/*.html': 'ng-html2js',
- 'test/**/*.html': 'ng-html2js',
- 'src/**/*.js': "coverage"
- },
-
- ngHtml2JsPreprocessor: {
- stripPrefix: 'src/'
- },
-
- // use dots reporter, as travis terminal does not support escaping sequences
- // possible values: 'dots', 'progress'
- // CLI --reporters progress
- reporters: ['progress', 'junit', 'coverage'],
-
- junitReporter: {
- // will be resolved to basePath (in the same way as files/exclude patterns)
- outputFile: 'test/test-results.xml'
- },
-
- coverageReporter: {
- type: "lcov",
- dir: "coverage/"
- },
-
- // web server port
- // CLI --port 9876
- port: 9876,
-
- // enable / disable colors in the output (reporters and logs)
- // CLI --colors --no-colors
- colors: true,
-
- // level of logging
- // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
- // CLI --log-level debug
- logLevel: config.LOG_WARN,
-
- // enable / disable watching file and executing tests whenever any file changes
- // CLI --auto-watch --no-auto-watch
- autoWatch: true,
-
- // Start these browsers, currently available:
- // - Chrome
- // - ChromeCanary
- // - Firefox
- // - Opera
- // - Safari (only Mac)
- // - PhantomJS
- // - IE (only Windows)
- // CLI --browsers Chrome,Firefox,Safari
- browsers: [process.env.TRAVIS ? 'Firefox' : 'Chrome'],
-
- // If browser does not capture in given timeout [ms], kill it
- // CLI --capture-timeout 5000
- captureTimeout: 20000,
-
- // Auto run tests on start (when browsers are captured) and exit
- // CLI --single-run --no-single-run
- singleRun: false,
-
- // report which specs are slower than 500ms
- // CLI --report-slower-than 500
- reportSlowerThan: 500
- });
-};
diff --git a/test/modals/about-modal.spec.js b/test/modals/about-modal.spec.js
deleted file mode 100644
index bf97fedc7..000000000
--- a/test/modals/about-modal.spec.js
+++ /dev/null
@@ -1,182 +0,0 @@
-describe('Component: pfABoutModal', function () {
- var $scope;
- var $compile;
-
- // load the controller's module
- beforeEach(module(
- 'patternfly.modals',
- 'modals/about-modal/about-modal.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileHtml = function (markup, scope) {
- var element = angular.element(markup);
- $compile(element)(scope);
- scope.$digest();
- return element;
- };
-
- var closeModal = function (scope) {
- scope.isOpen = false;
- scope.$digest();
-
- // Although callbacks are executed properly, the modal is not removed in this
- // environment -- must remove it manually to mimic UI Bootstrap.
- var modal = getModal();
- if (modal) {
- modal.remove();
- }
- var modalBackdrop = angular.element(document.querySelector('.modal-backdrop'));
- if (modalBackdrop) {
- modalBackdrop.remove();
- }
- };
-
- // Modal elements are located in a template, so wait until modal is shown.
- var getModal = function () {
- return angular.element(document.querySelector('.modal'));
- };
-
- var openModal = function (scope) {
- scope.isOpen = true;
- scope.$digest();
- };
-
- beforeEach(function () {
- closeModal($scope);
- $scope.copyright = "Copyright Information";
- $scope.imgAlt = "Patternfly Symbol";
- $scope.imgSrc = "img/logo-alt.svg";
- $scope.title = "Product Title";
- $scope.isOpen = true;
- $scope.productInfo = [
- { product: 'Label', version: 'Version' },
- { product: 'Label', version: 'Version' },
- { product: 'Label', version: 'Version' },
- { product: 'Label', version: 'Version' },
- { product: 'Label', version: 'Version' },
- { product: 'Label', version: 'Version' },
- { product: 'Label', version: 'Version' }];
- $scope.open = function () {
- $scope.isOpen = true;
- };
- $scope.onClose = function () {
- $scope.isOpen = false;
- };
- });
-
- it('should invoke the onClose callback when close button is clicked', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var closeButton = angular.element(getModal()).find('button');
- eventFire(closeButton[0], 'click');
- $scope.$digest();
- expect($scope.isOpen).toBe(false);
- });
-
- it('should open the about modal via an external button click', function () {
- $scope.isOpen = false;
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var buttonHtml = 'Launch about modal ';
- var closeButton = compileHtml(buttonHtml, $scope);
- eventFire(closeButton[0], 'click');
- $scope.$digest();
- expect($scope.isOpen).toBe(true);
- expect(angular.element(getModal()).find('h1').length).toBe(1);
- });
-
- it('should open the about modal programmatically', function () {
- $scope.isOpen = false;
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- expect(angular.element(getModal()).find('h1').length).toBe(0);
- openModal($scope);
- expect(angular.element(getModal()).find('h1').length).toBe(1);
- });
-
- it('should not open the about modal', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- expect(angular.element(getModal()).find('h1').length).toBe(0);
- expect(angular.element(getModal()).find('.trademark-pf').length).toBe(0);
- });
-
- it('should set the product title', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- expect(angular.element(getModal()).find('h1').html()).toBe('Product Title');
- });
-
- it('should not show product title when a title is not supplied', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- expect(angular.element(getModal()).find('h1').length).toBe(0);
- });
-
- it('should set the product copyright', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- expect(angular.element(getModal()).find('.trademark-pf').html()).toBe('Copyright Information');
- });
-
- it('should not show product copyright when a copyright is not supplied', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- expect(angular.element(getModal()).find('.trademark-pf').length).toBe(0);
- });
-
- it('should set the corner graphic alt text', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var footer = angular.element(getModal()).find('.modal-footer');
- expect(angular.element(footer).find('img').attr('alt')).toBe('Patternfly Symbol');
- });
-
- it('should not show alt text for corner graphic when imgAlt is not supplied', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var footer = angular.element(getModal()).find('.modal-footer');
- expect(angular.element(footer).find('img').attr('alt').length).toBe(0);
- });
-
- it('should set the corner graphic src', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var footer = angular.element(getModal()).find('.modal-footer');
- expect(angular.element(footer).find('img').attr('src')).toBe('img/logo-alt.svg');
- });
-
- it('should not show corner graphic when imgSrc is not supplied', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var footer = angular.element(getModal()).find('.modal-footer');
- expect(angular.element(footer).find('img').length).toBe(0);
- });
-
- it('should show simple content', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var transclude = angular.element(getModal()).find('.product-versions-pf');
- expect(angular.element(transclude).find('ul').length).toBe(1);
- });
-
- it('should show custom content', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var transclude = angular.element(getModal()).find('.product-versions-pf');
- expect(angular.element(transclude).find('ul').length).toBe(1);
- });
-
- it('should not show content', function () {
- var modalHtml = ' ';
- compileHtml(modalHtml, $scope);
- var transclude = angular.element(getModal()).find('.product-versions-pf');
- expect(angular.element(transclude).find('ul').length).toBe(0);
- closeModal($scope);
- });
-});
diff --git a/test/modals/modal-overlay.spec.js b/test/modals/modal-overlay.spec.js
deleted file mode 100644
index fb29bd858..000000000
--- a/test/modals/modal-overlay.spec.js
+++ /dev/null
@@ -1,238 +0,0 @@
-describe('Component: pfModalOverlay', function () {
- var $scope;
- var $compile;
- var $uibModal;
- var $templateCache;
- var modal, modal2;
- var button, button2;
-
- // load the controller's module
- beforeEach(module(
- 'patternfly.modals',
- 'modals/modal-overlay/modal-overlay.html'
- ));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$uibModal_, _$templateCache_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $uibModal = _$uibModal_;
- $templateCache = _$templateCache_;
- }));
-
- var compileHtml = function (markup, scope) {
- var element = angular.element(markup);
- $compile(element)(scope);
- scope.$digest();
- return element;
- };
-
- var closeModal = function (scope) {
- scope.showModal = false;
- scope.showModal2 = false;
- scope.$digest();
-
- // Although callbacks are executed properly, the modal is not removed in this
- // environment -- must remove it manually to mimic UI Bootstrap.
- var modal = angular.element(document.querySelector('.modal-overlay'));
- if (modal) {
- modal.remove();
- }
- var modalBackdrop = angular.element(document.querySelector('.modal-backdrop'));
- if (modalBackdrop) {
- modalBackdrop.remove();
- }
- };
-
- beforeEach(function () {
- // first example
- $scope.open = function () {
- $scope.showModal = true;
- };
- $scope.onClose = function() {
- $scope.showModal = false;
- };
-
- $scope.modalId = "testModal";
- $scope.modalTitle = "Test Title";
- $scope.modalBodyPath = 'modal-body.html';
- $scope.actionButtons = [
- {
- label: "Cancel",
- close: true
- },
- {
- label: "Save",
- class: "btn-primary custom-class"
- }];
-
- // second example
- $scope.titleId = "testTitle";
- $scope.hideCloseIcon = true;
- $scope.open2 = function () {
- $scope.showModal2 = true;
- };
- $scope.onClose2 = function() {
- $scope.showModal2 = false;
- };
-
- $scope.actionButtons2 = [
- {
- label: "Cancel",
- close: true
- },
- {
- label: "Test",
- isDisabled: true
- },
- {
- label: "Save",
- class: "btn-primary"
- }];
-
- $templateCache.put("modal-body.html", "Test Html
");
- var buttonHtml = 'Test ';
- var modalHtml = ' ';
- modal = compileHtml(modalHtml, $scope);
- button = compileHtml(buttonHtml, $scope);
-
- var buttonHtml2 = 'Test ';
- var modalHtml2 = ' ';
- modal2 = compileHtml(modalHtml2, $scope);
- button2 = compileHtml(buttonHtml2, $scope);
- });
-
- it('should open the modal with button click', function () {
- expect($("#modalTitle").length).toBe(0);
- eventFire(button[0], 'click');
- expect($("#modalTitle").length).toBe(1);
- closeModal($scope);
- });
-
- it('should set the id of the modal', function () {
- eventFire(button[0], 'click');
- var modal$ = $('.modal-overlay', modal[1]);
- expect(modal$.attr("id")).toBe("testModal");
- closeModal($scope);
- });
-
- it('should open the about modal programmatically', function () {
- expect($("#modalTitle").length).toBe(0);
- $scope.open();
- $scope.$digest();
- expect($("#modalTitle").length).toBe(1);
- closeModal($scope);
- });
-
- it('should set the title of the modal', function () {
- eventFire(button[0], 'click');
- var title = $('.modal-header .modal-title').text();
- expect(title).toBe('Test Title');
- closeModal($scope);
- });
-
- it('should set the title id to "modalTitle" if none specified', function () {
- eventFire(button[0], 'click');
- var title = $('#modalTitle');
- expect(title.length).toBe(1);
- closeModal($scope);
- });
-
- it('should set the title id when specified', function () {
- eventFire(button2[0], 'click');
- var title = $('#testTitle');
- expect(title.length).toBe(1);
- closeModal($scope);
- });
-
- it('should show the "x" close icon by default', function () {
- eventFire(button[0], 'click');
- var closeButton = $('button.close');
- expect(closeButton.length).toBe(1);
- closeModal($scope);
- });
-
- it('should close the modal when "x" close icon is clicked', function () {
- eventFire(button[0], 'click');
- var modal$ = $('#testModal');
- expect(modal$.length).toBe(1);
- var closeButton = $('button.close')[0];
- eventFire(closeButton, 'click');
- $scope.$digest();
- modal$ = $('#testModal');
- expect(modal$.length).toBe(0);
- });
-
- it('should hide the close icon when hide-close-icon set to true', function () {
- eventFire(button2[0], 'click');
- var closeButton = $('button.close');
- expect(closeButton.length).toBe(0);
- closeModal($scope);
- });
-
- it('should set the html in the body of the modal to Test Html
', function () {
- eventFire(button[0], 'click');
- var body = $('.modal-body').html();
- expect(body.indexOf('Test Html
') !== -1).toBe(true);
- closeModal($scope);
- });
-
- it('should display 3 buttons', function() {
- eventFire(button2[0], 'click');
- var buttons = $('button.btn');
- expect(buttons.length).toBe(3);
- closeModal($scope);
- });
-
- it('should display "Cancel" on the first button', function() {
- eventFire(button2[0], 'click');
- var cancelButton = $('button.btn')[0];
- expect($(cancelButton).html()).toBe("Cancel");
- closeModal($scope);
- });
-
- it('should disable second button', function() {
- var element = compileHtml('Test ', $scope);
- eventFire(element[0], 'click');
-
- var cancelButton = $('button.btn')[0];
- expect($(cancelButton).is(":disabled")).toBe(false);
-
- var disabledButton = $('button.btn')[1];
- expect($(disabledButton).is(":disabled")).toBe(true);
- closeModal($scope);
- });
-
- it('should apply btn-primary class to third button', function() {
- var element = compileHtml('Test ', $scope);
- eventFire(element[0], 'click');
-
- var disabledButton = $('button.btn')[1];
- expect($(disabledButton).hasClass("btn-primary")).toBe(false);
-
- var thirdButton = $('button.btn')[2];
- expect($(thirdButton).hasClass("btn-primary")).toBe(true);
- closeModal($scope);
- });
-
- it('should dismiss modal when clicking "Cancel"', function() {
- var element = compileHtml('Test ', $scope);
- eventFire(element[0], 'click');
-
- var firstButton$ = $($('button.btn')[0]);
- firstButton$.click();
- $scope.$digest();
- var modal$ = $('#testModal');
- expect(modal$.length).toBe(0);
- });
-
- it('should close modal when clicking "Ok"', function() {
- var element = compileHtml('Test ', $scope);
- eventFire(element[0], 'click');
-
- var thirdButton$ = $($('button.btn')[2]);
- thirdButton$.click();
- $scope.$digest();
- var modal$ = $('#testModal');
- expect(modal$.length).toBe(0);
- });
-});
diff --git a/test/navigation/application-launcher.spec.js b/test/navigation/application-launcher.spec.js
deleted file mode 100644
index 5e6cfd2b4..000000000
--- a/test/navigation/application-launcher.spec.js
+++ /dev/null
@@ -1,91 +0,0 @@
-describe('Component: pfApplicationLauncher', function () {
- var $scope;
- var $compile;
- var element;
- var isolateScope;
-
- // load the controller's module
- beforeEach(function () {
- module('patternfly.navigation', 'patternfly.utils', 'navigation/application-launcher.html');
- });
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileHTML = function (markup, scope) {
- element = angular.element(markup);
- $compile(element)(scope);
-
- scope.$digest();
- isolateScope = element.isolateScope();
- };
-
- beforeEach(function () {
- $scope.sites = [
- {
- title: "Recteque",
- href: "#/ipsum/intellegam/recteque",
- tooltip: "Total number of error items",
- iconClass: ""
- },
- {
- title: "Suavitate",
- href: "#/ipsum/intellegam/suavitate",
- tooltip: "Total number of items",
- iconClass: ""
- }
- ];
- });
-
- it('should have menu items', function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- var content = element.find('[role="menuitem"]');
- expect(content.length).toBe(2);
- });
-
- it('should have dropdown menu to the right', function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- var content = element.find('ul');
- expect(content.hasClass('dropdown-menu-right')).toBe(true);
- });
-
- it('should have a custom label', function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- var content = element.find('[id*="domain-switcher"]').text();
- expect(content).toContain('Product Launcher');
- });
-
- it('should be disabled', function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- var content = element.find('[id*="domain-switcher"].disabled');
- expect(content.length).toBe(1);
- });
-
- it('should be displayed as a list', function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- var content = element.find('.applauncher-pf-block-list');
- expect(content.length).toBe(0);
- });
-
- it('should have hidden application icons', function () {
- var htmlTmp = ' ';
- compileHTML(htmlTmp, $scope);
-
- var content = element.find('.applauncher-pf-link-icon');
- expect(content.length).toBe(0);
- });
-
-});
-
diff --git a/test/navigation/vertical-navigation.spec.js b/test/navigation/vertical-navigation.spec.js
deleted file mode 100644
index c0b1e3f84..000000000
--- a/test/navigation/vertical-navigation.spec.js
+++ /dev/null
@@ -1,833 +0,0 @@
-describe('Component: pfVerticalNavigation', function () {
- var $scope;
- var $compile;
- var element;
- var isolateScope;
-
- // load the controller's module
- beforeEach(function () {
- module('patternfly.navigation', 'patternfly.utils', 'navigation/vertical-navigation.html');
- });
-
- beforeEach(inject(function (_$compile_, _$rootScope_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- }));
-
- var compileHTML = function (markup, scope) {
- element = angular.element(markup);
- $compile(element)(scope);
-
- scope.$digest();
- isolateScope = element.find("pf-vertical-navigation").isolateScope();
- };
-
- beforeEach(function () {
- $scope.navigationItems = [
- {
- title: "Dashboard",
- iconClass: "fa fa-dashboard",
- href: "#/dashboard"
- },
- {
- title: "Dolor",
- iconClass : "fa fa-shield",
- uiSref: "dolor",
- badges: [
- {
- count: 1283,
- tooltip: "Total number of items"
- }
- ]
- },
- {
- title: "Ipsum",
- iconClass: "fa fa-space-shuttle",
- active: true,
- children: [
- {
- title: "Intellegam",
- active: true,
- children: [
- {
- title: "Recteque",
- href: "#/ipsum/intellegam/recteque",
- badges: [
- {
- count: 6,
- tooltip: "Total number of error items",
- badgeClass: 'example-error-background'
- }
- ]
- },
- {
- title: "Suavitate",
- href: "#/ipsum/intellegam/suavitate",
- badges: [
- {
- count: 0,
- tooltip: "Total number of items",
- badgeClass: 'example-ok-background'
- }
- ]
- },
- {
- title: "Vituperatoribus",
- href: "#/ipsum/intellegam/vituperatoribus",
- badges: [
- {
- count: 18,
- tooltip: "Total number of warning items",
- badgeClass: 'example-warning-background'
- }
- ]
- }
- ]
- },
- {
- title: "Copiosae",
- children: [
- {
- title: "Exerci",
- href: "#/ipsum/copiosae/exerci"
- },
- {
- title: "Quaeque",
- href: "#/ipsum/copiosae/quaeque"
- },
- {
- title: "Utroque",
- href: "#/ipsum/copiosae/utroque"
- }
- ]
- },
- {
- title: "Patrioque",
- children: [
- {
- title: "Novum",
- href: "#/ipsum/patrioque/novum"
- },
- {
- title: "Pericula",
- href: "#/ipsum/patrioque/pericula"
- },
- {
- title: "Gubergren",
- href: "#/ipsum/patrioque/gubergren"
- }
- ]
- },
- {
- title: "Accumsan",
- href: "#/ipsum/Accumsan"
- }
- ]
- },
- {
- title: "Amet",
- iconClass: "fa fa-paper-plane",
- children: [
- {
- title: "Detracto",
- children: [
- {
- title: "Delicatissimi",
- href: "#/amet/detracto/delicatissimi"
- },
- {
- title: "Aliquam",
- href: "#/amet/detracto/aliquam"
- },
- {
- title: "Principes",
- href: "#/amet/detracto/principes"
- }
- ]
- },
- {
- title: "Mediocrem",
- children: [
- {
- title: "Convenire",
- href: "#/amet/mediocrem/convenire"
- },
- {
- title: "Nonumy",
- href: "#/amet/mediocrem/nonumy"
- },
- {
- title: "Deserunt",
- href: "#/amet/mediocrem/deserunt"
- }
- ]
- },
- {
- title: "Corrumpit",
- children: [
- {
- title: "Aeque",
- href: "#/amet/corrumpit/aeque"
- },
- {
- title: "Delenit",
- href: "#/amet/corrumpit/delenit"
- },
- {
- title: "Qualisque",
- href: "#/amet/corrumpit/qualisque"
- }
- ]
- },
- {
- title: "urbanitas",
- href: "#/amet/urbanitas"
- }
- ]
- },
- {
- title: "Adipscing",
- iconClass: "fa fa-graduation-cap",
- href: "#/adipscing"
- },
- {
- title: "Lorem",
- iconClass: "fa fa-gamepad",
- href: "#/lorem"
- }
- ];
-
- $scope.handleNavigateClick = function (item) {
- $scope.navigateItem = item.title;
- };
-
- $scope.handleItemClick = function (item) {
- $scope.clickItem = item.title;
- };
-
- var htmlTmp = '' +
- '' +
- '
' +
- ' ' +
- ' ' +
- '
' +
- '
' +
- '
' +
- '';
-
- compileHTML(htmlTmp, $scope);
- });
-
- it('should add the transcluded content', function () {
- var content = element.find('.collapse.navbar-collapse .test-included-content');
- expect(content.length).toBe(1);
- });
-
- it('should add the vertical navigation menus', function () {
- var primaryMenu = element.find('.nav-pf-vertical');
- expect(primaryMenu.length).toBe(1);
-
- var primaryItems = primaryMenu.find('> .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var secondaryMenu = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav');
- expect(secondaryMenu.length).toBe(1);
-
- var secondaryItems = angular.element(secondaryMenu).find('> .list-group > .list-group-item');
- expect(secondaryItems.length).toBe(4);
-
- var tertiaryMenu = angular.element(secondaryItems[0]).find('.nav-pf-tertiary-nav');
- expect(tertiaryMenu.length).toBe(1);
-
- var tertiaryItems = angular.element(tertiaryMenu).find('> .list-group > .list-group-item');
- expect(tertiaryItems.length).toBe(3);
- });
-
- it('should update the content element', function () {
- var content = element.find('.container-pf-nav-pf-vertical.nav-pf-vertical-with-badges');
- expect(content.length).toBe(0); // (1); // This does not work for some reason the class is not there yet
- });
-
- it('should pin menus when specified', function () {
- var collased = element.find('.collapsed-secondary-nav-pf.nav');
- expect(collased.length).toBe(0);
-
- collased = element.find('.collapsed-tertiary-nav-pf');
- expect(collased.length).toBe(0);
-
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- // third item is active, use it to check for pin icon
- var secondaryMenu = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav');
- expect(secondaryMenu.length).toBe(1);
-
- var collapseToggle = angular.element(secondaryMenu[0]).find('.secondary-collapse-toggle-pf');
- expect(collapseToggle.length).toBe(1);
-
- eventFire(collapseToggle[0], 'click');
- $scope.$digest();
-
- collased = element.find('.collapsed-secondary-nav-pf');
- expect(collased.length).toBe(1);
-
- collased = element.find('.collapsed-tertiary-nav-pf');
- expect(collased.length).toBe(0);
-
- var secondaryItems = angular.element(secondaryMenu).find('> .list-group > .list-group-item');
- expect(secondaryItems.length).toBe(4);
-
- var tertiaryMenu = angular.element(secondaryItems[0]).find('.nav-pf-tertiary-nav');
- expect(tertiaryMenu.length).toBe(1);
-
- collapseToggle = angular.element(tertiaryMenu[0]).find('.tertiary-collapse-toggle-pf');
- expect(collapseToggle.length).toBe(1);
-
- eventFire(collapseToggle[0], 'click');
- $scope.$digest();
-
- collased = element.find('.collapsed-tertiary-nav-pf');
- expect(collased.length).toBe(1);
- });
-
- it('should not show icons in hiddenIcons mode', function () {
- var htmlTmp = '' +
- '' +
- '
' +
- ' ' +
- ' ' +
- '
' +
- '
' +
- '
' +
- '';
-
- compileHTML(htmlTmp, $scope);
-
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var iconSpan = angular.element(primaryItems[0]).find('> a > span');
- expect(angular.element(iconSpan[0]).hasClass('hidden')).toBeTruthy();
- });
-
- it('should go to collapse mode when collpase toggle is clicked', function () {
- var menu = element.find('.nav-pf-vertical');
- expect(menu.length).toBe(1);
-
- var collapsedMenu = element.find('.nav-pf-vertical.collapsed');
- expect(collapsedMenu.length).toBe(0);
-
- var navBarToggle = element.find('.navbar-header .navbar-toggle');
- expect(navBarToggle.length).toBe(1);
-
- eventFire(navBarToggle[0], 'click');
- $scope.$digest();
-
- menu = element.find('.nav-pf-vertical');
- expect(menu.length).toBe(1);
-
- collapsedMenu = element.find('.nav-pf-vertical.collapsed');
- expect(collapsedMenu.length).toBe(1);
- });
-
- it('should show the alternate text when specified', function () {
- var brandIcon = element.find('.navbar-brand-icon');
- expect(brandIcon.length).toBe(1);
- var brandText = element.find('.navbar-brand-txt');
- expect(brandText.length).toBe(0);
-
- var htmlTmp = '' +
- '' +
- '
' +
- ' ' +
- ' ' +
- '
' +
- '
' +
- '
' +
- '';
-
- compileHTML(htmlTmp, $scope);
-
- brandIcon = element.find('.navbar-brand-icon');
- expect(brandIcon.length).toBe(0);
- brandText = element.find('.navbar-brand-txt');
- expect(brandText.length).toBe(1);
- });
-
- it('should invoke the navigateCallback when an item is clicked', function () {
- expect($scope.navigateItem).toBeUndefined();
-
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item > a');
- expect(primaryItems.length).toBe(6);
-
- eventFire(primaryItems[0], 'click');
- $scope.$digest();
-
- expect($scope.navigateItem).toBe($scope.navigationItems[0].title);
-
- // Clicking a non-final item
- eventFire(primaryItems[2], 'click');
- $scope.$digest();
-
- expect($scope.navigateItem).toBe($scope.navigationItems[2].children[0].children[0].title);
- });
-
- it('should invoke the itemClickCallback when any item is clicked', function () {
- expect($scope.clickItem).toBeUndefined();
-
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item > a');
- expect(primaryItems.length).toBe(6);
-
- eventFire(primaryItems[0], 'click');
- $scope.$digest();
-
- expect($scope.clickItem).toBe($scope.navigationItems[0].title);
-
- // Clicking a non-final item
- eventFire(primaryItems[2], 'click');
- $scope.$digest();
-
- expect($scope.clickItem).toBe($scope.navigationItems[2].title);
- });
-
- it('should set active items on primary item click when updateActiveItemsOnClick is true', function () {
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item > a');
- expect(primaryItems.length).toBe(6);
-
- var activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(0);
-
- var activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(0);
-
- var activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(0);
-
- eventFire(primaryItems[0], 'click');
- $scope.$digest();
-
- expect($scope.clickItem).toBe($scope.navigationItems[0].title);
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(1);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(0);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(0);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[0].title);
-
- // Clicking a non-final item will set active items on sub menus
- eventFire(primaryItems[2], 'click');
- $scope.$digest();
-
- expect($scope.clickItem).toBe($scope.navigationItems[2].title);
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(1);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(1);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(1);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[2].children[0].children[0].title);
- });
-
- it('should set active items on secondary item click when updateActiveItemsOnClick is true', function () {
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var secondaryItems = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav > .list-group > .list-group-item > a');
- expect(secondaryItems.length).toBe(4);
-
- // Clicking a non-final item will set active items on self, parent, and first sub item
- eventFire(secondaryItems[1], 'click');
- $scope.$digest();
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(1);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(1);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(1);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[2].children[1].children[0].title);
-
- // Clicking a final item will set active items on self and parent
- eventFire(secondaryItems[3], 'click');
- $scope.$digest();
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(1);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(1);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(0);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[2].children[3].title);
- });
-
- it('should set active items on tertiary item click when updateActiveItemsOnClick is true', function () {
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var secondaryItems = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav > .list-group > .list-group-item');
- expect(secondaryItems.length).toBe(4);
-
- var tertiaryItems = angular.element(secondaryItems[2]).find('.nav-pf-tertiary-nav > .list-group > .list-group-item > a');
- expect(tertiaryItems.length).toBe(3);
-
- // Clicking a non-final item will set active items on self, parent, and first sub item
- eventFire(tertiaryItems[1], 'click');
- $scope.$digest();
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(1);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(1);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(1);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[2].children[2].children[1].title);
-
- // Clicking a final item will set active items on self and parent
- eventFire(secondaryItems[3], 'click');
- $scope.$digest();
- });
-
- it('should not update active items when updateActiveItemsOnClick is not true', function () {
- var htmlTmp = '' +
- '' +
- '
' +
- ' ' +
- ' ' +
- '
' +
- '
' +
- '
' +
- '';
-
- compileHTML(htmlTmp, $scope);
-
- var primaryItems = element.find('.nav-pf-vertical > .list-group > .list-group-item > a');
- expect(primaryItems.length).toBe(6);
-
- var activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(0);
-
- var activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(0);
-
- var activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(0);
-
- eventFire(primaryItems[0], 'click');
- $scope.$digest();
-
- expect($scope.clickItem).toBe($scope.navigationItems[0].title);
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(0);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(0);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(0);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[0].title);
-
- eventFire(primaryItems[2], 'click');
- $scope.$digest();
-
- expect($scope.clickItem).toBe($scope.navigationItems[2].title);
-
- activePrimary = element.find('.nav-pf-vertical > .list-group > .list-group-item.active');
- expect(activePrimary.length).toBe(0);
-
- activeSecondary = element.find('.nav-pf-secondary-nav > .list-group > .list-group-item.active');
- expect(activeSecondary.length).toBe(0);
-
- activeTertiary = element.find('.nav-pf-tertiary-nav > .list-group > .list-group-item.active');
- expect(activeTertiary.length).toBe(0);
-
- expect($scope.navigateItem).toBe($scope.navigationItems[2].children[0].children[0].title);
- });
-
- it('should add badges', function () {
- var primaryMenu = element.find('.nav-pf-vertical');
- expect(primaryMenu.length).toBe(1);
-
- var primaryItems = primaryMenu.find('> .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var badges = angular.element(primaryItems[1]).find('.badge');
- expect(badges.length).toBe(1);
-
- var secondaryMenu = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav');
- expect(secondaryMenu.length).toBe(1);
-
- var secondaryItems = angular.element(secondaryMenu).find('> .list-group > .list-group-item');
- expect(secondaryItems.length).toBe(4);
-
- var tertiaryMenu = angular.element(secondaryItems[0]).find('.nav-pf-tertiary-nav');
- expect(tertiaryMenu.length).toBe(1);
-
- var tertiaryBadges = angular.element(tertiaryMenu).find('.badge');
- expect(tertiaryBadges.length).toBe(3);
- });
-
- it('should set classes on badges', function () {
- var primaryMenu = element.find('.nav-pf-vertical');
- expect(primaryMenu.length).toBe(1);
-
- var primaryItems = primaryMenu.find('> .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var secondaryMenu = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav');
- expect(secondaryMenu.length).toBe(1);
-
- var secondaryItems = angular.element(secondaryMenu).find('> .list-group > .list-group-item');
- expect(secondaryItems.length).toBe(4);
-
- var tertiaryMenu = angular.element(secondaryItems[0]).find('.nav-pf-tertiary-nav');
- expect(tertiaryMenu.length).toBe(1);
-
- var errorBadge = angular.element(tertiaryMenu).find('.badge.example-error-background');
- expect(errorBadge.length).toBe(1);
-
- var warningBadge = angular.element(tertiaryMenu).find('.badge.example-warning-background');
- expect(warningBadge.length).toBe(1);
- });
-
- it('should not show badges with a 0 count', function () {
- var primaryMenu = element.find('.nav-pf-vertical');
- expect(primaryMenu.length).toBe(1);
-
- var primaryItems = primaryMenu.find('> .list-group > .list-group-item');
- expect(primaryItems.length).toBe(6);
-
- var secondaryMenu = angular.element(primaryItems[2]).find('.nav-pf-secondary-nav');
- expect(secondaryMenu.length).toBe(1);
-
- var secondaryItems = angular.element(secondaryMenu).find('> .list-group > .list-group-item');
- expect(secondaryItems.length).toBe(4);
-
- var tertiaryMenu = angular.element(secondaryItems[0]).find('.nav-pf-tertiary-nav');
- expect(tertiaryMenu.length).toBe(1);
-
- var errorBadge = angular.element(tertiaryMenu).find('.badge.example-error-background > span');
- expect(errorBadge.length).toBe(1);
-
- var warningBadge = angular.element(tertiaryMenu).find('.badge.example-warning-background > span');
- expect(warningBadge.length).toBe(1);
-
- warningBadge = angular.element(tertiaryMenu).find('.example-ok-background > span');
- expect(warningBadge.length).toBe(0);
- });
-
- it('should not show badges when show-badges is not set', function () {
- var primaryMenu = element.find('.nav-pf-vertical');
- expect(primaryMenu.length).toBe(1);
-
- var badgesMenu = element.find('.nav-pf-vertical.nav-pf-vertical-with-badges');
- expect(badgesMenu.length).toBe(1);
-
- var badgesShown = element.find('.badge-container-pf');
- expect(badgesShown.length).toBeGreaterThan(0);
-
- var htmlTmp = '' +
- '' +
- '
' +
- ' ' +
- ' ' +
- '
' +
- '
' +
- '
' +
- '';
- compileHTML(htmlTmp, $scope);
-
- primaryMenu = element.find('.nav-pf-vertical');
- expect(primaryMenu.length).toBe(1);
-
- badgesMenu = element.find('.nav-pf-vertical-with-badges');
- expect(badgesMenu.length).toBe(0);
-
- badgesShown = element.find('.badge-container-pf');
- expect(badgesShown.length).toBe(0);
- });
-
- it('should throw and error if uiSref is used when $state is undefined', function () {
- var wellDefinedItem = element.find('.nav-pf-vertical > .list-group > .list-group-item:nth-child(2) > a');
- expect(function () {
- wellDefinedItem.click();
- }).toThrow(new Error("uiSref is defined on item, but no $state has been injected. Did you declare a dependency on \"ui.router\" module in your app?"));
- });
-
- it('should trigger a $digest when resizing', inject(function($window) {
- spyOn(isolateScope, '$digest');
- $window.innerWidth = 767;
- angular.element($window).triggerHandler('resize');
- expect(isolateScope.$digest).toHaveBeenCalled();
- }));
-});
-
-
-describe('Directive: pfVerticalNavigation with ui.router', function () {
- // Setting up some dummy controllers and some dummy states
- angular.module('mockApp', ['ui.router'])
- .controller('Controller0', function () {
- this.message = 'Page 0';
- }).controller('Controller1', function () {
- this.message = 'Page 1';
- }).config(function ($stateProvider, $urlRouterProvider) {
- $urlRouterProvider.otherwise("/state0");
-
- $stateProvider.state('state0', {
- url: "/state0",
- controller: 'Controller0',
- controllerAs: 'vm',
- template: ''
- }).state('state1', {
- url: "/state1",
- controller: 'Controller1',
- controllerAs: 'vm',
- template: ''
- });
- });
-
- var $state;
- var $scope;
- var $compile;
- var element;
- var isolateScope;
-
- // load the controller's module
- beforeEach(function () {
- module('patternfly.navigation', 'patternfly.utils', 'navigation/vertical-navigation.html');
- });
-
- beforeEach(module('mockApp'));
-
- beforeEach(inject(function (_$compile_, _$rootScope_, _$state_) {
- $compile = _$compile_;
- $scope = _$rootScope_;
- $state = _$state_;
-
- spyOn($state, 'go').and.callThrough();
- }));
-
- var compileHTML = function (markup, scope) {
- element = angular.element(markup);
- $compile(element)(scope);
-
- scope.$digest();
- isolateScope = element.find("pf-vertical-navigation").isolateScope();
- };
-
- beforeEach(function () {
- $scope.navigationItems = [
- {
- title: "Dashboard",
- iconClass: "fa fa-dashboard",
- uiSref: 'state1',
- uiSrefOptions: {name: "testing"}
- },
- {
- title: "Dolor",
- iconClass : "fa fa-shield",
- href: "#/state2",
- uiSref: 'state2',
- badges: [
- {
- count: 1283,
- tooltip: "Total number of items"
- }
- ]
- }
- ];
-
- $scope.handleNavigateClick = function (item) {
- $scope.navigateItem = item.title;
- };
-
- $scope.handleItemClick = function (item) {
- $scope.clickItem = item.title;
- };
-
- var htmlTmp = '' +
- '' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- '
' +
- ' ' +
- '';
-
- compileHTML(htmlTmp, $scope);
- });
-
- it('should trigger the $state.go() function when an item with ui-sref defined is clicked', function () {
- var wellDefinedItem = element.find('.nav-pf-vertical > .list-group > .list-group-item:nth-child(1) > a');
-
- expect($state.current.name).toBe("state0");
-
- // Click dashboard item
- wellDefinedItem.click();
-
- expect($state.go).toHaveBeenCalledWith('state1',{name: "testing"});
-
- // Checking successful state transition
- expect($state.current.name).toBe("state1");
- expect($state.current.controller).toBe("Controller1");
- });
-
- it('should throw and error if both uiSref and href are used on an item', function () {
- var badDefinedItem = element.find('.nav-pf-vertical > .list-group > .list-group-item:nth-child(2) > a');
-
- expect( function () {
- badDefinedItem.click();
- }).toThrow(new Error('Using both uiSref and href on an item is not supported.'));
- });
-});
-
diff --git a/test/notification/heading.html b/test/notification/heading.html
deleted file mode 100644
index d813715ad..000000000
--- a/test/notification/heading.html
+++ /dev/null
@@ -1 +0,0 @@
-