skeleton in place.

This commit is contained in:
danielgrippi 2012-04-11 18:51:21 -07:00 committed by Dennis Collinson
parent 579785c120
commit 6d9dd1f4d3
13 changed files with 294 additions and 6 deletions

View file

@ -0,0 +1,16 @@
app.pages.Profile = app.views.Base.extend({
templateName : "profile",
subviews : {
"#canvas" : "canvasView"
},
initialize : function() {
this.initViews()
},
initViews : function() {
this.canvasView = new app.views.Canvas()
}
});

View file

@ -12,9 +12,11 @@ app.Router = Backbone.Router.extend({
"commented": "stream",
"liked": "stream",
"mentions": "stream",
"people/:id": "stream",
"people/:id": "profile",
"u/:name": "profile",
"people/:id/photos": "photos",
"u/:name": "stream",
"followed_tags": "stream",
"tags/:name": "stream",
@ -24,7 +26,16 @@ app.Router = Backbone.Router.extend({
"framer": "framer"
},
stream : function() {
profile : function(page) {
this.isExperimental(page) ? this.newProfile() : this.stream()
},
newProfile : function() {
app.page = new app.pages.Profile();
$("#container").html(app.page.render().el)
},
stream : function(page) {
app.stream = new app.models.Stream();
app.stream.fetch();
app.page = new app.views.Stream({model : app.stream});
@ -57,6 +68,10 @@ app.Router = Backbone.Router.extend({
singlePost : function(id) {
var page = new app.pages.PostViewer({ id: id });
$("#container").html(page.el);
},
isExperimental : function(query) {
return query.search("ex=true") != -1
}
});

View file

@ -44,6 +44,7 @@ app.views.Base = Backbone.View.extend({
if(!this.template) {
console.log(this.templateName ? ("no template for " + this.templateName) : "no templateName specified")
}
this.$el
.html(this.template(presenter))
.attr("data-template", _.last(this.templateName.split("/")));

View file

@ -0,0 +1,14 @@
app.views.Canvas = app.views.Base.extend({
templateName : 'canvas',
postRenderTemplate : function() {
setTimeout(_.bind(this.mason, this), 0)
},
mason : function() {
this.$el.isotope({
itemSelector : '.canvas-frame'
})
}
})

View file

@ -19,6 +19,7 @@
//= require jquery.idle-timer
//= require jquery.infinitescroll-custom
//= require jquery.autocomplete-custom
//= require jquery.isotope.min
//= require keycodes
//= require fileuploader-custom
//= require handlebars-1.0.0.beta.6

View file

@ -1,5 +1,10 @@
@import 'mixins';
/* mainly for the post viewer & composer */
@import 'new_styles/base';
@import 'new_styles/composer';
@import 'new_styles/interactions';
@import 'new_styles/viewer_nav';
/* profile */
@import 'new_styles/canvas';

View file

@ -0,0 +1,35 @@
body {
background-color : #F6F6F6;
}
#canvas {
margin-top : 100px;
}
.canvas-frame {
float: left;
margin: 10px;
width: 270px;
.content {
@include box-shadow(0,1px,3px,rgba(0,0,0,0.2));
background-color : #fff;
min-height : 180px;
max-height : 180px;
overflow : hidden;
padding : 10px;
margin-bottom : 5px;
}
/* larger declarations */
&.x2.width {
width : 560px;
}
&.x2.height .content {
min-height : 429px;
max-height : 429px;
}
}

View file

@ -0,0 +1,173 @@
<div class="canvas-frame">
<div class="content">
<img src="https://joindiaspora.s3.amazonaws.com/uploads/images/scaled_full_bb076dd0d45f0caa4478.gif"/>
</div>
<div class="info">
Daniel Grippi
</div>
</div>
<div class="canvas-frame width x2">
<div class="content">
<p>
Here, he discusses how globalisation has exacerbated income inequalities and the control over politics exerted by the rich, citing the Occupy movement which he describes as a 'public relations hazard not a health hazard'
</p>
<p>
Echo park wolf kale chips sunt, dolor scenester deserunt ad cray leggings 3 wolf moon thundercats direct trade. Banksy placeat odd future et, ex gastropub elit whatever. Messenger bag eu fanny pack, pitchfork locavore four loko yr marfa forage. Mcsweeney's hoodie terry richardson exercitation, consectetur commodo banh mi ullamco laboris cliche raw denim salvia selvage in nulla. Lo-fi chambray culpa, dreamcatcher fugiat squid portland nihil high life. Quis VHS blog sunt sint, salvia wes anderson fingerstache portland eiusmod ex consectetur synth enim. Tattooed aliquip proident id, lomo aliqua qui pitchfork hella cosby sweater pariatur vero. </p>
</div>
<div class="info">
Dennis Collinson
</div>
</div>
<div class="canvas-frame">
<div class="content">
<img src="https://joindiaspora.s3.amazonaws.com/uploads/images/scaled_full_7dbfea26846d99848aac.jpg"/>
</div>
<div class="info">
Sarah Mei
</div>
</div>
<div class="canvas-frame">
<div class="content">
<h1>
sometimes, i say things loud.
</h1>
</div>
<div class="info">
Sean Tilley
</div>
</div>
<div class="canvas-frame height x2">
<div class="content">
<h1>
this is a longish status but i don't have that much to say. i guess i can keep on typing or something like that or make this a run-on sentance.
</h1>
</div>
<div class="info">
Daniel Grippi
</div>
</div>
<div class="canvas-frame width x2">
<div class="content">
<p>
Echo park wolf kale chips sunt, dolor scenester deserunt ad cray leggings 3 wolf moon thundercats direct trade. Banksy placeat odd future et, ex gastropub elit whatever. Messenger bag eu fanny pack, pitchfork locavore four loko yr marfa forage. Mcsweeney's hoodie terry richardson exercitation, consectetur commodo banh mi ullamco laboris cliche raw denim salvia selvage in nulla. Lo-fi chambray culpa, dreamcatcher fugiat squid portland nihil high life. Quis VHS blog sunt sint, salvia wes anderson fingerstache portland eiusmod ex consectetur synth enim. Tattooed aliquip proident id, lomo aliqua qui pitchfork hella cosby sweater pariatur vero.
</p>
</div>
<div class="info">
Dennis Collinson
</div>
</div>
<div class="canvas-frame height width x2">
<div class="content">
<img src="http://24.media.tumblr.com/tumblr_lzwkez5ew31qzxz2so1_500.jpg"/>
</div>
<div class="info">
Sarah Mei
</div>
</div>
<div class="canvas-frame">
<div class="content">
<h1>
#weinerjuice
</h1>
</div>
<div class="info">
Sean Tilley
</div>
</div>
<div class="canvas-frame width x2">
<div class="content">
<img src="http://hipsteripsum.wpengine.netdna-cdn.com/wp-content/uploads/2011/08/cropped-asian_hipster.jpg"/>
</div>
<div class="info">
Rosanna Yau
</div>
</div>
<div class="canvas-frame height x2">
<div class="content">
<h3>
Banksy placeat odd future et, ex gastropub elit whatever. Messenger bag eu fanny pack, pitchfork locavore four loko yr marfa forage. Mcsweeney's hoodie terry richardson exercitation, consectetur commodo banh mi ullamco laboris cliche raw denim salvia selvage
Banksy placeat odd future et, ex gastropub elit whatever. Messenger bag eu fanny pack, pitchfork.
</h3>
</div>
<div class="info">
Sarah Mei
</div>
</div>
<div class="canvas-frame width height x2">
<div class="content">
<img src="http://28.media.tumblr.com/tumblr_m02dfqdQT31qfzxa7o1_500.jpg"/>
</div>
<div class="info">
Daniel Grippi
</div>
</div>
<div class="canvas-frame">
<div class="content">
<p>
Banksy placeat odd future et, ex gastropub elit whatever. Messenger bag eu fanny pack, pitchfork locavore four loko yr marfa forage. Mcsweeney's hoodie terry richardson exercitation, consectetur commodo banh mi ullamco laboris cliche raw denim salvia selvage
</p>
</div>
<div class="info">
Daniel Grippi
</div>
</div>
<div class="canvas-frame">
<div class="content">
<h1>
skribblex.
</h1>
</div>
<div class="info">
Rosanna Yau
</div>
</div>
<div class="canvas-frame height x2">
<div class="content">
<img src="http://28.media.tumblr.com/tumblr_ln5654hJrs1qd33kzo1_1280.jpg"/>
</div>
<div class="info">
Sarah Mei
</div>
</div>
<div class="canvas-frame">
<div class="content">
hey there kids!
</div>
<div class="info">
Daniel Grippi
</div>
</div>
<div class="canvas-frame width x2">
<div class="content">
<iframe width="100%" height="450" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Fplaylists%2F1821180&show_artwork=true"></iframe>
</div>
<div class="info">
Rosanna Yau
</div>
</div>

View file

@ -0,0 +1,8 @@
<div class="container">
<h2>
Daniel Grippi
</h2>
<div id="canvas"></div>
</div>

View file

@ -120,7 +120,14 @@ class PeopleController < ApplicationController
end
respond_to do |format|
format.all { respond_with @person, :locals => {:post_type => :all} }
format.all do
if params[:ex]
@page = :experimental
render 'experimental', :layout => 'post'
else
respond_with @person, :locals => {:post_type => :all}
end
end
format.json{ render_for_api :backbone, :json => @stream.stream_posts, :root => :posts }
end
end

View file

@ -46,6 +46,8 @@ module LayoutHelper
end
def current_user_atom_tag
return #temp hax
return unless @person.present?
content_tag(:link, '', :rel => 'alternate', :href => "#{@person.public_url}.atom", :type => "application/atom+xml", :title => t('.public_feed', :name => @person.name))
end
@ -61,7 +63,7 @@ module LayoutHelper
end
def include_base_css_framework(use_bootstrap=false)
if use_bootstrap || @aspect == :getting_started || @page == :logged_out
if use_bootstrap || @aspect == :getting_started || @page == :logged_out || @page == :experimental
stylesheet_link_tag 'bootstrap-complete'
else
stylesheet_link_tag 'blueprint', :media => 'screen'

View file

File diff suppressed because one or more lines are too long