-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
136 lines (118 loc) · 4.8 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
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html style="height: 100%">
<head>
<meta charset="UTF-8">
<title>Loom</title>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css" rel="stylesheet">
<link href="css/style.css" type="text/css" rel="stylesheet">
<script src="magic-wand.js"></script>
</head>
<body>
<ph-window>
<div id="root"></div>
<canvas id="canvas" width="100" height="100"></canvas>
<tool-bar type="footer" id='stats' class="toolbar toolbar-footer">
<!--Screenshot Delay: <input type='text' id='delay'>ms-->
<div class="tab-group">
<div class="tab-item active" data-tab-id="1">
Workspace 1
</div>
<div class="tab-item" data-tab-id="2">
<span class="icon icon-cancel icon-close-tab"></span>
Workspace 2
</div>
<div class="tab-item tab-item-fixed" data-tab-action="add">
<span class="icon icon-plus"></span>
</div>
</div>
<div class="toolbar-actions">
<button class="loom-tool-selector btn btn-default btn-dropdown">
<span class="icon icon-pencil"></span>
</button>
<div class="btn-group">
<button class="btn btn-default active loom-selection-cursor">
<span class="icon icon-doc-landscape"></span>
</button>
<button class="btn btn-default" id="loom-duplicate-targets">
<span class="icon icon-docs"></span>
</button>
<button class="btn btn-default" id="loom-save-targets">
<span class="icon icon-floppy"></span>
</button>
<button class="btn btn-default" id="loom-run-interaction">
<span class="icon icon-record"></span>
</button>
<button class="btn btn-default" id="loom-export-video">
<span class="icon icon-export"></span>
</button>
</div>
<div class="loom-target-options pull-right hide">
<input type="text" class='name setting'>
<input type="text" class="description setting">
<select class='childof setting'>
<option>Parent</option>
</select>
<!--
<select class='type setting'>
<option value="Type">Type</option>
<option value="Linear">Linear</option>
<option value="Parallel">Parallel</option>
<option value="Orthogonal">Orthogonal</option>
<option value="Helper">Helper</option>
</select>
-->
<select class='actor setting'>
<option value="Action">Action</option>
<option value="Arcball">Arcball</option>
<option value="Arcball-reset">Arcball-reset</option>
<option value="Button">Button</option>
<option value="Hover">Hover</option>
<option value="Slider">Slider</option>
<option value="SliderX">SliderX</option>
<option value="Brush">Brush</option>
</select>
<i class="fa fa-trash remove setting" aria-hidden="true"></i>
</div>
<div class="loom-smart-target-options hide pull-right">
<input type="range" class="slider slider-round" />
<div class="btn-group">
<button class="btn btn-mini btn-default apply">
<span class="icon icon-check"></span>
</button>
<button class="btn btn-mini btn-default cancel">
<span class="icon icon-cancel"></span>
</button>
</div>
</div>
<div class="loom-magic-target-options hide pull-right">
<input type="range" class="slider slider-round" value="15" min="1" max="100"/>
<div class="btn-group">
<button class="btn btn-mini btn-default apply">
<span class="icon icon-check"></span>
</button>
<button class="btn btn-mini btn-default cancel">
<span class="icon icon-cancel"></span>
</button>
</div>
</div>
<div class="loom-grid-target-options hide pull-right">
<input type="number" placeholder="width" step="1" min="1"/>
<input type="number" placeholder="height" step="1" min="1"/>
<input type="number" placeholder="space" step="1" min="0"/>
<div class="btn-group">
<button class="btn btn-mini btn-default apply">
<span class="icon icon-check"></span>
</button>
<button class="btn btn-mini btn-default cancel">
<span class="icon icon-cancel"></span>
</button>
</div>
</div>
</tool-bar>
<script>
// You can also require other files to run in this process
require('./renderer.js')
</script>
</ph-window>
</body>
</html>