diff --git a/www/aptui/create-dataset.php b/www/aptui/create-dataset.php index 3999fa2193136382edd04f7a2b1a2151b599f93b..bf4f654d8ec85c58509e60ee2981a39897046572 100644 --- a/www/aptui/create-dataset.php +++ b/www/aptui/create-dataset.php @@ -1,6 +1,6 @@ \n"; - SpitOopsModal("oops"); - SpitWaitModal("waitwait"); - SPITREQUIRE("create-dataset", ""); SPITFOOTER(); diff --git a/www/aptui/edit-dataset.php b/www/aptui/edit-dataset.php index 1aef1bde4094c33a4d85ec86ee09df0ed03b7798..3d0c9f29a6b3f70fa68c53852eb3055734766478 100644 --- a/www/aptui/edit-dataset.php +++ b/www/aptui/edit-dataset.php @@ -1,6 +1,6 @@ \n"; - SpitOopsModal("oops"); - SpitWaitModal("waitwait"); - SPITREQUIRE("create-dataset"); SPITFOOTER(); } diff --git a/www/aptui/invite.php b/www/aptui/invite.php index 77b25b94b47069b80fc9e9f87b4d2b447efbe40b..727fad1fe9ff6a690c3bd7cabfac931840bb7a39 100644 --- a/www/aptui/invite.php +++ b/www/aptui/invite.php @@ -1,6 +1,6 @@ "); + + // How do I just move the item into the wrapper? + wrapper.append($(item).clone()); + $(item).after(wrapper); + $(item).remove(); + + /* + * A normal placeholder can be used, but sometimes + * we want both a placeholder in the input, and a + * label outside of other text. + */ + if (_.has(item.dataset, "label")) { + var label = item.dataset['label']; + + wrapper.prepend("'); + } + } + }); + return root; + } + + function FormatFormFieldsHorizontal(html, options) { + var root = $(html); + var list = root.find('.format-me'); + var wide = (options && _.has(options, "wide") ? true : false); + + list.each(function (index, item) { + if (item.dataset) { + var key = item.dataset['key']; + var margin = 15; + var colsize = 12; + + // Squeeze vertical space for this field. + if (_.has(item.dataset, "compact")) { + margin = 5; + } + + /* + * Wrap in a div we can name. We assume the form + * is already form-group'ed as needed. We attach a + * name to the wrapper so we can find it later to + * add the error stuff. + */ + var wrapper = $("
"); + + /* + * A normal placeholder can be used, but sometimes + * we want both a placeholder in the input, and a + * label outside of other text. + */ + if (_.has(item.dataset, "label")) { + var label_text = + ""; + wrapper.append($(label_text)); + colsize = (wide ? 9 : 6); + } + var innerdiv = + $(""); + innerdiv.html($(item).clone()); + wrapper.append(innerdiv); + $(item).after(wrapper); + $(item).remove(); + } + }); + return root; + } + + /* + * Add errors to form + */ + function GenerateFormErrors(form, errors) { + $(form).find(".format-me").each(function () { + if (this.dataset) { + var key = this.dataset['key']; + + if (errors && _.has(errors, key)) { + $(this).parent().addClass("has-error"); + + var html = + ''; + + $(this).parent().append(html); + } + } + }); + } + + function ClearFormErrors(form) { + $(form).find(".format-me").each(function () { + if (this.dataset) { + var key = this.dataset['key']; + + // Remove the error label by id, that we added above. + if ($(this).parent().hasClass("has-error")) { + $(this).parent() + .find('#' + 'label-error-' + key).remove(); + $(this).parent().removeClass("has-error"); + } + } + }); + } + + /* + * Check a form. We add the errors before we return. + */ + function CheckForm(form, route, method, callback) { + /* + * Convert form data into formfields array, like all our + * form handler pages expect. + */ + var formfields = {}; + + var fields = $(form).serializeArray(); + $.each(fields, function(i, field) { + formfields[field.name] = field.value; + }); + ClearFormErrors(form); + + var checkonly_callback = function(json) { + console.info(json); + + /* + * We deal with these errors, the caller handles other errors. + */ + if (json.code == 2) { + GenerateFormErrors(form, json.value); + } + callback(json); + }; + var xmlthing = + sup.CallServerMethod(null, route, method, + {"formfields" : formfields, + "checkonly" : 1}); + xmlthing.done(checkonly_callback); + } + + /* + * Submit form. + */ + function SubmitForm(form, route, method, callback) { + /* + * Convert form data into formfields array, like all our + * form handler pages expect. + */ + var formfields = {}; + + var fields = $(form).serializeArray(); + $.each(fields, function(i, field) { + formfields[field.name] = field.value; + }); + var submit_callback = function(json) { + console.info(json); + sup.HideModal("#waitwait-modal"); + callback(json); + }; + sup.ShowModal("#waitwait-modal"); + var xmlthing = + sup.CallServerMethod(null, route, method, + {"formfields" : formfields, + "checkonly" : 0}); + xmlthing.done(submit_callback); + } + + // Exports from this module. + return { + "FormatFormFields" : FormatFormFields, + "FormatFormFieldsHorizontal" : FormatFormFieldsHorizontal, + "CheckForm" : CheckForm, + "SubmitForm" : SubmitForm, + "GenerateFormErrors" : GenerateFormErrors, + }; + } +); diff --git a/www/aptui/js/create-dataset.js b/www/aptui/js/create-dataset.js index e7c2327f5262d695b50e4655ab9e0adf741b439e..139f465faef84107f132d8edd869828e8cc27ff0 100644 --- a/www/aptui/js/create-dataset.js +++ b/www/aptui/js/create-dataset.js @@ -1,8 +1,11 @@ require(window.APT_OPTIONS.configObject, - ['underscore', 'js/quickvm_sup', 'moment', + ['underscore', 'js/quickvm_sup', 'moment', 'js/aptforms', 'js/lib/text!template/create-dataset.html', - 'js/lib/text!template/dataset-help.html'], -function (_, sup, moment, mainString, helpString) + 'js/lib/text!template/dataset-help.html', + 'js/lib/text!template/oops-modal.html', + 'js/lib/text!template/waitwait-modal.html'], +function (_, sup, moment, aptforms, + mainString, helpString, oopsString, waitwaitString) { 'use strict'; @@ -36,14 +39,18 @@ function (_, sup, moment, mainString, helpString) amlist = JSON.parse(_.unescape($('#amlist-json')[0].textContent)); } } - GeneratePageBody(fields, null); + GeneratePageBody(fields); + + // Now we can do this. + $('#oops_div').html(oopsString); + $('#waitwait_div').html(waitwaitString); } // // Moved into a separate function since we want to regen the form // after each submit, which happens via ajax on this page. // - function GeneratePageBody(formfields, errors) + function GeneratePageBody(formfields) { // Generate the template. var html = mainTemplate({ @@ -57,7 +64,7 @@ function (_, sup, moment, mainString, helpString) editing: editing, isadmin: isadmin, }); - html = formatter(html, errors).html(); + html = aptforms.FormatFormFieldsHorizontal(html); $('#main-body').html(html); // This activates the popover subsystem. @@ -166,120 +173,41 @@ function (_, sup, moment, mainString, helpString) // $('#dataset_submit_button').click(function (event) { event.preventDefault(); - HandleSubmit(); + SubmitForm(); }); } - // Formatter for the form. This did not work out nicely at all! - function formatter(fieldString, errors) - { - var root = $(fieldString); - var list = root.find('.format-me'); - list.each(function (index, item) { - if (item.dataset) { - var key = item.dataset['key']; - var margin = 15; - var colsize = 12; - - var outerdiv = $(""); - - if ($(item).attr('data-label')) { - var label_text = - ""; - outerdiv.append($(label_text)); - colsize = 6; - } - var innerdiv = $(""); - innerdiv.html($(item).clone()); - - if (errors && _.has(errors, key)) { - outerdiv.addClass('has-error'); - innerdiv.append(''); - } - outerdiv.append(innerdiv); - $(item).after(outerdiv); - $(item).remove(); - } - }); - return root; - } - - function HandleSubmit() - { - // Submit with check only at first, since this will return - // very fast, so no need to throw up a waitwait. - SubmitForm(1); - } - // // Submit the form. // - function SubmitForm(checkonly) + function SubmitForm() { - // Current form contents as formfields array. - var formfields = {}; - - var callback = function(json) { - console.info(json); - if (!checkonly) { - sup.HideModal("#waitwait"); - } + var submit_callback = function(json) { if (json.code) { - if (checkonly && json.code == 2) { - // Regenerate page with errors. - GeneratePageBody(formfields, json.value); - return; - } sup.SpitOops("oops", json.value); return; } - // Now do the actual create. - if (checkonly) { - sup.ShowModal("#waitwait"); - SubmitForm(0); + if (embedded) { + window.parent.location.replace("../" + json.value); } else { - if (embedded) { - window.parent.location.replace("../" + json.value); - } - else { - window.location.replace(json.value); + window.location.replace(json.value); + } + }; + var checkonly_callback = function(json) { + if (json.code) { + if (json.code != 2) { + sup.SpitOops("oops", json.value); } + return; } - } - // Convert form data into formfields array, like all our - // form handler pages expect. - var fields = $('#create_dataset_form').serializeArray(); - $.each(fields, function(i, field) { - formfields[field.name] = field.value; - }); - // This clears any errors before new submit. Needs more thought. - GeneratePageBody(formfields, null); - - var xmlthing = sup.CallServerMethod(null, "dataset", - (editing ? "modify" : "create"), - {"formfields" : formfields, - "checkonly" : checkonly, - "embedded" : window.EMBEDDED}); - xmlthing.done(callback); + aptforms.SubmitForm('#create_dataset_form', "dataset", + (editing ? "modify" : "create"), + submit_callback); + }; + aptforms.CheckForm('#create_dataset_form', "dataset", + (editing ? "modify" : "create"), + checkonly_callback); } /* diff --git a/www/aptui/js/invite.js b/www/aptui/js/invite.js index 45b61c82d3d293d4abb01774df4db9d279def897..de007ae3f11ace37831eafc5d5c17cf4c0be53ea 100644 --- a/www/aptui/js/invite.js +++ b/www/aptui/js/invite.js @@ -1,7 +1,7 @@ require(window.APT_OPTIONS.configObject, - ['underscore', 'js/quickvm_sup', + ['underscore', 'js/quickvm_sup', 'js/aptforms', 'js/lib/text!template/invite.html'], -function (_, sup, inviteString) +function (_, sup, aptforms, inviteString) { 'use strict'; var inviteTemplate = _.template(inviteString); @@ -20,33 +20,9 @@ function (_, sup, inviteString) projects: projlist, general_error: (errors.error || '') }); - $('#invite-body').html(formatter(invite_html, errors).html()); + $('#invite-body').html(aptforms.FormatFormFields(invite_html)); + aptforms.GenerateFormErrors('#invite_form', errors); } - function formatter(fieldString, errors) - { - var root = $(fieldString); - var list = root.find('.format-me'); - list.each(function (index, item) { - if (item.dataset) { - var key = item.dataset['key']; - var wrapper = $(''); - wrapper.addClass('sidebyside-form'); - wrapper.addClass('form-group'); - wrapper.html($(item).clone()); - - if (_.has(errors, key)) - { - wrapper.addClass('has-error'); - wrapper.append(''); - } - $(item).after(wrapper); - $(item).remove(); - } - }); - return root; - } $(document).ready(initialize); }); diff --git a/www/aptui/js/manage_profile.js b/www/aptui/js/manage_profile.js index c22be6ba6a19ba49b3cd598df20ab026e7b9a535..800c92851a70eba96fd1def6252e4831948f8d9b 100644 --- a/www/aptui/js/manage_profile.js +++ b/www/aptui/js/manage_profile.js @@ -1,6 +1,6 @@ require(window.APT_OPTIONS.configObject, ['underscore', 'js/quickvm_sup', 'filesize', 'js/JacksEditor', - 'js/image', 'moment', 'js/ppstart', + 'js/image', 'moment', 'js/aptforms', 'js/lib/text!template/manage-profile.html', 'js/lib/text!template/waitwait-modal.html', 'js/lib/text!template/renderer-modal.html', @@ -13,7 +13,7 @@ require(window.APT_OPTIONS.configObject, 'js/lib/text!template/share-modal.html', // jQuery modules 'filestyle','marked'], -function (_, sup, filesize, JacksEditor, ShowImagingModal, moment, ppstart, +function (_, sup, filesize, JacksEditor, ShowImagingModal, moment, aptforms, manageString, waitwaitString, rendererString, showtopoString, oopsString, rspectextviewString, guestInstantiateString, publishString, instantiateString, @@ -116,8 +116,10 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment, ppstart, versions: versions, withpublishing: window.WITHPUBLISHING, }); - manage_html = formatter(manage_html, errors).html(); + manage_html = aptforms.FormatFormFieldsHorizontal(manage_html, + {"wide" : true}); $('#manage-body').html(manage_html); + aptforms.GenerateFormErrors('#quickvm_create_profile_form', errors); var waitwait_html = waitwaitTemplate({}); $('#waitwait_div').html(waitwait_html); @@ -400,25 +402,11 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment, ppstart, }); /* - * The instantiate button. If a plain profile, throw up the - * confirm modal. If a parameterized profile, hand off to the - * ppstart js code. + * The instantiate button. */ $('#profile_instantiate_button').click(function (event) { - if (true) { - window.location.replace("instantiate.php?profile=" + - version_uuid); - return; - } - if (isppprofile) { - ppstart({uuid : version_uuid, - registered : true, - amlist : amlist, - amdefault : window.AMDEFAULT, - }); - return; - } - sup.ShowModal('#instantiate_modal'); + window.location.replace("instantiate.php?profile=" + + version_uuid); }); /* @@ -509,61 +497,6 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment, ppstart, } } - // Formatter for the form. This did not work out nicely at all! - function formatter(fieldString, errors) - { - var root = $(fieldString); - var list = root.find('.format-me'); - list.each(function (index, item) { - if (item.dataset) { - var key = item.dataset['key']; - var margin = 15; - var colsize = 12; - - if ($(item).attr('data-compact')) { - margin = 5; - } - var outerdiv = $(""); - - if ($(item).attr('data-label')) { - var label_text = - ""; - outerdiv.append($(label_text)); - colsize = 10; - } - var innerdiv = $(""); - innerdiv.html($(item).clone()); - - if (_.has(errors, key)) { - outerdiv.addClass('has-error'); - innerdiv.append(''); - } - outerdiv.append(innerdiv); - $(item).after(outerdiv); - $(item).remove(); - } - }); - return root; - } - /* * Yank the steps out of the xml and create the editable table. * Before the form is submitted, we have to convert (update the diff --git a/www/aptui/js/myaccount.js b/www/aptui/js/myaccount.js index aff55ec521cb9eaa558b52c2e5666a5c7d109828..408afc719e7c1911e6d189c8a60e04e436ff9940 100644 --- a/www/aptui/js/myaccount.js +++ b/www/aptui/js/myaccount.js @@ -1,12 +1,13 @@ require(window.APT_OPTIONS.configObject, - ['underscore', 'js/quickvm_sup', + ['underscore', 'js/quickvm_sup', 'js/aptforms', 'js/lib/text!template/myaccount.html', 'js/lib/text!template/verify-modal.html', 'js/lib/text!template/oops-modal.html', 'js/lib/text!template/waitwait-modal.html', // jQuery modules 'formhelpers'], -function (_, sup, myaccountString, verifyString, oopsString, waitwaitString) +function (_, sup, aptforms, + myaccountString, verifyString, oopsString, waitwaitString) { 'use strict'; @@ -44,7 +45,7 @@ function (_, sup, myaccountString, verifyString, oopsString, waitwaitString) $('#submit_button').removeAttr("disabled"); } - function renderForm(formfields, errors) + function renderForm(formfields) { var verify = verifyTemplate({ id: 'verify_modal', @@ -54,12 +55,12 @@ function (_, sup, myaccountString, verifyString, oopsString, waitwaitString) if (errors && errors.error) { generror = errors.error; } - var myaccount = Formatter(myaccountTemplate({ + var myaccount = aptforms.FormatFormFields(myaccountTemplate({ formfields: formfields, general_error: generror, verify_modal: verify, nopassword: window.APT_OPTIONS.nopassword, - }), errors); + }); $('#page-body').html(myaccount); $('#signup_countries').bfhcountries({ country: formfields.country, @@ -78,7 +79,7 @@ function (_, sup, myaccountString, verifyString, oopsString, waitwaitString) event.preventDefault(); // Disable the Stay on Page alert above. window.onbeforeunload = null; - SubmitForm(1); + SubmitForm(); return false; }); $('#verify_modal_submit').click(function (event) { @@ -86,92 +87,40 @@ function (_, sup, myaccountString, verifyString, oopsString, waitwaitString) // Disable the Stay on Page alert above. window.onbeforeunload = null; sup.HideModal('#verify_modal'); - SubmitForm(1); + SubmitForm(); return false; }); } - function Formatter(fieldString, errors) - { - var root = $(fieldString); - var list = root.find('.format-me'); - list.each(function (index, item) { - if (item.dataset) - { - var key = item.dataset['key']; - var wrapper = $(''); - var placeholder = item.placeholder; - if (!placeholder) { - placeholder = item.dataset['placeholder']; - } - wrapper.append(''); - wrapper.append($(item).clone()); - - if (errors && _.has(errors, key)) - { - wrapper.addClass('has-error'); - wrapper.append(''); - } - $(item).after(wrapper); - $(item).remove(); - } - }); - return root; - } - // // Submit the form. // - function SubmitForm(checkonly) + function SubmitForm() { - // Current form contents as formfields array. - var formfields = {}; - - var callback = function(json) { - if (!checkonly) { - sup.HideModal("#waitwait-modal"); + var submit_callback = function(json) { + if (json.code) { + sup.SpitOops("oops", json.value); + return; } - console.info(json); - + window.location.reload(); + }; + var checkonly_callback = function(json) { if (json.code) { - if (json.code == 2) { - // Regenerate with errors. - renderForm(formfields, json.value); - return; - } // Email not verified, throw up form. if (json.code == 3) { sup.ShowModal('#verify_modal'); return; } - sup.SpitOops("oops", json.value); + else if (json.code != 2) { + sup.SpitOops("oops", json.value); + } return; } - // Now do the actual create. - if (checkonly) { - SubmitForm(0); - } - else { - window.location.reload(); - } - } - // Convert form data into formfields array, like all our - // form handler pages expect. - var fields = $('#myaccount_form').serializeArray(); - $.each(fields, function(i, field) { - formfields[field.name] = field.value; - }); - if (!checkonly) { - sup.ShowModal("#waitwait-modal"); - } - var xmlthing = - sup.CallServerMethod(null, "myaccount", "update", - {"formfields" : formfields, - "checkonly" : checkonly}); - xmlthing.done(callback); + aptforms.SubmitForm('#myaccount_form', "myaccount", "update", + submit_callback); + }; + aptforms.CheckForm('#myaccount_form', "myaccount", "update", + checkonly_callback); } $(document).ready(initialize); }); diff --git a/www/aptui/js/ppstart.js b/www/aptui/js/ppstart.js deleted file mode 100644 index bf1fd8ac187bb43dac4facc497ca65a83f7c76dd..0000000000000000000000000000000000000000 --- a/www/aptui/js/ppstart.js +++ /dev/null @@ -1,303 +0,0 @@ -// -// Start a Parameterized Profile -// -define(['underscore', 'js/quickvm_sup', 'js/JacksEditor', - 'js/lib/text!template/ppform-modal.html', - 'js/lib/text!template/ppform-body.html', - 'js/lib/text!template/choose-am.html', - ], -function(_, sup, JacksEditor, ppmodalString, ppbodyString, chooserString) - { - 'use strict'; - - var bodyTemplate = null; - var chooseTemplate= null; - var editor = null; - var defaults = null; - var uuid = ""; - var amlist = null; - var amdefault = null; - var registered = true; - var callback_done = null; - var button_label = "Instantiate"; - var RSPEC = null; - - // - // Moved into a separate function since we want to regen the form - // after each submit, which happens via ajax on this page. - // - function GenerateModalBody(formfields, errors){ - // Generate the template. - var html = bodyTemplate({ - formfields: formfields, - }); - - html = formatter(html, errors).html(); - $('#ppmodal-body').html(html); - if (!registered) { - $('#pp_form :input').attr('readonly', true); - // This is the only way to disable selects - $('#pp_form :input').attr('disabled', true); - // Have to renable the buttons after disabling selects - $('#pp_form :button').attr('disabled', false); - $('#pp_form :button').attr('readonly', false); - } - - // - // Handle submit button. - // - $('#modal_profile_continue_button').click(function (event) { - event.preventDefault(); - HandleSubmit(); - }); - } - - // Formatter for the form. This did not work out nicely at all! - function formatter(fieldString, errors) - { - var root = $(fieldString); - var list = root.find('.format-me'); - list.each(function (index, item) { - if (item.dataset) { - var key = item.dataset['key']; - var margin = 15; - var colsize = 12; - - var outerdiv = $(""); - - if ($(item).attr('data-label')) { - var label_text = - ""; - outerdiv.append($(label_text)); - colsize = 6; - } - var innerdiv = $(""); - innerdiv.html($(item).clone()); - - if (errors && _.has(errors, key)) { - outerdiv.addClass('has-error'); - innerdiv.append(''); - } - outerdiv.append(innerdiv); - $(item).after(outerdiv); - $(item).remove(); - } - }); - return root; - } - - function HandleSubmit() - { - /* - * If not a registered user, then continue takes them back. - */ - if (!registered) { - sup.HideModal('#ppmodal'); - if (callback_done) { - callback_done(null); - } - return; - } - - // Submit with check only at first, since this will return - // very fast, so no need to throw up a waitwait. - SubmitForm(1); - } - - // Instantiate the new rspec on the chosen aggregate. - function Instantiate(where) - { - if (callback_done) { - callback_done(RSPEC, where); - return; - } - var callback = function(json) { - sup.HideModal("#waitwait-modal"); - - if (json.code) { - sup.SpitOops("oops", json.value); - return; - } - window.location.replace(json.value); - } - sup.ShowModal("#waitwait-modal"); - var xmlthing = sup.CallServerMethod(null, "instantiate", - "Instantiate", - {"rspec" : RSPEC, - "where" : where, - "uuid" : uuid}); - xmlthing.done(callback); - } - - // - // Editor callback, returning the new rspec. - // - function EditorDone(newRspec) - { - if (!amlist || amlist.length == 1) { - Instantiate(amdefault); - return; - } - var html = chooseTemplate({ - amlist : amlist, - amdefault : amdefault, - }); - $('#instantiate_div').html(html); - - // Handler for instantiate submit button, which is in - // the modal. - $('#amchooser_submit_button').click(function (event) { - event.preventDefault(); - sup.HideModal("#amchooser_modal"); - Instantiate($('#amchooser_where option:selected').val()); - }); - sup.ShowModal("#amchooser_modal"); - } - - // - // Editor canceled; put back the configure modal. - // - function EditorCancel() - { - sup.ShowModal('#ppmodal'); - } - - // - // Submit the form. If no errors, we get back the rspec. Throw that - // up in a Jack editor window. - // - function SubmitForm(checkonly) - { - // Current form contents as formfields array. - var formfields = {}; - - var callback = function(json) { - console.log(json); - if (!checkonly) { - sup.HideModal("#waitwait-modal"); - } - if (json.code) { - if (checkonly && json.code == 2) { - // Regenerate page with errors. - GenerateModalBody(formfields, json.value); - return; - } - sup.HideModal('#ppmodal'); - sup.SpitOops("oops", json.value); - return; - } - if (checkonly) { - // Form checked out okay, submit again to generate rspec. - sup.HideModal('#ppmodal'); - sup.ShowModal("#waitwait-modal"); - SubmitForm(0); - } - else { - if (_.has(json.value, "amdefault")) { - amdefault = json.value.amdefault; - } - // Got the rspec, show the editor. - RSPEC = json.value.rspec; - console.log(json); - if (json.value.rspec) - { - editor.show(json.value.rspec, - EditorDone, EditorCancel, button_label); - } - } - } - // Convert form data into formfields array, like all our - // form handler pages expect. - var fields = $('#pp_form').serializeArray(); - $.each(fields, function(i, field) { - formfields[field.name] = field.value; - }); - // This clears any errors before new submit. Needs more thought. - GenerateModalBody(formfields, null); - - var xmlthing = sup.CallServerMethod(null, "manage_profile", - "BindParameters", - {"formfields" : formfields, - "uuid" : uuid, - "checkonly" : checkonly}); - xmlthing.done(callback); - } - - return function(args) - { - uuid = args.uuid; - registered = args.registered; - amlist = args.amlist; - amdefault = args.amdefault; - - if (bodyTemplate) { - GenerateModalBody(defaults, null); - sup.ShowModal('#ppmodal'); - return; - } - // Caller might already have an editor instance. - editor = new JacksEditor($('#ppviewmodal_div'), true); - // Callback; instead of instantiate, send rspec to callback. - if (_.has(args, "callback")) { - callback_done = args.callback; - } - // Allow caller to change the Jacks accept button label. - if (_.has(args, "button_label")) { - button_label = args.button_label; - } - - /* - * Need to ask for the profile parameter form fragment and - * the initial values. - */ - var callback = function(json) { - console.info(json); - if (json.code) { - sup.SpitOops("oops", json.value); - } - defaults = json.value.defaults; - // This is the modal. - $('#ppmodal_div').html(ppmodalString); - // This is the form inside the modal - bodyTemplate = _.template(ppbodyString); - // This is the aggregate selector modal. - chooseTemplate = _.template(chooserString); - - // Build a new template by inserting the form fragment, which - // itself will refer to templated variables. - var html = bodyTemplate({ - registered: registered, - formfrag: _.unescape(json.value.formfrag), - }); - bodyTemplate = _.template(html); - GenerateModalBody(defaults, null); - sup.ShowModal('#ppmodal'); - } - var xmlthing = sup.CallServerMethod(null, "instantiate", - "GetParameters", - {"uuid" : uuid}); - xmlthing.done(callback); - } - } -); diff --git a/www/aptui/js/show-dataset.js b/www/aptui/js/show-dataset.js index 3dd2d2f5fc794706598f30ff17f70e085e4486a8..5db2c96308527cba1df95f0ab8bbc351c603c96f 100644 --- a/www/aptui/js/show-dataset.js +++ b/www/aptui/js/show-dataset.js @@ -1,9 +1,11 @@ require(window.APT_OPTIONS.configObject, - ['underscore', 'js/quickvm_sup', 'moment', + ['underscore', 'js/quickvm_sup', 'moment', 'js/aptforms', 'js/image', 'js/lib/text!template/show-dataset.html', 'js/lib/text!template/snapshot-dataset.html', - 'js/image'], -function (_, sup, moment, mainString, snapshotString, ShowImagingModal) + 'js/lib/text!template/oops-modal.html', + 'js/lib/text!template/waitwait-modal.html'], +function (_, sup, moment, aptforms, ShowImagingModal, + mainString, snapshotString, oopsString, waitwaitString) { 'use strict'; var mainTemplate = _.template(mainString); @@ -40,6 +42,10 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) }); $('#main-body').html(html); + // Now we can do this. + $('#oops_div').html(oopsString); + $('#waitwait_div').html(waitwaitString); + // Initialize the popover system. $('[data-toggle="popover"]').popover({ trigger: 'hover', @@ -171,7 +177,7 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) function DeleteDataset() { var callback = function(json) { - sup.HideModal('#waitwait'); + sup.HideModal('#waitwait-modal'); if (json.code) { sup.SpitOops("oops", json.value); return; @@ -184,7 +190,7 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) } } sup.HideModal('#delete_modal'); - sup.ShowModal("#waitwait"); + sup.ShowModal("#waitwait-modal"); var xmlthing = sup.CallServerMethod(null, "dataset", "delete", @@ -198,14 +204,14 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) function RefreshDataset() { var callback = function(json) { - sup.HideModal('#waitwait'); + sup.HideModal('#waitwait-modal'); if (json.code) { sup.SpitOops("oops", json.value); return; } window.location.reload(true); } - sup.ShowModal("#waitwait"); + sup.ShowModal("#waitwait-modal"); var xmlthing = sup.CallServerMethod(null, "dataset", "refresh", @@ -218,7 +224,7 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) function ApproveDataset() { var callback = function(json) { - sup.HideModal('#waitwait'); + sup.HideModal('#waitwait-modal'); if (json.code) { sup.SpitOops("oops", json.value); return; @@ -231,7 +237,7 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) } } sup.HideModal('#approve_modal'); - sup.ShowModal("#waitwait"); + sup.ShowModal("#waitwait-modal"); var xmlthing = sup.CallServerMethod(null, "dataset", "approve", @@ -244,7 +250,7 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) function ExtendDataset() { var callback = function(json) { - sup.HideModal('#waitwait'); + sup.HideModal('#waitwait-modal'); if (json.code) { sup.SpitOops("oops", json.value); return; @@ -257,7 +263,7 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) } } sup.HideModal('#extend_modal'); - sup.ShowModal("#waitwait"); + sup.ShowModal("#waitwait-modal"); var xmlthing = sup.CallServerMethod(null, "dataset", "extend", @@ -265,62 +271,10 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) xmlthing.done(callback); } - // Formatter for the form. This did not work out nicely at all! - function formatter(fieldString, errors) - { - var root = $(fieldString); - var list = root.find('.format-me'); - list.each(function (index, item) { - if (item.dataset) { - var key = item.dataset['key']; - var margin = 15; - var colsize = 12; - - var outerdiv = $(""); - - if ($(item).attr('data-label')) { - var label_text = - ""; - outerdiv.append($(label_text)); - colsize = 6; - } - var innerdiv = $(""); - innerdiv.html($(item).clone()); - - if (errors && _.has(errors, key)) { - outerdiv.addClass('has-error'); - innerdiv.append(''); - } - outerdiv.append(innerdiv); - $(item).after(outerdiv); - $(item).remove(); - } - }); - return root; - } - /* * Show the snapshot modal/form for imdatasets. */ - function ShowSnapshotModal(formfields, errors) + function ShowSnapshotModal(formfields) { if (formfields === null) { formfields = {}; @@ -328,10 +282,11 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) // Generate the main template. var html = snapTemplate({ formfields: formfields, + dataset_uuid: dataset_uuid, embedded: embedded, instancelist: instances, }); - html = formatter(html, errors).html(); + html = aptforms.FormatFormFieldsHorizontal(html); $('#snapshot_div').html(html); // Handler for instance change. @@ -353,67 +308,40 @@ function (_, sup, moment, mainString, snapshotString, ShowImagingModal) // $('#snapshot_submit_button').click(function (event) { event.preventDefault(); - HandleSubmit(); + SubmitForm(); }); sup.ShowModal("#snapshot_modal"); } - function HandleSubmit() - { - // Submit with check only at first, since this will return - // very fast, so no need to throw up a waitwait. - SubmitForm(1); - } - // // Submit the form. // - function SubmitForm(checkonly) + function SubmitForm() { - // Current form contents as formfields array. - var formfields = {}; - - var callback = function(json) { - console.info(json); - + var submit_callback = function(json) { if (json.code) { - sup.HideModal("#waitwait"); - if (checkonly && json.code == 2) { - // Regenerate with errors. - ShowSnapshotModal(formfields, json.value); - return; - } sup.SpitOops("oops", json.value); return; } - // Now do the actual create. - if (checkonly) { - SubmitForm(0); + if (embedded) { + window.parent.location.replace("../" + json.value); } else { - if (embedded) { - window.parent.location.replace("../" + json.value); - } - else { - window.location.replace(json.value); + window.location.replace(json.value); + } + }; + var checkonly_callback = function(json) { + if (json.code) { + if (json.code != 2) { + sup.SpitOops("oops", json.value); } + return; } - } - // Convert form data into formfields array, like all our - // form handler pages expect. - var fields = $('#snapshot_dataset_form').serializeArray(); - $.each(fields, function(i, field) { - formfields[field.name] = field.value; - }); - formfields["dataset_uuid"] = dataset_uuid; - console.info(formfields); - sup.HideModal('#snapshot_modal'); - sup.ShowModal('#waitwait'); - var xmlthing = sup.CallServerMethod(null, "dataset", "modify", - {"formfields" : formfields, - "checkonly" : checkonly, - "embedded" : window.EMBEDDED}); - xmlthing.done(callback); + aptforms.SubmitForm('#snapshot_dataset_form', "dataset", "modify", + submit_callback); + }; + aptforms.CheckForm('#snapshot_dataset_form', "dataset", "modify", + checkonly_callback); } /* diff --git a/www/aptui/js/show-profile.js b/www/aptui/js/show-profile.js index 83067b81697201b7c2c3224d16d9b026bd458ff2..0d5491817a1db53efcf2213143b4b8c0ff7e32d3 100644 --- a/www/aptui/js/show-profile.js +++ b/www/aptui/js/show-profile.js @@ -1,5 +1,5 @@ require(window.APT_OPTIONS.configObject, - ['underscore', 'js/quickvm_sup', 'moment', 'js/ppstart', + ['underscore', 'js/quickvm_sup', 'moment', 'js/lib/text!template/show-profile.html', 'js/lib/text!template/waitwait-modal.html', 'js/lib/text!template/renderer-modal.html', @@ -11,7 +11,7 @@ require(window.APT_OPTIONS.configObject, 'js/lib/text!template/share-modal.html', // jQuery modules 'marked'], -function (_, sup, moment, ppstart, +function (_, sup, moment, showString, waitwaitString, rendererString, showtopoString, rspectextviewString, guestInstantiateString, instantiateString, oopsString, shareString) @@ -141,24 +141,11 @@ function (_, sup, moment, ppstart, }); /* - * The instantiate button. If a plain profile, throw up the - * confirm modal. If a parameterized profile, hand off to the - * ppstart js code. + * The instantiate button. */ $('#profile_instantiate_button').click(function (event) { - if (true) { - window.location.replace("instantiate.php?profile=" + - version_uuid); - return; - } - if (isppprofile) { - ppstart({uuid : version_uuid, - registered : true, - amlist : amlist, - amdefault : window.AMDEFAULT}); - return; - } - sup.ShowModal('#instantiate_modal'); + window.location.replace("instantiate.php?profile=" + + version_uuid); }); // Handler for normal instantiate submit button, which is in // the modal. diff --git a/www/aptui/js/signup.js b/www/aptui/js/signup.js index ee0da63c013bf2af749c74674a89c6b639b0f9c4..11a04901d6bf6b20e140cea8516a9747be3415f3 100644 --- a/www/aptui/js/signup.js +++ b/www/aptui/js/signup.js @@ -1,5 +1,5 @@ require(window.APT_OPTIONS.configObject, - ['underscore', 'js/quickvm_sup', + ['underscore', 'js/quickvm_sup', 'js/aptforms', 'js/lib/text!template/about-account.html', 'js/lib/text!template/verify-modal.html', 'js/lib/text!template/signup-personal.html', @@ -8,7 +8,7 @@ require(window.APT_OPTIONS.configObject, 'js/lib/text!template/toomany-modal.html', // jQuery modules 'formhelpers'], -function (_, sup, +function (_, sup, aptforms, aboutString, verifyString, personalString, projectString, signupString, toomanyString) { @@ -27,6 +27,10 @@ function (_, sup, var fields = JSON.parse(_.unescape($('#form-json')[0].textContent)); var errors = JSON.parse(_.unescape($('#error-json')[0].textContent)); + + console.info(fields); + console.info(errors); + renderForm(fields, errors, window.APT_OPTIONS.joinproject, window.APT_OPTIONS.ShowVerifyModal, @@ -64,14 +68,14 @@ function (_, sup, id: 'verify_modal', label: buttonLabel }); - var personal = formatter(personalTemplate({ + var personal_html = personalTemplate({ formfields: formfields, - promoting: promoting, - }), errors); - var project = Newformatter(projectTemplate({ + promoting: promoting + }); + var project_html = projectTemplate({ joinproject: joinproject, formfields: formfields - }), errors); + }); var signup = signupTemplate({ button_label: buttonLabel, general_error: (errors.error || ''), @@ -81,10 +85,11 @@ function (_, sup, joinproject: joinproject, verify_modal: verify, pubkey: formfields.pubkey, - personal_fields: personal.html(), - project_fields: project.html() + personal_fields: personal_html, + project_fields: project_html, }); - $('#signup-body').html(signup); + $('#signup-body').html(aptforms.FormatFormFields(signup)); + aptforms.GenerateFormErrors('#quickvm_signup_form', errors); if (showVerify) { sup.ShowModal('#verify_modal'); @@ -101,58 +106,5 @@ function (_, sup, $form.find('input:text, input:password, select, textarea').val(''); } - function formatter(fieldString, errors) - { - var result = $(''); - var fields = $(fieldString); - fields.each(function (index, item) { - if (item.dataset) - { - var key = item.dataset['key']; - var wrapper = $('