Pathogen
/
neptune
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Make widgets play nice with HTMX

This commit is contained in:
Mark Veidemanis 2022-08-26 07:20:30 +01:00
parent c597af5523
commit 2189381fa6
Signed by: m
GPG Key ID: 5ACFCEED46C0904F
3 changed files with 43 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
core/templates/base.html
View File

@ -19,7 +19,7 @@
<link rel="stylesheet" href="{% static 'css/gridstack.min.css' %}"> <link rel="stylesheet" href="{% static 'css/gridstack.min.css' %}">
<script src="{% static 'js/bulma-calendar.min.js' %}" integrity="sha384-DThNif0xGXbopX7+PE+UabkuClfI/zELNhaVqoGLutaWB76dyMw0vIQBGmUxSfVQ" crossorigin="anonymous"></script> <script src="{% static 'js/bulma-calendar.min.js' %}" integrity="sha384-DThNif0xGXbopX7+PE+UabkuClfI/zELNhaVqoGLutaWB76dyMw0vIQBGmUxSfVQ" crossorigin="anonymous"></script>
<script src="{% static 'js/bulma-slider.min.js' %}" integrity="sha384-wbyps8iLG8QzJE02viYc/27BtT5HSa11+b5V7QPR1/huVuA8f4LRTNGc82qAIeIZ" crossorigin="anonymous"></script> <script src="{% static 'js/bulma-slider.min.js' %}" integrity="sha384-wbyps8iLG8QzJE02viYc/27BtT5HSa11+b5V7QPR1/huVuA8f4LRTNGc82qAIeIZ" crossorigin="anonymous"></script>
<script defer src="{% static 'js/htmx.min.js' %}" integrity="sha384-cZuAZ+ZbwkNRnrKi05G/fjBX+azI9DNOkNYysZ0I/X5ZFgsmMiBXgDZof30F5ofc" crossorigin="anonymous"></script> <script src="{% static 'js/htmx.min.js' %}" integrity="sha384-cZuAZ+ZbwkNRnrKi05G/fjBX+azI9DNOkNYysZ0I/X5ZFgsmMiBXgDZof30F5ofc" crossorigin="anonymous"></script>
<script defer src="{% static 'js/remove-me.js' %}" integrity="sha384-6fHcFNoQ8QEI3ZDgw9Z/A6Brk64gF7AnFbLgdrumo8/kBbsKQ/wo7wPegj5WkzuG" crossorigin="anonymous"></script> <script defer src="{% static 'js/remove-me.js' %}" integrity="sha384-6fHcFNoQ8QEI3ZDgw9Z/A6Brk64gF7AnFbLgdrumo8/kBbsKQ/wo7wPegj5WkzuG" crossorigin="anonymous"></script>
<script defer src="{% static 'js/hyperscript.min.js' %}" integrity="sha384-6GYN8BDHOJkkru6zcpGOUa//1mn+5iZ/MyT6mq34WFIpuOeLF52kSi721q0SsYF9" crossorigin="anonymous"></script> <script defer src="{% static 'js/hyperscript.min.js' %}" integrity="sha384-6GYN8BDHOJkkru6zcpGOUa//1mn+5iZ/MyT6mq34WFIpuOeLF52kSi721q0SsYF9" crossorigin="anonymous"></script>
<script src="{% static 'js/bulma-tagsinput.min.js' %}"></script> <script src="{% static 'js/bulma-tagsinput.min.js' %}"></script>

53
core/templates/ui/drilldown/drilldown.html
View File

@ -70,6 +70,35 @@
</div> </div>
</div> </div>
</div> </div>
<script>
var grid = GridStack.init({
cellHeight: 20,
cellWidth: 50,
auto: true,
float: true,
draggable: {handle: '.panel-heading', scroll: false, appendTo: 'body'},
removable: false,
});
// GridStack.init();
setupTags();
document.addEventListener('load-widget', function(event) {
grid.removeWidget("drilldown-widget-results");
let container = htmx.find('#drilldown-widget');
var scripts = htmx.findAll(container, "script");
let widgetelement = container.firstElementChild.cloneNode(true);
container.firstElementChild.remove();
//let grid = document.querySelector('.grid-stack').gridstack;
grid.addWidget(widgetelement);
htmx.process(widgetelement);
for (var i = 0; i < scripts.length; i++) {
eval(scripts[i].innerHTML);
}
});
</script>
<div id="modals-here"> <div id="modals-here">
</div> </div>
<div id="items-here"> <div id="items-here">
@ -82,31 +111,7 @@
{% endif %} {% endif %}
</div> </div>
<script> <script>
var grid = GridStack.init({
cellHeight: 20,
cellWidth: 50,
auto: true,
float: true,
draggable: {handle: '.panel-heading', scroll: false, appendTo: 'body'},
removable: false,
});
// GridStack.init();
setupTags();
</script> </script>
{% if table %}
<script>
//var contents = $("#drilldown-widget").outerHTML;
var contents = document.getElementById("drilldown-widget");
var scripts = contents.getElementsByTagName("script");
var grid = document.getElementById("grid-stack-main").gridstack;
grid.addWidget(contents.innerHTML);
contents.outerHTML = "";
// restore scripts that aren't going to be run
for (var i = 0; i < scripts.length; i++) {
eval(scripts[i].innerHTML);
}
</script>
{% endif %}
{% endblock %} {% endblock %}

27
core/templates/widgets/table_results.html
View File

@ -52,17 +52,16 @@
</div> </div>
<script> <script>
if (typeof grid != "undefined") { // let container = htmx.find('#drilldown-widget');
grid.removeWidget("drilldown-widget-results"); // var scripts = container.getElementsByTagName("script");
//var contents = $("#drilldown-widget").outerHTML; // let widgetelement = container.firstElementChild.cloneNode(true);
var contents = document.getElementById("drilldown-widget"); // container.firstElementChild.remove();
var scripts = contents.getElementsByTagName("script"); // //let grid = document.querySelector('.grid-stack').gridstack;
var grid = document.getElementById("grid-stack-main").gridstack; // grid.addWidget(widgetelement);
grid.addWidget(contents.innerHTML); // htmx.process(widgetelement);
contents.outerHTML = ""; // for (var i = 0; i < scripts.length; i++) {
// restore scripts that aren't going to be run // eval(scripts[i].innerHTML);
for (var i = 0; i < scripts.length; i++) { // }
eval(scripts[i].innerHTML); var widget_event = new Event('load-widget');
} document.dispatchEvent(widget_event);
} </script>
</script>