localhots
/
oldhaven
1
0
Fork 0
Code Releases Activity

Merge branch 'master' of github.com:magnolia-fan/BeatHaven

This commit is contained in:
Hipster Hitman 2011-04-13 21:23:22 +04:00
parent 1f50075342 07920d2b79
commit 91b14bf524
23 changed files with 708 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
app/controllers/artist_controller.rb
View File

@ -2,27 +2,41 @@
class ArtistController < ApplicationController
require 'open-uri'
def view
if params[:name].nil?
name = ''
else
if request.request_method == 'POST'
redirect_to :action => 'view', :name => params[:name].gsub(' ', '+')
end
name = params[:name].gsub('+', ' ')
end
@artist = Artist.getByName(name)
@albums = []
@artist.albums.each do |album|
unless album.releases.empty?
tracks = album.tracksInDb()
@albums << {
:object => album,
:tracks => tracks
}
end
end
end
# Dirty auth block START
unless request.session['session_id'].nil? or MainController.logged_in request.session['session_id']
redirect_to '/login'
return
else
if request.session['session_id'].nil?
redirect_to '/login'
return
end
end
# Dirty auth block END
if params[:name].nil?
name = ''
else
if request.request_method == 'POST'
redirect_to :action => 'view', :name => params[:name].gsub(' ', '+')
end
name = params[:name].gsub('+', ' ')
end
@artist = Artist.getByName(name)
if @artist.nil?
render :file => "#{Rails.root}/public/404.html", :status => 404, :layout => false
else
@albums = []
@artist.albums.each do |album|
unless album.releases.empty?
tracks = album.tracksInDb()
@albums << {
:object => album,
:tracks => tracks
}
end
end
end
end
def autocomplete
autocomplete = Artist.getLastFmAutocomplete(params[:query])
return render :nothing => true if autocomplete.nil?

5
app/controllers/errors_controller.rb Normal file
View File

@ -0,0 +1,5 @@
class ErrorsController < ApplicationController
def routing
render :file => "#{Rails.root}/public/404.html", :status => 404, :layout => false
end
end

22
app/controllers/main_controller.rb
View File

@ -1,5 +1,23 @@
class MainController < ApplicationController
def index
# Dirty auth block START
unless request.session['session_id'].nil? or MainController.logged_in request.session['session_id']
redirect_to '/login'
else
if request.session['session_id'].nil?
redirect_to '/login'
end
end
# Dirty auth block END
end
end
def self.logged_in session_id
user_data = User.collection.find({session_key: Digest::SHA256.hexdigest(session_id)}).first
unless user_data.nil?
user_data['lastvisit'] = Time.now()
User.collection.update({_id: user_data._id}, user_data.attributes)
return true
else
return false
end
end
end

52
app/controllers/user_controller.rb Normal file
View File

@ -0,0 +1,52 @@
class UserController < ApplicationController
def login
@hide_player = 1
unless params[:email].nil? or params[:password].nil?
user_data = User.collection.find({email: params[:email], password: Digest::SHA256.hexdigest(params[:password])}).first
unless user_data.nil?
user_data['session_key'] = Digest::SHA256.hexdigest(request.session['session_id'])
User.collection.update({_id: user_data._id}, user_data.attributes)
redirect_to '/'
else
redirect_to '/login'
end
end
end
def register
@hide_player = 1
data = Invite.where(:email => params[:email], :code => params[:code]).first
unless data.nil?
@code = data.code
@email = data.email
else
redirect_to '/login'
end
end
def complete
@hide_player = 1
data = Invite.where(:email => params[:invite_email], :code => params[:invite_code]).first
unless data.nil?
if params[:email].match(/\A[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}\z/).nil? or
params[:password].length < 6 or
params[:password] != params[:password_c]
redirect_to '/'
end
User.collection.insert({
email: params[:email],
password: Digest::SHA256.hexdigest(params[:password]),
name: '',
regdate: Time.now(),
referer: data.referer,
lastvisit: Time.now(),
invites: 0
})
Invite.collection.remove({email: params[:invite_email], code: params[:invite_code]})
else
redirect_to '/login'
end
end
end

2
app/models/invite.rb
View File

@ -5,5 +5,5 @@ class Invite
key :referer, Integer
key :email, String
key :code, String
key :senton, Date
key :date, Date
end

14
app/views/artist/view.rhtml
View File

@ -4,16 +4,24 @@
<%= link_to "Try again", main_path %>
</div>
<% else %>
<h1 class="artist"><%= @artist.name %></h1>
<h1 class="artist">
<span>
<span><%= @artist.name %></span>
<span class="play"><img src="/images/player/add.svg" alt="play" /></span>
</span>
</h1>
<% @albums.each do |album| %>
<div class="album">
<div class="pic"><img src="<%= album[:object].cover(@artist.name) %>" width="250" height="250" alt=""/></div>
<h3 class="name"><%= album[:object].name %> <%= (album[:object].year ? album[:object].year : '') %></h3>
<h3 class="name">
<span><%= album[:object].name %> <%= (album[:object].year ? album[:object].year : '') %></span>
<span class="play"><img src="/images/player/add.svg" alt="play" /></span>
</h3>
<ul class="tracks">
<% album[:tracks].each do |track| %>
<li id="<%= track[:object].id %>">
<span class="play<%= (track[:in_db].nil? ? '' : ' disabled') %>">
<img src="/images/player/play.svg" alt="play" />
<img src="/images/player/add.svg" alt="play" />
</span>
<span class="track-name"><%= track[:object].name %></span>
<% unless track[:object].length.nil? %>

23
app/views/layouts/application.html.erb
View File

