From a51e91f46feb4d43f69a21e5639d44ca044dcc19 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Tue, 10 Jun 2014 02:30:05 -0400 Subject: rough sketch of builder view --- public/assets/javascripts/rectangles/_env.js | 2 +- .../javascripts/rectangles/engine/map/_map.js | 8 ++--- .../javascripts/rectangles/engine/map/draw.js | 2 +- public/assets/javascripts/ui/BuilderView.js | 23 +++++++++++++ public/assets/javascripts/ui/EditorView.js | 13 +++++++ public/assets/javascripts/ui/Router.js | 4 +++ public/assets/stylesheets/app.css | 10 ++++++ views/builder.ejs | 26 ++++++++------ views/controls/builder/settings.ejs | 40 ++++++++++++++++++++++ views/controls/builder/toolbar.ejs | 34 ++++++++++++++---- views/editor.ejs | 1 - views/home.ejs | 1 - views/partials/header.ejs | 4 ++- views/partials/scripts.ejs | 2 ++ views/staff.ejs | 1 + 15 files changed, 144 insertions(+), 27 deletions(-) create mode 100644 public/assets/javascripts/ui/BuilderView.js create mode 100644 public/assets/javascripts/ui/EditorView.js create mode 100644 views/controls/builder/settings.ejs diff --git a/public/assets/javascripts/rectangles/_env.js b/public/assets/javascripts/rectangles/_env.js index 972b1fe..09d1532 100644 --- a/public/assets/javascripts/rectangles/_env.js +++ b/public/assets/javascripts/rectangles/_env.js @@ -35,7 +35,7 @@ environment.init = function(){ app.movements.gravity(true) - $("#map").hide() + // $("#map").hide() Rooms.init() Scenery.init() diff --git a/public/assets/javascripts/rectangles/engine/map/_map.js b/public/assets/javascripts/rectangles/engine/map/_map.js index 967e28b..b62a813 100644 --- a/public/assets/javascripts/rectangles/engine/map/_map.js +++ b/public/assets/javascripts/rectangles/engine/map/_map.js @@ -9,8 +9,8 @@ var map = new function(){ if (! base.el) return - base.dimensions = new vec2(500,500) - base.bounds = new vec2(500,500) + base.dimensions = new vec2(window.innerWidth, window.innerHeight) + base.bounds = new vec2(window.innerWidth, window.innerHeight) base.center = new vec2(0,0) base.sides = function(){ @@ -28,8 +28,8 @@ var map = new function(){ var canvas = document.createElement("canvas") var ctx = window.ctx = canvas.getContext("2d") - var w = window.w = canvas.width = 500 - var h = window.h = canvas.height = 500 + var w = window.w = canvas.width = base.dimensions.a + var h = window.h = canvas.height = base.dimensions.b document.querySelector("#map").appendChild(canvas) base.update = function(){ diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js index b2fc05f..ec60d31 100644 --- a/public/assets/javascripts/rectangles/engine/map/draw.js +++ b/public/assets/javascripts/rectangles/engine/map/draw.js @@ -22,7 +22,7 @@ map.draw = new function(){ } base.clear_canvas = function(){ - ctx.fillStyle = "rgba(255,255,255,0.99)" + ctx.fillStyle = "rgba(255,255,255,0.9)" ctx.clearRect(0,0,w,h) ctx.fillRect(0,0,w,h) } diff --git a/public/assets/javascripts/ui/BuilderView.js b/public/assets/javascripts/ui/BuilderView.js new file mode 100644 index 0000000..c91d9ee --- /dev/null +++ b/public/assets/javascripts/ui/BuilderView.js @@ -0,0 +1,23 @@ + +var BuilderView = View.extend({ + el: "#builderView", + + events: { + "click [data-role='toggle-map-view']": 'toggleMap', + "click [data-role='toggle-layout-settings']": 'toggleSettings', + }, + + load: function(){ + $("#map").show() + }, + + toggleMap: function(){ + map.toggle() + }, + + toggleSettings: function(){ + this.$(".settings").toggleClass("active") + }, + +}) + diff --git a/public/assets/javascripts/ui/EditorView.js b/public/assets/javascripts/ui/EditorView.js new file mode 100644 index 0000000..91329de --- /dev/null +++ b/public/assets/javascripts/ui/EditorView.js @@ -0,0 +1,13 @@ + +var EditorView = View.extend({ +// el: "#editorControls", + + events: { + }, + + load: function(){ + $("#map").hide() + } + +}) + diff --git a/public/assets/javascripts/ui/Router.js b/public/assets/javascripts/ui/Router.js index 85ed1aa..fe544ae 100644 --- a/public/assets/javascripts/ui/Router.js +++ b/public/assets/javascripts/ui/Router.js @@ -25,6 +25,8 @@ var Router = View.extend({ }, initialize: function(){ + this.builderView = new BuilderView() + this.editorView = new EditorView() this.signUpModal = new SignUpModal() this.signInModal = new SignInModal() this.newProjectModal = new NewProjectModal() @@ -62,11 +64,13 @@ var Router = View.extend({ launchBuilder: function(){ app.mode.builder = true app.launch() + this.builderView.load() }, launchEditor: function(){ app.mode.editor = true app.launch() + this.editorView.load() }, signup: function(e){ diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 53a198a..e5666ca 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -535,8 +535,14 @@ h5{ #hud { position: absolute; top:0;left:0; + z-index: 2; +} +#palette { + position: fixed; + bottom:20px;left:20px; z-index: 10; } + .face { background-color: #fff; transition: 0.1s background-color ease; @@ -593,6 +599,7 @@ h5{ cursor:pointer; } .vvbox { + z-index: 3; border: 1px solid; position: fixed; display: inline-block; @@ -612,6 +619,9 @@ h5{ right: 10px; top: 70px; z-index:3; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; } diff --git a/views/builder.ejs b/views/builder.ejs index 73cfa8d..b0e2004 100644 --- a/views/builder.ejs +++ b/views/builder.ejs @@ -10,7 +10,11 @@
[[ include partials/header ]] - [[ include controls/builder/toolbar ]] + +
+ [[ include controls/builder/toolbar ]] + [[ include controls/builder/settings ]] +
+ +
-
- [[ include partials/alert-modal ]] [[ include partials/confirm-modal ]] [[ include partials/sign-in ]] diff --git a/views/controls/builder/settings.ejs b/views/controls/builder/settings.ejs new file mode 100644 index 0000000..f92d1c7 --- /dev/null +++ b/views/controls/builder/settings.ejs @@ -0,0 +1,40 @@ +
+ + + +
+ +
+ +
+ +
+
+ +
+
+
+ + + + +
+
+
+ +
+
+ Clone + Clear + Delete +
+
\ No newline at end of file diff --git a/views/controls/builder/toolbar.ejs b/views/controls/builder/toolbar.ejs index 1bf87eb..1d57322 100644 --- a/views/controls/builder/toolbar.ejs +++ b/views/controls/builder/toolbar.ejs @@ -1,9 +1,29 @@ diff --git a/views/editor.ejs b/views/editor.ejs index ff27282..133cbd3 100755 --- a/views/editor.ejs +++ b/views/editor.ejs @@ -44,7 +44,6 @@ - [[ include partials/alert-modal ]] [[ include partials/confirm-modal ]] [[ include partials/sign-in ]] diff --git a/views/home.ejs b/views/home.ejs index 899aa66..26bf1d7 100755 --- a/views/home.ejs +++ b/views/home.ejs @@ -45,7 +45,6 @@ View More - [[ include partials/alert-modal ]] [[ include partials/confirm-modal ]] [[ include partials/sign-in ]] [[ include partials/footer ]] diff --git a/views/partials/header.ejs b/views/partials/header.ejs index e0e98c2..c73cc47 100644 --- a/views/partials/header.ejs +++ b/views/partials/header.ejs @@ -2,10 +2,12 @@ [[ if (logged_in) { ]] + Layouts + Projects [[ if (profile && String(user._id) == String(profile._id)) { ]] Edit Profile [[ } else if (! profile) { ]] - View Profile + Profile [[ } ]] [[ } else { ]] diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index b31b3f7..c80c174 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -55,5 +55,7 @@ + + diff --git a/views/staff.ejs b/views/staff.ejs index bc07bc2..13a0361 100644 --- a/views/staff.ejs +++ b/views/staff.ejs @@ -12,6 +12,7 @@ - rooms list - projects list + [[ include partials/confirm-modal ]] [[ include partials/footer ]] -- cgit v1.2.3-70-g09d2