smart-quick-view-backup.css
5 years ago
smart-quick-view.css
5 years ago
smart-quick-view.js
5 years ago
smart-quick-view.scss
5 years ago
smart-quick-view.js
11 lines
| 1 | /** |
| 2 | * jQuery Smart Quick View Plugin |
| 3 | * Requires jQuery v1.7 or later |
| 4 | * |
| 5 | * @author emranio <hello@emran.io> |
| 6 | * @license GPL 3.0 or later |
| 7 | * https://www.gnu.org/licenses/gpl-3.0.html |
| 8 | * |
| 9 | * Thanks to Ashraf for some excellent CSS contributions! |
| 10 | */ |
| 11 | !function(n){"use strict";n.smartQuickView=function(t,e){let o={};return o.settings=n.extend({eventContainer:n(document),modalContainer:n("body"),remoteContainer:"#sqv-remote-container",modalClass:"",sourceURL:"",payload:{},method:"POST",showLoadingSpinInModal:!1,loadInIframe:!1,closeModalByClickOnBody:!0,onClickBodyClass:"",onModalOpenBodyClass:"",onClickCallback:function(){},onCompleteCallback:function(){}},e),o.element=t,o.modalCache=null,o.modal=n("<div>",{"class":"sqv-modal sqv-modal--wrapper "+o.settings.modalClass}),o.elementLoadingSpin=n("<span>",{"class":"sqv-element-loading-spin"}),o.settings.onClickBodyClass+=" sqv-element-clicked",o.settings.onModalOpenBodyClass+=" sqv-modal-opened",o.settings.eventContainer="string"==typeof o.settings.eventContainer?n(o.settings.eventContainer):o.settings.eventContainer,o.settings.modalContainer="string"==typeof o.settings.modalContainer?n(o.settings.modalContainer):o.settings.modalContainer,o.init=function(){},o.clickEvent=function(t){t.preventDefault();let e=n(this);if("locked"!==e.data("sqv-status")){if(o.settings.sourceURL=void 0===e.data("source-url")?o.settings.sourceURL:e.data("source-url"),o.settings.loadInIframe=void 0===e.data("load-in-iframe")?o.settings.loadInIframe:e.data("load-in-iframe"),"string"==typeof o.settings.payload){console.log(o.settings.payload);let n=e.parents(o.settings.payload);o.settings.payload=n.serialize()}if(o.settings.payload=void 0===e.data("payload")?o.settings.payload:e.data("payload"),o.modalCache=null===o.modalCache?o.modalCreate():o.modalCache,o.loadingWarper=!1===o.settings.showLoadingSpinInModal?e:o.modalCache.find(".sqv-modal--overlay"),!0===o.settings.loadInIframe){var s=o.settings.sourceURL+"?"+o.settings.payload;o.modalOpen().html(`\n\t\t\t\t\t<iframe class="sqv-iframe" src="${s}"></iframe>\n\t\t\t\t`),e.data("sqv-status","no"),o.loading("hide"),n("body").addClass(o.settings.onModalOpenBodyClass),n("body").removeClass(o.settings.onClickBodyClass)}else n.ajax({method:o.settings.method,url:o.settings.sourceURL,data:o.settings.payload,dataType:"html",beforeSend:function(){e.data("sqv-status","locked"),n("body").addClass(o.settings.onClickBodyClass),o.loading("show"),o.settings.onClickCallback()},success:function(t){e.data("sqv-status","no"),o.modalOpen().html(o.extractContent(t)),o.loading("hide"),n("body").addClass(o.settings.onModalOpenBodyClass)},complete:function(){n("body").removeClass(o.settings.onClickBodyClass),o.settings.onCompleteCallback()}})}},o.extractContent=function(t){let e=n(t).find(o.settings.remoteContainer);return e.length>0?e.html():"No content found"},o.loading=function(n){o.elementLoadingSpin.appendTo(o.loadingWarper),o.loadingWarper.toggleClass("sqv-loading-spin-show sqv-loading-action-"+n)},o.modalCreate=function(){return o.modal.appendTo(o.settings.modalContainer).html('\n <div class="sqv-modal--overlay">\x3c!-- it\'s an empty div, used for modal overlay and modal loading spin --\x3e</div>\n <div class="sqv-modal__body"> \n <div class="sqv-modal__body--close-btn"> \n <i class="sqv-close-icon"></i>\n </div>\n <div class="sqv-modal__body--content">\n \x3c!-- remote content goes here --\x3e\n </div>\n </div>\n ')},o.modalOpen=function(){return n("body").addClass(o.settings.onCompleteBodyClass),o.modal.find(".sqv-modal__body--content")},o.modalCloseEvent=function(t){t.preventDefault(),n("body").removeClass(o.settings.onModalOpenBodyClass)},o.init(),n(o.settings.eventContainer).on("click",o.element,o.clickEvent),n(o.settings.eventContainer).on("click",".sqv-modal__body--close-btn",o.modalCloseEvent),this}}(jQuery); |