blob: 6b8028756d271c93cedb288df54388d8fbf334fb (
plain)
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
|
<style type="text/css">
html,body{width:100%;height:100%;margin:0;padding:0;}
body {
overflow: hidden;
}
#perspective,
#perspective .mx-scene {
position: absolute;
left:0%;
top:0px;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
#orthographic {
position: absolute;
left:50%;
top:0px
}
.hud {
position: absolute;
top: 0;
left: 0;
padding: 10px;
background: white;
}
.ortho-hud {
left: 50%;
border-left: 1px solid black;
}
#url { width: 300px }
.hud span { color: #888; cursor: pointer; }
.hud span.active { color: #000; }
.blueprintUpload {
width: 240px;
}
.blueprints .blueprint {
border: 1px solid black;
padding: 5px;
height: 100px;
max-width: 200px;
cursor: pointer;
}
</style>
<div id="blueprintView">
<div id="perspective"></div>
<div id="orthographic"></div>
<div class="hud persp-hud">
<input type="text" id="url" placeholder="paste an image URL here!">
<span class="ion-ionic active" data-role="orbit-mode"></span>
<span class="ion-archive" data-role="keyboard-mode"></span>
</div>
<div class="hud ortho-hud">
<span class="ion-navigate" data-role="arrow-mode"></span>
<span class="ion-ios-pulse active" data-role="polyline-mode"></span>
<span class="ion-ios-grid-view-outline" data-role="ortho-polyline-mode"></span>
<span class="ion-scissors" data-role="eraser-mode"></span>
</div>
</div>
<div class="mediaDrawer fixed animate active blueprintEditor">
<span class="close">X</span>
<div class="box">
<h2>Upload your Blueprint</h2>
<div class="blueprintUpload">
<input type="hidden" name="_csrf" value="[[- token ]]">
<div class="wallpaperUpload toolButton">
<form>
<span class="ion-ios-upload-outline upload-icon"></span>
<label>Upload</label>
<input type="file" accept="image/*" multiple>
</form>
</div>
<input type="text" class="url" placeholder="Enter an image URL or...">
<div class="blueprints">
<h5>Your uploaded blueprints</h5>
</div>
</div>
Please tell us the scale of your blueprint.
Click both corners of a wall, and then enter how long the wall is.
https://s3.amazonaws.com/luckyplop/fbf4295da80f1f66c5e4a248f2ea3e1ce7a22c3d.jpg
<div id="blueprintMap">
</div>
<div id="blueprintDimensions">
<input type="text" name="blueprint-dimensions">
<select id="blueprint-units" name="blueprint-units">
<option value="ft">foot</option>
<option value="m">meter</option>
</select>
<button id="saveBlueprint">Save</button>
</div>
</div>
</div>
|
