diff --git a/src/.project b/src/.project new file mode 100644 index 0000000..62d4851 --- /dev/null +++ b/src/.project @@ -0,0 +1,11 @@ + + + GrupoArdeco + + + + + + + + diff --git a/src/contacto.html b/src/contacto.html new file mode 100644 index 0000000..8138f20 --- /dev/null +++ b/src/contacto.html @@ -0,0 +1,73 @@ + + + + + Grupo Ardeco - Decoración de interiores + + + + + + +
+
+
+

Grupo Ardeco

+

Decoración de interiores

+
+ + +
+ + +
 
+ +
+
+

Formulario de contacto

+

Nuestros proyectos integrales aportan la solución idónea a cada uno de nuestros clientes, tanto desde la perpectiva funcional como estética.

+

+
+
+ +
    +
    2. +
    3. +
    4. +
    5. +
+
+
+ +
+
+


+ C/ Paseo de la Chopera, 2
+ 28100 - Alcobendas - Madrid
+ Teléfono: 91 789 78 78
+ Fax: 91 299 22 99
E-Mail: info@grupoardeco.com

+ Ver plano de situación

+
+
 
+
+
+
 
+
+
+

Aviso legal | Política de privacidad
Diseñado por Rodax Software S.L. - 2009

+
+
+ + diff --git a/src/estilos.css b/src/estilos.css index 7e8fe78..3981b5f 100644 --- a/src/estilos.css +++ b/src/estilos.css @@ -6,8 +6,8 @@ html, body { margin:0; padding:0; font-family: Verdana,Arial,Helvetica,sans-serif; - color:#808080; - font-size: 80%; + color:#666; + font-size: 85%; font-style: normal; font-variant: normal; font-weight: normal; @@ -15,10 +15,9 @@ html, body { } body{ - background-color: #fff; - background-image: url('images/fondo.gif'); + background-color: #efeded; + background-image: url("images/fondo.gif"); background-repeat: repeat-x; - background-position: center center; text-align: center; min-width: 960px; min-height: 550px; @@ -28,40 +27,43 @@ p, h1, h2, h3, h4 { } h1, h2, h3, h4 { - font-family: Helvetica,Verdana,Arial,Helvetica,sans-serif; + font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-stretch: normal; font-style: normal; font-variant: normal; - font-weight: bold; + font-weight: bold; + color: #723900; } h1 { font-weight: normal; - font-size:195%; + font-size:280%; } h2 { font-weight: normal; - font-size:180%; + font-size: 240%; } h3 { - font-size:120%; + text-transform: lowercase; + font-size: 150%; + font-weight: normal; } h4 { font-weight: normal; font-style: italic; - font-size: 110%; + font-size: 180%; } a { - color: #E46825; + color: #004080; font-weight: bold; } a:hover, a:active { - color: #666666; + color: #400080; text-decoration: none; } @@ -82,17 +84,17 @@ li { #vertical{ float: left; height: 50%; - margin-top: -270px;/* half vertical height*/ + margin-top: -570px;/* half vertical height*/ width: 100%; } #layout { width:960px; - margin: 0; + margin: 20px 0 0 0; padding: 0; margin-left: auto; margin-right: auto; - height: 545px; + min-height: 545px; overflow: auto; /* allow content to scroll inside element */ text-align:left; clear: both; @@ -102,9 +104,8 @@ li { margin: 0 auto; padding: 0; width: 960px; - height: 110px; + height: 90px; text-align: left; - border: 1px solid; } #logotipo { @@ -112,7 +113,7 @@ li { background-repeat: no-repeat; width: 380px; height: 75px; - float: left; + float: right; } #cabecera h1, #cabecera h2 { margin: 0; @@ -120,41 +121,89 @@ li { display: none; } +#banner { + margin: 0 0 20px 0; + padding: 0; + width: 960px; + height: 300px; + background-color: #bcbcbc; +} + + #banner #foto { + float: left; + } + + #banner #foto #texto_foto { + display: none; + } + + #banner #seleccion { + color: #222; + float: right; + text-align: left; + width: 210px; + padding: 20px 100px 0 0; + } + #principal { text-align: left; margin: 0; padding: 0; width: 960px; } + #principal h3 { + padding: 0 0 5px 0; + margin-bottom: 20px; + padding-left: 15px; + border-left: 15px ridge #080; + } #principal p { + padding: 0 30px 5px 30px; + } + + #principal ul { + padding: 0 30px; } #inicio_izquierda { float: left; margin: 0; padding: 0; - width: 500px; - border: 1px solid; + width: 320px; +} + +#inicio_centro { + float: left; + margin: 0; + padding: 0; + width: 320px; } #inicio_derecha { float: right; margin: 0; padding: 0; - width: 360px; - border: 1px solid; + width: 320px; } -#foto { - padding: 6px; - background-color: #fff; - border: 1px solid #aaa; + + +#contacto_izquierda { + float: left; + margin: 0; + padding: 0; + width: 640px; } + +#contacto_derecha { + float: right; + margin: 0; + padding: 0; + width: 320px; +} + - - - .clear { clear:both; } @@ -162,7 +211,8 @@ li { #pie_layout { text-align: left; margin: 0; - padding: 0; + padding: 10px 0 0 0; + background-color: #723900; background-image:url(images/fondo-pie.gif); background-repeat:repeat-x; background-position: top; @@ -177,31 +227,12 @@ li { width: 960px; margin: 0 auto; padding: 12px 0 0 0; - color: #CABA9F; - font-family: Verdana, Geneva, sans-serif; } - #pie_izquierda { - text-align: left; - margin: 0 0 0 15px; - padding: 0; - width: 460px; - float:left; - } - - #pie_derecha { - text-align: right; - margin: 0 15px 0 0; - padding: 60px 0 0 0; - width: 460px; - float:right; - } - #pie a { - color: #fff; + color: #333; } - #pie h3 { text-transform:none; background: none; diff --git a/src/forms.css b/src/forms.css new file mode 100644 index 0000000..56cf63a --- /dev/null +++ b/src/forms.css @@ -0,0 +1,38 @@ +/********************************** + +Name: cmxform Styles +Author: Nick Rigby + +***********************************/ + +form.cmxform { + margin: 0 0 0 50px; + width: auto; + font-size: 110%; + color:#666; +} + +form.cmxform legend { } + +form.cmxform label { + margin-right: 20px; + width: 85px; + vertical-align: top; + display: inline-block; + color: #333; +} + +form.cmxform fieldset { + border: none; +} + +form.cmxform fieldset fieldset { } + + +form.cmxform fieldset li { + padding: 5px 10px 7px; +} + +form.cmxform input { + +} diff --git a/src/images/fondo-cabecera.gif b/src/images/fondo-cabecera.gif new file mode 100644 index 0000000..a33f115 Binary files /dev/null and b/src/images/fondo-cabecera.gif differ diff --git a/src/images/fondo-pie.gif b/src/images/fondo-pie.gif new file mode 100644 index 0000000..2201cdb Binary files /dev/null and b/src/images/fondo-pie.gif differ diff --git a/src/images/fondo.gif b/src/images/fondo.gif index d3e817e..4564b6c 100644 Binary files a/src/images/fondo.gif and b/src/images/fondo.gif differ diff --git a/src/index.html b/src/index.html index 511145f..0a123cf 100644 --- a/src/index.html +++ b/src/index.html @@ -2,13 +2,50 @@ - CYVACSA + Grupo Ardeco - Decoración de interiores + + + + + -
+
@@ -19,40 +56,62 @@
- + +
 
+
-
- -

Hotel Vincci Via 66
Madrid

-

Ver más...

-
-
-
-

Proyectos singulares

-


- Donec eleifend turpis at risus volutpat tempus. Vestibulum eget urna vitae metus venenatis porttitor eu sit amet nunc. +

Bienvenido a Grupo Ardeco

+

Nuestros proyectos integrales aportan la solución idónea a cada uno de nuestros clientes, tanto desde la perpectiva funcional como estética.

-
-

Áreas principales de actuación

-
  • Líneas eléctricas
  • Parques eólicos y solares
  • Gaseoductos y oleoductos
  • Obras lineales
  • Carreteras y autopistas
  • Conducciones de agua y embalses
+
+
+

Servicios

+

Cubrimos todas las áreas en la decoración de interiores: diseño, fabricación, montaje y decoración de todo tipo de superficies: +

    +
  • Instalaciones comerciales
    • +
  • Instalaciones hoteleras
    • +
  • Oficinas
    • +
  • Ferias y exposiciones
    • +

+
+
+

Contacto

+

+ C/ Paseo de la Chopera, 2
+ 28100 - Alcobendas - Madrid
+ Teléfono: 91 789 78 78
+ Fax: 91 299 22 99
E-Mail: info@grupoardeco.com

+ Ver plano de situación

 
- +
+

Aviso legal | Política de privacidad
Diseñado por Rodax Software S.L. - 2009

+
+
diff --git a/src/menu.css b/src/menu.css index b778e1d..3ef740a 100644 --- a/src/menu.css +++ b/src/menu.css @@ -2,34 +2,40 @@ /* CSS Document */ #menu { - float: right; - margin:0; - padding:0; - width:579px; - color: #000; + float: left; + margin: 50px 0 0 0; + padding: 0; + width: auto; + font-family: Tahoma, Geneva, sans-serif; + font-size: 130%; + letter-spacing: 2px; } #menu ul { list-style-type:none; margin:0; padding:0; + } #menu ul li { - float:left; - margin:0; - padding:0; - width:90px; + float: left; + margin: 0 40px 0 0; + padding: 0; + width: auto; + padding: 0 0 5px 0; } #menu ul li a { - display:block; - height:42px; - text-decoration:none; + display: block; + text-decoration: none; + font-weight: normal; + color: #555; + padding: 0 0 5px 0; } #menu ul li a:hover { - + border-bottom: 5px solid #b2dbb2; } #menu ul li.active a { @@ -37,5 +43,6 @@ } .current{ - background-color: #aaa; + color: #000; + border-bottom: 5px solid #004b00; } diff --git a/src/slideshow/README b/src/slideshow/README new file mode 100644 index 0000000..28f0e9c --- /dev/null +++ b/src/slideshow/README @@ -0,0 +1,36 @@ +LICENSE + +MIT-style license. + +COPYRIGHT + +Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/). + +SUMMARY + +Slideshow is a javascript class for Mootools 1.2 to stream and animate the presentation of images on your website. + +FILES + +In this distribution, you will find the following files: + +css/ - Folder containing stylesheet and CSS background images. +images/ - Folder with example images. +index.html - Example script usage. +js/ - Folder with the Slideshow scripts and Mootools 1.2.1. + +SUPPORT + +http://code.google.com/p/slideshow - Official development website. +http://www.electricprism.com/aeron/slideshow/ - Demos and examples. +http://code.google.com/p/slideshow/wiki/FAQ - FAQ. +http://code.google.com/p/slideshow/wiki/Slideshow - Manual. +http://groups.google.com/group/mootools-slideshow - Google Group. + +CHANGE LOG + +slideshow.js (147) - IE fixed for both the base class and Fold slideshows. +slideshow.js (131) - IE7 or newer now looks good! Added transitions on paused, titles options, more. +slideshow.js (113) - Fixed conflict with Mootools 1.2.1 and destroy(). +slideshow.js (105) - Added fix for duplicate image filenames. +slideshow.js (104) - Added onEnd event handler. \ No newline at end of file diff --git a/src/slideshow/css/controller-first.gif b/src/slideshow/css/controller-first.gif new file mode 100644 index 0000000..7ad1372 Binary files /dev/null and b/src/slideshow/css/controller-first.gif differ diff --git a/src/slideshow/css/controller-last.gif b/src/slideshow/css/controller-last.gif new file mode 100644 index 0000000..18a29b0 Binary files /dev/null and b/src/slideshow/css/controller-last.gif differ diff --git a/src/slideshow/css/controller-next.gif b/src/slideshow/css/controller-next.gif new file mode 100644 index 0000000..4b95a13 Binary files /dev/null and b/src/slideshow/css/controller-next.gif differ diff --git a/src/slideshow/css/controller-pause.gif b/src/slideshow/css/controller-pause.gif new file mode 100644 index 0000000..e91d637 Binary files /dev/null and b/src/slideshow/css/controller-pause.gif differ diff --git a/src/slideshow/css/controller-prev.gif b/src/slideshow/css/controller-prev.gif new file mode 100644 index 0000000..62caf43 Binary files /dev/null and b/src/slideshow/css/controller-prev.gif differ diff --git a/src/slideshow/css/controller.png b/src/slideshow/css/controller.png new file mode 100644 index 0000000..552f6d3 Binary files /dev/null and b/src/slideshow/css/controller.png differ diff --git a/src/slideshow/css/loader-0.png b/src/slideshow/css/loader-0.png new file mode 100644 index 0000000..9ce1cf5 Binary files /dev/null and b/src/slideshow/css/loader-0.png differ diff --git a/src/slideshow/css/loader-1.png b/src/slideshow/css/loader-1.png new file mode 100644 index 0000000..d5596e1 Binary files /dev/null and b/src/slideshow/css/loader-1.png differ diff --git a/src/slideshow/css/loader-10.png b/src/slideshow/css/loader-10.png new file mode 100644 index 0000000..aa83cea Binary files /dev/null and b/src/slideshow/css/loader-10.png differ diff --git a/src/slideshow/css/loader-11.png b/src/slideshow/css/loader-11.png new file mode 100644 index 0000000..56e0413 Binary files /dev/null and b/src/slideshow/css/loader-11.png differ diff --git a/src/slideshow/css/loader-2.png b/src/slideshow/css/loader-2.png new file mode 100644 index 0000000..03595eb Binary files /dev/null and b/src/slideshow/css/loader-2.png differ diff --git a/src/slideshow/css/loader-3.png b/src/slideshow/css/loader-3.png new file mode 100644 index 0000000..c1b1677 Binary files /dev/null and b/src/slideshow/css/loader-3.png differ diff --git a/src/slideshow/css/loader-4.png b/src/slideshow/css/loader-4.png new file mode 100644 index 0000000..7c54873 Binary files /dev/null and b/src/slideshow/css/loader-4.png differ diff --git a/src/slideshow/css/loader-5.png b/src/slideshow/css/loader-5.png new file mode 100644 index 0000000..9a7530b Binary files /dev/null and b/src/slideshow/css/loader-5.png differ diff --git a/src/slideshow/css/loader-6.png b/src/slideshow/css/loader-6.png new file mode 100644 index 0000000..2d04b86 Binary files /dev/null and b/src/slideshow/css/loader-6.png differ diff --git a/src/slideshow/css/loader-7.png b/src/slideshow/css/loader-7.png new file mode 100644 index 0000000..67877ba Binary files /dev/null and b/src/slideshow/css/loader-7.png differ diff --git a/src/slideshow/css/loader-8.png b/src/slideshow/css/loader-8.png new file mode 100644 index 0000000..4bfbb5d Binary files /dev/null and b/src/slideshow/css/loader-8.png differ diff --git a/src/slideshow/css/loader-9.png b/src/slideshow/css/loader-9.png new file mode 100644 index 0000000..e4e2457 Binary files /dev/null and b/src/slideshow/css/loader-9.png differ diff --git a/src/slideshow/css/slideshow.css b/src/slideshow/css/slideshow.css new file mode 100644 index 0000000..1bd05aa --- /dev/null +++ b/src/slideshow/css/slideshow.css @@ -0,0 +1,287 @@ +/** +Stylesheet: Slideshow.css + CSS for Slideshow. + +License: + MIT-style license. + +Copyright: + Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/). + +HTML: +
+
+
+
+
+
+
+ +Notes: + These next four rules are set by the Slideshow script. + You can override any of them with the !important keyword but the slideshow probably will not work as intended. +*/ + +.slideshow { + display: block; + position: relative; + z-index: 0; +} +.slideshow-images { + display: block; + overflow: hidden; + position: relative; +} +.slideshow-images img { + display: block; + position: absolute; + z-index: 1; +} +.slideshow-thumbnails { + overflow: hidden; +} + +/** +HTML: +
+ + +
+ +Notes: + The images div is where the slides are shown. + Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc. +*/ + +.slideshow-images { + height: 300px; + width: 600px; +} +.slideshow-images-visible { + opacity: 1; +} +.slideshow-images-prev { + opacity: 0; +} +.slideshow-images-next { + opacity: 0; +} +.slideshow-images img { + float: left; + left: 0; + top: 0; +} + +/** +Notes: + These are examples of user-defined styles. + Customize these classes to your usage of Slideshow. +*/ + +.slideshow { + height: 300px; + margin: 0 auto; + width: 600px; +} +.slideshow a img { + border: 0; +} + +/** +HTML: +
+ ... +
+ +Notes: + Customize the hidden / visible classes to affect the captions animation. +*/ + +.slideshow-captions { + background: #000; + bottom: 0; + color: #fff; + font: normal 12px/22px Arial, sans-serif; + left: 0; + overflow: hidden; + position: absolute; + text-indent: 10px; + width: 100%; + z-index: 10000; +} +.slideshow-captions-hidden { + height: 0; + opacity: 0; +} +.slideshow-captions-visible { + height: 22px; + opacity: .7; +} + +/** +HTML: +
+ +
+ +Notes: + Customize the hidden / visible classes to affect the controller animation. +*/ + +.slideshow-controller { + background: url(controller.png) no-repeat; + height: 42px; + left: 50%; + margin: -21px 0 0 -119px; + overflow: hidden; + position: absolute; + top: 50%; + width: 238px; + z-index: 10000; +} +.slideshow-controller * { + margin: 0; + padding: 0; +} +.slideshow-controller-hidden { + opacity: 0; +} +.slideshow-controller-visible { + opacity: 1; +} +.slideshow-controller a { + cursor: pointer; + display: block; + height: 18px; + overflow: hidden; + position: absolute; + top: 12px; +} +.slideshow-controller a.active { + background-position: 0 18px; +} +.slideshow-controller li { + list-style: none; +} +.slideshow-controller li.first a { + background-image: url(controller-first.gif); + left: 33px; + width: 19px; +} +.slideshow-controller li.last a { + background-image: url(controller-last.gif); + left: 186px; + width: 19px; +} +.slideshow-controller li.next a { + background-image: url(controller-next.gif); + left: 145px; + width: 28px; +} +.slideshow-controller li.pause a { + background-image: url(controller-pause.gif); + left: 109px; + width: 20px; +} +.slideshow-controller li.play a { + background-position: 20px 0; +} +.slideshow-controller li.play a.active { + background-position: 20px 18px; +} +.slideshow-controller li.prev a { + background-image: url(controller-prev.gif); + left: 65px; + width: 28px; +} + +/** +HTML: +
+ +Notes: + Customize the hidden / visible classes to affect the loader animation. +*/ + +.slideshow-loader { + height: 28px; + right: 0; + position: absolute; + top: 0; + width: 28px; + z-index: 10001; +} +.slideshow-loader-hidden { + opacity: 0; +} +.slideshow-loader-visible { + opacity: 1; +} + +/** +HTML: +
+ +
+ +Notes: + Customize the active / inactive classes to affect the thumbnails animation. + Use the !important keyword to override FX without affecting performance. +*/ + +.slideshow-thumbnails { + bottom: -65px; + height: 65px; + left: 0; + position: absolute; + width: 100%; +} +.slideshow-thumbnails * { + margin: 0; + padding: 0; +} +.slideshow-thumbnails ul { + height: 65px; + left: 0; + position: absolute; + top: 0; + width: 10000px; +} +.slideshow-thumbnails li { + float: left; + list-style: none; + margin: 5px 5px 5px 0; + position: relative; +} +.slideshow-thumbnails a { + display: block; + float: left; + padding: 5px; + position: relative; +} +.slideshow-thumbnails a:hover { + background-color: #FF9 !important; + opacity: 1 !important; +} +.slideshow-thumbnails img { + display: block; +} +.slideshow-thumbnails-active { + background-color: #9FF; + opacity: 1; +} +.slideshow-thumbnails-inactive { + background-color: #FFF; + opacity: .5; +} \ No newline at end of file diff --git a/src/slideshow/images/1.jpg b/src/slideshow/images/1.jpg new file mode 100644 index 0000000..4feb3be Binary files /dev/null and b/src/slideshow/images/1.jpg differ diff --git a/src/slideshow/images/1t.jpg b/src/slideshow/images/1t.jpg new file mode 100644 index 0000000..cde105a Binary files /dev/null and b/src/slideshow/images/1t.jpg differ diff --git a/src/slideshow/images/2.jpg b/src/slideshow/images/2.jpg new file mode 100644 index 0000000..3f97a96 Binary files /dev/null and b/src/slideshow/images/2.jpg differ diff --git a/src/slideshow/images/2t.jpg b/src/slideshow/images/2t.jpg new file mode 100644 index 0000000..e0c27ba Binary files /dev/null and b/src/slideshow/images/2t.jpg differ diff --git a/src/slideshow/images/3.jpg b/src/slideshow/images/3.jpg new file mode 100644 index 0000000..a4e949f Binary files /dev/null and b/src/slideshow/images/3.jpg differ diff --git a/src/slideshow/images/3t.jpg b/src/slideshow/images/3t.jpg new file mode 100644 index 0000000..8b34ff8 Binary files /dev/null and b/src/slideshow/images/3t.jpg differ diff --git a/src/slideshow/images/4.jpg b/src/slideshow/images/4.jpg new file mode 100644 index 0000000..9d55552 Binary files /dev/null and b/src/slideshow/images/4.jpg differ diff --git a/src/slideshow/images/4t.jpg b/src/slideshow/images/4t.jpg new file mode 100644 index 0000000..f9bd6f8 Binary files /dev/null and b/src/slideshow/images/4t.jpg differ diff --git a/src/slideshow/index.html b/src/slideshow/index.html new file mode 100644 index 0000000..4c02bc4 --- /dev/null +++ b/src/slideshow/index.html @@ -0,0 +1,30 @@ + + + + Slideshow 2! + + + + + + + + +
+ Volcano Asención in Ometepe, Nicaragua. +
+ + \ No newline at end of file diff --git a/src/slideshow/js/mootools.js b/src/slideshow/js/mootools.js new file mode 100644 index 0000000..e2738ee --- /dev/null +++ b/src/slideshow/js/mootools.js @@ -0,0 +1,15 @@ +/* +Script: mootools.js + MooTools - My Object Oriented JavaScript Tools. + +License: + MIT-style license. + +Copyright: + Copyright (c) 2006-2008 [Valerio Proietti](http://mad4milk.net/). + +Code & Documentation: + [The MooTools production team](http://mootools.net/developers/). +*/ + +var MooTools={version:"1.2.1",build:"0d4845aab3d9a4fdee2f0d4a6dd59210e4b697cf"};var Native=function(K){K=K||{};var A=K.name;var I=K.legacy;var B=K.protect;var C=K.implement;var H=K.generics;var F=K.initialize;var G=K.afterImplement||function(){};var D=F||I;H=H!==false;D.constructor=Native;D.$family={name:"native"};if(I&&F){D.prototype=I.prototype}D.prototype.constructor=D;if(A){var E=A.toLowerCase();D.prototype.$family={name:E};Native.typize(D,E)}var J=function(N,L,O,M){if(!B||M||!N.prototype[L]){N.prototype[L]=O}if(H){Native.genericize(N,L,B)}G.call(N,L,O);return N};D.alias=function(N,L,O){if(typeof N=="string"){if((N=this.prototype[N])){return J(this,L,N,O)}}for(var M in N){this.alias(M,N[M],L)}return this};D.implement=function(M,L,O){if(typeof M=="string"){return J(this,M,L,O)}for(var N in M){J(this,N,M[N],L)}return this};if(C){D.implement(C)}return D};Native.genericize=function(B,C,A){if((!A||!B[C])&&typeof B.prototype[C]=="function"){B[C]=function(){var D=Array.prototype.slice.call(arguments);return B.prototype[C].apply(D.shift(),D)}}};Native.implement=function(D,C){for(var B=0,A=D.length;B-1:this.indexOf(A)>-1},trim:function(){return this.replace(/^\s+|\s+$/g,"")},clean:function(){return this.replace(/\s+/g," ").trim()},camelCase:function(){return this.replace(/-\D/g,function(A){return A.charAt(1).toUpperCase()})},hyphenate:function(){return this.replace(/[A-Z]/g,function(A){return("-"+A.charAt(0).toLowerCase())})},capitalize:function(){return this.replace(/\b[a-z]/g,function(A){return A.toUpperCase()})},escapeRegExp:function(){return this.replace(/([-.*+?^${}()|[\]\/\\])/g,"\\$1")},toInt:function(A){return parseInt(this,A||10)},toFloat:function(){return parseFloat(this)},hexToRgb:function(B){var A=this.match(/^#?(\w{1,2})(\w{1,2})(\w{1,2})$/);return(A)?A.slice(1).hexToRgb(B):null},rgbToHex:function(B){var A=this.match(/\d{1,3}/g);return(A)?A.rgbToHex(B):null},stripScripts:function(B){var A="";var C=this.replace(/]*>([\s\S]*?)<\/script>/gi,function(){A+=arguments[1]+"\n";return""});if(B===true){$exec(A)}else{if($type(B)=="function"){B(A,C)}}return C},substitute:function(A,B){return this.replace(B||(/\\?\{([^{}]+)\}/g),function(D,C){if(D.charAt(0)=="\\"){return D.slice(1)}return(A[C]!=undefined)?A[C]:""})}});Hash.implement({has:Object.prototype.hasOwnProperty,keyOf:function(B){for(var A in this){if(this.hasOwnProperty(A)&&this[A]===B){return A}}return null},hasValue:function(A){return(Hash.keyOf(this,A)!==null)},extend:function(A){Hash.each(A,function(C,B){Hash.set(this,B,C)},this);return this},combine:function(A){Hash.each(A,function(C,B){Hash.include(this,B,C)},this);return this},erase:function(A){if(this.hasOwnProperty(A)){delete this[A]}return this},get:function(A){return(this.hasOwnProperty(A))?this[A]:null},set:function(A,B){if(!this[A]||this.hasOwnProperty(A)){this[A]=B}return this},empty:function(){Hash.each(this,function(B,A){delete this[A]},this);return this},include:function(B,C){var A=this[B];if(A==undefined){this[B]=C}return this},map:function(B,C){var A=new Hash;Hash.each(this,function(E,D){A.set(D,B.call(C,E,D,this))},this);return A},filter:function(B,C){var A=new Hash;Hash.each(this,function(E,D){if(B.call(C,E,D,this)){A.set(D,E)}},this);return A},every:function(B,C){for(var A in this){if(this.hasOwnProperty(A)&&!B.call(C,this[A],A)){return false}}return true},some:function(B,C){for(var A in this){if(this.hasOwnProperty(A)&&B.call(C,this[A],A)){return true}}return false},getKeys:function(){var A=[];Hash.each(this,function(C,B){A.push(B)});return A},getValues:function(){var A=[];Hash.each(this,function(B){A.push(B)});return A},toQueryString:function(A){var B=[];Hash.each(this,function(F,E){if(A){E=A+"["+E+"]"}var D;switch($type(F)){case"object":D=Hash.toQueryString(F,E);break;case"array":var C={};F.each(function(H,G){C[G]=H});D=Hash.toQueryString(C,E);break;default:D=E+"="+encodeURIComponent(F)}if(F!=undefined){B.push(D)}});return B.join("&")}});Hash.alias({keyOf:"indexOf",hasValue:"contains"});var Event=new Native({name:"Event",initialize:function(A,F){F=F||window;var K=F.document;A=A||F.event;if(A.$extended){return A}this.$extended=true;var J=A.type;var G=A.target||A.srcElement;while(G&&G.nodeType==3){G=G.parentNode}if(J.test(/key/)){var B=A.which||A.keyCode;var M=Event.Keys.keyOf(B);if(J=="keydown"){var D=B-111;if(D>0&&D<13){M="f"+D}}M=M||String.fromCharCode(B).toLowerCase()}else{if(J.match(/(click|mouse|menu)/i)){K=(!K.compatMode||K.compatMode=="CSS1Compat")?K.html:K.body;var I={x:A.pageX||A.clientX+K.scrollLeft,y:A.pageY||A.clientY+K.scrollTop};var C={x:(A.pageX)?A.pageX-F.pageXOffset:A.clientX,y:(A.pageY)?A.pageY-F.pageYOffset:A.clientY};if(J.match(/DOMMouseScroll|mousewheel/)){var H=(A.wheelDelta)?A.wheelDelta/120:-(A.detail||0)/3}var E=(A.which==3)||(A.button==2);var L=null;if(J.match(/over|out/)){switch(J){case"mouseover":L=A.relatedTarget||A.fromElement;break;case"mouseout":L=A.relatedTarget||A.toElement}if(!(function(){while(L&&L.nodeType==3){L=L.parentNode}return true}).create({attempt:Browser.Engine.gecko})()){L=false}}}}return $extend(this,{event:A,type:J,page:I,client:C,rightClick:E,wheel:H,relatedTarget:L,target:G,code:B,key:M,shift:A.shiftKey,control:A.ctrlKey,alt:A.altKey,meta:A.metaKey})}});Event.Keys=new Hash({enter:13,up:38,down:40,left:37,right:39,esc:27,space:32,backspace:8,tab:9,"delete":46});Event.implement({stop:function(){return this.stopPropagation().preventDefault()},stopPropagation:function(){if(this.event.stopPropagation){this.event.stopPropagation()}else{this.event.cancelBubble=true}return this},preventDefault:function(){if(this.event.preventDefault){this.event.preventDefault()}else{this.event.returnValue=false}return this}});var Class=new Native({name:"Class",initialize:function(B){B=B||{};var A=function(){for(var E in this){if($type(this[E])!="function"){this[E]=$unlink(this[E])}}this.constructor=A;if(Class.prototyping){return this}var D=(this.initialize)?this.initialize.apply(this,arguments):this;if(this.options&&this.options.initialize){this.options.initialize.call(this)}return D};for(var C in Class.Mutators){if(!B[C]){continue}B=Class.Mutators[C](B,B[C]);delete B[C]}$extend(A,this);A.constructor=Class;A.prototype=B;return A}});Class.Mutators={Extends:function(C,A){Class.prototyping=A.prototype;var B=new A;delete B.parent;B=Class.inherit(B,C);delete Class.prototyping;return B},Implements:function(A,B){$splat(B).each(function(C){Class.prototying=C;$extend(A,($type(C)=="class")?new C:C);delete Class.prototyping});return A}};Class.extend({inherit:function(B,E){var A=arguments.callee.caller;for(var D in E){var C=E[D];var G=B[D];var F=$type(C);if(G&&F=="function"){if(C!=G){if(A){C.__parent=G;B[D]=C}else{Class.override(B,D,C)}}}else{if(F=="object"){B[D]=$merge(G,C)}else{B[D]=C}}}if(A){B.parent=function(){return arguments.callee.caller.__parent.apply(this,arguments)}}return B},override:function(B,A,E){var D=Class.prototyping;if(D&&B[A]!=D[A]){D=null}var C=function(){var F=this.parent;this.parent=D?D[A]:B[A];var G=E.apply(this,arguments);this.parent=F;return G};B[A]=C}});Class.implement({implement:function(){var A=this.prototype;$each(arguments,function(B){Class.inherit(A,B)});return this}});var Chain=new Class({$chain:[],chain:function(){this.$chain.extend(Array.flatten(arguments));return this},callChain:function(){return(this.$chain.length)?this.$chain.shift().apply(this,arguments):false},clearChain:function(){this.$chain.empty();return this}});var Events=new Class({$events:{},addEvent:function(C,B,A){C=Events.removeOn(C);if(B!=$empty){this.$events[C]=this.$events[C]||[];this.$events[C].include(B);if(A){B.internal=true}}return this},addEvents:function(A){for(var B in A){this.addEvent(B,A[B])}return this},fireEvent:function(C,B,A){C=Events.removeOn(C);if(!this.$events||!this.$events[C]){return this}this.$events[C].each(function(D){D.create({bind:this,delay:A,"arguments":B})()},this);return this},removeEvent:function(B,A){B=Events.removeOn(B);if(!this.$events[B]){return this}if(!A.internal){this.$events[B].erase(A)}return this},removeEvents:function(C){if($type(C)=="object"){for(var D in C){this.removeEvent(D,C[D])}return this}if(C){C=Events.removeOn(C)}for(var D in this.$events){if(C&&C!=D){continue}var B=this.$events[D];for(var A=B.length;A--;A){this.removeEvent(D,B[A])}}return this}});Events.removeOn=function(A){return A.replace(/^on([A-Z])/,function(B,C){return C.toLowerCase()})};var Options=new Class({setOptions:function(){this.options=$merge.run([this.options].extend(arguments));if(!this.addEvent){return this}for(var A in this.options){if($type(this.options[A])!="function"||!(/^on[A-Z]/).test(A)){continue}this.addEvent(A,this.options[A]);delete this.options[A]}return this}});var Element=new Native({name:"Element",legacy:window.Element,initialize:function(A,B){var C=Element.Constructors.get(A);if(C){return C(B)}if(typeof A=="string"){return document.newElement(A,B)}return $(A).set(B)},afterImplement:function(A,B){Element.Prototype[A]=B;if(Array[A]){return }Elements.implement(A,function(){var C=[],G=true;for(var E=0,D=this.length;E"}return $.element(this.createElement(A)).set(B)},newTextNode:function(A){return this.createTextNode(A)},getDocument:function(){return this},getWindow:function(){return this.window}});Window.implement({$:function(B,C){if(B&&B.$family&&B.uid){return B}var A=$type(B);return($[A])?$[A](B,C,this.document):null},$$:function(A){if(arguments.length==1&&typeof A=="string"){return this.document.getElements(A)}var F=[];var C=Array.flatten(arguments);for(var D=0,B=C.length;D1);A.each(function(E){var F=this.getElementsByTagName(E.trim());(B)?C.extend(F):C=F},this);return new Elements(C,{ddup:B,cash:!D})}});(function(){var H={},F={};var I={input:"checked",option:"selected",textarea:(Browser.Engine.webkit&&Browser.Engine.version<420)?"innerHTML":"value"};var C=function(L){return(F[L]||(F[L]={}))};var G=function(N,L){if(!N){return }var M=N.uid;if(Browser.Engine.trident){if(N.clearAttributes){var P=L&&N.cloneNode(false);N.clearAttributes();if(P){N.mergeAttributes(P)}}else{if(N.removeEvents){N.removeEvents()}}if((/object/i).test(N.tagName)){for(var O in N){if(typeof N[O]=="function"){N[O]=$empty}}Element.dispose(N)}}if(!M){return }H[M]=F[M]=null};var D=function(){Hash.each(H,G);if(Browser.Engine.trident){$A(document.getElementsByTagName("object")).each(G)}if(window.CollectGarbage){CollectGarbage()}H=F=null};var J=function(N,L,S,M,P,R){var O=N[S||L];var Q=[];while(O){if(O.nodeType==1&&(!M||Element.match(O,M))){if(!P){return $(O,R)}Q.push(O)}O=O[L]}return(P)?new Elements(Q,{ddup:false,cash:!R}):null};var E={html:"innerHTML","class":"className","for":"htmlFor",text:(Browser.Engine.trident||(Browser.Engine.webkit&&Browser.Engine.version<420))?"innerText":"textContent"};var B=["compact","nowrap","ismap","declare","noshade","checked","disabled","readonly","multiple","selected","noresize","defer"];var K=["value","accessKey","cellPadding","cellSpacing","colSpan","frameBorder","maxLength","readOnly","rowSpan","tabIndex","useMap"];Hash.extend(E,B.associate(B));Hash.extend(E,K.associate(K.map(String.toLowerCase)));var A={before:function(M,L){if(L.parentNode){L.parentNode.insertBefore(M,L)}},after:function(M,L){if(!L.parentNode){return }var N=L.nextSibling;(N)?L.parentNode.insertBefore(M,N):L.parentNode.appendChild(M)},bottom:function(M,L){L.appendChild(M)},top:function(M,L){var N=L.firstChild;(N)?L.insertBefore(M,N):L.appendChild(M)}};A.inside=A.bottom;Hash.each(A,function(L,M){M=M.capitalize();Element.implement("inject"+M,function(N){L(this,$(N,true));return this});Element.implement("grab"+M,function(N){L($(N,true),this);return this})});Element.implement({set:function(O,M){switch($type(O)){case"object":for(var N in O){this.set(N,O[N])}break;case"string":var L=Element.Properties.get(O);(L&&L.set)?L.set.apply(this,Array.slice(arguments,1)):this.setProperty(O,M)}return this},get:function(M){var L=Element.Properties.get(M);return(L&&L.get)?L.get.apply(this,Array.slice(arguments,1)):this.getProperty(M)},erase:function(M){var L=Element.Properties.get(M);(L&&L.erase)?L.erase.apply(this):this.removeProperty(M);return this},setProperty:function(M,N){var L=E[M];if(N==undefined){return this.removeProperty(M)}if(L&&B[M]){N=!!N}(L)?this[L]=N:this.setAttribute(M,""+N);return this},setProperties:function(L){for(var M in L){this.setProperty(M,L[M])}return this},getProperty:function(M){var L=E[M];var N=(L)?this[L]:this.getAttribute(M,2);return(B[M])?!!N:(L)?N:N||null},getProperties:function(){var L=$A(arguments);return L.map(this.getProperty,this).associate(L)},removeProperty:function(M){var L=E[M];(L)?this[L]=(L&&B[M])?false:"":this.removeAttribute(M);return this},removeProperties:function(){Array.each(arguments,this.removeProperty,this);return this},hasClass:function(L){return this.className.contains(L," ")},addClass:function(L){if(!this.hasClass(L)){this.className=(this.className+" "+L).clean()}return this},removeClass:function(L){this.className=this.className.replace(new RegExp("(^|\\s)"+L+"(?:\\s|$)"),"$1");return this},toggleClass:function(L){return this.hasClass(L)?this.removeClass(L):this.addClass(L)},adopt:function(){Array.flatten(arguments).each(function(L){L=$(L,true);if(L){this.appendChild(L)}},this);return this},appendText:function(M,L){return this.grab(this.getDocument().newTextNode(M),L)},grab:function(M,L){A[L||"bottom"]($(M,true),this);return this},inject:function(M,L){A[L||"bottom"](this,$(M,true));return this},replaces:function(L){L=$(L,true);L.parentNode.replaceChild(this,L);return this},wraps:function(M,L){M=$(M,true);return this.replaces(M).grab(M,L)},getPrevious:function(L,M){return J(this,"previousSibling",null,L,false,M)},getAllPrevious:function(L,M){return J(this,"previousSibling",null,L,true,M)},getNext:function(L,M){return J(this,"nextSibling",null,L,false,M)},getAllNext:function(L,M){return J(this,"nextSibling",null,L,true,M)},getFirst:function(L,M){return J(this,"nextSibling","firstChild",L,false,M)},getLast:function(L,M){return J(this,"previousSibling","lastChild",L,false,M)},getParent:function(L,M){return J(this,"parentNode",null,L,false,M)},getParents:function(L,M){return J(this,"parentNode",null,L,true,M)},getChildren:function(L,M){return J(this,"nextSibling","firstChild",L,true,M)},getWindow:function(){return this.ownerDocument.window},getDocument:function(){return this.ownerDocument},getElementById:function(O,N){var M=this.ownerDocument.getElementById(O);if(!M){return null}for(var L=M.parentNode;L!=this;L=L.parentNode){if(!L){return null}}return $.element(M,N)},getSelected:function(){return new Elements($A(this.options).filter(function(L){return L.selected}))},getComputedStyle:function(M){if(this.currentStyle){return this.currentStyle[M.camelCase()]}var L=this.getDocument().defaultView.getComputedStyle(this,null);return(L)?L.getPropertyValue([M.hyphenate()]):null},toQueryString:function(){var L=[];this.getElements("input, select, textarea",true).each(function(M){if(!M.name||M.disabled){return }var N=(M.tagName.toLowerCase()=="select")?Element.getSelected(M).map(function(O){return O.value}):((M.type=="radio"||M.type=="checkbox")&&!M.checked)?null:M.value;$splat(N).each(function(O){if(typeof O!="undefined"){L.push(M.name+"="+encodeURIComponent(O))}})});return L.join("&")},clone:function(O,L){O=O!==false;var R=this.cloneNode(O);var N=function(V,U){if(!L){V.removeAttribute("id")}if(Browser.Engine.trident){V.clearAttributes();V.mergeAttributes(U);V.removeAttribute("uid");if(V.options){var W=V.options,S=U.options;for(var T=W.length;T--;){W[T].selected=S[T].selected}}}var X=I[U.tagName.toLowerCase()];if(X&&U[X]){V[X]=U[X]}};if(O){var P=R.getElementsByTagName("*"),Q=this.getElementsByTagName("*");for(var M=P.length;M--;){N(P[M],Q[M])}}N(R,this);return $(R)},destroy:function(){Element.empty(this);Element.dispose(this);G(this,true);return null},empty:function(){$A(this.childNodes).each(function(L){Element.destroy(L)});return this},dispose:function(){return(this.parentNode)?this.parentNode.removeChild(this):this},hasChild:function(L){L=$(L,true);if(!L){return false}if(Browser.Engine.webkit&&Browser.Engine.version<420){return $A(this.getElementsByTagName(L.tagName)).contains(L)}return(this.contains)?(this!=L&&this.contains(L)):!!(this.compareDocumentPosition(L)&16)},match:function(L){return(!L||(L==this)||(Element.get(this,"tag")==L))}});Native.implement([Element,Window,Document],{addListener:function(O,N){if(O=="unload"){var L=N,M=this;N=function(){M.removeListener("unload",N);L()}}else{H[this.uid]=this}if(this.addEventListener){this.addEventListener(O,N,false)}else{this.attachEvent("on"+O,N)}return this},removeListener:function(M,L){if(this.removeEventListener){this.removeEventListener(M,L,false)}else{this.detachEvent("on"+M,L)}return this},retrieve:function(M,L){var O=C(this.uid),N=O[M];if(L!=undefined&&N==undefined){N=O[M]=L}return $pick(N)},store:function(M,L){var N=C(this.uid);N[M]=L;return this},eliminate:function(L){var M=C(this.uid);delete M[L];return this}});window.addListener("unload",D)})();Element.Properties=new Hash;Element.Properties.style={set:function(A){this.style.cssText=A},get:function(){return this.style.cssText},erase:function(){this.style.cssText=""}};Element.Properties.tag={get:function(){return this.tagName.toLowerCase()}};Element.Properties.html=(function(){var C=document.createElement("div");var A={table:[1,"","
"],select:[1,""],tbody:[2,"","
"],tr:[3,"","
"]};A.thead=A.tfoot=A.tbody;var B={set:function(){var E=Array.flatten(arguments).join("");var F=Browser.Engine.trident&&A[this.get("tag")];if(F){var G=C;G.innerHTML=F[1]+E+F[2];for(var D=F[0];D--;){G=G.firstChild}this.empty().adopt(G.childNodes)}else{this.innerHTML=E}}};B.erase=B.set;return B})();if(Browser.Engine.webkit&&Browser.Engine.version<420){Element.Properties.text={get:function(){if(this.innerText){return this.innerText}var A=this.ownerDocument.newElement("div",{html:this.innerHTML}).inject(this.ownerDocument.body);var B=A.innerText;A.destroy();return B}}}Element.Properties.events={set:function(A){this.addEvents(A)}};Native.implement([Element,Window,Document],{addEvent:function(E,G){var H=this.retrieve("events",{});H[E]=H[E]||{keys:[],values:[]};if(H[E].keys.contains(G)){return this}H[E].keys.push(G);var F=E,A=Element.Events.get(E),C=G,I=this;if(A){if(A.onAdd){A.onAdd.call(this,G)}if(A.condition){C=function(J){if(A.condition.call(this,J)){return G.call(this,J)}return true}}F=A.base||F}var D=function(){return G.call(I)};var B=Element.NativeEvents[F];if(B){if(B==2){D=function(J){J=new Event(J,I.getWindow());if(C.call(I,J)===false){J.stop()}}}this.addListener(F,D)}H[E].values.push(D);return this},removeEvent:function(C,B){var A=this.retrieve("events");if(!A||!A[C]){return this}var F=A[C].keys.indexOf(B);if(F==-1){return this}A[C].keys.splice(F,1);var E=A[C].values.splice(F,1)[0];var D=Element.Events.get(C);if(D){if(D.onRemove){D.onRemove.call(this,B)}C=D.base||C}return(Element.NativeEvents[C])?this.removeListener(C,E):this},addEvents:function(A){for(var B in A){this.addEvent(B,A[B])}return this},removeEvents:function(A){if($type(A)=="object"){for(var C in A){this.removeEvent(C,A[C])}return this}var B=this.retrieve("events");if(!B){return this}if(!A){for(var C in B){this.removeEvents(C)}this.eliminate("events")}else{if(B[A]){while(B[A].keys[0]){this.removeEvent(A,B[A].keys[0])}B[A]=null}}return this},fireEvent:function(D,B,A){var C=this.retrieve("events");if(!C||!C[D]){return this}C[D].keys.each(function(E){E.create({bind:this,delay:A,"arguments":B})()},this);return this},cloneEvents:function(D,A){D=$(D);var C=D.retrieve("events");if(!C){return this}if(!A){for(var B in C){this.cloneEvents(D,B)}}else{if(C[A]){C[A].keys.each(function(E){this.addEvent(A,E)},this)}}return this}});Element.NativeEvents={click:2,dblclick:2,mouseup:2,mousedown:2,contextmenu:2,mousewheel:2,DOMMouseScroll:2,mouseover:2,mouseout:2,mousemove:2,selectstart:2,selectend:2,keydown:2,keypress:2,keyup:2,focus:2,blur:2,change:2,reset:2,select:2,submit:2,load:1,unload:1,beforeunload:2,resize:1,move:1,DOMContentLoaded:1,readystatechange:1,error:1,abort:1,scroll:1};(function(){var A=function(B){var C=B.relatedTarget;if(C==undefined){return true}if(C===false){return false}return($type(this)!="document"&&C!=this&&C.prefix!="xul"&&!this.hasChild(C))};Element.Events=new Hash({mouseenter:{base:"mouseover",condition:A},mouseleave:{base:"mouseout",condition:A},mousewheel:{base:(Browser.Engine.gecko)?"DOMMouseScroll":"mousewheel"}})})();Element.Properties.styles={set:function(A){this.setStyles(A)}};Element.Properties.opacity={set:function(A,B){if(!B){if(A==0){if(this.style.visibility!="hidden"){this.style.visibility="hidden"}}else{if(this.style.visibility!="visible"){this.style.visibility="visible"}}}if(!this.currentStyle||!this.currentStyle.hasLayout){this.style.zoom=1}if(Browser.Engine.trident){this.style.filter=(A==1)?"":"alpha(opacity="+A*100+")"}this.style.opacity=A;this.store("opacity",A)},get:function(){return this.retrieve("opacity",1)}};Element.implement({setOpacity:function(A){return this.set("opacity",A,true)},getOpacity:function(){return this.get("opacity")},setStyle:function(B,A){switch(B){case"opacity":return this.set("opacity",parseFloat(A));case"float":B=(Browser.Engine.trident)?"styleFloat":"cssFloat"}B=B.camelCase();if($type(A)!="string"){var C=(Element.Styles.get(B)||"@").split(" ");A=$splat(A).map(function(E,D){if(!C[D]){return""}return($type(E)=="number")?C[D].replace("@",Math.round(E)):E}).join(" ")}else{if(A==String(Number(A))){A=Math.round(A)}}this.style[B]=A;return this},getStyle:function(G){switch(G){case"opacity":return this.get("opacity");case"float":G=(Browser.Engine.trident)?"styleFloat":"cssFloat"}G=G.camelCase();var A=this.style[G];if(!$chk(A)){A=[];for(var F in Element.ShortStyles){if(G!=F){continue}for(var E in Element.ShortStyles[F]){A.push(this.getStyle(E))}return A.join(" ")}A=this.getComputedStyle(G)}if(A){A=String(A);var C=A.match(/rgba?\([\d\s,]+\)/);if(C){A=A.replace(C[0],C[0].rgbToHex())}}if(Browser.Engine.presto||(Browser.Engine.trident&&!$chk(parseInt(A)))){if(G.test(/^(height|width)$/)){var B=(G=="width")?["left","right"]:["top","bottom"],D=0;B.each(function(H){D+=this.getStyle("border-"+H+"-width").toInt()+this.getStyle("padding-"+H).toInt()},this);return this["offset"+G.capitalize()]-D+"px"}if((Browser.Engine.presto)&&String(A).test("px")){return A}if(G.test(/(border(.+)Width|margin|padding)/)){return"0px"}}return A},setStyles:function(B){for(var A in B){this.setStyle(A,B[A])}return this},getStyles:function(){var A={};Array.each(arguments,function(B){A[B]=this.getStyle(B)},this);return A}});Element.Styles=new Hash({left:"@px",top:"@px",bottom:"@px",right:"@px",width:"@px",height:"@px",maxWidth:"@px",maxHeight:"@px",minWidth:"@px",minHeight:"@px",backgroundColor:"rgb(@, @, @)",backgroundPosition:"@px @px",color:"rgb(@, @, @)",fontSize:"@px",letterSpacing:"@px",lineHeight:"@px",clip:"rect(@px @px @px @px)",margin:"@px @px @px @px",padding:"@px @px @px @px",border:"@px @ rgb(@, @, @) @px @ rgb(@, @, @) @px @ rgb(@, @, @)",borderWidth:"@px @px @px @px",borderStyle:"@ @ @ @",borderColor:"rgb(@, @, @) rgb(@, @, @) rgb(@, @, @) rgb(@, @, @)",zIndex:"@",zoom:"@",fontWeight:"@",textIndent:"@px",opacity:"@"});Element.ShortStyles={margin:{},padding:{},border:{},borderWidth:{},borderStyle:{},borderColor:{}};["Top","Right","Bottom","Left"].each(function(G){var F=Element.ShortStyles;var B=Element.Styles;["margin","padding"].each(function(H){var I=H+G;F[H][I]=B[I]="@px"});var E="border"+G;F.border[E]=B[E]="@px @ rgb(@, @, @)";var D=E+"Width",A=E+"Style",C=E+"Color";F[E]={};F.borderWidth[D]=F[E][D]=B[D]="@px";F.borderStyle[A]=F[E][A]=B[A]="@";F.borderColor[C]=F[E][C]=B[C]="rgb(@, @, @)"});(function(){Element.implement({scrollTo:function(H,I){if(B(this)){this.getWindow().scrollTo(H,I)}else{this.scrollLeft=H;this.scrollTop=I}return this},getSize:function(){if(B(this)){return this.getWindow().getSize()}return{x:this.offsetWidth,y:this.offsetHeight}},getScrollSize:function(){if(B(this)){return this.getWindow().getScrollSize()}return{x:this.scrollWidth,y:this.scrollHeight}},getScroll:function(){if(B(this)){return this.getWindow().getScroll()}return{x:this.scrollLeft,y:this.scrollTop}},getScrolls:function(){var I=this,H={x:0,y:0};while(I&&!B(I)){H.x+=I.scrollLeft;H.y+=I.scrollTop;I=I.parentNode}return H},getOffsetParent:function(){var H=this;if(B(H)){return null}if(!Browser.Engine.trident){return H.offsetParent}while((H=H.parentNode)&&!B(H)){if(D(H,"position")!="static"){return H}}return null},getOffsets:function(){if(Browser.Engine.trident){var L=this.getBoundingClientRect(),J=this.getDocument().documentElement;return{x:L.left+J.scrollLeft-J.clientLeft,y:L.top+J.scrollTop-J.clientTop}}var I=this,H={x:0,y:0};if(B(this)){return H}while(I&&!B(I)){H.x+=I.offsetLeft;H.y+=I.offsetTop;if(Browser.Engine.gecko){if(!F(I)){H.x+=C(I);H.y+=G(I)}var K=I.parentNode;if(K&&D(K,"overflow")!="visible"){H.x+=C(K);H.y+=G(K)}}else{if(I!=this&&Browser.Engine.webkit){H.x+=C(I);H.y+=G(I)}}I=I.offsetParent}if(Browser.Engine.gecko&&!F(this)){H.x-=C(this);H.y-=G(this)}return H},getPosition:function(K){if(B(this)){return{x:0,y:0}}var L=this.getOffsets(),I=this.getScrolls();var H={x:L.x-I.x,y:L.y-I.y};var J=(K&&(K=$(K)))?K.getPosition():{x:0,y:0};return{x:H.x-J.x,y:H.y-J.y}},getCoordinates:function(J){if(B(this)){return this.getWindow().getCoordinates()}var H=this.getPosition(J),I=this.getSize();var K={left:H.x,top:H.y,width:I.x,height:I.y};K.right=K.left+K.width;K.bottom=K.top+K.height;return K},computePosition:function(H){return{left:H.x-E(this,"margin-left"),top:H.y-E(this,"margin-top")}},position:function(H){return this.setStyles(this.computePosition(H))}});Native.implement([Document,Window],{getSize:function(){var I=this.getWindow();if(Browser.Engine.presto||Browser.Engine.webkit){return{x:I.innerWidth,y:I.innerHeight}}var H=A(this);return{x:H.clientWidth,y:H.clientHeight}},getScroll:function(){var I=this.getWindow();var H=A(this);return{x:I.pageXOffset||H.scrollLeft,y:I.pageYOffset||H.scrollTop}},getScrollSize:function(){var I=A(this);var H=this.getSize();return{x:Math.max(I.scrollWidth,H.x),y:Math.max(I.scrollHeight,H.y)}},getPosition:function(){return{x:0,y:0}},getCoordinates:function(){var H=this.getSize();return{top:0,left:0,bottom:H.y,right:H.x,height:H.y,width:H.x}}});var D=Element.getComputedStyle;function E(H,I){return D(H,I).toInt()||0}function F(H){return D(H,"-moz-box-sizing")=="border-box"}function G(H){return E(H,"border-top-width")}function C(H){return E(H,"border-left-width")}function B(H){return(/^(?:body|html)$/i).test(H.tagName)}function A(H){var I=H.getDocument();return(!I.compatMode||I.compatMode=="CSS1Compat")?I.html:I.body}})();Native.implement([Window,Document,Element],{getHeight:function(){return this.getSize().y},getWidth:function(){return this.getSize().x},getScrollTop:function(){return this.getScroll().y},getScrollLeft:function(){return this.getScroll().x},getScrollHeight:function(){return this.getScrollSize().y},getScrollWidth:function(){return this.getScrollSize().x},getTop:function(){return this.getPosition().y},getLeft:function(){return this.getPosition().x}});Native.implement([Document,Element],{getElements:function(H,G){H=H.split(",");var C,E={};for(var D=0,B=H.length;D1),cash:!G})}});Element.implement({match:function(B){if(!B||(B==this)){return true}var D=Selectors.Utils.parseTagAndID(B);var A=D[0],E=D[1];if(!Selectors.Filters.byID(this,E)||!Selectors.Filters.byTag(this,A)){return false}var C=Selectors.Utils.parseSelector(B);return(C)?Selectors.Utils.filter(this,C,{}):true}});var Selectors={Cache:{nth:{},parsed:{}}};Selectors.RegExps={id:(/#([\w-]+)/),tag:(/^(\w+|\*)/),quick:(/^(\w+|\*)$/),splitter:(/\s*([+>~\s])\s*([a-zA-Z#.*:\[])/g),combined:(/\.([\w-]+)|\[(\w+)(?:([!*^$~|]?=)(["']?)([^\4]*?)\4)?\]|:([\w-]+)(?:\(["']?(.*?)?["']?\)|$)/g)};Selectors.Utils={chk:function(B,C){if(!C){return true}var A=$uid(B);if(!C[A]){return C[A]=true}return false},parseNthArgument:function(F){if(Selectors.Cache.nth[F]){return Selectors.Cache.nth[F]}var C=F.match(/^([+-]?\d*)?([a-z]+)?([+-]?\d*)?$/);if(!C){return false}var E=parseInt(C[1]);var B=(E||E===0)?E:1;var D=C[2]||false;var A=parseInt(C[3])||0;if(B!=0){A--;while(A<1){A+=B}while(A>=B){A-=B}}else{B=A;D="index"}switch(D){case"n":C={a:B,b:A,special:"n"};break;case"odd":C={a:2,b:0,special:"n"};break;case"even":C={a:2,b:1,special:"n"};break;case"first":C={a:0,special:"index"};break;case"last":C={special:"last-child"};break;case"only":C={special:"only-child"};break;default:C={a:(B-1),special:"index"}}return Selectors.Cache.nth[F]=C},parseSelector:function(E){if(Selectors.Cache.parsed[E]){return Selectors.Cache.parsed[E]}var D,H={classes:[],pseudos:[],attributes:[]};while((D=Selectors.RegExps.combined.exec(E))){var I=D[1],G=D[2],F=D[3],B=D[5],C=D[6],J=D[7];if(I){H.classes.push(I)}else{if(C){var A=Selectors.Pseudo.get(C);if(A){H.pseudos.push({parser:A,argument:J})}else{H.attributes.push({name:C,operator:"=",value:J})}}else{if(G){H.attributes.push({name:G,operator:F,value:B})}}}}if(!H.classes.length){delete H.classes}if(!H.attributes.length){delete H.attributes}if(!H.pseudos.length){delete H.pseudos}if(!H.classes&&!H.attributes&&!H.pseudos){H=null}return Selectors.Cache.parsed[E]=H},parseTagAndID:function(B){var A=B.match(Selectors.RegExps.tag);var C=B.match(Selectors.RegExps.id);return[(A)?A[1]:"*",(C)?C[1]:false]},filter:function(F,C,E){var D;if(C.classes){for(D=C.classes.length;D--;D){var G=C.classes[D];if(!Selectors.Filters.byClass(F,G)){return false}}}if(C.attributes){for(D=C.attributes.length;D--;D){var B=C.attributes[D];if(!Selectors.Filters.byAttribute(F,B.name,B.operator,B.value)){return false}}}if(C.pseudos){for(D=C.pseudos.length;D--;D){var A=C.pseudos[D];if(!Selectors.Filters.byPseudo(F,A.parser,A.argument,E)){return false}}}return true},getByTagAndID:function(B,A,D){if(D){var C=(B.getElementById)?B.getElementById(D,true):Element.getElementById(B,D,true);return(C&&Selectors.Filters.byTag(C,A))?[C]:[]}else{return B.getElementsByTagName(A)}},search:function(I,H,N){var B=[];var C=H.trim().replace(Selectors.RegExps.splitter,function(Y,X,W){B.push(X);return":)"+W}).split(":)");var J,E,U;for(var T=0,P=C.length;T":function(H,G,I,A,F){var C=Selectors.Utils.getByTagAndID(G,I,A);for(var E=0,D=C.length;EA){return false}}return(C==A)},even:function(B,A){return Selectors.Pseudo["nth-child"].call(this,"2n+1",A)},odd:function(B,A){return Selectors.Pseudo["nth-child"].call(this,"2n",A)}});Element.Events.domready={onAdd:function(A){if(Browser.loaded){A.call(this)}}};(function(){var B=function(){if(Browser.loaded){return }Browser.loaded=true;window.fireEvent("domready");document.fireEvent("domready")};if(Browser.Engine.trident){var A=document.createElement("div");(function(){($try(function(){A.doScroll("left");return $(A).inject(document.body).set("html","temp").dispose()}))?B():arguments.callee.delay(50)})()}else{if(Browser.Engine.webkit&&Browser.Engine.version<525){(function(){(["loaded","complete"].contains(document.readyState))?B():arguments.callee.delay(50)})()}else{window.addEvent("load",B);document.addEvent("DOMContentLoaded",B)}}})();var Fx=new Class({Implements:[Chain,Events,Options],options:{fps:50,unit:false,duration:500,link:"ignore"},initialize:function(A){this.subject=this.subject||this;this.setOptions(A);this.options.duration=Fx.Durations[this.options.duration]||this.options.duration.toInt();var B=this.options.wait;if(B===false){this.options.link="cancel"}},getTransition:function(){return function(A){return -(Math.cos(Math.PI*A)-1)/2}},step:function(){var A=$time();if(A=(7-4*B)/11){C=A*A-Math.pow((11-6*B-11*D)/4,2);break}}return C},Elastic:function(B,A){return Math.pow(2,10*--B)*Math.cos(20*B*Math.PI*(A[0]||1)/3)}});["Quad","Cubic","Quart","Quint"].each(function(B,A){Fx.Transitions[B]=new Fx.Transition(function(C){return Math.pow(C,[A+2])})});Fx.Elements=new Class({Extends:Fx.CSS,initialize:function(B,A){this.elements=this.subject=$$(B);this.parent(A)},compute:function(G,H,I){var C={};for(var D in G){var A=G[D],E=H[D],F=C[D]={};for(var B in A){F[B]=this.parent(A[B],E[B],I)}}return C},set:function(B){for(var C in B){var A=B[C];for(var D in A){this.render(this.elements[C],D,A[D],this.options.unit)}}return this},start:function(C){if(!this.check(arguments.callee,C)){return this}var H={},I={};for(var D in C){var F=C[D],A=H[D]={},G=I[D]={};for(var B in F){var E=this.prepare(this.elements[D],B,F[B]);A[B]=E.from;G[B]=E.to}}return this.parent(H,I)}});var Drag=new Class({Implements:[Events,Options],options:{snap:6,unit:"px",grid:false,style:true,limit:false,handle:false,invert:false,preventDefault:false,modifiers:{x:"left",y:"top"}},initialize:function(){var B=Array.link(arguments,{options:Object.type,element:$defined});this.element=$(B.element);this.document=this.element.getDocument();this.setOptions(B.options||{});var A=$type(this.options.handle);this.handles=(A=="array"||A=="collection")?$$(this.options.handle):$(this.options.handle)||this.element;this.mouse={now:{},pos:{}};this.value={start:{},now:{}};this.selection=(Browser.Engine.trident)?"selectstart":"mousedown";this.bound={start:this.start.bind(this),check:this.check.bind(this),drag:this.drag.bind(this),stop:this.stop.bind(this),cancel:this.cancel.bind(this),eventStop:$lambda(false)};this.attach()},attach:function(){this.handles.addEvent("mousedown",this.bound.start);return this},detach:function(){this.handles.removeEvent("mousedown",this.bound.start);return this},start:function(C){if(this.options.preventDefault){C.preventDefault()}this.fireEvent("beforeStart",this.element);this.mouse.start=C.page;var A=this.options.limit;this.limit={x:[],y:[]};for(var D in this.options.modifiers){if(!this.options.modifiers[D]){continue}if(this.options.style){this.value.now[D]=this.element.getStyle(this.options.modifiers[D]).toInt()}else{this.value.now[D]=this.element[this.options.modifiers[D]]}if(this.options.invert){this.value.now[D]*=-1}this.mouse.pos[D]=C.page[D]-this.value.now[D];if(A&&A[D]){for(var B=2;B--;B){if($chk(A[D][B])){this.limit[D][B]=$lambda(A[D][B])()}}}}if($type(this.options.grid)=="number"){this.options.grid={x:this.options.grid,y:this.options.grid}}this.document.addEvents({mousemove:this.bound.check,mouseup:this.bound.cancel});this.document.addEvent(this.selection,this.bound.eventStop)},check:function(A){if(this.options.preventDefault){A.preventDefault()}var B=Math.round(Math.sqrt(Math.pow(A.page.x-this.mouse.start.x,2)+Math.pow(A.page.y-this.mouse.start.y,2)));if(B>this.options.snap){this.cancel();this.document.addEvents({mousemove:this.bound.drag,mouseup:this.bound.stop});this.fireEvent("start",this.element).fireEvent("snap",this.element)}},drag:function(A){if(this.options.preventDefault){A.preventDefault()}this.mouse.now=A.page;for(var B in this.options.modifiers){if(!this.options.modifiers[B]){continue}this.value.now[B]=this.mouse.now[B]-this.mouse.pos[B];if(this.options.invert){this.value.now[B]*=-1}if(this.options.limit&&this.limit[B]){if($chk(this.limit[B][1])&&(this.value.now[B]>this.limit[B][1])){this.value.now[B]=this.limit[B][1]}else{if($chk(this.limit[B][0])&&(this.value.now[B] this.width) ? this.width - rect.left : rect.width; + rect.bottom = (rect.bottom > this.height) ? this.height - rect.top : rect.height; + rect.top = (rect.top < 0) ? Math.abs(rect.top) : 0; + rect.left = (rect.left < 0) ? Math.abs(rect.left) : 0; + return rect; + } +}); \ No newline at end of file diff --git a/src/slideshow/js/slideshow.js b/src/slideshow/js/slideshow.js new file mode 100644 index 0000000..d214c8c --- /dev/null +++ b/src/slideshow/js/slideshow.js @@ -0,0 +1,820 @@ +/** +Script: Slideshow.js + Slideshow - A javascript class for Mootools to stream and animate the presentation of images on your website. + +License: + MIT-style license. + +Copyright: + Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/). + +Dependencies: + Mootools 1.2 Core: Fx.Morph, Fx.Tween, Selectors, Element.Dimensions. + Mootools 1.2 More: Assets. +*/ + +Slideshow = new Class({ + Implements: [Chain, Events, Options], + + options: {/* + onComplete: $empty, + onEnd: $empty, + onStart: $empty,*/ + captions: false, + center: true, + classes: [], + controller: false, + delay: 2000, + duration: 750, + fast: false, + height: false, + href: '', + hu: '', + linked: false, + loader: {'animate': ['css/loader-#.png', 12]}, + loop: true, + match: /\?slide=(\d+)$/, + overlap: true, + paused: false, + properties: ['href', 'rel', 'rev', 'title'], + random: false, + replace: [/(\.[^\.]+)$/, 't$1'], + resize: 'width', + slide: 0, + thumbnails: false, + titles: true, + transition: function(p){return -(Math.cos(Math.PI * p) - 1) / 2;}, + width: false + }, + +/** +Constructor: initialize + Creates an instance of the Slideshow class. + +Arguments: + element - (element) The wrapper element. + data - (array or object) The images and optional thumbnails, captions and links for the show. + options - (object) The options below. + +Syntax: + var myShow = new Slideshow(element, data, options); +*/ + + initialize: function(el, data, options){ + this.setOptions(options); + this.slideshow = $(el); + if (!this.slideshow) + return; + this.slideshow.set('styles', {'display': 'block', 'position': 'relative', 'z-index': 0}); + var match = window.location.href.match(this.options.match); + this.slide = (this.options.match && match) ? match[1].toInt() : this.options.slide; + this.counter = this.delay = this.transition = 0; + this.direction = 'left'; + this.paused = false; + if (!this.options.overlap) + this.options.duration *= 2; + var anchor = this.slideshow.getElement('a') || new Element('a'); + if (!this.options.href) + this.options.href = anchor.get('href') || ''; + if (this.options.hu.length && !this.options.hu.test(/\/$/)) + this.options.hu += '/'; + if (this.options.fast === true) + this.options.fast = 2; + + // styles + + var keys = ['slideshow', 'first', 'prev', 'play', 'pause', 'next', 'last', 'images', 'captions', 'controller', 'thumbnails', 'hidden', 'visible', 'inactive', 'active', 'loader']; + var values = keys.map(function(key, i){ + return this.options.classes[i] || key; + }, this); + this.classes = values.associate(keys); + this.classes.get = function(){ + var str = '.' + this.slideshow; + for (var i = 0, l = arguments.length; i < l; i++) + str += ('-' + this[arguments[i]]); + return str; + }.bind(this.classes); + + // data + + if (!data){ + this.options.hu = ''; + data = {}; + var thumbnails = this.slideshow.getElements(this.classes.get('thumbnails') + ' img'); + this.slideshow.getElements(this.classes.get('images') + ' img').each(function(img, i){ + var src = img.get('src'); + var caption = $pick(img.get('alt'), img.get('title'), ''); + var parent = img.getParent(); + var properties = (parent.get('tag') == 'a') ? parent.getProperties : {}; + var href = img.getParent().get('href') || ''; + var thumbnail = (thumbnails[i]) ? thumbnails[i].get('src') : ''; + data[src] = {'caption': caption, 'href': href, 'thumbnail': thumbnail}; + }); + } + var loaded = this.load(data); + if (!loaded) + return; + + // events + + this.events = $H({'keydown': [], 'keyup': [], 'mousemove': []}); + var keyup = function(e){ + switch(e.key){ + case 'left': + this.prev(e.shift); break; + case 'right': + this.next(e.shift); break; + case 'p': + this.pause(); break; + } + }.bind(this); + this.events.keyup.push(keyup); + document.addEvent('keyup', keyup); + + // required elements + + var el = this.slideshow.getElement(this.classes.get('images')); + var images = (el) ? el.empty() : new Element('div', {'class': this.classes.get('images').substr(1)}).inject(this.slideshow); + var div = images.getSize(); + this.height = this.options.height || div.y; + this.width = this.options.width || div.x; + images.set({'styles': {'display': 'block', 'height': this.height, 'overflow': 'hidden', 'position': 'relative', 'width': this.width}}); + this.slideshow.store('images', images); + this.a = this.image = this.slideshow.getElement('img') || new Element('img'); + if (Browser.Engine.trident && Browser.Engine.version > 4) + this.a.style.msInterpolationMode = 'bicubic'; + this.a.set('styles', {'display': 'none', 'position': 'absolute', 'zIndex': 1}); + this.b = this.a.clone(); + [this.a, this.b].each(function(img){ + anchor.clone().cloneEvents(anchor).grab(img).inject(images); + }); + + // optional elements + + if (this.options.captions) + this._captions(); + if (this.options.controller) + this._controller(); + if (this.options.loader) + this._loader(); + if (this.options.thumbnails) + this._thumbnails(); + + // begin show + + this._preload(); + }, + +/** +Public method: go + Jump directly to a slide in the show. + +Arguments: + n - (integer) The index number of the image to jump to, 0 being the first image in the show. + +Syntax: + myShow.go(n); +*/ + + go: function(n, direction){ + if ((this.slide - 1 + this.data.images.length) % this.data.images.length == n || $time() < this.transition) + return; + $clear(this.timer); + this.delay = 0; + this.direction = (direction) ? direction : ((n < this.slide) ? 'right' : 'left'); + this.slide = n; + if (this.preloader) + this.preloader = this.preloader.destroy(); + this._preload(this.options.fast == 2 || (this.options.fast == 1 && this.paused)); + }, + +/** +Public method: first + Goes to the first image in the show. + +Syntax: + myShow.first(); +*/ + + first: function(){ + this.prev(true); + }, + +/** +Public method: prev + Goes to the previous image in the show. + +Syntax: + myShow.prev(); +*/ + + prev: function(first){ + var n = 0; + if (!first){ + if (this.options.random){ + + // if it's a random show get the previous slide from the showed array + + if (this.showed.i < 2) + return; + this.showed.i -= 2; + n = this.showed.array[this.showed.i]; + } + else + n = (this.slide - 2 + this.data.images.length) % this.data.images.length; + } + this.go(n, 'right'); + }, + +/** +Public method: pause + Toggles play / pause state of the show. + +Arguments: + p - (undefined, 1 or 0) Call pause with no arguments to toggle the pause state. Call pause(1) to force pause, or pause(0) to force play. + +Syntax: + myShow.pause(p); +*/ + + pause: function(p){ + if ($chk(p)) + this.paused = (p) ? false : true; + if (this.paused){ + this.paused = false; + this.delay = this.transition = 0; + this.timer = this._preload.delay(100, this); + [this.a, this.b].each(function(img){ + ['morph', 'tween'].each(function(p){ + if (this.retrieve(p)) this.get(p).resume(); + }, img); + }); + if (this.options.controller) + this.slideshow.getElement('.' + this.classes.pause).removeClass(this.classes.play); + } + else { + this.paused = true; + this.delay = Number.MAX_VALUE; + this.transition = 0; + $clear(this.timer); + [this.a, this.b].each(function(img){ + ['morph', 'tween'].each(function(p){ + if (this.retrieve(p)) this.get(p).pause(); + }, img); + }); + if (this.options.controller) + this.slideshow.getElement('.' + this.classes.pause).addClass(this.classes.play); + } + }, + +/** +Public method: next + Goes to the next image in the show. + +Syntax: + myShow.next(); +*/ + + next: function(last){ + var n = (last) ? this.data.images.length - 1 : this.slide; + this.go(n, 'left'); + }, + +/** +Public method: last + Goes to the last image in the show. + +Syntax: + myShow.last(); +*/ + + last: function(){ + this.next(true); + }, + +/** +Public method: load + Loads a new data set into the show: will stop the current show, rewind and rebuild thumbnails if applicable. + +Arguments: + data - (array or object) The images and optional thumbnails, captions and links for the show. + +Syntax: + myShow.load(data); +*/ + + load: function(data){ + this.firstrun = true; + this.showed = {'array': [], 'i': 0}; + if ($type(data) == 'array'){ + this.options.captions = false; + data = new Array(data.length).associate(data.map(function(image, i){ return image + '?' + i })); + } + this.data = {'images': [], 'captions': [], 'hrefs': [], 'thumbnails': []}; + for (var image in data){ + var obj = data[image] || {}; + var caption = (obj.caption) ? obj.caption.trim() : ''; + var href = (obj.href) ? obj.href.trim() : ((this.options.linked) ? this.options.hu + image : this.options.href); + var thumbnail = (obj.thumbnail) ? obj.thumbnail.trim() : image.replace(this.options.replace[0], this.options.replace[1]); + this.data.images.push(image); + this.data.captions.push(caption); + this.data.hrefs.push(href); + this.data.thumbnails.push(thumbnail); + } + if (this.options.random) + this.slide = $random(0, this.data.images.length - 1); + + // only run when data is loaded dynamically into an existing slideshow instance + + if (this.options.thumbnails && this.slideshow.retrieve('thumbnails')) + this._thumbnails(); + if (this.slideshow.retrieve('images')){ + [this.a, this.b].each(function(img){ + ['morph', 'tween'].each(function(p){ + if (this.retrieve(p)) this.get(p).cancel(); + }, img); + }); + this.slide = this.transition = 0; + this.go(0); + } + return this.data.images.length; + }, + +/** +Public method: destroy + Destroys a Slideshow instance. + +Arguments: + p - (string) The images and optional thumbnails, captions and links for the show. + +Syntax: + myShow.destroy(p); +*/ + + destroy: function(p){ + this.events.each(function(array, e){ + array.each(function(fn){ document.removeEvent(e, fn); }); + }); + this.pause(1); + if (this.options.loader) + $clear(this.slideshow.retrieve('loader').retrieve('timer')); + if (this.options.thumbnails) + $clear(this.slideshow.retrieve('thumbnails').retrieve('timer')); + this.slideshow.uid = Native.UID++; + if (p) + this.slideshow[p](); + }, + +/** +Private method: preload + Preloads the next slide in the show, once loaded triggers the show, updates captions, thumbnails, etc. +*/ + + _preload: function(fast){ + if (!this.preloader) + this.preloader = new Asset.image(this.options.hu + this.data.images[this.slide], {'onload': function(){ + this.store('loaded', true); + }}); + if (this.preloader.retrieve('loaded') && $time() > this.delay && $time() > this.transition){ + if (this.stopped){ + if (this.options.captions) + this.slideshow.retrieve('captions').get('morph').cancel().start(this.classes.get('captions', 'hidden')); + this.pause(1); + if (this.end) + this.fireEvent('end'); + this.stopped = this.end = false; + return; + } + this.image = (this.counter % 2) ? this.b : this.a; + this.image.set('styles', {'display': 'block', 'height': 'auto', 'visibility': 'hidden', 'width': 'auto', 'zIndex': this.counter}); + ['src', 'height', 'width'].each(function(prop){ + this.image.set(prop, this.preloader.get(prop)); + }, this); + this._resize(this.image); + this._center(this.image); + var anchor = this.image.getParent(); + if (this.data.hrefs[this.slide]) + anchor.set('href', this.data.hrefs[this.slide]); + else + anchor.erase('href'); + var text = (this.data.captions[this.slide]) + ? this.data.captions[this.slide].replace(/<.+?>/gm, '').replace(//g, '>').replace(/"/g, "'") + : ''; + this.image.set('alt', text); + if (this.options.titles) + anchor.set('title', text); + if (this.options.loader) + this.slideshow.retrieve('loader').fireEvent('hide'); + if (this.options.captions) + this.slideshow.retrieve('captions').fireEvent('update', fast); + if (this.options.thumbnails) + this.slideshow.retrieve('thumbnails').fireEvent('update', fast); + this._show(fast); + this._loaded(); + } + else { + if ($time() > this.delay && this.options.loader) + this.slideshow.retrieve('loader').fireEvent('show'); + this.timer = (this.paused && this.preloader.retrieve('loaded')) ? null : this._preload.delay(100, this, fast); + } + }, + +/** +Private method: show + Does the slideshow effect. +*/ + + _show: function(fast){ + if (!this.image.retrieve('morph')){ + var options = (this.options.overlap) ? {'duration': this.options.duration, 'link': 'cancel'} : {'duration': this.options.duration / 2, 'link': 'chain'}; + $$(this.a, this.b).set('morph', $merge(options, {'onStart': this._start.bind(this), 'onComplete': this._complete.bind(this), 'transition': this.options.transition})); + } + var hidden = this.classes.get('images', ((this.direction == 'left') ? 'next' : 'prev')); + var visible = this.classes.get('images', 'visible'); + var img = (this.counter % 2) ? this.a : this.b; + if (fast){ + img.get('morph').cancel().set(hidden); + this.image.get('morph').cancel().set(visible); + } + else { + if (this.options.overlap){ + img.get('morph').set(visible); + this.image.get('morph').set(hidden).start(visible); + } + else { + var fn = function(hidden, visible){ + this.image.get('morph').set(hidden).start(visible); + }.pass([hidden, visible], this); + hidden = this.classes.get('images', ((this.direction == 'left') ? 'prev' : 'next')); + img.get('morph').set(visible).start(hidden).chain(fn); + } + } + }, + +/** +Private method: loaded + Run after the current image has been loaded, sets up the next image to be shown. +*/ + + _loaded: function(){ + this.counter++; + this.delay = (this.paused) ? Number.MAX_VALUE : $time() + this.options.duration + this.options.delay; + this.direction = 'left'; + this.transition = (this.options.fast == 2 || (this.options.fast == 1 && this.paused)) ? 0 : $time() + this.options.duration; + if (this.slide + 1 == this.data.images.length && !this.options.loop && !this.options.random) + this.stopped = this.end = true; + if (this.options.random){ + this.showed.i++; + if (this.showed.i >= this.showed.array.length){ + var n = this.slide; + if (this.showed.array.getLast() != n) this.showed.array.push(n); + while (this.slide == n) + this.slide = $random(0, this.data.images.length - 1); + } + else + this.slide = this.showed.array[this.showed.i]; + } + else + this.slide = (this.slide + 1) % this.data.images.length; + if (this.image.getStyle('visibility') != 'visible') + (function(){ this.image.setStyle('visibility', 'visible'); }).delay(1, this); + if (this.preloader) + this.preloader = this.preloader.destroy(); + this._preload(); + }, + +/** +Private method: center + Center an image. +*/ + + _center: function(img){ + if (this.options.center){ + var size = img.getSize(); + img.set('styles', {'left': (size.x - this.width) / -2, 'top': (size.y - this.height) / -2}); + } + }, + +/** +Private method: resize + Resizes an image. +*/ + + _resize: function(img){ + if (this.options.resize){ + var h = this.preloader.get('height'), w = this.preloader.get('width'); + var dh = this.height / h, dw = this.width / w, d; + if (this.options.resize == 'length') + d = (dh > dw) ? dw : dh; + else + d = (dh > dw) ? dh : dw; + img.set('styles', {height: Math.ceil(h * d), width: Math.ceil(w * d)}); + } + }, + +/** +Private method: start + Callback on start of slide change. +*/ + + _start: function(){ + this.fireEvent('start'); + }, + +/** +Private method: complete + Callback on start of slide change. +*/ + + _complete: function(){ + if (this.firstrun && this.options.paused){ + this.firstrun = false; + this.pause(1); + } + this.fireEvent('complete'); + }, + +/** +Private method: captions + Builds the optional caption element, adds interactivity. + This method can safely be removed if the captions option is not enabled. +*/ + + _captions: function(){ + if (this.options.captions === true) + this.options.captions = {}; + var el = this.slideshow.getElement(this.classes.get('captions')); + var captions = (el) ? el.empty() : new Element('div', {'class': this.classes.get('captions').substr(1)}).inject(this.slideshow); + captions.set({ + 'events': { + 'update': function(fast){ + var captions = this.slideshow.retrieve('captions'); + var empty = (this.data.captions[this.slide] === ''); + if (fast){ + var p = (empty) ? 'hidden' : 'visible'; + captions.set('html', this.data.captions[this.slide]).get('morph').cancel().set(this.classes.get('captions', p)); + } + else { + var fn = (empty) ? $empty : function(n){ + this.slideshow.retrieve('captions').set('html', this.data.captions[n]).morph(this.classes.get('captions', 'visible')) + }.pass(this.slide, this); + captions.get('morph').cancel().start(this.classes.get('captions', 'hidden')).chain(fn); + } + }.bind(this) + }, + 'morph': $merge(this.options.captions, {'link': 'chain'}) + }); + this.slideshow.store('captions', captions); + }, + +/** +Private method: controller + Builds the optional controller element, adds interactivity. + This method can safely be removed if the controller option is not enabled. +*/ + + _controller: function(){ + if (this.options.controller === true) + this.options.controller = {}; + var el = this.slideshow.getElement(this.classes.get('controller')); + var controller = (el) ? el.empty() : new Element('div', {'class': this.classes.get('controller').substr(1)}).inject(this.slideshow); + var ul = new Element('ul').inject(controller); + $H({'first': 'Shift + Leftwards Arrow', 'prev': 'Leftwards Arrow', 'pause': 'P', 'next': 'Rightwards Arrow', 'last': 'Shift + Rightwards Arrow'}).each(function(accesskey, action){ + var li = new Element('li', { + 'class': (action == 'pause' && this.options.paused) ? this.classes.play + ' ' + this.classes[action] : this.classes[action] + }).inject(ul); + var a = this.slideshow.retrieve(action, new Element('a', { + 'title': ((action == 'pause') ? this.classes.play.capitalize() + ' / ' : '') + this.classes[action].capitalize() + ' [' + accesskey + ']' + }).inject(li)); + a.set('events', { + 'click': function(action){this[action]();}.pass(action, this), + 'mouseenter': function(active){this.addClass(active);}.pass(this.classes.active, a), + 'mouseleave': function(active){this.removeClass(active);}.pass(this.classes.active, a) + }); + }, this); + controller.set({ + 'events': { + 'hide': function(hidden){ + if (!this.retrieve('hidden')) + this.store('hidden', true).morph(hidden); + }.pass(this.classes.get('controller', 'hidden'), controller), + 'show': function(visible){ + if (this.retrieve('hidden')) + this.store('hidden', false).morph(visible); + }.pass(this.classes.get('controller', 'visible'), controller) + }, + 'morph': $merge(this.options.controller, {'link': 'cancel'}) + }).store('hidden', false); + var keydown = function(e){ + if (['left', 'right', 'p'].contains(e.key)){ + var controller = this.slideshow.retrieve('controller'); + if (controller.retrieve('hidden')) + controller.get('morph').set(this.classes.get('controller', 'visible')); + switch(e.key){ + case 'left': + this.slideshow.retrieve((e.shift) ? 'first' : 'prev').fireEvent('mouseenter'); break; + case 'right': + this.slideshow.retrieve((e.shift) ? 'last' : 'next').fireEvent('mouseenter'); break; + default: + this.slideshow.retrieve('pause').fireEvent('mouseenter'); break; + } + } + }.bind(this); + this.events.keydown.push(keydown); + var keyup = function(e){ + if (['left', 'right', 'p'].contains(e.key)){ + var controller = this.slideshow.retrieve('controller'); + if (controller.retrieve('hidden')) + controller.store('hidden', false).fireEvent('hide'); + switch(e.key){ + case 'left': + this.slideshow.retrieve((e.shift) ? 'first' : 'prev').fireEvent('mouseleave'); break; + case 'right': + this.slideshow.retrieve((e.shift) ? 'last' : 'next').fireEvent('mouseleave'); break; + default: + this.slideshow.retrieve('pause').fireEvent('mouseleave'); break; + } + } + }.bind(this); + this.events.keyup.push(keyup); + var mousemove = function(e){ + var images = this.slideshow.retrieve('images').getCoordinates(); + if (e.page.x > images.left && e.page.x < images.right && e.page.y > images.top && e.page.y < images.bottom) + this.slideshow.retrieve('controller').fireEvent('show'); + else + this.slideshow.retrieve('controller').fireEvent('hide'); + }.bind(this); + this.events.mousemove.push(mousemove); + document.addEvents({'keydown': keydown, 'keyup': keyup, 'mousemove': mousemove}); + this.slideshow.retrieve('controller', controller).fireEvent('hide'); + }, + +/** +Private method: loader + Builds the optional loader element, adds interactivity. + This method can safely be removed if the loader option is not enabled. +*/ + + _loader: function(){ + if (this.options.loader === true) + this.options.loader = {}; + var loader = new Element('div', { + 'class': this.classes.get('loader').substr(1), + 'morph': $merge(this.options.loader, {'link': 'cancel'}) + }).store('hidden', false).store('i', 1).inject(this.slideshow.retrieve('images')); + if (this.options.loader.animate){ + for (var i = 0; i < this.options.loader.animate[1]; i++) + img = new Asset.image(this.options.loader.animate[0].replace(/#/, i)); + if (Browser.Engine.trident4 && this.options.loader.animate[0].contains('png')) + loader.setStyle('backgroundImage', 'none'); + } + loader.set('events', { + 'animate': function(){ + var loader = this.slideshow.retrieve('loader'); + var i = (loader.retrieve('i').toInt() + 1) % this.options.loader.animate[1]; + loader.store('i', i); + var img = this.options.loader.animate[0].replace(/#/, i); + if (Browser.Engine.trident4 && this.options.loader.animate[0].contains('png')) + loader.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + img + '", sizingMethod="scale")'; + else + loader.setStyle('backgroundImage', 'url(' + img + ')'); + }.bind(this), + 'hide': function(){ + var loader = this.slideshow.retrieve('loader'); + if (!loader.retrieve('hidden')){ + loader.store('hidden', true).morph(this.classes.get('loader', 'hidden')); + if (this.options.loader.animate) + $clear(loader.retrieve('timer')); + } + }.bind(this), + 'show': function(){ + var loader = this.slideshow.retrieve('loader'); + if (loader.retrieve('hidden')){ + loader.store('hidden', false).morph(this.classes.get('loader', 'visible')); + if (this.options.loader.animate) + loader.store('timer', function(){this.fireEvent('animate');}.periodical(50, loader)); + } + }.bind(this) + }); + this.slideshow.retrieve('loader', loader).fireEvent('hide'); + }, + +/** +Private method: thumbnails + Builds the optional thumbnails element, adds interactivity. + This method can safely be removed if the thumbnails option is not enabled. +*/ + + _thumbnails: function(){ + if (this.options.thumbnails === true) + this.options.thumbnails = {}; + var el = this.slideshow.getElement(this.classes.get('thumbnails')); + var thumbnails = (el) ? el.empty() : new Element('div', {'class': this.classes.get('thumbnails').substr(1)}).inject(this.slideshow); + thumbnails.setStyle('overflow', 'hidden'); + var ul = new Element('ul', {'tween': {'link': 'cancel'}}).inject(thumbnails); + this.data.thumbnails.each(function(thumbnail, i){ + var li = new Element('li').inject(ul); + var a = new Element('a', { + 'events': { + 'click': function(i){ + this.go(i); + return false; + }.pass(i, this), + 'loaded': function(){ + this.data.thumbnails.pop(); + if (!this.data.thumbnails.length){ + var div = thumbnails.getCoordinates(); + var props = thumbnails.retrieve('props'); + var limit = 0, pos = props[1], size = props[2]; + thumbnails.getElements('li').each(function(li){ + var li = li.getCoordinates(); + if (li[pos] > limit) limit = li[pos]; + }, this); + thumbnails.store('limit', div[size] + div[props[0]] - limit); + } + }.bind(this) + }, + 'href': this.options.hu + this.data.images[i], + 'morph': $merge(this.options.thumbnails, {'link': 'cancel'}) + }).inject(li); + if (this.data.captions[i] && this.options.titles) + a.set('title', this.data.captions[i].replace(/<.+?>/gm, '').replace(//g, '>').replace(/"/g, "'")); + var img = new Asset.image(this.options.hu + thumbnail, { + 'onload': function(){this.fireEvent('loaded');}.bind(a) + }).inject(a); + }, this); + thumbnails.set('events', { + 'scroll': function(n, fast){ + var div = this.getCoordinates(); + var ul = this.getElement('ul').getPosition(); + var props = this.retrieve('props'); + var axis = props[3], delta, pos = props[0], size = props[2], value; + var tween = this.getElement('ul').get('tween', {'property': pos}); + if ($chk(n)){ + var li = this.getElements('li')[n].getCoordinates(); + delta = div[pos] + (div[size] / 2) - (li[size] / 2) - li[pos] + value = (ul[axis] - div[pos] + delta).limit(this.retrieve('limit'), 0); + if (fast) + tween.set(value); + else + tween.start(value); + } + else{ + var area = div[props[2]] / 3, page = this.retrieve('page'), velocity = -0.2; + if (page[axis] < (div[pos] + area)) + delta = (page[axis] - div[pos] - area) * velocity; + else if (page[axis] > (div[pos] + div[size] - area)) + delta = (page[axis] - div[pos] - div[size] + area) * velocity; + if (delta){ + value = (ul[axis] - div[pos] + delta).limit(this.retrieve('limit'), 0); + tween.set(value); + } + } + }.bind(thumbnails), + 'update': function(fast){ + var thumbnails = this.slideshow.retrieve('thumbnails'); + thumbnails.getElements('a').each(function(a, i){ + if (i == this.slide){ + if (!a.retrieve('active', false)){ + a.store('active', true); + var active = this.classes.get('thumbnails', 'active'); + if (fast) a.get('morph').set(active); + else a.morph(active); + } + } + else { + if (a.retrieve('active', true)){ + a.store('active', false); + var inactive = this.classes.get('thumbnails', 'inactive'); + if (fast) a.get('morph').set(inactive); + else a.morph(inactive); + } + } + }, this); + if (!thumbnails.retrieve('mouseover')) + thumbnails.fireEvent('scroll', [this.slide, fast]); + }.bind(this) + }) + var div = thumbnails.getCoordinates(); + thumbnails.store('props', (div.height > div.width) ? ['top', 'bottom', 'height', 'y'] : ['left', 'right', 'width', 'x']); + var mousemove = function(e){ + var div = this.getCoordinates(); + if (e.page.x > div.left && e.page.x < div.right && e.page.y > div.top && e.page.y < div.bottom){ + this.store('page', e.page); + if (!this.retrieve('mouseover')){ + this.store('mouseover', true); + this.store('timer', function(){this.fireEvent('scroll');}.periodical(50, this)); + } + } + else { + if (this.retrieve('mouseover')){ + this.store('mouseover', false); + $clear(this.retrieve('timer')); + } + } + }.bind(thumbnails); + this.events.mousemove.push(mousemove); + document.addEvent('mousemove', mousemove); + this.slideshow.store('thumbnails', thumbnails); + } +}); \ No newline at end of file diff --git a/src/slideshow/js/slideshow.kenburns.js b/src/slideshow/js/slideshow.kenburns.js new file mode 100644 index 0000000..3180ceb --- /dev/null +++ b/src/slideshow/js/slideshow.kenburns.js @@ -0,0 +1,96 @@ +/** +Script: Slideshow.KenBurns.js + Slideshow.KenBurns - KenBurns extension for Slideshow, includes zooming and panning effects. + +License: + MIT-style license. + +Copyright: + Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/). + +Dependencies: + Slideshow. +*/ + +Slideshow.KenBurns = new Class({ + Extends: Slideshow, + + options: { + pan: [100, 100], + zoom: [50, 50] + }, + +/** +Constructor: initialize + Creates an instance of the Slideshow class. + +Arguments: + element - (element) The wrapper element. + data - (array or object) The images and optional thumbnails, captions and links for the show. + options - (object) The options below. + +Syntax: + var myShow = new Slideshow.KenBurns(element, data, options); +*/ + + initialize: function(el, data, options){ + options.overlap = true; + options.resize = true; + ['pan', 'zoom'].each(function(p){ + if ($chk(this[p])){ + if ($type(this[p]) != 'array') this[p] = [this[p], this[p]]; + this[p].map(function(n){return (n.toInt() || 0).limit(0, 100);}); + } + }, options); + this.parent(el, data, options); + }, + +/** +Private method: show + Does the slideshow effect. +*/ + + _show: function(fast){ + if (!this.image.retrieve('morph')){ + ['a', 'b'].each(function(image){ + this[image].set('tween', { + 'duration': this.options.duration, 'link': 'cancel', 'onStart': this._start.bind(this), 'onComplete': this._complete.bind(this), 'property': 'opacity'} + ).get('morph', { + 'duration': (this.options.delay + this.options.duration * 2), 'link': 'cancel', 'transition': $arguments(0)} + ); + }, this); + } + this.image.set('styles', {'bottom': 'auto', 'left': 'auto', 'right': 'auto', 'top': 'auto'}); + var props = ['top left', 'top right', 'bottom left', 'bottom right'][this.counter % 4].split(' '); + props.each(function(prop){this.image.setStyle(prop, 0);}, this); + dh = this.height / this.preloader.height; + dw = this.width / this.preloader.width; + delta = (dw > dh) ? dw : dh; + var values = {}; + var zoom = ($random.run(this.options.zoom) / 100.0) + 1; + var pan = Math.abs(($random.run(this.options.pan) / 100.0) - 1); + ['height', 'width'].each(function(prop, i){ + var e = Math.ceil(this.preloader[prop] * delta); + var s = (e * zoom).toInt(); + values[prop] = [s, e]; + if (dw > dh || i){ + e = (this[prop] - this.image[prop]); + s = (e * pan).toInt(); + values[props[i]] = [s, e]; + } + }, this); + var paused = (this.firstrun && this.options.paused); + if (fast || paused){ + this._center(this.image); + this.image.get('morph').cancel(); + if (paused) + this.image.get('tween').cancel().set(0).start(1); + else + this.image.get('tween').cancel().set(1); + } + else{ + this.image.get('morph').start(values); + this.image.get('tween').set(0).start(1); + } + } +}); \ No newline at end of file diff --git a/src/slideshow/js/slideshow.push.js b/src/slideshow/js/slideshow.push.js new file mode 100644 index 0000000..69e8a65 --- /dev/null +++ b/src/slideshow/js/slideshow.push.js @@ -0,0 +1,63 @@ +/** +Script: Slideshow.Push.js + Slideshow.Push - Push extension for Slideshow. + +License: + MIT-style license. + +Copyright: + Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/). + +Dependencies: + Slideshow. + Mootools 1.2 More: Fx.Elements. +*/ + +Slideshow.Push = new Class({ + Extends: Slideshow, + +/** +Constructor: initialize + Creates an instance of the Slideshow class. + +Arguments: + element - (element) The wrapper element. + data - (array or object) The images and optional thumbnails, captions and links for the show. + options - (object) The options below. + +Syntax: + var myShow = new Slideshow.Push(element, data, options); +*/ + + initialize: function(el, data, options){ + options.overlap = true; + this.parent(el, data, options); + }, + +/** +Private method: show + Does the slideshow effect. +*/ + + _show: function(fast){ + var images = [this.image, ((this.counter % 2) ? this.a : this.b)]; + if (!this.image.retrieve('fx')) + this.image.store('fx', new Fx.Elements(images, {'duration': this.options.duration, 'link': 'cancel', 'onStart': this._start.bind(this), 'onComplete': this._complete.bind(this), 'transition': this.options.transition })); + this.image.set('styles', {'left': 'auto', 'right': 'auto' }).setStyle(this.direction, this.width); + var values = {'0': {}, '1': {} }; + values['0'][this.direction] = [this.width, 0]; + values['1'][this.direction] = [0, -this.width]; + if (images[1].getStyle(this.direction) == 'auto'){ + var width = this.width - images[1].width; + images[1].set('styles', {'left': 'auto', 'right': 'auto' }).setStyle(this.direction, width); + values['1'][this.direction] = [width, -this.width]; + } + if (fast){ + for (var prop in values) + values[prop][this.direction] = values[prop][this.direction][1]; + this.image.retrieve('fx').cancel().set(values); + } + else + this.image.retrieve('fx').start(values); + } +}); \ No newline at end of file