izimodal 1.3.3 → 1.4.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b65e27c4e6a2c0da7b9aa16ba27aa25e2bd53d17
-  data.tar.gz: a96e48dd4a352b29755abd758e0eb47457bbf2b9
+  metadata.gz: d95aab4cf9d16b84cdd34145cf0aba5a6336f259
+  data.tar.gz: bcced28d3b61c473d488f5c2c4f9bba62aaecfef
 SHA512:
-  metadata.gz: b8a5642ff491d5456ba77c056348889acea37f4b8236ac2f5c0feecff438ff30361eb0072be2bcde12cb7cc2396b245da858d915cd4e6191d8dfb6a954e3428e
-  data.tar.gz: 6c5b9a67f8aafd5e7d947ebc86113060ef46487bb636d68f9a750e098bd1455e567e598566a5fc71226f026c28fa8d49727d3900165ec395da9763aa11449d42
+  metadata.gz: 6143fdb47f665c1e19ccf55a60bc50512300f3c8aa8ffd100e8c23361fa17f4a9146098545708bc0b0aaa592387a88fcddbdcb8c10c1ec39d95f80f40505aa68
+  data.tar.gz: 6d102a3f162829821358a768e4f358e92f2ee4ccd81c86db5315bb9a5631d962ddb22d2e92253b2d54df6d37bb01d1bdc62cccd8be3dbb76294fe4bf73c91e5e

data/README.md

