webconsole/src/main/resources/res/ui/configmanager.js - onos-felix - Gitiles

 /*
  * Licensed to the Apache Software Foundation (ASF) under one or more
  * contributor license agreements.  See the NOTICE file distributed with
  * this work for additional information regarding copyright ownership.
  * The ASF licenses this file to You 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.
  */


 function configure() {
     var span = document.getElementById('configField');
     if (!span) {
         return;
     }
     var select = document.configSelection.pid;
     var pid = select.options[select.selectedIndex].value;
     var parm = '?action=ajaxConfigManager&' + pid;
     sendRequest('GET', parm, displayConfigForm);
 }

 function displayConfigForm(obj) {
     var span = document.getElementById('configField');
     if (!span) {
         return;
     }
     var innerHtml = '<tr class="content" id="configField">' + span.innerHTML + '</tr>';
     innerHtml += '<tr class="content">';
     innerHtml += '<th colspan="2" class="content" >' + obj.title + '</th></tr>';
     innerHtml += '<tr class="content">';
     innerHtml += '<td class="content">&nbsp;</td>';
     innerHtml += '<td class="content">';
     innerHtml += '<form method="post">';
     innerHtml += '<input type="hidden" name="apply" value="true" />';
     innerHtml += '<input type="hidden" name="pid" value="' + obj.pid + '" />';
     innerHtml += '<input type="hidden" name="action" value="ajaxConfigManager" />';
     innerHtml += '<table border="0" width="100%">';
     if (obj.description) {
         innerHtml += '<tr class="content">';
         innerHtml += '<td class="content" colspan="2">' + obj.description + '</td></tr>';
     }
     if (obj.propertylist == 'properties') {
         innerHtml += printTextArea(obj.properties);
     } else {
         innerHtml += printForm(obj);
     }
     innerHtml += '<tr class="content">';
     innerHtml += '<td class="content">&nbsp;</td>';
     innerHtml += '<td class="content">';
     innerHtml += '<input type="submit" class="submit" name="submit" value="Save" />';
     innerHtml += '&nbsp;&nbsp;&nbsp;';
     innerHtml += '<input type="reset" class="submit" name="reset" value="Reset" />';
     innerHtml += '&nbsp;&nbsp;&nbsp;';
     innerHtml += '<input type="submit" class="submit" name="delete" value="Delete" onClick="return confirmDelete();"/>';
     if (obj.isFactory) {
         innerHtml += '&nbsp;&nbsp;&nbsp;';
         innerHtml += '<input type="submit" class="submit" name="create" value="Create Configuration" onClick="return promptContext(this);" />';
         innerHtml += '<input type="hidden" name="sling.context" value="" />';
     }
     innerHtml += '</td></tr>';
     innerHtml += '</table>';
     innerHtml += '</form>';
     innerHtml += '</td></tr>';
     innerHtml += printConfigurationInfo(obj);
     span.parentNode.innerHTML = innerHtml;
 }

 function printTextArea(props) {
     var innerHtml = '<tr class="content">';
     innerHtml += '<td class="content" style="vertical-align: top">Properties</td>';
     innerHtml += '<td class="content" style="width: 99%">';
     innerHtml += '<textarea name="properties" style="height: 50%; width: 99%">';
     for (var key in props) {
         innerHtml += key + ' =  ' + props[key] + '\r\n';
     }
     innerHtml += '</textarea>';
     innerHtml += 'Enter Name-Value pairs of configuration properties.</td>';
     return innerHtml;
 }

 function printForm(obj) {
     var innerHtml = '';
     var propList;
     for (var idx in obj.propertylist) {
         var prop = obj.propertylist[idx];
         var attr = obj[prop];
         innerHtml += '<tr class="content">';
         innerHtml += '<td class="content" style="vertical-align: top">' + attr.name + '</td>';
         innerHtml += '<td class="content" style="width: 99%">';
         if (attr.value != undefined) { // check is required to also handle empty strings, 0 and false
             innerHtml += createInput(prop, attr.value, attr.type, '99%');
             innerHtml += '<br />';
         } else if (typeof(attr.type) == 'object') {
         	// assume attr.values and multiselect
         	innerHtml += createMultiSelect(prop, attr.values, attr.type, '99%');
             innerHtml += '<br />';
         } else {
             for (var vidx in attr.values) {
                 var spanElement = createSpan(prop, attr.values[vidx], attr.type);
                 innerHtml += '<span id="' + spanElement.id + '">';
                 innerHtml += spanElement.innerHTML;
                 innerHtml += '</span>';
             }
         }
         if (attr.description) {
             innerHtml += attr.description;
         }
         innerHtml += '</td>';
         if (propList) {
             propList += ',' + prop;
         } else {
             propList = prop;
         }
     }
     innerHtml += '<input type="hidden" name="propertylist" value="' + propList + '"/>';
     return innerHtml;
 }

 function printConfigurationInfo(obj) {
     var innerHtml = '<tr class="content">';
     innerHtml += '<th colspan="2" class="content" >Configuration Information</th></tr>';
     innerHtml += '<tr class="content">';
     innerHtml += '<td class="content">Persistent Identity (PID)</td>';
     innerHtml += '<td class="content">' + obj.pid + '</td></tr>';
     if (obj.factoryPID) {
         innerHtml += '<tr class="content">';
         innerHtml += '<td class="content">Factory Peristent Identifier (Factory PID)</td>';
         innerHtml += '<td class="content">' + obj.factoryPID + '</td></tr>';
     }
     innerHtml += '<tr class="content">';
     innerHtml += '<td class="content">Configuration Binding</td>';
     innerHtml += '<td class="content">' + obj.bundleLocation + '</td></tr>';
     return innerHtml;
 }

 function addValue(prop, vidx) {
     var span = document.getElementById(vidx);
     if (!span) {
         return;
     }
     var newSpan = createSpan(prop, '');
     span.parentNode.insertBefore(newSpan, span.nextSibling);
 }

 var spanCounter = 0;
 function createSpan(prop, value, type) {
     spanCounter++;
     var newId = prop + spanCounter;
     var innerHtml = createInput(prop, value, type, '89%');
     innerHtml += '<input class="input" type="button" value="+" onClick="addValue(\'' + prop + '\',\'' + newId + '\');" style="width: 5%" />';
     innerHtml += '<input class="input" type="button" value="-" onClick="removeValue(\'' + newId + '\');" style="width: 5%" />';
     innerHtml += '<br />';
     var newSpan = document.createElement('span');
     newSpan.id = newId;
     newSpan.innerHTML = innerHtml;
     return newSpan;
 }

 function createInput(prop, value, type, width) {
     if (type == 11) { // AttributeDefinition.BOOLEAN
         if (value && typeof(value) != "boolean") {
             value = value.toString().toLowerCase() == "true";
         }
         var checked = value ? 'checked' : '';
         return '<input class="input" type="checkbox" name="' + prop + '" value="true" ' + checked + '/>';
     } else if (typeof(type) == "object") { // predefined values
     	var labels = type.labels;
     	var values = type.values;
     	var innerHtml = '<select class="select" name="' + prop + '" style="width: ' + width + '">';
     	for (var idx in labels) {
     		var selected = (value == values[idx]) ? ' selected' : '';
     		innerHtml += '<option value="' + values[idx] + '"' + selected + '>' + labels[idx] + '</option>';
     	}
     	innerHtml += '</select>';
     	return innerHtml;
     } else { // Simple
         return '<input class="input" type="text" name="' + prop + '" value="' + value + '" style="width: ' + width + '"/>';
     }
 }

 function createMultiSelect(prop, values, options, width) {
     // convert value list into 'set'
     var valueSet = new Object();
     for (var idx in values) {
     	valueSet[ values[idx] ] = true;
     }

    	var labels = options.labels;
    	var values = options.values;
    	var innerHtml = '';
    	for (var idx in labels) {
    		var checked = valueSet[ values[idx] ] ? ' checked' : '';
    		innerHtml += '<label><input type="checkbox" name="' + prop + '" value="' + values[idx] + '"' + checked + '>' + labels[idx] + '</label>';
    	}
    	return innerHtml;
 }

 function removeValue(vidx) {
     var span = document.getElementById(vidx);
     if (!span) {
         return;
     }
     span.parentNode.removeChild(span);
 }

 function confirmDelete() {
     return confirm("Are you sure to delete this configuration ?");
 }

 function promptContext(form) {
     var result = prompt("Please give a Sling Context for the new configuration");
     // alert("You entered: [" + result + "] for form [" + form + "/" + form.form + "]");

     // set the hidden sling.context input field with the value
     if (result != null) {
         form.form["sling.context"].value = result;
         return true;
     }

     return false;
 }
	/*
	* Licensed to the Apache Software Foundation (ASF) under one or more
	* contributor license agreements. See the NOTICE file distributed with
	* this work for additional information regarding copyright ownership.
	* The ASF licenses this file to You 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.
	*/


	function configure() {
	var span = document.getElementById('configField');
	if (!span) {
	return;
	}
	var select = document.configSelection.pid;
	var pid = select.options[select.selectedIndex].value;
	var parm = '?action=ajaxConfigManager&' + pid;
	sendRequest('GET', parm, displayConfigForm);
	}

	function displayConfigForm(obj) {
	var span = document.getElementById('configField');
	if (!span) {
	return;
	}
	var innerHtml = '<tr class="content" id="configField">' + span.innerHTML + '</tr>';
	innerHtml += '<tr class="content">';
	innerHtml += '<th colspan="2" class="content" >' + obj.title + '</th></tr>';
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content"> </td>';
	innerHtml += '<td class="content">';
	innerHtml += '<form method="post">';
	innerHtml += '<input type="hidden" name="apply" value="true" />';
	innerHtml += '<input type="hidden" name="pid" value="' + obj.pid + '" />';
	innerHtml += '<input type="hidden" name="action" value="ajaxConfigManager" />';
	innerHtml += '<table border="0" width="100%">';
	if (obj.description) {
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content" colspan="2">' + obj.description + '</td></tr>';
	}
	if (obj.propertylist == 'properties') {
	innerHtml += printTextArea(obj.properties);
	} else {
	innerHtml += printForm(obj);
	}
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content"> </td>';
	innerHtml += '<td class="content">';
	innerHtml += '<input type="submit" class="submit" name="submit" value="Save" />';
	innerHtml += '   ';
	innerHtml += '<input type="reset" class="submit" name="reset" value="Reset" />';
	innerHtml += '   ';
	innerHtml += '<input type="submit" class="submit" name="delete" value="Delete" onClick="return confirmDelete();"/>';
	if (obj.isFactory) {
	innerHtml += '   ';
	innerHtml += '<input type="submit" class="submit" name="create" value="Create Configuration" onClick="return promptContext(this);" />';
	innerHtml += '<input type="hidden" name="sling.context" value="" />';
	}
	innerHtml += '</td></tr>';
	innerHtml += '</table>';
	innerHtml += '</form>';
	innerHtml += '</td></tr>';
	innerHtml += printConfigurationInfo(obj);
	span.parentNode.innerHTML = innerHtml;
	}

	function printTextArea(props) {
	var innerHtml = '<tr class="content">';
	innerHtml += '<td class="content" style="vertical-align: top">Properties</td>';
	innerHtml += '<td class="content" style="width: 99%">';
	innerHtml += '<textarea name="properties" style="height: 50%; width: 99%">';
	for (var key in props) {
	innerHtml += key + ' = ' + props[key] + '\r\n';
	}
	innerHtml += '</textarea>';
	innerHtml += 'Enter Name-Value pairs of configuration properties.</td>';
	return innerHtml;
	}

	function printForm(obj) {
	var innerHtml = '';
	var propList;
	for (var idx in obj.propertylist) {
	var prop = obj.propertylist[idx];
	var attr = obj[prop];
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content" style="vertical-align: top">' + attr.name + '</td>';
	innerHtml += '<td class="content" style="width: 99%">';
	if (attr.value != undefined) { // check is required to also handle empty strings, 0 and false
	innerHtml += createInput(prop, attr.value, attr.type, '99%');
	innerHtml += '<br />';
	} else if (typeof(attr.type) == 'object') {
	// assume attr.values and multiselect
	innerHtml += createMultiSelect(prop, attr.values, attr.type, '99%');
	innerHtml += '<br />';
	} else {
	for (var vidx in attr.values) {
	var spanElement = createSpan(prop, attr.values[vidx], attr.type);
	innerHtml += '<span id="' + spanElement.id + '">';
	innerHtml += spanElement.innerHTML;
	innerHtml += '</span>';
	}
	}
	if (attr.description) {
	innerHtml += attr.description;
	}
	innerHtml += '</td>';
	if (propList) {
	propList += ',' + prop;
	} else {
	propList = prop;
	}
	}
	innerHtml += '<input type="hidden" name="propertylist" value="' + propList + '"/>';
	return innerHtml;
	}

	function printConfigurationInfo(obj) {
	var innerHtml = '<tr class="content">';
	innerHtml += '<th colspan="2" class="content" >Configuration Information</th></tr>';
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content">Persistent Identity (PID)</td>';
	innerHtml += '<td class="content">' + obj.pid + '</td></tr>';
	if (obj.factoryPID) {
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content">Factory Peristent Identifier (Factory PID)</td>';
	innerHtml += '<td class="content">' + obj.factoryPID + '</td></tr>';
	}
	innerHtml += '<tr class="content">';
	innerHtml += '<td class="content">Configuration Binding</td>';
	innerHtml += '<td class="content">' + obj.bundleLocation + '</td></tr>';
	return innerHtml;
	}

	function addValue(prop, vidx) {
	var span = document.getElementById(vidx);
	if (!span) {
	return;
	}
	var newSpan = createSpan(prop, '');
	span.parentNode.insertBefore(newSpan, span.nextSibling);
	}

	var spanCounter = 0;
	function createSpan(prop, value, type) {
	spanCounter++;
	var newId = prop + spanCounter;
	var innerHtml = createInput(prop, value, type, '89%');
	innerHtml += '<input class="input" type="button" value="+" onClick="addValue(\'' + prop + '\',\'' + newId + '\');" style="width: 5%" />';
	innerHtml += '<input class="input" type="button" value="-" onClick="removeValue(\'' + newId + '\');" style="width: 5%" />';
	innerHtml += '<br />';
	var newSpan = document.createElement('span');
	newSpan.id = newId;
	newSpan.innerHTML = innerHtml;
	return newSpan;
	}

	function createInput(prop, value, type, width) {
	if (type == 11) { // AttributeDefinition.BOOLEAN
	if (value && typeof(value) != "boolean") {
	value = value.toString().toLowerCase() == "true";
	}
	var checked = value ? 'checked' : '';
	return '<input class="input" type="checkbox" name="' + prop + '" value="true" ' + checked + '/>';
	} else if (typeof(type) == "object") { // predefined values
	var labels = type.labels;
	var values = type.values;
	var innerHtml = '<select class="select" name="' + prop + '" style="width: ' + width + '">';
	for (var idx in labels) {
	var selected = (value == values[idx]) ? ' selected' : '';
	innerHtml += '<option value="' + values[idx] + '"' + selected + '>' + labels[idx] + '</option>';
	}
	innerHtml += '</select>';
	return innerHtml;
	} else { // Simple
	return '<input class="input" type="text" name="' + prop + '" value="' + value + '" style="width: ' + width + '"/>';
	}
	}

	function createMultiSelect(prop, values, options, width) {
	// convert value list into 'set'
	var valueSet = new Object();
	for (var idx in values) {
	valueSet[ values[idx] ] = true;
	}

	var labels = options.labels;
	var values = options.values;
	var innerHtml = '';
	for (var idx in labels) {
	var checked = valueSet[ values[idx] ] ? ' checked' : '';
	innerHtml += '<label><input type="checkbox" name="' + prop + '" value="' + values[idx] + '"' + checked + '>' + labels[idx] + '</label>';
	}
	return innerHtml;
	}

	function removeValue(vidx) {
	var span = document.getElementById(vidx);
	if (!span) {
	return;
	}
	span.parentNode.removeChild(span);
	}

	function confirmDelete() {
	return confirm("Are you sure to delete this configuration ?");
	}

	function promptContext(form) {
	var result = prompt("Please give a Sling Context for the new configuration");
	// alert("You entered: [" + result + "] for form [" + form + "/" + form.form + "]");

	// set the hidden sling.context input field with the value
	if (result != null) {
	form.form["sling.context"].value = result;
	return true;
	}

	return false;
	}