From 5db3396c07b26892a2e3cd26dc369113379553b1 Mon Sep 17 00:00:00 2001 From: Jean-Philippe Lang Date: Fri, 27 Apr 2007 19:32:57 +0000 Subject: [PATCH] Added an ajax indicator for all ajax calls. Also removed highlight effects on my page layout edition. git-svn-id: http://redmine.rubyforge.org/svn/trunk@485 e93f8b46-1217-0410-a6f0-8f06a7374b81 --- app/views/layouts/base.rhtml | 6 +++++- app/views/my/_block.rhtml | 4 +--- app/views/my/page_layout.rhtml | 30 ++++++++++-------------------- app/views/wiki/edit.rhtml | 8 ++------ lang/de.yml | 1 + lang/en.yml | 1 + lang/es.yml | 1 + lang/fr.yml | 1 + lang/it.yml | 1 + lang/ja.yml | 1 + lang/pt.yml | 1 + lang/zh.yml | 1 + public/javascripts/application.js | 16 +++++++++++++++- public/stylesheets/application.css | 27 +++++++++++++++++++++++++++ 14 files changed, 68 insertions(+), 31 deletions(-) diff --git a/app/views/layouts/base.rhtml b/app/views/layouts/base.rhtml index 1929e386a..3d6390b95 100644 --- a/app/views/layouts/base.rhtml +++ b/app/views/layouts/base.rhtml @@ -115,12 +115,16 @@ <% end %> - +
<% if flash[:notice] %>

<%= flash[:notice] %>

