ziver/hal
1
1
Fork 0
Code Pull requests Releases Activity

Refactoring of duplicate JS form code

Browse source
This commit is contained in:
Ziver Koc 2017-03-16 17:01:49 +01:00
parent b688217ad0
commit 6b13f3527a
4 changed files with 50 additions and 134 deletions
Download patch file Download diff file Expand all files Collapse all files

43
resource/web/event_config.tmpl
View file

@ -89,49 +89,8 @@
<!------------- MODALS --------------->
<script>
var eventDataConf = {};
$(function(){
// initialize event modal things
$("#event-data-conf-template div").each(function(){
eventDataConf[$(this).attr("id")] = $(this).html();
});
$("#eventModal select[name=type]").change(function(){
// Update dynamic inputs
$("#eventModal #event-data-conf").html(eventDataConf[$(this).val()]);
});
// click event
$("#eventModal").on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var modal = $(this);
modal.find("input[type=text]").val(""); // Reset all inputs
if(button.data("id") >= 0){ // edit
modal.find("input[name=action]").val("modify_local_event");
}
else{ // create
modal.find("input[name=action]").val("create_local_event");
modal.find("input[name=id]").val(-1);
}
// Set dynamic data
modal.find("select[name=type]").val(button.data("type"));
modal.find("select[name=type]").change(); // Update dynamic inputs
$.each(button.attr(), function(fieldName, value) {
if(fieldName.startsWith("data-")) {
fieldName = fieldName.substring(5);
input = modal.find("input").filter(function() {
return this.name.toLowerCase() == fieldName;
});
if (input.attr("type") == "checkbox") { // special handling for checkboxes
if (value=="true") input.attr("checked", "true");
else input.removeAttr("checked", "true");
// Add default false value as a unchecked checkbox is not included in the post
input.parent().prepend("<input type='hidden' name='"+input.attr("name")+"' value='false' />");
} else {
input.val(value);
}
}
});
});
initDynamicModalForm("eventModal", "event-data-conf", "event-data-conf-template");
});
</script>

47
resource/web/js/hal.js vendored
View file

@ -5,7 +5,7 @@ $(function(){
$(".timestamp").relTimestamp();
});
////////////////////////////////////// JQuery functions
////////////////////////////////////// JQuery helper functions
// $.attr() # returns all attributes of an element
(function(old) {
@ -121,4 +121,49 @@ function getChartData(json){
axes: dataYaxis,
unload: true,
};
}
////////////// Dynamic forms
var dynamicConf = {};
function initDynamicModalForm(modalId, formTemplateId, templateID){
// read in all configurations into global variable (to skip naming issues)
dynamicConf[formTemplateId] = [];
$("#"+templateID+" div").each(function(){
dynamicConf[formTemplateId][$(this).attr("id")] = $(this).html();
});
// Update dynamic inputs
$("#"+modalId+" select[name=type]").change(function(){
$("#"+modalId+" #"+formTemplateId).html(dynamicConf[formTemplateId][$(this).val()]);
});
// click event
$("#"+modalId).on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var modal = $(this);
// Reset all inputs
modal.find("#"+formTemplateId).empty(); // clear form div
// select dynamic form
var selector = modal.find("select[name=type]");
selector.val(button.data("type"));
selector.change(); // Update dynamic inputs
// set dynamic form data
$.each(button.attr(), function(fieldName, value) {
if(fieldName.startsWith("data-")) {
fieldName = fieldName.substring(5);
// case insensitive search
input = modal.find("input").filter(function() {
return this.name.toLowerCase() == fieldName;
});
if (input.attr("type") == "checkbox") { // special handling for checkboxes
if (value=="true") input.attr("checked", "true");
else input.removeAttr("checked");
// Add default false value as a unchecked checkbox is not included in the post
input.parent().prepend("<input type='hidden' name='"+input.attr("name")+"' value='false' />");
} else {
input.val(value);
}
}
});
});
}

47
resource/web/sensor_config.tmpl
View file

@ -194,53 +194,8 @@
<!------------- MODALS --------------->
<script>
var sensorDataConf = {};
$(function(){
// initialize sensor modal things
$("#sensor-data-conf-template div").each(function(){
sensorDataConf[$(this).attr("id")] = $(this).html();
});
$("#sensorModal select[name=type]").change(function(){
// Update dynamic inputs
$("#sensorModal #sensor-data-conf").html(sensorDataConf[$(this).val()]);
});
// click event
$("#sensorModal").on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var modal = $(this);
modal.find("input[type=text]").val(""); // Reset all inputs
if(button.data("id") >= 0){ // edit
modal.find("input[name=action]").val("modify_local_sensor");
modal.find("input[name=sync]").prop("checked", button.data("sync"));
}
else{ // create
modal.find("input[name=action]").val("create_local_sensor");
modal.find("input[name=id]").val(-1);
modal.find("input[name=sync]").prop("checked", "false");
}
// set dynamic form data
modal.find("select[name=type]").val(button.data("type"));
modal.find("select[name=type]").change(); // Update dynamic inputs
$.each(button.attr(), function(fieldName, value) {
if(fieldName.startsWith("data-")) {
fieldName = fieldName.substring(5);
console.log(fieldName, value);
input = modal.find("input").filter(function() {
return this.name.toLowerCase() == fieldName;
});
if (input.attr("type") == "checkbox") { // special handling for checkboxes
if (value=="true") input.attr("checked", "true");
else input.removeAttr("checked", "true");
// Add default false value as a unchecked checkbox is not included in the post
input.parent().prepend("<input type='hidden' name='"+input.attr("name")+"' value='false' />");
} else {
input.val(value);
}
}
});
});
initDynamicModalForm("sensorModal", "sensor-data-conf", "sensor-data-conf-template");
$("#userModal").on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);

47
resource/web/trigger.tmpl
View file

@ -140,52 +140,9 @@
<!-------------------------------- MODALS -------------------------------->
<script>
$(function(){
initDynamicModalForm("trigger");
initDynamicModalForm("action");
initDynamicModalForm("triggerModal", "trigger-data-conf", "trigger-data-conf-template");
initDynamicModalForm("actionModal", "action-data-conf", "action-data-conf-template");
});
var dynamicConf = {};
function initDynamicModalForm(name){
// read in all configurations into global variable (to skip naming issues)
dynamicConf[name] = [];
$("#"+name+"-data-conf-template div").each(function(){
dynamicConf[name][$(this).attr("id")] = $(this).html();
});
// Update dynamic inputs
$("#"+name+"Modal select[name=type]").change(function(){
$("#"+name+"Modal #"+name+"-data-conf").html(dynamicConf[name][$(this).val()]);
});
// click event
$("#"+name+"Modal").on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var modal = $(this);
modal.find("input").val(""); // Reset all inputs
// set dynamic form data
modal.find("select[name=type]").val(button.data("type"));
modal.find("select[name=type]").change(); // Update dynamic inputs
$.each(button.attr(), function(fieldName, value) {
if(fieldName.startsWith("data-")) {
fieldName = fieldName.substring(5);
console.log(fieldName, value);
// case insensitive search
input = modal.find("input").filter(function() {
return this.name.toLowerCase() == fieldName;
});
if (input.attr("type") == "checkbox") { // special handling for checkboxes
if (value=="true") input.attr("checked", "true");
else input.removeAttr("checked", "true");
// Add default false value as a unchecked checkbox is not included in the post
input.parent().prepend("<input type='hidden' name='"+input.attr("name")+"' value='false' />");
} else {
input.val(value);
}
}
});
});
}
</script>
<div class="modal fade" id="triggerModal" tabindex="-1">