@ -11,30 +11,35 @@
<body>
<div id="contents">
<div class="inner-1">
<% if @hide_player.nil? -%>
<div id="player">
<audio autoplay preload></audio>
<div class="prev"><img src="/images/player/prev.svg" alt="prev" /></div>
<div class="play"><img src="/images/player/play.svg" alt="play" /></div>
<div class="pause" style="display:none"><img src="/images/player/pause.svg" alt="pause" /></div>
<div class="next"><img src="/images/player/next.svg" alt="pause" /></div>
<div class="prev" title="Play Previous Track"><img src="/images/player/prev.svg" alt="prv" /></div>
<div class="play" title="Play"><img src="/images/player/play.svg" alt="ply" /></div>
<div class="pause" title="Pause" style="display:none"><img src="/images/player/pause.svg" alt="pause" /></div>
<div class="next" title="Play Next Track"><img src="/images/player/next.svg" alt="pse" /></div>
<div class="time-played">0:00</div>
<div class="progress">
<div class="track-title">No track</div>
<div class="progress-bar">
<div class="progress-loaded">
<div class="progress-point"></div>
<div title="Drag It Now!" class="progress-point"></div>
</div>
</div>
</div>
<div class="time-left">0:00</div>
<div title="Play Tracks In Random Order" class="shuffle"><img src="/images/player/shuffle.svg" alt="shu" /></div>
<div title="Repeat Playlist" class="repeat"><img src="/images/player/shuffle.svg" alt="rep" /></div>
<div title="Show/Hide Playlist" class="playlist">
<img src="/images/player/playlist.svg" alt="pls" />
<div class="count">0</div>
</div>
</div>
<div id="playlist">
<div class="show-button"></div>
<ul style="display:none;">
</ul>
<ul class="list"></ul>
</div>
<%- end %>
<%= yield %>
<a href="" onclick="addToPlaylist('Artist', 'Track', 123, 123);return(false);">add</a>
</div>
</div>
</body>

3
app/views/user/complete.erb Normal file
View File

@ -0,0 +1,3 @@
<div id="registration">
<h1>Welcome aboard, friend!</h1>
</div>

24
app/views/user/login.erb Normal file
View File

@ -0,0 +1,24 @@
<div id="registration">
<h1>Do BeatHaven know you?</h1>
<%= form_tag('/login', :method => 'post') do -%>
<%= label_tag 'email', 'E-mail' %><%= email_field_tag 'email', nil %>
<%= label_tag 'password', 'Password' %><%= password_field_tag 'password', nil %><div id="password_error"></div>
<div class="complete">
<%= submit_tag 'Let me in!' %>
</div>
<% end -%>
</div>
<script type="text/javascript" charset="utf-8">
$(function(){
$('#email').focus();
$('form').submit(function(){
$('#password_error, #password_c_error').html('');
if ($('#password').val().length < 6) {
$('#password_error').html('* You must be kidding?');
$('#password').focus();
return false;
}
return true;
})
})
</script>

31
app/views/user/register.erb Normal file
View File

@ -0,0 +1,31 @@
<div id="registration">
<h1>Greetings from BeatHaven!</h1>
<%= form_tag('/reg/complete', :method => 'post') do -%>
<%= hidden_field_tag 'invite_code', @code %>
<%= hidden_field_tag 'invite_email', @email %>
<%= label_tag 'email', 'E-mail' %><%= email_field_tag 'email', @email %>
<%= label_tag 'password', 'Password' %><%= password_field_tag 'password', nil %><div id="password_error"></div>
<%= label_tag 'password_c', 'Confirm' %><%= password_field_tag 'password_c', nil %><div id="password_c_error"></div>
<div class="complete">
<%= submit_tag 'Complete' %>
</div>
<% end -%>
</div>
<script type="text/javascript" charset="utf-8">
$(function(){
$('#password').focus();
$('form').submit(function(){
$('#password_error, #password_c_error').html('');
if ($('#password').val().length < 6) {
$('#password_error').html('* Password must be 6+ characters length');
$('#password').focus();
return false;
} else if ($('#password').val() != $('#password_c').val()) {
$('#password_c_error').html('* Password and confirmation doesn\'t match');
$('#password_c').focus();
return false;
}
return true;
})
})
</script>

62
config/routes.rb
View File

@ -1,65 +1,17 @@
Beathaven::Application.routes.draw do
get "main/index"
# The priority is based upon order of creation:
# first created -> highest priority.
# Sample of regular route:
# match 'products/:id' => 'catalog#view'
# Keep in mind you can assign values other than :controller and :action
# Sample of named route:
# match 'products/:id/purchase' => 'catalog#purchase', :as => :purchase
# This route can be invoked with purchase_url(:id => product.id)
# Sample resource route (maps HTTP verbs to controller actions automatically):
# resources :products
# Sample resource route with options:
# resources :products do
# member do
# get 'short'
# post 'toggle'
# end
#
# collection do
# get 'sold'
# end
# end
# Sample resource route with sub-resources:
# resources :products do
# resources :comments, :sales
# resource :seller
# end
# Sample resource route with more complex sub-resources
# resources :products do
# resources :comments
# resources :sales do
# get 'recent', :on => :collection
# end
# end
# Sample resource route within a namespace:
# namespace :admin do
# # Directs /admin/products/* to Admin::ProductsController
# # (app/controllers/admin/products_controller.rb)
# resources :products
# end
# You can have the root of your site routed with "root"
# just remember to delete public/index.html.
# root :to => "welcome#index"
root :to => "main#index", :as => "main"
# See how all your routes lay out with "rake routes"
# This is a legacy wild controller route that's not recommended for RESTful applications.
# Note: This route will make all actions in every controller accessible via GET requests.
# match ':controller(/:action(/:id(.:format)))'
match 'artist(/:name)' => 'artist#view'
match 'listen/:id' => 'track#listen'
match 'search/autocomplete' => 'artist#autocomplete'
# Registration & login
match 'reg/:email/:code' => 'user#register', :constraints => { :email => /[-a-z0-9\._@]+/i, :code => /[a-f0-9]{64}/ }
match 'reg/complete' => 'user#complete'
match 'login' => 'user#login'
match '*a', :to => 'errors#routing'
end

5
public/images/player/add.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" standalone="no"?>
<svg width="1000" height="1000" version="1.1" xmlns="http://www.w3.org/2000/svg">
<rect x="400" y="0" width="200" height="1000" style="fill:rgb(220,220,220);"/>
<rect x="0" y="400" width="1000" height="200" style="fill:rgb(220,220,220);"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 286 B

1
public/images/player/pause.svg
View File

@ -1,5 +1,4 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="1000" height="1000" version="1.1" xmlns="http://www.w3.org/2000/svg">
<rect x="50" width="400" height="1000" style="fill:rgb(200,200,200);"/>
<rect x="600" width="400" height="1000" style="fill:rgb(200,200,200);"/>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 372 B

After

Width:  |  Height:  |  Size: 273 B

10
public/images/player/playlist.svg Normal file
View File

@ -0,0 +1,10 @@
<?xml version="1.0" standalone="no"?>
<svg width="700" height="920" version="1.1" xmlns="http://www.w3.org/2000/svg">
<rect x="50" y="50" rx="50" ry="50" width="600" height="820" style="stroke:rgb(200,200,200);stroke-width:50;"/>
<rect x="150" y="150" width="400" height="50" style="fill:rgb(200,200,200);"/>
<rect x="150" y="265" width="400" height="50" style="fill:rgb(200,200,200);"/>
<rect x="150" y="380" width="400" height="50" style="fill:rgb(200,200,200);"/>
<rect x="150" y="495" width="400" height="50" style="fill:rgb(200,200,200);"/>
<rect x="150" y="610" width="400" height="50" style="fill:rgb(200,200,200);"/>
<rect x="150" y="725" width="400" height="50" style="fill:rgb(200,200,200);"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 718 B

41
public/images/player/shuffle.svg Normal file
View File

@ -0,0 +1,41 @@
<?xml version="1.0" standalone="no"?>
<svg width="700" height="500" version="1.1" xmlns="http://www.w3.org/2000/svg">
<path d="M100 400
L250 400
C300 400
325 375
350 325
L400 225
C425 175
450 150
500 150
L600 150
M100 150
L250 150
C300 150
325 175
350 225
L400 325
C425 375
450 400
500 400
L600 400
" style="stroke:rgb(200,200,200);stroke-width:70;" />
<path d="M295 300 L371 150" style="stroke:rgb(0,0,0);stroke-width:50;" />
<path d="M379 400 L455 250" style="stroke:rgb(0,0,0);stroke-width:50;" />
<polygon points="599,70 680,150 599,230" style="fill:rgb(200,200,200);"/>
<polygon points="599,320 680,400 599,480" style="fill:rgb(200,200,200);"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 757 B

15
public/javascripts/jquery-rand.min.js vendored Normal file
View File

@ -0,0 +1,15 @@
/*
* jQuery.fn.rand();
*
* Return a random, but defined numbers of elements from a jQuery Object.
* $('element').rand(); // returns one element from the jQuery Object.
* $('element').rand(4); // returns four elements from the jQuery Object.
*
* Version 0.8.5
* www.labs.skengdon.com/rand
* www.labs.skengdon.com/rand/js/rand.min.js
*
* And:
* http://phpjs.org/functions/array_rand:332
*/
;(function($){$.fn.rand=function(number){var array_rand=function(input,num_req){var indexes=[];var ticks=num_req||1;var checkDuplicate=function(input,value){var exist=false,index=0;while(index<input.length){if(input[index]===value){exist=true;break;};index++;};return exist;};while(true){var rand=Math.floor((Math.random()*input.length));if(indexes.length===ticks){break;};if(!checkDuplicate(indexes,rand)){indexes.push(rand);}};return((ticks==1)?indexes.join():indexes);};if(typeof number!=='number')var number=1;if(number>this.length)number=this.length;var numbers=array_rand(this,number);var $return=[];for(var i=0;i<number;i++){$return[i]=this.get(numbers[i]);};return $($return);};}(jQuery));

11
public/javascripts/jquery.jscrollpane.min.js vendored Normal file
View File

@ -0,0 +1,11 @@
/*
* jScrollPane - v2.0.0beta10 - 2011-04-04
* http://jscrollpane.kelvinluck.com/
*
* Copyright (c) 2010 Kelvin Luck
* Dual licensed under the MIT and GPL licenses.
*/
(function(b,a,c){b.fn.jScrollPane=function(f){function d(E,P){var aA,R=this,Z,al,w,an,U,aa,z,r,aB,aG,aw,j,J,i,k,ab,V,ar,Y,u,B,at,ag,ao,H,m,av,az,y,ax,aJ,g,M,ak=true,Q=true,aI=false,l=false,aq=E.clone(false,false).empty(),ad=b.fn.mwheelIntent?"mwheelIntent.jsp":"mousewheel.jsp";aJ=E.css("paddingTop")+" "+E.css("paddingRight")+" "+E.css("paddingBottom")+" "+E.css("paddingLeft");g=(parseInt(E.css("paddingLeft"),10)||0)+(parseInt(E.css("paddingRight"),10)||0);function au(aU){var aS,aT,aN,aP,aO,aL,aK,aR,aQ=false,aM=false;aA=aU;if(Z===c){aK=E.scrollTop();aR=E.scrollLeft();E.css({overflow:"hidden",padding:0});al=E.innerWidth()+g;w=E.innerHeight();E.width(al);Z=b('<div class="jspPane" />').css("padding",aJ).append(E.children());an=b('<div class="jspContainer" />').css({width:al+"px",height:w+"px"}).append(Z).appendTo(E)}else{E.css("width","");aQ=aA.stickToBottom&&L();aM=aA.stickToRight&&C();aL=E.innerWidth()+g!=al||E.outerHeight()!=w;if(aL){al=E.innerWidth()+g;w=E.innerHeight();an.css({width:al+"px",height:w+"px"})}if(!aL&&M==U&&Z.outerHeight()==aa){E.width(al);return}M=U;Z.css("width","");E.width(al);an.find(">.jspVerticalBar,>.jspHorizontalBar").remove().end()}if(aU.contentWidth){U=aU.contentWidth}else{aS=Z.clone(false,false).css("position","absolute");aT=b('<div style="width:1px; position: relative;" />').append(aS);b("body").append(aT);U=Math.max(Z.outerWidth(),aS.outerWidth());aT.remove()}aa=Z.outerHeight();z=U/al;r=aa/w;aB=r>1;aG=z>1;if(!(aG||aB)){E.removeClass("jspScrollable");Z.css({top:0,width:an.width()-g});o();F();S();x();aj()}else{E.addClass("jspScrollable");aN=aA.maintainPosition&&(J||ab);if(aN){aP=aE();aO=aC()}aH();A();G();if(aN){O(aM?(U-al):aP,false);N(aQ?(aa-w):aO,false)}K();ah();ap();if(aA.enableKeyboardNavigation){T()}if(aA.clickOnTrack){q()}D();if(aA.hijackInternalLinks){n()}}if(aA.autoReinitialise&&!ax){ax=setInterval(function(){au(aA)},aA.autoReinitialiseDelay)}else{if(!aA.autoReinitialise&&ax){clearInterval(ax)}}aK&&E.scrollTop(0)&&N(aK,false);aR&&E.scrollLeft(0)&&O(aR,false);E.trigger("jsp-initialised",[aG||aB])}function aH(){if(aB){an.append(b('<div class="jspVerticalBar" />').append(b('<div class="jspCap jspCapTop" />'),b('<div class="jspTrack" />').append(b('<div class="jspDrag" />').append(b('<div class="jspDragTop" />'),b('<div class="jspDragBottom" />'))),b('<div class="jspCap jspCapBottom" />')));V=an.find(">.jspVerticalBar");ar=V.find(">.jspTrack");aw=ar.find(">.jspDrag");if(aA.showArrows){at=b('<a class="jspArrow jspArrowUp" />').bind("mousedown.jsp",aF(0,-1)).bind("click.jsp",aD);ag=b('<a class="jspArrow jspArrowDown" />').bind("mousedown.jsp",aF(0,1)).bind("click.jsp",aD);if(aA.arrowScrollOnHover){at.bind("mouseover.jsp",aF(0,-1,at));ag.bind("mouseover.jsp",aF(0,1,ag))}am(ar,aA.verticalArrowPositions,at,ag)}u=w;an.find(">.jspVerticalBar>.jspCap:visible,>.jspVerticalBar>.jspArrow").each(function(){u-=b(this).outerHeight()});aw.hover(function(){aw.addClass("jspHover")},function(){aw.removeClass("jspHover")}).bind("mousedown.jsp",function(aK){b("html").bind("dragstart.jsp selectstart.jsp",aD);aw.addClass("jspActive");var s=aK.pageY-aw.position().top;b("html").bind("mousemove.jsp",function(aL){W(aL.pageY-s,false)}).bind("mouseup.jsp mouseleave.jsp",ay);return false});p()}}function p(){ar.height(u+"px");J=0;Y=aA.verticalGutter+ar.outerWidth();Z.width(al-Y-g);try{if(V.position().left===0){Z.css("margin-left",Y+"px")}}catch(s){}}function A(){if(aG){an.append(b('<div class="jspHorizontalBar" />').append(b('<div class="jspCap jspCapLeft" />'),b('<div class="jspTrack" />').append(b('<div class="jspDrag" />').append(b('<div class="jspDragLeft" />'),b('<div class="jspDragRight" />'))),b('<div class="jspCap jspCapRight" />')));ao=an.find(">.jspHorizontalBar");H=ao.find(">.jspTrack");i=H.find(">.jspDrag");if(aA.showArrows){az=b('<a class="jspArrow jspArrowLeft" />').bind("mousedown.jsp",aF(-1,0)).bind("click.jsp",aD);
y=b('<a class="jspArrow jspArrowRight" />').bind("mousedown.jsp",aF(1,0)).bind("click.jsp",aD);if(aA.arrowScrollOnHover){az.bind("mouseover.jsp",aF(-1,0,az));y.bind("mouseover.jsp",aF(1,0,y))}am(H,aA.horizontalArrowPositions,az,y)}i.hover(function(){i.addClass("jspHover")},function(){i.removeClass("jspHover")}).bind("mousedown.jsp",function(aK){b("html").bind("dragstart.jsp selectstart.jsp",aD);i.addClass("jspActive");var s=aK.pageX-i.position().left;b("html").bind("mousemove.jsp",function(aL){X(aL.pageX-s,false)}).bind("mouseup.jsp mouseleave.jsp",ay);return false});m=an.innerWidth();ai()}}function ai(){an.find(">.jspHorizontalBar>.jspCap:visible,>.jspHorizontalBar>.jspArrow").each(function(){m-=b(this).outerWidth()});H.width(m+"px");ab=0}function G(){if(aG&&aB){var aK=H.outerHeight(),s=ar.outerWidth();u-=aK;b(ao).find(">.jspCap:visible,>.jspArrow").each(function(){m+=b(this).outerWidth()});m-=s;w-=s;al-=aK;H.parent().append(b('<div class="jspCorner" />').css("width",aK+"px"));p();ai()}if(aG){Z.width((an.outerWidth()-g)+"px")}aa=Z.outerHeight();r=aa/w;if(aG){av=Math.ceil(1/z*m);if(av>aA.horizontalDragMaxWidth){av=aA.horizontalDragMaxWidth}else{if(av<aA.horizontalDragMinWidth){av=aA.horizontalDragMinWidth}}i.width(av+"px");k=m-av;af(ab)}if(aB){B=Math.ceil(1/r*u);if(B>aA.verticalDragMaxHeight){B=aA.verticalDragMaxHeight}else{if(B<aA.verticalDragMinHeight){B=aA.verticalDragMinHeight}}aw.height(B+"px");j=u-B;ae(J)}}function am(aL,aN,aK,s){var aP="before",aM="after",aO;if(aN=="os"){aN=/Mac/.test(navigator.platform)?"after":"split"}if(aN==aP){aM=aN}else{if(aN==aM){aP=aN;aO=aK;aK=s;s=aO}}aL[aP](aK)[aM](s)}function aF(aK,s,aL){return function(){I(aK,s,this,aL);this.blur();return false}}function I(aN,aM,aQ,aP){aQ=b(aQ).addClass("jspActive");var aO,aL,aK=true,s=function(){if(aN!==0){R.scrollByX(aN*aA.arrowButtonSpeed)}if(aM!==0){R.scrollByY(aM*aA.arrowButtonSpeed)}aL=setTimeout(s,aK?aA.initialDelay:aA.arrowRepeatFreq);aK=false};s();aO=aP?"mouseout.jsp":"mouseup.jsp";aP=aP||b("html");aP.bind(aO,function(){aQ.removeClass("jspActive");aL&&clearTimeout(aL);aL=null;aP.unbind(aO)})}function q(){x();if(aB){ar.bind("mousedown.jsp",function(aP){if(aP.originalTarget===c||aP.originalTarget==aP.currentTarget){var aN=b(this),aQ=aN.offset(),aO=aP.pageY-aQ.top-J,aL,aK=true,s=function(){var aT=aN.offset(),aU=aP.pageY-aT.top-B/2,aR=w*aA.scrollPagePercent,aS=j*aR/(aa-w);if(aO<0){if(J-aS>aU){R.scrollByY(-aR)}else{W(aU)}}else{if(aO>0){if(J+aS<aU){R.scrollByY(aR)}else{W(aU)}}else{aM();return}}aL=setTimeout(s,aK?aA.initialDelay:aA.trackClickRepeatFreq);aK=false},aM=function(){aL&&clearTimeout(aL);aL=null;b(document).unbind("mouseup.jsp",aM)};s();b(document).bind("mouseup.jsp",aM);return false}})}if(aG){H.bind("mousedown.jsp",function(aP){if(aP.originalTarget===c||aP.originalTarget==aP.currentTarget){var aN=b(this),aQ=aN.offset(),aO=aP.pageX-aQ.left-ab,aL,aK=true,s=function(){var aT=aN.offset(),aU=aP.pageX-aT.left-av/2,aR=al*aA.scrollPagePercent,aS=k*aR/(U-al);if(aO<0){if(ab-aS>aU){R.scrollByX(-aR)}else{X(aU)}}else{if(aO>0){if(ab+aS<aU){R.scrollByX(aR)}else{X(aU)}}else{aM();return}}aL=setTimeout(s,aK?aA.initialDelay:aA.trackClickRepeatFreq);aK=false},aM=function(){aL&&clearTimeout(aL);aL=null;b(document).unbind("mouseup.jsp",aM)};s();b(document).bind("mouseup.jsp",aM);return false}})}}function x(){if(H){H.unbind("mousedown.jsp")}if(ar){ar.unbind("mousedown.jsp")}}function ay(){b("html").unbind("dragstart.jsp selectstart.jsp mousemove.jsp mouseup.jsp mouseleave.jsp");if(aw){aw.removeClass("jspActive")}if(i){i.removeClass("jspActive")}}function W(s,aK){if(!aB){return}if(s<0){s=0}else{if(s>j){s=j}}if(aK===c){aK=aA.animateScroll}if(aK){R.animate(aw,"top",s,ae)}else{aw.css("top",s);ae(s)}}function ae(aK){if(aK===c){aK=aw.position().top}an.scrollTop(0);J=aK;var aN=J===0,aL=J==j,aM=aK/j,s=-aM*(aa-w);if(ak!=aN||aI!=aL){ak=aN;aI=aL;E.trigger("jsp-arrow-change",[ak,aI,Q,l])}v(aN,aL);Z.css("top",s);E.trigger("jsp-scroll-y",[-s,aN,aL]).trigger("scroll")}function X(aK,s){if(!aG){return
}if(aK<0){aK=0}else{if(aK>k){aK=k}}if(s===c){s=aA.animateScroll}if(s){R.animate(i,"left",aK,af)}else{i.css("left",aK);af(aK)}}function af(aK){if(aK===c){aK=i.position().left}an.scrollTop(0);ab=aK;var aN=ab===0,aM=ab==k,aL=aK/k,s=-aL*(U-al);if(Q!=aN||l!=aM){Q=aN;l=aM;E.trigger("jsp-arrow-change",[ak,aI,Q,l])}t(aN,aM);Z.css("left",s);E.trigger("jsp-scroll-x",[-s,aN,aM]).trigger("scroll")}function v(aK,s){if(aA.showArrows){at[aK?"addClass":"removeClass"]("jspDisabled");ag[s?"addClass":"removeClass"]("jspDisabled")}}function t(aK,s){if(aA.showArrows){az[aK?"addClass":"removeClass"]("jspDisabled");y[s?"addClass":"removeClass"]("jspDisabled")}}function N(s,aK){var aL=s/(aa-w);W(aL*j,aK)}function O(aK,s){var aL=aK/(U-al);X(aL*k,s)}function ac(aX,aS,aL){var aP,aM,aN,s=0,aW=0,aK,aR,aQ,aU,aT,aV;try{aP=b(aX)}catch(aO){return}aM=aP.outerHeight();aN=aP.outerWidth();an.scrollTop(0);an.scrollLeft(0);while(!aP.is(".jspPane")){s+=aP.position().top;aW+=aP.position().left;aP=aP.offsetParent();if(/^body|html$/i.test(aP[0].nodeName)){return}}aK=aC();aQ=aK+w;if(s<aK||aS){aT=s-aA.verticalGutter}else{if(s+aM>aQ){aT=s-w+aM+aA.verticalGutter}}if(aT){N(aT,aL)}aR=aE();aU=aR+al;if(aW<aR||aS){aV=aW-aA.horizontalGutter}else{if(aW+aN>aU){aV=aW-al+aN+aA.horizontalGutter}}if(aV){O(aV,aL)}}function aE(){return -Z.position().left}function aC(){return -Z.position().top}function L(){var s=aa-w;return(s>20)&&(s-aC()<10)}function C(){var s=U-al;return(s>20)&&(s-aE()<10)}function ah(){an.unbind(ad).bind(ad,function(aN,aO,aM,aK){var aL=ab,s=J;R.scrollBy(aM*aA.mouseWheelSpeed,-aK*aA.mouseWheelSpeed,false);return aL==ab&&s==J})}function o(){an.unbind(ad)}function aD(){return false}function K(){Z.find(":input,a").unbind("focus.jsp").bind("focus.jsp",function(s){ac(s.target,false)})}function F(){Z.find(":input,a").unbind("focus.jsp")}function T(){var s,aK,aM=[];aG&&aM.push(ao[0]);aB&&aM.push(V[0]);Z.focus(function(){E.focus()});E.attr("tabindex",0).unbind("keydown.jsp keypress.jsp").bind("keydown.jsp",function(aP){if(aP.target!==this&&!(aM.length&&b(aP.target).closest(aM).length)){return}var aO=ab,aN=J;switch(aP.keyCode){case 40:case 38:case 34:case 32:case 33:case 39:case 37:s=aP.keyCode;aL();break;case 35:N(aa-w);s=null;break;case 36:N(0);s=null;break}aK=aP.keyCode==s&&aO!=ab||aN!=J;return !aK}).bind("keypress.jsp",function(aN){if(aN.keyCode==s){aL()}return !aK});if(aA.hideFocus){E.css("outline","none");if("hideFocus" in an[0]){E.attr("hideFocus",true)}}else{E.css("outline","");if("hideFocus" in an[0]){E.attr("hideFocus",false)}}function aL(){var aO=ab,aN=J;switch(s){case 40:R.scrollByY(aA.keyboardSpeed,false);break;case 38:R.scrollByY(-aA.keyboardSpeed,false);break;case 34:case 32:R.scrollByY(w*aA.scrollPagePercent,false);break;case 33:R.scrollByY(-w*aA.scrollPagePercent,false);break;case 39:R.scrollByX(aA.keyboardSpeed,false);break;case 37:R.scrollByX(-aA.keyboardSpeed,false);break}aK=aO!=ab||aN!=J;return aK}}function S(){E.attr("tabindex","-1").removeAttr("tabindex").unbind("keydown.jsp keypress.jsp")}function D(){if(location.hash&&location.hash.length>1){var aL,aK;try{aL=b(location.hash)}catch(s){return}if(aL.length&&Z.find(location.hash)){if(an.scrollTop()===0){aK=setInterval(function(){if(an.scrollTop()>0){ac(location.hash,true);b(document).scrollTop(an.position().top);clearInterval(aK)}},50)}else{ac(location.hash,true);b(document).scrollTop(an.position().top)}}}}function aj(){b("a.jspHijack").unbind("click.jsp-hijack").removeClass("jspHijack")}function n(){aj();b("a[href^=#]").addClass("jspHijack").bind("click.jsp-hijack",function(){var s=this.href.split("#"),aK;if(s.length>1){aK=s[1];if(aK.length>0&&Z.find("#"+aK).length>0){ac("#"+aK,true);return false}}})}function ap(){var aL,aK,aN,aM,aO,s=false;an.unbind("touchstart.jsp touchmove.jsp touchend.jsp click.jsp-touchclick").bind("touchstart.jsp",function(aP){var aQ=aP.originalEvent.touches[0];aL=aE();aK=aC();aN=aQ.pageX;aM=aQ.pageY;aO=false;s=true}).bind("touchmove.jsp",function(aS){if(!s){return}var aR=aS.originalEvent.touches[0],aQ=ab,aP=J;
R.scrollTo(aL+aN-aR.pageX,aK+aM-aR.pageY);aO=aO||Math.abs(aN-aR.pageX)>5||Math.abs(aM-aR.pageY)>5;return aQ==ab&&aP==J}).bind("touchend.jsp",function(aP){s=false}).bind("click.jsp-touchclick",function(aP){if(aO){aO=false;return false}})}function h(){var s=aC(),aK=aE();E.removeClass("jspScrollable").unbind(".jsp");E.replaceWith(aq.append(Z.children()));aq.scrollTop(s);aq.scrollLeft(aK)}b.extend(R,{reinitialise:function(aK){aK=b.extend({},aA,aK);au(aK)},scrollToElement:function(aL,aK,s){ac(aL,aK,s)},scrollTo:function(aL,s,aK){O(aL,aK);N(s,aK)},scrollToX:function(aK,s){O(aK,s)},scrollToY:function(s,aK){N(s,aK)},scrollToPercentX:function(aK,s){O(aK*(U-al),s)},scrollToPercentY:function(aK,s){N(aK*(aa-w),s)},scrollBy:function(aK,s,aL){R.scrollByX(aK,aL);R.scrollByY(s,aL)},scrollByX:function(s,aL){var aK=aE()+s,aM=aK/(U-al);X(aM*k,aL)},scrollByY:function(s,aL){var aK=aC()+s,aM=aK/(aa-w);W(aM*j,aL)},positionDragX:function(s,aK){X(s,aK)},positionDragY:function(aK,s){X(aK,s)},animate:function(aK,aN,s,aM){var aL={};aL[aN]=s;aK.animate(aL,{duration:aA.animateDuration,ease:aA.animateEase,queue:false,step:aM})},getContentPositionX:function(){return aE()},getContentPositionY:function(){return aC()},getContentWidth:function(){return U},getContentHeight:function(){return aa},getPercentScrolledX:function(){return aE()/(U-al)},getPercentScrolledY:function(){return aC()/(aa-w)},getIsScrollableH:function(){return aG},getIsScrollableV:function(){return aB},getContentPane:function(){return Z},scrollToBottom:function(s){W(j,s)},hijackInternalLinks:function(){n()},destroy:function(){h()}});au(P)}f=b.extend({},b.fn.jScrollPane.defaults,f);b.each(["mouseWheelSpeed","arrowButtonSpeed","trackClickSpeed","keyboardSpeed"],function(){f[this]=f[this]||f.speed});var e;this.each(function(){var g=b(this),h=g.data("jsp");if(h){h.reinitialise(f)}else{h=new d(g,f);g.data("jsp",h)}e=e?e.add(g):g});return e};b.fn.jScrollPane.defaults={showArrows:false,maintainPosition:true,stickToBottom:false,stickToRight:false,clickOnTrack:true,autoReinitialise:false,autoReinitialiseDelay:500,verticalDragMinHeight:0,verticalDragMaxHeight:99999,horizontalDragMinWidth:0,horizontalDragMaxWidth:99999,contentWidth:c,animateScroll:false,animateDuration:300,animateEase:"linear",hijackInternalLinks:false,verticalGutter:4,horizontalGutter:4,mouseWheelSpeed:0,arrowButtonSpeed:0,arrowRepeatFreq:50,arrowScrollOnHover:false,trackClickSpeed:0,trackClickRepeatFreq:70,verticalArrowPositions:"split",horizontalArrowPositions:"split",enableKeyboardNavigation:true,hideFocus:false,keyboardSpeed:0,initialDelay:300,speed:30,scrollPagePercent:0.8}})(jQuery,this);

78
public/javascripts/jquery.mousewheel.js Normal file
View File

@ -0,0 +1,78 @@
/*! Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net)
* Licensed under the MIT License (LICENSE.txt).
*
* Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
* Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
* Thanks to: Seamus Leahy for adding deltaX and deltaY
*
* Version: 3.0.4
*
* Requires: 1.2.2+
*/
(function($) {
var types = ['DOMMouseScroll', 'mousewheel'];
$.event.special.mousewheel = {
setup: function() {
if ( this.addEventListener ) {
for ( var i=types.length; i; ) {
this.addEventListener( types[--i], handler, false );
}
} else {
this.onmousewheel = handler;
}
},
teardown: function() {
if ( this.removeEventListener ) {
for ( var i=types.length; i; ) {
this.removeEventListener( types[--i], handler, false );
}
} else {
this.onmousewheel = null;
}
}
};
$.fn.extend({
mousewheel: function(fn) {
return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
},
unmousewheel: function(fn) {
return this.unbind("mousewheel", fn);
}
});
function handler(event) {
var orgEvent = event || window.event, args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true, deltaX = 0, deltaY = 0;
event = $.event.fix(orgEvent);
event.type = "mousewheel";
// Old school scrollwheel delta
if ( event.wheelDelta ) { delta = event.wheelDelta/120; }
if ( event.detail ) { delta = -event.detail/3; }
// New school multidimensional scroll (touchpads) deltas
deltaY = delta;
// Gecko
if ( orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
deltaY = 0;
deltaX = -1*delta;
}
// Webkit
if ( orgEvent.wheelDeltaY !== undefined ) { deltaY = orgEvent.wheelDeltaY/120; }
if ( orgEvent.wheelDeltaX !== undefined ) { deltaX = -1*orgEvent.wheelDeltaX/120; }
// Add event and delta to the front of the arguments
args.unshift(event, delta, deltaX, deltaY);
return $.event.handle.apply(this, args);
}
})(jQuery);

86
public/javascripts/player.js
View File

@ -1,6 +1,17 @@
var audio;
var utid;
$(function(){
$.extend($.fn.disableTextSelect = function() {
return this.each(function(){
if ($.browser.mozilla) {//Firefox
$(this).css('MozUserSelect','none');
} else if ($.browser.msie) {//IE
$(this).bind('selectstart',function(){return false;});
} else {//Opera, etc.
$(this).mousedown(function(){return false;});
}
});
});
audio = document.getElementsByTagName('audio')[0];
$('#player .play').click(function(){
if (! audio.src) return;
@ -8,38 +19,54 @@ $(function(){
utid = window.setTimeout(updatePlayer, 100);
$('#player .pause').show();
$('#player .play').hide();
})
}).disableTextSelect();
$('#player .pause').click(function(){
audio.pause();
clearTimeout(utid);
$('#player .pause').hide();
$('#player .play').show();
})
}).disableTextSelect();
$('.tracks .play').click(function(){
addToPlaylist(
$('h1.artist').html(),
$('h1.artist > span > span:first').html(),
$(this).parent().find('.track-name').html(),
Math.round($(this).parent().find('.duration').attr('data-length') / 1000),
$(this).parent().attr('id')
);
})
$('#playlist .show-button').click(function(){
$('#playlist ul').toggle();
$('.album > h3.name > span.play').click(function(){
$(this).parent().parent().find('ul > li > span.play').click();
})
$('h1.artist > span > span.play').click(function(){
$('.album > ul > li > span.play').click();
})
$('#player .prev').click(function(){
playPrev();
}).disableTextSelect();
$('#player .next').click(function(){
playNext(false);
}).disableTextSelect();
$('#player .shuffle, #player .repeat').click(function(){
$(this).toggleClass('on');
}).disableTextSelect();
$('#player .playlist').click(function(){
$('#playlist').toggle();
//$('#playlist').data('jsp').reinitialise();
})
$('#playlist').hide();
})
function updatePlayer() {
duration = audio.duration;
cur_time = audio.currentTime;
if (cur_time == duration) {
playNext();
playNext(true);
}
loaded = 0;
if ((audio.buffered != undefined) && (audio.buffered.length != 0)) {
loaded = Math.round((audio.buffered.end(0) / audio.duration) * 730);
loaded = Math.round((audio.buffered.end(0) / audio.duration) * 390);
$('#player .time-played').html(formatTime(cur_time));
$('#player .time-left').html(formatTime(duration - cur_time));
progress = Math.round((cur_time / duration) * 730);
progress = Math.round((cur_time / duration) * 390);
$('#player .progress-loaded').css('width', loaded +'px')
$('#player .progress-point').css('margin-left', progress +'px')
}
@ -58,25 +85,48 @@ function playTrack(artist, track, id) {
$('#player .time-left').html('0:00');
$('#player .progress-loaded').css('width', 0 +'px')
$('#player .progress-point').css('margin-left', 0 +'px')
$('#playlist li').removeClass('now-playing');
$('#playlist li[data-id="'+ id +'"]').addClass('now-playing');
$('#player .play').trigger('click');
}
function playNext() {
$('#playlist ul li.now-playing').next().trigger('click');
function playPrev() {
if ($('#playlist ul.list li').length == 0) return false;
if ($('#playlist ul.list li.now-playing').prev().length == 0) {
$('#playlist ul.list li:last').dblclick();
} else {
$('#playlist ul.list li.now-playing').prev().dblclick();
}
}
function playNext(auto) {
if ($('#playlist ul.list li').length == 0) return false;
if ($('#player .shuffle').hasClass('on')) {
$('#playlist ul.list li').rand().dblclick();
}
if ($('#playlist ul.list li.now-playing').next().length == 0) {
if ((auto && $('#player .repeat').hasClass('on')) || !auto) {
$('#playlist ul.list li:first').dblclick();
}
} else {
$('#playlist ul.list li.now-playing').next().dblclick();
}
}
function addToPlaylist(artist, track, length, id) {
$('#playlist ul').append($(
'<li data-id="'+ id +'">'+
$('#playlist ul.list').append($(
'<li data-id="'+ id +'" title="Double-click To Play">'+
'<span class="artist">'+ artist +'</span> &mdash; '+
'<span class="track">'+ track +'</span>'+
'<span class="length" data-seconds="'+ length +'">'+ formatTime(length) +'</span>'+
'</li>'
));
$('#playlist ul li[data-id="'+ id +'"]').click(function(){
$('#playlist ul.list li').disableTextSelect();
$('#playlist ul.list li[data-id="'+ id +'"]').dblclick(function(){
playTrack(artist, track, id);
$('#playlist li').removeClass('now-playing');
$(this).addClass('now-playing');
})
if ($('#playlist ul li').length == 1) {
playTrack(artist, track, id);
if ($('#playlist ul.list li').length == 1) {
$('#playlist ul.list li:first').dblclick();
}
if ($('#playlist ul.list li').length > 6) {
$('#playlist').jScrollPane();
}
$('#player .playlist .count').html($('#playlist ul.list li').length);
}

65
public/stylesheets/beathaven.css
View File

@ -6,24 +6,27 @@ body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#contents {
width: 1000px;
margin: 0 0 0 -500px;
width: 750px;
margin: 0 0 0 -375px;
left: 50%;
position: relative;
/* background-color: #EEE;*/
}
.inner-1 {
margin: 2em;
/* margin: 2em;*/
}
h1.artist {
display: block;
width: 100%;
text-align: center;
margin: 4em 0 0.5em 0;
margin: 75px 0 0.5em 0;
font-size: 3em;
}
h1.artist > span {
width: auto;
}
.album {
width: 100%;
@ -35,22 +38,26 @@ h1.artist {
height: 250px;
background-color: #DDD;
float: left;
margin: 0 1em 1em 0;
margin: 0 20px 1em 0;
}
.album .name {
display: block;
float: left;
width: 450px;
width: 480px;
font-size: 1.5em;
margin: 0 0 0.5em 0;
/* background-color: yellowgreen;*/
}
.album .name span{
float: left;
width: auto;
}
.album .tracks {
display: block;
float: left;
width: 450px;
width: 480px;
margin-bottom: 1em;
/* background-color: lightblue;*/
}
@ -69,27 +76,47 @@ h1.artist {
float: right;
}
.album .tracks li .play {
span.play {
display: block;
float: left;
width: 30px;
height: 30px;
border-radius: 30px;
background-color: #05A;
margin: 0 0.3em 0 0;
width: 20px;
height: 20px;
border-radius: 20px;
background-color: #081;
margin: 0.4em 0.3em 0 0;
cursor: pointer;
line-height: 18px;
}
.album .tracks li .play img {
width: 12px;
height: 12px;
margin: 9px 0 0 10px;
span.play img {
width: 10px;
height: 10px;
margin: 0 0 0 5px;
}
.album .tracks li .play.disabled {
background-color: #CDF;
span.play.disabled {
background-color: #810;
}
.album h3.name span.play {
display: block;
width: 20px;
line-height: 11px;
margin: 0.2em 0 0 0.2em;
background-color: #04A;
}
h1.artist > span > span.play {
display: inline-block;
float: none;
width: 28px;
height: 28px;
line-height: 20px;
margin: 0;
background-color: #04A;
}
h1.artist > span > span.play img {
margin: 10px 0 20px 0;
}
.search {
width: 100%;

113
public/stylesheets/jquery.jscrollpane.css Normal file
View File

@ -0,0 +1,113 @@
/*
* CSS Styles that are needed by jScrollPane for it to operate correctly.
*
* Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
* may not operate correctly without them.
*/
.jspContainer
{
overflow: hidden;
position: relative;
}
.jspPane
{
position: absolute;
}
.jspVerticalBar
{
position: absolute;
top: 0;
right: 0;
width: 10px;
height: 100%;
background: red;
}
.jspHorizontalBar
{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 16px;
background: red;
}
.jspVerticalBar *,
.jspHorizontalBar *
{
margin: 0;
padding: 0;
}
.jspCap
{
display: none;
}
.jspHorizontalBar .jspCap
{
float: left;
}
.jspTrack
{
background: #111;
position: relative;
}
.jspDrag
{
background: #555;
position: relative;
top: 0;
left: 0;
cursor: default;
}
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
float: left;
height: 100%;
}
.jspArrow.jspDisabled
{
cursor: default;
background: #80808d;
}
.jspVerticalBar .jspArrow
{
height: 16px;
}
.jspHorizontalBar .jspArrow
{
width: 16px;
float: left;
height: 100%;
}
.jspVerticalBar .jspArrow:focus
{
outline: none;
}
.jspCorner
{
background: #eeeef4;
float: left;
height: 100%;
}
/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
margin: 0 -3px 0 0;
}

88
public/stylesheets/player.css
View File

@ -1,10 +1,10 @@
#player {
position: fixed;
width: 1000px;
width: 750px;
height: 50px;
left: 50%;
top: 0;
margin-left: -500px;
margin-left: -375px;
background-color: #000;
font-size: 12px;
}
@ -50,7 +50,7 @@
margin-left: 20px;
}
#player .next {
margin-right: 20px;
margin-right: 6px;
}
#player .time-played, #player .time-left {
float: left;
@ -65,11 +65,11 @@
float: left;
margin-top: 25px;
height: 25px;
width: 740px;
width: 400px;
}
#player .track-title {
float: left;
width: 730px;
width: 390px;
height: 25px;
margin-left: 5px;
margin-top: -25px;
@ -80,7 +80,7 @@
float: left;
margin: 11px 5px;
background-color: #013;
width: 730px;
width: 390px;
height: 3px;
}
#player .progress-loaded {
@ -100,41 +100,81 @@
border-radius: 6px;
cursor: pointer;
}
#player .shuffle, #player .repeat, #player .playlist {
float: left;
cursor: pointer;
}
#player .shuffle {
margin: 17px 0 0 0;
}
#player .shuffle img {
width: 20px;
}
#player .repeat {
margin: 17px 0 0 12px;
}
#player .repeat img {
width: 20px;
}
#player .playlist {
margin: 12px 0 0 12px;
}
#player .playlist img {
width: 20px;
}
#player .playlist .count {
color: #DDD;
font-size: 9px;
width: auto;
float: right;
margin: -33px 0 0 2px;
}
#player .shuffle, #player .repeat {
opacity: 0.5;
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
-webkit-opacity: 0.5;
filter:alpha(opacity=50);
}
#player .shuffle.on, #player .repeat.on {
opacity: 1;
-moz-opacity: 1;
-khtml-opacity: 1;
-webkit-opacity: 1;
filter:alpha(opacity=100);
}
#playlist {
position: fixed;
top: 50px;
left: 50%;
width: 1000px;
margin-left: -500px;
width: 750px;
margin-left: -375px;
background-color: #000;
opacity: 60;
-moz-opacity: 60;
-khtml-opacity: 60;
-webkit-opacity: 60;
opacity: 0.9;
-moz-opacity: 0.9;
-khtml-opacity: 0.9;
-webkit-opacity: 0.9;
filter:alpha(opacity=90);
overflow-y: auto;
max-height: 10em;
}
#playlist .show-button {
width: 100%;
height: 10px;
background-color: #222;
cursor: pointer;
}
#playlist ul {
margin: 0.2em 0.3em;
padding: 0;
max-height: 10em;
overflow-y: scroll;
position: relative;
}
#playlist ul li {
margin: 0;
padding: 0.2em 0;
padding: 0.4em 0;
display: block;
width: 100%;
font-size: 0.8em;
font-size: 0.75em;
color: #FFF;
}
#playlist ul li:hover {
background-color: #222;
cursor: pointer;
background-color: #050505;
cursor: default;
}
#playlist ul li.now-playing {
background-color: #013;

54
public/stylesheets/register.css Normal file
View File

@ -0,0 +1,54 @@
#registration {
position: fixed;
top: 50%;
left: 50%;
margin: -145px 0 0 -195px;
padding: 20px;
width: 350px;
height: 250px;
background-color: #FFF;
}
#registration h1 {
width: 100%;
text-align: center;
font-size: 28px;
font-weight: normal;
margin: 0 0 30px 0;
}
#registration label {
display: block;
float: left;
width: 100px;
font-size: 20px;
line-height: 35px;
}
#registration input[type="email"], input[type="password"] {
width: 230px;
font-size: 20px;
border: #EAEAEA 1px solid;
background-color: #FCFCFC;
padding: 5px;
}
#registration input[type="submit"] {
color: #FFF;
border: #EAEAEA 1px solid;
background-color: #05A;
font-size: 25px;
padding: 10px;
cursor: pointer;
}
#registration .complete {
width: 100%;
text-align: center;
margin-top: 20px;
}
#email_error, #password_error, #password_c_error {
float: right;
color: #E30;
width: 350px;
height: 30px;
margin: 4px -350px 0 0;
line-height: 30px;
font-size: 15px;
}