Browse Source

Add cover: 'repeat' option to repeat background

Jay Salvat 9 years ago
parent
commit
91ea3d8fc5
6 changed files with 55 additions and 53 deletions
  1. 0 24
      dist/vegas.css
  2. 36 23
      dist/vegas.js
  3. 0 0
      dist/vegas.min.css
  4. 2 2
      dist/vegas.min.js
  5. 0 0
      dist/vegas.min.js.map
  6. 17 4
      src/vegas.js

+ 0 - 24
dist/vegas.css

@@ -180,20 +180,17 @@ body.vegas-container {
 .vegas-transition-slideLeft,
 .vegas-transition-slideLeft2 {
     -webkit-transform: translateX(100%);
-        -ms-transform: translateX(100%);
             transform: translateX(100%);
 }
 
 .vegas-transition-slideLeft-in,
 .vegas-transition-slideLeft2-in {
     -webkit-transform: translateX(0%);
-        -ms-transform: translateX(0%);
             transform: translateX(0%); 
 }
 
 .vegas-transition-slideLeft2-out {
     -webkit-transform: translateX(-100%);
-        -ms-transform: translateX(-100%);
             transform: translateX(-100%);
 }
 
@@ -201,20 +198,17 @@ body.vegas-container {
 .vegas-transition-slideRight,
 .vegas-transition-slideRight2 {
     -webkit-transform: translateX(-100%);
-        -ms-transform: translateX(-100%);
             transform: translateX(-100%);
 }
 
 .vegas-transition-slideRight-in,
 .vegas-transition-slideRight2-in {
     -webkit-transform: translateX(0%);
-        -ms-transform: translateX(0%);
             transform: translateX(0%); 
 }
 
 .vegas-transition-slideRight2-out {
     -webkit-transform: translateX(100%);
-        -ms-transform: translateX(100%);
             transform: translateX(100%);
 }
 
@@ -222,20 +216,17 @@ body.vegas-container {
 .vegas-transition-slideUp,
 .vegas-transition-slideUp2 {
     -webkit-transform: translateY(100%);
-        -ms-transform: translateY(100%);
             transform: translateY(100%);
 }
 
 .vegas-transition-slideUp-in,
 .vegas-transition-slideUp2-in {
     -webkit-transform: translateY(0%);
-        -ms-transform: translateY(0%);
             transform: translateY(0%); 
 }
 
 .vegas-transition-slideUp2-out {
     -webkit-transform: translateY(-100%);
-        -ms-transform: translateY(-100%);
             transform: translateY(-100%);
 }
 
@@ -243,20 +234,17 @@ body.vegas-container {
 .vegas-transition-slideDown,
 .vegas-transition-slideDown2 {
     -webkit-transform: translateY(-100%);
-        -ms-transform: translateY(-100%);
             transform: translateY(-100%);
 }
 
 .vegas-transition-slideDown-in,
 .vegas-transition-slideDown2-in {
     -webkit-transform: translateY(0%);
-        -ms-transform: translateY(0%);
             transform: translateY(0%); 
 }
 
 .vegas-transition-slideDown2-out {
     -webkit-transform: translateY(100%);
-        -ms-transform: translateY(100%);
             transform: translateY(100%);
 }
 
@@ -264,7 +252,6 @@ body.vegas-container {
 .vegas-transition-zoomIn,
 .vegas-transition-zoomIn2 {
     -webkit-transform: scale(0);
-        -ms-transform: scale(0);
             transform: scale(0);
     opacity: 0;
 }
@@ -272,14 +259,12 @@ body.vegas-container {
 .vegas-transition-zoomIn-in,
 .vegas-transition-zoomIn2-in {
     -webkit-transform: scale(1);
-        -ms-transform: scale(1);
             transform: scale(1);
     opacity: 1;
 }
 
 .vegas-transition-zoomIn2-out {
     -webkit-transform: scale(2);
-        -ms-transform: scale(2);
             transform: scale(2);
     opacity: 0;
 }
@@ -288,7 +273,6 @@ body.vegas-container {
 .vegas-transition-zoomOut,
 .vegas-transition-zoomOut2 {
     -webkit-transform: scale(2);
-        -ms-transform: scale(2);
             transform: scale(2);
     opacity: 0;
 }
@@ -296,14 +280,12 @@ body.vegas-container {
 .vegas-transition-zoomOut-in,
 .vegas-transition-zoomOut2-in {
     -webkit-transform: scale(1);
-        -ms-transform: scale(1);
             transform: scale(1);
     opacity: 1;
 }
 
 .vegas-transition-zoomOut2-out {
     -webkit-transform: scale(0);
-        -ms-transform: scale(0);
             transform: scale(0);
     opacity: 0;
 }
@@ -312,7 +294,6 @@ body.vegas-container {
 .vegas-transition-swirlLeft,
 .vegas-transition-swirlLeft2 {
     -webkit-transform: scale(2) rotate(35deg);
-        -ms-transform: scale(2) rotate(35deg);
             transform: scale(2) rotate(35deg);
     opacity: 0;
 }
@@ -320,14 +301,12 @@ body.vegas-container {
 .vegas-transition-swirlLeft-in,
 .vegas-transition-swirlLeft2-in {
     -webkit-transform: scale(1) rotate(0deg);
-        -ms-transform: scale(1) rotate(0deg);
             transform: scale(1) rotate(0deg); 
     opacity: 1;
 }
 
 .vegas-transition-swirlLeft2-out {
     -webkit-transform: scale(2) rotate(-35deg);
-        -ms-transform: scale(2) rotate(-35deg);
             transform: scale(2) rotate(-35deg);
     opacity: 0;
 }
@@ -336,7 +315,6 @@ body.vegas-container {
 .vegas-transition-swirlRight,
 .vegas-transition-swirlRight2 {
     -webkit-transform: scale(2) rotate(-35deg);
-        -ms-transform: scale(2) rotate(-35deg);
             transform: scale(2) rotate(-35deg);
     opacity: 0;
 }
@@ -344,14 +322,12 @@ body.vegas-container {
 .vegas-transition-swirlRight-in,
 .vegas-transition-swirlRight2-in {
     -webkit-transform: scale(1) rotate(0deg);
-        -ms-transform: scale(1) rotate(0deg);
             transform: scale(1) rotate(0deg);
     opacity: 1;
 }
 
 .vegas-transition-swirlRight2-out {
     -webkit-transform: scale(2) rotate(35deg);
-        -ms-transform: scale(2) rotate(35deg);
             transform: scale(2) rotate(35deg);
     opacity: 0;
 }

+ 36 - 23
dist/vegas.js

@@ -1,10 +1,10 @@
 /*!-----------------------------------------------------------------------------
  * Vegas - Fullscreen Backgrounds and Slideshows.
- * v2.1.3 - built 2015-04-28
+ * v2.1.3 - built 2016-01-11
  * Licensed under the MIT License.
  * http://vegas.jaysalvat.com/
  * ----------------------------------------------------------------------------
- * Copyright (C) 2010-2015 Jay Salvat
+ * Copyright (C) 2010-2016 Jay Salvat
  * http://jaysalvat.com/
  * --------------------------------------------------------------------------*/
 
@@ -36,7 +36,7 @@
         pause: function () {},
         walk:  function () {},
         slides: [
-            // {   
+            // {
             //  src:                null,
             //  color:              null,
             //  delay:              null,
@@ -101,7 +101,7 @@
         if (this.settings.animationRegister instanceof Array === false) {
             this.settings.animationRegister = [ this.settings.animationRegister ];
         }
-        
+
         this.transitions = this.transitions.concat(this.settings.transitionRegister);
         this.animations  = this.animations.concat(this.settings.animationRegister);
 
@@ -134,7 +134,7 @@
             // Wrapper with content
             if (!isBody) {
                 this.$elmt.css('height', this.$elmt.css('height'));
-                
+
                 $wrapper = $('<div class="vegas-wrapper">')
                     .css('overflow', this.$elmt.css('overflow'))
                     .css('padding',  this.$elmt.css('padding'));
@@ -189,7 +189,7 @@
         },
 
         _preload: function () {
-            var video, img, i;
+            var img, i;
 
             for (i = 0; i < this.settings.slides.length; i++) {
                 if (this.settings.preload || this.settings.preloadImages) {
@@ -202,9 +202,9 @@
                 if (this.settings.preload || this.settings.preloadVideos) {
                     if (this.support.video && this.settings.slides[i].video) {
                         if (this.settings.slides[i].video instanceof Array) {
-                            video = this._video(this.settings.slides[i].video);
+                            this._video(this.settings.slides[i].video);
                         } else {
-                            video = this._video(this.settings.slides[i].video.src);
+                            this._video(this.settings.slides[i].video.src);
                         }
                     }
                 }
@@ -221,7 +221,7 @@
             if (this.total > 1 && !this.paused && !this.noshow) {
                 this.timeout = setTimeout(function () {
                     self.next();
-                }, this._options('delay')); 
+                }, this._options('delay'));
             }
         },
 
@@ -254,7 +254,7 @@
         },
 
         _video: function (srcs) {
-            var video, 
+            var video,
                 source,
                 cacheKey = srcs.toString();
 
@@ -300,7 +300,7 @@
             var self   = this,
                 delay  = duration / 10,
                 volume = video.volume + 0.09;
-            
+
             if (volume < 1) {
                 video.volume = volume;
 
@@ -338,8 +338,8 @@
                 delay         = this._options('delay'),
                 align         = this._options('align'),
                 valign        = this._options('valign'),
+                cover         = this._options('cover'),
                 color         = this._options('color') || this.$elmt.css('background-color'),
-                cover         = this._options('cover') ? 'cover' : 'contain',
                 self          = this,
                 total         = $slides.length,
                 video,
@@ -347,9 +347,17 @@
 
             var transition         = this._options('transition'),
                 transitionDuration = this._options('transitionDuration'),
-                animation          = this._options('animation' ),
+                animation          = this._options('animation'),
                 animationDuration  = this._options('animationDuration');
 
+            if (cover !== 'repeat') {
+                if (cover === true) {
+                    cover = 'cover';
+                } else if (cover === false) {
+                    cover = 'contain';
+                }
+            }
+
             if (transition === 'random' || transition instanceof Array) {
                 if (transition instanceof Array) {
                     transition = this._random(transition);
@@ -375,7 +383,7 @@
             }
 
             $slide = $('<div class="vegas-slide"></div>');
-            
+
             if (this.support.transition && transition) {
                 $slide.addClass('vegas-transition-' + transition);
             }
@@ -425,8 +433,13 @@
                 $inner = $('<div class="vegas-slide-inner"></div>')
                     .css('background-image',    'url(' + src + ')')
                     .css('background-color',    color)
-                    .css('background-position', align + ' ' + valign)
-                    .css('background-size',     cover);
+                    .css('background-position', align + ' ' + valign);
+
+                if (cover === 'repeat') {
+                    $inner.css('background-repeat', 'repeat');
+                } else {
+                    $inner.css('background-size', cover);
+                }
 
                 if (this.support.transition && animation) {
                     $inner
@@ -488,7 +501,7 @@
                 if (video.readyState === 4) {
                     video.currentTime = 0;
                 }
-                
+
                 video.play();
                 go();
             } else {
@@ -581,8 +594,8 @@
             if (fn === 'init') {
                 params = [ this.settings ];
             } else {
-                params = [ 
-                    this.slide, 
+                params = [
+                    this.slide,
                     this.settings.slides[this.slide]
                 ];
             }
@@ -603,7 +616,7 @@
                 if (value === undefined) {
                     return this.settings[key];
                 }
-                this.settings[key] = value; 
+                this.settings[key] = value;
             } else {
                 return this.settings;
             }
@@ -612,12 +625,12 @@
             if (this.settings.slides !== oldSlides) {
                 this.total  = this.settings.slides.length;
                 this.noshow = this.total < 2;
-                this._preload();   
+                this._preload();
             }
         },
 
         destroy: function () {
-            clearTimeout(this.timeout); 
+            clearTimeout(this.timeout);
 
             this.$elmt.removeClass('vegas-container');
             this.$elmt.find('> .vegas-slide').remove();
@@ -631,7 +644,7 @@
             if (this.settings.overlay) {
                 this.$overlay.remove();
             }
-            
+
             this.elmt._vegas = null;
         }
     };

File diff suppressed because it is too large
+ 0 - 0
dist/vegas.min.css


File diff suppressed because it is too large
+ 2 - 2
dist/vegas.min.js


File diff suppressed because it is too large
+ 0 - 0
dist/vegas.min.js.map


+ 17 - 4
src/vegas.js

@@ -329,8 +329,8 @@
                 delay         = this._options('delay'),
                 align         = this._options('align'),
                 valign        = this._options('valign'),
+                cover         = this._options('cover'),
                 color         = this._options('color') || this.$elmt.css('background-color'),
-                cover         = this._options('cover') ? 'cover' : 'contain',
                 self          = this,
                 total         = $slides.length,
                 video,
@@ -338,9 +338,17 @@
 
             var transition         = this._options('transition'),
                 transitionDuration = this._options('transitionDuration'),
-                animation          = this._options('animation' ),
+                animation          = this._options('animation'),
                 animationDuration  = this._options('animationDuration');
 
+            if (cover !== 'repeat') {
+                if (cover === true) {
+                    cover = 'cover';
+                } else if (cover === false) {
+                    cover = 'contain';
+                }
+            }
+
             if (transition === 'random' || transition instanceof Array) {
                 if (transition instanceof Array) {
                     transition = this._random(transition);
@@ -416,8 +424,13 @@
                 $inner = $('<div class="vegas-slide-inner"></div>')
                     .css('background-image',    'url(' + src + ')')
                     .css('background-color',    color)
-                    .css('background-position', align + ' ' + valign)
-                    .css('background-size',     cover);
+                    .css('background-position', align + ' ' + valign);
+
+                if (cover === 'repeat') {
+                    $inner.css('background-repeat', 'repeat');
+                } else {
+                    $inner.css('background-size', cover);
+                }
 
                 if (this.support.transition && animation) {
                     $inner

Some files were not shown because too many files changed in this diff