Extract list actions to directive

This commit is contained in:
Joe Fiorini 2015-03-11 14:57:50 -04:00
parent cb1787816f
commit 9aed0ad63a
4 changed files with 107 additions and 36 deletions

View File

@ -188,9 +188,12 @@ angular.module('GeneratorHelpers', [systemStatus.name])
if (toolbar) {
//if this is a toolbar button, set some defaults
console.log('toolbar button');
btn.class = 'btn-xs btn-primary';
btn.iconSize = 'fa-lg';
delete btn.label;
} else {
console.log('NOT A TOOLBAR BUTTON');
}
html += "<button type=\"button\" ";
@ -202,6 +205,7 @@ angular.module('GeneratorHelpers', [systemStatus.name])
html += " btn-sm";
}
console.log('btn:', btn);
html += (btn.awPopOver) ? " help-link-white" : "";
html += "\" ";
html += (btn.ngClick) ? Attr(btn, 'ngClick') : "";

View File

@ -71,6 +71,40 @@ export default ['$location', '$compile', '$rootScope', 'SearchWidget', 'Paginate
}
this.scope.list = list;
this.scope.mode = options.mode;
this.scope.performAction = function(action) {
console.log('performing:', action);
this.scope.$eval(action);
}.bind(this);
this.scope.shouldHideAction = function(options) {
return _.tap(this.scope.$eval(options.ngHide), function(value) { console.log('shouldHide:', value, this.scope.selected_group_id, options); }.bind(this));
}.bind(this);
this.scope.canShowAction = function(action) {
var base = $location.path().replace(/^\//, '').split('/')[0];
var inActionMode = options.mode === action.mode || action.mode === 'all';
var onScreenForAction =
(!options.basePaths) ||
(options.basePaths.indexOf(base) > -1);
var scopeShow = action.ngShow ? this.scope.$eval(action.ngShow) : true;
if (this.scope.shouldHideAction(action)) {
return false;
} else if (!scopeShow) {
console.log('scopeShow false', action.ngShow);
return false;
} else {
return _.tap(inActionMode && onScreenForAction, function(value) {
console.log('mode ', value, action);
});
}
// return _.tap(scopeShow || , function(value) {
// console.log('canShow:', value, options.mode, action.mode, scopeShow);
// });
}.bind(this);
$compile(element)(this.scope);
@ -203,7 +237,6 @@ export default ['$location', '$compile', '$rootScope', 'SearchWidget', 'Paginate
if (options.mode !== 'lookup') {
//actions
base = $location.path().replace(/^\//, '').split('/')[0];
html += "<div class=\"";
if (options.searchSize && !options.listSize) {
// User supplied searchSize, calc the remaining
@ -221,42 +254,34 @@ export default ['$location', '$compile', '$rootScope', 'SearchWidget', 'Paginate
}
html += "\">\n";
html += "<div class=\"list-actions\">\n";
html += "<div class=\"list-actions\">\n";
html += '<span ng-repeat="(name, options) in list.actions">';
html += '<toolbar-button name="name" options="options" on-selected="performAction(action)" ng-show="canShowAction(options)"></toolbar-button>';
html += '</span>';
// Add toolbar buttons or 'actions'
for (action in list.actions) {
if (list.actions[action].mode === 'all' || list.actions[action].mode === options.mode) {
if ((list.actions[action].basePaths === undefined) ||
(list.actions[action].basePaths && list.actions[action].basePaths.indexOf(base) > -1)) {
html += this.button({
btn: list.actions[action],
action: action,
toolbar: true
});
}
}
}
//select instructions
if (options.mode === 'select' && list.selectInstructions) {
btn = {
awPopOver: list.selectInstructions,
dataPlacement: 'left',
dataContainer: 'body',
'class': 'btn-xs btn-help',
awToolTip: 'Click for help',
dataTitle: 'Help',
iconSize: 'fa-lg'
};
//html += this.button(btn, 'select');
html += this.button({
btn: btn,
action: 'help',
toolbar: true
});
}
//select instructions
if (options.mode === 'select' && list.selectInstructions) {
btn = {
awPopOver: list.selectInstructions,
dataPlacement: 'left',
dataContainer: 'body',
'class': 'btn-xs btn-help',
awToolTip: 'Click for help',
dataTitle: 'Help',
iconSize: 'fa-lg'
};
//html += this.button(btn, 'select');
html += this.button({
btn: btn,
action: 'help',
toolbar: true
});
}
html += "</div><!-- list-acitons -->\n";
html += "</div><!-- list-acitons -->\n";
html += "</div><!-- list-actions-column -->\n";
} else {
//lookup

View File

@ -1,5 +1,8 @@
import generateList from './list-generator.factory';
import toolbarButton from './toolbar-button.directive';
import generatorHelpers from 'tower/shared/generator-helpers';
export default
angular.module('listGenerator', [])
.factory('generateList', generateList);
angular.module('listGenerator', [generatorHelpers.name])
.factory('generateList', generateList)
.directive('toolbarButton', toolbarButton);

View File

@ -0,0 +1,39 @@
export default ['$compile', 'Button', function($compile, Button) {
return {
restrict: 'E',
scope: {
name: '=',
options: '=',
onSelected: '&'
},
link: function(scope, element, attrs) {
var html = '';
// Save the ngClick property from
// legacy list actions
scope.action = scope.options.ngClick;
var btnOptions = _.clone(scope.options);
btnOptions.ngClick = "onSelected({ action: action })";
// These should be taken care of by
// using ng-show & ng-hide on this
// directive
delete btnOptions.ngHide;
delete btnOptions.ngShow;
// console.log('options:', scope.options);
html += Button({
btn: btnOptions,
action: scope.name,
toolbar: true
});
element.html(html);
$compile(element.contents())(scope);
}
};
}];