From a0f8dc283b618105dbba0f25624488b55b47990a Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 30 Sep 2014 17:45:10 -0400 Subject: binding events --- public/assets/javascripts/ui/reader/ReaderView.js | 3 +++ 1 file changed, 3 insertions(+) (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index d80f225..c43dc9c 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -15,6 +15,9 @@ var ReaderView = View.extend({ if (window.location.search.indexOf("noui") !== -1) { $(".logo,.topLinks,#editorView").hide() } + else { + this.tracker = new Tracker () + } if (window.location.search.indexOf("mute") !== -1) { app.muted = true } -- cgit v1.2.3-70-g09d2 From a4eb980bcb2cce616abfb6300e1b80d8323899e4 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 30 Sep 2014 18:34:58 -0400 Subject: trackin stuff --- .../javascripts/rectangles/engine/rooms/mover.js | 4 +-- public/assets/javascripts/ui/reader/ReaderView.js | 2 ++ public/assets/javascripts/ui/reader/Tracker.js | 41 +++++++++++++++------- 3 files changed, 31 insertions(+), 16 deletions(-) (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/rectangles/engine/rooms/mover.js b/public/assets/javascripts/rectangles/engine/rooms/mover.js index 7195fcc..5c7b4af 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/mover.js +++ b/public/assets/javascripts/rectangles/engine/rooms/mover.js @@ -65,9 +65,7 @@ Rooms.mover = new function(){ // did we actually enter a room? if (intersects.length) { base.room = intersects[0] - base.room.mx_floor.forEach(function(w){ $(w.el).addClass("active") }) - base.room.mx_ceiling.forEach(function(w){ $(w.el).addClass("active") }) - base.room.mx_walls.forEach(function(w){ $(w.el).addClass("active") }) + app.tube("change-room", { room: base.room }) } } diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index c43dc9c..82db048 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -75,10 +75,12 @@ var ReaderView = View.extend({ pick: function(scenery){ this.mediaPlayer.pick(scenery) + app.tube("pick-scenery", { scenery: scenery }) }, hideExtras: function(){ this.mediaPlayer.hide() + app.tube("close-scenery") } }) diff --git a/public/assets/javascripts/ui/reader/Tracker.js b/public/assets/javascripts/ui/reader/Tracker.js index 7d9d936..beef071 100644 --- a/public/assets/javascripts/ui/reader/Tracker.js +++ b/public/assets/javascripts/ui/reader/Tracker.js @@ -17,21 +17,28 @@ var Tracker = Fiber.extend(function(base){ }, bind: function () { - // window.addEventListener("click", this.trackClick.bind(this), true) + app.on("change-wall", this.changeWall.bind(this)) + app.on("pick-scenery", this.pickScenery.bind(this)) + app.on("close-scenery", this.trackScenery.bind(this)) + app.on("change-room", this.changeRoom.bind(this)) + }, + + pushEvent: function(event){ + this.events.push(event) }, trackPageview: function(opt){ - this.events.push([ "view" ]) + this.pushEvent([ "view" ]) }, // // how long they spend in front of each wall - trackChangeWall: function(opt){ + changeWall: function(opt){ var duration = this.wallTimer.currentTime() if (this.wall_id && duration > 5000) { - this.events.push([ "wall", this.wall_id, duration ]) + this.pushEvent([ "wall", this.wall_id, duration ]) } this.wall_id = opt.wall.id this.wallTimer.start() @@ -41,14 +48,19 @@ var Tracker = Fiber.extend(function(base){ // how long the user spends on each item they click pickScenery: function(opt){ - this.sceneryTimer.start() + if (this.scenery_id && opt.scenery.id !== this.scenery_id) { + this.trackScenery() + } + else { + this.sceneryTimer.start() + } this.scenery_id = opt.scenery.id }, trackScenery: function(){ var duration = this.sceneryTimer.currentTime() if (this.scenery_id && duration > 5000) { - this.events.push([ "scenery", this.scenery_id, duration ]) + this.pushEvent([ "scenery", this.scenery_id, duration ]) } this.scenery_id = null this.sceneryTimer.reset() @@ -57,24 +69,26 @@ var Tracker = Fiber.extend(function(base){ // // how long they spend in the room - trackChangeRoom: function(opt){ + changeRoom: function(opt){ var duration = this.roomTimer.currentTime() - if (this.room_id && duration > 5000) { - this.events.push([ "room", this.room_id, duration ]) + if (this.room_id !== opt.room.id) { + if (this.room_id && duration > 5000) { + this.pushEvent([ "room", this.room_id, duration ]) + } + this.roomTimer.start() + this.room_id = opt.room.id } - this.room_id = opt.room.id - this.roomTimer.start() }, // // how many clicks per room trackClick: function(opt){ - console.log("track click") this.clicks += 1 }, save: function () { + // possibly just push to google analytics }, } @@ -101,8 +115,9 @@ var Timer = Fiber.extend(function(base){ currentTime: function(){ return this.time ? Date.now() - this.time : 0 }, - } + + return exports }) -- cgit v1.2.3-70-g09d2 From d8637f78753af20022c9b6cd55717a5f905dd0ee Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 7 Oct 2014 12:11:43 -0400 Subject: splitting wallpaper url / position --- .../assets/javascripts/rectangles/models/wall.js | 24 ++++++++++++++-------- public/assets/javascripts/ui/editor/EditorView.js | 4 ++++ public/assets/javascripts/ui/reader/ReaderView.js | 4 ++++ 3 files changed, 23 insertions(+), 9 deletions(-) (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index dc38183..dedae8b 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -68,12 +68,12 @@ }, */ mousedown: function(e){ - if (Scenery.nextMedia) { - var offset = offsetFromPoint(e, mx.el) - if (! offset) { return } + var offset = offsetFromPoint(e, mx.el) + if (! offset) { return } - var pos = base.mxOffsetToPosition( offset, index ) + var pos = base.mxOffsetToPosition( offset, index ) + if (Scenery.nextMedia) { var scenery = Scenery.addNextToWall({ wall: base, index: index, @@ -116,7 +116,7 @@ Minotaur.watch( app.router.editorView.settings ) } else { - app.controller.hideExtras() + app.controller.pickWall(base, pos) } } }) @@ -140,6 +140,7 @@ Wall.prototype.deserialize = function(data){ this.wallpaper( data.background ) + this.wallpaperPosition( data.background_x, data.background_y, data.background_scale ) } @@ -214,22 +215,27 @@ } Wall.prototype.wallpaper = function(background){ + this.background = background || "none" + this.mx.forEach(function(mx){ + mx.el.style.backgroundImage = background + }) + } + + Wall.prototype.wallpaperPosition = function(x, y, scale){ var useX = this.side & FRONT_BACK var shouldFlip = this.side & (LEFT | BACK) - - this.background = background || "none" - + this.mx.forEach(function(mx){ var partitionOffset = useX ? mx.x : mx.z if (shouldFlip) partitionOffset *= -1 partitionOffset += mx.width/2 var floorOffset = mx.y + mx.height/2 - mx.el.style.backgroundImage = background mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px" }) } + Wall.prototype.outline = function(wallColor, outlineColor){ var useX = this.side & FRONT_BACK var mx = this.mx diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js index 67687fe..f95d909 100644 --- a/public/assets/javascripts/ui/editor/EditorView.js +++ b/public/assets/javascripts/ui/editor/EditorView.js @@ -52,6 +52,10 @@ var EditorView = View.extend({ } }, + pickWall: function(wall, pos){ + this.hideExtras() + }, + hideExtras: function(){ this.mediaEditor.hide() this.textEditor.hide() diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index 82db048..5f2db0f 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -78,6 +78,10 @@ var ReaderView = View.extend({ app.tube("pick-scenery", { scenery: scenery }) }, + pickWall: function(wall, pos){ + this.hideExtras() + }, + hideExtras: function(){ this.mediaPlayer.hide() app.tube("close-scenery") -- cgit v1.2.3-70-g09d2 From 8ee5078b472cf6be20dc6d9105cc687f205fd698 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 21 Oct 2014 17:26:14 -0400 Subject: spinning around --- public/assets/javascripts/app.js | 2 - .../mx/extensions/mx.movementsMobile.js | 207 ++++++++++++++++----- public/assets/javascripts/ui/reader/ReaderView.js | 2 + 3 files changed, 162 insertions(+), 49 deletions(-) (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js index cfbe4bf..9b46a3e 100644 --- a/public/assets/javascripts/app.js +++ b/public/assets/javascripts/app.js @@ -68,8 +68,6 @@ app.launch = function () { scene.update() } - window.inAnimation = true - var loader = new Loader(function(){ $("#loader").hide() window.environment && window.environment.init() diff --git a/public/assets/javascripts/mx/extensions/mx.movementsMobile.js b/public/assets/javascripts/mx/extensions/mx.movementsMobile.js index 994c8d7..8810649 100644 --- a/public/assets/javascripts/mx/extensions/mx.movementsMobile.js +++ b/public/assets/javascripts/mx/extensions/mx.movementsMobile.js @@ -14,56 +14,169 @@ MX.MobileMovements = function (cam) { var pos = { x: 0, y: viewHeight, z: 0, rotationX: 0, rotationY: 0 } var pointX, pointY, deltaX, deltaY, distX = 0, distY = 0, absDistX = 0, absDistY = 0, startTime - - return { + + var rotationX = 0, rotationY = 0, destRotationX = 0, destRotationY = 0 + var rotationSum = 0 + var rotationMedian = 0 + var orientationMax = 0 + var samples = 0 + var sampleThreshold = 120 + var lastAlpha + + var is_portrait + + var exports = { init: function () { - document.addEventListener("touchstart", function(e){ - if (e.touches.length == 1) { - touching = true - - startTime = Date.now() - - var point = event.touches[0] - pointX = point.pageX - pointY = point.pageY - distX = distY = 0 - pos.x = cam.x - pos.z = cam.z - pos.rotationY = cam.rotationY - } - }) - document.addEventListener("touchmove", function(e){ - e.preventDefault() - if (e.touches.length == 1) { - - var timestamp = Date.now() - var point = event.touches[0] - deltaX = point.pageX - pointX - deltaY = point.pageY - pointY - - pointX = point.pageX - pointY = point.pageY - - distX += deltaX - distY += deltaY - absDistX = abs(distX) - absDistY = abs(distY) - } - }) - document.addEventListener("touchend", function(e){ - e.preventDefault() - if (e.touches.length == 0) { - touching = directionLocked = false - var timestamp = Date.now() - var duration = startTime - timestamp - if (duration < 300) { - } - } - }) + exports.orientationchange() + + document.addEventListener("touchstart", exports.touchstart) + document.addEventListener("touchmove", exports.touchmove) + document.addEventListener("touchend", exports.touchend) + window.addEventListener('orientationchange', exports.orientationchange) + window.addEventListener("devicemotion", exports.devicemotion) + window.addEventListener("deviceorientation", exports.deviceorientation) + }, + touchstart: function(e){ + if (e.touches.length == 1) { + touching = true + + startTime = Date.now() + + var point = event.touches[0] + pointX = point.pageX + pointY = point.pageY + distX = distY = 0 + pos.x = cam.x + pos.z = cam.z + pos.rotationY = cam.rotationY + } + }, + touchmove: function(e){ + e.preventDefault() + if (e.touches.length == 1) { + + var timestamp = Date.now() + var point = event.touches[0] + deltaX = point.pageX - pointX + deltaY = point.pageY - pointY + + pointX = point.pageX + pointY = point.pageY + + distX += deltaX + distY += deltaY + absDistX = abs(distX) + absDistY = abs(distY) + } + }, + touchend: function(e){ + e.preventDefault() + if (e.touches.length == 0) { + touching = directionLocked = false + var timestamp = Date.now() + var duration = startTime - timestamp + if (duration < 300) { + } + } + }, + orientationchange: function(e){ + is_portrait = window.innerWidth < window.innerHeight + if (is_portrait) { + lastAlpha = 0 + } + }, + devicemotion: function(e) { + if (! is_portrait) return; + var rotationBeta = e.rotationRate.alpha; // weird! + rotationSum += rotationBeta; + samples += 1; + }, + deviceorientation: function (e) { + if (! lastAlpha) { lastAlpha = e.alpha } + is_portrait ? exports.portraitorientation(e) : exports.landscapeorientation(e) + }, + portraitorientation: function(e) { + // compass gives most accurate orientation in portrait mode + var alpha, dx = 0, dy = 0 + + if (e.webkitCompassHeading) { + alpha = 180 - e.webkitCompassHeading; + } + else { + alpha = 180 - e.alpha; + } + + // android rotates in reverse + if (is_android) { + alpha = 360 - alpha + } + + // use rotationRate to gauge if we've tilted the screen past vertical + // for looking at ceiling + if (e.beta > orientationMax) { + orientationMax = e.beta + rotationMedian = rotationSum + } + + // this number was only going to 83 max.. not 90.. weird + var beta = e.beta + 7; + + // if we've got enough motion data, we should be able to determine + // if we've tilted backwards. otherwise, lock to the horizon. + if (! is_android && samples > sampleThreshold) { + dx = rotationSum > rotationMedian ? e.beta - 90 : 90 - e.beta + } + else { + dx = 0 + } + + // avoid jumping around in a circle + if (Math.abs(alpha - lastAlpha) < 100 || Math.abs(alpha - lastAlpha) > 300) { + dy = alpha - lastAlpha + lastAlpha = alpha + } + + // avoid jumping around in a circle #2 + if (dy > 300) { + dy -= 360 + } else if (dy < -300) { + dy += 360 + } + + destRotationX = MX.toRad(dx) + destRotationY += MX.toRad(dy) + }, + + landscapeorientation: function (e) { + var dx, dy + + dx = e.gamma > 0 ? 90 - e.gamma : 90 + e.gamma + dy = e.alpha - lastAlpha + lastAlpha = e.alpha + + // avoid the sudden jump from 0 to -360 + if (dy > 300) { + dy -= 360 + } + else if (dy < -300) { + dy += 360 + } + + destRotationX = MX.toRad(dx) + destRotationY += MX.toRad(dy) }, update: function () { + var drx, dry + + dry = (destRotationY - rotationY) / 6 + drx = (destRotationX - rotationX) / 6 + rotationY += dry + rotationX += drx + cam.rotationY = pos.rotationY += dry + cam.rotationX = pos.rotationX += drx + if (distX || distY) { var oldDistY = absDistY, oldDistX = absDistX absDistY = avg(absDistY, 0, 5) @@ -77,8 +190,7 @@ MX.MobileMovements = function (cam) { pos.x -= dy * Math.cos(pos.rotationY + Math.PI / 2) pos.z -= dy * Math.sin(pos.rotationY + Math.PI / 2) - pos.rotationY += dx / (window.innerWidth) * Math.PI / 2 - cam.rotationY = pos.rotationY + cam.rotationY = pos.rotationY += dx / (window.innerWidth) * Math.PI / 2 app.tube("move", pos) } @@ -93,6 +205,7 @@ MX.MobileMovements = function (cam) { jumpVelocity: function(n){ jumpV = clamp(n, 1, 50) }, } + return exports } diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index 5f2db0f..8531244 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -33,6 +33,8 @@ var ReaderView = View.extend({ data.media && Scenery.deserialize(data.media) data.startPosition && scene.camera.move(data.startPosition) + cam.y = window.viewHeight = data.viewHeight || app.defaults.viewHeight + var colors = data.colors || app.defaults.colors var modes = [ "wall", "outline", "floor", "ceiling" ] modes.forEach(function(mode){ -- cgit v1.2.3-70-g09d2 From 90c8c1c45a272fab86e99a2e63c72528b3a24e23 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 28 Oct 2014 16:15:47 -0400 Subject: share links --- public/assets/javascripts/ui/_router.js | 26 --------------------- .../assets/javascripts/ui/editor/ColorControl.js | 2 +- public/assets/javascripts/ui/reader/ReaderView.js | 1 + public/assets/javascripts/ui/reader/ShareView.js | 27 ++++++++++++++++++++++ public/assets/javascripts/ui/z_share.js | 25 -------------------- views/controls/reader/about-room.ejs | 10 ++++---- views/partials/meta.ejs | 18 +++++++-------- views/partials/scripts.ejs | 1 + 8 files changed, 42 insertions(+), 68 deletions(-) create mode 100644 public/assets/javascripts/ui/reader/ShareView.js delete mode 100644 public/assets/javascripts/ui/z_share.js (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/ui/_router.js b/public/assets/javascripts/ui/_router.js index c7b625a..0c95664 100644 --- a/public/assets/javascripts/ui/_router.js +++ b/public/assets/javascripts/ui/_router.js @@ -40,8 +40,6 @@ var SiteRouter = Router.extend({ "/project/:name": 'projectViewer', "/project/:name/edit": 'projectEditor', "/project/:name/view": 'projectViewer', - - "/test/wallpaper": 'testWallpaper', }, mobileRoutes: { @@ -213,29 +211,5 @@ var SiteRouter = Router.extend({ // this.documentModal.destroy(name) }, - testWallpaper: function(e){ - var content = document.getElementById("content") - content.style.width = "680px" - content.style.margin = "0 auto" - var wm = new WallpaperManager() - app.on('wallpaper-ready', function(){ - var black = [0,0,0,0] - var white = [255,255,255,1.0] - var swatches = wm.buildSwatches(black, white, 4) - document.body.style.backgroundColor = "#eee" - swatches.forEach(function(swatch){ - swatch.style.margin = "4px" - swatch.style.border = "1px solid lime" - swatch.style.backgroundColor = "#888" - content.appendChild(swatch) - swatch.onclick = function(){ - dataUrl = swatch.toDataURL() - document.body.style.backgroundImage = "url(" + dataUrl + ")" - } - }) - }) - wm.init() - }, - }) diff --git a/public/assets/javascripts/ui/editor/ColorControl.js b/public/assets/javascripts/ui/editor/ColorControl.js index 72e9fb1..d1a8c7b 100644 --- a/public/assets/javascripts/ui/editor/ColorControl.js +++ b/public/assets/javascripts/ui/editor/ColorControl.js @@ -101,7 +101,7 @@ var ColorControl = View.extend({ initialState: null, - begin: function(){ + begin: function(){ this.initialState = this.serialize() }, diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index 8531244..4c53226 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -9,6 +9,7 @@ var ReaderView = View.extend({ initialize: function(){ this.mediaPlayer = new MediaPlayer ({ parent: this }) + this.shareView = new shareView ({ parent: this }) }, load: function(name){ diff --git a/public/assets/javascripts/ui/reader/ShareView.js b/public/assets/javascripts/ui/reader/ShareView.js new file mode 100644 index 0000000..ab358e3 --- /dev/null +++ b/public/assets/javascripts/ui/reader/ShareView.js @@ -0,0 +1,27 @@ +var ShareView = View.extend({ + el: ".share", + + events: { + "click #share_facebook": "facebook", + "click #share_twitter": "twitter", + } + + initialize: function(opt){ + this.parent = opt.parent + }, + + facebook: function (e) { + e.preventDefault() + var msg = $(".roomName").html() + " on VValls" + var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(window.location.origin + window.location.pathname) + "&t=" + encodeURIComponent(msg); + window.open(url, "_blank") + }, + + twitter: function (e) { + e.preventDefault() + var msg = $(".roomName").html() + " on VValls" + var url = "https://twitter.com/home?status=" + encodeURIComponent(window.location.origin + window.location.pathname + " " + msg); + window.open(url, "_blank") + } + +} diff --git a/public/assets/javascripts/ui/z_share.js b/public/assets/javascripts/ui/z_share.js deleted file mode 100644 index d31aa89..0000000 --- a/public/assets/javascripts/ui/z_share.js +++ /dev/null @@ -1,25 +0,0 @@ -var share = { - init: function(){ - share.bind() - }, - bind: function(){ - $("#facebook").click(share.facebook) - $("#twitter").click(share.twitter) - }, - url: "http://vvalls.com/", - facebook_msg: "", - twitter_msg: "", - openLink: function (url) { - window.open(url, "_blank"); - }, - facebook: function () { - var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(share.url) + "&t=" + encodeURIComponent(share.facebook_msg); - share.openLink(url); - return false; - }, - twitter: function () { - var url = "https://twitter.com/home?status=" + encodeURIComponent(share.url + " " + share.twitter_msg); - share.openLink(url); - return false; - } -} diff --git a/views/controls/reader/about-room.ejs b/views/controls/reader/about-room.ejs index c0ca9f7..c9ad626 100644 --- a/views/controls/reader/about-room.ejs +++ b/views/controls/reader/about-room.ejs @@ -1,7 +1,7 @@

- [[- name ]], - [[- author ]] + [[- name ]], + [[- author ]]

[[ if (description) { ]] [[- description ]] @@ -11,13 +11,11 @@ [[ if (canEdit) { ]] Edit Room [[ } ]]
- - diff --git a/views/partials/meta.ejs b/views/partials/meta.ejs index 6ff45cb..c50fc01 100644 --- a/views/partials/meta.ejs +++ b/views/partials/meta.ejs @@ -18,16 +18,14 @@ - - - - - - - - - - + + + + + + + + diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 0373a3e..af16099 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -114,6 +114,7 @@ + -- cgit v1.2.3-70-g09d2 From 503c1eb313d01d3a73fac1e31b774749893b55d4 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 29 Oct 2014 12:46:02 -0400 Subject: opengraph tags --- public/assets/javascripts/ui/reader/ReaderView.js | 2 +- public/assets/javascripts/ui/reader/ShareView.js | 4 ++-- server/lib/middleware.js | 7 ++++++- server/lib/views/index.js | 10 ++++++++++ views/projects/list-projects.ejs | 1 - 5 files changed, 19 insertions(+), 5 deletions(-) (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index 4c53226..c132609 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -9,7 +9,7 @@ var ReaderView = View.extend({ initialize: function(){ this.mediaPlayer = new MediaPlayer ({ parent: this }) - this.shareView = new shareView ({ parent: this }) + this.shareView = new ShareView ({ parent: this }) }, load: function(name){ diff --git a/public/assets/javascripts/ui/reader/ShareView.js b/public/assets/javascripts/ui/reader/ShareView.js index ab358e3..35c23ca 100644 --- a/public/assets/javascripts/ui/reader/ShareView.js +++ b/public/assets/javascripts/ui/reader/ShareView.js @@ -4,7 +4,7 @@ var ShareView = View.extend({ events: { "click #share_facebook": "facebook", "click #share_twitter": "twitter", - } + }, initialize: function(opt){ this.parent = opt.parent @@ -24,4 +24,4 @@ var ShareView = View.extend({ window.open(url, "_blank") } -} +}) diff --git a/server/lib/middleware.js b/server/lib/middleware.js index 0bf16ce..870451a 100644 --- a/server/lib/middleware.js +++ b/server/lib/middleware.js @@ -40,10 +40,15 @@ var middleware = { res.locals.user = req.user || { _id: undefined } res.locals.config = config res.locals.profile = null + res.locals.ogImage = "" + res.locals.ogTitle = "Vvalls" + res.locals.ogUrl = "http://vvalls.com/" + res.locals.ogDescription = "3D gallery space, fully customizable" + res.locals.ogAuthor = "Vvalls" res.locals.opt = {} next() }, - + ensureProject: function (req, res, next) { if (req.params.slug) { Project.findOne({ slug: req.params.slug }, function(err, project){ diff --git a/server/lib/views/index.js b/server/lib/views/index.js index 5768ace..0b5a1fe 100644 --- a/server/lib/views/index.js +++ b/server/lib/views/index.js @@ -56,6 +56,10 @@ var views = module.exports = { res.redirect('/') return } + var ogImage + if (req.project.media.length && req.project.media[0].media.type == "image") { + ogImage = req.project.media[0].media.url + } res.render('reader', { name: util.sanitize(req.project.name), description: util.sanitize(req.project.description), @@ -65,6 +69,9 @@ var views = module.exports = { canEdit: req.isOwner || req.isCollaborator, editlink: "/project/" + req.project.slug + "/edit", noui: !! (req.query.noui === '1'), + ogTitle: req.project.name, + ogUrl: "http://vvalls.com/project/" + req.project.slug + "/", + ogImage: ogImage, }) }) }, @@ -159,6 +166,9 @@ var views = module.exports = { isOwnProfile: isOwnProfile, profile: user, projects: projects || [], + ogTitle: "Vvalls: Profile of " + user.displayName, + ogUrl: "http://vvalls.com/profile/" + user.username + "/", + ogImage: user.photo, }) } }, diff --git a/views/projects/list-projects.ejs b/views/projects/list-projects.ejs index 5ecaec1..2749b0e 100644 --- a/views/projects/list-projects.ejs +++ b/views/projects/list-projects.ejs @@ -9,7 +9,6 @@ [[ } else { ]] [[ } ]] - -- cgit v1.2.3-70-g09d2 From e6cac4737904750a80173ba8e7745d2b41370bd6 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 6 Nov 2014 15:48:27 -0500 Subject: share vvbox comes up when clicking save --- .../assets/javascripts/ui/editor/EditorSettings.js | 10 +++- public/assets/javascripts/ui/editor/EditorView.js | 4 ++ public/assets/javascripts/ui/reader/ReaderView.js | 1 + public/assets/javascripts/ui/reader/ShareView.js | 38 +++++++++++++-- public/assets/stylesheets/app.css | 34 ++++++++++++- views/controls/editor/collaborators.ejs | 57 +++++++--------------- views/controls/editor/share.ejs | 19 ++++++++ views/editor.ejs | 1 + 8 files changed, 116 insertions(+), 48 deletions(-) create mode 100644 views/controls/editor/share.ejs (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index 2b29961..026607a 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -110,7 +110,6 @@ var EditorSettings = FormView.extend({ clear: function(e){ e.preventDefault() - Scenery.removeAll() }, @@ -215,6 +214,7 @@ var EditorSettings = FormView.extend({ clickSave: function(){ this.toggle(false) this.save() + this.isVisible = true }, success: function(data){ @@ -226,7 +226,13 @@ var EditorSettings = FormView.extend({ Minotaur.hide() window.history.pushState(null, document.title, "/project/" + data.slug + "/edit") - + + this.parent.share.setLink( "http://vvalls.com/project/" + data.slug ) + if (this.isVisible) { + this.isVisible = false + this.parent.share.show() + } + this.parent.data = data }, diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js index 2872ab9..3773366 100644 --- a/public/assets/javascripts/ui/editor/EditorView.js +++ b/public/assets/javascripts/ui/editor/EditorView.js @@ -21,6 +21,7 @@ var EditorView = View.extend({ this.textEditor = new TextEditor ({ parent: this }) this.collaborators = new Collaborators ({ parent: this }) this.presets = new Presets ({ parent: this }) + this.share = new ShareView ({ parent: this }) }, load: function(name){ @@ -41,6 +42,8 @@ var EditorView = View.extend({ ready: function(data){ $("#map").hide() + this.data = data + this.settings.load(data) this.info.load(data) }, @@ -70,6 +73,7 @@ var EditorView = View.extend({ hideExtras: function(){ this.mediaEditor.hide() this.textEditor.hide() + this.share.hide() Scenery.resize.hide() Scenery.hovering = false } diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index c132609..9e0d21e 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -29,6 +29,7 @@ var ReaderView = View.extend({ ready: function(data){ $("#map").hide() + this.data = data data.rooms && Rooms.deserialize(data.rooms) data.walls && Walls.deserialize(data.walls) data.media && Scenery.deserialize(data.media) diff --git a/public/assets/javascripts/ui/reader/ShareView.js b/public/assets/javascripts/ui/reader/ShareView.js index 4e5f832..8a205ba 100644 --- a/public/assets/javascripts/ui/reader/ShareView.js +++ b/public/assets/javascripts/ui/reader/ShareView.js @@ -2,31 +2,59 @@ var ShareView = View.extend({ el: ".share", events: { + "keydown": "stopPropagation", "click #share_facebook": "facebook", "click #share_twitter": "twitter", + "click #share_embed": "embed", }, initialize: function(opt){ this.parent = opt.parent + this.$link = this.$("#share_link") + }, + + toggle: function(state){ + if (typeof state == "boolean") { + this.$el.toggleClass("active", state) + } + else { + this.$el.toggleClass("active") + } + }, + show: function(){ + this.toggle(true) + }, + hide: function(){ + this.toggle(false) + }, + + setLink: function(url){ + this.$link.val( url ) + }, + getLink: function(){ + var link = window.location.origin + window.location.pathname + link = link.replace(/\/edit\/?$/, "") + return link }, facebook: function (e) { e.preventDefault() - var msg = $(".roomName").html() + " on VValls" - var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(window.location.origin + window.location.pathname) + "&t=" + encodeURIComponent(msg); + var link = this.getLink() + var msg = app.controller.data.name + " on VValls" + var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(link) + "&t=" + encodeURIComponent(msg) window.open(url, "_blank") }, twitter: function (e) { e.preventDefault() - var msg = $(".roomName").html() + " on VValls" - var url = "https://twitter.com/home?status=" + encodeURIComponent(window.location.origin + window.location.pathname + " " + msg); + var link = this.getLink() + var msg = app.controller.data.name + " on VValls" + var url = "https://twitter.com/home?status=" + encodeURIComponent(link + " " + msg) window.open(url, "_blank") }, embed: function (e) { e.preventDefault() - }, }) diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 90454be..3fe9741 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -2544,13 +2544,25 @@ a[data-role="forgot-password"] { text-decoration: none; font-size: 12px; font-weight: 600; + cursor: pointer; } -.share a:nth-child(3){ +.share a:nth-child(3), .share a:nth-child(4) { margin-left:4px; } .share a:hover{ text-decoration:underline; } +.vvbox.share { + width: 300px +} +.vvbox.share #share_link { + width: 100%; + margin-top: 4px; + padding: 3px; + font-weight: 300; + font-size: 11px; +} + /* COLLABORATORS */ @@ -2639,6 +2651,26 @@ a[data-role="forgot-password"] { font-weight: 300; font-style: italic; } +#collaborator-url-rapper { + display: none; + background: #fff; + border: 1px solid; + box-shadow: -3px 3px 0; + padding: 10px; + font-weight: 300; + font-size: 14px; + margin: 10px 0; +} +#collaborator-url { + font-size: 16px; + width: 500px; + border: 1px solid; + font-size: 14px; + padding: 5px; + font-weight: 300; + margin-top: 5px; + display: block; +} /* MARCHING ANTS ANIMATION */ diff --git a/views/controls/editor/collaborators.ejs b/views/controls/editor/collaborators.ejs index b658bf6..8ad8c00 100644 --- a/views/controls/editor/collaborators.ejs +++ b/views/controls/editor/collaborators.ejs @@ -4,29 +4,29 @@
-

Collaborators

+

Collaborators

-

- To invite others to contribute to this project, submit their email address below. They'll receive an email with instructions to join this blog and register if they're not a Vvalls user yet. -

+

+ To invite others to contribute to this project, submit their email address below. They'll receive an email with instructions to join this project and register if they're not a Vvalls user yet. +

-
- - -
+
+ + +
-
- We've sent a link to join this project to . - You can also send this link yourself: - -
+
+ We've sent a link to join this project to . + You can also send this link yourself: + +
-
    -
-
+
    +
+
+
- - - diff --git a/views/controls/editor/share.ejs b/views/controls/editor/share.ejs new file mode 100644 index 0000000..97f4ceb --- /dev/null +++ b/views/controls/editor/share.ejs @@ -0,0 +1,19 @@ + + + \ No newline at end of file diff --git a/views/editor.ejs b/views/editor.ejs index 29db917..b031759 100755 --- a/views/editor.ejs +++ b/views/editor.ejs @@ -20,6 +20,7 @@ [[ include controls/editor/color-control ]] [[ include controls/editor/text-editor ]] [[ include controls/editor/collaborators ]] + [[ include controls/editor/share ]] [[ include controls/editor/settings ]] [[ include controls/editor/presets ]] -- cgit v1.2.3-70-g09d2 From 1b2f4c77e5785073fd2b75380b521e1160070488 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 7 Nov 2014 15:31:29 -0500 Subject: non-interactive embed --- public/assets/javascripts/ui/reader/EmbedView.js | 37 ++++++++++++++++++----- public/assets/javascripts/ui/reader/ReaderView.js | 36 +++++++++++++++++----- public/assets/javascripts/ui/reader/Tracker.js | 4 +-- views/controls/reader/about-room.ejs | 2 +- views/controls/reader/embed.ejs | 3 +- 5 files changed, 64 insertions(+), 18 deletions(-) (limited to 'public/assets/javascripts/ui/reader/ReaderView.js') diff --git a/public/assets/javascripts/ui/reader/EmbedView.js b/public/assets/javascripts/ui/reader/EmbedView.js index a0b3c6f..21e351c 100644 --- a/public/assets/javascripts/ui/reader/EmbedView.js +++ b/public/assets/javascripts/ui/reader/EmbedView.js @@ -6,7 +6,9 @@ var EmbedView = ModalView.extend({ "input [name=width]": "build", "input [name=height]": "build", "click [name=mute]": "build", + "click [name=interactive]": "build", "click textarea": "selectAll", + "click #test": "test", }, defaultWidth: 600, @@ -18,6 +20,7 @@ var EmbedView = ModalView.extend({ this.$width = this.$("[name=width]") this.$height = this.$("[name=height]") this.$mute = this.$("[name=mute]") + this.$interactive = this.$("[name=interactive]") this.$width.val(this.defaultWidth) this.$height.val(this.defaultHeight) @@ -29,18 +32,38 @@ var EmbedView = ModalView.extend({ }, build: function(){ + var kode = this.getEmbedCode() + this.$embedCode.val( kode ) + }, + + getEmbedCode: function(){ var mute = this.$mute.prop('checked') ? 1 : 0 + var interactive = this.$interactive.prop('checked') ? 1 : 0 var width = clamp( this.$width.int(), 0, 2000) || this.defaultWidth var height = clamp( this.$height.int(), 0, 2000) || this.defaultHeight var link = this.parent.getLink() - link += "?mute=" + mute -// link += "&noui=1" - var kode = "" + var embed_link = link + embed_link += "?mute=" + mute + embed_link += "&embed=1" + + var kode = "