Settings mockup
This commit is contained in:
		
							parent
							
								
									fe7737574d
								
							
						
					
					
						commit
						60cde9084f
					
				| @ -3,9 +3,10 @@ class window.Ajax | ||||
|   referer: false | ||||
|    | ||||
|   loadSettingsPage: -> | ||||
|     $.get '/templates/settings.html', (data) -> | ||||
|     $.get '/settings/', (data) -> | ||||
|       _ajax.setArchor '/settings/' | ||||
|       _page.renderSettings _beathaven.localizeHTML $(data) | ||||
|       _page.renderSettings data | ||||
|       false | ||||
|     false | ||||
|    | ||||
|   load404Page: -> | ||||
| @ -37,7 +38,7 @@ class window.Ajax | ||||
|     if m = _ajax.getAnchor().match /\/artist\/(.+)\// | ||||
|       _search.loadArtistData m[1] | ||||
|     else if _ajax.getAnchor() == '' or _ajax.getAnchor().match /\/search\// | ||||
|       _ajax.loadSearchPage(); | ||||
|       #_ajax.loadSearchPage(); | ||||
|     else if _ajax.getAnchor().match /\/settings\// | ||||
|       _ajax.loadSettingsPage() | ||||
|     else if _ajax.getAnchor().match /\/about\// | ||||
|  | ||||
| @ -37,7 +37,6 @@ class window.BeatHaven | ||||
| 		window._settings = new Settings() | ||||
| 		 | ||||
| 		this.setupAutocomplete() | ||||
| 		window._ajax.detectPage() | ||||
| 		 | ||||
| 		false | ||||
| 	 | ||||
|  | ||||
| @ -4,47 +4,55 @@ class window.Page | ||||
|     $('#content').html(html) | ||||
|     false | ||||
|    | ||||
| 	renderArtist: (data) -> | ||||
| 		$('#content').html(data) | ||||
|   renderArtist: (data) -> | ||||
|     $('#content').html(data) | ||||
|      | ||||
| 		yaCounter7596904.hit _ajax.getAnchor(), data.artist.name, _ajax.referer | ||||
| 		_ajax.setTitle data.artist.name | ||||
| 		false | ||||
|     yaCounter7596904.hit _ajax.getAnchor(), data.artist.name, _ajax.referer | ||||
|     _ajax.setTitle data.artist.name | ||||
|     false | ||||
|    | ||||
| 	renderSearch: (data) -> | ||||
| 		$('.pulldown').html data | ||||
| 		setTimeout -> | ||||
| 			$('.search_field').first().bh_autocomplete | ||||
| 				serviceUrl: '/artist/autocomplete' # Страница для обработки запросов автозаполнения | ||||
| 				minChars: 2 # Минимальная длина запроса для срабатывания автозаполнения | ||||
| 				delimiter: /(,|;)\s*/ # Разделитель для нескольких запросов, символ или регулярное выражение | ||||
| 				maxHeight: 400 # Максимальная высота списка подсказок, в пикселях | ||||
| 				width: 415 # Ширина списка | ||||
| 				zIndex: 9999 # z-index списка | ||||
| 				deferRequestBy: 500 # Задержка запроса (мсек) | ||||
| 				onSelect: -> | ||||
| 					_ajax.loadArtistData $('.search_field').first().val() | ||||
| 			$('.search_field').first().focus() | ||||
| 		, 1 | ||||
| 		false | ||||
|   renderSearch: (data) -> | ||||
|     $('.pulldown').html data | ||||
|     setTimeout -> | ||||
|       $('.search_field').first().bh_autocomplete | ||||
|         serviceUrl: '/artist/autocomplete' # Страница для обработки запросов автозаполнения | ||||
|         minChars: 2 # Минимальная длина запроса для срабатывания автозаполнения | ||||
|         delimiter: /(,|;)\s*/ # Разделитель для нескольких запросов, символ или регулярное выражение | ||||
|         maxHeight: 400 # Максимальная высота списка подсказок, в пикселях | ||||
|         width: 415 # Ширина списка | ||||
|         zIndex: 9999 # z-index списка | ||||
|         deferRequestBy: 500 # Задержка запроса (мсек) | ||||
|         onSelect: -> | ||||
|           _ajax.loadArtistData $('.search_field').first().val() | ||||
|       $('.search_field').first().focus() | ||||
|     , 1 | ||||
|     false | ||||
|    | ||||
| 	renderSettings: (data) -> | ||||
| 		unless _session.getUser().id? | ||||
| 			_ajax.go('/search/') | ||||
| 			return false | ||||
| 		$('.data-container').css background: 'none' | ||||
| 		$('.data-container .inner').html data | ||||
| 		yaCounter7596904.hit _ajax.getAnchor(), 'Settings', _ajax.referer | ||||
| 		_ajax.setTitle 'Settings' | ||||
| 		$('.settings-container .tabs .tab').first().trigger 'click' | ||||
| 		false | ||||
|   renderSettings: (data) -> | ||||
|     unless _session.getUser().id? | ||||
|       #_ajax.go('/') | ||||
|       false | ||||
|     $('#content').html data | ||||
|     #yaCounter7596904.hit _ajax.getAnchor(), 'Settings', _ajax.referer | ||||
|     _ajax.setTitle 'Settings' | ||||
|     false | ||||
|    | ||||
| 	renderTextpage: (data) -> | ||||
| 		$('.data-container').css background: 'url(/images/concrete_wall_2.png) 0 -30px repeat' | ||||
| 		$('.data-container .inner').html data | ||||
| 		_beathaven.redrawScrollbar() | ||||
| 		false | ||||
|   renderTextpage: (data) -> | ||||
|     $('.data-container').css background: 'url(/images/concrete_wall_2.png) 0 -30px repeat' | ||||
|     $('.data-container .inner').html data | ||||
|     _beathaven.redrawScrollbar() | ||||
|     false | ||||
| 
 | ||||
