sthag
b67a8a893a
- Move return object to named export for 11ty config - screens is now view - 11ty data files moved to view/_data - templates is now view/_includes - Both are the default directories - data is now used as intended, for user data - Update index to reflect filenames and structure
52 lines
No EOL
1.2 KiB
Text
Executable file
52 lines
No EOL
1.2 KiB
Text
Executable file
---
|
|
title: Drag
|
|
tags:
|
|
- ui
|
|
---
|
|
{% layout 'hippie/app.liquid' %}
|
|
|
|
{% block body %}
|
|
<header class="io pos_fix pin_top pin_right pin_left">
|
|
<button data-action="add">Add</button>
|
|
</header>
|
|
<div id="space"></div>
|
|
<div>
|
|
<div id="test">
|
|
<div class="body_frame">
|
|
{% render 'hippie/partials/frame-header.liquid' %}
|
|
<main></main>
|
|
{% render 'hippie/partials/frame-mode.liquid' %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block assets %}
|
|
{{ block.super -}}
|
|
<script src="/js/drag.js"></script>
|
|
{% endblock %}
|
|
|
|
{%- block script %}
|
|
<script>
|
|
// Get the space element
|
|
const space = document.getElementById('space');
|
|
const add = document.querySelector('[data-action=add]');
|
|
const test = document.getElementById('test');
|
|
|
|
// Add event listener to the add space button
|
|
add.addEventListener('click', () => {
|
|
const newDiv = new NewDiv(100, 100, 100, 100, getRandomColor());
|
|
newDiv.createDiv();
|
|
newDiv.appendToFrame(space);
|
|
});
|
|
|
|
// Create a new NewDiv instance
|
|
const newDiv = new NewDiv(100, 100, 200, 200, '#000');
|
|
newDiv.createDiv();
|
|
newDiv.appendToFrame(space);
|
|
|
|
const explorer = new NewDiv(256, 128, 800, 600, '#fff', test);
|
|
explorer.createDiv();
|
|
explorer.appendToFrame(space);
|
|
</script>
|
|
{% endblock %} |