mirror of
https://github.com/OpenNebula/one.git
synced 2025-03-22 18:50:08 +03:00
Feature #4217: Add MarketPlace create and update forms
The previous commit was MarketPlaceApp
This commit is contained in:
Daniel Molina
parent
4630a422ed
commit
284905c9fb
@ -0,0 +1,347 @@
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* Copyright 2002-2015, OpenNebula Project, OpenNebula Systems */
|
||||
/* */
|
||||
/* Licensed under the Apache License, Version 2.0 (the "License"); you may */
|
||||
/* not use this file except in compliance with the License. You may obtain */
|
||||
/* a copy of the License at */
|
||||
/* */
|
||||
/* http://www.apache.org/licenses/LICENSE-2.0 */
|
||||
/* */
|
||||
/* Unless required by applicable law or agreed to in writing, software */
|
||||
/* distributed under the License is distributed on an "AS IS" BASIS, */
|
||||
/* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. */
|
||||
/* See the License for the specific language governing permissions and */
|
||||
/* limitations under the License. */
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
define(function(require) {
|
||||
/*
|
||||
DEPENDENCIES
|
||||
*/
|
||||
|
||||
var BaseFormPanel = require('utils/form-panels/form-panel');
|
||||
var Sunstone = require('sunstone');
|
||||
var Locale = require('utils/locale');
|
||||
var Notifier = require('utils/notifier');
|
||||
var Tips = require('utils/tips');
|
||||
var ResourceSelect = require('utils/resource-select');
|
||||
var Config = require('sunstone-config');
|
||||
var WizardFields = require('utils/wizard-fields');
|
||||
var TemplateUtils = require('utils/template-utils');
|
||||
|
||||
/*
|
||||
TEMPLATES
|
||||
*/
|
||||
|
||||
var TemplateWizardHTML = require('hbs!./create/wizard');
|
||||
var TemplateAdvancedHTML = require('hbs!./create/advanced');
|
||||
|
||||
/*
|
||||
CONSTANTS
|
||||
*/
|
||||
|
||||
var FORM_PANEL_ID = require('./create/formPanelId');
|
||||
var TAB_ID = require('../tabId');
|
||||
var MARKET_MAD_ATTRS = [
|
||||
{
|
||||
name: 'BASE_URL',
|
||||
label: Locale.tr("Base URL"),
|
||||
tooltip: Locale.tr("URL base to generate app end points"),
|
||||
driver: 'http'
|
||||
},
|
||||
{
|
||||
name: 'PUBLIC_DIR',
|
||||
label: Locale.tr("Public Directory"),
|
||||
tooltip: Locale.tr("Directory path to place images, the document root for http server"),
|
||||
driver: 'http'
|
||||
},
|
||||
{
|
||||
name: 'BRIDGE_LIST',
|
||||
label: Locale.tr("Bridge List"),
|
||||
tooltip: Locale.tr("Separated list of servers to access the public directory. If not defined, public directory will be local"),
|
||||
driver: 'http'
|
||||
},
|
||||
{
|
||||
name: 'ACCESS_KEY_ID',
|
||||
label: Locale.tr("Access Key Id"),
|
||||
tooltip: Locale.tr("Access Key Id"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'SECRET_ACCESS_KEY',
|
||||
label: Locale.tr("Secret Access Key"),
|
||||
tooltip: Locale.tr("Secret Access Key"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'BUCKET',
|
||||
label: Locale.tr("Bucket"),
|
||||
tooltip: Locale.tr("Bucket"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'REGION',
|
||||
label: Locale.tr("Region"),
|
||||
tooltip: Locale.tr("Region"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'TOTAL_MB',
|
||||
label: Locale.tr("Total MB"),
|
||||
tooltip: Locale.tr("Total MB"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'SIGNATURE_VERSION',
|
||||
label: Locale.tr("Signature Version"),
|
||||
tooltip: Locale.tr("Signature Version"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'ENDPOINT',
|
||||
label: Locale.tr("Endpoint"),
|
||||
tooltip: Locale.tr("Endpoint"),
|
||||
driver: 's3'
|
||||
},
|
||||
{
|
||||
name: 'FORCE_PATH_STYLE',
|
||||
label: Locale.tr("Force Path Style"),
|
||||
tooltip: Locale.tr("Force Path Style"),
|
||||
driver: 's3'
|
||||
}
|
||||
]
|
||||
/*
|
||||
CONSTRUCTOR
|
||||
*/
|
||||
|
||||
function FormPanel() {
|
||||
var that = this;
|
||||
|
||||
that.formPanelId = FORM_PANEL_ID;
|
||||
that.tabId = TAB_ID;
|
||||
that.actions = {
|
||||
'create': {
|
||||
'title': Locale.tr("Create MarketPlace"),
|
||||
'buttonText': Locale.tr("Create"),
|
||||
'resetButton': true
|
||||
},
|
||||
'update': {
|
||||
'title': Locale.tr("Update MarketPlace"),
|
||||
'buttonText': Locale.tr("Update"),
|
||||
'resetButton': false
|
||||
}
|
||||
};
|
||||
|
||||
that.marketMadNameList = [];
|
||||
if (Config.marketMadConf !== undefined) {
|
||||
$.each(Config.marketMadConf, function(index, marketMad) {
|
||||
that.marketMadNameList.push(marketMad["NAME"]);
|
||||
});
|
||||
}
|
||||
|
||||
BaseFormPanel.call(this);
|
||||
}
|
||||
|
||||
FormPanel.FORM_PANEL_ID = FORM_PANEL_ID;
|
||||
FormPanel.prototype = Object.create(BaseFormPanel.prototype);
|
||||
FormPanel.prototype.constructor = FormPanel;
|
||||
FormPanel.prototype.htmlWizard = _htmlWizard;
|
||||
FormPanel.prototype.htmlAdvanced = _htmlAdvanced;
|
||||
FormPanel.prototype.submitWizard = _submitWizard;
|
||||
FormPanel.prototype.submitAdvanced = _submitAdvanced;
|
||||
FormPanel.prototype.onShow = _onShow;
|
||||
FormPanel.prototype.fill = _fill;
|
||||
FormPanel.prototype.setup = _setup;
|
||||
|
||||
return FormPanel;
|
||||
|
||||
/*
|
||||
FUNCTION DEFINITIONS
|
||||
*/
|
||||
|
||||
function _htmlWizard() {
|
||||
return TemplateWizardHTML({
|
||||
'formPanelId': this.formPanelId,
|
||||
'marketMadNameList': this.marketMadNameList,
|
||||
'marketMadAttrs': MARKET_MAD_ATTRS
|
||||
});
|
||||
}
|
||||
|
||||
function _htmlAdvanced() {
|
||||
return TemplateAdvancedHTML({formPanelId: this.formPanelId});
|
||||
}
|
||||
|
||||
function _onShow(dialog) {
|
||||
$("#NAME", dialog).focus();
|
||||
|
||||
$('#MARKET_MAD', dialog).change();
|
||||
|
||||
// var cluster_id = $("div#cluster_id .resource_list_select", dialog).val();
|
||||
// if (!cluster_id) cluster_id = "-1";
|
||||
//
|
||||
// var cluster_id_raw = $("div#datastore_cluster_raw .resource_list_select", dialog).val();
|
||||
// if (!cluster_id_raw) cluster_id_raw = "-1";
|
||||
//
|
||||
// ResourceSelect.insert({
|
||||
// context: $('#cluster_id', dialog),
|
||||
// resourceName: 'Cluster',
|
||||
// initValue: cluster_id,
|
||||
// includeDefaultCluster: true
|
||||
// });
|
||||
//
|
||||
// ResourceSelect.insert({
|
||||
// context: $('#datastore_cluster_raw', dialog),
|
||||
// resourceName: 'Cluster',
|
||||
// initValue: cluster_id_raw,
|
||||
// includeDefaultCluster: true
|
||||
// });
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function _fill(context, element) {
|
||||
if (this.action != "update") {
|
||||
return false;
|
||||
}
|
||||
|
||||
this.resourceId = element.ID;
|
||||
|
||||
WizardFields.fill(context, element.TEMPLATE);
|
||||
$('#NAME', context).val(element.NAME).
|
||||
prop("disabled", true).
|
||||
prop('wizard_field_disabled', true);;
|
||||
$('#MARKET_MAD', context).val(element.MARKET_MAD).change();
|
||||
}
|
||||
|
||||
// Set up the create datastore dialog
|
||||
function _setup(dialog) {
|
||||
Tips.setup(dialog);
|
||||
|
||||
dialog.on('change', '#MARKET_MAD', function() {
|
||||
_setRequiredFields(dialog, this.value);
|
||||
});
|
||||
|
||||
// Show custom driver input only when custom is selected in selects
|
||||
// $('input[name="ds_tab_custom_ds_mad"],' +
|
||||
// 'input[name="ds_tab_custom_tm_mad"]', dialog).parent().hide();
|
||||
//
|
||||
// $('select#ds_mad', dialog).change(function() {
|
||||
// if ($(this).val() == "custom") {
|
||||
// $('input[name="ds_tab_custom_ds_mad"]', dialog).parent().show();
|
||||
// } else {
|
||||
// _setRequiredFields(dialog, $(this).val());
|
||||
// $('input[name="ds_tab_custom_ds_mad"]', dialog).parent().hide();
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// $('select#tm_mad', dialog).change(function() {
|
||||
// if ($(this).val() == "custom")
|
||||
// $('input[name="ds_tab_custom_tm_mad"]', dialog).parent().show();
|
||||
// else
|
||||
// $('input[name="ds_tab_custom_tm_mad"]', dialog).parent().hide();
|
||||
// });
|
||||
//
|
||||
// $('#presets', dialog).change(function() {
|
||||
// _hideAll(dialog);
|
||||
// var choice_str = $(this).val();
|
||||
//
|
||||
// switch (choice_str)
|
||||
// {
|
||||
// case 'fs':
|
||||
// _selectFilesystem(dialog);
|
||||
// break;
|
||||
// case 'vmware_vmfs':
|
||||
// _selectVmwareVmfs(dialog);
|
||||
// break;
|
||||
// case 'block_lvm':
|
||||
// _selectBlockLvm(dialog);
|
||||
// break;
|
||||
// case 'fs_lvm':
|
||||
// _selectFsLvm(dialog);
|
||||
// break;
|
||||
// case 'ceph':
|
||||
// _selectCeph(dialog);
|
||||
// break;
|
||||
// case 'gluster':
|
||||
// _selectGluster(dialog);
|
||||
// break;
|
||||
// case 'dev':
|
||||
// _selectDevices(dialog);
|
||||
// break;
|
||||
// case 'iscsi':
|
||||
// _selectISCSI(dialog);
|
||||
// break;
|
||||
// case 'custom':
|
||||
// _selectCustom(dialog);
|
||||
// break;
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// $('#presets', dialog).change();
|
||||
//
|
||||
// // Hide disk_type
|
||||
// $('select#disk_type', dialog).parent().hide();
|
||||
//
|
||||
// _hideAll(dialog);
|
||||
// _selectFilesystem(dialog);
|
||||
}
|
||||
|
||||
|
||||
function _submitWizard(dialog) {
|
||||
var that = this;
|
||||
var marketObj = {};
|
||||
|
||||
$.extend(marketObj, WizardFields.retrieve(dialog));
|
||||
|
||||
if (this.action == "create") {
|
||||
marketObj = {
|
||||
"marketplace" : marketObj
|
||||
};
|
||||
|
||||
Sunstone.runAction("MarketPlace.create", marketObj);
|
||||
return false;
|
||||
} else if (this.action == "update") {
|
||||
Sunstone.runAction("MarketPlace.update", this.resourceId, TemplateUtils.templateToString(marketObj));
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function _submitAdvanced(dialog) {
|
||||
var template = $('#template', dialog).val();
|
||||
|
||||
if (this.action == "create") {
|
||||
var marketObj = {
|
||||
"marketplace" : {
|
||||
"marketplace_raw" : template
|
||||
}
|
||||
};
|
||||
Sunstone.runAction("MarketPlace.create", marketObj);
|
||||
} else if (this.action == "update") {
|
||||
Sunstone.runAction("Network.update", this.resourceId, template);
|
||||
return false;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function _setRequiredFields(dialog, marketMADName) {
|
||||
// Hide all market mad attributes and remove required
|
||||
$('.market-mad-attr-container', dialog).hide();
|
||||
$('.market-mad-attr-container input', dialog).removeAttr('required');
|
||||
|
||||
// Show attributes for the selected market mad and set the required ones
|
||||
$('.market-mad-attr-container.' + marketMADName).show();
|
||||
$.each(Config.marketMadConf, function(i, e){
|
||||
if (e["NAME"] == marketMADName) {
|
||||
if (!$.isEmptyObject(e["REQUIRED_ATTRS"])) {
|
||||
$.each(e["REQUIRED_ATTRS"].split(","), function(i, attrName){
|
||||
$('#' + attrName, dialog).attr('required', true);
|
||||
});
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -0,0 +1,32 @@
|
||||
{{! -------------------------------------------------------------------------- }}
|
||||
{{! Copyright 2002-2015, OpenNebula Project, OpenNebula Systems }}
|
||||
{{! }}
|
||||
{{! Licensed under the Apache License, Version 2.0 (the "License"); you may }}
|
||||
{{! not use this file except in compliance with the License. You may obtain }}
|
||||
{{! a copy of the License at }}
|
||||
{{! }}
|
||||
{{! http://www.apache.org/licenses/LICENSE-2.0 }}
|
||||
{{! }}
|
||||
{{! Unless required by applicable law or agreed to in writing, software }}
|
||||
{{! distributed under the License is distributed on an "AS IS" BASIS, }}
|
||||
{{! WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. }}
|
||||
{{! See the License for the specific language governing permissions and }}
|
||||
{{! limitations under the License. }}
|
||||
{{! -------------------------------------------------------------------------- }}
|
||||
|
||||
<form data-abide="ajax" id="{{formPanelId}}Advanced" class="custom creation">
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<p>{{tr "Write the MarketPlace template here"}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<textarea id="template" rows="15" required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,19 @@
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* Copyright 2002-2015, OpenNebula Project, OpenNebula Systems */
|
||||
/* */
|
||||
/* Licensed under the Apache License, Version 2.0 (the "License"); you may */
|
||||
/* not use this file except in compliance with the License. You may obtain */
|
||||
/* a copy of the License at */
|
||||
/* */
|
||||
/* http://www.apache.org/licenses/LICENSE-2.0 */
|
||||
/* */
|
||||
/* Unless required by applicable law or agreed to in writing, software */
|
||||
/* distributed under the License is distributed on an "AS IS" BASIS, */
|
||||
/* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. */
|
||||
/* See the License for the specific language governing permissions and */
|
||||
/* limitations under the License. */
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
define(function(require) {
|
||||
return 'createMarketPlaceForm';
|
||||
})
|
||||
@ -0,0 +1,66 @@
|
||||
{{! -------------------------------------------------------------------------- }}
|
||||
{{! Copyright 2002-2015, OpenNebula Project, OpenNebula Systems }}
|
||||
{{! }}
|
||||
{{! Licensed under the Apache License, Version 2.0 (the "License"); you may }}
|
||||
{{! not use this file except in compliance with the License. You may obtain }}
|
||||
{{! a copy of the License at }}
|
||||
{{! }}
|
||||
{{! http://www.apache.org/licenses/LICENSE-2.0 }}
|
||||
{{! }}
|
||||
{{! Unless required by applicable law or agreed to in writing, software }}
|
||||
{{! distributed under the License is distributed on an "AS IS" BASIS, }}
|
||||
{{! WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. }}
|
||||
{{! See the License for the specific language governing permissions and }}
|
||||
{{! limitations under the License. }}
|
||||
{{! -------------------------------------------------------------------------- }}
|
||||
<form data-abide="ajax" id="{{formPanelId}}Wizard" class="custom creation">
|
||||
<div class="row">
|
||||
<div class="medium-4 columns">
|
||||
<label for="NAME">
|
||||
{{tr "Name"}}:
|
||||
<span class="tip">
|
||||
{{tr "Name that the Marketplace will get for description purposes."}}
|
||||
</span>
|
||||
</label>
|
||||
<input id="NAME" type="text" wizard_field="NAME" required/>
|
||||
</div>
|
||||
<div class="medium-2 columns">
|
||||
<label for="MARKET_MAD">{{tr "Driver"}}</label>
|
||||
<select id="MARKET_MAD" wizard_field="MARKET_MAD" required>
|
||||
{{#each marketMadNameList}}
|
||||
<option value="{{this}}">{{this}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="medium-6 columns hidden">
|
||||
<label for="TYPE">{{tr "Type"}}</label>
|
||||
<select id="TYPE" wizard_field="TYPE" required>
|
||||
<option value="image">{{tr "Image"}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="medium-6 columns">
|
||||
<label for="DESCRIPTION">
|
||||
{{tr "Description"}}
|
||||
<span class="tip">
|
||||
{{tr "Human readable description of the MarketPlace for other users."}}
|
||||
</span>
|
||||
</label>
|
||||
<textarea id="DESCRIPTION" wizard_field="DESCRIPTION" rows="2"></textarea>
|
||||
</div>
|
||||
<div class="small-8 medium-8 columns">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
{{#each marketMadAttrs}}
|
||||
<div class="medium-6 columns market-mad-attr-container {{this.driver}}">
|
||||
<label for="{{this.name}}">
|
||||
{{this.label}}:
|
||||
<span class="tip">{{this.tooltip}}</span>
|
||||
</label>
|
||||
<input id="{{this.name}}" type="text" wizard_field="{{this.name}}"/>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</form>
|
||||
Loading…
x
Reference in New Issue
Block a user