<% end %> <%= yield %>
+ + diff --git a/app/views/my/_block.rhtml b/app/views/my/_block.rhtml index 39e6c3bd7..bb5dd1f9f 100644 --- a/app/views/my/_block.rhtml +++ b/app/views/my/_block.rhtml @@ -3,9 +3,7 @@
<%= link_to_remote "", { :url => { :action => "remove_block", :block => block_name }, - :complete => "removeBlock('block_#{block_name}')", - :loading => "Element.show('indicator')", - :loaded => "Element.hide('indicator')" }, + :complete => "removeBlock('block_#{block_name}')" }, :class => "close-icon" %>
diff --git a/app/views/my/page_layout.rhtml b/app/views/my/page_layout.rhtml index 8cb09a554..28d2dbab8 100644 --- a/app/views/my/page_layout.rhtml +++ b/app/views/my/page_layout.rhtml @@ -5,9 +5,9 @@ function recreateSortables() { Sortable.destroy('list-left'); Sortable.destroy('list-right'); - Sortable.create("list-top", {constraint:false, containment:['list-top','list-left','list-right'], dropOnEmpty:true, handle:'handle', onUpdate:function(){new Ajax.Request('/my/order_blocks?group=top', {asynchronous:true, evalScripts:true, onComplete:function(request){new Effect.Highlight("list-top",{});}, onLoaded:function(request){Element.hide('indicator')}, onLoading:function(request){Element.show('indicator')}, parameters:Sortable.serialize("list-top")})}, only:'mypage-box', tag:'div'}) - Sortable.create("list-left", {constraint:false, containment:['list-top','list-left','list-right'], dropOnEmpty:true, handle:'handle', onUpdate:function(){new Ajax.Request('/my/order_blocks?group=left', {asynchronous:true, evalScripts:true, onComplete:function(request){new Effect.Highlight("list-left",{});}, onLoaded:function(request){Element.hide('indicator')}, onLoading:function(request){Element.show('indicator')}, parameters:Sortable.serialize("list-left")})}, only:'mypage-box', tag:'div'}) - Sortable.create("list-right", {constraint:false, containment:['list-top','list-left','list-right'], dropOnEmpty:true, handle:'handle', onUpdate:function(){new Ajax.Request('/my/order_blocks?group=right', {asynchronous:true, evalScripts:true, onComplete:function(request){new Effect.Highlight("list-right",{});}, onLoaded:function(request){Element.hide('indicator')}, onLoading:function(request){Element.show('indicator')}, parameters:Sortable.serialize("list-right")})}, only:'mypage-box', tag:'div'}) + Sortable.create("list-top", {constraint:false, containment:['list-top','list-left','list-right'], dropOnEmpty:true, handle:'handle', onUpdate:function(){new Ajax.Request('/my/order_blocks?group=top', {asynchronous:true, evalScripts:true, parameters:Sortable.serialize("list-top")})}, only:'mypage-box', tag:'div'}) + Sortable.create("list-left", {constraint:false, containment:['list-top','list-left','list-right'], dropOnEmpty:true, handle:'handle', onUpdate:function(){new Ajax.Request('/my/order_blocks?group=left', {asynchronous:true, evalScripts:true, parameters:Sortable.serialize("list-left")})}, only:'mypage-box', tag:'div'}) + Sortable.create("list-right", {constraint:false, containment:['list-top','list-left','list-right'], dropOnEmpty:true, handle:'handle', onUpdate:function(){new Ajax.Request('/my/order_blocks?group=right', {asynchronous:true, evalScripts:true, parameters:Sortable.serialize("list-right")})}, only:'mypage-box', tag:'div'}) } function updateSelect() { @@ -35,7 +35,6 @@ function removeBlock(block) {
- <% form_tag({:action => "add_block"}, :id => "block-form") do %> <%= select_tag 'block', "" + options_for_select(@block_options), :id => "block-select" %> <%= link_to_remote l(:button_add), @@ -43,9 +42,7 @@ function removeBlock(block) { :with => "Form.serialize('block-form')", :update => "list-top", :position => :top, - :complete => "afterAddBlock();", - :loading => "Element.show('indicator')", - :loaded => "Element.hide('indicator')" + :complete => "afterAddBlock();" }, :class => 'icon icon-add' %> <% end %> @@ -83,10 +80,7 @@ function removeBlock(block) { :dropOnEmpty => true, :containment => ['list-top', 'list-left', 'list-right'], :constraint => false, - :complete => visual_effect(:highlight, 'list-top'), - :url => { :action => "order_blocks", :group => "top" }, - :loading => "Element.show('indicator')", - :loaded => "Element.hide('indicator')" + :url => { :action => "order_blocks", :group => "top" } %> @@ -97,10 +91,8 @@ function removeBlock(block) { :dropOnEmpty => true, :containment => ['list-top', 'list-left', 'list-right'], :constraint => false, - :complete => visual_effect(:highlight, 'list-left'), - :url => { :action => "order_blocks", :group => "left" }, - :loading => "Element.show('indicator')", - :loaded => "Element.hide('indicator')" %> + :url => { :action => "order_blocks", :group => "left" } + %> <%= sortable_element 'list-right', :tag => 'div', @@ -109,9 +101,7 @@ function removeBlock(block) { :dropOnEmpty => true, :containment => ['list-top', 'list-left', 'list-right'], :constraint => false, - :complete => visual_effect(:highlight, 'list-right'), - :url => { :action => "order_blocks", :group => "right" }, - :loading => "Element.show('indicator')", - :loaded => "Element.hide('indicator')" %> + :url => { :action => "order_blocks", :group => "right" } + %> -<%= javascript_tag "updateSelect()" %> \ No newline at end of file +<%= javascript_tag "updateSelect()" %> diff --git a/app/views/wiki/edit.rhtml b/app/views/wiki/edit.rhtml index af0b24df0..1c0139e73 100644 --- a/app/views/wiki/edit.rhtml +++ b/app/views/wiki/edit.rhtml @@ -18,12 +18,8 @@ { :url => { :controller => 'wiki', :action => 'preview', :id => @project, :page => @page.title }, :method => 'get', :update => 'preview', - :with => "Form.serialize('wiki_form')", - :loading => "Element.show('indicator')", - :loaded => "Element.hide('indicator')" - } %> - -

+ :with => "Form.serialize('wiki_form')" + } %>

<% end %> diff --git a/lang/de.yml b/lang/de.yml index 8785640fd..3cf43bf4b 100644 --- a/lang/de.yml +++ b/lang/de.yml @@ -362,6 +362,7 @@ label_permissions_report: Permissions report label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: Einloggen button_submit: OK diff --git a/lang/en.yml b/lang/en.yml index 9e6016251..e1329bed2 100644 --- a/lang/en.yml +++ b/lang/en.yml @@ -362,6 +362,7 @@ label_permissions_report: Permissions report label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: Login button_submit: Submit diff --git a/lang/es.yml b/lang/es.yml index 2453e232c..3522bd42a 100644 --- a/lang/es.yml +++ b/lang/es.yml @@ -362,6 +362,7 @@ label_permissions_report: Permissions report label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: Conexión button_submit: Someter diff --git a/lang/fr.yml b/lang/fr.yml index cddf467a2..0541f09f3 100644 --- a/lang/fr.yml +++ b/lang/fr.yml @@ -362,6 +362,7 @@ label_permissions_report: Synthèse des permissions label_watched_issues: Demandes surveillées label_related_issues: Demandes liées label_applied_status: Statut appliqué +label_loading: Chargement... button_login: Connexion button_submit: Soumettre diff --git a/lang/it.yml b/lang/it.yml index 42ff23f76..2861ced32 100644 --- a/lang/it.yml +++ b/lang/it.yml @@ -362,6 +362,7 @@ label_permissions_report: Report permessi label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: Login button_submit: Invia diff --git a/lang/ja.yml b/lang/ja.yml index 10833b902..3b62421d1 100644 --- a/lang/ja.yml +++ b/lang/ja.yml @@ -363,6 +363,7 @@ label_permissions_report: 権限レポート label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: ログイン button_submit: 変更 diff --git a/lang/pt.yml b/lang/pt.yml index 658872c1e..8cc98aa88 100644 --- a/lang/pt.yml +++ b/lang/pt.yml @@ -362,6 +362,7 @@ label_permissions_report: Relatorio de permissoes label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: Login button_submit: Enviar diff --git a/lang/zh.yml b/lang/zh.yml index e125310df..3a5ad7c81 100644 --- a/lang/zh.yml +++ b/lang/zh.yml @@ -365,6 +365,7 @@ label_permissions_report: Permissions report label_watched_issues: Watched issues label_related_issues: Related issues label_applied_status: Applied status +label_loading: Loading... button_login: 登录 button_submit: 提交 diff --git a/public/javascripts/application.js b/public/javascripts/application.js index a5d9de292..81708d1d9 100644 --- a/public/javascripts/application.js +++ b/public/javascripts/application.js @@ -30,4 +30,18 @@ function showTab(name) { Element.show('tab-content-' + name); Element.addClassName('tab-' + name, "selected"); return false; -} \ No newline at end of file +} + +/* shows and hides ajax indicator */ +Ajax.Responders.register({ + onCreate: function(){ + if ($('ajax-indicator') && Ajax.activeRequestCount > 0) { + Element.show('ajax-indicator'); + } + }, + onComplete: function(){ + if ($('ajax-indicator') && Ajax.activeRequestCount == 0) { + Element.hide('ajax-indicator'); + } + } +}); diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index 3ca6e40e0..b5c631e4b 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -636,3 +636,30 @@ div.wiki code { } #preview .preview { background: #fafbfc url(../images/draft.png); } + +#ajax-indicator { +position: absolute; /* fixed not supported by IE */ +background-color:#eee; +border: 1px solid #bbb; +top:35%; +left:40%; +width:20%; +font-weight:bold; +text-align:center; +padding:0.6em; +z-index:100; +filter:alpha(opacity=50); +-moz-opacity:0.5; +opacity: 0.5; +-khtml-opacity: 0.5; +} + +html>body #ajax-indicator { position: fixed; } + +#ajax-indicator span { +background-position: 0% 40%; +background-repeat: no-repeat; +background-image: url(../images/loading.gif); +padding-left: 26px; +vertical-align: bottom; +}