summaryrefslogtreecommitdiff
path: root/public/assets/javascripts/ui
diff options
context:
space:
mode:
authorJules Laplace <jules@okfoc.us>2014-10-15 11:05:08 -0400
committerJules Laplace <jules@okfoc.us>2014-10-15 11:05:08 -0400
commit72ea86e603793ac17a9113ab031d31b369f74a4f (patch)
treedd69786d1d3ee5f62c107706d8186336fb9edc24 /public/assets/javascripts/ui
parent32f5f24b8b09998a03c88f786507ba4d58397fc7 (diff)
parentf0c06d7e9fb004e840821b502a6c46214f6757fd (diff)
merge
Diffstat (limited to 'public/assets/javascripts/ui')
-rw-r--r--public/assets/javascripts/ui/builder/BuilderInfo.js2
-rw-r--r--public/assets/javascripts/ui/editor/EditorSettings.js1
-rw-r--r--public/assets/javascripts/ui/editor/EditorToolbar.js1
-rw-r--r--public/assets/javascripts/ui/editor/EditorView.js1
-rw-r--r--public/assets/javascripts/ui/editor/LightControl.js1
-rw-r--r--public/assets/javascripts/ui/editor/MediaUpload.js4
-rw-r--r--public/assets/javascripts/ui/editor/MediaViewer.js42
-rw-r--r--public/assets/javascripts/ui/editor/Presets.js30
-rw-r--r--public/assets/javascripts/ui/editor/TextEditor.js5
-rw-r--r--public/assets/javascripts/ui/lib/ModalView.js8
10 files changed, 79 insertions, 16 deletions
diff --git a/public/assets/javascripts/ui/builder/BuilderInfo.js b/public/assets/javascripts/ui/builder/BuilderInfo.js
index 196eca6..67834e7 100644
--- a/public/assets/javascripts/ui/builder/BuilderInfo.js
+++ b/public/assets/javascripts/ui/builder/BuilderInfo.js
@@ -34,7 +34,7 @@ var BuilderInfo = View.extend({
},
load: function(data){
- this.$viewHeight.unitVal( data.viewHeight || app.defaults.viewHeight )
+ this.$viewHeight.unitVal( window.viewHeight = data.viewHeight || app.defaults.viewHeight )
this.$units.val( "ft" )
this.$unitName.html( "ft" )
},
diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js
index 0c68de5..ac361a7 100644
--- a/public/assets/javascripts/ui/editor/EditorSettings.js
+++ b/public/assets/javascripts/ui/editor/EditorSettings.js
@@ -170,6 +170,7 @@ var EditorSettings = FormView.extend({
fd.append( "name", this.$name.val() )
fd.append( "description", this.$description.val() )
fd.append( "privacy", this.$privacy.filter(":checked").val() == "private" )
+ fd.append( "viewHeight", window.viewHeight )
fd.append( "rooms", JSON.stringify( Rooms.serialize() ) )
fd.append( "walls", JSON.stringify( Walls.serialize() ) )
fd.append( "colors", JSON.stringify( Walls.colors ) )
diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js
index 9837304..4f07d1f 100644
--- a/public/assets/javascripts/ui/editor/EditorToolbar.js
+++ b/public/assets/javascripts/ui/editor/EditorToolbar.js
@@ -9,7 +9,6 @@ var EditorToolbar = View.extend({
"click [data-role='toggle-project-settings']": 'toggleSettings',
"click [data-role='open-media-viewer']": 'openMediaViewer',
"click [data-role='toggle-presets']": 'togglePresets',
-// "click [data-role='destroy-media']": 'destroyMedia',
"click [data-role='toggle-wallpaper-panel']": 'toggleWallpaper',
"click [data-role='toggle-light-control']": 'toggleLightControl',
"click [data-role='toggle-text-editor']": 'toggleTextEditor',
diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js
index 6aff601..ccd6c63 100644
--- a/public/assets/javascripts/ui/editor/EditorView.js
+++ b/public/assets/javascripts/ui/editor/EditorView.js
@@ -41,6 +41,7 @@ var EditorView = View.extend({
$("#map").hide()
this.settings.load(data)
+ this.info.load(data)
},
readyLayout: function(data){
diff --git a/public/assets/javascripts/ui/editor/LightControl.js b/public/assets/javascripts/ui/editor/LightControl.js
index 3eb2861..34a5a51 100644
--- a/public/assets/javascripts/ui/editor/LightControl.js
+++ b/public/assets/javascripts/ui/editor/LightControl.js
@@ -64,6 +64,7 @@ var LightControl = View.extend({
pick: function(rgb, Lab){
this.labColor = Lab
this.setSwatchColor(this.mode, rgb)
+ // console.log(rgb)
Walls.setColor[ this.mode ](rgb)
},
diff --git a/public/assets/javascripts/ui/editor/MediaUpload.js b/public/assets/javascripts/ui/editor/MediaUpload.js
index fddfefc..9799f99 100644
--- a/public/assets/javascripts/ui/editor/MediaUpload.js
+++ b/public/assets/javascripts/ui/editor/MediaUpload.js
@@ -55,9 +55,7 @@ var MediaUpload = UploadView.extend({
add: function(media){
console.log(media)
- this.parent.mediaViewer.add(media, this.parent.mediaViewer.$myMedia)
- this.parent.mediaViewer.$deleteMedia.show()
- this.parent.mediaViewer.$noMedia.hide()
+ this.parent.mediaViewer.addUploadedMedia(media)
},
beforeUpload: function(){
diff --git a/public/assets/javascripts/ui/editor/MediaViewer.js b/public/assets/javascripts/ui/editor/MediaViewer.js
index c18fb49..10819af 100644
--- a/public/assets/javascripts/ui/editor/MediaViewer.js
+++ b/public/assets/javascripts/ui/editor/MediaViewer.js
@@ -4,23 +4,30 @@ var MediaViewer = ModalView.extend({
destroyAction: "/api/media/destroy",
usesFileUpload: true,
loaded: false,
-
+ perPage: 12,
+ offset: 0,
+ fixedClose: true,
+
events: {
'mousedown': "stopPropagation",
'click .foundToggle': "foundToggle",
'click .userToggle': "userToggle",
'click #deleteMedia': "deleteArmed",
'click .mediaContainer': "pick",
+ 'click .viewMore': "load",
},
initialize: function(opt){
this.__super__.initialize.call(this)
this.parent = opt.parent
this.$myMedia = this.$(".myMedia")
+ this.$myMediaContainer = this.$(".myMedia > .container")
this.$userToggle = this.$(".userToggle")
this.$foundMedia = this.$(".foundMedia")
+ this.$foundMediaContainer = this.$(".foundMedia > .container")
this.$foundToggle = this.$(".foundToggle")
this.$deleteMedia = this.$("#deleteMedia")
+ this.$viewMore = this.$(".viewMore")
this.$noMedia = this.$(".noMedia")
},
@@ -55,7 +62,7 @@ var MediaViewer = ModalView.extend({
},
load: function(){
- $.get("/api/media/user", this.populate.bind(this))
+ $.get("/api/media/user", { offset: this.offset, limit: this.perPage }, this.populate.bind(this))
},
loadTrending: function(){
@@ -85,7 +92,7 @@ var MediaViewer = ModalView.extend({
width: img.naturalWidth,
height: img.naturalHeight,
}
- this.add(media, this.$foundMedia)
+ this.add(media, this.$foundMediaContainer)
}.bind(this)
img.src = url
if (img.complete && ! loaded) { img.onload() }
@@ -100,22 +107,40 @@ var MediaViewer = ModalView.extend({
},
populate: function(data){
- this.loaded = true
+ var scrollTop = this.loaded ? $('.myMedia .container').height() : 0
if (data && data.length) {
+ if (data.length < this.perPage) {
+ this.$viewMore.hide()
+ }
data.forEach(function(media){
- this.add(media, this.$myMedia)
+ this.add(media, this.$myMediaContainer)
+ this.offset += 1
}.bind(this))
this.$noMedia.hide()
this.$deleteMedia.show()
}
else {
+ this.$viewMore.hide()
this.$noMedia.show()
this.$deleteMedia.hide()
}
- this.__super__.show.call(this)
+ if (this.loaded) {
+ this.$el.delay(300).animate({ scrollTop: scrollTop }, 200)
+ }
+ else {
+ this.loaded = true
+ this.__super__.show.call(this)
+ }
+ },
+
+ addUploadedMedia: function(media){
+ this.parent.mediaViewer.$deleteMedia.show()
+ this.parent.mediaViewer.$noMedia.hide()
+ this.add(media, this.$myMedia, true) // prepend
+ this.offset += 1
},
- add: function(media, $container){
+ add: function(media, $container, prepend){
var image = new Image ()
var $span = $("<span>")
$span.addClass("mediaContainer")
@@ -142,7 +167,8 @@ var MediaViewer = ModalView.extend({
$span.data("media", media)
$span.append(image)
- $container.prepend($span)
+ if (prepend) $container.prepend($span)
+ else $container.append($span)
},
deleteIsArmed: false,
diff --git a/public/assets/javascripts/ui/editor/Presets.js b/public/assets/javascripts/ui/editor/Presets.js
index a7e92b6..1e70aa2 100644
--- a/public/assets/javascripts/ui/editor/Presets.js
+++ b/public/assets/javascripts/ui/editor/Presets.js
@@ -2,8 +2,26 @@ var Presets = View.extend({
el: "#presets",
events: {
+ "mousedown": "stopPropagation",
"click .presets span": "selectPreset",
+ "click .swatches span": "selectColor",
},
+
+ colors: [
+ [255,94,58],
+ [255,149,0],
+ [255,219,76],
+ [76,217,100],
+ [52,170,220],
+ [29,98,240],
+ [198,68,252],
+ [0,0,0],
+ [74,74,74],
+ [125,126,127],
+ [209,211,212],
+ [235,235,235],
+ [255,255,255],
+ ],
presets: {
wireframe: {
@@ -34,6 +52,13 @@ var Presets = View.extend({
initialize: function(opt){
this.parent = opt.parent
+ this.$colors = this.$(".colors")
+ this.colors.forEach(function(color){
+ var $swatch = $("<span>")
+ $swatch.css("background-color","rgb(" + color + ")")
+ $swatch.data('color', color)
+ this.$colors.append($swatch)
+ }.bind(this))
},
toggle: function(state){
@@ -56,4 +81,9 @@ var Presets = View.extend({
$(e.currentTarget).addClass('active')
},
+ selectColor: function(e){
+ var preset = $(e.currentTarget).data('color')
+ console.log(preset)
+ },
+
}) \ No newline at end of file
diff --git a/public/assets/javascripts/ui/editor/TextEditor.js b/public/assets/javascripts/ui/editor/TextEditor.js
index c8879b3..b559ba5 100644
--- a/public/assets/javascripts/ui/editor/TextEditor.js
+++ b/public/assets/javascripts/ui/editor/TextEditor.js
@@ -28,16 +28,15 @@ var TextEditor = FormView.extend({
},
toggle: function(state){
- $("#keyhint").fadeOut(200)
-
this.$el.toggleClass("active", state)
if (state) {
+ $("#keyhint").fadeOut(200)
Scenery.nextMedia = {
type: 'text',
width: 600,
height: 450,
scale: 0.5,
- font: { family: 'Lato', size: 12, align: 'left' },
+ font: { family: 'Lato', size: 24, align: 'left', color: "#000" },
}
this.createMode(true)
}
diff --git a/public/assets/javascripts/ui/lib/ModalView.js b/public/assets/javascripts/ui/lib/ModalView.js
index d9b518a..1c41861 100644
--- a/public/assets/javascripts/ui/lib/ModalView.js
+++ b/public/assets/javascripts/ui/lib/ModalView.js
@@ -18,6 +18,10 @@ var ModalView = View.extend({
if (! this.usesFileUpload) {
$(".fileUpload").removeClass("active")
}
+ if (this.fixedClose) {
+ $("#fixed_close").addClass("active")
+ $("#fixed_close").bind("click", this.hide.bind(this))
+ }
this.$el.addClass("active")
$("body").addClass("noOverflow")
@@ -25,6 +29,10 @@ var ModalView = View.extend({
hide: function(){
// $(".mediaDrawer, .room1").removeClass("active editing");
+ if (this.fixedClose) {
+ $("#fixed_close").removeClass("active")
+ $("#fixed_close").unbind("click", this.hide.bind(this))
+ }
this.$el.removeClass("active");
$("body").removeClass("noOverflow");
},