You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@allura.apache.org by br...@apache.org on 2014/07/18 21:02:16 UTC
[09/28] git commit: [#5472] Replace Spinner js with animated gif
[#5472] Replace Spinner js with animated gif
Signed-off-by: Tim Van Steenburgh <tv...@gmail.com>
Project: http://git-wip-us.apache.org/repos/asf/allura/repo
Commit: http://git-wip-us.apache.org/repos/asf/allura/commit/aee07533
Tree: http://git-wip-us.apache.org/repos/asf/allura/tree/aee07533
Diff: http://git-wip-us.apache.org/repos/asf/allura/diff/aee07533
Branch: refs/heads/db/7523
Commit: aee075331c64e1f4e5a408ed57c16e371fd03ebf
Parents: 051b60d
Author: Tim Van Steenburgh <tv...@gmail.com>
Authored: Sat Jun 28 22:49:41 2014 -0400
Committer: Dave Brondsema <db...@slashdotmedia.com>
Committed: Tue Jul 8 22:05:12 2014 +0000
----------------------------------------------------------------------
Allura/allura/nf/allura/css/site_style.css | 5 +++-
Allura/allura/public/nf/js/spin.min.js | 25 -------------------
Allura/allura/templates/repo/repo_master.html | 24 +++---------------
Allura/allura/templates/repo/tarball.html | 29 ++++++----------------
4 files changed, 15 insertions(+), 68 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/allura/blob/aee07533/Allura/allura/nf/allura/css/site_style.css
----------------------------------------------------------------------
diff --git a/Allura/allura/nf/allura/css/site_style.css b/Allura/allura/nf/allura/css/site_style.css
index 27fe2c4..c4b7326 100644
--- a/Allura/allura/nf/allura/css/site_style.css
+++ b/Allura/allura/nf/allura/css/site_style.css
@@ -2911,8 +2911,11 @@ h1.title .viewer:hover {
}
/* Repo status indicator, displayed on repo pages if status != 'ready' */
+#repo_status {
+ margin: 0 10px;
+}
#repo_status h2 {
- padding-left: 33px;
+ display: inline-block;
}
.neighborhood_feed_entry h3 {
http://git-wip-us.apache.org/repos/asf/allura/blob/aee07533/Allura/allura/public/nf/js/spin.min.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/spin.min.js b/Allura/allura/public/nf/js/spin.min.js
deleted file mode 100644
index 21af822..0000000
--- a/Allura/allura/public/nf/js/spin.min.js
+++ /dev/null
@@ -1,25 +0,0 @@
-/*
- * The MIT License
- *
- * Copyright (c) 2011 Felix Gnass [fgnass at neteye dot de]
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in
- * all copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
- * THE SOFTWARE.
- */
-//fgnass.github.com/spin.js#v1.2.5
-(function(a,b,c){function g(a,c){var d=b.createElement(a||"div"),e;for(e in c)d[e]=c[e];return d}function h(a){for(var b=1,c=arguments.length;b<c;b++)a.appendChild(arguments[b]);return a}function j(a,b,c,d){var g=["opacity",b,~~(a*100),c,d].join("-"),h=.01+c/d*100,j=Math.max(1-(1-a)/b*(100-h),a),k=f.substring(0,f.indexOf("Animation")).toLowerCase(),l=k&&"-"+k+"-"||"";return e[g]||(i.insertRule("@"+l+"keyframes "+g+"{"+"0%{opacity:"+j+"}"+h+"%{opacity:"+a+"}"+(h+.01)+"%{opacity:1}"+(h+b)%100+"%{opacity:"+a+"}"+"100%{opacity:"+j+"}"+"}",0),e[g]=1),g}function k(a,b){var e=a.style,f,g;if(e[b]!==c)return b;b=b.charAt(0).toUpperCase()+b.slice(1);for(g=0;g<d.length;g++){f=d[g]+b;if(e[f]!==c)return f}}function l(a,b){for(var c in b)a.style[k(a,c)||c]=b[c];return a}function m(a){for(var b=1;b<arguments.length;b++){var d=arguments[b];for(var e in d)a[e]===c&&(a[e]=d[e])}return a}function n(a){var b={x:a.offsetLeft,y:a.offsetTop};while(a=a.offsetParent)b.x+=a.offsetLeft,b.y+=a.offsetTop;return
b}var d=["webkit","Moz","ms","O"],e={},f,i=function(){var a=g("style");return h(b.getElementsByTagName("head")[0],a),a.sheet||a.styleSheet}(),o={lines:12,length:7,width:5,radius:10,rotate:0,color:"#000",speed:1,trail:100,opacity:.25,fps:20,zIndex:2e9,className:"spinner",top:"auto",left:"auto"},p=function q(a){if(!this.spin)return new q(a);this.opts=m(a||{},q.defaults,o)};p.defaults={},m(p.prototype,{spin:function(a){this.stop();var b=this,c=b.opts,d=b.el=l(g(0,{className:c.className}),{position:"relative",zIndex:c.zIndex}),e=c.radius+c.length+c.width,h,i;a&&(a.insertBefore(d,a.firstChild||null),i=n(a),h=n(d),l(d,{left:(c.left=="auto"?i.x-h.x+(a.offsetWidth>>1):c.left+e)+"px",top:(c.top=="auto"?i.y-h.y+(a.offsetHeight>>1):c.top+e)+"px"})),d.setAttribute("aria-role","progressbar"),b.lines(d,b.opts);if(!f){var j=0,k=c.fps,m=k/c.speed,o=(1-c.opacity)/(m*c.trail/100),p=m/c.lines;!function q(){j++;for(var a=c.lines;a;a--){var e=Math.max(1-(j+a*p)%m*o,c.opacity);b.opacity(d,c.lines-a,e,c)
}b.timeout=b.el&&setTimeout(q,~~(1e3/k))}()}return b},stop:function(){var a=this.el;return a&&(clearTimeout(this.timeout),a.parentNode&&a.parentNode.removeChild(a),this.el=c),this},lines:function(a,b){function e(a,d){return l(g(),{position:"absolute",width:b.length+b.width+"px",height:b.width+"px",background:a,boxShadow:d,transformOrigin:"left",transform:"rotate("+~~(360/b.lines*c+b.rotate)+"deg) translate("+b.radius+"px"+",0)",borderRadius:(b.width>>1)+"px"})}var c=0,d;for(;c<b.lines;c++)d=l(g(),{position:"absolute",top:1+~(b.width/2)+"px",transform:b.hwaccel?"translate3d(0,0,0)":"",opacity:b.opacity,animation:f&&j(b.opacity,b.trail,c,b.lines)+" "+1/b.speed+"s linear infinite"}),b.shadow&&h(d,l(e("#000","0 0 4px #000"),{top:"2px"})),h(a,h(d,e(b.color,"0 0 1px rgba(0,0,0,.1)")));return a},opacity:function(a,b,c){b<a.childNodes.length&&(a.childNodes[b].style.opacity=c)}}),!function(){function a(a,b){return g("<"+a+' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">',b)}var b=l(
g("group"),{behavior:"url(#default#VML)"});!k(b,"transform")&&b.adj?(i.addRule(".spin-vml","behavior:url(#default#VML)"),p.prototype.lines=function(b,c){function f(){return l(a("group",{coordsize:e+" "+e,coordorigin:-d+" "+ -d}),{width:e,height:e})}function k(b,e,g){h(i,h(l(f(),{rotation:360/c.lines*b+"deg",left:~~e}),h(l(a("roundrect",{arcsize:1}),{width:d,height:c.width,left:c.radius,top:-c.width>>1,filter:g}),a("fill",{color:c.color,opacity:c.opacity}),a("stroke",{opacity:0}))))}var d=c.length+c.width,e=2*d,g=-(c.width+c.length)*2+"px",i=l(f(),{position:"absolute",top:g,left:g}),j;if(c.shadow)for(j=1;j<=c.lines;j++)k(j,-2,"progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)");for(j=1;j<=c.lines;j++)k(j);return h(b,i)},p.prototype.opacity=function(a,b,c,d){var e=a.firstChild;d=d.shadow&&d.lines||0,e&&b+d<e.childNodes.length&&(e=e.childNodes[b+d],e=e&&e.firstChild,e=e&&e.firstChild,e&&(e.opacity=c))}):f=k(b,"animation")}(),a.Spinner=p})(window,docume
nt);
http://git-wip-us.apache.org/repos/asf/allura/blob/aee07533/Allura/allura/templates/repo/repo_master.html
----------------------------------------------------------------------
diff --git a/Allura/allura/templates/repo/repo_master.html b/Allura/allura/templates/repo/repo_master.html
index 88d2af6..8de6236 100644
--- a/Allura/allura/templates/repo/repo_master.html
+++ b/Allura/allura/templates/repo/repo_master.html
@@ -34,7 +34,6 @@
{% endblock %}
{% block extra_js %}
-<script type="text/javascript" src="{{g.forge_static('js/spin.min.js')}}"></script>
<script type="text/javascript">(function() {
$('#access_urls .btn').click(function(evt){
evt.preventDefault();
@@ -50,30 +49,12 @@
var repo_status = document.getElementById('repo_status');
// The repo_status div will only be present if repo.status != 'ready'
if (repo_status) {
- var opts = {
- lines: 9, // The number of lines to draw
- length: 4, // The length of each line
- width: 2, // The line thickness
- radius: 3, // The radius of the inner circle
- rotate: 0, // The rotation offset
- color: '#555', // #rgb or #rrggbb
- speed: 1, // Rounds per second
- trail: 60, // Afterglow percentage
- shadow: false, // Whether to render a shadow
- hwaccel: false, // Whether to use hardware acceleration
- className: 'spinner', // The CSS class to assign to the spinner
- zIndex: 2e9, // The z-index (defaults to 2000000000)
- top: 10, // Top position relative to parent in px
- left: 10 // Left position relative to parent in px
- };
- var spinner = new Spinner(opts).spin(repo_status);
+ $('.spinner').show()
function check_status() {
$.get('{{repo.url()}}status', function(data) {
if (data.status === 'ready') {
window.clearInterval(status_checker);
- spinner.opts.speed = 0;
- spinner.opts.opacity = 1;
- spinner.spin(repo_status)
+ $('.spinner').hide()
$('#repo_status h2').html('Repo status: ready. <a href=".">Click here to refresh this page.</a>');
}
else {
@@ -92,6 +73,7 @@
{% block before_content %}
{% if repo and repo.status != 'ready' %}
<div id="repo_status">
+ <img src="{{g.forge_static('images/spinner.gif')}}" class="spinner" style="display:none"/>
<h2>Repo status: <span>{{repo.status}}</span>...</h2>
</div>
{% endif %}
http://git-wip-us.apache.org/repos/asf/allura/blob/aee07533/Allura/allura/templates/repo/tarball.html
----------------------------------------------------------------------
diff --git a/Allura/allura/templates/repo/tarball.html b/Allura/allura/templates/repo/tarball.html
index 04dd5d2..69a1ca4 100644
--- a/Allura/allura/templates/repo/tarball.html
+++ b/Allura/allura/templates/repo/tarball.html
@@ -36,28 +36,12 @@ Commit <a href="{{commit.url()}}">{{commit.shorthand_id()}}</a> {{commit_labels(
});
{% endif %}
{% elif status in ('ready', 'busy') %}
- var opts = {
- lines: 9, // The number of lines to draw
- length: 4, // The length of each line
- width: 2, // The line thickness
- radius: 3, // The radius of the inner circle
- rotate: 0, // The rotation offset
- color: '#555', // #rgb or #rrggbb
- speed: 1, // Rounds per second
- trail: 60, // Afterglow percentage
- shadow: false, // Whether to render a shadow
- hwaccel: false, // Whether to use hardware acceleration
- className: 'spinner', // The CSS class to assign to the spinner
- zIndex: 2e9, // The z-index (defaults to 2000000000)
- top: 10, // Top position relative to parent in px
- left: 10 // Left position relative to parent in px
- };
- var spinner = new Spinner(opts).spin($('#snapshot_status')[0]);
+ $('.spinner').show()
var delay = 500;
function check_status() {
$.get('{{commit.url()}}tarball_status?path={{path}}', function(data) {
if (data.status === 'complete') {
- spinner.stop();
+ $('.spinner').hide()
$('#snapshot_status h2').hide();
$('#snapshot_status h2.complete').show();
{% if 'no-redirect' not in request.params %}
@@ -70,7 +54,7 @@ Commit <a href="{{commit.url()}}">{{commit.shorthand_id()}}</a> {{commit_labels(
$('#snapshot_status h2.busy').show();
} else {
// something went wrong
- spinner.stop();
+ $('.spinner').hide()
$('#snapshot_status h2').hide();
$('#snapshot_status form').show();
}
@@ -90,6 +74,7 @@ Commit <a href="{{commit.url()}}">{{commit.shorthand_id()}}</a> {{commit_labels(
{% block content %}
{% set path = request.params.get('path', '') %}
<div id='snapshot_status'>
+ <img src="{{g.forge_static('images/spinner.gif')}}" class="spinner" style="display:none"/>
<h2 class="busy ready">Generating snapshot...</h2>
<h2 class="complete">Your download will begin shortly, or use this <a href="{{c.app.repo.tarball_url(revision, path)}}">direct link</a>.</h2>
<form action="tarball" method="post" class="None">
@@ -103,12 +88,14 @@ Commit <a href="{{commit.url()}}">{{commit.shorthand_id()}}</a> {{commit_labels(
{% block extra_css %}
<style type="text/css">
+ #snapshot_status {
+ margin: 0 10px;
+ }
#snapshot_status h2 {
- padding-left: 33px;
display: none;
}
#snapshot_status .{{ status }} {
- display: block;
+ display: inline-block;
}
#snapshot_status form {
display: none;