diff --git a/app/assets/javascripts/app/pages/profile.js b/app/assets/javascripts/app/pages/profile.js index 38b80d473..1c569f776 100644 --- a/app/assets/javascripts/app/pages/profile.js +++ b/app/assets/javascripts/app/pages/profile.js @@ -10,6 +10,12 @@ app.pages.Profile = app.views.Base.extend({ "#canvas" : "canvasView" }, + events : { + "click #edit-mode-toggle" : "toggleEdit" + }, + + editMode : false, + initialize : function(options) { this.model = new app.models.Profile.findByGuid(options.personId) this.stream = options && options.stream || new app.models.Stream() @@ -17,5 +23,12 @@ app.pages.Profile = app.views.Base.extend({ this.model.bind("change", this.render, this) //this should go on profile info view when it gets Extracted this.canvasView = new app.views.Canvas({model : this.stream}) + }, + + toggleEdit : function(evt) { + if(evt) { evt.preventDefault() } + this.editMode = !this.editMode + this.$el.toggleClass("edit-mode") } + }); \ No newline at end of file diff --git a/app/assets/javascripts/app/views/small_frame.js b/app/assets/javascripts/app/views/small_frame.js index ba490ce91..ff384e1fa 100644 --- a/app/assets/javascripts/app/views/small_frame.js +++ b/app/assets/javascripts/app/views/small_frame.js @@ -5,6 +5,7 @@ app.views.SmallFrame = app.views.Base.extend({ templateName : "small-frame", events : { + "click .fav" : "favoritePost", "click .content" : "goToPost" }, @@ -19,6 +20,9 @@ app.views.SmallFrame = app.views.Base.extend({ }, dimensionsClass : function() { + /* by default, make it big if it's a fav */ + if(this.model.get("favorite")) { return "x2 width height" } + var firstPhoto = this.model.get("photos")[0] , className = "photo "; @@ -48,35 +52,16 @@ app.views.SmallFrame = app.views.Base.extend({ } }, -// textClass : function(){ -// var textLength = this.model.get("text").length -// , baseClass = "text "; -// -// if(textLength <= 20){ -// return baseClass + "extra-small" -// } else if(textLength <= 140) { -// return baseClass + "small" -// } else if(textLength <= 500) { -// return baseClass + "medium" -// } else { -// return baseClass + "large" -// } -// }, -// -// photoClass : function(){ -// var photoCount = this.model.get('photos').length -// , baseClass = "photo "; -// -// if(photoCount == 0 ) { -// return "" -// } else if(photoCount == 1){ -// return baseClass + 'one' -// } else if(photoCount == 2 ) { -// return baseClass + 'two' -// } else { -// return baseClass + 'many' -// } -// }, + favoritePost : function(evt) { + if(evt) { evt.stopImmediatePropagation(); evt.preventDefault() } + + if(this.model.get("favorite")) { + this.model.save({favorite : false}) + } else { + this.model.save({favorite : true}) + this.$el.addClass("x2 width height") + } + }, goToPost : function() { app.router.navigate(this.model.url(), true) diff --git a/app/assets/stylesheets/new-templates.css.scss b/app/assets/stylesheets/new-templates.css.scss index 6baf8f48e..2b7896741 100644 --- a/app/assets/stylesheets/new-templates.css.scss +++ b/app/assets/stylesheets/new-templates.css.scss @@ -8,4 +8,5 @@ /* profile */ @import 'new_styles/canvas'; -@import 'new_styles/spinner'; \ No newline at end of file +@import 'new_styles/spinner'; +@import 'new_styles/profile'; \ No newline at end of file diff --git a/app/assets/stylesheets/new_styles/_canvas.scss b/app/assets/stylesheets/new_styles/_canvas.scss index 2057f3028..97240839e 100644 --- a/app/assets/stylesheets/new_styles/_canvas.scss +++ b/app/assets/stylesheets/new_styles/_canvas.scss @@ -96,6 +96,13 @@ body { } } + .fav { + position : absolute; + z-index : 100; + top : 10px; + right : 10px; + } + /* larger declarations */ &.x2.width .content { @include wide(); } &.x2.height .content { @include tall(); } diff --git a/app/assets/stylesheets/new_styles/_profile.scss b/app/assets/stylesheets/new_styles/_profile.scss new file mode 100644 index 000000000..f814d0c30 --- /dev/null +++ b/app/assets/stylesheets/new_styles/_profile.scss @@ -0,0 +1,36 @@ +#edit-controls { + @include transition(opacity); + @include opacity(0); + + position : fixed; + + width : 100%; + top : 0; + left : 0; + + text-align : center; + + z-index : 999; + background-color : rgba(0,0,0,0.6); + + color : #eee; + + padding : 10px 0; +} + +.canvas-frame .fav { + @include transition(opacity); + @include opacity(0) +} + +/* functionality under edit mode */ +.edit-mode { + #edit-controls { + @include opacity(1); + //display : block; + } + + .canvas-frame .fav { + @include opacity(1) + } +} \ No newline at end of file diff --git a/app/assets/templates/profile.jst.hbs b/app/assets/templates/profile.jst.hbs index 6a0bb109f..7e4d64802 100644 --- a/app/assets/templates/profile.jst.hbs +++ b/app/assets/templates/profile.jst.hbs @@ -1,3 +1,7 @@ +