-
Notifications
You must be signed in to change notification settings - Fork 0
/
editor.html
115 lines (112 loc) · 4.88 KB
/
editor.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
110
111
112
113
114
115
<!DOCTYPE html>
<html ng-app="app">
<head>
<title>Fire 'n Ice</title>
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js"></script>
<script>
const EDITOR_MODE_ON = true;
</script>
<script src="dist/firenice.js"></script>
</head>
<body ng-controller="controller">
<div class="wrapper" style="padding-bottom: 15px">
<h1>Fire 'n Ice Level Editor</h1>
</div>
<div class="wrapper">
<div class="bg-dark">
<span ng-click="toolSelect(0)" class="far fa-square" ng-class="{'active': tool === 0}"></span>
<span ng-click="toolSelect(1)" class="fab fa-delicious" ng-class="{'active': tool === 1}"></span>
<span ng-click="toolSelect(6)" class="fa fa-fire" ng-class="{'active': tool === 6}"></span>
<span ng-click="toolSelect(3)" class="fa fa-dice-three" ng-class="{'active': tool === 3}"></span>
<span ng-click="toolSelect(4)" class="fa fa-weight-hanging" ng-class="{'active': tool === 4}"></span>
<span ng-click="toolSelect(5)" class="fa fa-hourglass" ng-class="{'active': tool === 5}"></span>
<span ng-click="toolSelect(7)" class="fa fa-user" ng-class="{'active': tool === 7}"></span>
<span ng-click="toolSelect(8)" class="fa fa-car" ng-class="{'active': tool === 8}"></span>
<span ng-click="loadLevelsList()" class="fa fa-sync-alt"></span>
</div>
</div>
<div class="wrapper">
<canvas id="canvas" height="416" width="544">
<div style="display: none">
<audio id="sfx-ice-push" src="sounds/sfx-ice-push.mp3"></audio>
<audio id="sfx-fire-off" src="sounds/sfx-fire-off.mp3"></audio>
<audio id="sfx-falling" src="sounds/sfx-falling.mp3"></audio>
<audio id="sfx-new-ice" src="sounds/sfx-new-ice.mp3"></audio>
<audio id="sfx-climb" src="sounds/sfx-climb.mp3"></audio>
<audio id="sfx-ice-collision" src="sounds/sfx-ice-collision.mp3"></audio>
<audio id="sfx-stage-enter" src="sounds/sfx-stage-enter.mp3"></audio>
<audio id="sfx-danger" src="sounds/sfx-danger.mp3"></audio>
<audio id="sfx-ice-remove" src="sounds/sfx-ice-remove.mp3"></audio>
<audio id="sfx-state-leave" src="sounds/sfx-state-leave.mp3"></audio>
<audio id="sfx-disabled" src="sounds/sfx-disabled.mp3"></audio>
<audio id="sfx-fall" src="sounds/sfx-fall.mp3"></audio>
<audio id="sfx-music-sparks" src="music/sparks.mp3"></audio>
</div>
</canvas>
<div class="bg-dark" id="loader">
<div class="start blink">CLICK TO START</div>
</div>
</div>
<div class="wrapper" style="display: none">
<div class="col-50 bg-dark">
<span class="fa fa-arrow-circle-left" id="btn_left"></span>
<span class="fa fa-arrow-circle-right" id="btn_right"></span>
</div>
<div class="col-50 bg-dark">
<span class="fa fa-cog" id="btn_select"></span>
<span class="fa fa-dot-circle pull-right" id="btn_action"></span>
</div>
</div>
<div class="wrapper">
<div class="bg-dark">
<textarea id="txt-level"></textarea>
<button id="btn-save">Save</button>
<select id="theme-selector">
<option value="0">Theme 0</option>
<option value="1">Theme 1</option>
<option value="2">Theme 2</option>
<option value="3">Theme 3</option>
<option value="4">Theme 4</option>
<option value="5">Theme 5</option>
<option value="6">Theme 6</option>
<option value="7">Theme 7</option>
<option value="8">Theme 8</option>
<option value="9">Theme 9</option>
</select>
<select id="level-selector">
<option value="-1">Select a level</option>
<option ng-repeat="level in levels" value="{{$index}}">Level {{$index}}</option>
</select>
</div>
</div>
<script>
var FIRENICE_EDITOR_MODE = true;
var tool = 1;
var app = angular.module('app', []);
app.controller('controller', [
'$scope',
function ($scope) {
$scope.levels = [];
setTimeout(() => {
if (game) {
$scope.levels = game.levels;
$scope.$apply();
}
}, 3000);
$scope.toolSelect = function (e) {
tool = e;
$scope.tool = e;
};
$scope.loadLevelsList = function () {
$scope.levels = game.levels;
};
},
]);
</script>
</body>
</html>