Tracks import
This commit is contained in:
Gregory Eremin
@@ -12,6 +12,7 @@
|
||||
//
|
||||
//= require jquery
|
||||
//= require jquery_ujs
|
||||
//= require jquery.autocomplete
|
||||
//= require mustache
|
||||
//= require hogan
|
||||
//= require underscore
|
||||
@@ -20,3 +21,4 @@
|
||||
//= require backbone_datalink
|
||||
//= require backbone/beat_haven
|
||||
//= require_tree .
|
||||
|
||||
|
||||
@@ -0,0 +1,12 @@
|
||||
$ ->
|
||||
$(".navbar-search input").focus ->
|
||||
$(this).animate(width: 249)
|
||||
$(".player").animate(width: 408)
|
||||
$(".navbar-search input").blur ->
|
||||
$(this).animate(width: 99)
|
||||
$(".player").animate(width: 558)
|
||||
|
||||
window.desired = $(".navbar-search input").autocomplete
|
||||
serviceUrl: "/api/search/complete"
|
||||
onSelect: (selected) ->
|
||||
Backbone.history.navigate("/search/"+selected.replace(/\s/g, "+"), true)
|
||||
@@ -9,10 +9,24 @@ window.BeatHaven =
|
||||
Collections: {}
|
||||
Routers: {}
|
||||
Views: {}
|
||||
player: null
|
||||
|
||||
init: ->
|
||||
new BeatHaven.Routers.Artist()
|
||||
Backbone.history.start();
|
||||
new BeatHaven.Routers.Album()
|
||||
new BeatHaven.Routers.Search()
|
||||
@player = new BeatHaven.Models.Player()
|
||||
|
||||
Backbone.history.start(pushState: true);
|
||||
$("a").live "click", (e) ->
|
||||
if $(this).attr("href").substr(0, 1) == "/"
|
||||
e.preventDefault()
|
||||
Backbone.history.navigate($(this).attr("href"), true)
|
||||
return false
|
||||
else
|
||||
alert "Window close attempt!"
|
||||
return false
|
||||
true
|
||||
|
||||
$ ->
|
||||
BeatHaven.init()
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
class BeatHaven.Collections.Tracklist extends Backbone.Collection
|
||||
@@ -0,0 +1,2 @@
|
||||
class BeatHaven.Models.Album extends Backbone.Model
|
||||
urlRoot: "/api/albums"
|
||||
@@ -0,0 +1,11 @@
|
||||
class BeatHaven.Models.Player extends Backbone.Model
|
||||
playlist_on: false
|
||||
playlist: null
|
||||
tracks: null
|
||||
|
||||
initialize: ->
|
||||
@playlist = new BeatHaven.Collections.Tracklist()
|
||||
@tracks = new BeatHaven.Collections.Tracklist()
|
||||
|
||||
update_title: (params) ->
|
||||
$(".player .progress-bar .title").html("#{params.artists.join(', ')} — #{params.track}")
|
||||
@@ -0,0 +1,7 @@
|
||||
class BeatHaven.Models.Track extends Backbone.Model
|
||||
|
||||
play: ->
|
||||
BeatHaven.player.update_title(
|
||||
artists: @.get("artists")
|
||||
track: @.get("title")
|
||||
)
|
||||
@@ -0,0 +1,9 @@
|
||||
class BeatHaven.Routers.Album extends Backbone.Router
|
||||
routes:
|
||||
"album/:id": "show"
|
||||
|
||||
show: (id) ->
|
||||
album = new BeatHaven.Models.Album(id: id)
|
||||
album.fetch()
|
||||
view = new BeatHaven.Views.AlbumShow(model: album)
|
||||
$("#main").html(view.render().el)
|
||||
@@ -0,0 +1,16 @@
|
||||
class BeatHaven.Routers.Search extends Backbone.Router
|
||||
routes:
|
||||
"search/:query": "search"
|
||||
|
||||
search: (query) ->
|
||||
$(".navbar-search .search-query").attr("disabled", "disabled").blur()
|
||||
$.ajax(
|
||||
url: "/api/search/wtfis?q=#{query}"
|
||||
success: (data) ->
|
||||
if data.found?
|
||||
Backbone.history.navigate(data.found, true)
|
||||
$(".navbar-search .search-query").val("").removeAttr("disabled")
|
||||
else
|
||||
alert "Not found! :("
|
||||
$(".navbar-search .search-query").removeAttr("disabled").focus()
|
||||
)
|
||||
@@ -0,0 +1,28 @@
|
||||
<div class="artist-page">
|
||||
<h1 class="title">{{album_title}} ({{album_year}})</h1>
|
||||
<div class="album">
|
||||
<div class="pic">
|
||||
<img src="{{album_pic}}" alt="{{album_title}}"><br>
|
||||
<a href="" class="btn btn-bh-blue album-add"><i class="icon-plus icon-white"></i> Add to playlist</a>
|
||||
<a href="" class="btn btn-bh-green album-play"><i class="icon-play icon-white"></i> Play</a>
|
||||
</div>
|
||||
<ul class="tracks">
|
||||
{{#album_tracks}}
|
||||
<li data-id="{{track_id}}">
|
||||
<a href="" class="btn btn-round track-play"><i class="icon-play"></i></a>
|
||||
<div class="title">
|
||||
<div class="inner">
|
||||
<a href="{{track_url}}" class="track-link">{{track_title}}</a>
|
||||
<span class="delimiter">—</span>
|
||||
<ul class="artists">
|
||||
{{#track_artists}}<li><a href="{{artist_url}}" class="artist-page">{{artist_title}}</a></li>{{/track_artists}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<span class="length">{{track_length}}</span>
|
||||
<a href="" class="btn btn-round track-add"><i class="icon-plus"></i></a>
|
||||
</li>
|
||||
{{/album_tracks}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,39 @@
|
||||
<div class="artist-page">
|
||||
<h1>{{artist_title}}</h1>
|
||||
<div class="artist-info">
|
||||
<div class="pic">
|
||||
<img src="{{artist_pic}}" alt="{{artist_title}}">
|
||||
</div>
|
||||
<div class="bio">{{& artist_bio}}</div>
|
||||
</div>
|
||||
<div class="albums">
|
||||
{{#artist_albums}}
|
||||
<div class="album">
|
||||
<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>
|
||||
</div>
|
||||
<div class="bh-underlay-green">
|
||||
<a href="" class="btn btn-bh-dark album-play"><i class="icon-play icon-white"></i> Play</a>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="title">{{album_title}} ({{album_year}})</h2>
|
||||
<ul class="tracks">
|
||||
{{#album_tracks}}
|
||||
<li data-id="{{track_id}}">
|
||||
<a href="" class="btn btn-round track-play"><i class="icon-play"></i></a>
|
||||
<div class="title">
|
||||
<div class="inner">
|
||||
<a href="{{track_url}}" class="track-link">{{track_title}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<span class="length">{{track_length}}</span>
|
||||
<a href="" class="btn btn-round track-add"><i class="icon-plus"></i></a>
|
||||
</li>
|
||||
{{/album_tracks}}
|
||||
</ul>
|
||||
</div>
|
||||
{{/artist_albums}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,39 +0,0 @@
|
||||
<div class="artist-page">
|
||||
<h1>{{name}}</h1>
|
||||
<div class="artist-info">
|
||||
<div class="pic">
|
||||
<img src="{{pic}}" alt="{{name}}">
|
||||
</div>
|
||||
<div class="bio">{{bio}}</div>
|
||||
</div>
|
||||
<div class="albums">
|
||||
{{#albums}}
|
||||
<div class="album">
|
||||
<div class="pic">
|
||||
<img src="{{pic_safe}}" alt="{{title}}"><br>
|
||||
<a href="" class="btn btn-success play-all"><i class="icon-plus icon-white"></i> Add to playlist</a>
|
||||
<a href="" class="btn btn-info play-all"><i class="icon-play icon-white"></i> Play</a>
|
||||
</div>
|
||||
<h2 class="title">{{title}} ({{year}})</h2>
|
||||
<div class="tracks">
|
||||
<table class="table">
|
||||
<tbody>
|
||||
{{#tracks}}
|
||||
<tr>
|
||||
<td class="title">
|
||||
<a href="" class="btn btn-round track-play"><i class="icon-play"></i></a>
|
||||
<a href="" class="track-link">{{title}}</a>
|
||||
</td>
|
||||
<td class="length">
|
||||
<span class="length">{{length}}</span>
|
||||
<a href="" class="btn btn-round track-add"><i class="icon-plus"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
{{/tracks}}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
{{/albums}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,13 @@
|
||||
class BeatHaven.Views.AlbumShow extends Backbone.View
|
||||
template: HoganTemplates["backbone/templates/album/show"]
|
||||
|
||||
initialize: ->
|
||||
@model.on("change", @render, this)
|
||||
|
||||
render: ->
|
||||
if typeof @model.get("album_tracks") != "undefined"
|
||||
for track_info in @model.get("album_tracks")
|
||||
track = new BeatHaven.Models.Track(track_info.meta)
|
||||
BeatHaven.player.tracks.push(track)
|
||||
$(@el).html(@template.render(@model.toJSON()))
|
||||
this
|
||||
@@ -1,10 +1,14 @@
|
||||
class BeatHaven.Views.ArtistShow extends Backbone.View
|
||||
template: HoganTemplates["backbone/templates/artists/show"]
|
||||
template: HoganTemplates["backbone/templates/artist/show"]
|
||||
|
||||
initialize: ->
|
||||
@model.on("change", @render, this)
|
||||
|
||||
render: ->
|
||||
return this if typeof @model.attributes.id is "string"
|
||||
$(@el).html(@template.render(@model.toJSON()))
|
||||
if typeof @model.get("artist_bio") != "undefined"
|
||||
for album_info in @model.get("artist_albums")
|
||||
for track_info in album_info.album_tracks
|
||||
track = new BeatHaven.Models.Track(track_info.meta)
|
||||
BeatHaven.player.tracks.push(track)
|
||||
$(@el).html(@template.render(@model.toJSON()))
|
||||
this
|
||||
|
||||
Reference in New Issue
Block a user