| $('.about').live 'click', -> | ||||
| 	_ajax.go '/about/' | ||||
| 	false | ||||
| $ -> | ||||
|   $('.about').live 'click', -> | ||||
|     _ajax.go '/about/' | ||||
|     false | ||||
|   $('body').live 'click', -> | ||||
|     $('.dropdown-toggle, .menu').parent('li').removeClass('open') | ||||
|     false | ||||
|   $('.dropdown-toggle, .menu').live 'click', -> | ||||
|     $(this).parent('li').toggleClass('open') | ||||
|     false | ||||
|   $('.dropdown-toggle li, .menu li').live 'click', -> | ||||
|     $(this).parent('li').toggleClass('open') | ||||
|     false | ||||
| @ -1,32 +1,32 @@ | ||||
| class window.Session | ||||
|    | ||||
| 	vk_params: null | ||||
| 	user: null | ||||
|   vk_params: null | ||||
|   user: null | ||||
|    | ||||
| 	constructor: (params) -> | ||||
| 		attrs = ['expire', 'mid', 'secret', 'sid', 'sig'] | ||||
| 		_params = {} | ||||
| 		for key in attrs | ||||
| 			if params[key]? | ||||
| 				_params[key] = params[key] | ||||
| 		@vk_params = _params | ||||
|   constructor: (params) -> | ||||
|     attrs = ['expire', 'mid', 'secret', 'sid', 'sig'] | ||||
|     _params = {} | ||||
|     for key in attrs | ||||
|       if params[key]? | ||||
|         _params[key] = params[key] | ||||
|     @vk_params = _params | ||||
|    | ||||
| 	setUser: (user) -> | ||||
| 		@user = user | ||||
| 		_beathaven.lang = @user.lang || 'ru' | ||||
| 		_beathaven.localizeHTML() | ||||
| 		false | ||||
|   setUser: (user) -> | ||||
|     @user = user | ||||
|     _beathaven.lang = @user.lang || 'ru' | ||||
|     _beathaven.localizeHTML() | ||||
|     false | ||||
|      | ||||
| 	getUser: -> | ||||
| 		@user | ||||
|   getUser: -> | ||||
|     @user | ||||
|    | ||||
| 	query: (url, params, callback) -> | ||||
| 		q_params = $.extend {}, @vk_params, params | ||||
| 		$.post url, q_params, callback | ||||
| 		false | ||||
|   query: (url, params, callback) -> | ||||
|     q_params = $.extend {}, @vk_params, params | ||||
|     $.post url, q_params, callback | ||||
|     false | ||||
|    | ||||
| 	reloadSession: -> | ||||
| 		_session.query '/user/auth', {}, (ar) -> | ||||
| 			_session.setUser ar.user | ||||
| 			false | ||||
| 		false | ||||
|   reloadSession: -> | ||||
|     _session.query '/user/auth', {}, (ar) -> | ||||
|       _session.setUser ar.user | ||||
|       false | ||||
|     false | ||||
|  | ||||
| @ -1,64 +1,64 @@ | ||||
| class window.Settings | ||||
|    | ||||
| 	getAccountInfo: (callback) -> | ||||
| 		_session.query '/user/update/', {}, callback | ||||
| 		false | ||||
|   getAccountInfo: (callback) -> | ||||
|     _session.query '/user/update/', {}, callback | ||||
|     false | ||||
|    | ||||
| 	saveAccountInfo: (params, callback) -> | ||||
| 		_session.query '/user/update', params, callback | ||||
| 		false | ||||
|   saveAccountInfo: (params, callback) -> | ||||
|     _session.query '/user/update', params, callback | ||||
|     false | ||||
|      | ||||
| 	loadFormData: (form) -> | ||||
| 		if form == 'account' | ||||
| 			$('.settings-container .form input[name$="username"]').val _session.getUser().name | ||||
| 			$('.settings-container .form input[name$="email"]').val _session.getUser().email | ||||
| 			$('.settings-container .form select').val _session.getUser().lang | ||||
| 		else if form == 'lastfm' | ||||
| 			if _session.getUser().lastfm_username | ||||
| 				$('.form-container input[name$="username"]').first().val _session.getUser().lastfm_username | ||||
| 		false | ||||
|   loadFormData: (form) -> | ||||
|     if form == 'account' | ||||
|       $('.settings-container .form input[name$="username"]').val _session.getUser().name | ||||
|       $('.settings-container .form input[name$="email"]').val _session.getUser().email | ||||
|       $('.settings-container .form select').val _session.getUser().lang | ||||
|     else if form == 'lastfm' | ||||
|       if _session.getUser().lastfm_username | ||||
|         $('.form-container input[name$="username"]').first().val _session.getUser().lastfm_username | ||||
|     false | ||||
|    | ||||
| 	updateLastfmLogin: -> | ||||
| 		if window.lastfm_popup.closed | ||||
| 			_session.query '/user/auth', {}, (ar) -> | ||||
| 				_session.setUser ar.user | ||||
| 				_settings.loadFormData 'lastfm' | ||||
| 		else | ||||
| 			setTimeout _settings.updateLastfmLogin, 100 | ||||
| 		false | ||||
|   updateLastfmLogin: -> | ||||
|     if window.lastfm_popup.closed | ||||
|       _session.query '/user/auth', {}, (ar) -> | ||||
|         _session.setUser ar.user | ||||
|         _settings.loadFormData 'lastfm' | ||||
|     else | ||||
|       setTimeout _settings.updateLastfmLogin, 100 | ||||
|     false | ||||
| 
 | ||||
