From 1bb412239d0735af11c3939bfe437cb8b49c7004 Mon Sep 17 00:00:00 2001 From: Pavel Zuna Date: Thu, 16 Sep 2010 10:28:07 -0400 Subject: Big webUI patch. Quick summary: - use jQuery UI and jQuery BBQ libraries - code restructuring The patch has so many changes they can't be listed here. Many parts of the code have been rewritten from scrach. See freeipa-devel mailing list: webUI code restructuring [wall of text, diagrams, ... you've been warned!] 2010-09-07 --- install/static/Makefile.am | 2 + install/static/add.js | 177 +++++++++--------- install/static/associate.js | 321 +++++++++++++++++++++------------ install/static/details.js | 253 ++++++++++++-------------- install/static/develop.js | 2 + install/static/entity.js | 163 +++++++++++++++++ install/static/group.js | 199 +++++++-------------- install/static/groupmeta.js | 253 -------------------------- install/static/host.js | 67 ++++--- install/static/hostgroup.js | 121 +++++-------- install/static/index.xhtml | 134 +++----------- install/static/ipa.css | 57 +++--- install/static/ipa.js | 106 ++++++----- install/static/navigation.js | 286 +++++++---------------------- install/static/netgroup.js | 147 +++++---------- install/static/pageparams.js | 15 -- install/static/search.js | 268 ++++++++++++++++------------ install/static/user.js | 312 ++++++++------------------------ install/static/usermeta.js | 415 ------------------------------------------- install/static/webui.js | 124 +++++++++++++ 20 files changed, 1272 insertions(+), 2150 deletions(-) create mode 100644 install/static/develop.js create mode 100644 install/static/entity.js delete mode 100644 install/static/groupmeta.js delete mode 100644 install/static/pageparams.js delete mode 100644 install/static/usermeta.js create mode 100644 install/static/webui.js (limited to 'install/static') diff --git a/install/static/Makefile.am b/install/static/Makefile.am index b0c4c7f7b..825493501 100644 --- a/install/static/Makefile.am +++ b/install/static/Makefile.am @@ -23,6 +23,8 @@ app_DATA = \ pageparams.js \ search.js \ details.js \ + entity.js \ + webui.js \ user.js \ user-add.inc \ ipalogo.png \ diff --git a/install/static/add.js b/install/static/add.js index fcbcc5293..c657cfe54 100644 --- a/install/static/add.js +++ b/install/static/add.js @@ -1,5 +1,5 @@ /* Authors: - * Adam Young + * Pavel Zuna * * Copyright (C) 2010 Red Hat * see file 'COPYING' for use and warranty information @@ -16,107 +16,94 @@ * You should have received a copy of the GNU General Public License * along with this program; if not, write to the Free Software * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA - */ - -/* IPA Object Add - creating new instances of entities */ +*/ /* REQUIRES: ipa.js */ - -//Process for managing the 'add' functionality -function EntityBuilder(obj,addProperties){ - - var builder = this; - - this.obj = obj; - this.addProperties = addProperties; - - this.getPKey = function(){ - return $("#pkey").val(); - } - - this.getOptions = function(){ - return {}; - } - - this.add_fail = function(desc){ - alert(desc); - } - - this.add = function(pkey, on_success){ - var params = [pkey]; - var options = this.getOptions(); - ipa_cmd( 'add', params, options, on_success, this.add_fail, this.obj ); - } - - this.setup = function(){ - showContent(); - $("

