Font Awesome, jbuilder templates, getting rid of beatparser

2012-09-09 17:48:24 +04:00
parent be5a643b55
commit 9cb145f0d7
42 changed files with 520 additions and 233 deletions
@@ -7,6 +7,6 @@ $ ->
    $(".player").animate(width: 518)

  window.desired = $(".navbar-search input").autocomplete
-    serviceUrl: "/api/search/complete"
+    serviceUrl: "/api/search/complete.json"
    onSelect: (selected) ->
      Backbone.history.navigate("/search/"+selected.replace(/\s/g, "+"), true)
@@ -14,6 +14,7 @@ window.BeatHaven =
  User: null

  init: ->
+    new BeatHaven.Routers.Main()
    new BeatHaven.Routers.Artist()
    new BeatHaven.Routers.Album()
    new BeatHaven.Routers.Search()
@@ -21,7 +22,7 @@ window.BeatHaven =
    @User = new BeatHaven.Models.User()
    @VK = new BeatHaven.Models.VK()

-    @VK.init()
+    # @VK.init()

    Backbone.history.start(pushState: true);
    $("a").live "click", (e) ->
@@ -30,6 +31,8 @@ window.BeatHaven =
        Backbone.history.navigate($(this).attr("href"), true)
      false

+    # Backbone.history.navigate("/tour", true)
+
  log: (data) ->
    console.log data

@@ -2,6 +2,7 @@ class BeatHaven.Models.VK extends Backbone.Model

  session_length: 3600 # seconds
  Music: null
+  BITMASK: 8

  popup: ->
    alert(1)
@@ -13,12 +14,13 @@ class BeatHaven.Models.VK extends Backbone.Model
    BH.VK.auth()
    # VK.Widgets.Like("vk-like", {type: "mini", height: 20, pageUrl: "http://beathaven.org/", text: "Like"})

-  auth: ->
+  auth: (callback) ->
    BH.log "Requesting new Vkontakte session ..."
    window.VK.Auth.getLoginStatus (response) ->
      BH.VK.auth_info(response)
+      callback() if callback?
      false
-    , 8
+    , window.BH.VK.BITMASK
    false

  auth_info: (response) ->
@@ -38,6 +40,7 @@ class BeatHaven.Models.VK extends Backbone.Model
    else
      BH.log "Not authorized"

+
  set_favorites: ->
    window.VK.Api.call "audio.get", uid: BH.User.vk_id(), (response) ->
      BH.User.set_favorites(response.response)
@@ -3,7 +3,7 @@ class BeatHaven.Routers.Artist extends Backbone.Router
    "artist/:name": "show"

  show: (name) ->
-    artist = new BeatHaven.Models.Artist(id: name)
+    artist = new BeatHaven.Models.Artist(id: name.replace(/\s|%2BF/g, "+"))
    artist.fetch()
    view = new BeatHaven.Views.ArtistShow(model: artist)
    $("#main").html(view.render().el)