| 
 | ||||
| $('.settings') .live 'click', -> | ||||
| 	_ajax.go('/settings/'); | ||||
| 	false | ||||
| $('#preferences') .live 'click', -> | ||||
|   _ajax.go('/settings/'); | ||||
|   false | ||||
| 
 | ||||
| $('.settings-container .tabs .tab').live 'click', -> | ||||
| 	if not $(this).hasClass 'active' | ||||
| 		$('.settings-container .tabs .tab').removeClass 'active' | ||||
| 		$(this).addClass 'active' | ||||
| 		$('.form-container').html $('.forms .'+ $(this).attr 'data-fieldset').html() | ||||
| 		_settings.loadFormData $(this).attr 'data-fieldset' | ||||
| 	false | ||||
|   if not $(this).hasClass 'active' | ||||
|     $('.settings-container .tabs .tab').removeClass 'active' | ||||
|     $(this).addClass 'active' | ||||
|     $('.form-container').html $('.forms .'+ $(this).attr 'data-fieldset').html() | ||||
|     _settings.loadFormData $(this).attr 'data-fieldset' | ||||
|   false | ||||
| 
 | ||||
| $('.lastfm-connect') .live 'click', -> | ||||
| 	window.lastfm_popup = window.open _session.getUser().lastfm_login_url | ||||
| 	setTimeout _settings.updateLastfmLogin, 100 | ||||
| 	false | ||||
|   window.lastfm_popup = window.open _session.getUser().lastfm_login_url | ||||
|   setTimeout _settings.updateLastfmLogin, 100 | ||||
|   false | ||||
|    | ||||
| $('.settings-container .form input, .settings-container .form select').live 'blur', -> | ||||
| 	active_tab = $('.settings-container .tabs .tab.active').attr 'data-fieldset' | ||||
| 	if active_tab == 'account' | ||||
| 		params = | ||||
| 			username: $('.settings-container .form input[name$="username"]').first().val() | ||||
| 			email: $('.settings-container .form input[name$="email"]').first().val() | ||||
| 			lang: $('.settings-container .form select').first().val() | ||||
| 		lang_changed = params.lang != _session.getUser().lang | ||||
| 		if lang_changed | ||||
| 			if not confirm _beathaven.ls 'WINDOW_LANG_RELOAD', params.lang | ||||
| 				$('.settings-container .form select').val _session.getUser().lang | ||||
| 		_settings.saveAccountInfo params, -> | ||||
| 			if lang_changed | ||||
| 				window.location.reload() | ||||
| 			$('.header-container .hello .greating span').text (if params.username.length > 0 then params.username else '%username%') | ||||
| 			false | ||||
| 	false | ||||
|   active_tab = $('.settings-container .tabs .tab.active').attr 'data-fieldset' | ||||
|   if active_tab == 'account' | ||||
|     params = | ||||
|       username: $('.settings-container .form input[name$="username"]').first().val() | ||||
|       email: $('.settings-container .form input[name$="email"]').first().val() | ||||
|       lang: $('.settings-container .form select').first().val() | ||||
|     lang_changed = params.lang != _session.getUser().lang | ||||
|     if lang_changed | ||||
|       if not confirm _beathaven.ls 'WINDOW_LANG_RELOAD', params.lang | ||||
|         $('.settings-container .form select').val _session.getUser().lang | ||||
|     _settings.saveAccountInfo params, -> | ||||
|       if lang_changed | ||||
|         window.location.reload() | ||||
|       $('.header-container .hello .greating span').text (if params.username.length > 0 then params.username else '%username%') | ||||
|       false | ||||
|   false | ||||
| @ -32,17 +32,16 @@ class window.Vkontakte | ||||
|           VK.Api.call 'getVariable', key: 1281, (r) -> | ||||
|             _session.query '/user/update', name: r.response, (ar2) -> | ||||
|               _session.setUser ar2.user | ||||
|               $('.header-container .hello .greating') | ||||
|                 .html _beathaven.ls('HELLO')+', <span class="settings">' +(if _session.getUser().name then _session.getUser().name else '%username%')+ '</span>!' | ||||
|               $('#username') | ||||
|                 .html (if _session.getUser().name then _session.getUser().name else '%username%') | ||||
|               window._session = _session | ||||
|               _ajax.detectPage() | ||||
|               $('.fullscreen').hide(); | ||||
|         else | ||||
|           _session.setUser ar.user | ||||
|          | ||||
|         $('.header-container .hello').show() | ||||
|         $('.header-container .hello .greating') | ||||
|           .html _beathaven.ls('HELLO')+', <span class="settings">' +(if _session.getUser().name then _session.getUser().name else '%username%')+ '</span>!' | ||||
|         $('#username') | ||||
|           .html (if _session.getUser().name then _session.getUser().name else '%username%') | ||||
|         window._session = _session | ||||
|         _ajax.detectPage() | ||||
|         $('.fullscreen').hide(); | ||||
|  | ||||
| @ -32,6 +32,10 @@ class UserController < ApplicationController | ||||
|     render :json => @res | ||||
|   end | ||||
|    | ||||
|   def settings | ||||
|     render :partial => 'settings' | ||||
|   end | ||||
|    | ||||
|   def update | ||||
|     return unless authorized? | ||||
|     @res = {} | ||||
|  | ||||
| @ -27,13 +27,13 @@ | ||||
|                 = image_tag "artist_loader.gif" | ||||
|             %ul.nav.secondary-nav | ||||
|               %li.dropdown | ||||
|                 %a.dropdown-toggle{ :href => "#" } chez | ||||
|                 %a.dropdown-toggle#username{ :href => "#" } %username% | ||||
|                 %ul.dropdown-menu | ||||
|                   %li | ||||
|                     %a{ :href => "#" } Preferences | ||||
|                     %a#preferences{ :href => "#" } Preferences | ||||
|                   %li.divider | ||||
|                   %li | ||||
|                     %a{ :href => "#" } Logout | ||||
|                     %a#logout{ :href => "#" } Logout | ||||
|      | ||||
|     .popover-wrapper | ||||
|       .popover.below#autocomplete-container | ||||
|  | ||||
							
								
								
									
										65
									
								
								app/views/user/_settings.html.haml
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										65
									
								
								app/views/user/_settings.html.haml
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,65 @@ | ||||
| %h1 Settings | ||||
| %ul.tabs | ||||
|   %li.active | ||||
|     %a{ :href => "#" } Account | ||||
|   %li | ||||
|     %a{ :href => "#" } Site | ||||
|   %li | ||||
|     %a{ :href => "#" } Music | ||||
|   %li | ||||
|     %a{ :href => "#" } Last.fm | ||||
| 
 | ||||
