sthag
8937b36a1e
- Use common styles - Move NewDiv class to external script - Align script for form and drag pages
48 lines
No EOL
1.1 KiB
Text
Executable file
48 lines
No EOL
1.1 KiB
Text
Executable file
---
|
|
title: Drag
|
|
tags:
|
|
- demoExample
|
|
---
|
|
{% set pageId = page.fileSlug %}
|
|
{% set pageClass = "h_full_view" %}
|
|
{% set bodyClass = "body_drag" %}
|
|
|
|
{% extends "demo/_app.njk" %}
|
|
|
|
{% block title %}{{ title }}
|
|
{% endblock %}
|
|
|
|
{% block links %}
|
|
{{ super() }}
|
|
<link href="{{ pageBase }}css/ui.css" media="all" rel="stylesheet"/>
|
|
{% endblock %}
|
|
|
|
{% block head %}
|
|
{{ super() }}
|
|
{% endblock %}
|
|
|
|
{% block body %}
|
|
<div id="space"></div>
|
|
<button data-action="add">Add</button>
|
|
{% endblock %}
|
|
|
|
{%- block script %}
|
|
<script src="{{ pageBase }}js/_ui.js"></script>
|
|
<script>
|
|
// Get the space element
|
|
const space = document.getElementById('space');
|
|
const add = document.querySelector('[data-action=add]');
|
|
|
|
// 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, 800, 600, '#000');
|
|
newDiv.createDiv();
|
|
newDiv.appendToFrame(space);
|
|
</script>
|
|
{% endblock %} |