@@ -2,7 +2,7 @@
 
 Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/izimodal`. To experiment with that code, run `bin/console` for an interactive prompt.
 
-TODO: Delete this and the text above, and describe your gem
+For further reading about assets, goto JS github repo: https://github.com/elitenomad/izimodal.git
 
 ## Installation
 

data/lib/izimodal/version.rb

@@ -1,3 +1,3 @@
 module Izimodal
-  VERSION = "1.3.3"
+  VERSION = "1.4.0"
 end

data/vendor/assets/javascripts/iziModal.js

@@ -1,5 +1,5 @@
 /*
-* iziModal | v1.3.3
+* iziModal | v1.4.0
 * http://izimodal.marcelodolce.com
 * by Marcelo Dolce.
 */
@@ -73,7 +73,12 @@
             	ids: []
             };
 			this.$element.attr('aria-hidden', 'true');
+			this.$element.attr('aria-labelledby', this.id);
+			this.$element.attr('role', 'dialog');
 
+			if( !this.$element.hasClass('iziModal') ){
+				this.$element.addClass('iziModal');
+			}
             if(this.group.name === undefined && options.group !== ""){
             	this.group.name = options.group;
             	this.$element.attr('data-'+PLUGIN_NAME+'-group', options.group);
@@ -98,7 +103,12 @@
             
             if (options.fullscreen === true) {
             	this.$header.append('<a href="javascript:void(0)" class="'+PLUGIN_NAME+'-button '+PLUGIN_NAME+'-button-fullscreen" data-'+PLUGIN_NAME+'-fullscreen></a>');
-            	this.$header.css('padding-right', '76px');
+
+				if (options.rtl === true) {
+					this.$header.css('padding-left', '76px');
+				} else {
+					this.$header.css('padding-right', '76px');
+				}
             }
 
 			if (options.timeoutProgressbar === true && !isNaN(parseInt(options.timeout)) && options.timeout !== false && options.timeout !== 0) {
@@ -155,7 +165,7 @@
 
             if(options.theme !== ""){
 				if(options.theme === "light"){
-					this.$element.addClass(PLUGIN_NAME+"-light");
+					this.$element.addClass(PLUGIN_NAME+'-light');
 				} else {
 					this.$element.addClass(options.theme);
 				}
@@ -166,6 +176,10 @@
 			    this.$element.addClass('isFullscreen');
 			}
 
+			if(options.rtl === true) {
+				this.$element.addClass(PLUGIN_NAME+'-rtl');
+			}
+
 			if(options.attached === 'top' || this.$element.attr('data-'+PLUGIN_NAME+'-attached') == 'top' ){
 			    this.$element.addClass('isAttachedTop');
 			}
@@ -200,7 +214,11 @@
 	            
 	        	that.width = that.$element.outerWidth();
 
-				that.mediaQueries = '<style rel="' + that.id + '">@media handheld, only screen and (max-width: ' + that.width + 'px) { #' + that.id + '{ width: 100% !important; max-width: 100% !important; margin-left: 0 !important; left: 0 !important; border-radius:0!important} #' + that.id + ' .'+PLUGIN_NAME+'-header{border-radius:0!important} }</style>';
+	        	if(parseInt(wClear) > that.width){	
+	        		that.width = parseInt(wClear);
+	        	}
+
+				that.mediaQueries = '<style rel="' + that.id + '">@media handheld, only screen and (max-width: ' + that.width + 'px) { #' + that.id + '{ width:100% !important; max-width:100% !important; margin-left:0 !important; left:0 !important; right:0 !important; border-radius:0!important} #' + that.id + ' .'+PLUGIN_NAME+'-header{border-radius:0!important} }</style>';
 
 	        	$(document.body).append(that.mediaQueries);
 
@@ -346,6 +364,9 @@
 
 				if (this.options.bodyOverflow || isMobile){
 					$('html').addClass(PLUGIN_NAME+'-isOverflow');
+					if(isMobile){
+						$('body').css('overflow', 'hidden');
+					}
 				}
 
 				if (this.options.onOpening && typeof(this.options.onOpening) === "function") {
@@ -516,21 +537,22 @@
 			var that = this;
 
 			function closed(){
+                
+                // console.info('[ '+PLUGIN_NAME+' | '+that.id+' ] Closed.');
+                that.state = STATES.CLOSED;
+                that.$element.trigger(STATES.CLOSED);
+
                 if (that.options.iframe === true) {
                     that.$element.find('.'+PLUGIN_NAME+'-iframe').attr('src', "");
                 }
 
 				if (that.options.bodyOverflow || isMobile){
 					$('html').removeClass(PLUGIN_NAME+'-isOverflow');
-				}
-
-				$('html').removeClass(PLUGIN_NAME+'-isAttached');
-
-                that.state = STATES.CLOSED;
-                that.$element.trigger(STATES.CLOSED);
-                
-                // console.info('[ '+PLUGIN_NAME+' | '+that.id+' ] Closed.');
-
+					if(isMobile){
+						$('body').css('overflow','auto');
+					}
+				}                
+				
 				if (that.options.onClosed && typeof(that.options.onClosed) === "function") {
 			        that.options.onClosed(that);
 			    }
@@ -538,6 +560,10 @@
 				if(that.options.restoreDefaultContent === true){
 				    that.$element.find('.'+PLUGIN_NAME+'-content').html( that.content );
 				}
+
+				if( $('.'+PLUGIN_NAME+':visible').attr('id') === undefined){
+					$('html').removeClass(PLUGIN_NAME+'-isAttached');
+				}
 			}
 
             if(this.state == STATES.OPENED || this.state == STATES.OPENING){
@@ -567,7 +593,7 @@
 
 				if (transitionOut !== '') {
 
-	                this.$element.attr('class', PLUGIN_NAME + " transitionOut " + transitionOut + " " + this.options.theme + " " + String((this.isFullscreen === true) ? 'isFullscreen' : '') + " " + String((this.options.attached === 'top') ? 'isAttachedTop' : '') + " " + String((this.options.attached === 'bottom') ? 'isAttachedBottom' : ''));
+	                this.$element.attr('class', PLUGIN_NAME + " transitionOut " + transitionOut + " " + this.options.theme + " " + String((this.isFullscreen === true) ? 'isFullscreen' : '') + " " + String(this.$element.hasClass('isAttached') ? "isAttached" : "") + " " + String((this.options.attached === 'top') ? 'isAttachedTop' : '') + " " + String((this.options.attached === 'bottom') ? 'isAttachedBottom' : '') + (this.options.rtl ? PLUGIN_NAME+'-rtl' : ''));
 					this.$overlay.attr('class', PLUGIN_NAME + "-overlay " + this.options.transitionOutOverlay);
 					this.$navigate.attr('class', PLUGIN_NAME + "-navigate " + this.options.transitionOutOverlay);
 
@@ -618,17 +644,34 @@
 			setTimeout(function(){
 
 				var loop = $('.'+PLUGIN_NAME+'[data-'+PLUGIN_NAME+'-group="'+that.group.name+'"][data-'+PLUGIN_NAME+'-loop]').length;
+				for (var i = that.group.index+1; i <= that.group.ids.length; i++) {
 
-				if((loop > 0 || that.options.loop === true) && (that.group.index+1) === that.group.ids.length){
+					try {
+						modals.in = $("#"+that.group.ids[i]).data().iziModal;
+					} catch(log) {
+						console.warn("No next modal");
+					}
+					if(typeof modals.in !== 'undefined'){
+
+						$("#"+that.group.ids[i]).iziModal('open', { transition: transitionIn });
+						break;
+
+					} else {
 
-					$("#"+that.group.ids[0]).iziModal('open', { transition: transitionIn });
-					modals.in = $("#"+that.group.ids[0]).data().iziModal;
+						if(i == that.group.ids.length && loop > 0 || that.options.loop === true){
 
-				} else if(that.group.index+1 < that.group.ids.length){
+							for (var index = 0; index <= that.group.ids.length; index++) {
 
-					$("#"+that.group.ids[that.group.index+1]).iziModal('open', { transition: transitionIn });
-					modals.in = $("#"+that.group.ids[that.group.index+1]).data().iziModal;
+								modals.in = $("#"+that.group.ids[index]).data().iziModal;
+								if(typeof modals.in !== 'undefined'){
+									$("#"+that.group.ids[index]).iziModal('open', { transition: transitionIn });								
+									break;
+								}
+							}
+						}
+					}
 				}
+
 			}, 200);
 
 			$(document).trigger( PLUGIN_NAME + "-group-change", modals );
@@ -647,7 +690,9 @@
             	modal = $(e.currentTarget);
             	transitionIn = modal.attr('data-'+PLUGIN_NAME+'-transitionIn');
             	transitionOut = modal.attr('data-'+PLUGIN_NAME+'-transitionOut');
+            	
 			} else if(e !== undefined){
+
 				if(e.transitionIn !== undefined){
 					transitionIn = e.transitionIn;
 				}
@@ -659,18 +704,37 @@
 			this.close({transition:transitionOut});
 
 			setTimeout(function(){
+
 				var loop = $('.'+PLUGIN_NAME+'[data-'+PLUGIN_NAME+'-group="'+that.group.name+'"][data-'+PLUGIN_NAME+'-loop]').length;
 
-				if( (loop > 0 || that.options.loop === true) && that.group.index === 0){
+				for (var i = that.group.index; i >= 0; i--) {
 
-					$("#"+that.group.ids[that.group.ids.length-1]).iziModal('open', { transition: transitionIn });
-					modals.in = $("#"+that.group.ids[that.group.ids.length-1]).data().iziModal;
+					try {
+						modals.in = $("#"+that.group.ids[i-1]).data().iziModal;
+					} catch(log) {
+						console.warn("No previous modal");
+					}
+					if(typeof modals.in !== 'undefined'){
 
-				} else if(that.group.index > 0){
+						$("#"+that.group.ids[i-1]).iziModal('open', { transition: transitionIn });
+						break;
 
-					$("#"+that.group.ids[that.group.index-1]).iziModal('open', { transition: transitionIn });
-					modals.in = $("#"+that.group.ids[that.group.index-1]).data().iziModal;
+					} else {
+
+						if(i === 0 && loop > 0 || that.options.loop === true){
+
+							for (var index = that.group.ids.length-1; index >= 0; index--) {
+
+								modals.in = $("#"+that.group.ids[index]).data().iziModal;
+								if(typeof modals.in !== 'undefined'){
+									$("#"+that.group.ids[index]).iziModal('open', { transition: transitionIn });								
+									break;
+								}
+							}
+						}
+					}
 				}
+
 			}, 200);
 
 			$(document).trigger( PLUGIN_NAME + "-group-change", modals );
@@ -735,8 +799,6 @@
 
 		setIcon: function(icon){
 
-			console.log(this.$header.find('.'+PLUGIN_NAME+'-header-icon').length);
-
 			if( this.$header.find('.'+PLUGIN_NAME+'-header-icon').length === 0 ){
 				this.$header.prepend('<i class="'+PLUGIN_NAME+'-header-icon"></i>');
 			}
@@ -819,6 +881,7 @@
 					if(windowHeight < (this.options.iframeHeight + this.headerHeight) || this.isFullscreen === true){
 
 						$('html').addClass(PLUGIN_NAME+'-isAttached');
+						this.$element.addClass('isAttached');
 
 						this.$element.find('.'+PLUGIN_NAME+'-iframe').css({
 							'height': parseInt(windowHeight - this.headerHeight) + 'px',
@@ -826,6 +889,7 @@
 
 					} else {
 						$('html').removeClass(PLUGIN_NAME+'-isAttached');
+						this.$element.removeClass('isAttached');
 
 					    this.$element.find('.'+PLUGIN_NAME+'-iframe').css({
 					        'height': parseInt(this.options.iframeHeight) + 'px',
@@ -836,6 +900,7 @@
 
 	                if (windowHeight > (contentHeight + this.headerHeight) && this.isFullscreen !== true) {
 						$('html').removeClass(PLUGIN_NAME+'-isAttached');
+						this.$element.removeClass('isAttached');
 	                    this.$element.find('.'+PLUGIN_NAME+'-wrap').css({'height': 'auto'});
 	                }
 
@@ -845,6 +910,7 @@
 
 		                if( !$('html').hasClass(PLUGIN_NAME+'-isAttached') ){
 							$('html').addClass(PLUGIN_NAME+'-isAttached');
+							this.$element.addClass('isAttached');
 		                }
 
 	                    this.$element.find('.'+PLUGIN_NAME+'-wrap').css({
@@ -866,7 +932,7 @@
             }
 
             // Corrige margin-top caso o modal sofra alterações na altura de seu conteúdo
-            if (this.$element.css('margin-top') != modalMargin && this.$element.css('margin-top') != "0px") {
+            if (this.$element.css('margin-top') != modalMargin && this.$element.css('margin-top') != "0px" && !$('html').hasClass(PLUGIN_NAME+'-isAttached')) {
                 this.$element.css('margin-top', modalMargin);
             }
 		}
@@ -891,16 +957,21 @@
 					 }
 				});
 
-				var data = $(modalHash).data();
-
-				if(e.type === 'load'){
-					if(data.iziModal.options.autoOpen !== false){
-						$(modalHash).iziModal("open");
+				try {
+					var data = $(modalHash).data();
+					if(typeof data !== 'undefined'){
+						if(e.type === 'load'){
+							if(data.iziModal.options.autoOpen !== false){
+								$(modalHash).iziModal("open");
+							}
+						} else {
+							setTimeout(function(){
+								$(modalHash).iziModal("open");
+							},200);
+						}
 					}
-				} else {
-					setTimeout(function(){
-						$(modalHash).iziModal("open");
-					},200);
+				} catch(log) {
+					console.info(log);
 				}
 
 			} else {
@@ -1012,6 +1083,7 @@
 	    icon: null,
 	    iconText: null,
 	    iconColor: '',
+	    rtl: false,
 	    width: 600,
 	    padding: 0,
 	    radius: 3,

data/vendor/assets/stylesheets/iziModal.css

@@ -1,5 +1,5 @@
 /*
-* iziModal | v1.3.3
+* iziModal | v1.4.0
 * http://izimodal.marcelodolce.com
 * by Marcelo Dolce.
 */
@@ -92,6 +92,8 @@
     border-radius: 50%;
     transition: transform 0.5s cubic-bezier(.16,.81,.32,1), opacity 0.5s ease;
     background-size: 67% !important;
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    -webkit-tap-highlight-color: transparent; /* For some Androids */
 }
 .iziModal .iziModal-button-close{
     right: 10px;
@@ -113,7 +115,7 @@
 .iziModal .iziModal-header {
     background: #88A0B9;
     padding: 14px 40px 15px 18px;
-    box-shadow: inset 0 -10px 15px -12px rgba(0, 0, 0, 0.3);
+    box-shadow: inset 0 -10px 15px -12px rgba(0, 0, 0, 0.3), 0 0 0px #555;
     overflow: hidden;
     position: relative;
     z-index: 10;
@@ -164,6 +166,33 @@
         top: 6px;
     }
 
+    /* RTL */
+
+    .iziModal-rtl {
+        direction: rtl;
+    }
+    .iziModal-rtl .iziModal-header {
+        padding: 14px 18px 15px 40px;
+    }
+    .iziModal-rtl .iziModal-header-icon {
+        float: right;
+        padding: 0 0 0 15px;
+    }
+    .iziModal-rtl .iziModal-button-close {
+        left: 10px;
+        right: initial;
+    }
+    .iziModal-rtl .iziModal-button-fullscreen {
+        right: initial;
+        left: 44px;
+    }
+    .iziModal-rtl .iziModal-header.iziModal-noSubtitle {
+        padding: 10px 15px 12px 40px;
+    }    
+    .iziModal-rtl .iziModal-header.iziModal-noSubtitle .iziModal-header-icon {
+        padding: 0 0 0 13px;
+    }
+
     /* LIGHT THEME */
 
     .iziModal.iziModal-light .iziModal-header-icon{
@@ -203,7 +232,7 @@
 .iziModal .iziModal-content:before,
 .iziModal .iziModal-content:after { content:''; display:table }
 .iziModal .iziModal-content:after { clear:both }
-.iziModal .iziModal-content{ zoom:1 }
+.iziModal .iziModal-content{ zoom:1; width: 100%; }
 .iziModal .iziModal-wrap{
     width: 100%;
     position: relative;
@@ -225,7 +254,6 @@
     width: 100%;
 }
 
-
 .iziModal-navigate{
     position: fixed;
     left: 0;
@@ -307,13 +335,17 @@ html.iziModal-isOverflow body, html.iziModal-isAttached body{
 html.iziModal-isAttached{
     overflow: hidden;
 }
-html.iziModal-isAttached .iziModal{
+.iziModal.isAttached{
     border-radius: 0 !important;
+    margin-top: 0 !important;
+    top: 0 !important;
+    bottom: 0;
+    transition: none !important;
 }
-html.iziModal-isAttached .iziModal-header{
+.iziModal.isAttached .iziModal-header{
     border-radius: 0;       
 }
-html.iziModal-isAttached .iziModal-wrap{
+.iziModal.isAttached .iziModal-wrap{
     overflow-y: auto;
     overflow-x: hidden;
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: izimodal
 version: !ruby/object:Gem::Version
-  version: 1.3.3
+  version: 1.4.0
 platform: ruby
 authors:
 - elitenomad
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2016-09-06 00:00:00.000000000 Z
+date: 2016-09-27 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -90,9 +90,10 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.4.5.1
+rubygems_version: 2.4.3
 signing_key: 
 specification_version: 4
 summary: Rails gem for Elegant, responsive, flexible and lightweight modal plugin
   with jQuery Library.
 test_files: []
+has_rdoc: