678 lines
28 KiB
JavaScript
678 lines
28 KiB
JavaScript
/**
|
|
* Copyright 2014 Openstack Foundation
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
**/
|
|
(function( $ ){
|
|
|
|
var form = null;
|
|
var table_regions = null;
|
|
var table_az = null;
|
|
var form_validator = null;
|
|
var locations = [];
|
|
|
|
var methods = {
|
|
init : function(options){
|
|
form = $(this);
|
|
//regions
|
|
|
|
table_regions = $('#datacenter-regions-table',form);
|
|
table_az = $('#az-table',form);
|
|
|
|
$('#add-datacenter-location-country',form)
|
|
.addClass('add-location-control')
|
|
.addClass('location-country');
|
|
|
|
$('#add-datacenter-location-country',form).chosen({disable_search_threshold: 3});
|
|
|
|
$('#add-datacenter-location-region',form).chosen({disable_search_threshold: 3});
|
|
|
|
$('#add_region_color',form).ColorPicker({
|
|
onSubmit: function(hsb, hex, rgb, el) {
|
|
$(el).val(hex);
|
|
$(el).css('backgroundColor', '#' + hex);
|
|
$(el).ColorPickerHide();
|
|
},
|
|
onBeforeShow: function () {
|
|
$(this).ColorPickerSetColor(this.value);
|
|
},
|
|
onChange: function (hsb, hex, rgb) {
|
|
var input = $(this).data('colorpicker').el;
|
|
$(input).val(hex);
|
|
$(input).css('backgroundColor', '#' + hex);
|
|
}
|
|
}).bind('keyup', function(){
|
|
$(this).ColorPickerSetColor(this.value);
|
|
});
|
|
|
|
$.validator.addMethod("validate_duplicate_location", function (value, element, arg) {
|
|
var locations = $('.data-center-location','#data-center-locations-container');
|
|
var location_info_container = arg[0];
|
|
var city = $('.location-city',location_info_container).val();
|
|
var state = $('.location-state',location_info_container).val();
|
|
var country = $('.location-country',location_info_container).val();
|
|
var region = $('.location-region',location_info_container).val();
|
|
var location_slug = convertToSlug(city)+'-'+convertToSlug(state)+'-'+convertToSlug(country)+'-'+convertToSlug(region);
|
|
for(var i=0;i<locations.length;i++){
|
|
if($(locations[i]).attr('id') === location_slug
|
|
&& $(element).attr('id') != $('.location-city',locations[i]).attr('id'))
|
|
return false;
|
|
}
|
|
return true;
|
|
|
|
}, "Location is already defined!");
|
|
|
|
form_validator = form.validate({
|
|
rules: {
|
|
'add_region_name' : {
|
|
required:true,
|
|
ValidPlainText:true,
|
|
maxlength: 125,
|
|
validate_duplicate_field:[table_regions,'.region-name']
|
|
},
|
|
'add_region_endpoint': {
|
|
complete_url:true,
|
|
maxlength: 512
|
|
},
|
|
'add_region_color': {
|
|
required:true,
|
|
maxlength: 6,
|
|
color: true
|
|
},
|
|
'add-datacenter-location-city':{
|
|
required:true,
|
|
maxlength: 125,
|
|
ValidPlainText:true,
|
|
validate_duplicate_location:[$('.location-info-container',form)]
|
|
},
|
|
'add-datacenter-location-state':{
|
|
maxlength: 50,
|
|
ValidPlainText:true
|
|
},
|
|
'add-datacenter-location-country':{
|
|
required:true
|
|
},
|
|
'add-datacenter-location-region':{
|
|
required:true
|
|
},
|
|
'add-datacenter-location-zone-name':{
|
|
required:true,
|
|
maxlength: 125,
|
|
validate_duplicate_field:[table_az,'.zone-name']
|
|
}
|
|
},
|
|
messages: {
|
|
},
|
|
onfocusout: false,
|
|
focusCleanup: true,
|
|
focusInvalid: false,
|
|
invalidHandler: function(form, validator) {
|
|
if (!validator.numberOfInvalids())
|
|
return;
|
|
var element = $(validator.errorList[0].element);
|
|
if(!element.is(":visible")){
|
|
element = element.parent();
|
|
}
|
|
|
|
$('html, body').animate({
|
|
scrollTop: element.offset().top
|
|
}, 2000);
|
|
},
|
|
errorPlacement: function(error, element) {
|
|
if(!element.is(":visible")){
|
|
element = element.parent();
|
|
}
|
|
error.insertAfter(element);
|
|
}
|
|
});
|
|
|
|
$('.region-name').live('focusout', function (event) {
|
|
var former_value = $(this).data('original-value');
|
|
var current_value = $(this).val();
|
|
repopulateRegions({
|
|
former_value : former_value,
|
|
current_value: current_value
|
|
});
|
|
$(this).data('original-value',current_value)
|
|
});
|
|
|
|
$('#add-new-datacenter-region',form).click(function(event){
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
|
|
form_validator.settings.ignore = ".add-location-control";
|
|
var is_valid = form.valid();
|
|
//re add rules
|
|
form_validator.settings.ignore = [];
|
|
if(!is_valid){
|
|
return false;
|
|
}
|
|
|
|
var input_name = $('#add_region_name',table_regions);
|
|
var input_color = $('#add_region_color',table_regions);
|
|
var input_endpoint = $('#add_region_endpoint',table_regions);
|
|
var region = {
|
|
name : input_name.val(),
|
|
color : input_color.val(),
|
|
endpoint: input_endpoint.val()
|
|
};
|
|
input_name.val('');
|
|
input_endpoint.val('');
|
|
input_color.val('');
|
|
input_color.css('backgroundColor', '#FFFFFF');
|
|
addDataCenterRegion(region);
|
|
repopulateRegions();
|
|
return false;
|
|
});
|
|
|
|
$('.remove-additional-region',table_regions).live('click',function(event){
|
|
var remove_btn = $(this);
|
|
var tr = remove_btn.parent().parent();
|
|
tr.remove();
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
repopulateRegions();
|
|
return false;
|
|
});
|
|
|
|
//locations
|
|
$('#add-datacenter-location',form).click(function(event){
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
form_validator.resetForm();
|
|
form_validator.settings.ignore = ".add-region-control,.add-az-control";
|
|
var is_valid = form.valid();
|
|
//re add rules
|
|
form_validator.settings.ignore = [];
|
|
|
|
if(!is_valid){
|
|
return false;
|
|
}
|
|
|
|
var input_city = $('#add-datacenter-location-city',form);
|
|
var input_state = $('#add-datacenter-location-state',form);
|
|
var input_country = $('#add-datacenter-location-country',form);
|
|
var input_region = $('#add-datacenter-location-region',form);
|
|
|
|
var location = {
|
|
city : input_city.val(),
|
|
state : input_state.val(),
|
|
country : input_country.val(),
|
|
region : input_region.val(),
|
|
availability_zones : []
|
|
};
|
|
|
|
$("#az-table tbody tr:not(.add-az-row)",form).each(function(){
|
|
var tr = $(this);
|
|
var az = {};
|
|
az.name = $('.zone-name',tr).val();
|
|
location.availability_zones.push(az);
|
|
});
|
|
|
|
addDataCenterLocation(location);
|
|
input_city.val('');
|
|
input_state.val('');
|
|
$('option:selected',input_country).removeAttr("selected");
|
|
$('option:selected',input_region).removeAttr("selected");
|
|
input_country.trigger("chosen:updated");
|
|
input_region.trigger("chosen:updated");
|
|
$("#az-table tbody tr:not(.add-az-row)",form).remove();
|
|
return false;
|
|
});
|
|
|
|
|
|
$('.remove-data-center','#data-center-locations-container').live('click',function(event){
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
var data_center_slug = $(this).attr('data-slug');
|
|
$('#'+data_center_slug,form).remove();
|
|
return false;
|
|
});
|
|
//az
|
|
|
|
$('#add-az',table_az).click(function(event){
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
form_validator.settings.ignore = ".add-region-control,.location-control";
|
|
var is_valid = form.valid();
|
|
//re add rules
|
|
form_validator.settings.ignore = [];
|
|
if(!is_valid){
|
|
return false;
|
|
}
|
|
var input_az_name = $('#add-datacenter-location-zone-name',table_az);
|
|
var az = {name:input_az_name.val()};
|
|
addAZRow(az,table_az);
|
|
input_az_name.val('');
|
|
return false;
|
|
});
|
|
|
|
$('.remove-az',form).live('click',function(event){
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
var remove_btn = $(this);
|
|
var tr = remove_btn.parent().parent();
|
|
tr.remove();
|
|
return false;
|
|
});
|
|
|
|
$('.add-az',form).live('click',function(event){
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
var location_slug = $(this).attr('data-slug');
|
|
var container = $('#'+location_slug,'#data-center-locations-container');
|
|
var row = $(this).parent().parent();
|
|
var name = $('#add-az-name-'+location_slug,row);
|
|
var valid = name.valid()
|
|
if(valid) {
|
|
var az = { name: name.val() };
|
|
addAZRow(az, $('.az-table',container));
|
|
name.val('');
|
|
}
|
|
return false;
|
|
});
|
|
},
|
|
serialize: function(){
|
|
//remove validator for add controls
|
|
form_validator.settings.ignore = ".add-control";
|
|
var is_valid = form.valid();
|
|
//re add rules
|
|
form_validator.settings.ignore = [];
|
|
if(!is_valid){
|
|
return false;
|
|
}
|
|
form_validator.resetForm();
|
|
var res = {
|
|
regions:[],
|
|
locations:[]
|
|
};
|
|
//regions
|
|
var rows = $("tbody > tr",table_regions);
|
|
for(var i=0;i<rows.length-1;i++){
|
|
var region = {
|
|
name : $('input.region-name',rows[i]).val().trim(),
|
|
endpoint : $('input.region-endpoint',rows[i]).val().trim(),
|
|
color : $('input.region-color',rows[i]).val().trim()
|
|
}
|
|
region.id = convertToSlug(region.name);
|
|
res.regions.push(region);
|
|
}
|
|
//locations
|
|
$('.data-center-location',form).each(function(){
|
|
var container = $(this);
|
|
var location = {
|
|
city : $('.location-city',container).val().trim(),
|
|
state : $('.location-state',container).val().trim(),
|
|
country : $('.location-country',container).val().trim(),
|
|
region : $('.location-region',container).val().trim(),
|
|
availability_zones : []
|
|
};
|
|
|
|
$("tr.new-zone:not(.add-az-row)",container).each(function(){
|
|
location.availability_zones.push({ name : $('input.new-zone-name', $(this)).val() });
|
|
});
|
|
res.locations.push(location);
|
|
});
|
|
|
|
return res;
|
|
},
|
|
load:function(data){
|
|
for(var i in data.regions){
|
|
addDataCenterRegion(data.regions[i]);
|
|
}
|
|
repopulateRegions();
|
|
for(var i in data.locations){
|
|
addDataCenterLocation(data.locations[i]);
|
|
}
|
|
}
|
|
};
|
|
|
|
$.fn.datacenter_locations = function(methodOrOptions) {
|
|
if ( methods[methodOrOptions] ) {
|
|
return methods[ methodOrOptions ].apply( this, Array.prototype.slice.call( arguments, 1 ));
|
|
} else if ( typeof methodOrOptions === 'object' || ! methodOrOptions ) {
|
|
// Default to "init"
|
|
return methods.init.apply( this, arguments );
|
|
} else {
|
|
$.error( 'Method ' + method + ' does not exist on jQuery.datacenter_locations' );
|
|
}
|
|
};
|
|
|
|
//helpers
|
|
|
|
function repopulateRegions(event){
|
|
|
|
var regions = getCurrentRegions();
|
|
|
|
$('.add-datacenter-location-region,.location-region',form).each(function(){
|
|
var dll_region = $(this);
|
|
var current_region = dll_region.val();
|
|
|
|
dll_region.html('');
|
|
dll_region.append($('<option>', {
|
|
value: '',
|
|
text : '--select region--'
|
|
}));
|
|
|
|
for(var i in regions){
|
|
dll_region.append($('<option>', {
|
|
value: regions[i].id,
|
|
text : regions[i].name
|
|
}));
|
|
}
|
|
|
|
if(typeof(event)!=='undefined'){
|
|
var former_value = convertToSlug(event.former_value);
|
|
var current_value = convertToSlug(event.current_value);
|
|
if(current_region === former_value)
|
|
current_region = current_value;
|
|
}
|
|
if(current_region != '')
|
|
dll_region.find("option[value="+current_region+"]").attr("selected","selected");
|
|
dll_region.trigger("chosen:updated");
|
|
});
|
|
}
|
|
|
|
function getCurrentRegions(){
|
|
var regions = [];
|
|
var rows = $("tbody > tr:not(.add-additional-datacenter-region)",table_regions);
|
|
for(var i=0;i<rows.length;i++){
|
|
var row = rows[i];
|
|
var region = {
|
|
name: $('.region-name',row).val(),
|
|
endpoint: $('.region-endpoint',row).val()
|
|
};
|
|
region.id = convertToSlug(region.name);
|
|
regions.push(region);
|
|
}
|
|
return regions;
|
|
}
|
|
|
|
function addDataCenterRegion(region){
|
|
|
|
var rows_number = $("tbody > tr",table_regions).length;
|
|
var slug = convertToSlug(region.name);
|
|
|
|
var row_template = $('<tr class="datacenter-region">'+
|
|
'<td style="border: 1px solid #ccc;width:50%;background:#fff;">'+
|
|
'<input type="text" style="width:300px;" class="text autocompleteoff region-name">'+
|
|
'</td>'+
|
|
'<td style="border: 1px solid #ccc;width:25%;background:#fff;">'+
|
|
'<input type="text" class="text autocompleteoff region-color" value="" style="width:50px;" maxlength="6">'+
|
|
'</td>'+
|
|
'<td style="border: 1px solid #ccc;width:50%;background:#fff;">'+
|
|
'<input type="text" style="width:300px;" class="text autocompleteoff region-endpoint">'+
|
|
'</td>'+
|
|
'<td style="border: 1px solid #ccc;background:#eaeaea;width:10%;color:#cc0000;">'+
|
|
'<a href="#" class="remove-additional-region">x Remove</a>'+
|
|
'</td>'+
|
|
'</tr>');
|
|
|
|
var directives = {
|
|
'.region-name@value':'name',
|
|
'.region-name@id':function(arg){ return slug;},
|
|
'.region-name@name':function(arg){ return slug;},
|
|
'input.region-endpoint@value':'endpoint',
|
|
'input.region-endpoint@id' : function(arg){ return 'region_endpoint_'+(rows_number);},
|
|
'input.region-endpoint@name' : function(arg){ return 'region_endpoint_'+(rows_number);},
|
|
'input.region-color@value':'color',
|
|
'input.region-color@id' : function(arg){ return 'region_color'+(rows_number);},
|
|
'input.region-color@name' : function(arg){ return 'region_color_'+(rows_number);}
|
|
};
|
|
var html = row_template.render(region, directives);
|
|
html.attr('id',slug);
|
|
|
|
$(".add-additional-datacenter-region",table_regions).before(html);
|
|
|
|
$('.region-color',html).ColorPicker({
|
|
onSubmit: function(hsb, hex, rgb, el) {
|
|
$(el).val(hex);
|
|
$(el).css('backgroundColor', '#' + hex);
|
|
$(el).ColorPickerHide();
|
|
},
|
|
onBeforeShow: function () {
|
|
$(this).ColorPickerSetColor(this.value);
|
|
},
|
|
onChange: function (hsb, hex, rgb) {
|
|
var input = $(this).data('colorpicker').el;
|
|
$(input).val(hex);
|
|
$(input).css('backgroundColor', '#' + hex);
|
|
}
|
|
}).bind('keyup', function(){
|
|
$(this).ColorPickerSetColor(this.value);
|
|
});
|
|
|
|
$('.region-name',html).data('original-value',$('.region-name',html).val());
|
|
|
|
$('.region-name',html).rules('add',{
|
|
required:true,
|
|
ValidPlainText:true,
|
|
maxlength: 125,
|
|
validate_duplicate_field:[table_regions,'.region-name']
|
|
});
|
|
|
|
$('.region-endpoint',html).rules('add',{
|
|
complete_url:true,
|
|
maxlength: 512
|
|
});
|
|
|
|
$('.region-color',html).rules('add',{
|
|
required:true,
|
|
maxlength: 6,
|
|
color: true
|
|
});
|
|
|
|
$('.region-color',html).css('backgroundColor', '#' + region.color);
|
|
}
|
|
|
|
function addAZRow(az,az_table){
|
|
var rows_number = $("tbody > tr",az_table).length;
|
|
var slug = convertToSlug(az.name);
|
|
var row_template = $(
|
|
'<tr class="data-center-location-az new-zone">'+
|
|
'<td style="border: 1px solid #ccc;width:45%;">'+
|
|
'<input type="text" style="width:90%;" value="" maxlength="125" class="zone-name text new-zone-name">'+
|
|
'</td>'+
|
|
'<td style="border: 1px solid #ccc;;width:10%;color:#cc0000;">'+
|
|
'<a href="#" class="remove-az">x Remove</a>'+
|
|
'</td>'+
|
|
'</tr>');
|
|
|
|
var row = row_template.render(az, directives);
|
|
var directives = {
|
|
'input.zone-name@value':'name',
|
|
'input.zone-name@id' : function(arg){ return 'az_name'+(rows_number)+slug;},
|
|
'input.zone-name@name' : function(arg){ return 'region_name_'+(rows_number)+slug;}
|
|
};
|
|
var row = row_template.render(az, directives);
|
|
//insert new row
|
|
$(".add-az-row",az_table).before(row);
|
|
}
|
|
|
|
function addDataCenterLocation(location){
|
|
var location_slug = convertToSlug(location.city)+'-'+convertToSlug(location.state)+'-'+convertToSlug(location.country)+'-'+convertToSlug(location.region);
|
|
var location_template = $('<div id="'+location_slug+'" class="data-center-location" style="padding-top:15px;padding-bottom:15px;">' +
|
|
'<div class="location-info-container" style="padding-top:40px;display:inline;width:80%;margin-bottom:30px;">'+
|
|
'<div style="float:left;display:inline;width:15%;">'+
|
|
'<label class="left">City:</label>'+
|
|
'<input type="text" class="text autocompleteoff location-control location-city" style="width:80%;" maxlength="125">'+
|
|
'</div>'+
|
|
'<div style="float:left;display:inline;width:15%;">'+
|
|
'<label class="left">State:</label>'+
|
|
'<input type="text" class="text autocompleteoff location-control location-state"style="width:80%;" maxlength="125">'+
|
|
'</div>'+
|
|
'<div style="float:left;display:inline;padding-left:10px;">'+
|
|
'<label class="left">Country:</label><br>'+
|
|
'<div style="display:inline-block;max-width:200px;" class="location-country-container">'+
|
|
'</div>'+
|
|
'</div>'+
|
|
'<div style="float:left;display:inline;padding-left:10px;">'+
|
|
'<label class="left">Region Name:</label><br>'+
|
|
'<div style="display:inline-block;max-width:200px;" class="location-region-container">'+
|
|
'</div>'+
|
|
'</div>'+
|
|
'<div style="float:left;width:20%;">'+
|
|
'<a href="#" class="roundedButton addDeploymentBtn remove-data-center" style="overflow:hidden;white-space: nowrap;font-weight:normal;float:right;display:inline;">Remove Data Center</a>'+
|
|
'</div>'+
|
|
'</div>'+
|
|
'<div style="border: 1px solid #ccc; border-collapse:collapse;clear:both;width:70%;padding-left:30px;padding-top:10px;padding-bottom:10px;">'+
|
|
'<strong>Zones covered by your Data Center</strong>'+
|
|
'Please tell us which zones your data center services:<br>'+
|
|
'<table style="border: 1px solid #ccc; border-collapse:collapse;clear:both;width:90%;margin:0;padding:0;" class="az-table">'+
|
|
'<thead>'+
|
|
'<tr>'+
|
|
'<th style="border: 1px solid #ccc;background:#eaeaea;width:10%;">Zone Name</th>'+
|
|
'<th style="border: 1px solid #ccc;background:#eaeaea;width:10%;">Add/Remove</th>'+
|
|
'</tr>'+
|
|
'</thead>'+
|
|
'<tbody>'+
|
|
'<tr class="new-zone">'+
|
|
'<td style="border: 1px solid #ccc;width:45%;">'+
|
|
'<input type="text" class="new-zone-name location-control zone-name" maxlength="125" value="" style="width:90%;">'+
|
|
'</td>'+
|
|
'<td style="border: 1px solid #ccc;;width:10%;color:#cc0000;">'+
|
|
'<a href="#" class="remove-az">- Remove</a>'+
|
|
'</td>'+
|
|
'</tr>'+
|
|
'<tr class="add-az-row">'+
|
|
'<td style="border: 1px solid #ccc;width:45%;">'+
|
|
'<input type="text" class="zone-name text add-control location-control add-location-control add-az-control" maxlength="125" value="" style="width:90%;">'+
|
|
'</td>'+
|
|
'<td style="border: 1px solid #ccc;;width:10%;color:#cc0000;">'+
|
|
'<a href="#" class="add-az">+ Add</a>'+
|
|
'</td>'+
|
|
'</tr>'+
|
|
'</tbody>'+
|
|
'</table>'+
|
|
'</div>'+
|
|
'</div>');
|
|
|
|
var directives = {
|
|
'input.location-city@value' :'city',
|
|
'input.location-city@id' : function(arg){
|
|
return 'location_city_'+location_slug;
|
|
},
|
|
'input.location-city@name' : function(arg){
|
|
return 'location_city_'+location_slug;
|
|
},
|
|
'input.location-state@value' :'state',
|
|
'input.location-state@id' : function(arg){
|
|
return 'location_state_'+location_slug;
|
|
},
|
|
'input.location-state@name' : function(arg){
|
|
return 'location_state_'+location_slug;
|
|
},
|
|
'.remove-data-center@data-slug':function(arg){
|
|
return location_slug;
|
|
},
|
|
'div.location-country-container':function(arg){
|
|
var select_name='location_country_'+location_slug;
|
|
var select = $('#add-datacenter-location-country',form).clone();
|
|
select.removeClass()
|
|
.attr('id',select_name)
|
|
.attr('name',select_name)
|
|
.attr('style','')
|
|
.addClass('convert-to-chosen')
|
|
.addClass('location-country')
|
|
.addClass('add-location-control')
|
|
.addClass('location-comtrol')
|
|
.css('width','100%');
|
|
|
|
var option_val = arg.context.country;
|
|
select.find("option[value="+option_val+"]").attr("selected","selected");
|
|
return select[0].outerHTML;
|
|
},
|
|
'div.location-region-container':function(arg){
|
|
var select_name='location_region_'+location_slug;
|
|
var select = $('#add-datacenter-location-region',form).clone();
|
|
select.removeClass()
|
|
.attr('id',select_name)
|
|
.attr('name',select_name)
|
|
.attr('style','')
|
|
.addClass('convert-to-chosen')
|
|
.addClass('location-region')
|
|
.addClass('location-comtrol')
|
|
.addClass('add-location-control')
|
|
.css('width','100%');
|
|
var option_val = arg.context.region;
|
|
select.find("option[value="+option_val+"]").attr("selected","selected");
|
|
return select[0].outerHTML;
|
|
},
|
|
'.add-az@data-slug':function(arg){
|
|
return location_slug;
|
|
},
|
|
'input.add-az-control@id':function(arg){
|
|
return 'add-az-name-'+location_slug;
|
|
},
|
|
'input.add-az-control@name':function(arg){
|
|
return 'add-az-name-'+location_slug;
|
|
},
|
|
"tr.new-zone":{
|
|
"az <- availability_zones": {
|
|
'input.new-zone-name@value':function(arg){
|
|
return arg.item.name;
|
|
},
|
|
'input.new-zone-name@id':function(arg){
|
|
return 'location_zone_'+convertToSlug(arg.item.name)+location_slug;
|
|
},
|
|
'input.new-zone-name@name':function(arg){
|
|
return 'location_zone_'+convertToSlug(arg.item.name)+location_slug;
|
|
},
|
|
'input.new-zone-name@data-name':function(arg){
|
|
return arg.item.name;
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
var data_center_container = location_template.render(location, directives);
|
|
data_center_container.appendTo('#data-center-locations-container');
|
|
//set widgets and validation rules...
|
|
$('.convert-to-chosen', data_center_container).chosen({disable_search_threshold: 3});
|
|
$('.convert-to-chosen', data_center_container).removeClass('convert-to-chosen');
|
|
|
|
$('.location-city', data_center_container).rules('add', {
|
|
required: true,
|
|
ValidPlainText: true,
|
|
maxlength: 125,
|
|
validate_duplicate_location:[$('.location-info-container',data_center_container)]
|
|
});
|
|
|
|
$('.location-state', data_center_container).rules('add', {
|
|
ValidPlainText: true,
|
|
maxlength: 50
|
|
});
|
|
|
|
$('.location-country', data_center_container).rules('add', {
|
|
required: true
|
|
});
|
|
|
|
$('.location-region', data_center_container).rules('add', {
|
|
required: true
|
|
});
|
|
|
|
$('#add-az-name-'+location_slug, data_center_container).rules('add',{
|
|
required: true,
|
|
ValidPlainText: true,
|
|
maxlength: 125,
|
|
validate_duplicate_field:[$('.az-table',data_center_container),'.zone-name']
|
|
});
|
|
|
|
$('.zone-name', data_center_container).rules('add',{
|
|
required: true,
|
|
ValidPlainText: true,
|
|
maxlength: 125,
|
|
validate_duplicate_field:[$('.az-table',data_center_container),'.zone-name']
|
|
});
|
|
|
|
}
|
|
}( jQuery ));
|
|
|