From bc0fb62d35eae0850d48e92bece1873664ca2410 Mon Sep 17 00:00:00 2001 From: Radek Czajka Date: Wed, 22 Sep 2010 13:23:26 +0200 Subject: [PATCH 1/1] fixes #874: got rid of marqee --- apps/sponsors/templates/sponsors/page.html | 23 +-- wolnelektury/settings.py | 2 +- wolnelektury/static/css/sponsors.css | 16 +-- wolnelektury/static/js/catalogue.js | 15 +- wolnelektury/static/js/jquery.cycle.min.js | 11 ++ wolnelektury/static/js/jquery.marquee.js | 155 --------------------- 6 files changed, 32 insertions(+), 190 deletions(-) create mode 100644 wolnelektury/static/js/jquery.cycle.min.js delete mode 100644 wolnelektury/static/js/jquery.marquee.js diff --git a/apps/sponsors/templates/sponsors/page.html b/apps/sponsors/templates/sponsors/page.html index 77624fb98..d0adbbf3b 100644 --- a/apps/sponsors/templates/sponsors/page.html +++ b/apps/sponsors/templates/sponsors/page.html @@ -1,10 +1,15 @@ - -{% for column in sponsors %} - - {{ column.name }} - {% for sponsor in column.sponsors %} - {% if sponsor.url %}{% endif %}{% if sponsor.url %}{% endif %} +
+ {% for column in sponsors %} +
+

{{ column.name|default:" " }}

+
+ {% for sponsor in column.sponsors %} + {% if sponsor.url %}{% endif %} + {{ sponsor.name }} + {% if sponsor.url %}{% endif %} + {% endfor %} +
+
{% endfor %} - -{% endfor %} -
 +