" ,{ html : "Add new " + this.obj } ).appendTo("#content"); - $("
") - .appendTo("#content"); - var label =$("Add and ").appendTo("#addForm") - - $("", { - id:'addEdit', - type:'button', - value:'Edit', - click: function(){ - var params = ipa_parse_qs(); - var pkey = builder.getPKey(); - builder.add(pkey, function(response){ - if (response.error){ - if (response.error.message) { - alert(response.error.message); - } else { - alert("error adding entry"); - } - return; - } - var hash= "tab=" - +params["tab"] - +"&facet=details&pkey=" - +pkey; - window.location.hash = hash; - }); +var IPA_ADD_POPULATE = 1; +var IPA_ADD_UPDATE = 2; + +function add_dialog_create(obj_name, adl) +{ + var add_dialog = $('
'); + + function add(evt, called_from_add_and_edit) { + function add_win(data, text_status, xhr) { + if (called_from_add_and_edit) { + var state = {}; + state[obj_name + '-facet'] = 'details'; + var pkey_name = ipa_objs[obj_name].primary_key; + var selector = 'input[name=' + pkey_name + ']'; + state[obj_name + '-pkey'] = add_dialog.find(selector).val(); + $.bbq.pushState(state); } - }).appendTo(label); - - $("", { - id:'addAnother', - type:'button', - value:'Add Another', - click: function(){ - var params = ipa_parse_qs(); - var pkey = builder.getPKey(); - builder.add(pkey, function(response){ - if (response.error){ - if (response.error.message) { - alert(response.error.message); - } else { - alert("error adding entry"); - } - return; - } - builder.setup(); - }); + }; + + var pkey = []; + var options = {}; + var pkey_name = ipa_objs[obj_name].primary_key; + + var fields = adl[2]; + for (var i = 0; i < fields.length; ++i) { + var f = fields[i]; + var attr = f[0]; + if (typeof f[2] == 'function') { + var value = f[2](add_dialog, IPA_ADD_UPDATE); + if (value != null) { + if (attr == pkey_name) + pkey = [value]; + else + options[attr] = value; + } } - }).appendTo(label); - - $("
").appendTo("#addForm"); + } - for (index = 0; index < this.addProperties.length; index++){ - var prop = this.addProperties[index]; - var title = $("
",{html:prop.title}); - var definition = $("
"); - $("",{ - id:prop.id, - type:prop.type - }).appendTo(definition); - definition.appendTo(title); - title.appendTo("#addProperties"); + add_dialog.find('input').each(function () { + var jobj = $(this); + var attr = jobj.attr('name'); + var value = jobj.val(); + if (value) { + if (pkey.length == 0 && attr == pkey_name) + pkey = [jobj.val()]; + else if (options[attr] == null) + options[attr] = jobj.val(); + } + }); + + ipa_cmd('add', pkey, options, add_win, null, obj_name); + add_dialog.dialog('close'); + }; + + function add_and_edit(evt) { + add(evt, true); + add_dialog.dialog('close'); + }; + + function cancel() { + add_dialog.dialog('close'); + }; + + add_dialog.attr('id', adl[0]); + add_dialog.attr('title', adl[1]); + + var fields = adl[2]; + for (var i = 0; i < fields.length; ++i) { + var f = fields[i]; + if (typeof f[2] == 'function') { + f[2](add_dialog, IPA_ADD_POPULATE); + } else { + add_dialog.append(''); + add_dialog.append(''); } } -} - + add_dialog.dialog({ + modal: true, + buttons: { + 'Add': add, + 'Add and edit': add_and_edit, + 'Cancel': cancel + } + }); +} diff --git a/install/static/associate.js b/install/static/associate.js index cd07c9f75..11c160f8f 100644 --- a/install/static/associate.js +++ b/install/static/associate.js @@ -16,22 +16,17 @@ * You should have received a copy of the GNU General Public License * along with this program; if not, write to the Free Software * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA - */ - -/* IPA Object Add - creating new instances of entities */ +*/ /* REQUIRES: ipa.js */ - -function keyForFacet(tab, facet){ - qs = ipa_parse_qs(); - var key = qs['tab'] +'-'+ qs['facet']; - return key; -} +/* CURRENTLY ALSO REQUIRES search.js, because it reuses it's code to create + * the AssociationList elements; IT NEEDS IT'S OWN CODE! */ /** *This associator is built for the case where each association requires a separate rpc */ -function SerialAssociator(form, oneObjPkey, manyObjPkeys){ +function SerialAssociator(form, oneObjPkey, manyObjPkeys) +{ this.form = form; this.manyObjPkeys = manyObjPkeys; this.oneObjPkey = oneObjPkey; @@ -55,27 +50,28 @@ function SerialAssociator(form, oneObjPkey, manyObjPkeys){ }, form.manyObj ); }else{ - location.hash="tab="+form.oneObj - +"&facet=details&pkey="+this.oneObjPkey; + var state = {}; + state[form.oneObj + '-facet'] = 'associate'; + state[form.oneObj + '-pkey'] = this.oneObjPkey; + $.bbq.pushState(state); } } - } /** *This associator is for the common case where all the asociations can be sent in a single rpc */ -function BulkAssociator(form, pkey, manyObjPkeys){ - - this.form = form; - this.pkey =pkey; - this.manyObjPkeys = manyObjPkeys; +function BulkAssociator(form, pkey, manyObjPkeys) +{ + this.form = form; + this.pkey = pkey; + this.manyObjPkeys = manyObjPkeys; - this.associateNext = function(){ + this.associateNext = function() { var form = this.form; var option = manyObjPkeys.shift(); - while(manyObjPkeys.length > 0){ + while(manyObjPkeys.length > 0) { option += "," + manyObjPkeys.shift(); } @@ -85,15 +81,16 @@ function BulkAssociator(form, pkey, manyObjPkeys){ options[form.manyObj] = option; var args = [this.pkey]; - var associator = this; + ipa_cmd( form.method,args, options , function(response){ - var qs = ipa_parse_qs(); if (response.error){ alert("error adding memeber"); }else{ - location.hash="tab=" +form.oneObj - +"&facet=details&pkey="+associator.pkey; + var state = {}; + state[form.onObj + '-facet'] = 'associate'; + state[form.oneObj + '-pkey'] = this.pkey; + $.bbq.pushState(state); } }, function(response){ @@ -107,45 +104,42 @@ function BulkAssociator(form, pkey, manyObjPkeys){ * Create a form for a one to many association. * */ -function AssociationForm(oneObj, manyObj,facet,facets, searchColumn, headerText , associatorConstructor, method){ +function AssociationForm(oneObj, manyObj, pkey, jobj, associatorConstructor, method) +{ this.oneObj = oneObj; this.manyObj = manyObj; - this.facet = facet; - this.facets = facets; - this.headerText = headerText; - this.searchColumn = searchColumn; + this.searchColumn = pkey; + this.parentTab = jobj + //An optional parameter to determine what ipa method to call to create //the association - if (method){ + if (method) this.method = method; - }else{ + else this.method = 'add_member'; - } - if (associatorConstructor){ + if (associatorConstructor) this.associatorConstructor = associatorConstructor; - }else{ + else this.associatorConstructor = SerialAssociator; - } - - this.setup = function(pkey){ - showAssociations(); - qs = ipa_parse_qs(); - $("#availableList").html(""); - $("#enrollments").html(""); - setupFacetNavigation(this.oneObj,qs['pkey'],qs['facet'],this.facets); + this.setup = function() { + association_form_create(this.parentTab); + this.parentTab.find('#availableList').html(''); + this.parentTab.find('#enrollments').html(''); - this.currentUserToEnroll = qs['pkey']; - this.manyObjPkeys = []; + var currentObjToEnroll = $.bbq.getState(this.oneObj + '-pkey', true) || ''; var form = this; - $('h1').text(this.headerText()); - - - $("#enroll").click(function(){ + $('h1').text('Enroll ' + this.oneObj + ' ' + currentObjToEnroll + ' in ' + this.manyObj + '.'); + $('#enroll').click(function () { form.associate(); }); + $('#cancel').click(function () { + var state = {}; + state[form.oneObj + '-facet'] = 'associate'; + $.bbq.pushState(state); + }); $("#addToList").click(function(){ $('#availableList :selected').each(function(i, selected){ $("#enrollments").append(selected); @@ -161,97 +155,91 @@ function AssociationForm(oneObj, manyObj,facet,facets, searchColumn, headerText $("#find").click(function(){ form.search(); }); - } - this.search = function(){ - - var queryFilter = $("#associateFilter").val(); + }; + this.search = function() { var form = this; - ipa_cmd( 'find', [queryFilter], {}, - function(searchResults){ - form.populateSearch(searchResults); - }, - function(){ - alert("associationSearchFailure"); - }, - this.manyObj); - } - this.associate = function(){ - var manyObjPkeys = []; - $('#enrollments').children().each(function(i, selected){ + function search_on_win(data, text_status, xhr) { + var results = data.result; + $("#availableList").html(""); + for (var i =0; i != results.count; i++){ + var result = results.result[i]; + $("",{ + value: result[form.searchColumn][0], + html: result[form.searchColumn][0] + }).appendTo( $("#availableList")); + } + }; + + function search_on_fail(xhr, text_status, errow_thrown) { + alert("associationSearchFailure"); + }; + + var queryFilter = $('#associateFilter').val(); + ipa_cmd('find', [queryFilter], {}, search_on_win, null, this.manyObj); + }; + + this.associate = function () { + var manyObjPkeys = []; + $('#enrollments').children().each(function (i, selected) { manyObjPkeys.push(selected.value); }); - var pkey = qs['pkey']; + var pkey = $.bbq.getState(this.oneObj + '-pkey', true) || ''; var associator = - new this.associatorConstructor (this, pkey, manyObjPkeys); + new this.associatorConstructor(this, pkey, manyObjPkeys); associator.associateNext(); - } - this.populateSearch = function(searchResults){ - var results = searchResults.result; - $("#availableList").html(""); - for (var i =0; i != results.count; i++){ - var result = results.result[i]; - $("