Created
October 11, 2012 18:17
-
-
Save elbuo8/3874432 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div id="left-pane"> | |
<h1 id="product_name">{{product_name}}</h1> | |
{{#if photos}} | |
<div class="carousel-wrapper"> | |
<a href="#" class="carousel-btn prev" id="prev"><img src="images/prev.png"></a> | |
<a href="#" class="carousel-btn next" id="next"><img src="images/next.png"></a> | |
<ul id="carousel"> | |
{{#photos}} | |
<li><img src="{{.}}"></li> | |
{{/photos}} | |
</ul> | |
</div> | |
{{/if}} | |
<div id="description"> | |
{{description}} | |
</div> | |
</div> | |
<div id="right-pane"> | |
<div class="side-block" id="price-block"> | |
<ul> | |
<li><a href="#" class="button buy-now">Buy Now</a></li> | |
<form id="paypal" name="_xclick" action="https://www.paypal.com/cgi-bin/webscr" method="post"> | |
<input type="hidden" name="cmd" value="_xclick"> | |
<input type="hidden" name="business" value={{email}}> | |
<input type="hidden" name="currency_code" value="USD"> | |
<input type="hidden" name="item_name" value={{product_name}}> | |
<input type="hidden" name="amount" value={{price}}> | |
</form> | |
<li class="label title price">Price</li> | |
<li class="label content price">${{price}}</li> | |
<li class="label content shipping">{{#if shipping}}+ <strong>${{shipping}}</strong> for shipping{{/if}}</li> | |
<li class="share"> | |
<ul> | |
<li class="facebook"> | |
<div class="fb-like" data-send="false" data-layout="button_count" data-width="80" data-show-faces="false"></div> | |
</li> | |
<li class="twitter"> | |
<a href="https://twitter.com/share" class="twitter-share-button" data-via="TheSoloStand" data-related="TheSoloStand" data-count="none">Tweet</a> | |
</li> | |
<li class="plus"><g:plusone size="medium" annotation="inline" width="120"></g:plusone></li> | |
<li class="pinterest"> | |
<a href="http://pinterest.com/pin/create/button/?url={{location}}&media=http%3A%2F%2F" class="pin-it-button" count-layout="none"><img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" /></a> | |
</li> | |
</ul> | |
</li> | |
</ul> | |
</div> | |
<div class="side-block" id="seller-info"> | |
<div class="contact-icon"><a href="#"><img src="images/mail.png"></a></div> | |
<ul> | |
<li class="label title">Seller</li> | |
<li class="label content name">{{name}}</li> | |
<li class="label title">Phone</li> | |
<li class="label content phone">{{phone}}</li> | |
</ul> | |
</div> | |
<div class="side-block" id="banner"> | |
<h2>Make a free sales page like this one</h2> | |
<a href="/">Get Started</a> | |
</div> | |
<div class="side-block" id="utility-belt"> | |
<h3>Powered by <a href="/">SoloStand</a></h3> | |
<div class="settings-cog"><a href="#" class="settings"><img src="images/cog.png"></a></div> | |
</div> | |
</div> | |
VIEWWWWW | |
View = require './view' | |
template = require './templates/page' | |
Page = require 'models/page_model' | |
PageModalView = require './page_modal_view' | |
ButtonHelper = require 'lib/share_buttons_helper' | |
module.exports = class PageView extends View | |
id: 'page-view' | |
template: template | |
events: | |
'click .settings': 'openSettings' | |
'click .buy-now': 'buyNow' | |
initialize: -> | |
@user = application.user | |
buyNow: (e) -> | |
document.paypal.submit() | |
openSettings: (e) -> | |
e.preventDefault() | |
if @user | |
if @user.id == @model.get('owner').id | |
# User is the owner | |
@pageModal = new PageModalView({model:@model}) | |
$('body').prepend @pageModal.render().el | |
$('left-pane').css | |
'overflow': 'hidden' | |
else | |
# User is not the owner | |
console.log 'This is not your page dude' | |
else | |
# We don't have a user | |
console.log 'Do login' | |
getRenderData: (pageId) -> | |
_page = Page | |
query = new Parse.Query(_page) | |
d = $.Deferred() | |
query.get pageId, | |
success: (page) => | |
@model = page | |
# Render Tempalte | |
@$el.html @template page.toJSON() | |
document.title = "#{page.toJSON().product_name} on SoloStand" | |
# Return | |
d.resolve(this) | |
error: (page, error) => | |
router = application.router | |
router.navigate '404', trigger: true | |
d.reject(error) | |
return d | |
render: (pageId) -> | |
$.when(@getRenderData(pageId)).done (page) => | |
@afterRender() | |
update: (page) -> | |
window.location.reload() | |
afterRender: -> | |
# Carousel | |
@$el.find('#carousel').simplecarousel( | |
next: @$el.find('.next'), | |
prev: @$el.find('.prev'), | |
slidespeed: 700, | |
width: 600, | |
height: 600, | |
pagination: true | |
) | |
# Share Button init | |
ButtonHelper.facebook() | |
ButtonHelper.twitter() | |
ButtonHelper.gplus() | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment