Work on settings

app/assets/javascripts/ajax.coffee

@@ -3,7 +3,7 @@ class window.Ajax
   referer: false
   
   loadSettingsPage: ->
-    $.get '/settings/', (data) ->
+    _session.query '/settings/', {}, (data) ->
       _ajax.setArchor '/settings/'
       _page.renderSettings data
       false

app/assets/javascripts/settings.coffee

@@ -32,12 +32,12 @@ $('#preferences') .live 'click', ->
   _ajax.go('/settings/');
   false
 
-$('.settings-container .tabs .tab').live 'click', ->
+$('#settings-tabs li').live 'click', ->
   if not $(this).hasClass 'active'
-    $('.settings-container .tabs .tab').removeClass 'active'
+    $('#settings-tabs li').removeClass 'active'
     $(this).addClass 'active'
-    $('.form-container').html $('.forms .'+ $(this).attr 'data-fieldset').html()
-    _settings.loadFormData $(this).attr 'data-fieldset'
+    $('#settings-forms > div').hide()
+    $('#settings-forms > .'+ $(this).find('a').attr('data-tab')).show()
   false
 
 $('.lastfm-connect') .live 'click', ->

app/assets/stylesheets/application.css

@@ -11,7 +11,7 @@
 * require pulldown
 * require pulldown
 *= require search
-* require settings
+*= require settings
 * require textpage
 
 

app/assets/stylesheets/settings.scss

@@ -1,121 +1,11 @@
-@import "rounded";
-
-.settings-container {
-	margin: 25px;
-	
-	.tabs {
-		height: 26px;
-		
-		> div {
-			float: left;
-			height: 25px;
-		}
-		
-		.left-space {
-			width: 15px;
-		}
-		
-		.middle-space {
-			width: 8px;
-		}
-		
-		.tab {
-			position: relative;
-			border-left: #DDD 1px solid;
-			border-top: #DDD 1px solid;
-			border-right: #DDD 1px solid;
-			padding: 0 8px;
-			line-height: 24px;
-			margin-top: 2px;
-			@include rounded(5);
-			background-color: #FAFAFA;
-			cursor: pointer;
-			
-			&.active {
-				z-index: 200;
-				background-color: #FFF;
-				border-left: #CCC 1px solid;
-				border-top: #CCC 1px solid;
-				border-right: #CCC 1px solid;
-				border-bottom: #FFF 6px solid;
-				margin-top: -2px;
-				line-height: 29px;
-				font-weight: bold;
-				cursor: default;
-			}
-		}
-	}
-	
-	.form-container {
-		position: relative;
-		z-index: 100;
-		height: 500px;
-		border-top: #CCC 1px solid;
-		
-		.form {
-			position: absolute;
-			top: 25px;
-			left: 0;
-			width: 100%;
-			
-			.field {
-				height: 40px;
-				margin-bottom: 10px;
-				clear: both;
-				
-				.label{
-					float: left;
-					font-size: 24px;
-					line-height: 32px;
-					width: 140px;
-					padding: 3px 6px;
-					@include rounded(3);
-					background-color: #EAEAEA;
-					margin-right: -10px;
-				}
-				
-				.value {
-					float: left;
-					
-					input[type="text"]{
-						font-size: 24px;
-						padding: 4px;
-						background-color: #ffffff;
-						color: #202020;
-						border: #CCC 1px solid;
-						@include rounded(3);
-						width: 300px;
-					}
-					
-					select {
-						font-size: 24px;
-						background-color: #ffffff;
-						color: #202020;
-						border: #CCC 1px solid;
-						width: 310px;
-						height: 38px;
-					}
-				}
-				
-				.action-button {
-					float: left;
-					margin: 6px 0 0 5px;
-				}
-				
-				.saved {
-					float: left;
-				}
-			}
-		}
-		
-		.logout {
-			position: absolute;
-			top: 25px;
-			right: 0;
-		}
-	}
-	
-	.forms {
-		display: none;
-	}
+#settings-forms {
+  .site  {
+    display: none;
+  }
+  .music {
+    display: none;
+  }
+  .lastfm {
+    display: none;
+  }
 }