From be3b8e34a781a3aa2965cd34dedc5c9e7fe75a9b Mon Sep 17 00:00:00 2001 From: "shubhammehrotra.symfony@webkul.com" Date: Fri, 31 Jan 2020 20:01:36 +0530 Subject: [PATCH] category and category products through ajax --- .../publishable/assets/css/velocity.css | 32 +- .../publishable/assets/js/jquery.ez-plus.js | 1861 ++++++++++++++++- .../publishable/assets/js/velocity.js | 355 +++- .../Http/Controllers/Shop/ShopController.php | 79 + .../Webkul/Velocity/src/Http/front-routes.php | 4 + .../assets/js/UI/components/product-card.vue | 59 +- .../assets/js/UI/components/sidebar.vue | 99 +- .../Velocity/src/Resources/assets/js/app.js | 19 +- .../Resources/assets/sass/components/app.scss | 48 +- .../views/shop/UI/particals.blade.php | 48 +- .../views/shop/home/category.blade.php | 133 +- .../Resources/views/shop/home/index.blade.php | 4 +- .../views/shop/layouts/footer/index.blade.php | 6 +- .../layouts/header/nav-menu/navmenu.blade.php | 161 -- .../views/shop/layouts/master.blade.php | 38 +- .../views/shop/products/list/card.blade.php | 18 - .../products/list/recently-viewed.blade.php | 9 +- 17 files changed, 2516 insertions(+), 457 deletions(-) delete mode 100644 packages/Webkul/Velocity/src/Resources/views/shop/layouts/header/nav-menu/navmenu.blade.php diff --git a/packages/Webkul/Velocity/publishable/assets/css/velocity.css b/packages/Webkul/Velocity/publishable/assets/css/velocity.css index 678dffeff..3d06baf00 100644 --- a/packages/Webkul/Velocity/publishable/assets/css/velocity.css +++ b/packages/Webkul/Velocity/publishable/assets/css/velocity.css @@ -2181,6 +2181,27 @@ display: none; } +.sidebar .sub-categories .category { + padding: 5px 0 4px 15px; +} + +.sidebar .sub-categories .category + .nested { + color: rgba(0, 0, 0, 0.83); +} + +.sidebar .sub-categories .category + .nested li a { + padding-top: 0; +} + +.sidebar .sub-categories .category + .nested li a .category-title { + font-weight: 500; + padding-left: 28px; +} + +.sidebar .sub-categories .category .category-title { + vertical-align: top; +} + .category-list-container { z-index: 10; padding: 0px !important; @@ -2201,11 +2222,11 @@ position: relative; } -.category-list-container li { +.category-list-container li a { padding: 7px 0 5px 15px; } -.category-list-container li:hover { +.category-list-container li:hover > a { background: #ECECEC; } @@ -2508,8 +2529,8 @@ } .full-content-wrapper p > .container-fluid { - margin-bottom: 60px; padding: 0 !important; + margin-bottom: 60px !important; } .full-content-wrapper p > .container-fluid > .row { @@ -2663,6 +2684,11 @@ content: "\E907"; } +.carousel-products + .recently-viewed { + top: -40px; + position: relative; +} + /* @author Shubham Mehrotra */ body { display: none; diff --git a/packages/Webkul/Velocity/publishable/assets/js/jquery.ez-plus.js b/packages/Webkul/Velocity/publishable/assets/js/jquery.ez-plus.js index 07c00cd22..cf1ecf0b6 100644 --- a/packages/Webkul/Velocity/publishable/assets/js/jquery.ez-plus.js +++ b/packages/Webkul/Velocity/publishable/assets/js/jquery.ez-plus.js @@ -1,2 +1,1859 @@ -/*! jQuery v3.4.1 | (c) JS Foundation and other contributors | jquery.org/license */ -!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],E=C.document,r=Object.getPrototypeOf,s=t.slice,g=t.concat,u=t.push,i=t.indexOf,n={},o=n.toString,v=n.hasOwnProperty,a=v.toString,l=a.call(Object),y={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType},x=function(e){return null!=e&&e===e.window},c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.4.1",k=function(e,t){return new k.fn.init(e,t)},p=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function d(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp($),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+$),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\([\\da-f]{1,6}"+M+"?|("+M+")|.)","ig"),ne=function(e,t,n){var r="0x"+t-65536;return r!=r||n?t:r<0?String.fromCharCode(r+65536):String.fromCharCode(r>>10|55296,1023&r|56320)},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(m.childNodes),m.childNodes),t[m.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&((e?e.ownerDocument||e:m)!==C&&T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&y(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!A[t+" "]&&(!v||!v.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&U.test(t)){(s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=k),o=(l=h(t)).length;while(o--)l[o]="#"+s+" "+xe(l[o]);c=l.join(","),f=ee.test(t)&&ye(e.parentNode)||e}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){A(t,!0)}finally{s===k&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[k]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ve(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ye(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e.namespaceURI,n=(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:m;return r!==C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),m!==C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=k,!C.getElementsByName||!C.getElementsByName(k).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],v=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){a.appendChild(e).innerHTML="",e.querySelectorAll("[msallowcapture^='']").length&&v.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||v.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+k+"-]").length||v.push("~="),e.querySelectorAll(":checked").length||v.push(":checked"),e.querySelectorAll("a#"+k+"+*").length||v.push(".#.+[+~]")}),ce(function(e){e.innerHTML="";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&v.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&v.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&v.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),v.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",$)}),v=v.length&&new RegExp(v.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),y=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},D=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)===(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e===C||e.ownerDocument===m&&y(m,e)?-1:t===C||t.ownerDocument===m&&y(m,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e===C?-1:t===C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]===m?-1:s[r]===m?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if((e.ownerDocument||e)!==C&&T(e),d.matchesSelector&&E&&!A[t+" "]&&(!s||!s.test(t))&&(!v||!v.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){A(t,!0)}return 0":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=p[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&p(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?k.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?k.grep(e,function(e){return e===n!==r}):"string"!=typeof n?k.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(k.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||q,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:L.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof k?t[0]:t,k.merge(this,k.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),D.test(r[1])&&k.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(k):k.makeArray(e,this)}).prototype=k.fn,q=k(E);var H=/^(?:parents|prev(?:Until|All))/,O={children:!0,contents:!0,next:!0,prev:!0};function P(e,t){while((e=e[t])&&1!==e.nodeType);return e}k.fn.extend({has:function(e){var t=k(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i,ge={option:[1,""],thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function ve(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?k.merge([e],n):n}function ye(e,t){for(var n=0,r=e.length;nx",y.noCloneChecked=!!me.cloneNode(!0).lastChild.defaultValue;var Te=/^key/,Ce=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,Ee=/^([^.]*)(?:\.(.+)|)/;function ke(){return!0}function Se(){return!1}function Ne(e,t){return e===function(){try{return E.activeElement}catch(e){}}()==("focus"===t)}function Ae(e,t,n,r,i,o){var a,s;if("object"==typeof t){for(s in"string"!=typeof n&&(r=r||n,n=void 0),t)Ae(e,s,n,r,t[s],o);return e}if(null==r&&null==i?(i=n,r=n=void 0):null==i&&("string"==typeof n?(i=r,r=void 0):(i=r,r=n,n=void 0)),!1===i)i=Se;else if(!i)return e;return 1===o&&(a=i,(i=function(e){return k().off(e),a.apply(this,arguments)}).guid=a.guid||(a.guid=k.guid++)),e.each(function(){k.event.add(this,t,i,r,n)})}function De(e,i,o){o?(Q.set(e,i,!1),k.event.add(e,i,{namespace:!1,handler:function(e){var t,n,r=Q.get(this,i);if(1&e.isTrigger&&this[i]){if(r.length)(k.event.special[i]||{}).delegateType&&e.stopPropagation();else if(r=s.call(arguments),Q.set(this,i,r),t=o(this,i),this[i](),r!==(n=Q.get(this,i))||t?Q.set(this,i,!1):n={},r!==n)return e.stopImmediatePropagation(),e.preventDefault(),n.value}else r.length&&(Q.set(this,i,{value:k.event.trigger(k.extend(r[0],k.Event.prototype),r.slice(1),this)}),e.stopImmediatePropagation())}})):void 0===Q.get(e,i)&&k.event.add(e,i,ke)}k.event={global:{},add:function(t,e,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.get(t);if(v){n.handler&&(n=(o=n).handler,i=o.selector),i&&k.find.matchesSelector(ie,i),n.guid||(n.guid=k.guid++),(u=v.events)||(u=v.events={}),(a=v.handle)||(a=v.handle=function(e){return"undefined"!=typeof k&&k.event.triggered!==e.type?k.event.dispatch.apply(t,arguments):void 0}),l=(e=(e||"").match(R)||[""]).length;while(l--)d=g=(s=Ee.exec(e[l])||[])[1],h=(s[2]||"").split(".").sort(),d&&(f=k.event.special[d]||{},d=(i?f.delegateType:f.bindType)||d,f=k.event.special[d]||{},c=k.extend({type:d,origType:g,data:r,handler:n,guid:n.guid,selector:i,needsContext:i&&k.expr.match.needsContext.test(i),namespace:h.join(".")},o),(p=u[d])||((p=u[d]=[]).delegateCount=0,f.setup&&!1!==f.setup.call(t,r,h,a)||t.addEventListener&&t.addEventListener(d,a)),f.add&&(f.add.call(t,c),c.handler.guid||(c.handler.guid=n.guid)),i?p.splice(p.delegateCount++,0,c):p.push(c),k.event.global[d]=!0)}},remove:function(e,t,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.hasData(e)&&Q.get(e);if(v&&(u=v.events)){l=(t=(t||"").match(R)||[""]).length;while(l--)if(d=g=(s=Ee.exec(t[l])||[])[1],h=(s[2]||"").split(".").sort(),d){f=k.event.special[d]||{},p=u[d=(r?f.delegateType:f.bindType)||d]||[],s=s[2]&&new RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"),a=o=p.length;while(o--)c=p[o],!i&&g!==c.origType||n&&n.guid!==c.guid||s&&!s.test(c.namespace)||r&&r!==c.selector&&("**"!==r||!c.selector)||(p.splice(o,1),c.selector&&p.delegateCount--,f.remove&&f.remove.call(e,c));a&&!p.length&&(f.teardown&&!1!==f.teardown.call(e,h,v.handle)||k.removeEvent(e,d,v.handle),delete u[d])}else for(d in u)k.event.remove(e,d+t[l],n,r,!0);k.isEmptyObject(u)&&Q.remove(e,"handle events")}},dispatch:function(e){var t,n,r,i,o,a,s=k.event.fix(e),u=new Array(arguments.length),l=(Q.get(this,"events")||{})[s.type]||[],c=k.event.special[s.type]||{};for(u[0]=s,t=1;t\x20\t\r\n\f]*)[^>]*)\/>/gi,qe=/\s*$/g;function Oe(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&k(e).children("tbody")[0]||e}function Pe(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function Re(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Me(e,t){var n,r,i,o,a,s,u,l;if(1===t.nodeType){if(Q.hasData(e)&&(o=Q.access(e),a=Q.set(t,o),l=o.events))for(i in delete a.handle,a.events={},l)for(n=0,r=l[i].length;n")},clone:function(e,t,n){var r,i,o,a,s,u,l,c=e.cloneNode(!0),f=oe(e);if(!(y.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||k.isXMLDoc(e)))for(a=ve(c),r=0,i=(o=ve(e)).length;r").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Vt,Gt=[],Yt=/(=)\?(?=&|$)|\?\?/;k.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Gt.pop()||k.expando+"_"+kt++;return this[e]=!0,e}}),k.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Yt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Yt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Yt,"$1"+r):!1!==e.jsonp&&(e.url+=(St.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||k.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?k(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Gt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),y.createHTMLDocument=((Vt=E.implementation.createHTMLDocument("").body).innerHTML="
",2===Vt.childNodes.length),k.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(y.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=D.exec(e))?[t.createElement(i[1])]:(i=we([e],t,o),o&&o.length&&k(o).remove(),k.merge([],i.childNodes)));var r,i,o},k.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(k.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},k.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){k.fn[t]=function(e){return this.on(t,e)}}),k.expr.pseudos.animated=function(t){return k.grep(k.timers,function(e){return t===e.elem}).length},k.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=k.css(e,"position"),c=k(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=k.css(e,"top"),u=k.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,k.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},k.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){k.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===k.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===k.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=k(e).offset()).top+=k.css(e,"borderTopWidth",!0),i.left+=k.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-k.css(r,"marginTop",!0),left:t.left-i.left-k.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===k.css(e,"position"))e=e.offsetParent;return e||ie})}}),k.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;k.fn[t]=function(e){return _(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),k.each(["top","left"],function(e,n){k.cssHooks[n]=ze(y.pixelPosition,function(e,t){if(t)return t=_e(e,n),$e.test(t)?k(e).position()[n]+"px":t})}),k.each({Height:"height",Width:"width"},function(a,s){k.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){k.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return _(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?k.css(e,t,i):k.style(e,t,n,i)},s,n?e:void 0,n)}})}),k.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){k.fn[n]=function(e,t){return 0'); + self.$elem.css('position', 'absolute'); + } + + self.zoomLock = 1; + self.scrollingLock = false; + self.changeBgSize = false; + self.currentZoomLevel = self.options.zoomLevel; + + //get offset of the non zoomed image + self.nzOffset = self.$elem.offset(); + //calculate the width ratio of the large/small image + self.widthRatio = (self.largeWidth / self.currentZoomLevel) / self.nzWidth; + self.heightRatio = (self.largeHeight / self.currentZoomLevel) / self.nzHeight; + + function getWindowZoomStyle() { + return 'overflow: hidden;' + + 'background-position: 0px 0px;text-align:center;' + + 'background-color: ' + String(self.options.zoomWindowBgColour) + ';' + + 'width: ' + String(self.options.zoomWindowWidth) + 'px;' + + 'height: ' + String(self.options.zoomWindowHeight) + 'px;' + + 'float: left;' + + 'background-size: ' + self.largeWidth / self.currentZoomLevel + 'px ' + self.largeHeight / self.currentZoomLevel + 'px;' + + 'display: none;z-index:100;' + + 'border: ' + String(self.options.borderSize) + 'px solid ' + self.options.borderColour + ';' + + 'background-repeat: no-repeat;' + + 'position: absolute;'; + } + + //if window zoom + if (self.options.zoomType === 'window') { + self.zoomWindowStyle = getWindowZoomStyle(); + } + + function getInnerZoomStyle() { + //has a border been put on the image? Lets cater for this + var borderWidth = self.$elem.css('border-left-width'); + + return 'overflow: hidden;' + + 'margin-left: ' + String(borderWidth) + ';' + + 'margin-top: ' + String(borderWidth) + ';' + + 'background-position: 0px 0px;' + + 'width: ' + String(self.nzWidth) + 'px;' + + 'height: ' + String(self.nzHeight) + 'px;' + + 'float: left;' + + 'display: none;' + + 'cursor:' + (self.options.cursor) + ';' + + 'px solid ' + self.options.borderColour + ';' + + 'background-repeat: no-repeat;' + + 'position: absolute;'; + } + + //if inner zoom + if (self.options.zoomType === 'inner') { + self.zoomWindowStyle = getInnerZoomStyle(); + } + + function getWindowLensStyle() { + var lensHeight, lensWidth; + // adjust images less than the window height + + if (self.nzHeight < self.options.zoomWindowHeight / self.heightRatio) { + lensHeight = self.nzHeight; + } + else { + lensHeight = String(self.options.zoomWindowHeight / self.heightRatio); + } + if (self.largeWidth < self.options.zoomWindowWidth) { + lensWidth = self.nzWidth; + } + else { + lensWidth = String(self.options.zoomWindowWidth / self.widthRatio); + } + + return 'background-position: 0px 0px;width: ' + String((self.options.zoomWindowWidth) / self.widthRatio) + 'px;' + + 'height: ' + String((self.options.zoomWindowHeight) / self.heightRatio) + + 'px;float: right;display: none;' + + 'overflow: hidden;' + + 'z-index: 999;' + + 'opacity:' + (self.options.lensOpacity) + ';filter: alpha(opacity = ' + (self.options.lensOpacity * 100) + '); zoom:1;' + + 'width:' + lensWidth + 'px;' + + 'height:' + lensHeight + 'px;' + + 'background-color:' + (self.options.lensColour) + ';' + + 'cursor:' + (self.options.cursor) + ';' + + 'border: ' + (self.options.lensBorderSize) + 'px' + + ' solid ' + (self.options.lensBorderColour) + ';background-repeat: no-repeat;position: absolute;'; + } + + //lens style for window zoom + if (self.options.zoomType === 'window') { + self.lensStyle = getWindowLensStyle(); + } + + //tint style + self.tintStyle = 'display: block;' + + 'position: absolute;' + + 'background-color: ' + self.options.tintColour + ';' + + 'filter:alpha(opacity=0);' + + 'opacity: 0;' + + 'width: ' + self.nzWidth + 'px;' + + 'height: ' + self.nzHeight + 'px;'; + + //lens style for lens zoom with optional round for modern browsers + self.lensRound = ''; + + if (self.options.zoomType === 'lens') { + self.lensStyle = 'background-position: 0px 0px;' + + 'float: left;display: none;' + + 'border: ' + String(self.options.borderSize) + 'px solid ' + self.options.borderColour + ';' + + 'width:' + String(self.options.lensSize) + 'px;' + + 'height:' + String(self.options.lensSize) + 'px;' + + 'background-repeat: no-repeat;position: absolute;'; + } + + //does not round in all browsers + if (self.options.lensShape === 'round') { + self.lensRound = 'border-top-left-radius: ' + String(self.options.lensSize / 2 + self.options.borderSize) + 'px;' + + 'border-top-right-radius: ' + String(self.options.lensSize / 2 + self.options.borderSize) + 'px;' + + 'border-bottom-left-radius: ' + String(self.options.lensSize / 2 + self.options.borderSize) + 'px;' + + 'border-bottom-right-radius: ' + String(self.options.lensSize / 2 + self.options.borderSize) + 'px;'; + } + + //create the div's + "" + //self.zoomContainer = $('
').addClass('zoomContainer').css({"position":"relative", "height":self.nzHeight, "width":self.nzWidth}); + + self.zoomContainer = + $('
'); + $(self.options.zoomContainerAppendTo).append(self.zoomContainer); + + //this will add overflow hidden and contrain the lens on lens mode + if (self.options.containLensZoom && self.options.zoomType === 'lens') { + self.zoomContainer.css('overflow', 'hidden'); + } + if (self.options.zoomType !== 'inner') { + self.zoomLens = $('
 
') + .appendTo(self.zoomContainer) + .click(function () { + self.$elem.trigger('click'); + }); + + if (self.options.tint) { + self.tintContainer = $('
').addClass('tintContainer'); + self.zoomTint = $('
'); + + self.zoomLens.wrap(self.tintContainer); + + self.zoomTintcss = self.zoomLens.after(self.zoomTint); + + //if tint enabled - set an image to show over the tint + + self.zoomTintImage = $('') + .appendTo(self.zoomLens) + .click(function () { + + self.$elem.trigger('click'); + }); + } + } + + var targetZoomContainer = isNaN(self.options.zoomWindowPosition) ? 'body' : self.zoomContainer; + //create zoom window + self.zoomWindow = $('
 
') + .appendTo(targetZoomContainer).click(function () { + self.$elem.trigger('click'); + }); + self.zoomWindowContainer = $('
').addClass('zoomWindowContainer').css('width', self.options.zoomWindowWidth); + self.zoomWindow.wrap(self.zoomWindowContainer); + + // self.captionStyle = "text-align: left;background-color: black;'+ + // 'color: white;font-weight: bold;padding: 10px;font-family: sans-serif;font-size: 11px"; + // self.zoomCaption = $('
INSERT ALT TAG
').appendTo(self.zoomWindow.parent()); + + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-image', 'url("' + self.imageSrc + '")'); + } + if (self.options.zoomType === 'window') { + self.zoomWindow.css('background-image', 'url("' + self.imageSrc + '")'); + } + if (self.options.zoomType === 'inner') { + self.zoomWindow.css('background-image', 'url("' + self.imageSrc + '")'); + } + + /*-------------------END THE ZOOM WINDOW AND LENS----------------------------------*/ + if (self.options.touchEnabled) { + //touch events + self.$elem.bind('touchmove', function (e) { + e.preventDefault(); + var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; + self.setPosition(touch); + }); + self.zoomContainer.bind('touchmove', function (e) { + if (self.options.zoomType === 'inner') { + self.showHideWindow('show'); + + } + e.preventDefault(); + var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; + self.setPosition(touch); + + }); + self.zoomContainer.bind('touchend', function (e) { + self.showHideWindow('hide'); + if (self.options.showLens) { + self.showHideLens('hide'); + } + if (self.options.tint && self.options.zoomType !== 'inner') { + self.showHideTint('hide'); + } + }); + + self.$elem.bind('touchend', function (e) { + self.showHideWindow('hide'); + if (self.options.showLens) { + self.showHideLens('hide'); + } + if (self.options.tint && self.options.zoomType !== 'inner') { + self.showHideTint('hide'); + } + }); + if (self.options.showLens) { + self.zoomLens.bind('touchmove', function (e) { + + e.preventDefault(); + var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; + self.setPosition(touch); + }); + + self.zoomLens.bind('touchend', function (e) { + self.showHideWindow('hide'); + if (self.options.showLens) { + self.showHideLens('hide'); + } + if (self.options.tint && self.options.zoomType !== 'inner') { + self.showHideTint('hide'); + } + }); + } + } + //Needed to work in IE + self.$elem.bind('mousemove', function (e) { + if (self.overWindow === false) { + self.setElements('show'); + } + //make sure on orientation change the setposition is not fired + if (self.lastX !== e.clientX || self.lastY !== e.clientY) { + self.setPosition(e); + self.currentLoc = e; + } + self.lastX = e.clientX; + self.lastY = e.clientY; + + }); + + self.zoomContainer.bind('click', self.options.onImageClick); + + self.zoomContainer.bind('mousemove', function (e) { + if (self.overWindow === false) { + self.setElements('show'); + } + mouseMoveZoomHandler(e); + }); + + function mouseMoveZoomHandler(e) { + //self.overWindow = true; + //make sure on orientation change the setposition is not fired + if (self.lastX !== e.clientX || self.lastY !== e.clientY) { + self.setPosition(e); + self.currentLoc = e; + } + self.lastX = e.clientX; + self.lastY = e.clientY; + } + + var elementToTrack = null; + if (self.options.zoomType !== 'inner') { + elementToTrack = self.zoomLens; + } + if (self.options.tint && self.options.zoomType !== 'inner') { + elementToTrack = self.zoomTint; + } + if (self.options.zoomType === 'inner') { + elementToTrack = self.zoomWindow; + } + + //register the mouse tracking + if (elementToTrack) { + elementToTrack.bind('mousemove', mouseMoveZoomHandler); + } + + // lensFadeOut: 500, zoomTintFadeIn + self.zoomContainer.add(self.$elem).mouseenter(function () { + if (self.overWindow === false) { + self.setElements('show'); + } + }).mouseleave(function () { + if (!self.scrollLock) { + self.setElements('hide'); + self.options.onDestroy(self.$elem); + } + }); + //end ove image + + if (self.options.zoomType !== 'inner') { + self.zoomWindow.mouseenter(function () { + self.overWindow = true; + self.setElements('hide'); + }).mouseleave(function () { + self.overWindow = false; + }); + } + //end ove image + + // var delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail); + + // $(this).empty(); + // return false; + + //fix for initial zoom setting + //if (self.options.zoomLevel !== 1) { + // self.changeZoomLevel(self.currentZoomLevel); + //} + //set the min zoomlevel + if (self.options.minZoomLevel) { + self.minZoomLevel = self.options.minZoomLevel; + } + else { + self.minZoomLevel = self.options.scrollZoomIncrement * 2; + } + + if (self.options.scrollZoom) { + self.zoomContainer.add(self.$elem).bind('wheel DOMMouseScroll MozMousePixelScroll', function (e) { + // in IE there is issue with firing of mouseleave - So check whether still scrolling + // and on mouseleave check if scrolllock + self.scrollLock = true; + clearTimeout($.data(this, 'timer')); + $.data(this, 'timer', setTimeout(function () { + self.scrollLock = false; + //do something + }, 250)); + + var theEvent = e.originalEvent.deltaY || e.originalEvent.detail * -1; + + //this.scrollTop += ( delta < 0 ? 1 : -1 ) * 30; + // e.preventDefault(); + + e.stopImmediatePropagation(); + e.stopPropagation(); + e.preventDefault(); + + if (theEvent / 120 > 0) { + //scrolling up + if (self.currentZoomLevel >= self.minZoomLevel) { + self.changeZoomLevel(self.currentZoomLevel - self.options.scrollZoomIncrement); + } + } + else { + //scrolling down + + //Check if it has to maintain original zoom window aspect ratio or not + if ((!self.fullheight && !self.fullwidth) || !self.options.mantainZoomAspectRatio) { + if (self.options.maxZoomLevel) { + if (self.currentZoomLevel <= self.options.maxZoomLevel) { + self.changeZoomLevel(parseFloat(self.currentZoomLevel) + self.options.scrollZoomIncrement); + } + } + else { + //andy + self.changeZoomLevel(parseFloat(self.currentZoomLevel) + self.options.scrollZoomIncrement); + } + } + } + return false; + }); + } + }, + setElements: function (type) { + var self = this; + if (!self.options.zoomEnabled) { + return false; + } + if (type === 'show') { + if (self.isWindowSet) { + if (self.options.zoomType === 'inner') { + self.showHideWindow('show'); + } + if (self.options.zoomType === 'window') { + self.showHideWindow('show'); + } + if (self.options.showLens) { + self.showHideLens('show'); + } + if (self.options.tint && self.options.zoomType !== 'inner') { + self.showHideTint('show'); + } + } + } + + if (type === 'hide') { + if (self.options.zoomType === 'window') { + self.showHideWindow('hide'); + } + if (!self.options.tint) { + self.showHideWindow('hide'); + } + if (self.options.showLens) { + self.showHideLens('hide'); + } + if (self.options.tint) { + self.showHideTint('hide'); + } + } + }, + setPosition: function (e) { + + var self = this; + + if (!self.options.zoomEnabled) { + return false; + } + + //recaclc offset each time in case the image moves + //this can be caused by other on page elements + self.nzHeight = self.$elem.height(); + self.nzWidth = self.$elem.width(); + self.nzOffset = self.$elem.offset(); + + if (self.options.tint && self.options.zoomType !== 'inner') { + self.zoomTint.css({ + top: 0, + left: 0 + }); + } + //set responsive + //will checking if the image needs changing before running this code work faster? + if (self.options.responsive && !self.options.scrollZoom) { + if (self.options.showLens) { + var lensHeight, lensWidth; + if (self.nzHeight < self.options.zoomWindowWidth / self.widthRatio) { + lensHeight = self.nzHeight; + } + else { + lensHeight = String((self.options.zoomWindowHeight / self.heightRatio)); + } + if (self.largeWidth < self.options.zoomWindowWidth) { + lensWidth = self.nzWidth; + } + else { + lensWidth = (self.options.zoomWindowWidth / self.widthRatio); + } + self.widthRatio = self.largeWidth / self.nzWidth; + self.heightRatio = self.largeHeight / self.nzHeight; + if (self.options.zoomType !== 'lens') { + //possibly dont need to keep recalcalculating + //if the lens is heigher than the image, then set lens size to image size + if (self.nzHeight < self.options.zoomWindowWidth / self.widthRatio) { + lensHeight = self.nzHeight; + + } + else { + lensHeight = String((self.options.zoomWindowHeight / self.heightRatio)); + } + + if (self.nzWidth < self.options.zoomWindowHeight / self.heightRatio) { + lensWidth = self.nzWidth; + } + else { + lensWidth = String((self.options.zoomWindowWidth / self.widthRatio)); + } + + self.zoomLens.css({ + 'width': lensWidth, + 'height': lensHeight + }); + + if (self.options.tint) { + self.zoomTintImage.css({ + 'width': self.nzWidth, + 'height': self.nzHeight + }); + } + + } + if (self.options.zoomType === 'lens') { + self.zoomLens.css({ + width: String(self.options.lensSize) + 'px', + height: String(self.options.lensSize) + 'px' + }); + } + //end responsive image change + } + } + + //container fix + self.zoomContainer.css({ + top: self.nzOffset.top, + left: self.nzOffset.left + }); + self.mouseLeft = parseInt(e.pageX - self.nzOffset.left); + self.mouseTop = parseInt(e.pageY - self.nzOffset.top); + //calculate the Location of the Lens + + //calculate the bound regions - but only if zoom window + if (self.options.zoomType === 'window') { + var zoomLensHeight = self.zoomLens.height() / 2; + var zoomLensWidth = self.zoomLens.width() / 2; + self.Etoppos = (self.mouseTop < 0 + zoomLensHeight); + self.Eboppos = (self.mouseTop > self.nzHeight - zoomLensHeight - (self.options.lensBorderSize * 2)); + self.Eloppos = (self.mouseLeft < 0 + zoomLensWidth); + self.Eroppos = (self.mouseLeft > (self.nzWidth - zoomLensWidth - (self.options.lensBorderSize * 2))); + } + //calculate the bound regions - but only for inner zoom + if (self.options.zoomType === 'inner') { + self.Etoppos = (self.mouseTop < ((self.nzHeight / 2) / self.heightRatio)); + self.Eboppos = (self.mouseTop > (self.nzHeight - ((self.nzHeight / 2) / self.heightRatio))); + self.Eloppos = (self.mouseLeft < 0 + (((self.nzWidth / 2) / self.widthRatio))); + self.Eroppos = (self.mouseLeft > (self.nzWidth - (self.nzWidth / 2) / self.widthRatio - (self.options.lensBorderSize * 2))); + } + + // if the mouse position of the slider is one of the outerbounds, then hide window and lens + if (self.mouseLeft < 0 || self.mouseTop < 0 || self.mouseLeft > self.nzWidth || self.mouseTop > self.nzHeight) { + self.setElements('hide'); + return; + } + //else continue with operations + else { + //lens options + if (self.options.showLens) { + // self.showHideLens('show'); + //set background position of lens + self.lensLeftPos = String(Math.floor(self.mouseLeft - self.zoomLens.width() / 2)); + self.lensTopPos = String(Math.floor(self.mouseTop - self.zoomLens.height() / 2)); + } + //adjust the background position if the mouse is in one of the outer regions + + //Top region + if (self.Etoppos) { + self.lensTopPos = 0; + } + //Left Region + if (self.Eloppos) { + self.windowLeftPos = 0; + self.lensLeftPos = 0; + self.tintpos = 0; + } + //Set bottom and right region for window mode + if (self.options.zoomType === 'window') { + if (self.Eboppos) { + self.lensTopPos = Math.max((self.nzHeight) - self.zoomLens.height() - (self.options.lensBorderSize * 2), 0); + } + if (self.Eroppos) { + self.lensLeftPos = (self.nzWidth - (self.zoomLens.width()) - (self.options.lensBorderSize * 2)); + } + } + //Set bottom and right region for inner mode + if (self.options.zoomType === 'inner') { + if (self.Eboppos) { + self.lensTopPos = Math.max(((self.nzHeight) - (self.options.lensBorderSize * 2)), 0); + } + if (self.Eroppos) { + self.lensLeftPos = (self.nzWidth - (self.nzWidth) - (self.options.lensBorderSize * 2)); + } + } + //if lens zoom + if (self.options.zoomType === 'lens') { + + self.windowLeftPos = String(((e.pageX - self.nzOffset.left) * self.widthRatio - self.zoomLens.width() / 2) * (-1)); + self.windowTopPos = String(((e.pageY - self.nzOffset.top) * self.heightRatio - self.zoomLens.height() / 2) * (-1)); + self.zoomLens.css('background-position', self.windowLeftPos + 'px ' + self.windowTopPos + 'px'); + + if (self.changeBgSize) { + if (self.nzHeight > self.nzWidth) { + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + + self.zoomWindow.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + else { + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + self.zoomWindow.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + self.changeBgSize = false; + } + + self.setWindowPosition(e); + } + //if tint zoom + if (self.options.tint && self.options.zoomType !== 'inner') { + self.setTintPosition(e); + } + //set the css background position + if (self.options.zoomType === 'window') { + self.setWindowPosition(e); + } + if (self.options.zoomType === 'inner') { + self.setWindowPosition(e); + } + if (self.options.showLens) { + if (self.fullwidth && self.options.zoomType !== 'lens') { + self.lensLeftPos = 0; + } + self.zoomLens.css({ + left: self.lensLeftPos + 'px', + top: self.lensTopPos + 'px' + }); + } + + } //end else + }, + showHideZoomContainer: function (change) { + var self = this; + if (change === 'show') { + if (self.zoomContainer) { + self.zoomContainer.show(); + } + } + if (change === 'hide') { + if (self.zoomContainer) { + self.zoomContainer.hide(); + } + } + }, + showHideWindow: function (change) { + var self = this; + if (change === 'show') { + if (!self.isWindowActive && self.zoomWindow) { + self.options.onShow(self); + if (self.options.zoomWindowFadeIn) { + self.zoomWindow.stop(true, true, false).fadeIn(self.options.zoomWindowFadeIn); + } + else { + self.zoomWindow.show(); + } + self.isWindowActive = true; + } + } + if (change === 'hide') { + if (self.isWindowActive) { + if (self.options.zoomWindowFadeOut) { + self.zoomWindow.stop(true, true).fadeOut(self.options.zoomWindowFadeOut, function () { + if (self.loop) { + //stop moving the zoom window when zoom window is faded out + clearInterval(self.loop); + self.loop = false; + } + }); + } + else { + self.zoomWindow.hide(); + } + self.isWindowActive = false; + } + } + }, + showHideLens: function (change) { + var self = this; + if (change === 'show') { + if (!self.isLensActive) { + if (self.options.lensFadeIn && self.zoomLens) { + self.zoomLens.stop(true, true, false).fadeIn(self.options.lensFadeIn); + } + else { + self.zoomLens.show(); + } + self.isLensActive = true; + } + } + if (change === 'hide') { + if (self.isLensActive) { + if (self.options.lensFadeOut) { + self.zoomLens.stop(true, true).fadeOut(self.options.lensFadeOut); + } + else { + self.zoomLens.hide(); + } + self.isLensActive = false; + } + } + }, + showHideTint: function (change) { + var self = this; + if (change === 'show') { + if (!self.isTintActive && self.zoomTint) { + + if (self.options.zoomTintFadeIn) { + self.zoomTint.css('opacity', self.options.tintOpacity).animate().stop(true, true).fadeIn('slow'); + } + else { + self.zoomTint.css('opacity', self.options.tintOpacity).animate(); + self.zoomTint.show(); + } + self.isTintActive = true; + } + } + if (change === 'hide') { + if (self.isTintActive) { + + if (self.options.zoomTintFadeOut) { + self.zoomTint.stop(true, true).fadeOut(self.options.zoomTintFadeOut); + } + else { + self.zoomTint.hide(); + } + self.isTintActive = false; + } + } + }, + + setLensPosition: function (e) { + }, + + setWindowPosition: function (e) { + //return obj.slice( 0, count ); + var self = this; + + if (!isNaN(self.options.zoomWindowPosition)) { + + switch (self.options.zoomWindowPosition) { + case 1: //done + self.windowOffsetTop = (self.options.zoomWindowOffsetY);//DONE - 1 + self.windowOffsetLeft = (+self.nzWidth); //DONE 1, 2, 3, 4, 16 + break; + case 2: + if (self.options.zoomWindowHeight > self.nzHeight) { //positive margin + + self.windowOffsetTop = ((self.options.zoomWindowHeight / 2) - (self.nzHeight / 2)) * (-1); + self.windowOffsetLeft = (self.nzWidth); //DONE 1, 2, 3, 4, 16 + } + else { //negative margin + $.noop(); + } + break; + case 3: //done + self.windowOffsetTop = (self.nzHeight - self.zoomWindow.height() - (self.options.borderSize * 2)); //DONE 3,9 + self.windowOffsetLeft = (self.nzWidth); //DONE 1, 2, 3, 4, 16 + break; + case 4: //done + self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 + self.windowOffsetLeft = (self.nzWidth); //DONE 1, 2, 3, 4, 16 + break; + case 5: //done + self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 + self.windowOffsetLeft = (self.nzWidth - self.zoomWindow.width() - (self.options.borderSize * 2)); //DONE - 5,15 + break; + case 6: + if (self.options.zoomWindowHeight > self.nzHeight) { //positive margin + self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 + + self.windowOffsetLeft = ((self.options.zoomWindowWidth / 2) - (self.nzWidth / 2) + (self.options.borderSize * 2)) * (-1); + } + else { //negative margin + $.noop(); + } + + break; + case 7: //done + self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 + self.windowOffsetLeft = 0; //DONE 7, 13 + break; + case 8: //done + self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 + self.windowOffsetLeft = (self.zoomWindow.width() + (self.options.borderSize * 2)) * (-1); //DONE 8,9,10,11,12 + break; + case 9: //done + self.windowOffsetTop = (self.nzHeight - self.zoomWindow.height() - (self.options.borderSize * 2)); //DONE 3,9 + self.windowOffsetLeft = (self.zoomWindow.width() + (self.options.borderSize * 2)) * (-1); //DONE 8,9,10,11,12 + break; + case 10: + if (self.options.zoomWindowHeight > self.nzHeight) { //positive margin + + self.windowOffsetTop = ((self.options.zoomWindowHeight / 2) - (self.nzHeight / 2)) * (-1); + self.windowOffsetLeft = (self.zoomWindow.width() + (self.options.borderSize * 2)) * (-1); //DONE 8,9,10,11,12 + } + else { //negative margin + $.noop(); + } + break; + case 11: + self.windowOffsetTop = (self.options.zoomWindowOffsetY); + self.windowOffsetLeft = (self.zoomWindow.width() + (self.options.borderSize * 2)) * (-1); //DONE 8,9,10,11,12 + break; + case 12: //done + self.windowOffsetTop = (self.zoomWindow.height() + (self.options.borderSize * 2)) * (-1); //DONE 12,13,14,15,16 + self.windowOffsetLeft = (self.zoomWindow.width() + (self.options.borderSize * 2)) * (-1); //DONE 8,9,10,11,12 + break; + case 13: //done + self.windowOffsetTop = (self.zoomWindow.height() + (self.options.borderSize * 2)) * (-1); //DONE 12,13,14,15,16 + self.windowOffsetLeft = (0); //DONE 7, 13 + break; + case 14: + if (self.options.zoomWindowHeight > self.nzHeight) { //positive margin + self.windowOffsetTop = (self.zoomWindow.height() + (self.options.borderSize * 2)) * (-1); //DONE 12,13,14,15,16 + + self.windowOffsetLeft = ((self.options.zoomWindowWidth / 2) - (self.nzWidth / 2) + (self.options.borderSize * 2)) * (-1); + } + else { //negative margin + $.noop(); + } + break; + case 15://done + self.windowOffsetTop = (self.zoomWindow.height() + (self.options.borderSize * 2)) * (-1); //DONE 12,13,14,15,16 + self.windowOffsetLeft = (self.nzWidth - self.zoomWindow.width() - (self.options.borderSize * 2)); //DONE - 5,15 + break; + case 16: //done + self.windowOffsetTop = (self.zoomWindow.height() + (self.options.borderSize * 2)) * (-1); //DONE 12,13,14,15,16 + self.windowOffsetLeft = (self.nzWidth); //DONE 1, 2, 3, 4, 16 + break; + default: //done + self.windowOffsetTop = (self.options.zoomWindowOffsetY);//DONE - 1 + self.windowOffsetLeft = (self.nzWidth); //DONE 1, 2, 3, 4, 16 + } + } //end isNAN + else { + //WE CAN POSITION IN A CLASS - ASSUME THAT ANY STRING PASSED IS + self.externalContainer = $('#' + self.options.zoomWindowPosition); + self.externalContainerWidth = self.externalContainer.width(); + self.externalContainerHeight = self.externalContainer.height(); + self.externalContainerOffset = self.externalContainer.offset(); + + self.windowOffsetTop = self.externalContainerOffset.top;//DONE - 1 + self.windowOffsetLeft = self.externalContainerOffset.left; //DONE 1, 2, 3, 4, 16 + + } + self.isWindowSet = true; + self.windowOffsetTop = self.windowOffsetTop + self.options.zoomWindowOffsetY; + self.windowOffsetLeft = self.windowOffsetLeft + self.options.zoomWindowOffsetX; + + self.zoomWindow.css({ + top: self.windowOffsetTop, + left: self.windowOffsetLeft + }); + + if (self.options.zoomType === 'inner') { + self.zoomWindow.css({ + top: 0, + left: 0 + }); + + } + + self.windowLeftPos = String(((e.pageX - self.nzOffset.left) * self.widthRatio - self.zoomWindow.width() / 2) * (-1)); + self.windowTopPos = String(((e.pageY - self.nzOffset.top) * self.heightRatio - self.zoomWindow.height() / 2) * (-1)); + if (self.Etoppos) { + self.windowTopPos = 0; + } + if (self.Eloppos) { + self.windowLeftPos = 0; + } + if (self.Eboppos) { + self.windowTopPos = (self.largeHeight / self.currentZoomLevel - self.zoomWindow.height()) * (-1); + } + if (self.Eroppos) { + self.windowLeftPos = ((self.largeWidth / self.currentZoomLevel - self.zoomWindow.width()) * (-1)); + } + + //stops micro movements + if (self.fullheight) { + self.windowTopPos = 0; + } + if (self.fullwidth) { + self.windowLeftPos = 0; + } + + //set the css background position + if (self.options.zoomType === 'window' || self.options.zoomType === 'inner') { + + if (self.zoomLock === 1) { + //overrides for images not zoomable + if (self.widthRatio <= 1) { + self.windowLeftPos = 0; + } + if (self.heightRatio <= 1) { + self.windowTopPos = 0; + } + } + // adjust images less than the window height + + if (self.options.zoomType === 'window') { + if (self.largeHeight < self.options.zoomWindowHeight) { + self.windowTopPos = 0; + } + if (self.largeWidth < self.options.zoomWindowWidth) { + self.windowLeftPos = 0; + } + } + //set the zoomwindow background position + if (self.options.easing) { + + // if(self.changeZoom){ + // clearInterval(self.loop); + // self.changeZoom = false; + // self.loop = false; + + // } + //set the pos to 0 if not set + if (!self.xp) { + self.xp = 0; + } + if (!self.yp) { + self.yp = 0; + } + //if loop not already started, then run it + if (!self.loop) { + self.loop = setInterval(function () { + //using zeno's paradox + + self.xp += (self.windowLeftPos - self.xp) / self.options.easingAmount; + self.yp += (self.windowTopPos - self.yp) / self.options.easingAmount; + if (self.scrollingLock) { + + clearInterval(self.loop); + self.xp = self.windowLeftPos; + self.yp = self.windowTopPos; + + self.xp = ((e.pageX - self.nzOffset.left) * self.widthRatio - self.zoomWindow.width() / 2) * (-1); + self.yp = (((e.pageY - self.nzOffset.top) * self.heightRatio - self.zoomWindow.height() / 2) * (-1)); + + if (self.changeBgSize) { + if (self.nzHeight > self.nzWidth) { + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + self.zoomWindow.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + else { + if (self.options.zoomType !== 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + self.zoomWindow.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + + /* + if(!self.bgxp){self.bgxp = self.largeWidth/self.newvalue;} + if(!self.bgyp){self.bgyp = self.largeHeight/self.newvalue ;} + if (!self.bgloop){ + self.bgloop = setInterval(function(){ + + self.bgxp += (self.largeWidth/self.newvalue - self.bgxp) / self.options.easingAmount; + self.bgyp += (self.largeHeight/self.newvalue - self.bgyp) / self.options.easingAmount; + + self.zoomWindow.css('background-size', self.bgxp + 'px ' + self.bgyp + 'px' ); + + + }, 16); + + } + */ + self.changeBgSize = false; + } + + self.zoomWindow.css('background-position', self.windowLeftPos + 'px ' + self.windowTopPos + 'px'); + self.scrollingLock = false; + self.loop = false; + + } + else if (Math.round(Math.abs(self.xp - self.windowLeftPos) + Math.abs(self.yp - self.windowTopPos)) < 1) { + //stops micro movements + clearInterval(self.loop); + self.zoomWindow.css('background-position', self.windowLeftPos + 'px ' + self.windowTopPos + 'px'); + self.loop = false; + } + else { + if (self.changeBgSize) { + if (self.nzHeight > self.nzWidth) { + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + self.zoomWindow.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + else { + if (self.options.zoomType !== 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + self.zoomWindow.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + self.changeBgSize = false; + } + + self.zoomWindow.css('background-position', self.xp + 'px ' + self.yp + 'px'); + } + }, 16); + } + } + else { + if (self.changeBgSize) { + if (self.nzHeight > self.nzWidth) { + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + + self.zoomWindow.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + else { + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + if ((self.largeHeight / self.newvaluewidth) < self.options.zoomWindowHeight) { + + self.zoomWindow.css('background-size', + self.largeWidth / self.newvaluewidth + 'px ' + + self.largeHeight / self.newvaluewidth + 'px'); + } + else { + + self.zoomWindow.css('background-size', + self.largeWidth / self.newvalueheight + 'px ' + + self.largeHeight / self.newvalueheight + 'px'); + } + + } + self.changeBgSize = false; + } + + self.zoomWindow.css('background-position', + self.windowLeftPos + 'px ' + + self.windowTopPos + 'px'); + } + } + }, + + setTintPosition: function (e) { + var self = this; + var zoomLensWidth = self.zoomLens.width(); + var zoomLensHeight = self.zoomLens.height(); + self.nzOffset = self.$elem.offset(); + self.tintpos = String(((e.pageX - self.nzOffset.left) - (zoomLensWidth / 2)) * (-1)); + self.tintposy = String(((e.pageY - self.nzOffset.top) - zoomLensHeight / 2) * (-1)); + if (self.Etoppos) { + self.tintposy = 0; + } + if (self.Eloppos) { + self.tintpos = 0; + } + if (self.Eboppos) { + self.tintposy = (self.nzHeight - zoomLensHeight - (self.options.lensBorderSize * 2)) * (-1); + } + if (self.Eroppos) { + self.tintpos = ((self.nzWidth - zoomLensWidth - (self.options.lensBorderSize * 2)) * (-1)); + } + if (self.options.tint) { + //stops micro movements + if (self.fullheight) { + self.tintposy = 0; + + } + if (self.fullwidth) { + self.tintpos = 0; + + } + self.zoomTintImage.css({ + 'left': self.tintpos + 'px', + 'top': self.tintposy + 'px' + }); + } + }, + + swaptheimage: function (smallimage, largeimage) { + var self = this; + var newImg = new Image(); + + if (self.options.loadingIcon) { + self.spinner = $('
'); + self.$elem.after(self.spinner); + } + + self.options.onImageSwap(self.$elem); + + newImg.onload = function () { + self.largeWidth = newImg.width; + self.largeHeight = newImg.height; + self.zoomImage = largeimage; + self.zoomWindow.css('background-size', self.largeWidth + 'px ' + self.largeHeight + 'px'); + + self.swapAction(smallimage, largeimage); + return; + }; + self.setImageSource(newImg, largeimage); // this must be done AFTER setting onload + }, + + swapAction: function (smallimage, largeimage) { + var self = this; + var elemWidth = self.$elem.width(); + var elemHeight = self.$elem.height(); + var newImg2 = new Image(); + newImg2.onload = function () { + //re-calculate values + self.nzHeight = newImg2.height; + self.nzWidth = newImg2.width; + self.options.onImageSwapComplete(self.$elem); + + self.doneCallback(); + return; + }; + self.setImageSource(newImg2, smallimage); + + //reset the zoomlevel to that initially set in options + self.currentZoomLevel = self.options.zoomLevel; + self.options.maxZoomLevel = false; + + //swaps the main image + //self.$elem.attr('src',smallimage); + //swaps the zoom image + if (self.options.zoomType === 'lens') { + self.zoomLens.css('background-image', 'url("' + largeimage + '")'); + } + if (self.options.zoomType === 'window') { + self.zoomWindow.css('background-image', 'url("' + largeimage + '")'); + } + if (self.options.zoomType === 'inner') { + self.zoomWindow.css('background-image', 'url("' + largeimage + '")'); + } + + self.currentImage = largeimage; + + if (self.options.imageCrossfade) { + var oldImg = self.$elem; + var newImg = oldImg.clone(); + self.$elem.attr('src', smallimage); + self.$elem.after(newImg); + newImg.stop(true).fadeOut(self.options.imageCrossfade, function () { + $(this).remove(); + }); + + // if(self.options.zoomType === 'inner'){ + //remove any attributes on the cloned image so we can resize later + self.$elem.width('auto').removeAttr('width'); + self.$elem.height('auto').removeAttr('height'); + // } + + oldImg.fadeIn(self.options.imageCrossfade); + + if (self.options.tint && self.options.zoomType !== 'inner') { + + var oldImgTint = self.zoomTintImage; + var newImgTint = oldImgTint.clone(); + self.zoomTintImage.attr('src', largeimage); + self.zoomTintImage.after(newImgTint); + newImgTint.stop(true).fadeOut(self.options.imageCrossfade, function () { + $(this).remove(); + }); + + oldImgTint.fadeIn(self.options.imageCrossfade); + + //self.zoomTintImage.attr('width',elem.data('image')); + + //resize the tint window + self.zoomTint.css({ + height: elemHeight, + width: elemWidth + }); + } + + self.zoomContainer.css({ + 'height': elemHeight, + 'width': elemWidth + }); + + if (self.options.zoomType === 'inner') { + if (!self.options.constrainType) { + self.zoomWrap.parent().css({ + 'height': elemHeight, + 'width': elemWidth + }); + + self.zoomWindow.css({ + 'height': elemHeight, + 'width': elemWidth + }); + } + } + + if (self.options.imageCrossfade) { + self.zoomWrap.css({ + 'height': elemHeight, + 'width': elemWidth + }); + } + } + else { + self.$elem.attr('src', smallimage); + if (self.options.tint) { + self.zoomTintImage.attr('src', largeimage); + //self.zoomTintImage.attr('width',elem.data('image')); + self.zoomTintImage.attr('height', elemHeight); + //self.zoomTintImage.attr('src') = elem.data('image'); + self.zoomTintImage.css('height', elemHeight); + self.zoomTint.css('height', elemHeight); + + } + self.zoomContainer.css({ + 'height': elemHeight, + 'width': elemWidth + }); + + if (self.options.imageCrossfade) { + self.zoomWrap.css({ + 'height': elemHeight, + 'width': elemWidth + }); + } + } + if (self.options.constrainType) { + + //This will contrain the image proportions + if (self.options.constrainType === 'height') { + + var autoWDimension = { + 'height': self.options.constrainSize, + 'width': 'auto' + }; + self.zoomContainer.css(autoWDimension); + + if (self.options.imageCrossfade) { + self.zoomWrap.css(autoWDimension); + self.constwidth = self.zoomWrap.width(); + } + else { + self.$elem.css(autoWDimension); + self.constwidth = elemWidth; + } + + var constWDim = { + 'height': self.options.constrainSize, + 'width': self.constwidth + }; + if (self.options.zoomType === 'inner') { + + self.zoomWrap.parent().css(constWDim); + self.zoomWindow.css(constWDim); + } + if (self.options.tint) { + self.tintContainer.css(constWDim); + self.zoomTint.css(constWDim); + self.zoomTintImage.css(constWDim); + } + + } + if (self.options.constrainType === 'width') { + var autoHDimension = { + 'height': 'auto', + 'width': self.options.constrainSize + }; + self.zoomContainer.css(autoHDimension); + + if (self.options.imageCrossfade) { + self.zoomWrap.css(autoHDimension); + self.constheight = self.zoomWrap.height(); + } + else { + self.$elem.css(autoHDimension); + self.constheight = elemHeight; + } + + var constHDim = { + 'height': self.constheight, + 'width': self.options.constrainSize + }; + if (self.options.zoomType === 'inner') { + self.zoomWrap.parent().css(constHDim); + self.zoomWindow.css(constHDim); + } + if (self.options.tint) { + self.tintContainer.css(constHDim); + self.zoomTint.css(constHDim); + self.zoomTintImage.css(constHDim); + } + } + } + }, + + doneCallback: function () { + var self = this; + if (self.options.loadingIcon) { + self.spinner.hide(); + } + + self.nzOffset = self.$elem.offset(); + self.nzWidth = self.$elem.width(); + self.nzHeight = self.$elem.height(); + + // reset the zoomlevel back to default + self.currentZoomLevel = self.options.zoomLevel; + + //ratio of the large to small image + self.widthRatio = self.largeWidth / self.nzWidth; + self.heightRatio = self.largeHeight / self.nzHeight; + + //NEED TO ADD THE LENS SIZE FOR ROUND + // adjust images less than the window height + if (self.options.zoomType === 'window') { + var lensHeight, lensWidth; + + if (self.nzHeight < self.options.zoomWindowHeight / self.heightRatio) { + lensHeight = self.nzHeight; + + } + else { + lensHeight = String((self.options.zoomWindowHeight / self.heightRatio)); + } + + if (self.nzWidth < self.options.zoomWindowWidth) { + lensWidth = self.nzWidth; + } + else { + lensWidth = (self.options.zoomWindowWidth / self.widthRatio); + } + + if (self.zoomLens) { + self.zoomLens.css({ + 'width': lensWidth, + 'height': lensHeight + }); + } + } + }, + + getCurrentImage: function () { + var self = this; + return self.zoomImage; + }, + + getGalleryList: function () { + var self = this; + //loop through the gallery options and set them in list for fancybox + self.gallerylist = []; + if (self.options.gallery) { + $('#' + self.options.gallery + ' a').each(function () { + + var imgSrc = ''; + if ($(this).data('zoom-image')) { + imgSrc = $(this).data('zoom-image'); + } + else if ($(this).data('image')) { + imgSrc = $(this).data('image'); + } + //put the current image at the start + if (imgSrc === self.zoomImage) { + self.gallerylist.unshift({ + href: '' + imgSrc + '', + title: $(this).find('img').attr('title') + }); + } + else { + self.gallerylist.push({ + href: '' + imgSrc + '', + title: $(this).find('img').attr('title') + }); + } + }); + } + //if no gallery - return current image + else { + self.gallerylist.push({ + href: '' + self.zoomImage + '', + title: $(this).find('img').attr('title') + }); + } + return self.gallerylist; + }, + + changeZoomLevel: function (value) { + var self = this; + + //flag a zoom, so can adjust the easing during setPosition + self.scrollingLock = true; + + //round to two decimal places + self.newvalue = parseFloat(value).toFixed(2); + var newvalue = self.newvalue; + + //maxwidth & Maxheight of the image + var maxheightnewvalue = self.largeHeight / ((self.options.zoomWindowHeight / self.nzHeight) * self.nzHeight); + var maxwidthtnewvalue = self.largeWidth / ((self.options.zoomWindowWidth / self.nzWidth) * self.nzWidth); + + //calculate new heightratio + if (self.options.zoomType !== 'inner') { + if (maxheightnewvalue <= newvalue) { + self.heightRatio = (self.largeHeight / maxheightnewvalue) / self.nzHeight; + self.newvalueheight = maxheightnewvalue; + self.fullheight = true; + } + else { + self.heightRatio = (self.largeHeight / newvalue) / self.nzHeight; + self.newvalueheight = newvalue; + self.fullheight = false; + } + + // calculate new width ratio + + if (maxwidthtnewvalue <= newvalue) { + self.widthRatio = (self.largeWidth / maxwidthtnewvalue) / self.nzWidth; + self.newvaluewidth = maxwidthtnewvalue; + self.fullwidth = true; + } + else { + self.widthRatio = (self.largeWidth / newvalue) / self.nzWidth; + self.newvaluewidth = newvalue; + self.fullwidth = false; + } + if (self.options.zoomType === 'lens') { + if (maxheightnewvalue <= newvalue) { + self.fullwidth = true; + self.newvaluewidth = maxheightnewvalue; + } else { + self.widthRatio = (self.largeWidth / newvalue) / self.nzWidth; + self.newvaluewidth = newvalue; + + self.fullwidth = false; + } + } + } + + if (self.options.zoomType === 'inner') { + maxheightnewvalue = parseFloat(self.largeHeight / self.nzHeight).toFixed(2); + maxwidthtnewvalue = parseFloat(self.largeWidth / self.nzWidth).toFixed(2); + if (newvalue > maxheightnewvalue) { + newvalue = maxheightnewvalue; + } + if (newvalue > maxwidthtnewvalue) { + newvalue = maxwidthtnewvalue; + } + + if (maxheightnewvalue <= newvalue) { + self.heightRatio = (self.largeHeight / newvalue) / self.nzHeight; + if (newvalue > maxheightnewvalue) { + self.newvalueheight = maxheightnewvalue; + } else { + self.newvalueheight = newvalue; + } + self.fullheight = true; + } + else { + self.heightRatio = (self.largeHeight / newvalue) / self.nzHeight; + + if (newvalue > maxheightnewvalue) { + + self.newvalueheight = maxheightnewvalue; + } else { + self.newvalueheight = newvalue; + } + self.fullheight = false; + } + + if (maxwidthtnewvalue <= newvalue) { + + self.widthRatio = (self.largeWidth / newvalue) / self.nzWidth; + if (newvalue > maxwidthtnewvalue) { + + self.newvaluewidth = maxwidthtnewvalue; + } else { + self.newvaluewidth = newvalue; + } + + self.fullwidth = true; + } + else { + self.widthRatio = (self.largeWidth / newvalue) / self.nzWidth; + self.newvaluewidth = newvalue; + self.fullwidth = false; + } + } //end inner + var scrcontinue = false; + + if (self.options.zoomType === 'inner') { + if (self.nzWidth >= self.nzHeight) { + if (self.newvaluewidth <= maxwidthtnewvalue) { + scrcontinue = true; + } + else { + scrcontinue = false; + self.fullheight = true; + self.fullwidth = true; + } + } + if (self.nzHeight > self.nzWidth) { + if (self.newvaluewidth <= maxwidthtnewvalue) { + scrcontinue = true; + } + else { + scrcontinue = false; + self.fullheight = true; + self.fullwidth = true; + } + } + } + + if (self.options.zoomType !== 'inner') { + scrcontinue = true; + } + + if (scrcontinue) { + self.zoomLock = 0; + self.changeZoom = true; + + //if lens height is less than image height + if (((self.options.zoomWindowHeight) / self.heightRatio) <= self.nzHeight) { + self.currentZoomLevel = self.newvalueheight; + if (self.options.zoomType !== 'lens' && self.options.zoomType !== 'inner') { + self.changeBgSize = true; + self.zoomLens.css('height', String(self.options.zoomWindowHeight / self.heightRatio) + 'px'); + } + if (self.options.zoomType === 'lens' || self.options.zoomType === 'inner') { + self.changeBgSize = true; + } + } + + if ((self.options.zoomWindowWidth / self.widthRatio) <= self.nzWidth) { + if (self.options.zoomType !== 'inner') { + if (self.newvaluewidth > self.newvalueheight) { + self.currentZoomLevel = self.newvaluewidth; + } + } + + if (self.options.zoomType !== 'lens' && self.options.zoomType !== 'inner') { + self.changeBgSize = true; + + self.zoomLens.css('width', String(self.options.zoomWindowWidth / self.widthRatio) + 'px'); + } + if (self.options.zoomType === 'lens' || self.options.zoomType === 'inner') { + self.changeBgSize = true; + } + + } + if (self.options.zoomType === 'inner') { + self.changeBgSize = true; + + if (self.nzWidth > self.nzHeight) { + self.currentZoomLevel = self.newvaluewidth; + } + if (self.nzHeight > self.nzWidth) { + self.currentZoomLevel = self.newvaluewidth; + } + } + } //under + + //sets the boundry change, called in setWindowPos + self.setPosition(self.currentLoc); + // + }, + + closeAll: function () { + var self = this; + if (self.zoomWindow) { + self.zoomWindow.hide(); + } + if (self.zoomLens) { + self.zoomLens.hide(); + } + if (self.zoomTint) { + self.zoomTint.hide(); + } + }, + + changeState: function (value) { + var self = this; + if (value === 'enable') { + self.options.zoomEnabled = true; + } + if (value === 'disable') { + self.options.zoomEnabled = false; + } + }, + + responsiveConfig: function (options) { + if (options.respond && options.respond.length > 0) { + return $.extend({}, options, this.configByScreenWidth(options)); + } + return options; + }, + + configByScreenWidth: function (options) { + var screenWidth = $(window).width(); + + var config = $.grep(options.respond, function (item) { + var range = item.range.split('-'); + return (screenWidth >= range[0]) && (screenWidth <= range[1]); + }); + + if (config.length > 0) { + return config[0]; + } else { + return options; + } + } + }; + + $.fn.ezPlus = function (options) { + return this.each(function () { + var elevate = Object.create(EZP); + + elevate.init(options, this); + + $.data(this, 'ezPlus', elevate); + + }); + }; + + $.fn.ezPlus.options = { + borderColour: '#888', + borderSize: 4, + constrainSize: false, //in pixels the dimensions you want to constrain on + constrainType: false, //width or height + containLensZoom: false, + cursor: 'inherit', // user should set to what they want the cursor as, if they have set a click function + debug: false, + easing: false, + easingAmount: 12, + enabled: true, + + gallery: false, + galleryActiveClass: 'zoomGalleryActive', + gallerySelector: false, + galleryItem: 'a', + + imageCrossfade: false, + + lensBorderColour: '#000', + lensBorderSize: 1, + lensColour: 'white', //colour of the lens background + lensFadeIn: false, + lensFadeOut: false, + lensOpacity: 0.4, //opacity of the lens + lensShape: 'square', //can be 'round' + lensSize: 200, + lenszoom: false, + + loadingIcon: false, //http://www.example.com/spinner.gif + + // This change will allow to decide if you want to decrease + // zoom of one of the dimensions once the other reached it's top value, + // or keep the aspect ratio, default behaviour still being as always, + // allow to continue zooming out, so it keeps retrocompatibility. + mantainZoomAspectRatio: false, + maxZoomLevel: false, + minZoomLevel: false, + + onComplete: $.noop, + onDestroy: $.noop, + onImageClick: $.noop, + onImageSwap: $.noop, + onImageSwapComplete: $.noop, + onShow: $.noop, + onZoomedImageLoaded: $.noop, + + preloading: 1, //by default, load all the images, if 0, then only load images after activated (PLACEHOLDER FOR NEXT VERSION) + respond: [], + responsive: true, + scrollZoom: false, //allow zoom on mousewheel, true to activate + scrollZoomIncrement: 0.1, //steps of the scrollzoom + showLens: true, + tint: false, //enable the tinting + tintColour: '#333', //default tint color, can be anything, red, #ccc, rgb(0,0,0) + tintOpacity: 0.4, //opacity of the tint + touchEnabled: true, + + zoomActivation: 'hover', // Can also be click (PLACEHOLDER FOR NEXT VERSION) + zoomContainerAppendTo: 'body', //zoom container parent selector + zoomLevel: 1, //default zoom level of image + zoomTintFadeIn: false, + zoomTintFadeOut: false, + zoomType: 'window', //window is default, also 'lens' available - + zoomWindowAlwaysShow: false, + zoomWindowBgColour: '#fff', + zoomWindowFadeIn: false, + zoomWindowFadeOut: false, + zoomWindowHeight: 400, + zoomWindowOffsetX: 0, + zoomWindowOffsetY: 0, + zoomWindowPosition: 1, + zoomWindowWidth: 400, + zoomEnabled: true, //false disables zoomwindow from showing + zIndex: 999 + }; + +})(jQuery, window, document); \ No newline at end of file diff --git a/packages/Webkul/Velocity/publishable/assets/js/velocity.js b/packages/Webkul/Velocity/publishable/assets/js/velocity.js index a6fe8b6c0..8f4a68889 100644 --- a/packages/Webkul/Velocity/publishable/assets/js/velocity.js +++ b/packages/Webkul/Velocity/publishable/assets/js/velocity.js @@ -1143,9 +1143,11 @@ $(document).ready(function () { __WEBPACK_IMPORTED_MODULE_0_vue___default.a.mixin({ data: function data() { return { + 'baseUrl': document.querySelector("script[src$='velocity.js']").getAttribute('baseurl'), 'navContainer': false, 'responsiveSidebarTemplate': '', - 'responsiveSidebarKey': Math.random() + 'responsiveSidebarKey': Math.random(), + 'sharedRootCategories': [] }; }, @@ -1266,8 +1268,9 @@ $(document).ready(function () { mounted: function mounted() { document.body.style.display = "block"; - this.$validator.localize(document.documentElement.lang); + + this.loadCategories(); }, methods: { @@ -1340,6 +1343,16 @@ $(document).ready(function () { showModal: function showModal(id) { this.$set(this.modalIds, id, true); + }, + + loadCategories: function loadCategories() { + var _this3 = this; + + this.$http.get(this.baseUrl + '/categories').then(function (response) { + _this3.sharedRootCategories = response.data.categories; + }).catch(function (error) { + console.log('failed to load categories'); + }); } } }); @@ -35993,26 +36006,55 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); // // // +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// /* harmony default export */ __webpack_exports__["default"] = ({ - props: ['id', 'url', 'addClass', 'parentSlug', 'categories', 'mainSidebar', 'categoryCount'], + props: ['id', 'addClass', 'parentSlug', 'mainSidebar', 'categoryCount'], data: function data() { - var slicedCategories = this.categories; - var categoryCount = this.categoryCount ? this.categoryCount : 9; - - if (slicedCategories && slicedCategories.length > categoryCount) { - slicedCategories = this.categories.slice(0, categoryCount); - } - - if (this.parentSlug) slicedCategories['parentSlug'] = this.parentSlug; - return { - slicedCategories: slicedCategories, + slicedCategories: [], sidebarLevel: Math.floor(Math.random() * 1000) }; }, + watch: { + '$root.sharedRootCategories': function $rootSharedRootCategories(categories) { + this.formatCategories(categories); + } + }, + methods: { remainBar: function remainBar(id) { var sidebar = $('#' + id); @@ -36026,6 +36068,19 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); sidebarContainer.show(); } } + }, + + formatCategories: function formatCategories(categories) { + var slicedCategories = categories; + var categoryCount = this.categoryCount ? this.categoryCount : 9; + + if (slicedCategories && slicedCategories.length > categoryCount) { + slicedCategories = categories.slice(0, categoryCount); + } + + if (this.parentSlug) slicedCategories['parentSlug'] = this.parentSlug; + + this.slicedCategories = slicedCategories; } } }); @@ -36054,11 +36109,11 @@ var render = function() { _c( "ul", { attrs: { type: "none" } }, - _vm._l(_vm.slicedCategories, function(category, index) { + _vm._l(_vm.slicedCategories, function(category, categoryIndex) { return _c( "li", { - key: index, + key: categoryIndex, staticClass: "category-content cursor-pointer", attrs: { id: "category-" + category.id }, on: { @@ -36074,17 +36129,10 @@ var render = function() { _c( "a", { - staticClass: "category unset", - class: category.children.length > 0 ? "fw6" : "", - attrs: { - href: - _vm.url + - "/" + - (_vm.slicedCategories.parentSlug - ? _vm.slicedCategories.parentSlug + "/" - : "") + - category["translations"][0].slug - } + class: + "category unset " + + (category.children.length > 0 ? "fw6" : ""), + attrs: { href: _vm.$root.baseUrl + "/" + category.slug } }, [ _c( @@ -36113,7 +36161,7 @@ var render = function() { ? _c("img", { attrs: { src: - _vm.url + + _vm.$root.baseUrl + "/storage/" + category.category_icon_path } @@ -36157,22 +36205,178 @@ var render = function() { { class: "sub-categories sub-category-" + - (_vm.sidebarLevel + index) + (_vm.sidebarLevel + categoryIndex) }, [ - _c("sidebar-component", { - attrs: { - url: _vm.url, - categories: category.children, - id: - "sidebar-level-" + (_vm.sidebarLevel + index), - "parent-slug": category.parentSlug - ? category.parentSlug - : category["translations"][0].slug - } - }) - ], - 1 + _c( + "nav", + { + staticClass: "sidebar", + attrs: { + id: + "sidebar-level-" + + (_vm.sidebarLevel + categoryIndex) + }, + on: { + mouseover: function($event) { + return _vm.remainBar( + "sidebar-level-" + + (_vm.sidebarLevel + categoryIndex) + ) + } + } + }, + [ + _c( + "ul", + { attrs: { type: "none" } }, + _vm._l(category.children, function( + subCategory, + subCategoryIndex + ) { + return _c( + "li", + { + key: + subCategoryIndex + "-" + categoryIndex + }, + [ + _c( + "a", + { + class: + "category unset " + + (subCategory.children.length > 0 + ? "fw6" + : ""), + attrs: { + href: + _vm.$root.baseUrl + + "/" + + category.slug + + "/" + + subCategory.slug + } + }, + [ + _c( + "div", + { + staticClass: "category-icon", + on: { + mouseout: function($event) { + return _vm.toggleSidebar( + _vm.id, + $event, + "mouseout" + ) + }, + mouseover: function($event) { + return _vm.toggleSidebar( + _vm.id, + $event, + "mouseover" + ) + } + } + }, + [ + subCategory.category_icon_path + ? _c("img", { + attrs: { + src: + _vm.$root.baseUrl + + "/storage/" + + subCategory.category_icon_path + } + }) + : _vm._e() + ] + ), + _vm._v(" "), + _c( + "span", + { staticClass: "category-title" }, + [ + _vm._v( + _vm._s(subCategory["name"]) + ) + ] + ) + ] + ), + _vm._v(" "), + _c( + "ul", + { + staticClass: "nested", + attrs: { type: "none" } + }, + _vm._l(subCategory.children, function( + childSubCategory, + childSubCategoryIndex + ) { + return _c( + "li", + { + key: + childSubCategoryIndex + + "-" + + subCategoryIndex + + "-" + + categoryIndex + }, + [ + _c( + "a", + { + class: + "category unset " + + (subCategory.children + .length > 0 + ? "fw6" + : ""), + attrs: { + href: + _vm.$root.baseUrl + + "/" + + category.slug + + "/" + + subCategory.slug + + "/" + + childSubCategory.slug + } + }, + [ + _c( + "span", + { + staticClass: + "category-title" + }, + [ + _vm._v( + _vm._s( + childSubCategory.name + ) + ) + ] + ) + ] + ) + ] + ) + }), + 0 + ) + ] + ) + }), + 0 + ) + ] + ) + ] ) ]) : _vm._e() @@ -36318,15 +36522,10 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); // // // -// // compile add to cart html (it contains wishlist component) /* harmony default export */ __webpack_exports__["default"] = ({ - props: ['list', 'productImg', 'productUrl', 'priceHtml', 'addToCartHtml', 'productName', 'totalReviews', 'avgRating', 'firstReviewText'], - - data: function data() { - return {}; - } + props: ['list', 'product'] }); /***/ }), @@ -36345,8 +36544,13 @@ var render = function() { _c("div", { staticClass: "product-image" }, [ _c( "a", - { attrs: { title: _vm.productName, href: _vm.productUrl } }, - [_c("img", { attrs: { src: _vm.productImg } })] + { + attrs: { + title: _vm.product.name, + href: _vm.baseUrl + "/" + _vm.product.slug + } + }, + [_c("img", { attrs: { src: _vm.product.image } })] ) ]), _vm._v(" "), @@ -36357,11 +36561,14 @@ var render = function() { "a", { staticClass: "unset", - attrs: { href: _vm.productUrl, title: _vm.productName } + attrs: { + href: _vm.baseUrl + "/" + _vm.product.slug, + title: _vm.product.name + } }, [ _c("span", { staticClass: "fs16" }, [ - _vm._v(_vm._s(_vm.productName)) + _vm._v(_vm._s(_vm.product.name)) ]) ] ) @@ -36369,18 +36576,20 @@ var render = function() { _vm._v(" "), _c("div", { staticClass: "product-price", - domProps: { innerHTML: _vm._s(_vm.priceHtml) } + domProps: { innerHTML: _vm._s(_vm.product.priceHTML) } }), _vm._v(" "), - _vm.totalReviews && _vm.totalReviews > 0 + _vm.product.totalReviews && _vm.product.totalReviews > 0 ? _c( "div", { staticClass: "product-rating" }, [ - _c("star-ratings", { attrs: { ratings: _vm.avgRating } }), + _c("star-ratings", { + attrs: { ratings: _vm.product.avgRating } + }), _vm._v(" "), _c("span", [ - _vm._v(_vm._s(_vm.totalReviews) + " Ratings") + _vm._v(_vm._s(_vm.product.totalReviews) + " Ratings") ]) ], 1 @@ -36388,13 +36597,15 @@ var render = function() { : _c("div", { staticClass: "product-rating" }, [ _c("span", { staticClass: "fs14", - domProps: { textContent: _vm._s(_vm.firstReviewText) } + domProps: { + textContent: _vm._s(_vm.product.firstReviewText) + } }) ]), _vm._v(" "), _c("div", { staticClass: "cart-wish-wrap row mt5", - domProps: { innerHTML: _vm._s(_vm.addToCartHtml) } + domProps: { innerHTML: _vm._s(_vm.product.addToCartHtml) } }) ]) ]) @@ -36405,15 +36616,18 @@ var render = function() { "a", { staticClass: "product-image-container", - attrs: { href: _vm.productUrl, title: _vm.productName } + attrs: { + href: _vm.baseUrl + "/" + _vm.product.slug, + title: _vm.product.name + } }, [ _c("img", { staticClass: "card-img-top", attrs: { loading: "lazy", - src: _vm.productImg, - alt: _vm.productName + src: _vm.product.image, + alt: _vm.product.name } }) ] @@ -36425,11 +36639,14 @@ var render = function() { "a", { staticClass: "unset", - attrs: { href: _vm.productUrl, title: _vm.productName } + attrs: { + title: _vm.product.name, + href: _vm.baseUrl + "/" + _vm.product.slug + } }, [ _c("span", { staticClass: "fs16" }, [ - _vm._v(_vm._s(_vm.productName)) + _vm._v(_vm._s(_vm.product.name)) ]) ] ) @@ -36437,18 +36654,20 @@ var render = function() { _vm._v(" "), _c("div", { staticClass: "product-price fs16", - domProps: { innerHTML: _vm._s(_vm.priceHtml) } + domProps: { innerHTML: _vm._s(_vm.product.priceHTML) } }), _vm._v(" "), - _vm.totalReviews && _vm.totalReviews > 0 + _vm.product.totalReviews && _vm.product.totalReviews > 0 ? _c( "div", { staticClass: "product-rating col-12 no-padding" }, [ - _c("star-ratings", { attrs: { ratings: _vm.avgRating } }), + _c("star-ratings", { + attrs: { ratings: _vm.product.avgRating } + }), _vm._v(" "), _c("span", { staticClass: "align-top" }, [ - _vm._v(_vm._s(_vm.totalReviews) + " Ratings") + _vm._v(_vm._s(_vm.product.totalReviews) + " Ratings") ]) ], 1 @@ -36456,13 +36675,13 @@ var render = function() { : _c("div", { staticClass: "product-rating col-12 no-padding" }, [ _c("span", { staticClass: "fs14", - domProps: { textContent: _vm._s(_vm.firstReviewText) } + domProps: { textContent: _vm._s(_vm.product.firstReviewText) } }) ]), _vm._v(" "), _c("div", { staticClass: "cart-wish-wrap row col-12 no-padding ml0", - domProps: { innerHTML: _vm._s(_vm.addToCartHtml) } + domProps: { innerHTML: _vm._s(_vm.product.addToCartHtml) } }) ]) ]) diff --git a/packages/Webkul/Velocity/src/Http/Controllers/Shop/ShopController.php b/packages/Webkul/Velocity/src/Http/Controllers/Shop/ShopController.php index 6787914ff..eef7086cf 100644 --- a/packages/Webkul/Velocity/src/Http/Controllers/Shop/ShopController.php +++ b/packages/Webkul/Velocity/src/Http/Controllers/Shop/ShopController.php @@ -101,4 +101,83 @@ use Webkul\Velocity\Repositories\Product\ProductRepository as VelocityProductRep return $response; } + + public function categoryDetails() + { + $categoryDetails = app('Webkul\Category\Repositories\CategoryRepository')->findByPath(request()->get('category-slug')); + + if ($categoryDetails) { + $list = false; + $customizedProducts = []; + $products = $this->productRepository->getAll($categoryDetails->id); + + foreach ($products as $product) { + + $productImage = app('Webkul\Product\Helpers\ProductImage')->getProductBaseImage($product)['medium_image_url']; + + $reviewHelper = app('Webkul\Product\Helpers\Review'); + + $totalReviews = $reviewHelper->getTotalReviews($product); + $avgRatings = ceil($reviewHelper->getAverageRating($product)); + + array_push($customizedProducts, [ + 'list' => false, + 'name' => $product->name, + 'image' => $productImage, + 'slug' => $product->url_key, + 'priceHTML' => view('shop::products.price', ['product' => $product])->render(), + 'totalReviews' => $totalReviews, + 'avgRating' => $avgRatings, + 'firstReviewText' => trans('velocity::app.products.be-first-review'), + 'addToCartHtml' => view('shop::products.add-to-cart', [ + 'product' => $product, + 'addWishlistClass' => !(isset($list) && $list) ? 'col-lg-4 col-md-4 col-sm-12 offset-lg-4 pr0' : '', + 'addToCartBtnClass' => !(isset($list) && $list) ? $addToCartBtnClass ?? '' : '' + ])->render(), + ]); + } + + $response = [ + 'status' => true, + 'list' => $list, + 'categoryDetails' => $categoryDetails, + 'categoryProducts' => $customizedProducts, + ]; + } + + return $response ?? [ + 'status' => false, + ]; + } + + public function fetchCategories() + { + $formattedCategories = []; + $categories = app('Webkul\Category\Repositories\CategoryRepository')->getVisibleCategoryTree(core()->getCurrentChannel()->root_category_id); + + foreach ($categories as $category) { + array_push($formattedCategories, $this->getCategoryFilteredData($category)); + } + + return [ + 'status' => true, + 'categories' => $formattedCategories, + ]; + } + + private function getCategoryFilteredData($category) + { + $formattedChildCategory = []; + foreach ($category->children as $child) { + array_push($formattedChildCategory, $this->getCategoryFilteredData($child)); + } + + return [ + 'id' => $category->id, + 'slug' => $category->slug, + 'name' => $category->name, + 'children' => $formattedChildCategory, + 'category_icon_path' => $category->category_icon_path, + ]; + } } diff --git a/packages/Webkul/Velocity/src/Http/front-routes.php b/packages/Webkul/Velocity/src/Http/front-routes.php index 662648a1f..f62d17c29 100644 --- a/packages/Webkul/Velocity/src/Http/front-routes.php +++ b/packages/Webkul/Velocity/src/Http/front-routes.php @@ -8,5 +8,9 @@ Route::group(['middleware' => ['web', 'locale', 'theme', 'currency']], function Route::get('/categorysearch', 'ShopController@search')->defaults('_config', [ 'view' => 'shop::search.search' ])->name('velocity.search.index'); + + Route::get('/categories', 'ShopController@fetchCategories')->name('velocity.categoriest'); + + Route::get('/category-details', 'ShopController@categoryDetails')->name('velocity.category.details'); }); }); \ No newline at end of file diff --git a/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/product-card.vue b/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/product-card.vue index c2141e6f0..5527005b5 100644 --- a/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/product-card.vue +++ b/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/product-card.vue @@ -1,42 +1,41 @@ @@ -74,19 +73,7 @@ export default { props: [ 'list', - 'productImg', - 'productUrl', - 'priceHtml', - 'addToCartHtml', - 'productName', - 'totalReviews', - 'avgRating', - 'firstReviewText', + 'product', ], - - data: function () { - return { - } - } } \ No newline at end of file diff --git a/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue b/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue index 8b3194711..db2bfe877 100644 --- a/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue +++ b/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue @@ -8,18 +8,16 @@
  • - + :class="`category unset ${(category.children.length > 0) ? 'fw6' : ''}`" + :href="`${$root.baseUrl}/${category.slug}`">
    + :src="`${$root.baseUrl}/storage/${category.category_icon_path}`" />
    {{ category['name'] }} -
    • @@ -61,33 +93,25 @@ export default { props: [ 'id', - 'url', 'addClass', 'parentSlug', - 'categories', 'mainSidebar', 'categoryCount' ], data: function () { - let slicedCategories = this.categories; - let categoryCount = this.categoryCount ? this.categoryCount : 9; - - if (slicedCategories - && slicedCategories.length > categoryCount - ) { - slicedCategories = this.categories.slice(0, categoryCount); - } - - if (this.parentSlug) - slicedCategories['parentSlug'] = this.parentSlug; - return { - slicedCategories, + slicedCategories: [], sidebarLevel: Math.floor(Math.random() * 1000), } }, + watch: { + '$root.sharedRootCategories': function (categories) { + this.formatCategories(categories); + } + }, + methods: { remainBar: function (id) { let sidebar = $(`#${id}`); @@ -103,6 +127,23 @@ } }, + + formatCategories: function (categories) { + let slicedCategories = categories; + let categoryCount = this.categoryCount ? this.categoryCount : 9; + + if ( + slicedCategories + && slicedCategories.length > categoryCount + ) { + slicedCategories = categories.slice(0, categoryCount); + } + + if (this.parentSlug) + slicedCategories['parentSlug'] = this.parentSlug; + + this.slicedCategories = slicedCategories; + } } } \ No newline at end of file diff --git a/packages/Webkul/Velocity/src/Resources/assets/js/app.js b/packages/Webkul/Velocity/src/Resources/assets/js/app.js index 88bd892fa..35fcfd59f 100755 --- a/packages/Webkul/Velocity/src/Resources/assets/js/app.js +++ b/packages/Webkul/Velocity/src/Resources/assets/js/app.js @@ -50,9 +50,11 @@ $(document).ready(function () { Vue.mixin({ data: function () { return { + 'baseUrl': document.querySelector("script[src$='velocity.js']").getAttribute('baseurl'), 'navContainer': false, 'responsiveSidebarTemplate': '', 'responsiveSidebarKey': Math.random(), + 'sharedRootCategories': [], } }, @@ -141,7 +143,7 @@ $(document).ready(function () { }); }, - isMobile() { + isMobile: function () { if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { return true } else { @@ -157,7 +159,7 @@ $(document).ready(function () { data: function () { return { - modalIds: {} + modalIds: {}, } }, @@ -173,8 +175,9 @@ $(document).ready(function () { mounted: function () { document.body.style.display = "block"; - this.$validator.localize(document.documentElement.lang); + + this.loadCategories(); }, methods: { @@ -245,6 +248,16 @@ $(document).ready(function () { showModal: function (id) { this.$set(this.modalIds, id, true); }, + + loadCategories: function () { + this.$http.get(`${this.baseUrl}/categories`) + .then(response => { + this.sharedRootCategories = response.data.categories; + }) + .catch(error => { + console.log('failed to load categories'); + }) + } } }); }); diff --git a/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss b/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss index afa4cba5e..5c512ccc6 100644 --- a/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss +++ b/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss @@ -1539,6 +1539,29 @@ .sub-categories { display: none; + + .category { + padding: 5px 0 4px 15px; + + + .nested { + color: $font-color; + + li { + a { + padding-top: 0; + + .category-title { + font-weight: 500; + padding-left: 28px; + } + } + } + } + + .category-title { + vertical-align: top; + } + } } } @@ -1563,15 +1586,15 @@ } li { - padding: 7px 0 5px 15px; - } + a { + padding: 7px 0 5px 15px; + } - li:hover { - background: $border-light; - } - - .sub-category-container { - // position: relative; + &:hover { + > a { + background: $border-light; + } + } } .sub-categories { @@ -1899,8 +1922,8 @@ p { > .container-fluid { - margin-bottom: 60px; padding: 0 !important; + margin-bottom: 60px !important; > .row { padding: 0 15px !important; @@ -2063,3 +2086,10 @@ } } } + +.carousel-products { + + .recently-viewed { + top: -40px; + position: relative; + } +} diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/UI/particals.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/UI/particals.blade.php index 6ba2205aa..47dec1a53 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/UI/particals.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/UI/particals.blade.php @@ -103,20 +103,21 @@ {{ __('velocity::app.header.all-categories') }} - @foreach ($categories as $category) - +
    @@ -207,7 +208,7 @@
  • - +
@@ -215,13 +216,13 @@
  • + :href="`${$root.baseUrl}/${category.slug}`"> @@ -347,13 +348,13 @@ + :href="`${$root.baseUrl}/${nestedSubCategory.slug}`"> @{{ nestedSubCategory.name }} @@ -368,13 +369,13 @@ v-for="(thirdLevelCategory, index) in nestedSubCategory.children"> + :href="`${$root.baseUrl}/${nestedSubCategory.slug}`"> @{{ thirdLevelCategory.name }} @@ -454,7 +455,7 @@
    • - + favorite_border @@ -502,8 +503,8 @@
    • @@ -662,10 +663,7 @@ Vue.component('content-header', { template: '#content-header-template', props: [ - 'url', 'heading', - 'isEnabled', - 'categories', 'headerContent', ], @@ -723,7 +721,7 @@ } else { event.preventDefault(); - let categories = JSON.parse(this.categories); + let categories = this.sharedRootCategories; this.rootCategories = false; this.subCategory = categories[index]; } diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/home/category.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/home/category.blade.php index 50b0c499f..61e29bdac 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/home/category.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/home/category.blade.php @@ -1,93 +1,54 @@ @inject ('productRepository', 'Webkul\Product\Repositories\ProductRepository') -@php - $categoryDetails = app('Webkul\Category\Repositories\CategoryRepository')->findByPath($category); -@endphp - -@if ($categoryDetails) - @php - $products = $productRepository->getAll($categoryDetails->id); - @endphp - - @if ($products->count()) -
      - - - -
      - - - @foreach ($products as $index => $product) - - @include ('shop::products.list.card', ['product' => $product]) - - @endforeach - -
      - -
      - - - @foreach ($products as $index => $product) - - @include ('shop::products.list.card', ['product' => $product]) - - @endforeach - -
      -
      - @endif -@endif + @push('scripts') - {{-- --}} + @endpush \ No newline at end of file diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/home/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/home/index.blade.php index 5e2d374b1..d12f5a5fc 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/home/index.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/home/index.blade.php @@ -1,4 +1,5 @@ @extends('shop::layouts.master') + @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage') @inject ('productRatingHelper', 'Webkul\Product\Helpers\Review') @@ -61,4 +62,5 @@ {{ view_render_event('bagisto.shop.home.content.after') }}
    -@endsection \ No newline at end of file +@endsection + diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/footer/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/footer/index.blade.php index 64dfc7097..416894aba 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/footer/index.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/footer/index.blade.php @@ -4,9 +4,9 @@ @include('shop::layouts.footer.newsletter-subscription') @include('shop::layouts.footer.footer-links') - @if ($categories) - {{-- @include('shop::layouts.footer.top-brands') --}} - @endif + {{-- @if ($categories) + @include('shop::layouts.footer.top-brands') + @endif --}} @include('shop::layouts.footer.copy-right')
    diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/header/nav-menu/navmenu.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/header/nav-menu/navmenu.blade.php deleted file mode 100644 index 29faa65b7..000000000 --- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/header/nav-menu/navmenu.blade.php +++ /dev/null @@ -1,161 +0,0 @@ -{!! view_render_event('bagisto.shop.layout.header.category.before') !!} - -getVisibleCategoryTree( - core()->getCurrentChannel()->root_category_id - ) - as $category - ) { - if ($category->slug) { - array_push($categories, $category); - } - } -?> - -{!! view_render_event('bagisto.shop.layout.header.category.after') !!} - -@push('scripts') - - - - - - -@endpush diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php index 1437fd85e..ea3afd3b7 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php @@ -15,7 +15,7 @@ @if (core()->getCurrentLocale()->direction == 'rtl') - + @endif @@ -25,10 +25,21 @@ @endif - - {{-- --}} - - + + + + + @yield('head') @@ -45,16 +56,6 @@ getCurrentLocale()->direction == 'rtl') class="rtl" @endif> {!! view_render_event('bagisto.shop.layout.body.before') !!} - @php - $categories = []; - - foreach (app('Webkul\Category\Repositories\CategoryRepository')->getVisibleCategoryTree(core()->getCurrentChannel()->root_category_id) as $category) { - - if ($category->slug) - array_push($categories, $category); - } - @endphp - @include('shop::UI.particals')
    @@ -64,9 +65,7 @@ @section('body-header') @include('shop::layouts.top-nav.index') - @include('shop::layouts.header.index', [ - 'categories' => $categories - ]) + @include('shop::layouts.header.index')
    @php @@ -75,8 +74,6 @@ @@ -87,7 +84,6 @@ main-sidebar=true id="sidebar-level-0" url="{{ url()->to('/') }}" - :categories="{{ json_encode($categories) }}" category-count="{{ $velocityMetaData ? $velocityMetaData->sidebar_category_count : 10 }}" add-class="category-list-container pt10"> diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/card.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/card.blade.php index 6a1f2ca55..3dd24e1d4 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/card.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/card.blade.php @@ -16,24 +16,6 @@ @endphp {!! view_render_event('bagisto.shop.products.list.card.before', ['product' => $product]) !!} - - {{-- @TODO:- make product card a vue component and get all the details through xhr --}} - {{-- - --}} - @if (isset($list) && $list)
    diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/recently-viewed.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/recently-viewed.blade.php index 98c294a7d..ded76f268 100644 --- a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/recently-viewed.blade.php +++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/recently-viewed.blade.php @@ -24,13 +24,13 @@ v-for="(product, index) in recentlyViewed">
    - +
    - +
    @{{ product.name }}
    @@ -67,7 +67,6 @@ data: function () { return { - baseURL: '{{ url()->to('/') }}', recentlyViewed: (() => { let storedRecentlyViewed = window.localStorage.recentlyViewed; if (storedRecentlyViewed) { @@ -89,11 +88,9 @@ }, created: function () { - // @TODO:- current product and recentlyViewed - for (slug in this.recentlyViewed) { if (slug) { - this.$http(`${this.baseURL}/product-details/${slug}`) + this.$http(`${this.baseUrl}/product-details/${slug}`) .then(response => { if (response.data.status) { this.$set(this.recentlyViewed, response.data.details.urlKey, response.data.details);