etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

GUI changes to leverage a new control for storage tags

This commit is contained in:
seif 2014-08-14 15:43:06 -06:00 committed by Mike Tutkowski
parent 34b698d44d
commit fd6d083ad6
5 changed files with 166 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui/lib/jquery.tokeninput.js
View File

@ -206,6 +206,7 @@ $.TokenList = function (input, url_or_data, settings) {
outline: "none"
})
.attr("id", settings.idPrefix + input.id)
.attr("name", settings.idPrefix + input.id)
.focus(function () {
if (settings.tokenLimit === null || settings.tokenLimit !== token_count) {
show_dropdown_hint();
@ -218,7 +219,7 @@ $.TokenList = function (input, url_or_data, settings) {
if ((lastChar === ',' || lastChar === ' ') && ($.trim($(this).val()).length >= 1))
{
var custom_token = { id : $.trim($(this).val().substring(0, longueur - 1)), name : $(this).val().substring(0, longueur - 1) };
var custom_token = { id : $.trim($(this).val().substring(0, longueur - 1)), name : $.trim($(this).val().substring(0, longueur - 1)) };
add_token(custom_token);
$(this).val("");

50
ui/scripts/sharedFunctions.js
View File

@ -49,6 +49,56 @@ var md5HashedLogin = false;
var pageSize = 20;
//var pageSize = 1; //for testing only
function to_json_array(str) {
var simple_array = str.split(",");
var json_array = [];
$.each(simple_array, function(index, value) {
if ($.trim(value).length > 0) {
var obj = {
id: value,
name: value
};
json_array.push(obj);
}
});
return json_array;
}
function _tag_equals(tag1, tag2) {
return (tag1.name == tag2.name) && (tag1.id == tag2.id);
}
function _tag_array_contains(tag, tags)
{
for (var i = 0; i < tags.length; i++)
{
if (_tag_equals(tags[i], tag)) return true;
}
return false;
}
function unique_tags(tags)
{
var unique = [];
if (tags != null)
{
for (var i = 0; i < tags.length; i++)
{
if (!_tag_array_contains(tags[i], unique))
{
unique.push(tags[i]);
}
}
}
return unique;
}
//async action
var pollAsyncJobResult = function(args) {
$.ajax({

34
ui/scripts/system.js
View File

@ -16901,7 +16901,7 @@
if (item != null)
{
tags = $.map(item, function (tag) {
tags = $.map(item, function(tag) {
return {
id: tag.name,
name: tag.name
@ -17248,7 +17248,37 @@
},
tags: {
label: 'label.storage.tags',
isEditable: true
isTokenInput : true,
isEditable: true,
dataProvider: function(args) {
$.ajax({
url: createURL("listStorageTags"),
dataType: "json",
success: function(json) {
var item = json.liststoragetagsresponse.storagetag;
var tags = [];
if (item != null)
{
tags = $.map(item, function(tag) {
return {
id: tag.name,
name: tag.name
};
});
}
args.response.success({
data: tags
});
},
error: function (XMLHttpResponse) {
var errorMsg = parseXMLHttpResponse(XMLHttpResponse);
args.response.error(errorMsg);
}
});
}
},
zonename: {
label: 'label.zone'

32
ui/scripts/ui/dialog.js
View File

@ -470,38 +470,6 @@
context: args.context,
response: {
success: function(args) {
function equals(tag1, tag2) {
return (tag1.name == tag2.name) && (tag1.id == tag2.id);
}
function contains(tag, tags)
{
for (var i = 0; i < tags.length; i++)
{
if (equals(tags[i], tag)) return true;
}
return false;
}
function unique_tags(tags)
{
var unique = [];
if (tags != null)
{
for (var i = 0; i < tags.length; i++)
{
if (!contains(tags[i], unique))
{
unique.push(tags[i]);
}
}
}
return unique;
}
$input.tokenInput(unique_tags(args.data), { theme: "facebook", preventDuplicates: true });
}
}

83
ui/scripts/ui/widgets/detailView.js
View File

@ -437,6 +437,7 @@
*/
edit: function($detailView, args) {
$detailView.addClass('edit-mode');
var token_value = "";
if ($detailView.find('.button.done').size()) return false;
@ -472,6 +473,8 @@
var convertInputs = function($inputs) {
// Save and turn back into labels
var $token;
var tags_value = "";
$inputs.each(function() {
if ($(this).closest('.tagger').size()) return true;
@ -479,9 +482,19 @@
var $value = $input.closest('td.value span');
if ($input.is('input[type=text]'))
{
if ($input.attr('name') === "token-input-")
{
$token = $value;
}
else if ($input.attr('name') === "tags")
{
tags_value = $input.attr('value');
}
$value.html(_s(
$input.attr('value')
));
}
else if ($input.is('input[type=password]')) {
$value.html('');
} else if ($input.is('input[type=checkbox]')) {
@ -496,6 +509,8 @@
$value.data('detail-view-selected-option', _s($input.find('option:selected').val()));
}
});
$token.html(_s(tags_value));
};
var removeEditForm = function() {
@ -523,6 +538,11 @@
var $value = $input.closest('td.value span');
var originalValue = $input.data('original-value');
if ($input.attr('id') === 'token-input-')
{
originalValue = token_value;
}
$value.html(_s(originalValue));
});
@ -550,6 +570,7 @@
}
});
data['token-input-'] = data['tags'];
$editButton.fadeOut('fast', function() {
$editButton.remove();
});
@ -652,6 +673,7 @@
// Turn into form field
var selectData = $value.data('detail-view-editable-select');
var isBoolean = $value.data('detail-view-editable-boolean');
var isTokenInput = $value.data('detail-view-is-TokenInput');
var data = !isBoolean ? cloudStack.sanitizeReverse($value.html()) : $value.data('detail-view-boolean-value');
var rules = $value.data('validation-rules') ? $value.data('validation-rules') : {};
var isPassword = $value.data('detail-view-is-password');
@ -689,6 +711,54 @@
checked: data
})
);
} else if (isTokenInput) { // jquery.tokeninput.js
function to_json_array(str) {
var simple_array = str.split(",");
var json_array = [];
$.each(simple_array, function(index, value) {
if ($.trim(value).length > 0)
{
var obj = {
id : value,
name : value
};
json_array.push(obj);
}
});
return json_array;
}
var existing_tags = to_json_array(data);
isAsync = true;
selectArgs = {
context: $detailView.data('view-args').context,
response: {
success: function(args) {
$input.tokenInput(unique_tags(args.data),
{
theme: "facebook",
preventDuplicates: true,
prePopulate: existing_tags,
processPrePopulate: true
});
}
}
};
$input = $('<input>').attr({
name: name,
type: 'text',
value: data
}).data('original-value', data);
$value.append($input);
token_value = data;
$value.data('value_token').dataProvider(selectArgs);
} else {
// Text input
$value.append(
@ -1035,9 +1105,20 @@
// Set up editable metadata
if (typeof(value.isEditable) == 'function')
{
$value.data('detail-view-is-editable', value.isEditable(context));
else //typeof(value.isEditable) == 'boolean' or 'undefined'
}
else // typeof(value.isEditable) == 'boolean' or 'undefined'
{
$value.data('detail-view-is-editable', value.isEditable);
if (value.isTokenInput)
{
$value.data('detail-view-is-TokenInput', true);
$value.data('value_token', value);
}
}
if (value.select) {
value.selected = $value.html();