/** * Standard billboard widget for RightJS * http://rightjs.org/ui/billboard * * Copyright (C) 2010 Nikolay Nemshilov */ var Billboard=RightJS.Billboard=function(c){var o=c.$,p=c.$$,q=c.$w,m=c.$E,r=c.Fx,n=c.Class,s=c.Object,f=new (function(a,b){if(!b){b=a;a="DIV"}var g=new c.Wrapper(c.Element.Wrappers[a]||c.Element,{initialize:function(h,d){this.key=h;var e=[{"class":"rui-"+h}];this instanceof c.Input||this instanceof c.Form||e.unshift(a);this.$super.apply(this,e);if(c.isString(d))d=c.$(d);if(d instanceof c.Element){this._=d._;if("$listeners"in d)d.$listeners=d.$listeners;d={}}this.setOptions(d,this);return this},setOptions:function(h, d){d=d||this;c.Options.setOptions.call(this,c.Object.merge(h,eval("("+(d.get("data-"+this.key)||"{}")+")")));return this}});g=new c.Wrapper(g,b);c.Observer.createShortcuts(g.prototype,g.EVENTS||[]);return g})("UL",{extend:{version:"2.0.1",EVENTS:q("change first last"),Options:{fxName:"stripe",fxDuration:"long",autostart:true,delay:4E3,loop:true,showButtons:true,prevButton:"native",nextButton:"native",stripes:10,cssRule:"*.rui-billboard"}},initialize:function(a){this.$super("billboard",a);if(this.options.showButtons){this.prevButton= this.options.prevButton!=="native"?o(this.options.prevButton):m("div",{"class":"rui-billboard-button-prev",html:"‹"}).insertTo(this);this.nextButton=this.options.nextButton!=="native"?o(this.options.nextButton):m("div",{"class":"rui-billboard-button-next",html:"›"}).insertTo(this);this.prevButton.onClick(c(function(b){b.stop();this.showPrev()}).bind(this));this.nextButton.onClick(c(function(b){b.stop();this.showNext()}).bind(this))}this.onChange(function(b){if(b.item===this.items().first())this.fire("first"); else b.item===this.items().last()&&this.fire("last")});this.on({mouseover:function(){this.stop()},mouseout:function(b){this.options.autostart&&!b.find(".rui-billboard")&&this.start()}});this.options.autostart&&this.start()},items:function(){return this.children().without(this.prevButton,this.nextButton)},showNext:function(){var a=this.items(),b=a.indexOf(this.current())+1;if(b==a.length&&this.options.loop)b=0;return this.current(b)},showPrev:function(){var a=this.items(),b=a.indexOf(this.current())- 1;if(b<0&&this.options.loop)b=a.length-1;return this.current(b)},current:function(a){var b=this.items();if(arguments.length){if(a instanceof Element)a=b.indexOf(a);this.runFx(b[a])}else return b.length?b.first("hasClass","rui-billboard-current")||b.first().addClass("rui-billboard-current"):null;return this},start:function(){this.timer=c(this.showNext).bind(this).periodical(this.options.delay)},stop:function(){this.timer&&this.timer.stop()},fire:function(a,b){return this.$super(a,s.merge({index:this.items().indexOf(this.current()), item:this.current()},b))},runFx:function(a){if(a&&!this._running){var b=f.Fx[c(this.options.fxName||"").capitalize()];if(b)(new b(this)).start(this.current(),a);else{this.current().removeClass("rui-billboard-current");a.addClass("rui-billboard-current")}}}});f.Fx=new n(r,{initialize:function(a){this.container=m("div",{"class":"rui-billboard-fx-container"});this.$super(a,{duration:a.options.fxDuration,onStart:function(){a._running=true;a.insert(this.container)},onFinish:function(){this.container.remove(); a._running=false;a.fire("change")}})},prepare:function(a,b){a.removeClass("rui-billboard-current");b.addClass("rui-billboard-current");this.clone=a.clone();this.container.update(this.clone)}});f.Fx.Fade=new n(f.Fx,{prepare:function(a,b){this.$super(a,b)},render:function(a){this.container.setStyle({opacity:1-a})}});f.Fx.Slide=new n(f.Fx,{prepare:function(a,b){this._width=this.element.current().size().x;this._direction=a.nextSiblings().include(b)?-1:1;this.$super(a,b);this.clone.setStyle({width:this._width+ "px"})},render:function(a){this.clone._.style.left=this._direction*this._width*a+"px"}});f.Fx.Stripe=new n(f.Fx,{directions:["down","up","left","right"],prepare:function(a,b){this.$super(a,b);var g=this.element.options.stripes,h=this.element.items()[0].size().x/g,d=this.directions.shift();this.directions.push(d);this.container.clean();for(var e=0;e *.rui-billboard, *.rui-billboard> *{margin:0;padding:0;list-style:none} *.rui-billboard{display:inline-block; *display:inline; *zoom:1;position:relative} *.rui-billboard> *{display:none;width:100%;height:100%} *.rui-billboard> *:first-child, *.rui-billboard> *.rui-billboard-current:first-child{display:block;position:relative} *.rui-billboard> *>img{margin:0;padding:0} *.rui-billboard-current{position:absolute;left:0;top:0;display:block;z-index:999} *.rui-billboard-button-prev, *.rui-billboard-button-next{position:absolute;z-index:99999;left:.25em;top:auto;bottom:.25em;display:block;width:.5em;height:auto;text-align:center;font-size:200%;font-family:Arial;font-weight:bold;padding:0em .5em .2em .5em;background:white;opacity:0;filter:alpha(opacity:0);cursor:pointer;border:.12em solid #888;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em;user-select:none;-moz-user-select:none;-webkit-user-select:none;transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-webkit-transition:opacity .3s ease-in-out} *.rui-billboard-button-next{left:auto;right:.25em;text-align:right} *.rui-billboard-button-prev:active{text-indent:-.1em} *.rui-billboard-button-next:active{text-indent:.2em} *.rui-billboard:hover *.rui-billboard-button-prev, *.rui-billboard:hover *.rui-billboard-button-next{opacity:0.4;filter:alpha(opacity:40)} *.rui-billboard:hover *.rui-billboard-button-prev:hover, *.rui-billboard:hover *.rui-billboard-button-next:hover{opacity:0.7;filter:alpha(opacity:70)}.rui-billboard-fx-container{position:absolute;left:0;top:0;display:block;z-index:9999;overflow:hidden}.rui-billboard-fx-container> *{position:absolute;left:0;top:0}.rui-billboard-stripe{overflow:hidden}.rui-billboard-stripe> *{position:relative}'); return f}(RightJS);