summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJules Laplace <jules@okfoc.us>2015-08-14 16:37:39 -0400
committerJules Laplace <jules@okfoc.us>2015-08-14 16:48:51 -0400
commit6b3d07293bf674703b286cb396049fb8e83b86b7 (patch)
treed929a2be9f81f6c2297725d7dbae1e2a690b987f
parentf74635f1d28d3450d7c4ddb9869685dc20019f3a (diff)
AnimatedView
Diffstat
-rw-r--r--public/assets/javascripts/ui/blueprint/BlueprintScaler.js29
-rw-r--r--public/assets/javascripts/ui/lib/AnimatedView.js31
-rw-r--r--views/blueprint.ejs33
-rw-r--r--views/builder.ejs16
-rw-r--r--views/controls/blueprint/editor.ejs43
-rw-r--r--views/modal.ejs1
-rw-r--r--views/partials/scripts.ejs1
7 files changed, 93 insertions, 61 deletions
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
index c393cfb..741f4fb 100644
--- a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
+++ b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
@@ -1,5 +1,5 @@
-var BlueprintScaler = ModalFormView.extend({
+var BlueprintScaler = ModalFormView.extend(AnimatedView.prototype).extend({
el: ".blueprintScaler",
action: "/api/media/scale",
@@ -20,7 +20,7 @@ var BlueprintScaler = ModalFormView.extend({
this.$units = this.$("[name=blueprint-units]")
this.$save = this.$("#saveBlueprint")
- this.map = map = new Map ({
+ this.map = new Map ({
type: "ortho",
el: this.$blueprintMap.get(0),
width: window.innerWidth,
@@ -30,14 +30,12 @@ var BlueprintScaler = ModalFormView.extend({
zoom_max: 1,
})
this.lineTool = new LineTool
- map.ui.add_tool("line", this.lineTool)
- map.ui.set_tool("line")
+ this.map.ui.add_tool("line", this.lineTool)
+ this.map.ui.set_tool("line")
scene = scene || { camera: { x: 0, y: 0, z: 0 } }
this.floorplan = new MX.Image ()
-
- this.animating = false
},
showBlueprintUpload: function(){
@@ -50,27 +48,16 @@ var BlueprintScaler = ModalFormView.extend({
if (!! media.units) {
this.parent.useFloorplan(media)
this.hide()
+ this.stopAnimating()
return
}
this.floorplan.load({ media: media, keepImage: true })
- if (! this.animating) {
- this.animating = true
- this.animate()
- }
+ this.startAnimating()
},
- animate: function(t){
- requestAnimationFrame(this.animate.bind(this))
-
- if (! this.animating) return
-
- var dt = t - this.last_t
- this.last_t = t
-
- if (! t) return
-
+ animate: function(t, dt){
this.map.update(t)
this.map.draw.ctx.save()
@@ -147,7 +134,7 @@ var BlueprintScaler = ModalFormView.extend({
},
success: function(){
- this.animating = false
+ this.stopAnimating()
this.parent.useFloorplan(this.media)
this.hide()
},
diff --git a/public/assets/javascripts/ui/lib/AnimatedView.js b/public/assets/javascripts/ui/lib/AnimatedView.js
new file mode 100644
index 0000000..3c50b0a
--- /dev/null
+++ b/public/assets/javascripts/ui/lib/AnimatedView.js
@@ -0,0 +1,31 @@
+var AnimatedView = View.extend({
+
+ _animating: false,
+ last_t: 0,
+
+ startAnimating: function(){
+ if (this._animating) return
+ this._animating = true
+ this._animate()
+ },
+
+ stopAnimating: function(){
+ this._animating = false
+ },
+
+ _animate: function(t){
+ if (! this._animating) return
+
+ requestAnimationFrame(this._animate.bind(this))
+
+ var dt = t - this.last_t
+ this.last_t = t
+
+ if (! t) return
+
+ this.animate(t, dt)
+ },
+
+ animate: function(t, dt){},
+
+}) \ No newline at end of file
diff --git a/views/blueprint.ejs b/views/blueprint.ejs
new file mode 100644
index 0000000..371d66f
--- /dev/null
+++ b/views/blueprint.ejs
@@ -0,0 +1,33 @@
+<!doctype html>
+<html>
+<head>
+ <title>VValls</title>
+ [[ include partials/meta ]]
+</head>
+<body class="editing loading">
+
+ <div id="scene"></div>
+
+ <div class="rapper">
+ [[ include partials/header ]]
+
+ <div id="builderView">
+ [[ include controls/builder/info ]]
+ [[ include controls/builder/toolbar ]]
+ [[ include controls/builder/settings ]]
+ [[ include controls/blueprint/editor ]]
+ </div>
+
+ <div id="hud">
+ <div id="map" style="display: block">
+ </div>
+ </div>
+ </div>
+
+ [[ include partials/confirm-modal ]]
+ [[ include projects/layouts-modal ]]
+ [[ include partials/sign-in ]]
+
+</body>
+[[ include partials/scripts ]]
+</html>
diff --git a/views/builder.ejs b/views/builder.ejs
index 0ba4238..6a31e22 100644
--- a/views/builder.ejs
+++ b/views/builder.ejs
@@ -17,22 +17,6 @@
[[ include controls/builder/settings ]]
</div>
- <!--
- <div id="minimap" class="vvbox">
- <span class="el"></span>
- </div>
-
- <select id="palette">
- <option>colors</option>
- <option>redblue</option>
- <option>gray</option>
- <option selected>bone</option>
- <option>alpha</option>
- <option>white</option>
- <option>black</option>
- </select>
- -->
-
<div id="hud">
<div id="map" style="display: block">
</div>
diff --git a/views/controls/blueprint/editor.ejs b/views/controls/blueprint/editor.ejs
index 77c958a..e18f501 100644
--- a/views/controls/blueprint/editor.ejs
+++ b/views/controls/blueprint/editor.ejs
@@ -67,7 +67,7 @@ body {
</div>
</div>
-<div class="mediaDrawer fixed animate active blueprintEditor">
+<div class="mediaDrawer fixed animate active blueprintScaler">
<div class="box">
<div class="blueprintUpload">
@@ -90,30 +90,27 @@ body {
</div>
</div>
- <div class="blueprintScaler">
- <div class="blueprintInfo vvbox">
- Please tell us the scale of your blueprint.
- Click two corners of a wall, and then enter how long the wall is.
- <br><br>
- You can also <span class="uploadNewBlueprint">upload another blueprint</span>.
- <br><br>
+ <div class="blueprintInfo vvbox">
+ Please tell us the scale of your blueprint.
+ Click two corners of a wall, and then enter how long the wall is.
+ <br><br>
+ You can also <span class="uploadNewBlueprint">upload another blueprint</span>.
+ <br><br>
- <form>
- <div class="setting number">
- <label for="blueprint-dimensions">length</label>
- <input type="text" class="units" name="blueprint-dimensions" id="blueprint-dimensions">
- <select id="blueprint-units" name="blueprint-units">
- <option value="ft">feet</option>
- <option value="m">meters</option>
- </select>
- </div>
- <button id="saveBlueprint">Save</button>
- </form>
- </div>
+ <form>
+ <div class="setting number">
+ <label for="blueprint-dimensions">length</label>
+ <input type="text" class="units" name="blueprint-dimensions" id="blueprint-dimensions">
+ <select id="blueprint-units" name="blueprint-units">
+ <option value="ft">feet</option>
+ <option value="m">meters</option>
+ </select>
+ </div>
+ <button id="saveBlueprint">Save</button>
+ </form>
+ </div>
- <div id="blueprintMap">
- </div>
-
+ <div id="blueprintMap">
</div>
</div>
diff --git a/views/modal.ejs b/views/modal.ejs
index 775ba88..dfc5573 100644
--- a/views/modal.ejs
+++ b/views/modal.ejs
@@ -10,7 +10,6 @@
<div style="height: 70%; clear: both;" id="content"></div>
- [[ include controls/blueprint/editor ]]
[[ include partials/confirm-modal ]]
[[ include partials/sign-in ]]
[[ include projects/layouts-modal ]]
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index a0222b5..e0024a4 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -102,6 +102,7 @@
<script type="text/javascript" src="/assets/javascripts/ui/lib/ModalView.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/lib/FormView.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/lib/UploadView.js"></script>
+<script type="text/javascript" src="/assets/javascripts/ui/lib/AnimatedView.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/lib/AlertModal.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/lib/ConfirmModal.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/lib/ErrorModal.js"></script>
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-11 11:35:20 +0000