+ \ No newline at end of file diff --git a/wolnelektury/settings.py b/wolnelektury/settings.py index a8bb82dd2..95c9bf319 100644 --- a/wolnelektury/settings.py +++ b/wolnelektury/settings.py @@ -165,7 +165,7 @@ COMPRESS_JS = { 'js/jquery.countdown-de.js', 'js/jquery.countdown-uk.js', 'js/jquery.countdown-es.js', 'js/jquery.countdown-lt.js', 'js/jquery.countdown-ru.js', 'js/jquery.countdown-fr.js', - 'js/jquery.marquee.js', + 'js/jquery.cycle.min.js', 'js/jquery.jqmodal.js', 'js/jquery.labelify.js', 'js/catalogue.js', ), 'output_filename': 'js/all?.min.js', diff --git a/wolnelektury/static/css/sponsors.css b/wolnelektury/static/css/sponsors.css index 4b847dc76..73e4df979 100644 --- a/wolnelektury/static/css/sponsors.css +++ b/wolnelektury/static/css/sponsors.css @@ -1,14 +1,8 @@ -.sponsors-sponsor-logo { - margin-left: 1em; - vertical-align: middle; +.sponsors-column { + float: left; + width: 150px; } -.sponsors-sponsor-column { - line-height: 120px; - padding-right: 5em; -} - -.sponsors-sponsor-column-name { - font-weight: bold; - font-size: 1.25em; +.sponsors-page img { + float: left; } diff --git a/wolnelektury/static/js/catalogue.js b/wolnelektury/static/js/catalogue.js index cb31654c9..9679607e5 100644 --- a/wolnelektury/static/js/catalogue.js +++ b/wolnelektury/static/js/catalogue.js @@ -447,20 +447,7 @@ function serverTime() { return false; }); - $('marquee').marquee().mouseover(function () { - $(this).trigger('stop'); - }).mouseout(function () { - $(this).trigger('start'); - $(this).data('drag', false); - }).mousemove(function (event) { - if ($(this).data('drag') == true) { - this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX); - } - }).mousedown(function (event) { - $(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft); - }).mouseup(function () { - $(this).data('drag', false); - }); + $('.sponsors').cycle({timeout: 3000}); $('.widget-code').focus( function(){ diff --git a/wolnelektury/static/js/jquery.cycle.min.js b/wolnelektury/static/js/jquery.cycle.min.js new file mode 100644 index 000000000..3db15eb8d --- /dev/null +++ b/wolnelektury/static/js/jquery.cycle.min.js @@ -0,0 +1,11 @@ +/*! + * jQuery Cycle Lite Plugin + * http://malsup.com/jquery/cycle/lite/ + * Copyright (c) 2008 M. Alsup + * Version: 1.0 (06/08/2008) + * Dual licensed under the MIT and GPL licenses: + * http://www.opensource.org/licenses/mit-license.php + * http://www.gnu.org/licenses/gpl.html + * Requires: jQuery v1.2.3 or later + */ +(function(D){var A="Lite-1.0";D.fn.cycle=function(E){return this.each(function(){E=E||{};if(this.cycleTimeout){clearTimeout(this.cycleTimeout)}this.cycleTimeout=0;this.cyclePause=0;var I=D(this);var J=E.slideExpr?D(E.slideExpr,this):I.children();var G=J.get();if(G.length<2){if(window.console&&window.console.log){window.console.log("terminating; too few slides: "+G.length)}return }var H=D.extend({},D.fn.cycle.defaults,E||{},D.metadata?I.metadata():D.meta?I.data():{});H.before=H.before?[H.before]:[];H.after=H.after?[H.after]:[];H.after.unshift(function(){H.busy=0});var F=this.className;H.width=parseInt((F.match(/w:(\d+)/)||[])[1])||H.width;H.height=parseInt((F.match(/h:(\d+)/)||[])[1])||H.height;H.timeout=parseInt((F.match(/t:(\d+)/)||[])[1])||H.timeout;if(I.css("position")=="static"){I.css("position","relative")}if(H.width){I.width(H.width)}if(H.height&&H.height!="auto"){I.height(H.height)}var K=0;J.css({position:"absolute",top:0,left:0}).hide().each(function(M){D(this).css("z-index",G.length-M)});D(G[K]).css("opacity",1).show();if(D.browser.msie){G[K].style.removeAttribute("filter")}if(H.fit&&H.width){J.width(H.width)}if(H.fit&&H.height&&H.height!="auto"){J.height(H.height)}if(H.pause){I.hover(function(){this.cyclePause=1},function(){this.cyclePause=0})}D.fn.cycle.transitions.fade(I,J,H);J.each(function(){var M=D(this);this.cycleH=(H.fit&&H.height)?H.height:M.height();this.cycleW=(H.fit&&H.width)?H.width:M.width()});J.not(":eq("+K+")").css({opacity:0});if(H.cssFirst){D(J[K]).css(H.cssFirst)}if(H.timeout){if(H.speed.constructor==String){H.speed={slow:600,fast:200}[H.speed]||400}if(!H.sync){H.speed=H.speed/2}while((H.timeout-H.speed)<250){H.timeout+=H.speed}}H.speedIn=H.speed;H.speedOut=H.speed;H.slideCount=G.length;H.currSlide=K;H.nextSlide=1;var L=J[K];if(H.before.length){H.before[0].apply(L,[L,L,H,true])}if(H.after.length>1){H.after[1].apply(L,[L,L,H,true])}if(H.click&&!H.next){H.next=H.click}if(H.next){D(H.next).bind("click",function(){return C(G,H,H.rev?-1:1)})}if(H.prev){D(H.prev).bind("click",function(){return C(G,H,H.rev?1:-1)})}if(H.timeout){this.cycleTimeout=setTimeout(function(){B(G,H,0,!H.rev)},H.timeout+(H.delay||0))}})};function B(J,E,I,K){if(E.busy){return }var H=J[0].parentNode,M=J[E.currSlide],L=J[E.nextSlide];if(H.cycleTimeout===0&&!I){return }if(I||!H.cyclePause){if(E.before.length){D.each(E.before,function(N,O){O.apply(L,[M,L,E,K])})}var F=function(){if(D.browser.msie){this.style.removeAttribute("filter")}D.each(E.after,function(N,O){O.apply(L,[M,L,E,K])})};if(E.nextSlide!=E.currSlide){E.busy=1;D.fn.cycle.custom(M,L,E,F)}var G=(E.nextSlide+1)==J.length;E.nextSlide=G?0:E.nextSlide+1;E.currSlide=G?J.length-1:E.nextSlide-1}if(E.timeout){H.cycleTimeout=setTimeout(function(){B(J,E,0,!E.rev)},E.timeout)}}function C(E,F,I){var H=E[0].parentNode,G=H.cycleTimeout;if(G){clearTimeout(G);H.cycleTimeout=0}F.nextSlide=F.currSlide+I;if(F.nextSlide<0){F.nextSlide=E.length-1}else{if(F.nextSlide>=E.length){F.nextSlide=0}}B(E,F,1,I>=0);return false}D.fn.cycle.custom=function(K,H,I,E){var J=D(K),G=D(H);G.css({opacity:0});var F=function(){G.animate({opacity:1},I.speedIn,I.easeIn,E)};J.animate({opacity:0},I.speedOut,I.easeOut,function(){J.css({display:"none"});if(!I.sync){F()}});if(I.sync){F()}};D.fn.cycle.transitions={fade:function(F,G,E){G.not(":eq(0)").css("opacity",0);E.before.push(function(){D(this).show()})}};D.fn.cycle.ver=function(){return A};D.fn.cycle.defaults={timeout:4000,speed:1000,next:null,prev:null,before:null,after:null,height:"auto",sync:1,fit:0,pause:0,delay:0,slideExpr:null}})(jQuery) \ No newline at end of file diff --git a/wolnelektury/static/js/jquery.marquee.js b/wolnelektury/static/js/jquery.marquee.js deleted file mode 100644 index d0200ef2f..000000000 --- a/wolnelektury/static/js/jquery.marquee.js +++ /dev/null @@ -1,155 +0,0 @@ -/** -* author Remy Sharp -* url http://remysharp.com/tag/marquee -*/ - -(function ($) { - $.fn.marquee = function (klass) { - var newMarquee = [], - last = this.length; - - // works out the left or right hand reset position, based on scroll - // behavior, current direction and new direction - function getReset(newDir, marqueeRedux, marqueeState) { - var behavior = marqueeState.behavior, width = marqueeState.width, dir = marqueeState.dir; - var r = 0; - if (behavior == 'alternate') { - r = newDir == 1 ? marqueeRedux[marqueeState.widthAxis] - (width*2) : width; - } else if (behavior == 'slide') { - if (newDir == -1) { - r = dir == -1 ? marqueeRedux[marqueeState.widthAxis] : width; - } else { - r = dir == -1 ? marqueeRedux[marqueeState.widthAxis] - (width*2) : 0; - } - } else { - r = newDir == -1 ? marqueeRedux[marqueeState.widthAxis] : 0; - } - return r; - } - - // single "thread" animation - function animateMarquee() { - var i = newMarquee.length, - marqueeRedux = null, - $marqueeRedux = null, - marqueeState = {}, - newMarqueeList = [], - hitedge = false; - - while (i--) { - marqueeRedux = newMarquee[i]; - $marqueeRedux = $(marqueeRedux); - marqueeState = $marqueeRedux.data('marqueeState'); - - if ($marqueeRedux.data('paused') !== true) { - // TODO read scrollamount, dir, behavior, loops and last from data - marqueeRedux[marqueeState.axis] += (marqueeState.scrollamount * marqueeState.dir); - - // only true if it's hit the end - hitedge = marqueeState.dir == -1 ? marqueeRedux[marqueeState.axis] <= getReset(marqueeState.dir * -1, marqueeRedux, marqueeState) : marqueeRedux[marqueeState.axis] >= getReset(marqueeState.dir * -1, marqueeRedux, marqueeState); - - if ((marqueeState.behavior == 'scroll' && marqueeState.last == marqueeRedux[marqueeState.axis]) || (marqueeState.behavior == 'alternate' && hitedge && marqueeState.last != -1) || (marqueeState.behavior == 'slide' && hitedge && marqueeState.last != -1)) { - if (marqueeState.behavior == 'alternate') { - marqueeState.dir *= -1; // flip - } - marqueeState.last = -1; - - $marqueeRedux.trigger('stop'); - - marqueeState.loops--; - if (marqueeState.loops === 0) { - if (marqueeState.behavior != 'slide') { - marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir, marqueeRedux, marqueeState); - } else { - // corrects the position - marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir * -1, marqueeRedux, marqueeState); - } - - $marqueeRedux.trigger('end'); - } else { - // keep this marquee going - newMarqueeList.push(marqueeRedux); - $marqueeRedux.trigger('start'); - marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir, marqueeRedux, marqueeState); - } - } else { - newMarqueeList.push(marqueeRedux); - } - marqueeState.last = marqueeRedux[marqueeState.axis]; - - // store updated state only if we ran an animation - $marqueeRedux.data('marqueeState', marqueeState); - } else { - // even though it's paused, keep it in the list - newMarqueeList.push(marqueeRedux); - } - } - - newMarquee = newMarqueeList; - - if (newMarquee.length) { - setTimeout(animateMarquee, 25); - } - } - - // TODO consider whether using .html() in the wrapping process could lead to loosing predefined events... - this.each(function (i) { - var $marquee = $(this), - width = $marquee.attr('width') || $marquee.width(), - height = $marquee.attr('height') || $marquee.height(), - $marqueeRedux = $marquee.after('
' + $marquee.html() + '
').next(), - marqueeRedux = $marqueeRedux.get(0), - hitedge = 0, - direction = ($marquee.attr('direction') || 'left').toLowerCase(), - marqueeState = { - dir : /down|right/.test(direction) ? -1 : 1, - axis : /left|right/.test(direction) ? 'scrollLeft' : 'scrollTop', - widthAxis : /left|right/.test(direction) ? 'scrollWidth' : 'scrollHeight', - last : -1, - loops : $marquee.attr('loop') || -1, - scrollamount : $marquee.attr('scrollamount') || this.scrollAmount || 2, - behavior : ($marquee.attr('behavior') || 'scroll').toLowerCase(), - width : /left|right/.test(direction) ? width : height - }; - - // corrects a bug in Firefox - the default loops for slide is -1 - if ($marquee.attr('loop') == -1 && marqueeState.behavior == 'slide') { - marqueeState.loops = 1; - } - - $marquee.remove(); - - // add padding - if (/left|right/.test(direction)) { - $marqueeRedux.find('> div').css('padding', '0 ' + width + 'px'); - } else { - $marqueeRedux.find('> div').css('padding', height + 'px 0'); - } - - // events - $marqueeRedux.bind('stop', function () { - $marqueeRedux.data('paused', true); - }).bind('pause', function () { - $marqueeRedux.data('paused', true); - }).bind('start', function () { - $marqueeRedux.data('paused', false); - }).bind('unpause', function () { - $marqueeRedux.data('paused', false); - }).data('marqueeState', marqueeState); // finally: store the state - - // todo - rerender event allowing us to do an ajax hit and redraw the marquee - - newMarquee.push(marqueeRedux); - - marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir, marqueeRedux, marqueeState); - $marqueeRedux.trigger('start'); - - // on the very last marquee, trigger the animation - if (i+1 == last) { - animateMarquee(); - } - }); - - return $(newMarquee); - }; -}(jQuery)); -- 2.20.1