2731 lines
99 KiB
JavaScript
Executable File
2731 lines
99 KiB
JavaScript
Executable File
/**
|
|
* Object Editor
|
|
* This page creates custom cabinet objects (servers, switches, routers, etc.)
|
|
*/
|
|
|
|
function handlePartitionOrientaion(){
|
|
var variables = getVariables();
|
|
var isParent = $(variables['selectedObj']).hasClass('flex-container-parent');
|
|
var hasChildren = $(variables['selectedObj']).children('.flex-container').length > 0;
|
|
var disabledState = isParent && !hasChildren ? false : true;
|
|
|
|
// Check the appropriate partition orientation radio
|
|
if(!isParent || hasChildren){
|
|
if($(variables['selectedObj']).data('direction') == 'column') {
|
|
$('#partitionH').prop('checked', true);
|
|
} else {
|
|
$('#partitionV').prop('checked', true);
|
|
}
|
|
}
|
|
|
|
$('#partitionH').prop('disabled', disabledState);
|
|
$('#partitionV').prop('disabled', disabledState);
|
|
}
|
|
|
|
function handlePartitionAddRemove(){
|
|
var variables = getVariables();
|
|
var isParent = $(variables['selectedObj']).hasClass('flex-container-parent');
|
|
var partitionType = $(variables['selectedObj']).data('partitionType');
|
|
var flexDirection = $(variables['selectedObj']).data('direction');
|
|
var unitAttr = flexDirection == 'column' ? 'vUnits' : 'hUnits';
|
|
var partitionUnits = $(variables['selectedObj']).data(unitAttr);
|
|
var childUnits = 0;
|
|
|
|
// Sum of child units
|
|
$(variables['selectedObj']).children('.flex-container').each(function(){
|
|
childUnits += parseInt($(this).data(unitAttr), 10)
|
|
});
|
|
|
|
// Units available
|
|
var availableUnits = partitionUnits - childUnits;
|
|
if(availableUnits && partitionType == 'Generic'){
|
|
// Enable
|
|
$('#customPartitionAdd').removeClass('disabled').prop('disabled', false);
|
|
} else {
|
|
// Disable
|
|
$('#customPartitionAdd').addClass('disabled').prop('disabled', true);
|
|
}
|
|
|
|
// Handle partition remove button
|
|
if(isParent){
|
|
$('#customPartitionRemove').addClass('disabled').prop('disabled', true);
|
|
} else {
|
|
$('#customPartitionRemove').removeClass('disabled').prop('disabled', false);
|
|
}
|
|
}
|
|
|
|
function handleOrientationInput(){
|
|
handlePartitionOrientaion();
|
|
handlePartitionAddRemove();
|
|
}
|
|
|
|
function setPartitionSizeInput(){
|
|
var variables = getVariables();
|
|
|
|
// If selected object is not the parent container...
|
|
if(!$(variables['selectedObj']).hasClass('flex-container-parent')){
|
|
var flexDirection = $(variables['selectedObj']).data('direction');
|
|
var partitionStep = flexDirection == 'column' ? 1 : 0.5;
|
|
var selectedUnitAttr = flexDirection == 'column' ? 'hUnits' : 'vUnits';
|
|
var parentUnitAttr = flexDirection == 'column' ? 'vUnits' : 'hUnits';
|
|
var flexUnits = parseInt($(variables['selectedObj']).data(selectedUnitAttr), 10);
|
|
var parentFlexUnits = parseInt($(variables['selectedParent']).data(selectedUnitAttr), 10);
|
|
var siblingUnits = 0;
|
|
$(variables['selectedObj']).siblings().each(function(){
|
|
siblingUnits += parseInt($(this).data(selectedUnitAttr), 10);
|
|
});
|
|
var takenUnits = siblingUnits + flexUnits;
|
|
var availableUnits = parentFlexUnits - takenUnits;
|
|
|
|
// Calculate the space taken by dependent partitions
|
|
var unitsTaken = 0;
|
|
$(variables['selectedObj']).children().each(function(){
|
|
workingUnitsTaken = 0;
|
|
$(this).children().each(function(){
|
|
workingUnitsTaken += parseInt($(this).data(selectedUnitAttr), 10);
|
|
});
|
|
unitsTaken = workingUnitsTaken > unitsTaken ? workingUnitsTaken : unitsTaken;
|
|
});
|
|
var partitionMin = partitionStep * unitsTaken == 0 ? partitionStep : partitionStep * unitsTaken;
|
|
var partitionSize = ((partitionStep * 10) * (flexUnits * 10)) / 100;
|
|
var partitionMax = partitionStep * (flexUnits + availableUnits);
|
|
|
|
$('#inputCustomPartitionSize').val(partitionSize);
|
|
$('#inputCustomPartitionSize').attr('min', partitionMin);
|
|
$('#inputCustomPartitionSize').attr('max', partitionMax);
|
|
$('#inputCustomPartitionSize').attr('step', partitionStep);
|
|
|
|
// If the selected object is the parent container,
|
|
// default and disable section size input.
|
|
}else{
|
|
$('#inputCustomPartitionSize').val(.5);
|
|
$('#inputCustomPartitionSize').prop('disabled', true);
|
|
}
|
|
}
|
|
|
|
function setInputValues(){
|
|
var variables = getVariables();
|
|
|
|
var partitionType = $(variables['selectedObj']).data('partitionType');
|
|
$('[name="partitionType"][value='+partitionType+']').prop('checked', true);
|
|
|
|
if(partitionType == 'Generic') {
|
|
|
|
} else if(partitionType == 'Connectable') {
|
|
|
|
var portLayoutX = $(variables['selectedObj']).data('valueX');
|
|
var portLayoutY = $(variables['selectedObj']).data('valueY');
|
|
var portOrientation = $(variables['selectedObj']).data('portOrientation');
|
|
var portType = $(variables['selectedObj']).data('portType');
|
|
var mediaType = $(variables['selectedObj']).data('mediaType');
|
|
|
|
$('#inputPortLayoutX').val(portLayoutX);
|
|
$('#inputPortLayoutY').val(portLayoutY);
|
|
$('input.objectPortOrientation[value="'+portOrientation+'"]').prop('checked', true);
|
|
$('#inputPortType').children('[value="'+portType+'"]').prop('selected', true);
|
|
$('#inputMediaType').children('[value="'+mediaType+'"]').prop('selected', true);
|
|
|
|
} else if(partitionType == 'Enclosure') {
|
|
|
|
var encLayoutX = $(variables['selectedObj']).data('valueX');
|
|
var encLayoutY = $(variables['selectedObj']).data('valueY');
|
|
var encTolerance = $(variables['selectedObj']).data('encTolerance');
|
|
|
|
$('#inputEnclosureLayoutX').val(encLayoutX);
|
|
$('#inputEnclosureLayoutY').val(encLayoutY);
|
|
$('[name="enclosureTolerance"][value='+encTolerance+']').prop('checked', true);
|
|
|
|
}
|
|
}
|
|
|
|
function resizePartition(inputValue){
|
|
var variables = getVariables();
|
|
var flexDirection = $(variables['selectedObj']).data('direction');
|
|
var selectedUnitAttr = flexDirection == 'column' ? 'hUnits' : 'vUnits';
|
|
var parentFlexUnits = parseInt($(variables['selectedParent']).parent().data(selectedUnitAttr), 10);
|
|
var partitionFlexUnits = flexDirection == 'row' ? inputValue*2 : inputValue;
|
|
var partitionFlexSize = partitionFlexUnits/parentFlexUnits;
|
|
$(variables['selectedObj']).css('flex-grow', partitionFlexSize);
|
|
$(variables['selectedObj']).data(selectedUnitAttr, partitionFlexUnits);
|
|
var dependentFlexSize = 1/partitionFlexUnits;
|
|
$(variables['selectedObj']).children().each(function(){
|
|
$(this).data(selectedUnitAttr, partitionFlexUnits);
|
|
$(this).children().each(function(){
|
|
var dependentFlexUnits = $(this).data(selectedUnitAttr);
|
|
$(this).css('flex-grow', dependentFlexSize*dependentFlexUnits);
|
|
});
|
|
});
|
|
}
|
|
|
|
function partitionRemoveButtonStatus(status){
|
|
var object = $('#customPartitionRemove');
|
|
switch(status){
|
|
case 'disable':
|
|
$(object).addClass('disabled').prop('disabled', true);
|
|
break;
|
|
|
|
case 'enable':
|
|
$(object).removeClass('disabled').prop('disabled', false);
|
|
break;
|
|
}
|
|
}
|
|
|
|
function resetRUSize(){
|
|
var variables = getVariables();
|
|
|
|
// Calculate the space taken by dependent partitions
|
|
var spaceTaken = 0;
|
|
//if($(variables['obj']).children('.flex-container-parent').css('flex-direction') == 'column') {
|
|
var containerParentDirection = $(variables['obj']).children('.flex-container-parent').data('direction');
|
|
if(containerParentDirection == 'column') {
|
|
$(variables['obj']).children('.flex-container-parent').children().each(function(){
|
|
spaceTaken += parseInt($(this).data('vUnits'), 10);
|
|
});
|
|
} else {
|
|
$(variables['obj']).children('.flex-container-parent').children().each(function(){
|
|
workingSpaceTaken = 0;
|
|
$(this).children().each(function(){
|
|
workingSpaceTaken += parseInt($(this).data('vUnits'), 10);
|
|
});
|
|
spaceTaken = workingSpaceTaken > spaceTaken ? workingSpaceTaken : spaceTaken;
|
|
});
|
|
}
|
|
|
|
// Update RUSize Input
|
|
var min = Math.ceil(spaceTaken/2);
|
|
var min = min > 0 ? min : 1;
|
|
$('#inputRU').attr('min', min);
|
|
}
|
|
|
|
function setDefaultData(obj){
|
|
var portNameFormat = [
|
|
{
|
|
type:"static",
|
|
value:"Port",
|
|
count: 0,
|
|
order:0
|
|
}, {
|
|
type:"incremental",
|
|
value:"1",
|
|
count:0,
|
|
order:1
|
|
}
|
|
];
|
|
|
|
$(obj).data('valueX', 1);
|
|
$(obj).data('valueY', 1);
|
|
$(obj).data('encTolerance', 'Strict');
|
|
$(obj).data('partitionType', 'Generic');
|
|
$(obj).data('portOrientation', 1);
|
|
$(obj).data('portType', 1);
|
|
$(obj).data('mediaType', 1);
|
|
$(obj).data('portNameFormat', portNameFormat);
|
|
}
|
|
|
|
function addPartition(){
|
|
var variables = getVariables();
|
|
var axis = $('input.partitionAxis:checked').val();
|
|
|
|
var parentFlexDirection = axis == 'h' ? 'column' : 'row';
|
|
var flexDirection = axis == 'h' ? 'row' : 'column';
|
|
var unitAttr = axis == 'h' ? 'vUnits' : 'hUnits';
|
|
var flexUnits = parseInt($(variables['selectedParent']).data(unitAttr), 10);
|
|
var flex = 1/flexUnits;
|
|
var html = '';
|
|
|
|
// Set flex-direction according to the orientation input
|
|
$(variables['selectedObj']).css('flex-direction', parentFlexDirection).data('direction', parentFlexDirection);
|
|
var vUnits = axis == 'h' ? 1 : parseInt($(variables['selectedObj']).data('vUnits'), 10);
|
|
var hUnits = axis == 'h' ? parseInt($(variables['selectedObj']).data('hUnits'), 10) : 1;
|
|
html += '<div class="flex-container border-black transparency-20" style="flex:'+flex+'; flex-direction:'+flexDirection+';" data-direction="'+flexDirection+'" data-h-units="'+hUnits+'" data-v-units="'+vUnits+'"></div>';
|
|
$(variables['selectedObj']).append(html);
|
|
var newObj = $(variables['selectedObj']).children().last();
|
|
$(newObj).on('click', function(event){
|
|
event.stopPropagation();
|
|
makeTemplatePartitionClickable(this);
|
|
});
|
|
setDefaultData(newObj);
|
|
|
|
return;
|
|
}
|
|
|
|
function buildTable(inputX, inputY, className, border=false){
|
|
var table = '';
|
|
|
|
for (y = 0; y < inputY; y++){
|
|
|
|
// Determine border side
|
|
if(border) {
|
|
if(y == inputY) {
|
|
var rowBorderClass = 'borderBottom';
|
|
} else {
|
|
var rowBorderClass = 'borderTop';
|
|
}
|
|
} else {
|
|
var rowBorderClass = '';
|
|
}
|
|
|
|
// Create row
|
|
table += '<div class="'+rowBorderClass+' tableRow">';
|
|
|
|
for (x = 0; x < inputX; x++){
|
|
|
|
// Determine border side
|
|
if(border) {
|
|
if(x == inputX) {
|
|
var colBorderClass = 'borderRight';
|
|
} else {
|
|
var colBorderClass = 'borderLeft';
|
|
}
|
|
} else {
|
|
var colBorderClass = '';
|
|
}
|
|
|
|
// Create column
|
|
table += '<div class="'+className+' '+colBorderClass+' tableCol"></div>';
|
|
}
|
|
table += '</div>';
|
|
}
|
|
|
|
return table;
|
|
}
|
|
|
|
function buildPortTable(){
|
|
var variables = getVariables();
|
|
var portType = $('#inputPortType').find('option:selected').data('value');
|
|
var x = $(variables['selectedObj']).data('valueX');
|
|
var y = $(variables['selectedObj']).data('valueY');
|
|
var table = buildTable(x, y, '');
|
|
$(variables['selectedObj']).html(table);
|
|
$(variables['selectedObj']).find('.tableCol').each(function(){
|
|
$(this).html('<div class="port '+portType+'"></div>');
|
|
});
|
|
}
|
|
|
|
function makeRackObjectsClickable(){
|
|
$('#templateContainer').find('.categoryTitle').on('click', function(){
|
|
var categoryName = $(this).data('categoryName');
|
|
if($('.category'+categoryName+'Container').is(':visible')) {
|
|
$('.category'+categoryName+'Container').hide(400);
|
|
$(this).children('i').removeClass('fa-caret-down').addClass('fa-caret-right');
|
|
} else {
|
|
$('.categoryContainer').hide(400);
|
|
$('.categoryTitle').children('i').removeClass('fa-caret-down').addClass('fa-caret-right');
|
|
$('.category'+categoryName+'Container').show(400);
|
|
$(this).children('i').removeClass('fa-caret-right').addClass('fa-caret-down');
|
|
}
|
|
});
|
|
|
|
// Combined Template Icon
|
|
$('.iconCombinedTemplate').on('click', function(event){
|
|
|
|
// Remove hightlight from all racked objects
|
|
$('#availableContainer').find('.rackObjSelected').removeClass('rackObjSelected');
|
|
|
|
// Hightlight the selected racked object
|
|
$(this).addClass('rackObjSelected');
|
|
|
|
templateCombinedContainer = $(this).closest('.object-wrapper');
|
|
templateCombinedID = $(templateCombinedContainer).data('templateId');
|
|
$(document).data('selectedTemplateCombinedID', templateCombinedID);
|
|
$(document).data('selectedTemplateCombined', 'yes');
|
|
|
|
// Store template name
|
|
var templateCombinedName = $(templateCombinedContainer).data('templateName');
|
|
$(document).data('selectedTemplateCombinedName', templateCombinedName);
|
|
|
|
// Store template category name
|
|
var templateCategoryName = $(templateCombinedContainer).closest('.categoryContainerEntire').find('.categoryTitle').data('categoryName');
|
|
$(document).data('selectedTemplateCategoryName', templateCategoryName);
|
|
|
|
//Collect object data
|
|
var data = {
|
|
templateID: templateCombinedID
|
|
};
|
|
data = JSON.stringify(data);
|
|
|
|
//Retrieve object details
|
|
$.post("backend/retrieve_template_combined.php", {data:data}, function(responseJSON){
|
|
|
|
var response = JSON.parse(responseJSON);
|
|
if (response.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(response.error).size() > 0){
|
|
displayError(response.error);
|
|
} else {
|
|
var response = response.success;
|
|
var NAString = 'N/A';
|
|
$('#detailObjName').html(NAString);
|
|
$('#inline-templateName').editable('setValue', response.templateName).editable('enable');
|
|
$('#detailTrunkedTo').html(NAString);
|
|
$('#detailObjType').html(NAString);
|
|
$('#detailObjFunction').html(NAString);
|
|
$('#detailRUSize').html(NAString);
|
|
$('#detailMountConfig').html(NAString);
|
|
$('#detailPortOrientation').html(NAString);
|
|
$('#detailPortType').html(NAString);
|
|
$('#detailMediaType').html(NAString);
|
|
$('#detailEnclosureTolerance').html(NAString);
|
|
$('#detailTemplateImage').html('<img id="elementTemplateImage" src="" height="" width="">');
|
|
$('#objClone').addClass('disabled');
|
|
$('#objFind').addClass('disabled');
|
|
$('#objDelete').removeClass('disabled');
|
|
|
|
// Port Range
|
|
if(!$('#detailPortRange').hasClass('no-modal')) {
|
|
$('#detailPortRange').addClass('no-modal');
|
|
}
|
|
$('#detailPortRange').html(NAString);
|
|
|
|
// Object Category
|
|
$('#inline-category').editable('destroy');
|
|
$('#inline-category').editable({
|
|
showbuttons: false,
|
|
mode: 'inline',
|
|
source: response.categoryArray,
|
|
url: 'backend/process_object-custom.php',
|
|
send: 'always',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID':templateCombinedID,
|
|
'attribute':'combinedTemplateCategory',
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
reloadTemplates();
|
|
}
|
|
}
|
|
});
|
|
$('#inline-category').editable('setValue', response.categoryID).editable('enable');
|
|
|
|
// Object Name
|
|
$('#inline-templateName').editable('destroy');
|
|
$('#inline-templateName').editable({
|
|
display: function(value){
|
|
$(this).text(value);
|
|
},
|
|
pk: 1,
|
|
mode: 'inline',
|
|
url: 'backend/process_object-custom.php',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID': templateCombinedID,
|
|
'attribute': 'combinedTemplateName',
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
$('#templateName'+templateCombinedID+'.combined').html(responseJSON.success);
|
|
}
|
|
}
|
|
}).editable('enable');
|
|
}
|
|
});
|
|
});
|
|
|
|
// Template Partition
|
|
$('#availableContainer').find('.selectable').on('click', function(event){
|
|
event.stopPropagation();
|
|
|
|
// Remove hightlight from all racked objects
|
|
$('#availableContainer').find('.rackObjSelected').removeClass('rackObjSelected');
|
|
|
|
// Hightlight the selected racked object
|
|
$(this).addClass('rackObjSelected');
|
|
|
|
if($(this).hasClass('stockObj')) {
|
|
var object = $(this);
|
|
var partitionDepth = 0;
|
|
} else {
|
|
var object = $(this).closest('.stockObj');
|
|
var partitionDepth = parseInt($(this).data('depth'), 10);
|
|
}
|
|
$('#selectedPartitionDepth').val(partitionDepth);
|
|
|
|
// Store template name
|
|
var templateName = $(object).data('templateName');
|
|
$(document).data('selectedTemplateName', templateName);
|
|
|
|
// Store template category name
|
|
var templateCategoryName = $(object).data('templateCategoryName');
|
|
$(document).data('selectedTemplateCategoryName', templateCategoryName);
|
|
|
|
//Store combined template
|
|
var templateCombined = $(object).data('templateCombined');
|
|
$(document).data('selectedTemplateCombined', templateCombined);
|
|
|
|
// Store combined templateID
|
|
if(templateCombined == 'yes') {
|
|
templateCombinedContainer = $(object).closest('.object-wrapper');
|
|
templateCombinedID = $(templateCombinedContainer).data('templateId');
|
|
$(document).data('selectedTemplateCombinedName', templateName);
|
|
} else {
|
|
templateCombinedID = 0;
|
|
}
|
|
$(document).data('selectedTemplateCombinedID', templateCombinedID);
|
|
|
|
// Store templateID
|
|
var templateID = $(object).data('templateId');
|
|
$('#selectedObjectID').val(templateID);
|
|
$(document).data('selectedTemplateID', templateID);
|
|
|
|
// Store objectFace
|
|
var templateFace = $(object).data('objectFace');
|
|
$('#selectedObjectFace').val(templateFace);
|
|
|
|
initializeImageUpload(templateID, templateFace);
|
|
|
|
// Store cabinetFace
|
|
var cabinetFace = $('#currentCabinetFace').val();
|
|
|
|
// Collect object data
|
|
var data = {
|
|
objID: templateID,
|
|
page: 'editor',
|
|
objFace: templateFace,
|
|
cabinetFace: cabinetFace,
|
|
partitionDepth: partitionDepth
|
|
};
|
|
data = JSON.stringify(data);
|
|
|
|
// Retrieve object details
|
|
$.post("backend/retrieve_object_details.php", {data:data}, function(response){
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
var response = responseJSON.success;
|
|
$('#detailObjName').html(response.objectName);
|
|
$('#inline-templateName').editable('setValue', response.templateName);
|
|
if(templateCombined == 'yes') {
|
|
$('#inline-templateName').editable('disable');
|
|
} else {
|
|
$('#inline-templateName').editable('enable');
|
|
}
|
|
$('#detailTrunkedTo').html(response.trunkedTo);
|
|
$('#detailObjType').html(response.objectType);
|
|
$('#detailObjFunction').html(response.function);
|
|
$('#detailRUSize').html(response.RUSize);
|
|
$('#detailMountConfig').html(response.mountConfig);
|
|
$('#detailPortType').html(response.portType);
|
|
$('#detailMediaType').html(response.mediaType);
|
|
$('#detailTemplateImage').html('<img id="elementTemplateImage" src="" height="" width="">');
|
|
if(templateCombined == 'no') {
|
|
$('#detailTemplateImage').append('<div id="templateImageActionContainer"><a id="templateImageAction" href="#">' + response.templateImgAction + '</a></div>');
|
|
$('#objClone').removeClass('disabled');
|
|
$('#objFind').removeClass('disabled');
|
|
$('#objDelete').removeClass('disabled');
|
|
} else {
|
|
$('#objClone').addClass('disabled');
|
|
$('#objFind').addClass('disabled');
|
|
$('#objDelete').addClass('disabled');
|
|
}
|
|
|
|
// Port Range
|
|
if(response.portRange == 'N/A') {
|
|
if(!$('#detailPortRange').hasClass('no-modal')) {
|
|
$('#detailPortRange').addClass('no-modal');
|
|
}
|
|
$('#detailPortRange').html(response.portRange);
|
|
} else {
|
|
if(templateCombined == 'yes') {
|
|
if(!$('#detailPortRange').hasClass('no-modal')) {
|
|
$('#detailPortRange').addClass('no-modal');
|
|
}
|
|
$('#detailPortRange').html(response.portRange);
|
|
} else {
|
|
$('#detailPortRange').removeClass('no-modal');
|
|
$('#detailPortRange').html('<a href="#">'+response.portRange+'</a>');
|
|
}
|
|
}
|
|
$(document).data('portNameFormatEdit', response.portNameFormat);
|
|
$(document).data('portTotalEdit', response.portTotal);
|
|
|
|
// Object Image
|
|
if(response.templateImgExists) {
|
|
$('#templateImageActionContainer').append('<span id="templateImageDeleteContainer"> - <a id="templateImageDelete" href="#">delete</a></span>');
|
|
$('#elementTemplateImage').attr({
|
|
src:response.templateImgPath,
|
|
height:response.templateImgHeight + 'px',
|
|
width:response.templateImgWidth + '%'
|
|
});
|
|
} else {
|
|
$('#elementTemplateImage').attr({
|
|
height:response.templateImgHeight + 'px',
|
|
width:response.templateImgWidth + '%'
|
|
}).hide();
|
|
}
|
|
|
|
// Object Category
|
|
$('#inline-category').editable('destroy');
|
|
$('#inline-category').editable({
|
|
showbuttons: false,
|
|
mode: 'inline',
|
|
source: response.categoryArray,
|
|
url: 'backend/process_object-custom.php',
|
|
send: 'always',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID':templateID,
|
|
'attribute':$(this).attr('id'),
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
var selectedObjID = $('#selectedObjectID').val();
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
//var selectedObjID = $('#selectedObjectID').val();
|
|
var category = responseJSON.success;
|
|
$('.obj'+selectedObjID).removeClass (function (index, css) {
|
|
return (css.match (/(^|\s)category\S+/g) || []).join(' ');
|
|
});
|
|
$('.obj'+selectedObjID).addClass('category'+category);
|
|
reloadTemplates();
|
|
}
|
|
}
|
|
});
|
|
$('#inline-category').editable('setValue', response.categoryID);
|
|
if(templateCombined == 'yes') {
|
|
$('#inline-category').editable('disable');
|
|
} else {
|
|
$('#inline-category').editable('enable');
|
|
}
|
|
|
|
// Object Name
|
|
$('#inline-templateName').editable('destroy');
|
|
$('#inline-templateName').editable({
|
|
display: function(value){
|
|
$(this).text(value);
|
|
},
|
|
pk: 1,
|
|
mode: 'inline',
|
|
url: 'backend/process_object-custom.php',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID': templateID,
|
|
'attribute': 'templateName',
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
var templateID = $('#selectedObjectID').val();
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
$('#templateName'+templateID+'.regular').html(responseJSON.success);
|
|
}
|
|
}
|
|
});
|
|
if(templateCombined == 'yes') {
|
|
$('#inline-templateName').editable('disable');
|
|
} else {
|
|
$('#inline-templateName').editable('enable');
|
|
}
|
|
|
|
// Object MountConfig
|
|
if(response.mountConfig != 'N/A') {
|
|
$('#detailMountConfig').html('<a href="#" id="inline-mountConfig" data-type="select">-</a>');
|
|
$('#inline-mountConfig').editable({
|
|
showbuttons: false,
|
|
mode: 'inline',
|
|
source: response.mountConfigArray,
|
|
url: 'backend/process_object-custom.php',
|
|
send: 'always',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID':templateID,
|
|
'attribute':$(this).attr('id'),
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
$('#inline-mountConfig').editable('setValue', responseJSON.data.origValue, true);
|
|
displayError(responseJSON.error);
|
|
}
|
|
}
|
|
});
|
|
$('#inline-mountConfig').editable('setValue', response.mountConfig);
|
|
if(templateCombined == 'yes') {
|
|
$('#inline-mountConfig').editable('disable');
|
|
} else {
|
|
$('#inline-mountConfig').editable('enable');
|
|
}
|
|
} else {
|
|
$('#detailMountConfig').html(response.mountConfig);
|
|
}
|
|
|
|
// Object Port Orientation
|
|
if(response.portOrientationID != false) {
|
|
$('#detailPortOrientation').html('<a href="#" id="inline-portOrientation" data-type="select">-</a>');
|
|
$('#inline-portOrientation').editable({
|
|
showbuttons: false,
|
|
mode: 'inline',
|
|
source: response.portOrientationArray,
|
|
url: 'backend/process_object-custom.php',
|
|
send: 'always',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID':templateID,
|
|
'templateFace':templateFace,
|
|
'templateDepth':partitionDepth,
|
|
'attribute':$(this).attr('id'),
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
//var selectedObjID = $('#selectedObjectID').val();
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
}
|
|
}
|
|
});
|
|
$('#inline-portOrientation').editable('setValue', response.portOrientationID);
|
|
if(templateCombined == 'yes') {
|
|
$('#inline-portOrientation').editable('disable');
|
|
} else {
|
|
$('#inline-portOrientation').editable('enable');
|
|
}
|
|
} else {
|
|
$('#detailPortOrientation').html(response.portOrientationName);
|
|
}
|
|
|
|
// Object EnclosureTolerance
|
|
if(response.encTolerance != 'N/A') {
|
|
$('#detailEnclosureTolerance').html('<a href="#" id="inline-enclosureTolerance" data-type="select">-</a>');
|
|
$('#inline-enclosureTolerance').editable({
|
|
showbuttons: false,
|
|
mode: 'inline',
|
|
source: response.encToleranceArray,
|
|
url: 'backend/process_object-custom.php',
|
|
send: 'always',
|
|
params: function(params){
|
|
var data = {
|
|
'action':'edit',
|
|
'templateID':templateID,
|
|
'templateFace':templateFace,
|
|
'templateDepth':partitionDepth,
|
|
'attribute':$(this).attr('id'),
|
|
'value':params.value
|
|
};
|
|
params.data = JSON.stringify(data);
|
|
return params;
|
|
},
|
|
success: function(response) {
|
|
var selectedObjID = $('#selectedObjectID').val();
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
}
|
|
}
|
|
});
|
|
$('#inline-enclosureTolerance').editable('setValue', response.encTolerance);
|
|
if(templateCombined == 'yes') {
|
|
$('#inline-enclosureTolerance').editable('disable');
|
|
} else {
|
|
$('#inline-enclosureTolerance').editable('enable');
|
|
}
|
|
} else {
|
|
$('#detailEnclosureTolerance').html(response.encTolerance);
|
|
}
|
|
|
|
// Object Image
|
|
if(templateCombined == 'no') {
|
|
$('#templateImageAction').on('click', function(event){
|
|
event.preventDefault();
|
|
$('#modalImageUpload').modal('show');
|
|
});
|
|
$('#templateImageDelete').on('click', function(event){
|
|
event.preventDefault();
|
|
|
|
var data = {
|
|
templateID: templateID,
|
|
templateFace: templateFace
|
|
};
|
|
data = JSON.stringify(data);
|
|
|
|
$.post("backend/process_template-image-delete.php", {data:data}, function(response){
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
$('#elementTemplateImage').hide();
|
|
$('#templateImageDeleteContainer').remove();
|
|
$('#templateImageAction').html('upload');
|
|
}
|
|
});
|
|
});
|
|
}
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
function makeTemplatePartitionClickable(elem){
|
|
var variables = getVariables();
|
|
// Highlight this object
|
|
$(variables['obj']).find('.rackObjSelected').removeClass('rackObjSelected');
|
|
$(elem).addClass('rackObjSelected');
|
|
|
|
// Enable the 'size' input
|
|
$('#inputCustomPartitionSize').prop('disabled', false);
|
|
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
updatePortNameDisplay();
|
|
}
|
|
|
|
function expandRackUnit(RUSize){
|
|
|
|
// Expand RU for each cabinet side
|
|
for (var x=0; x<2; x++) {
|
|
|
|
var cabinetSize = $('#cabinetContainer'+x).children('table').find('tr').length;
|
|
var RUChange = false;
|
|
|
|
if(RUSize > cabinetSize) {
|
|
|
|
// Cabinet needs to grow
|
|
var RUDiff = RUSize - cabinetSize;
|
|
var rackUnitHTML = '<tr class="cabinet"><td class="cabinetRailRU cabinetRailLeft cabinet">1</td><td class="RackUnit'+x+'"></td><td class="cabinetRailRU cabinetRailRight cabinet"></td></tr>';
|
|
for (i = 0; i < RUDiff; i++) {
|
|
$('#cabinetContainer'+x).children('table').append(rackUnitHTML);
|
|
}
|
|
cabinetSize = RUSize;
|
|
RUChange = true;
|
|
} else if(RUSize < cabinetSize) {
|
|
|
|
// Cabinet needs to shrink
|
|
var RUDiff = cabinetSize - RUSize;
|
|
for (i = 0; i < RUDiff && cabinetSize > 5; i++) {
|
|
$('#cabinetContainer'+x).children('table').find('tr').last().remove();
|
|
cabinetSize--;
|
|
}
|
|
RUChange = true;
|
|
}
|
|
|
|
// Renumber RUs
|
|
if(RUChange) {
|
|
$.each($('#cabinetContainer'+x).children('table').find('tr'), function(){
|
|
var index = $('#cabinetContainer'+x).children('table').find('tr').index(this);
|
|
var RUNumber = cabinetSize - index;
|
|
$(this).children().first().html(RUNumber);
|
|
});
|
|
}
|
|
|
|
$('.RackUnit'+x).show();
|
|
$('.RackUnit'+x).eq(0).attr('rowspan', RUSize);
|
|
for (y=1; y<RUSize; y++) {
|
|
$('.RackUnit'+x).eq(y).hide();
|
|
}
|
|
}
|
|
}
|
|
|
|
function setObjectSize(){
|
|
var variables = getVariables();
|
|
$(variables['obj']).height(0);
|
|
var height = $(variables['obj']).parent().height();
|
|
$(variables['obj']).height(height);
|
|
|
|
if ($('input.objectType:checked').val() == 'Standard') {
|
|
var parentFlexUnits = variables['RUSize']*2;
|
|
var flexContainerParent = $(variables['obj']).children('.flex-container-parent');
|
|
var flexDirection = $(flexContainerParent).css('flex-direction');
|
|
|
|
// Recalculate dependent horizontal partitions.
|
|
if(flexDirection == 'row') {
|
|
$(flexContainerParent).children().each(function(){
|
|
$(this).children().each(function(){
|
|
var partitionFlexUnits = parseInt($(this).data('vUnits'), 10);
|
|
var partitionFlexSize = partitionFlexUnits/parentFlexUnits;
|
|
$(this).css('flex', partitionFlexSize + ' 1 0%');
|
|
});
|
|
});
|
|
} else {
|
|
$(flexContainerParent).children().each(function(){
|
|
var partitionFlexUnits = parseInt($(this).data('vUnits'), 10);
|
|
var partitionFlexSize = partitionFlexUnits/parentFlexUnits;
|
|
$(this).css('flex', partitionFlexSize + ' 1 0%');
|
|
});
|
|
}
|
|
}
|
|
}
|
|
|
|
function switchSides(sideValue){
|
|
if (sideValue == 1) {
|
|
$('#cabinetContainer0').hide();
|
|
$('#cabinetContainer1').show();
|
|
} else {
|
|
$('#cabinetContainer1').hide();
|
|
$('#cabinetContainer0').show();
|
|
}
|
|
//$('#inputCurrentSide').val(sideValue);
|
|
$(document).data('templateSide', sideValue);
|
|
}
|
|
|
|
function switchSidesDetail(sideValue){
|
|
if(sideValue==1){
|
|
$('#availableContainer0').hide();
|
|
$('#availableContainer1').show();
|
|
} else {
|
|
$('#availableContainer0').show();
|
|
$('#availableContainer1').hide();
|
|
}
|
|
$(document).data('availableTemplateSide', sideValue);
|
|
}
|
|
|
|
function getVariables(){
|
|
var variables = [];
|
|
variables['currentSide'] = $(document).data('templateSide');
|
|
variables['obj'] = $('#previewObj'+variables['currentSide']);
|
|
variables['selectedObj'] = $(variables['obj']).find('.rackObjSelected');
|
|
variables['selectedParent'] = $(variables['selectedObj']).parent();
|
|
variables['RUSize'] = $('#inputRU').val();
|
|
variables['halfRU'] = 1/(variables['RUSize']*2);
|
|
return variables;
|
|
}
|
|
|
|
function reapplyCategory(){
|
|
var variables = getVariables();
|
|
var selectedCategory = $("#inputCategory").find('option:selected').data('value');
|
|
|
|
$(variables['selectedObj']).removeClass (function (index, css) {
|
|
return (css.match (/(^|\s)category\S+/g) || []).join(' ');
|
|
});
|
|
|
|
$(variables['selectedObj']).addClass(selectedCategory);
|
|
}
|
|
|
|
function buildObj(objID, hUnits, vUnits, direction){
|
|
var obj = $('#previewObj'+objID);
|
|
$(obj).html('<div class="flex-container-parent rackObjSelected" style="flex-direction:'+direction+'" data-direction="'+direction+'" data-h-units="'+hUnits+'" data-v-units="'+vUnits+'"></div>');
|
|
var newObj = $(obj).children('.flex-container-parent');
|
|
setDefaultData(newObj);
|
|
|
|
$(newObj).on('click', function(){
|
|
// Highlight the object
|
|
$(this).find('.rackObjSelected').removeClass('rackObjSelected');
|
|
$(this).addClass('rackObjSelected');
|
|
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
updatePortNameDisplay();
|
|
});
|
|
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
}
|
|
|
|
function setCategory(){
|
|
variables = getVariables();
|
|
var category = $('#inputCategory').find('option:selected').data('value');
|
|
$(variables['obj']).removeClass (function (index, css) {
|
|
return (css.match (/(^|\s)category\S+/g) || []).join(' ');
|
|
});
|
|
$(variables['obj']).addClass(category);
|
|
}
|
|
|
|
function buildObjectArray(elem){
|
|
var parent = [];
|
|
|
|
$(elem).children('div').each(function(){
|
|
var workingArray = $(this).data();
|
|
workingArray['flex'] = $(this).css('flex-grow');
|
|
if ($(this).children('div.flex-container').length) {
|
|
workingArray['children'] = buildObjectArray(this);
|
|
}
|
|
if($(this).data('partitionType') == 'Connectable' && $(this).data('valueX') == 0 && $(this).data('valueY') == 0) {
|
|
workingArray['partitionType'] = 'Generic';
|
|
}
|
|
parent.push(workingArray);
|
|
});
|
|
|
|
return parent;
|
|
}
|
|
|
|
function resetTemplateDetails(){
|
|
$('#detailObjName').html('-');
|
|
$('#detailTrunkedTo').html('-');
|
|
$('#detailObjType').html('-');
|
|
$('#detailObjFunction').html('-');
|
|
$('#detailRUSize').html('-');
|
|
$('#detailMountConfig').html('-');
|
|
$('#detailPortRange').html('-');
|
|
if(!$('#detailPortRange').hasClass('no-modal')) {
|
|
$('#detailPortRange').addClass('no-modal');
|
|
}
|
|
$('#detailPortType').html('-');
|
|
$('#detailMediaType').html('-');
|
|
$('#detailTemplateImage').html('-');
|
|
$('#inline-templateName').editable('setValue', '-').editable('disable');
|
|
$('#inline-category').editable('disable').html('-');
|
|
$('#inline-portOrientation').editable('destroy').html('-');
|
|
$('#detailPortOrientation').html('-');
|
|
$('#inline-enclosureTolerance').editable('destroy').html('-');
|
|
$('#detailEnclosureTolerance').html('-');
|
|
|
|
$('#objClone').addClass('disabled');
|
|
$('#objFind').addClass('disabled');
|
|
$('#objDelete').addClass('disabled');
|
|
}
|
|
|
|
function togglePartitionTypeDependencies(){
|
|
var partitionType = $('input.partitionType:checked').val();
|
|
var objectType = $('input.objectType:checked').val();
|
|
$('.dependantField.partitionType').hide();
|
|
$('#partitionH, #partitionV, #customPartitionAdd, #customPartitionRemove, #objectPartitionSize, #objectMediaType, #objectPortType, #objectPortOrientation, #objectPortLayout').prop('disabled', false);
|
|
switch(partitionType) {
|
|
case 'Generic':
|
|
$('.dependantField.partitionType.generic').show().prop('disabled', false);
|
|
break;
|
|
|
|
case 'Connectable':
|
|
var objectFunction = $('input.objectFunction:checked').val();
|
|
switch(objectFunction) {
|
|
case 'Endpoint':
|
|
$('.dependantField.partitionType.connectable.endpoint').show().prop('disabled', false);
|
|
break;
|
|
|
|
case 'Passive':
|
|
$('.dependantField.partitionType.connectable.passive').show().prop('disabled', false);
|
|
break;
|
|
}
|
|
break;
|
|
|
|
case 'Enclosure':
|
|
$('.dependantField.partitionType.enclosureField').show();
|
|
break;
|
|
}
|
|
|
|
switch(objectType) {
|
|
case 'Standard':
|
|
$('#inputPartitionTypeGeneric').prop('disabled', false);
|
|
$('#inputPartitionTypeConnectable').prop('disabled', false);
|
|
$('#inputPartitionTypeEnclosure').prop('disabled', false);
|
|
break;
|
|
|
|
case 'Insert':
|
|
$('#inputPartitionTypeGeneric').prop('disabled', false);
|
|
$('#inputPartitionTypeConnectable').prop('disabled', false);
|
|
$('#inputPartitionTypeEnclosure').prop('disabled', false);
|
|
break;
|
|
}
|
|
}
|
|
|
|
function toggleObjectTypeDependencies(){
|
|
var objectType = $('input.objectType:checked').val();
|
|
$('.dependantField.objectType').hide();
|
|
switch(objectType) {
|
|
case 'Standard':
|
|
$('.dependantField.objectType.standard').show().prop('disabled', false);
|
|
break;
|
|
|
|
case 'Insert':
|
|
$('.dependantField.objectType.insert').show().prop('disabled', false);
|
|
break;
|
|
}
|
|
}
|
|
|
|
function resetCategoryForm(defaultCategoryColor){
|
|
$('#inputCategoryID').val(0);
|
|
$('#inputCategoryCurrentID').val(0);
|
|
$('#inputCategoryName').val('');
|
|
$('#color-picker').spectrum('set', defaultCategoryColor);
|
|
$('#inputCategoryDefault').prop({'checked':false,'disabled':false});
|
|
$('#categoryList').children('button').removeClass('rackObjSelected');
|
|
}
|
|
|
|
function filterTemplates(containerElement, inputElement, categoryContainers){
|
|
var tags = $(inputElement).tagsinput('items');
|
|
var templates = $(containerElement).find('.object-wrapper');
|
|
|
|
if($(tags).length) {
|
|
$(templates).hide().removeClass('templateVisible');
|
|
|
|
$.each(templates, function(indexTemplate, valueTemplate){
|
|
var templateObj = $(valueTemplate);
|
|
var templateName = $(valueTemplate).data('templateName').toLowerCase();
|
|
var match = true;
|
|
$.each(tags, function(indexTag, valueTag){
|
|
var tag = valueTag.toLowerCase();
|
|
if(templateName.indexOf(tag) >= 0 && match) {
|
|
match = true;
|
|
} else {
|
|
match = false;
|
|
}
|
|
});
|
|
|
|
if(match) {
|
|
$(templateObj).show().addClass('templateVisible');
|
|
}
|
|
});
|
|
|
|
$.each(categoryContainers, function(){
|
|
if($(this).find('.object-wrapper.templateVisible').size()) {
|
|
$(this).show();
|
|
} else {
|
|
$(this).hide();
|
|
}
|
|
});
|
|
} else {
|
|
$(templates).show().addClass('templateVisible');;
|
|
$(categoryContainers).show();
|
|
}
|
|
}
|
|
|
|
function initializeImageUpload(templateID, templateFace){
|
|
$('#fileTemplateImage').remove();
|
|
$('#containerTemplateImage').html('<input type="file" name="files[]" id="fileTemplateImage" multiple="multiple">');
|
|
$('#fileTemplateImage').filer({
|
|
limit: 1,
|
|
maxSize: null,
|
|
extensions: null,
|
|
changeInput: '<div class="jFiler-input-dragDrop"><div class="jFiler-input-inner"><div class="jFiler-input-icon"><i class="icon-jfi-cloud-up-o"></i></div><div class="jFiler-input-text"><h3>Drag & Drop file here</h3> <span style="display:inline-block; margin: 15px 0">or</span></div><a class="jFiler-input-choose-btn btn btn-custom waves-effect waves-light">Browse Files</a></div></div>',
|
|
showThumbs: true,
|
|
theme: "dragdropbox",
|
|
templates: {
|
|
box: '<ul class="jFiler-items-list jFiler-items-grid"></ul>',
|
|
item: '<li class="jFiler-item">\
|
|
<div class="jFiler-item-container">\
|
|
<div class="jFiler-item-inner">\
|
|
<div class="jFiler-item-thumb">\
|
|
<div class="jFiler-item-status"></div>\
|
|
<div class="jFiler-item-info">\
|
|
<span class="jFiler-item-title"><b title="{{fi-name}}">{{fi-name | limitTo: 25}}</b></span>\
|
|
<span class="jFiler-item-others">{{fi-size2}}</span>\
|
|
</div>\
|
|
{{fi-image}}\
|
|
</div>\
|
|
<div class="jFiler-item-assets jFiler-row">\
|
|
<ul class="list-inline pull-left">\
|
|
<li>{{fi-progressBar}}</li>\
|
|
</ul>\
|
|
<ul class="list-inline pull-right">\
|
|
<li><a class="icon-jfi-trash jFiler-item-trash-action"></a></li>\
|
|
</ul>\
|
|
</div>\
|
|
</div>\
|
|
</div>\
|
|
</li>',
|
|
itemAppend: '<li class="jFiler-item">\
|
|
<div class="jFiler-item-container">\
|
|
<div class="jFiler-item-inner">\
|
|
<div class="jFiler-item-thumb">\
|
|
<div class="jFiler-item-status"></div>\
|
|
<div class="jFiler-item-info">\
|
|
<span class="jFiler-item-title"><b title="{{fi-name}}">{{fi-name | limitTo: 25}}</b></span>\
|
|
<span class="jFiler-item-others">{{fi-size2}}</span>\
|
|
</div>\
|
|
{{fi-image}}\
|
|
</div>\
|
|
<div class="jFiler-item-assets jFiler-row">\
|
|
<ul class="list-inline pull-left">\
|
|
<li><span class="jFiler-item-others">{{fi-icon}}</span></li>\
|
|
</ul>\
|
|
<ul class="list-inline pull-right">\
|
|
<li><a class="icon-jfi-trash jFiler-item-trash-action"></a></li>\
|
|
</ul>\
|
|
</div>\
|
|
</div>\
|
|
</div>\
|
|
</li>',
|
|
progressBar: '<div class="bar"></div>',
|
|
itemAppendToEnd: false,
|
|
removeConfirmation: true,
|
|
_selectors: {
|
|
list: '.jFiler-items-list',
|
|
item: '.jFiler-item',
|
|
progressBar: '.bar',
|
|
remove: '.jFiler-item-trash-action'
|
|
}
|
|
},
|
|
dragDrop: {
|
|
dragEnter: null,
|
|
dragLeave: null,
|
|
drop: null,
|
|
},
|
|
uploadFile: {
|
|
url: 'backend/process_image-upload.php',
|
|
data: {
|
|
action:'templateImage',
|
|
templateID:templateID,
|
|
templateFace:templateFace
|
|
},
|
|
type: 'POST',
|
|
enctype: 'multipart/form-data',
|
|
beforeSend: function(){},
|
|
success: function(data, el){
|
|
var parent = el.find(".jFiler-jProgressBar").parent();
|
|
el.find(".jFiler-jProgressBar").fadeOut("slow", function(){
|
|
$("<div class=\"jFiler-item-others text-success\"><i class=\"icon-jfi-check-circle\"></i> Success</div>").hide().appendTo(parent).fadeIn("slow");
|
|
});
|
|
var responseJSON = JSON.parse(data);
|
|
var response = responseJSON.success;
|
|
$('#detailTemplateImage').children('img').attr('src', response.imgPath).show();
|
|
},
|
|
error: function(el){
|
|
var parent = el.find(".jFiler-jProgressBar").parent();
|
|
el.find(".jFiler-jProgressBar").fadeOut("slow", function(){
|
|
$("<div class=\"jFiler-item-others text-error\"><i class=\"icon-jfi-minus-circle\"></i> Error</div>").hide().appendTo(parent).fadeIn("slow");
|
|
});
|
|
},
|
|
statusCode: null,
|
|
onProgress: null,
|
|
onComplete: null
|
|
},
|
|
addMore: false,
|
|
clipBoardPaste: true,
|
|
excludeName: null,
|
|
beforeRender: null,
|
|
afterRender: null,
|
|
beforeShow: null,
|
|
beforeSelect: null,
|
|
onSelect: null,
|
|
afterShow: null,
|
|
onRemove: null,
|
|
onEmpty: null,
|
|
options: null,
|
|
captions: {
|
|
button: "Choose Files",
|
|
feedback: "Choose files To Upload",
|
|
feedback2: "files were chosen",
|
|
drop: "Drop file here to Upload",
|
|
removeConfirmation: "Are you sure you want to remove this file?",
|
|
errors: {
|
|
filesLimit: "Only {{fi-limit}} files are allowed to be uploaded.",
|
|
filesType: "Only Images are allowed to be uploaded.",
|
|
filesSize: "{{fi-name}} is too large! Please upload file up to {{fi-maxSize}} MB.",
|
|
filesSizeAll: "Files you've choosed are too large! Please upload files up to {{fi-maxSize}} MB."
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function reloadTemplates(){
|
|
$('#templateContainer').children().remove();
|
|
$('#templateContainer').load('/backend/retrieve_build-objects.php', function(){
|
|
makeRackObjectsClickable();
|
|
});
|
|
}
|
|
|
|
function setPortNameFieldFocus(){
|
|
$('.portNameFields').off('focus');
|
|
$('.portNameFields').focus(function(){
|
|
//$(document).data('focusedPortNameField', $(this));
|
|
//handlePortNameOptions();
|
|
var focusedPortNameField = $(this);
|
|
$('.portNameFields').removeClass('input-focused');
|
|
$(focusedPortNameField).addClass('input-focused');
|
|
handlePortNameOptions();
|
|
});
|
|
}
|
|
|
|
function handlePortNameOptions(){
|
|
//var focusedPortNameField = $(document).data('focusedPortNameField');
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var valuePortNameType = $(focusedPortNameField).data('type');
|
|
$('#selectPortNameFieldType').children('option[value="'+valuePortNameType+'"]').prop('selected', true);
|
|
|
|
if(valuePortNameType == 'static') {
|
|
|
|
// Set identifier
|
|
$(focusedPortNameField).prev('em').html(' ');
|
|
|
|
$('#inputPortNameFieldCount').val(0);
|
|
$('#selectPortNameFieldOrder').children('option[value="1"]').prop('selected', true);
|
|
$('#inputPortNameFieldCount').prop("disabled", true);
|
|
$('#selectPortNameFieldOrder').prop("disabled", true);
|
|
} else if(valuePortNameType == 'incremental' || valuePortNameType == 'series'){
|
|
var incrementalElements = $('.portNameFields[data-type="incremental"], .portNameFields[data-type="series"]');
|
|
var numberOfIncrementals = $(incrementalElements).length;
|
|
|
|
// Adjust order select
|
|
$('#selectPortNameFieldOrder').empty();
|
|
var x;
|
|
for(x=1; x<=numberOfIncrementals; x++) {
|
|
var optionString = convertNumToDeg(x, numberOfIncrementals);
|
|
$('#selectPortNameFieldOrder').append('<option value="'+x+'">'+optionString+'</option>');
|
|
}
|
|
|
|
var valuePortNameCount = $(focusedPortNameField).data('count');
|
|
var valuePortNameOrder = $(focusedPortNameField).data('order');
|
|
$('#inputPortNameFieldCount').val(valuePortNameCount);
|
|
$('#selectPortNameFieldOrder').children('option[value="'+valuePortNameOrder+'"]').prop('selected', true);
|
|
$('#selectPortNameFieldOrder').prop("disabled", false);
|
|
if(valuePortNameType == 'series') {
|
|
$('#inputPortNameFieldCount').prop("disabled", true);
|
|
} else if(valuePortNameType == 'incremental') {
|
|
$('#inputPortNameFieldCount').prop("disabled", false);
|
|
}
|
|
}
|
|
}
|
|
|
|
function convertNumToDeg(num, total){
|
|
|
|
// Invert the number... in a series of 3 incremental fields, the 3rd field in order will display as "1st"
|
|
var numArray = new Array(total);
|
|
for(x=0; x<total; x++) {
|
|
numArray[x] = x+1;
|
|
}
|
|
invertedNum = numArray[total - num];
|
|
|
|
// Determine superscript
|
|
if(invertedNum==1) {
|
|
superScript = 'st';
|
|
} else if(invertedNum==2) {
|
|
superScript = 'nd';
|
|
} else if(invertedNum==3) {
|
|
superScript = 'rd';
|
|
} else {
|
|
superScript = 'th';
|
|
}
|
|
|
|
// Smoosh it together
|
|
string = invertedNum + superScript;
|
|
|
|
return string;
|
|
}
|
|
|
|
function reorderIncrementals(newOrder){
|
|
//var focusedPortNameField = $(document).data('focusedPortNameField');
|
|
|
|
var incrementalElements = $('.portNameFields[data-type="incremental"], .portNameFields[data-type="series"]');
|
|
var numberOfIncrementals = $(incrementalElements).length;
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var originalOrder = parseInt($(focusedPortNameField).data('order'));
|
|
$(incrementalElements).each(function(){
|
|
|
|
var currentOrder = parseInt($(this).data('order'));
|
|
|
|
if(currentOrder > originalOrder) {
|
|
if(currentOrder > newOrder) {
|
|
var x = currentOrder;
|
|
} else if(currentOrder < newOrder) {
|
|
var x = currentOrder - 1;
|
|
} else {
|
|
var x = currentOrder - 1;
|
|
}
|
|
} else if(currentOrder < originalOrder) {
|
|
if(currentOrder > newOrder) {
|
|
var x = currentOrder + 1;
|
|
} else if(currentOrder < newOrder) {
|
|
var x = currentOrder;
|
|
} else {
|
|
var x = currentOrder + 1;
|
|
}
|
|
} else {
|
|
var x = newOrder;
|
|
}
|
|
|
|
var y = convertNumToDeg(x, numberOfIncrementals);
|
|
$(this).data('order', x);
|
|
$(this).prev('em').html(y);
|
|
});
|
|
}
|
|
|
|
function resetIncrementals(){
|
|
//var focusedPortNameField = $(document).data('focusedPortNameField');
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var incrementalElements = $('.portNameFields[data-type="incremental"], .portNameFields[data-type="series"]');
|
|
var numberOfIncrementals = $(incrementalElements).length;
|
|
|
|
// Set order to last if this is an unorderable field changing to an orderable field?
|
|
var selectedOrder = parseInt($(focusedPortNameField).data('order'));
|
|
|
|
/*
|
|
if(selectedOrder == 0) {
|
|
$(focusedPortNameField).data('order', numberOfIncrementals);
|
|
}
|
|
*/
|
|
|
|
incrementalElements = incrementalElements.sort(function(a, b) {
|
|
return parseInt($(a).data('order')) - parseInt($(b).data('order'));
|
|
});
|
|
|
|
$(incrementalElements).each(function(index){
|
|
var newOrder = index+1;
|
|
var newOrderString = convertNumToDeg(newOrder, numberOfIncrementals);
|
|
$(this).data('order', newOrder);
|
|
$(this).prev().html(newOrderString);
|
|
});
|
|
}
|
|
|
|
function handlePortNameFieldAddRemoveButtons(){
|
|
var portNameFieldCount = $('#portNameFieldContainer').children().length;
|
|
|
|
if(portNameFieldCount >= 5) {
|
|
$('#buttonAddPortNameField').prop("disabled", true);
|
|
} else {
|
|
$('#buttonAddPortNameField').prop("disabled", false);
|
|
}
|
|
|
|
if(portNameFieldCount <= 1) {
|
|
$('#buttonDeletePortNameField').prop("disabled", true);
|
|
} else {
|
|
$('#buttonDeletePortNameField').prop("disabled", false);
|
|
}
|
|
}
|
|
|
|
function updateportNameFormat(){
|
|
var allElements = $('.portNameFields');
|
|
var allElementsArray = [];
|
|
|
|
$(allElements).each(function(){
|
|
var elementType = $(this).data('type');
|
|
var elementValue = $(this).val();
|
|
var elementCount = parseInt($(this).data('count'));
|
|
var elementOrder = parseInt($(this).data('order'));
|
|
if(elementType == 'series') {
|
|
elementValue = elementValue.split(',');
|
|
var elementCount = elementValue.length;
|
|
}
|
|
|
|
allElementsArray.push({
|
|
type: elementType,
|
|
value: elementValue,
|
|
count: elementCount,
|
|
order: elementOrder
|
|
});
|
|
});
|
|
|
|
if($(document).data('portNameFormatAction') == 'edit') {
|
|
$(document).data('portNameFormatEdit', allElementsArray);
|
|
} else {
|
|
var variables = getVariables();
|
|
$(variables['selectedObj']).data('portNameFormat', allElementsArray);
|
|
}
|
|
}
|
|
|
|
function updatePortNameDisplay(){
|
|
if($(document).data('portNameFormatAction') == 'edit') {
|
|
var portTotal = $(document).data('portTotalEdit');
|
|
var portNameFormat = $(document).data('portNameFormatEdit');
|
|
} else {
|
|
var variables = getVariables();
|
|
var portLayoutX = $(variables['selectedObj']).data('valueX');
|
|
var portLayoutY = $(variables['selectedObj']).data('valueY');
|
|
var portTotal = portLayoutX * portLayoutY;
|
|
var portNameFormat = $(variables['selectedObj']).data('portNameFormat');
|
|
}
|
|
|
|
var data = {
|
|
portNameFormat: portNameFormat,
|
|
portTotal: portTotal
|
|
};
|
|
|
|
// Convert to JSON string so it can be posted
|
|
data = JSON.stringify(data);
|
|
|
|
// Post user input
|
|
$.post('backend/process_port-name-format.php', {'data':data}, function(responseJSON){
|
|
var response = JSON.parse(responseJSON);
|
|
if (response.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(response.error).size() > 0){
|
|
displayErrorElement(response.error, $('#alertMsgPortName'));
|
|
$('#portNameDisplayConfig').html('Error');
|
|
$('#portNameDisplay').html('Error');
|
|
} else {
|
|
$('#alertMsgPortName').empty();
|
|
|
|
if($(document).data('portNameFormatAction') == 'add') {
|
|
$('#portNameDisplay').html(response.success.portNameListShort);
|
|
} else if($(document).data('portNameFormatAction') == 'edit') {
|
|
$('#detailPortRange').html('<a href="#">'+response.success.portRange+'</a>');
|
|
} else {
|
|
$('#portNameDisplay').html(response.success.portNameListShort);
|
|
}
|
|
|
|
$('#portNameDisplayConfig').html(response.success.portNameListLong);
|
|
}
|
|
});
|
|
}
|
|
|
|
function setPortNameInput(){
|
|
if($(document).data('portNameFormatAction') == 'edit') {
|
|
var portNameFormat = $(document).data('portNameFormatEdit');
|
|
} else {
|
|
var variables = getVariables();
|
|
var portNameFormat = $(variables['selectedObj']).data('portNameFormat');
|
|
}
|
|
|
|
$('#portNameFieldContainer').empty();
|
|
$.each(portNameFormat, function(key, item){
|
|
var nameFieldHTML = $('<div class="col-sm-2 no-padding"><em> </em><input type="text" class="portNameFields form-control" value="'+item.value+'" data-type="'+item.type+'" data-count="'+item.count+'" data-order="'+item.order+'"></div>');
|
|
$('#portNameFieldContainer').append(nameFieldHTML);
|
|
});
|
|
resetIncrementals();
|
|
$('.portNameFields').on('keyup', function(){
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
}
|
|
|
|
function initializeTemplateCatalog(){
|
|
// Make catalog filterable
|
|
$('#templateCatalogFilter').on('itemAdded', function(event){
|
|
var containerElement = $('#templateCatalogAvailableContainer');
|
|
var inputElement = $('#templateCatalogFilter');
|
|
var categoryContainers = $(containerElement).find('.categoryContainerEntire');
|
|
filterTemplates(containerElement, inputElement, categoryContainers);
|
|
}).on('itemRemoved', function(event){
|
|
var containerElement = $('#templateCatalogAvailableContainer');
|
|
var inputElement = $('#templateCatalogFilter');
|
|
var categoryContainers = $(containerElement).find('.categoryContainerEntire');
|
|
filterTemplates(containerElement, inputElement, categoryContainers);
|
|
});
|
|
|
|
// Make catalog titles expandable
|
|
$('#containerTemplateCatalog').find('.categoryTitle').on('click', function(){
|
|
var categoryName = $(this).data('categoryName');
|
|
if($('#containerTemplateCatalog').find('.category'+categoryName+'Container').is(':visible')) {
|
|
$('#containerTemplateCatalog').find('.category'+categoryName+'Container').hide(400);
|
|
$('#containerTemplateCatalog').children('i').removeClass('fa-caret-down').addClass('fa-caret-right');
|
|
} else {
|
|
$('#containerTemplateCatalog').find('.categoryContainer').hide(400);
|
|
$('#containerTemplateCatalog').find('.categoryTitle').children('i').removeClass('fa-caret-down').addClass('fa-caret-right');
|
|
$('#containerTemplateCatalog').find('.category'+categoryName+'Container').show(400);
|
|
$('#containerTemplateCatalog').children('i').removeClass('fa-caret-right').addClass('fa-caret-down');
|
|
}
|
|
});
|
|
|
|
// Retreive template details when clicked
|
|
$('#templateCatalogAvailableContainer').find('.selectable').click(function(event){
|
|
event.stopPropagation();
|
|
if($(this).hasClass('stockObj')) {
|
|
var object = $(this);
|
|
var partitionDepth = 0;
|
|
} else {
|
|
var object = $(this).closest('.stockObj');
|
|
var partitionDepth = parseInt($(this).data('depth'), 10);
|
|
}
|
|
|
|
//Store objectID
|
|
var objID = $(object).data('templateId');
|
|
$(document).data('templateCatalogID', objID);
|
|
|
|
//Store objectFace
|
|
var objFace = $(object).data('objectFace');
|
|
|
|
//Remove hightlight from all racked objects
|
|
$('#templateCatalogAvailableContainer').find('.rackObjSelected').removeClass('rackObjSelected');
|
|
|
|
//Hightlight the selected racked object
|
|
$(this).addClass('rackObjSelected');
|
|
|
|
//Collect object data
|
|
var data = {
|
|
objID: objID,
|
|
objFace: objFace,
|
|
partitionDepth: partitionDepth
|
|
};
|
|
data = JSON.stringify(data);
|
|
|
|
//Retrieve object details
|
|
$.post("https://patchcablemgr.com/public/template-catalog-details-0-3-11.php", {data:data}, function(response){
|
|
var alertMsg = '';
|
|
var responseJSON = JSON.parse(response);
|
|
if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
var response = responseJSON.success;
|
|
$('#detailTemplateCatalogObjName').html(response.objectName);
|
|
$('#detailTemplateCatalogTemplateName').html(response.templateName);
|
|
$('#detailTemplateCatalogCategory').html(response.categoryName);
|
|
$('#detailTemplateCatalogTrunkedTo').html(response.trunkedTo);
|
|
$('#detailTemplateCatalogObjType').html(response.objectType);
|
|
$('#detailTemplateCatalogObjFunction').html(response.function);
|
|
$('#detailTemplateCatalogRUSize').html(response.RUSize);
|
|
$('#detailTemplateCatalogMountConfig').html(response.mountConfig);
|
|
$('#detailTemplateCatalogPortRange').html(response.portRange);
|
|
$('#detailTemplateCatalogPortType').html(response.portType);
|
|
$('#detailTemplateCatalogMediaType').html(response.mediaType);
|
|
$('#detailTemplateCatalogImage').html('<img id="elementTemplateCatalogImage" src="" height="" width=""></img>');
|
|
$('#elementTemplateCatalogImage').attr({
|
|
src:response.templateImgPath,
|
|
height:response.templateImgHeight + 'px',
|
|
width:response.templateImgWidth + '%'
|
|
});
|
|
$('#buttonTemplateCatalogImport').prop("disabled", false);
|
|
}
|
|
});
|
|
});
|
|
|
|
// Import selected template
|
|
$('#buttonTemplateCatalogImport').on('click', function(){
|
|
var templateID = $(document).data('templateCatalogID');
|
|
|
|
//Collect object data
|
|
var data = {
|
|
templateID: templateID
|
|
};
|
|
data = JSON.stringify(data);
|
|
|
|
$.post("backend/process_template-import.php", {data:data}, function(responseJSON){
|
|
var response = JSON.parse(responseJSON);
|
|
if (response.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(response.error).size() > 0){
|
|
displayErrorElement(response.error, $('#alertMsgCatalog'));
|
|
} else {
|
|
displaySuccessElement(response.success, $('#alertMsgCatalog'));
|
|
reloadTemplates();
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
function handleMountConfig(mountConfig){
|
|
if (mountConfig == 1) {
|
|
//4-Post
|
|
$('#inputSideCount4Post').prop('checked', true);
|
|
$('#inputSideCount').val(1);
|
|
$('.sideSelector').prop('disabled', false);
|
|
$('#objectTypeInsert0').prop('disabled', true);
|
|
$('#objectTypeInsert1').prop('disabled', true);
|
|
} else {
|
|
//2-Post
|
|
$('#inputSideCount2Post').prop('checked', true);
|
|
$('#inputSideCount').val(0);
|
|
$('.sideSelector').prop('disabled', true);
|
|
$('#objectTypeInsert0').prop('disabled', false);
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
$('#sideSelectorFront').prop('checked', true);
|
|
}
|
|
}
|
|
|
|
function handleScrollLock(){
|
|
var scrollLockState = $('#checkboxScrollLock').is(':checked');
|
|
|
|
if(!scrollLockState) {
|
|
var topnavHeight = $('#topnav').height();
|
|
var cabinetTop = $('#cabinetContainer').offset().top;
|
|
var cabinetHeight = $('#cabinetContainer').outerHeight();
|
|
var cabinetBuffer = 30;
|
|
var cabinetTopToNav = cabinetTop - topnavHeight - cabinetBuffer;
|
|
$('#cabinetContainer').offset({top:cabinetTop});
|
|
|
|
$(window).scroll(function() {
|
|
var windowTop = $(window).scrollTop();
|
|
var cabinetBottom = cabinetHeight + $('#cabinetContainer').offset().top;
|
|
var footerTop = $('footer').offset().top;
|
|
if(windowTop > cabinetTopToNav && cabinetBottom <= footerTop+5) {
|
|
var cabinetOffset = windowTop + topnavHeight + cabinetBuffer;
|
|
if(cabinetOffset+cabinetHeight > footerTop) {
|
|
cabinetOffset = footerTop - cabinetHeight;
|
|
}
|
|
$('#cabinetContainer').offset({top:cabinetOffset});
|
|
} else if(windowTop < cabinetTopToNav) {
|
|
$('#cabinetContainer').offset({top:cabinetTop});
|
|
}
|
|
});
|
|
} else {
|
|
$('#cabinetContainer').css('position', 'static');
|
|
$(window).unbind('scroll');
|
|
}
|
|
|
|
}
|
|
|
|
function buildInsertParent(RUSize, hUnits, vUnits, encLayoutX, encLayoutY, nestedInsert, parentHUnits, parentVUnits, parentEncLayoutX, parentEncLayoutY){
|
|
var variables = getVariables();
|
|
var totalVUnits = RUSize * 2;
|
|
var flexRow = hUnits/24;
|
|
var flexCol = vUnits/totalVUnits;
|
|
|
|
if(nestedInsert) {
|
|
|
|
parentFlexWidth = (parentHUnits / 24) / parentEncLayoutX;
|
|
parentFlexHeight = (parentVUnits / (RUSize * 2)) / parentEncLayoutY;
|
|
flexRow = parentFlexWidth * flexRow;
|
|
flexCol = parentFlexHeight * flexCol;
|
|
}
|
|
|
|
var table = '';
|
|
|
|
table += '<div class="flex-container-parent" style="flex-direction:row;">';
|
|
table += '<div style="display:flex; flex-direction:column; flex:'+flexRow+'">';
|
|
table += '<div style="display:flex; flex-direction:column; flex:'+flexCol+'">';
|
|
table += buildTable(encLayoutX, encLayoutY, 'enclosureTable', true);
|
|
table += '</div>';
|
|
table += '</div>';
|
|
|
|
// Clear the preview object of any user formatting
|
|
$(variables['obj']).removeClass(function(index, css) {
|
|
return (css.match(/(^|\s)category\S+/g) || []).join(' ');
|
|
});
|
|
|
|
expandRackUnit(RUSize);
|
|
setObjectSize();
|
|
$(variables['obj']).html(table);
|
|
|
|
$(variables['obj'])
|
|
.find('.tableRow:first')
|
|
.find('.tableCol:first')
|
|
.html('<div id="previewObj3" class="objBaseline" data-h-units="'+hUnits+'" data-v-units="'+vUnits+'" data-value-x="'+encLayoutX+'" data-value-y="'+encLayoutY+'"></div>');
|
|
}
|
|
|
|
$( document ).ready(function() {
|
|
|
|
var scrollLockState = $('#checkboxScrollLock').is(':checked');
|
|
if(scrollLockState) {
|
|
var scrollLockSetting = 'locked';
|
|
} else {
|
|
var scrollLockSetting = 'unlocked';
|
|
}
|
|
$('#scrollState').html(scrollLockSetting);
|
|
handleScrollLock();
|
|
toggleObjectTypeDependencies();
|
|
|
|
$('#containerTemplateCatalog').load('/backend/retrieve_template-catalog.php', function(){
|
|
initializeTemplateCatalog();
|
|
});
|
|
|
|
$('#templateFilter').on('itemAdded', function(event){
|
|
var containerElement = $('#availableObjects');
|
|
var inputElement = $('#templateFilter');
|
|
var categoryContainers = $(containerElement).find('.categoryContainerEntire');
|
|
filterTemplates(containerElement, inputElement, categoryContainers);
|
|
}).on('itemRemoved', function(event){
|
|
var containerElement = $('#availableObjects');
|
|
var inputElement = $('#templateFilter');
|
|
var categoryContainers = $(containerElement).find('.categoryContainerEntire');
|
|
filterTemplates(containerElement, inputElement, categoryContainers);
|
|
});
|
|
|
|
//X-editable buttons style
|
|
$.fn.editableform.buttons =
|
|
'<button type="submit" class="btn btn-sm btn-primary editable-submit waves-effect waves-light"><i class="zmdi zmdi-check"></i></button>' +
|
|
'<button type="button" class="btn btn-sm editable-cancel btn-secondary waves-effect"><i class="zmdi zmdi-close"></i></button>';
|
|
|
|
var defaultCategoryColor = '#d3d3d3';
|
|
makeRackObjectsClickable();
|
|
$(document).data('obj', $('#previewObj0'));
|
|
$(document).data('templateSide', 0);
|
|
$(document).data('availableTemplateSide', 0);
|
|
setObjectSize();
|
|
for(x=0; x<2; x++) {
|
|
buildObj(x, 24, 2, 'column');
|
|
}
|
|
setCategory();
|
|
|
|
$('#checkboxScrollLock').on('change', function(){
|
|
handleScrollLock();
|
|
});
|
|
|
|
// Clone a template to the workspace
|
|
$('#objClone').click(function(e){
|
|
e.preventDefault();
|
|
if($(this).hasClass('disabled')) {
|
|
return false;
|
|
}
|
|
|
|
var templateID = $('#selectedObjectID').val();
|
|
var templateSide = $(document).data('availableTemplateSide');
|
|
var templateObj = $('#availableContainer'+templateSide).find('.stockObj[data-template-id="'+templateID+'"]');
|
|
var templateName = $(templateObj).data('templateName');
|
|
var templateType = $(templateObj).data('templateType');
|
|
var templateFrontImage = $(templateObj).data('templateFrontImage');
|
|
var templateRearImage = $(templateObj).data('templateRearImage');
|
|
|
|
// Store template data
|
|
var RUSize = $(templateObj).data('ruSize');
|
|
var categoryID = $(templateObj).data('templateCategoryId');
|
|
var category = $(templateObj).data('templateCategoryName');
|
|
var face = $(templateObj).data('objectFace');
|
|
var templateFunction = $(templateObj).data('templateFunction');
|
|
var templateObjChild = $(templateObj).children()[0];
|
|
|
|
$('[name="objectTypeRadio"][value='+templateType+']').prop('checked', true);
|
|
$('[name="category"][value='+categoryID+']').prop('selected', true);
|
|
$('#inputName').val(templateName);
|
|
$('#inputFrontImage').val(templateFrontImage);
|
|
$('#inputRearImage').val(templateRearImage);
|
|
|
|
if(templateType == 'Insert') {
|
|
|
|
var parentHUnits = $(templateObj).data('parentHUnits');
|
|
var parentVUnits = $(templateObj).data('parentVUnits');
|
|
var parentEncLayoutX = $(templateObj).data('parentEncLayoutX');
|
|
var parentEncLayoutY = $(templateObj).data('parentEncLayoutY');
|
|
var nestedInsert = $(templateObj).data('nestedInsert');
|
|
var nestedParentHUnits = $(templateObj).data('nestedParentHUnits');
|
|
var nestedParentVUnits = $(templateObj).data('nestedParentVUnits');
|
|
var nestedParentEncLayoutX = $(templateObj).data('nestedParentEncLayoutX');
|
|
var nestedParentEncLayoutY = $(templateObj).data('nestedParentEncLayoutY');
|
|
$(document).data('nestedInsertParentHUnits', nestedParentHUnits);
|
|
$(document).data('nestedInsertParentVUnits', nestedParentVUnits);
|
|
$(document).data('nestedInsertParentEncLayoutX', nestedParentEncLayoutX);
|
|
$(document).data('nestedInsertParentEncLayoutY', nestedParentEncLayoutY);
|
|
buildInsertParent(RUSize, parentHUnits, parentVUnits, parentEncLayoutX, parentEncLayoutY, nestedInsert, nestedParentHUnits, nestedParentVUnits, nestedParentEncLayoutX, nestedParentEncLayoutY);
|
|
switchSides(3);
|
|
setCategory();
|
|
$('#previewObj3').html($(templateObjChild).clone());
|
|
var object = $('#previewObj3');
|
|
objFaceArray = [object];
|
|
|
|
} else {
|
|
switchSides(0);
|
|
|
|
for(x=0; x<2; x++) {
|
|
var flexUnits = RUSize * 2;
|
|
$('#previewObj'+x).data('vUnits', flexUnits);
|
|
$('#previewObj'+x).children('.flex-container-parent').data('vUnits', flexUnits);
|
|
}
|
|
|
|
// Clone template faces to workspace and save them for reference
|
|
var mountConfig = $(templateObj).data('objectMountConfig');
|
|
if(mountConfig == 0) {
|
|
$('#previewObj0').html($(templateObjChild).clone());
|
|
var object = $('#previewObj0');
|
|
|
|
objFaceArray = [object];
|
|
} else {
|
|
|
|
// Find the index of the opposite face
|
|
var faceOpposite = face == 0 ? 1 : 0;
|
|
|
|
// Store the opposite face
|
|
var templateObjOpposite = $('#availableContainer'+faceOpposite).find('.stockObj[data-template-id="'+templateID+'"]');
|
|
var templateObjOppositeChild = $(templateObjOpposite).children()[0];
|
|
|
|
// Clone front and rear to workspace
|
|
$('#previewObj'+face).html($(templateObjChild).clone());
|
|
$('#previewObj'+faceOpposite).html($(templateObjOppositeChild).clone());
|
|
var object = $('#previewObj'+face);
|
|
var objectOpposite = $('#previewObj'+faceOpposite);
|
|
|
|
objFaceArray = [object, objectOpposite];
|
|
}
|
|
}
|
|
|
|
// Apply template data
|
|
handleMountConfig(mountConfig);
|
|
$('#inputRU').val(RUSize);
|
|
$('#inputCategory').children('[value='+categoryID+']').prop('selected', true);
|
|
$('[name="objectFunction"][value='+templateFunction+']').prop('checked', true);
|
|
expandRackUnit(RUSize);
|
|
setObjectSize();
|
|
setCategory();
|
|
toggleObjectTypeDependencies();
|
|
togglePartitionTypeDependencies();
|
|
|
|
$.each(objFaceArray, function(){
|
|
|
|
$(this).find('.flex-container').addClass('border-black transparency-20');
|
|
$(this).find('.flex-container, .flex-container-parent').on('click', function(event){
|
|
event.stopPropagation();
|
|
makeTemplatePartitionClickable(this);
|
|
});
|
|
});
|
|
|
|
var variables = getVariables();
|
|
$(variables['selectedObj']).click();
|
|
});
|
|
|
|
// Delete a temlate
|
|
$('#confirmObjDelete').click(function(){
|
|
var templateCombined = $(document).data('selectedTemplateCombined');
|
|
if (templateCombined == 'yes') {
|
|
var templateID = $(document).data('selectedTemplateCombinedID');
|
|
var templateType = 'combined';
|
|
} else {
|
|
var templateID = $(document).data('selectedTemplateID');
|
|
var templateType = 'regular';
|
|
}
|
|
var data = {
|
|
'id': templateID,
|
|
'templateCombined': templateCombined,
|
|
'action': 'delete'
|
|
};
|
|
data = JSON.stringify(data);
|
|
$.post('backend/process_object-custom.php', {'data':data}, function(response){
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else if (responseJSON.success != ''){
|
|
displaySuccess(responseJSON.success);
|
|
$('#availableContainer').find('.object'+templateID+'.'+templateType).remove();
|
|
resetTemplateDetails();
|
|
} else {
|
|
displayError(['Something went wrong.']);
|
|
}
|
|
});
|
|
});
|
|
|
|
// Start colorpicker
|
|
$('#color-picker').spectrum({
|
|
preferredFormat: 'hex',
|
|
showButtons: false,
|
|
showPaletteOnly: true,
|
|
showPalette: true,
|
|
color: defaultCategoryColor,
|
|
palette: [
|
|
[
|
|
'#d581d6',
|
|
'#d6819f',
|
|
'#d68d8d',
|
|
'#e59881',
|
|
'#d6d678',
|
|
'#a9a9a9'
|
|
],
|
|
[
|
|
'#95d681',
|
|
'#81d6a1',
|
|
'#81d6ce',
|
|
'#81bad6',
|
|
'#92b2d6',
|
|
'#d3d3d3'
|
|
]
|
|
],
|
|
change: function(color){
|
|
$('#color-picker').val(color);
|
|
}
|
|
}).val(defaultCategoryColor);
|
|
|
|
// Select category
|
|
$('#categoryList').children('button').on('click', function(){
|
|
if($(this).hasClass('rackObjSelected')) {
|
|
resetCategoryForm(defaultCategoryColor);
|
|
} else {
|
|
$('#categoryList').children('button').removeClass('rackObjSelected');
|
|
$(this).addClass('rackObjSelected');
|
|
$('#inputCategoryID').val($(this).data('id'));
|
|
$('#inputCategoryCurrentID').val($(this).data('id'));
|
|
$('#inputCategoryName').val($(this).data('name'));
|
|
$('#color-picker').spectrum('set', $(this).data('color'));
|
|
if($(this).data('default') == 1) {
|
|
$('#inputCategoryDefault').prop({'checked':true,'disabled':true});
|
|
} else {
|
|
$('#inputCategoryDefault').prop({'checked':false,'disabled':false});
|
|
}
|
|
}
|
|
});
|
|
|
|
// Delete selected categories
|
|
$('#manageCategories-Delete').on('click', function(){
|
|
var data = JSON.stringify($('#manageCategoriesCurrent-Form').serializeArray());
|
|
$.post('backend/process_object-category.php', {'data':data}, function(response){
|
|
var alertMsg = '';
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
$('#alertMsgCategory').empty();
|
|
$.each(responseJSON.error, function(index, errorTxt){
|
|
alertMsg += '<div class="alert alert-danger" role="alert">';
|
|
alertMsg += '<strong>Oops!</strong> '+errorTxt;
|
|
alertMsg += '</div>';
|
|
$('#alertMsgCategory').append(alertMsg);
|
|
});
|
|
$("html, body").animate({ scrollTop: 0 }, "slow");
|
|
} else {
|
|
$('#categoryOption'+responseJSON.success).remove();
|
|
$('#categoryList'+responseJSON.success).remove();
|
|
resetCategoryForm(defaultCategoryColor);
|
|
alertMsg += '<div class="alert alert-success" role="alert">';
|
|
alertMsg += '<strong>Success!</strong> Category was deleted.';
|
|
alertMsg += '</div>';
|
|
$('#alertMsgCategory').html(alertMsg);
|
|
}
|
|
});
|
|
});
|
|
|
|
// Category Manager form save
|
|
$('#manageCategories-Save').on('click', function(event){
|
|
var defaultOptionProp = $('#inputCategoryDefault').prop('disabled');
|
|
if(defaultOptionProp) {
|
|
$('#inputCategoryDefault').prop('disabled', false);
|
|
}
|
|
var data = JSON.stringify($('#manageCategories-Form').serializeArray());
|
|
$('#inputCategoryDefault').prop('disabled', defaultOptionProp);
|
|
$.post('backend/process_object-category.php', {'data':data}, function(response){
|
|
var alertMsg = '';
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
$('#alertMsgCategory').empty();
|
|
$.each(responseJSON.error, function(index, errorTxt){
|
|
alertMsg += '<div class="alert alert-danger" role="alert">';
|
|
alertMsg += '<strong>Oops!</strong> '+errorTxt;
|
|
alertMsg += '</div>';
|
|
$('#alertMsgCategory').append(alertMsg);
|
|
});
|
|
$("html, body").animate({ scrollTop: 0 }, "slow");
|
|
} else {
|
|
$("#customStyle").load('includes/content-custom_style.php');
|
|
if(responseJSON.success.defaultOption == 1) {
|
|
var currentDefault = $('#categoryList').children('button[data-default="1"]');
|
|
$(currentDefault).data('default', 0);
|
|
$(currentDefault).html($(currentDefault).data('name'));
|
|
}
|
|
if(responseJSON.success.action == 'add') {
|
|
$('#inputCategory').append('<option id="categoryOption'+responseJSON.success.id+'" data-value="category'+responseJSON.success.name+'" value="'+responseJSON.success.id+'">'+responseJSON.success.name+'</option>');
|
|
var defaultIdentifier = responseJSON.success.defaultOption == 1 ? '*' : '';
|
|
$('#categoryList').append('<button id="categoryList'+responseJSON.success.id+'" type="button" class="category'+responseJSON.success.name+' btn-block btn waves-effect waves-light" data-id="'+responseJSON.success.id+'" data-name="'+responseJSON.success.name+'" data-color="'+responseJSON.success.color+'" data-default="'+responseJSON.success.defaultOption+'">'+responseJSON.success.name+defaultIdentifier+'</button>');
|
|
$('#categoryList').children().last().on('click', function(){
|
|
if($(this).hasClass('rackObjSelected')) {
|
|
resetCategoryForm(defaultCategoryColor);
|
|
} else {
|
|
$('#categoryList').children('button').removeClass('rackObjSelected');
|
|
$(this).addClass('rackObjSelected');
|
|
$('#inputCategoryID').val($(this).data('id'));
|
|
$('#inputCategoryCurrentID').val($(this).data('id'));
|
|
$('#inputCategoryName').val($(this).data('name'));
|
|
$('#color-picker').spectrum('set', $(this).data('color'));
|
|
if($(this).data('default') == 1) {
|
|
$('#inputCategoryDefault').prop({'checked':true,'disabled':true});
|
|
} else {
|
|
$('#inputCategoryDefault').prop({'checked':false,'disabled':false});
|
|
}
|
|
}
|
|
});
|
|
resetCategoryForm(defaultCategoryColor);
|
|
var successTxt = responseJSON.success;
|
|
var alertMsg = '';
|
|
alertMsg += '<div class="alert alert-success" role="alert">';
|
|
alertMsg += '<strong>Success!</strong> Category added.';
|
|
alertMsg += '</div>';
|
|
$('#alertMsgCategory').html(alertMsg);
|
|
} else {
|
|
// Update category select option
|
|
$('#categoryOption'+responseJSON.success.id).data('value', 'category'+responseJSON.success.name);
|
|
$('#categoryOption'+responseJSON.success.id).val(responseJSON.success.id);
|
|
$('#categoryOption'+responseJSON.success.id).html(responseJSON.success.name);
|
|
|
|
// Update category button
|
|
$('#categorList'+responseJSON.success.id).removeClass(function(index, className){
|
|
return (className.match (/(^|\s)category\S+/g) || []).join(' ');
|
|
});
|
|
$('#categoryList'+responseJSON.success.id).addClass('category'+responseJSON.success.name);
|
|
$('#categoryList'+responseJSON.success.id).data('name', responseJSON.success.name);
|
|
$('#categoryList'+responseJSON.success.id).data('color', responseJSON.success.color);
|
|
var defaultIdentifier = '';
|
|
if(responseJSON.success.defaultOption == 1) {
|
|
defaultIdentifier = '*';
|
|
}
|
|
$('#categoryList'+responseJSON.success.id).data('default', responseJSON.success.defaultOption);
|
|
$('#categoryList'+responseJSON.success.id).html(responseJSON.success.name+defaultIdentifier);
|
|
resetCategoryForm(defaultCategoryColor);
|
|
var alertMsg = '';
|
|
alertMsg += '<div class="alert alert-success" role="alert">';
|
|
alertMsg += '<strong>Success!</strong> Category updated.';
|
|
alertMsg += '</div>';
|
|
$('#alertMsgCategory').html(alertMsg);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
// Form submit
|
|
$('#objectEditor-Submit').on('click', function(){
|
|
// Gather user input
|
|
var data = {};
|
|
data['action'] = "add";
|
|
data['name'] = $('#inputName').val();
|
|
data['category'] = $('#inputCategory').val();
|
|
data['type'] = $('input[name="objectTypeRadio"]:checked').val();
|
|
data['function'] = $('input[name="objectFunction"]:checked').val();
|
|
data['RUSize'] = $('#inputRU').val();
|
|
data['frontImage'] = $('#inputFrontImage').val();
|
|
data['rearImage'] = $('#inputRearImage').val();
|
|
data['objects'] = [];
|
|
if(data['type'] == 'Insert'){
|
|
var encLayoutX = parseInt($('#previewObj3').data('valueX'), 10);
|
|
var encLayoutY = parseInt($('#previewObj3').data('valueY'), 10);
|
|
var objHUnits = parseInt($('#previewObj3').data('hUnits'), 10);
|
|
var objVUnits = parseInt($('#previewObj3').data('vUnits'), 10);
|
|
data['encLayoutX'] = encLayoutX;
|
|
data['encLayoutY'] = encLayoutY;
|
|
data['hUnits'] = objHUnits;
|
|
data['vUnits'] = objVUnits;
|
|
data['nestedInsertParentHUnits'] = parseInt($(document).data('nestedInsertParentHUnits'), 10);
|
|
data['nestedInsertParentVUnits'] = parseInt($(document).data('nestedInsertParentVUnits'), 10);
|
|
data['nestedInsertParentEncLayoutX'] = parseInt($(document).data('nestedInsertParentEncLayoutX'), 10);
|
|
data['nestedInsertParentEncLayoutY'] = parseInt($(document).data('nestedInsertParentEncLayoutY'), 10);
|
|
data['objects'].push(buildObjectArray('#previewObj3'));
|
|
} else {
|
|
data['mountConfig'] = $('input[name="sideCount"]:checked').val();
|
|
for (var x=0; x<=data['mountConfig']; x++) {
|
|
data['objects'].push(buildObjectArray('#previewObj'+x));
|
|
}
|
|
}
|
|
|
|
// Convert to JSON string so it can be posted
|
|
data = JSON.stringify(data);
|
|
|
|
// Post user input
|
|
$.post('backend/process_object-custom.php', {'data':data}, function(response){
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
location.reload();
|
|
}
|
|
});
|
|
});
|
|
|
|
// Category
|
|
$('#inputCategory').on('change', function(){
|
|
setCategory();
|
|
});
|
|
|
|
// Side Count Selector
|
|
$('.sideCount').on('change', function(){
|
|
switchSides(0);
|
|
var mountConfig = $(this).val();
|
|
handleMountConfig(mountConfig);
|
|
});
|
|
|
|
// Side Switcher
|
|
$('.sideSelector').on('change', function(){
|
|
var selectedSide = $(this).val();
|
|
switchSides(selectedSide);
|
|
setCategory();
|
|
setObjectSize();
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
});
|
|
|
|
// Detail Side Switcher
|
|
$('.sideSelectorDetail').on('change', function(){
|
|
switchSidesDetail($(this).val());
|
|
});
|
|
|
|
// RU Size
|
|
$('#inputRU').on('change', function(){
|
|
var variables = getVariables();
|
|
|
|
for(x=0; x<2; x++) {
|
|
var flexUnits = variables['RUSize'] * 2;
|
|
$('#previewObj'+x).data('vUnits', flexUnits);
|
|
$('#previewObj'+x).children('.flex-container-parent').data('vUnits', flexUnits);
|
|
}
|
|
|
|
expandRackUnit(variables['RUSize']);
|
|
setObjectSize();
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
handleOrientationInput();
|
|
});
|
|
|
|
// Object Type
|
|
$('input.objectType').on('change', function(){
|
|
var category = $('#inputCategory').find('option:selected').data('value');
|
|
$('inputFrontImage').val('');
|
|
$('inputRearImage').val('');
|
|
toggleObjectTypeDependencies();
|
|
|
|
switch($(this).val()) {
|
|
case 'Insert':
|
|
|
|
// Inserts cannot be 4-post mountable
|
|
$('.sideSelector').prop('disabled', true);
|
|
$('#inputSideCount2Post').prop('checked', true);
|
|
$('#sideSelectorFront').prop('checked', true);
|
|
switchSides(3);
|
|
|
|
// Variables must be retrieved after switchSides() because it updates the reference to the currently selected object
|
|
var variables = getVariables();
|
|
|
|
// Disable relevant input fields
|
|
$('#partitionH, #partitionV, #inputPartitionTypeGeneric, #inputPartitionTypeConnectable, #inputPartitionTypeEnclosure, #customPartitionAdd, #customPartitionRemove, #objectPartitionSize, #objectMediaType, #objectPortType, #objectPortOrientation, #objectPortLayout').prop('disabled', true);
|
|
|
|
// Clear the preview object of any user formatting
|
|
$('#previewObj0').html('Select enclosure from "Available Objects" section.');
|
|
$('#previewObj0').removeClass(function(index, css) {
|
|
return (css.match(/(^|\s)category\S+/g) || []).join(' ');
|
|
});
|
|
$('.enclosure').on('click', function(){
|
|
switchSides(0);
|
|
|
|
var enclosureParent = $(this).parent();
|
|
var enclosureObject = $(this).closest('.flex-container-parent');
|
|
var enclosureObjectParent = $(enclosureObject).parent();
|
|
var objectFlexDirection = $(enclosureObjectParent).css('flex-direction');
|
|
var objectFunction = $(enclosureObjectParent).data('templateFunction');
|
|
var objectType = $(enclosureObjectParent).data('templateType');
|
|
if(objectType == 'Insert') {
|
|
var nestedInsert = true;
|
|
var parentHUnits = parseInt($(enclosureObjectParent).data('parentHUnits'), 10);
|
|
var parentVUnits = parseInt($(enclosureObjectParent).data('parentVUnits'), 10);
|
|
var parentEncLayoutX = parseInt($(enclosureObjectParent).data('parentEncLayoutX'), 10);
|
|
var parentEncLayoutY = parseInt($(enclosureObjectParent).data('parentEncLayoutY'), 10);
|
|
} else {
|
|
var nestedInsert = false;
|
|
var parentHUnits = 0;
|
|
var parentVUnits = 0;
|
|
var parentEncLayoutX = 0;
|
|
var parentEncLayoutY = 0;
|
|
}
|
|
$(document).data('nestedInsertParentHUnits', parentHUnits);
|
|
$(document).data('nestedInsertParentVUnits', parentVUnits);
|
|
$(document).data('nestedInsertParentEncLayoutX', parentEncLayoutX);
|
|
$(document).data('nestedInsertParentEncLayoutY', parentEncLayoutY);
|
|
var hUnits = parseInt($(enclosureParent).data('hUnits'), 10);
|
|
var vUnits = parseInt($(enclosureParent).data('vUnits'), 10);
|
|
var encLayoutX = parseInt($(enclosureParent).data('valueX'), 10);
|
|
var encLayoutY = parseInt($(enclosureParent).data('valueY'), 10);
|
|
$('[name="objectFunction"][value='+objectFunction+']').prop('checked', true);
|
|
var RUSize = parseInt($(enclosureObjectParent).data('ruSize'), 10);
|
|
$('#inputRU').val(RUSize);
|
|
|
|
// Enable input fields
|
|
$('#partitionH, #partitionV, #inputPartitionTypeGeneric, #inputPartitionTypeConnectable, #objectType, #objectMediaType, #objectPortType, #objectPortOrientation, #objectPortLayout').prop('disabled', false);
|
|
buildInsertParent(RUSize, hUnits, vUnits, encLayoutX, encLayoutY, nestedInsert, parentHUnits, parentVUnits, parentEncLayoutX, parentEncLayoutY);
|
|
|
|
$(document).data('templateSide', 3);
|
|
|
|
buildObj(3, hUnits, vUnits, objectFlexDirection);
|
|
setCategory();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
});
|
|
break;
|
|
|
|
case 'Standard':
|
|
switchSides(0);
|
|
// Variables must be retrieved here... see above comment under 'Insert' case
|
|
var variables = getVariables();
|
|
$('#inputPartitionTypeGeneric, #inputPartitionTypeConnectable, #inputPartitionTypeEnclosure').prop('disabled', false);
|
|
for(x=0; x<2; x++) {
|
|
buildObj(x, 24, 2, 'column');
|
|
}
|
|
|
|
$(document).data('templateSide', 0);
|
|
expandRackUnit(variables['RUSize']);
|
|
setObjectSize();
|
|
setCategory();
|
|
handleOrientationInput();
|
|
|
|
// Remove the click hook from enclosure elements
|
|
// that were added when selecting 'insert' object type.
|
|
$('.enclosure').off('click');
|
|
break;
|
|
}
|
|
|
|
});
|
|
|
|
// Object Function
|
|
$('input.objectFunction').on('change', function(){
|
|
switch($(this).val()) {
|
|
case 'Endpoint':
|
|
// Re-enable mounting config
|
|
$('input.sideCount').prop('disabled', false);
|
|
break;
|
|
|
|
case 'Passive':
|
|
// Default mounting config, only Endpoints can be 4-post
|
|
$('.sideSelector').prop('disabled', true);
|
|
$('input.sideCount').prop('disabled', true);
|
|
$('#inputSideCount2Post').prop('checked', true);
|
|
$('#sideSelectorFront').prop('checked', true);
|
|
switchSides(0);
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
handleOrientationInput();
|
|
break;
|
|
}
|
|
// Display only relevant input
|
|
togglePartitionTypeDependencies();
|
|
});
|
|
|
|
// Partition Type
|
|
$('input.partitionType').on('change', function(){
|
|
var variables = getVariables();
|
|
var partitionType = $(this).val();
|
|
setDefaultData(variables['selectedObj']);
|
|
$(variables['selectedObj']).data('partitionType', partitionType);
|
|
$(variables['selectedObj']).empty();
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
|
|
// Connectable and Enclosure tables require flex-direction column
|
|
if(partitionType == 'Connectable' || partitionType == 'Enclosure') {
|
|
$(variables['selectedObj']).css('flex-direction', 'column');
|
|
} else {
|
|
var parentDirection = $(variables['selectedParent']).css('flex-direction');
|
|
if(parentDirection == 'column') {
|
|
var partitionDirection = 'row';
|
|
} else {
|
|
var partitionDirection = 'column';
|
|
}
|
|
$(variables['selectedObj']).css('flex-direction', partitionDirection).data('direction', partitionDirection);
|
|
}
|
|
|
|
handleOrientationInput();
|
|
|
|
if(partitionType == 'Connectable') {
|
|
buildPortTable();
|
|
updatePortNameDisplay();
|
|
} else if(partitionType == 'Enclosure') {
|
|
var x = $('#inputEnclosureLayoutX').val();
|
|
var y = $('#inputEnclosureLayoutY').val();
|
|
var table = buildTable(x, y, 'enclosureTable', true);
|
|
$(variables['selectedObj']).html(table);
|
|
}
|
|
});
|
|
|
|
// Prevent Modal if Invoker is Disabled
|
|
$('#portNameModal').on('hide.bs.modal', function (e) {
|
|
if($(document).data('portNameFormatAction') == 'edit') {
|
|
// Gather user input
|
|
var data = {
|
|
action: 'edit',
|
|
attribute: 'portNameFormat',
|
|
templateID: $('#selectedObjectID').val(),
|
|
templateFace: $('#selectedObjectFace').val(),
|
|
templateDepth: $('#selectedPartitionDepth').val(),
|
|
value: $(document).data('portNameFormatEdit')
|
|
};
|
|
|
|
// Convert to JSON string so it can be posted
|
|
data = JSON.stringify(data);
|
|
|
|
// Post for validation
|
|
$.post('backend/process_object-custom.php', {'data':data}, function(responseJSON){
|
|
var response = JSON.parse(responseJSON);
|
|
if (response.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(response.error).size() > 0){
|
|
//$('#alertMsgPortName')
|
|
displayError(response.error);
|
|
} else {
|
|
$('#detailPortRange').html('<a href="#">'+response.success+'</a>');
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
// Prevent Modal if Invoker is Disabled
|
|
$('#portNameModal').on('show.bs.modal', function (e) {
|
|
var invoker = $(e.relatedTarget);
|
|
if($(invoker).hasClass('no-modal')) {
|
|
return false;
|
|
}
|
|
});
|
|
|
|
// Focus First Port Name Field
|
|
$('#portNameModal').on('shown.bs.modal', function (e){
|
|
|
|
var invoker = $(e.relatedTarget);
|
|
$(document).data('portNameFormatAction', $(invoker).data('portNameAction'));
|
|
|
|
setPortNameInput();
|
|
updatePortNameDisplay();
|
|
setPortNameFieldFocus();
|
|
|
|
if(!$('.portNameFields:focus').length) {
|
|
$('.portNameFields').first().focus();
|
|
}
|
|
|
|
//handlePortNameOptions();
|
|
|
|
$('.portNameFields').on('keyup', function(){
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
});
|
|
|
|
// Port Naming Add Field
|
|
$('#buttonAddPortNameField').on('click', function(){
|
|
//var fieldFocused = $(document).data('focusedPortNameField');
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var nameFieldHTML = $('<div class="col-sm-2 no-padding"><em> </em><input type="text" class="portNameFields form-control" value="Port" data-type="static" data-count="0" data-order="0"></div>');
|
|
nameFieldHTML.insertAfter(focusedPortNameField.parent());
|
|
setPortNameFieldFocus();
|
|
handlePortNameOptions();
|
|
nameFieldHTML.children('input').focus();
|
|
handlePortNameFieldAddRemoveButtons();
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
|
|
$('.portNameFields').off('keyup');
|
|
$('.portNameFields').on('keyup', function(){
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
});
|
|
|
|
// Port Naming Remove Field
|
|
$('#buttonDeletePortNameField').on('click', function(){
|
|
//var fieldFocused = $(document).data('focusedPortNameField');
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var portNameFields = $('.portNameFields');
|
|
var fieldFocusedIndex = $(portNameFields).index(focusedPortNameField);
|
|
|
|
$(focusedPortNameField).parent().remove();
|
|
resetIncrementals();
|
|
$(portNameFields).eq(fieldFocusedIndex-1).focus();
|
|
handlePortNameFieldAddRemoveButtons();
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
|
|
// Port Naming Type Selection
|
|
$('#selectPortNameFieldType').on('change', function(){
|
|
//var focusedPortNameField = $(document).data('focusedPortNameField');
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var valuePortNameType = $(this).val();
|
|
|
|
focusedPortNameField.data('type', valuePortNameType);
|
|
$(focusedPortNameField).attr('data-type', valuePortNameType);
|
|
|
|
if(valuePortNameType == 'static') {
|
|
$(focusedPortNameField).data('order', 0);
|
|
$(focusedPortNameField).val('Port');
|
|
} else if(valuePortNameType == 'incremental') {
|
|
$(focusedPortNameField).val('1');
|
|
} else if(valuePortNameType == 'series') {
|
|
$(focusedPortNameField).val('a,b,c');
|
|
}
|
|
resetIncrementals();
|
|
handlePortNameOptions();
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
|
|
// Port Naming Count
|
|
$('#inputPortNameFieldCount').on('change', function(){
|
|
//var focusedPortNameField = $(document).data('focusedPortNameField');
|
|
var focusedPortNameField = $('#portNameFieldContainer').find('.input-focused');
|
|
var valueCount = $(this).val();
|
|
focusedPortNameField.data('count', valueCount);
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
|
|
// Port Naming Order
|
|
$('#selectPortNameFieldOrder').on('change', function(){
|
|
var valueOrder = parseInt($(this).val());
|
|
reorderIncrementals(valueOrder);
|
|
updateportNameFormat();
|
|
updatePortNameDisplay();
|
|
});
|
|
|
|
// Port Naming Results Update
|
|
$('#buttonPortNameModalUpdate').on('click', function(){
|
|
var portTotal = 10;
|
|
|
|
var portStringArray = [];
|
|
var allElements = $('.portNameFields');
|
|
var incrementalElements = $('.portNameFields[data-type="incremental"], .portNameFields[data-type="series"]');
|
|
var incrementalCount = $(incrementalElements).length;
|
|
var incrementalArray = {};
|
|
$(incrementalElements).each(function(){
|
|
var elementType = $(this).data('type');
|
|
var elementValue = $(this).val();
|
|
if(elementType == 'incremental') {
|
|
var elementCount = parseInt($(this).data('count'));
|
|
if(elementCount == 0) {
|
|
elementCount = portTotal;
|
|
}
|
|
} else if(elementType == 'series') {
|
|
elementValue = elementValue.split(',');
|
|
var elementCount = elementValue.length;
|
|
}
|
|
var elementOrder = parseInt($(this).data('order'));
|
|
var elementNumerator = 0;
|
|
incrementalArray[elementOrder] = {
|
|
type: elementType,
|
|
value: elementValue,
|
|
count: elementCount,
|
|
order: elementOrder,
|
|
numerator: elementNumerator
|
|
};
|
|
});
|
|
|
|
$.each(incrementalArray, function(index, item){
|
|
if(item.order == incrementalCount) {
|
|
item.numerator = 1;
|
|
} else {
|
|
var y = item.order+1;
|
|
for(var x = y; x <= incrementalCount; x++) {
|
|
item.numerator += incrementalArray[x].count;
|
|
}
|
|
}
|
|
});
|
|
|
|
for(var x=0; x<portTotal; x++) {
|
|
var portString = '';
|
|
$(allElements).each(function(){
|
|
var dataType = $(this).data('type');
|
|
if(dataType == 'static') {
|
|
portString = portString + $(this).val();
|
|
} else if(dataType == 'incremental' || dataType == 'series') {
|
|
var incrementalOrder = parseInt($(this).data('order'));
|
|
var incremental = incrementalArray[incrementalOrder];
|
|
var howMuchToIncrement = Math.floor(x/incremental.numerator);
|
|
|
|
if(howMuchToIncrement >= incremental.count) {
|
|
var rollOver = Math.floor(howMuchToIncrement / incremental.count);
|
|
howMuchToIncrement = howMuchToIncrement - (rollOver*incremental.count);
|
|
}
|
|
if(dataType == 'incremental') {
|
|
portString = portString + (parseInt(incremental.value) + howMuchToIncrement);
|
|
} else if(dataType == 'series') {
|
|
portString = portString + incremental.value[howMuchToIncrement];
|
|
}
|
|
}
|
|
});
|
|
portStringArray.push(portString);
|
|
}
|
|
$('#portNameResults').empty();
|
|
$.each(portStringArray, function(index, item){
|
|
$('#portNameResults').append(item+'<br>');
|
|
});
|
|
$('#portNameResults').append('...');
|
|
});
|
|
|
|
// Custom Partition Orientation
|
|
$('.partitionAxis').on('change', function(){
|
|
handlePartitionAddRemove();
|
|
});
|
|
|
|
// Custom Partition Add
|
|
$('#customPartitionAdd').on('click', function(){
|
|
var variables = getVariables();
|
|
|
|
setDefaultData(variables['selectedObj']);
|
|
addPartition();
|
|
handleOrientationInput();
|
|
|
|
// If the added partition affects obj RUSize,
|
|
// reset the RUSize minimum.
|
|
var isParent = $(variables['selectedObj']).hasClass('flex-container-parent');
|
|
var isParentChild = $(variables['selectedObj']).parent().hasClass('flex-container-parent');
|
|
var isHorizontal = $(variables['selectedObj']).css('flex-direction') == 'column' ? true : false;
|
|
|
|
if((isParent || isParentChild) && isHorizontal){
|
|
resetRUSize();
|
|
}
|
|
});
|
|
|
|
// Custom Partition Remove
|
|
$('[id^=customPartitionRemove]').on('click', function(){
|
|
var variables = getVariables();
|
|
var partitionDepth = $(variables['selectedObj']).parentsUntil('.flex-container-parent').length;
|
|
var isHorizontal = $(variables['selectedObj']).css('flex-direction') == 'row' ? true : false;
|
|
|
|
// Check to see if the object being deleted is the only one.
|
|
if($(variables['selectedParent']).children().length > 1){
|
|
// Select the preceding object
|
|
var selectedObjIndex = $(variables['selectedObj']).index();
|
|
$(variables['selectedParent']).children().eq(selectedObjIndex-1).addClass('rackObjSelected');
|
|
} else {
|
|
$(variables['selectedParent']).addClass('rackObjSelected');
|
|
$('.dependantField.connectable').prop('disabled', false);
|
|
}
|
|
$(variables['selectedObj']).remove();
|
|
|
|
if(partitionDepth < 2 && isHorizontal){
|
|
resetRUSize();
|
|
}
|
|
|
|
setPartitionSizeInput();
|
|
setInputValues();
|
|
togglePartitionTypeDependencies();
|
|
handleOrientationInput();
|
|
});
|
|
|
|
// Custom Partition Size
|
|
$('#inputCustomPartitionSize').on('change', function(){
|
|
var variables = getVariables();
|
|
resizePartition($(this).val());
|
|
var isParentChild = $(variables['selectedObj']).parent().hasClass('flex-container-parent');
|
|
var isParentChildNested = $(variables['selectedObj']).parent().parent().hasClass('flex-container-parent');
|
|
var isHorizontal = $(variables['selectedObj']).css('flex-direction') == 'row' ? true : false;
|
|
if((isParentChild || isParentChildNested) && isHorizontal){
|
|
resetRUSize();
|
|
}
|
|
});
|
|
|
|
// Enclosure Layout
|
|
$('[id^=inputEnclosureLayout]').on('change', function(){
|
|
var variables = getVariables();
|
|
var x = $('#inputEnclosureLayoutX').val();
|
|
var y = $('#inputEnclosureLayoutY').val();
|
|
var table = buildTable(x, y, 'enclosureTable', true);
|
|
$(variables['selectedObj']).html(table);
|
|
|
|
$(variables['selectedObj']).data('valueX', x);
|
|
$(variables['selectedObj']).data('valueY', y);
|
|
|
|
//Apply the selected category to the active object
|
|
$(".activeObj").addClass($('#inputCategory').find('option:selected').data('value'));
|
|
});
|
|
|
|
// Enclosure Strict Insert Fitment
|
|
$('[id^=inputEnclosureTolerance]').on('change', function(){
|
|
var enclosureTolerance = $(this).val();
|
|
var variables = getVariables();
|
|
$(variables['selectedObj']).data('encTolerance', enclosureTolerance);
|
|
});
|
|
|
|
// Port Layout
|
|
$('[id^=inputPortLayout]').on('change', function(){
|
|
var variables = getVariables();
|
|
var x = $('#inputPortLayoutX').val();
|
|
var y = $('#inputPortLayoutY').val();
|
|
$(variables['selectedObj']).data('valueX', x);
|
|
$(variables['selectedObj']).data('valueY', y);
|
|
buildPortTable();
|
|
updatePortNameDisplay();
|
|
});
|
|
|
|
// Set port orientation
|
|
$('input.objectPortOrientation').on('change', function(){
|
|
var variables = getVariables();
|
|
$(variables['selectedObj']).data('portOrientation', $(this).val());
|
|
});
|
|
|
|
// Set port type
|
|
$('#inputPortType').on('change', function(){
|
|
var variables = getVariables();
|
|
$(variables['selectedObj']).data('portType', $(this).val());
|
|
buildPortTable();
|
|
});
|
|
|
|
// Set media type
|
|
$('#inputMediaType').on('change', function(){
|
|
var variables = getVariables();
|
|
$(variables['selectedObj']).data('mediaType', $(this).val());
|
|
});
|
|
|
|
// Prevent modal if disabled
|
|
$('#modalTemplateDeleteConfirm').on('show.bs.modal', function (e){
|
|
var button = e.relatedTarget;
|
|
if($(button).hasClass('disabled')) {
|
|
return false;
|
|
}
|
|
});
|
|
|
|
// Set template name in delete confirm modal
|
|
$('#modalTemplateDeleteConfirm').on('shown.bs.modal', function (e){
|
|
|
|
var templateCombined = $(document).data('selectedTemplateCombined');
|
|
|
|
if(templateCombined == 'yes') {
|
|
var templateName = $(document).data('selectedTemplateCombinedName');
|
|
} else {
|
|
var templateName = $(document).data('selectedTemplateName');
|
|
}
|
|
|
|
var templateCategoryName = $(document).data('selectedTemplateCategoryName');
|
|
$('#deleteTemplateName').html(templateName + ' (' + templateCategoryName + ')');
|
|
});
|
|
|
|
// Prevent modal if disabled
|
|
$('#modalTemplateWhereUsed').on('show.bs.modal', function (e){
|
|
var button = e.relatedTarget;
|
|
if($(button).hasClass('disabled')) {
|
|
return false;
|
|
}
|
|
});
|
|
|
|
// Find where template is used
|
|
$('#modalTemplateWhereUsed').on('shown.bs.modal', function (e){
|
|
var templateID = $(document).data('selectedTemplateID');
|
|
var templateName = $(document).data('selectedTemplateName');
|
|
var templateCategoryName = $(document).data('selectedTemplateCategoryName');
|
|
$('#whereUsedTemplateName').html(templateName + ' (' + templateCategoryName + ')');
|
|
|
|
//Collect template data
|
|
var data = {
|
|
templateID: templateID
|
|
};
|
|
data = JSON.stringify(data);
|
|
|
|
//Retrieve object details
|
|
$.post("backend/retrieve_where_used.php", {data:data}, function(response){
|
|
var responseJSON = JSON.parse(response);
|
|
if (responseJSON.active == 'inactive'){
|
|
window.location.replace("/");
|
|
} else if ($(responseJSON.error).size() > 0){
|
|
displayError(responseJSON.error);
|
|
} else {
|
|
var response = responseJSON.success;
|
|
$('#whereUsedResults').html(response);
|
|
}
|
|
});
|
|
});
|
|
|
|
// Select template requested by app
|
|
if($('#templateID').length) {
|
|
var templateID = $('#templateID').val();
|
|
// Dropdown template category
|
|
$('#availableContainer0').find('[data-template-id='+templateID+']').closest('.categoryContainerEntire').children('.categoryTitle').click();
|
|
// Select template
|
|
$('#availableContainer0').find('[data-template-id='+templateID+']').children(':first').click();
|
|
$('#templateID').remove();
|
|
}
|
|
|
|
});
|