eessppeelllloo/image-sequencer
1
0
Fork 0
mirror of https://github.com/publiclab/image-sequencer.git synced 2025-12-11 19:00:00 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix toggle-able collapse (#651)

Browse Source 
* fix toggle

* changes

* dist changes

* changes

* changes

* changes

* changes
This commit is contained in:
Mridul97
2019-01-15 03:35:23 +05:30
committed by Jeffrey Warren
parent b5fcba3c54
commit f68983d6d7
3 changed files with 21 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
examples/lib/defaultHtmlStepUi.js
View File

@@ -33,14 +33,14 @@ function DefaultHtmlStepUi(_sequencer, options) {
<div class="row step">\
<form class="input-form">\
<div class="col-md-4 details">\
<h3>' +step.name +
' <span class="toggle"><i class="fa fa-caret-up" aria-hidden="true"></i></span>' +
'</h3><div class="collapse"><p><i>"'+
<h3>\
<span class = "toggle">' +step.name + ' <i class="fa fa-caret-up toggleIcon" aria-hidden="true"></i></span>' +
'</h3><div class="cal"><p><i>"'+
(step.description || "") +
'</i></p></div>\
</div>\
</form>\
<div class="col-md-8 collapse">\
<div class="col-md-8 cal">\
<div class="load" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></div>\
<a><img alt="" style="max-width=100%" class="img-thumbnail step-thumbnail"/></a>\
</div>\
@@ -49,7 +49,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
</div>';
var tools =
'<div class="collapse"><div class="tools btn-group">\
'<div class="cal"><div class="tools btn-group">\
<button confirm="Are you sure?" onclick="stepRemovedNotify()" class="remove btn btn btn-default">\
<i class="fa fa-trash"></i>\
</button>\
@@ -114,7 +114,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
div.setAttribute("name", paramName);
var description = inputs[paramName].desc || paramName;
div.innerHTML =
"<div class='det collapse'>\
"<div class='det cal'>\
<label for='" +
paramName +
"'>" +
@@ -128,7 +128,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
}
$(step.ui.querySelector("div.details")).append(
'<div class="collapse"><p><button type="submit" class="btn btn-default btn-save" disabled = "true" >Apply</button><span> Press apply to see changes</span></p></div>'
'<div class="cal"><p><button type="submit" class="btn btn-default btn-save" disabled = "true" >Apply</button><span> Press apply to see changes</span></p></div>'
);
@@ -155,17 +155,9 @@ function DefaultHtmlStepUi(_sequencer, options) {
else {
$("#load-image").append(step.ui);
}
$(step.ui.querySelector(".toggle")).on("click", (e) => {
var className = e.target.className;
if(className=="fa fa-caret-up"){
$(step.ui.querySelectorAll(".collapse")).show();
e.target.className="fa fa-caret-down";
}
else{
$(step.ui.querySelectorAll(".collapse")).hide();
//e.target.localName.toggleClass('fa-caret-up');
e.target.className="fa fa-caret-up";
}
$(step.ui.querySelector(".toggle")).on("click", () => {
$(step.ui.querySelector('.toggleIcon')).toggleClass('fa-caret-up').toggleClass('fa-caret-down');
$(step.ui.querySelectorAll(".cal")).toggleClass("collapse");
});