-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
109 lines (100 loc) · 4.58 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="editor.css"/>
<base href="#" />
<title>Map editor | Hacktoon.com</title>
</head>
<body>
<section id="main-menu" class="unselectable">
<ul id="file-menu">
<li><button class="btn-menu btn-file" id="btn-file-new" title="New file">
<span>New</span>
</button></li>
<li><button class="btn-menu btn-file" id="btn-file-import" title="Import file">
<span>Import</span>
</button></li>
<li><button class="btn-menu btn-file" id="btn-file-export" title="Export file">
<span>Export</span>
</button></li>
</ul>
<ul id="tools-menu">
<li><button class="btn-menu btn-tool" id="btn-tool-pen" data-value="pen" title="Pen tool">
<span>Pen</span>
</button></li>
<li><button class="btn-menu btn-tool" id="btn-tool-rect" data-value="rect" title="Rectangle tool">
<span>Rectangle</span>
</button></li>
<li><button class="btn-menu btn-tool" id="btn-tool-fill" data-value="fill" title="Fill">
<span>Fill</span>
</button></li>
</ul>
<ul id="layers-menu">
<li><button class="btn-menu btn-layer" id="btn-layer-bg" data-value="0" title="BG Layer">BG</button></li>
<li><button class="btn-menu btn-layer" id="btn-layer-fg" data-value="1" title="FG Layer">FG</button></li>
<li><button class="btn-menu btn-layer" id="btn-layer-event" data-value="2" title="Event Layer">Event</button></li>
</ul>
</section>
<section id="editor-panel" class="unselectable">
<sidebar id="sidebar-panel">
<div id="palette-panel">
<div id="palette-overlay"></div>
<div id="palette-selector"></div>
<div id="palette-view"></div>
</div>
<div id="project-panel"></div>
</sidebar>
<div id="board-panel">
<div id="board"></div>
<div id="board-selector"></div>
<div id="board-overlay"></div>
</div>
</section>
<div id="dialog-overlay">
<div class="dialog-container">
<div class="dialog-titlebar">
<p class="title">Dialog</p>
<button class="btn-close">
<svg width="20" height="20">
<path class="svg-icon" d="M 15.714285,4.6325691e-8 10.000001,5.7142846 4.2857164,4.6325691e-8 0,4.2857165 5.7142845,10.000001 0,15.714286 4.2857164,20.000002 10.000001,14.285717 15.714285,20.000002 20.000002,15.714286 14.285717,10.000001 20.000002,4.2857165 15.714285,4.6325691e-8 Z"/>
</svg>
</button>
</div>
<div class="dialog-content"></div>
<div class="dialog-button-panel"></div>
</div>
</div>
<script id="tpl-dialog-file-new" class="template" type="text/template">
<form action="" id="form-file-new">
<div class="form-row">
<label for="field-file-new-name">Name</label>
<input type="text" name="name" id="field-file-new-name" class="field" value="new-map" maxlength="200" required>
</div>
<div class="form-row">
<label for="field-file-new-width">Width (tiles)</label>
<input type="number" name="width" id="field-file-new-width" class="field" value="10" min="5" max="40" required>
</div>
<div class="form-row">
<label for="field-file-new-height">Height (tiles)</label>
<input type="number" name="height" id="field-file-new-height" class="field" value="10" min="5" max="40" required>
</div>
<div class="form-row">
<label for="field-file-new-tileset">Tileset</label>
<select name="tileset" id="field-file-new-tileset" class="field"></select>
</div>
</form>
</script>
<script id="tpl-dialog-file-import" class="template" type="text/template">
<form action="" id="form-file-import">
<textarea id="field-file-import-map" cols="60" rows="20"></textarea>
</form>
</script>
<script id="tpl-dialog-file-export" class="template" type="text/template">
<form action="" id="form-file-export">
<textarea id="field-file-export-map" cols="60" rows="20"></textarea>
</form>
</script>
<script src="build/Acrilic.js"></script>
</body>
</html>