| .forms | ||||
|   .form.account | ||||
|     %form | ||||
|       %fieldset | ||||
|         .clearfix | ||||
|           %label{ :for => "input-username" } Username | ||||
|           .input | ||||
|             %input.xlarge#input-username{ :name => "input-username", :size => 30, :type => "text" } | ||||
|         .clearfix | ||||
|           %label{ :for => "input-email" } Email | ||||
|           .input | ||||
|             %input.xlarge#input-email{ :name => "input-email", :size => 30, :type => "text" } | ||||
|   .form.site | ||||
|     %form | ||||
|       %fieldset | ||||
|         .clearfix | ||||
|           %label{ :for => "select-lang" } Language | ||||
|           .input | ||||
|             %select.medium#select-lang{ :name => "select-lang" } | ||||
|               %option English | ||||
|               %option Русский | ||||
|   .form.music | ||||
|     %form | ||||
|       %fieldset | ||||
|         .clearfix | ||||
|           %label{ :for => "select-lang" } Show | ||||
|           .input | ||||
|             %ul.inputs-list | ||||
|               %li | ||||
|                 %label.disabled | ||||
|                   %input{ :name => "show-album", :type => "checkbox", :checked => "checked", :disabled => "disabled" } | ||||
|                   %span Albums | ||||
|               %li | ||||
|                 %label | ||||
|                   %input{ :name => "show-single", :type => "checkbox" } | ||||
|                   %span Singles | ||||
|               %li | ||||
|                 %label | ||||
|                   %input{ :name => "show-live", :type => "checkbox" } | ||||
|                   %span Live shows | ||||
|               %li | ||||
|                 %label | ||||
|                   %input{ :name => "show-bootleg", :type => "checkbox" } | ||||
|                   %span Bootlegs | ||||
|   .form.lastfm | ||||
|     %form | ||||
|       %fieldset | ||||
|         .clearfix | ||||
|           %label{ :for => "input-username" } Username | ||||
|           .input | ||||
|             .input-append | ||||
|               %input#input-username{ :name => "input-username", :type => "text", :size => 30 } | ||||
|               %label.add-on | ||||
|                 %input{ :type => "checkbox" } | ||||
| @ -66,6 +66,8 @@ Beathaven::Application.routes.draw do | ||||
|   match 'lastfm/listening' => 'last_fm#listening' | ||||
|   match 'lastfm/scrobble' => 'last_fm#scrobble' | ||||
|    | ||||
|   match 'settings' => 'user#settings' | ||||
|    | ||||
|   match 'artist/autocomplete' => 'artist#autocomplete' | ||||
|   match 'artist/(:name)/' => 'artist#data', :constraints => { :name => /[^\/]*/ } | ||||
| end | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user