@@ -0,0 +1,7 @@
+class BeatHaven.Routers.Main extends Backbone.Router
+  routes:
+    "tour": "tour"
+
+  tour: ->
+    view = new BeatHaven.Views.MainTour()
+    $(".tour").html(view.render().el)
@@ -0,0 +1,36 @@
+.artist-page
+  %h1 {{ artist_title }}
+  .artist-info
+    .pic
+      %img{ src: "{{ artist_pic }}", alt: "{{ artist_title }}" }
+    .bio {{& artist_bio}}
+
+  .albums
+  {{#artist_albums}}
+    .album
+      .pic
+        %img{ src: "{{ album_pic }}", alt: "{{ album_title }}" }
+        %br
+        .bh-underlay-blue
+          %a.btn.btn-bh-dark.album-add{ href: "" }
+            %i.icon-plus.icon-white
+            Add to playlist
+        .bh-underlay-green
+          %a.btn.btn-bh-dark.album-play{ href: "" }
+            %i.icon-play.icon-white
+            Play
+
+      %h2.title {{ album_title }} ({{ album_year }})
+      %ul.tracks
+      {{# album_tracks }}
+        %li{ "data-id" => "{{ track_id }}" }
+          %a.btn.btn-round.track-play{ href: "" }
+            %i.icon-play
+          %a.btn.btn-round.track-pause{ href: "" }
+            %i.icon-pause
+          .title
+            .inner
+              %a.track-link{ href: "{{track_url}}" } {{ track_title }}
+          %span.length {{ track_length }}
+          %a.btn.btn-round.track-add{ href: "" }
+            %i.icon-plus
@@ -12,7 +12,7 @@
      <div class="pic">
        <img src="{{album_pic}}" alt="{{album_title}}"><br>
        <div class="bh-underlay-blue">
-          <a href="" class="btn btn-bh-dark album-add"><i class="icon-plus icon-white"></i> Add to playlist</a>
+          <a href="" class="btn btn-bh-dark album-add"><i class="icon-plus"></i> Add to playlist</a>
        </div>
        <div class="bh-underlay-green">
          <a href="" class="btn btn-bh-dark album-play"><i class="icon-play icon-white"></i> Play</a>
@@ -0,0 +1,63 @@
+<div class="hero-unit popup step step-1">
+  <h1>Привет!</h1>
+  <p></p>
+  <p>Это Битхейвен, сайт с музыкой. Наверное, ты у нас первый раз, так что давай я в двух словах расскажу что к чему.</p>
+  <p>Битхейвен не содержит музыки как таковой, он просто умеет хорошо и удобно ее проигрывать. А саму музыку он специально для тебя ищет на <strong>VK.com</strong>. Поэтому прошу тебя для начала авторизоваться через <strong>VK.com</strong>, а потом я покажу что делать дальше.</p>
+  <p>Авторизуемся?</p>
+  <p></p>
+  <p><a href="" class="btn btn-primary btn-large">Хорошо</a></p>
+</div>
+<div class="hero-unit popup step step-1a">
+  <h1>Ой!</h1>
+  <p></p>
+  <p>Авторизация не сработала.</p>
+  <p>Скорее всего так вышло из-за того, что ты не стал авторизовываться или разрешать приложению доступ. Напрасно, оно абсолютно безобидное и в принципе не может сделать тебе ничего плохого.</p>
+  <p>К сожалению, без авторизации <strong>VK.com</strong> я не смогу играть для тебя музыку, извини.</p>
+  <p>Попробуем еще раз или заглянешь позже?</p>
+  <p></p>
+  <p><a href="" class="btn btn-primary btn-large again">Еще раз</a></p>
+</div>
+<div class="hero-unit popup step step-2">
+  <h1>Отлично!</h1>
+  <p></p>
+  <p>Добро пожаловать домой, <span class="your-name-here"></span>!</p>
+  <p>Я заглянул в твои музыкальные записи и обратил внимание, что тебе нравится <strong class="your-favorite-artist-here"></strong>. Давай перейдем на страницу этого исполнителя и я покажу тебе куда нажимать.</p>
+  <p></p>
+  <p><a href="" class="btn btn-primary btn-large">Пошли!</a></p>
+</div>
+<div class="step step-3">
+  <div class="title">Это поиск</div>
+  <div class="content">
+    <p>Он твой лучший друг.</p>
+    <p>Начни вписывать в него название группы или альбома и он с первой же буквы постарается угадать что ты хочешь послушать.</p>
+    <p></p>
+    <a href="" class="btn btn-primary tour-step-3">Дальше!</a>
+  </div>
+</div>
+<div class="step step-4">
+  <div class="title">Музыка!</div>
+  <div class="content">
+    <p>Чтобы начать слушать музыку достаточно нажать на кнопку слева от любимой песни</p>
+    <p>Послушаем?</p>
+    <p></p>
+    <a href="" class="btn btn-primary tour-step-4">Давай!</a>
+  </div>
+</div>
+<div class="step step-5">
+  <div class="title">Прогресс-бар</div>
+  <div class="content">
+    <p>На нем всегда отображается название песни, которая играет в данный момент.</p>
+    <p>Еще с его помощью можно перематывать песню.</p>
+    <p></p>
+    <a href="" class="btn btn-primary tour-step-5">Понял</a>
+  </div>
+</div>
+<div class="step step-6">
+  <div class="title">Кнопочки</div>
+  <div class="content">
+    <p>Предыдущая и следующая песня, плей/пауза, все как обычно.</p>
+    <p>Думаю, ты уже достаточно освоился. Наслаждайся музыкой!</p>
+    <p></p>
+    <a href="" class="btn btn-primary tour-step-6">Спасибо!</a>
+  </div>
+</div>
@@ -1,5 +1,5 @@
 class BeatHaven.Views.ArtistShow extends Backbone.View
-  template: HoganTemplates["backbone/templates/artist/show"]
+  template: HoganTemplates["artist/show"]

  initialize: ->
    @model.on("change", @render, this)
@@ -0,0 +1,7 @@
+class BeatHaven.Views.MainTour extends Backbone.View
+  template: HoganTemplates["backbone/templates/main/tour"]
+
+  render: ->
+    $(".fullscreen").show()
+    $(@el).html(@template.render())
+    this