diff options
| -rw-r--r-- | install/ui/details.js | 3 | ||||
| -rw-r--r-- | install/ui/facet.js | 3 | ||||
| -rw-r--r-- | install/ui/ipa.css | 29 | ||||
| -rw-r--r-- | install/ui/widget.js | 146 |
4 files changed, 179 insertions, 2 deletions
diff --git a/install/ui/details.js b/install/ui/details.js index 1282912d5..ff8f4409b 100644 --- a/install/ui/details.js +++ b/install/ui/details.js @@ -122,7 +122,8 @@ IPA.section_builder = function(spec) { }; that.build_section = function(section_spec, index) { - section_spec.entity = that.entity; + section_spec.entity = that.container.entity; + section_spec.facet = that.container; if (!section_spec.label && section_spec.name) { var obj_messages = IPA.messages.objects[that.container.entity.name]; diff --git a/install/ui/facet.js b/install/ui/facet.js index ef8a06245..3c87dcfcd 100644 --- a/install/ui/facet.js +++ b/install/ui/facet.js @@ -347,7 +347,8 @@ IPA.facet_header = function(spec) { var widget_builder = IPA.widget_builder({ widget_options: { - entity: that.facet.entity + entity: that.facet.entity, + facet: that.facet } }); diff --git a/install/ui/ipa.css b/install/ui/ipa.css index 97cfca0e8..d79bf8748 100644 --- a/install/ui/ipa.css +++ b/install/ui/ipa.css @@ -892,6 +892,7 @@ hr { } .details-section { + position: relative; margin-top: 1em; margin-left: 4.5em; margin-right: 3.3em; @@ -1708,4 +1709,32 @@ form#login { .facet-title.disabled h3, .facet-title.disabled h3 .facet-pkey{ color: gray; +} + +.action-panel { + position: absolute; + right: 0; + top: 0; + + width: 150px; + + -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.6); + -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.6); + box-shadow: 0 1px 5px rgba(0, 0, 0, 0.6); +} + +.action-panel-list { + list-style: none; + padding-left: 15px; +} + +.action-title { + font-size: 1em; + font-weight: bold; + margin-left: 15px; +} + +.disabled { + color: gray; + cursor: default; }
\ No newline at end of file diff --git a/install/ui/widget.js b/install/ui/widget.js index 172e43a5c..85bc7132a 100644 --- a/install/ui/widget.js +++ b/install/ui/widget.js @@ -37,6 +37,7 @@ IPA.widget = function(spec) { that.label = spec.label; that.tooltip = spec.tooltip; that.entity = IPA.get_entity(spec.entity); //some old widgets still need it + that.facet = spec.facet; that.create = function(container) { container.addClass('widget'); @@ -55,6 +56,24 @@ IPA.widget = function(spec) { } }; + that.build_child = function(spec, factory) { + + if (typeof spec === 'function') { + spec = { + factory: spec + }; + } + + $.extend(spec, { + parent: that, + entity: that.entity, + facet: that.facet + }); + + var child = IPA.build(spec, factory); + return child; + }; + that.widget_create = that.create; return that; @@ -2639,12 +2658,18 @@ IPA.details_table_section = function(spec) { var that = IPA.details_section(spec); + that.action_panel = that.build_child(spec.action_panel); + that.rows = $.ordered_map(); that.composite_widget_create = function(container) { that.widget_create(container); + if (that.action_panel) { + that.action_panel.create(container); + } + var table = $('<table/>', { 'class': 'section-table' }).appendTo(container); @@ -3134,6 +3159,127 @@ IPA.sshkey_widget = function(spec) { return that; }; +IPA.action_panel = function(spec) { + + spec = spec || {}; + + var that = IPA.widget(spec); + + that.action_names = spec.actions; + that.actions = $.ordered_map(); + that.facet = spec.facet; + that.initialized = false; + + that.init = function() { + + for (var i=0; i<that.action_names.length; i++) { + var name = that.action_names[i]; + var action = that.facet.actions.get(name); + + that.add_action(action, true); + + that.actions.put(name, action); + } + + that.initialized = true; + }; + + that.add_action = function(action, batch) { + that.actions.put(action.name, action); + action.enabled_changed.attach(that.action_enabled_changed); + action.visible_changed.attach(that.action_visible_changed); + + if (!batch) { + that.create_items(); + } + }; + + that.create = function(container) { + + if (!that.initialized) that.init(); + + that.element = $('<div/>', { + 'data-name': that.name, + 'class': 'action-panel' + }); + + that.header_element = $('<h3/>', { + 'class': 'action-title' + }).appendTo(that.element); + + that.list_element = $('<ul/>', { + 'class': 'action-panel-list' + }).appendTo(that.element); + + that.element.appendTo(container); + + that.create_items(); + }; + + that.create_item = function(action) { + + var classes, state, li, a; + + classes = ['action']; + state = action.enabled ? 'enabled' : 'disabled'; + classes.push(state); + + li = $('<li/>'); + a = $('<a/>', { + 'data-name': action.name, + href: '#', + text: action.label, + 'class': classes.join(' '), + onclick: function() { + that.action_clicked(action); + return false; + } + }).appendTo(li); + li.appendTo(that.list_element); + }; + + that.clear_items = function() { + + that.list_element.empty(); + }; + + that.create_items = function() { + + if (!that.element) return; + + that.clear_items(); + + var actions = that.actions.values; + + for (var i=0; i<actions.length; i++) { + var action = actions[i]; + that.create_item(action); + } + + that.header_element.text(that.label); + }; + + that.action_clicked = function(action) { + + if (!action.enabled || !action.visible) return; + + action.execute(that.facet); + }; + + that.action_enabled_changed = function() { + + that.create_items(); + }; + + that.action_visible_changed = function() { + + that.create_items(); + }; + + + return that; +}; + IPA.widget_factories['attribute_table'] = IPA.attribute_table_widget; IPA.widget_factories['button'] = IPA.button_widget; |