diff options
32 files changed, 2283 insertions, 79 deletions
diff --git a/StoneIsland/config.xml b/StoneIsland/config.xml index e97f1183..4a5e3c49 100755 --- a/StoneIsland/config.xml +++ b/StoneIsland/config.xml @@ -62,8 +62,6 @@ <feature name="StatusBar"> <param name="ios-package" onload="true" value="CDVStatusBar" /> </feature> - <engine name="android" spec="^6.2.3" /> - <engine name="ios" spec="^4.5.2" /> <plugin name="cordova-plugin-whitelist" spec="1" /> <plugin name="cordova-plugin-statusbar" spec="^2.2.3" /> <plugin name="cordova-plugin-app-name" spec="^1.0.4"> @@ -84,4 +82,6 @@ <variable name="SENDER_ID" value="85075801930" /> </plugin> <plugin name="cordova-plugin-sim" spec="^1.3.3" /> + <engine name="android" spec="^6.2.3" /> + <engine name="ios" spec="^4.5.2" /> </widget> diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Info.plist b/StoneIsland/platforms/ios/Stone Island.xcarchive/Info.plist index ed351ab3..2a1683aa 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Info.plist +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Info.plist @@ -18,7 +18,7 @@ <key>ArchiveVersion</key> <integer>2</integer> <key>CreationDate</key> - <date>2017-11-24T19:14:54Z</date> + <date>2018-04-30T23:01:59Z</date> <key>Name</key> <string>Stone Island</string> <key>SchemeName</key> diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Assets.car b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Assets.car Binary files differindex af3e64af..196d0942 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Assets.car +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Assets.car diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/01J-lp-oVM-view-Ze5-6b-2t3.nib b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/01J-lp-oVM-view-Ze5-6b-2t3.nib Binary files differindex c1182a25..e8eb654e 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/01J-lp-oVM-view-Ze5-6b-2t3.nib +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/01J-lp-oVM-view-Ze5-6b-2t3.nib diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/UIViewController-01J-lp-oVM.nib b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/UIViewController-01J-lp-oVM.nib Binary files differindex 39b840e9..f1bfd0f8 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/UIViewController-01J-lp-oVM.nib +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/CDVLaunchScreen.storyboardc/UIViewController-01J-lp-oVM.nib diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Info.plist b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Info.plist Binary files differindex ecf2ec6c..f3aaec33 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Info.plist +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Info.plist diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/MainViewController.nib b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/MainViewController.nib Binary files differindex e51cec57..e6a81632 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/MainViewController.nib +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/MainViewController.nib diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Stone Island b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Stone Island Binary files differindex 2381fd47..bddb90ac 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Stone Island +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/Stone Island diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/_CodeSignature/CodeResources b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/_CodeSignature/CodeResources index 85b9293a..1b1e1fc7 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/_CodeSignature/CodeResources +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/_CodeSignature/CodeResources @@ -94,11 +94,11 @@ </data> <key>Assets.car</key> <data> - KMH8+1Pz/iClgaz6CR0EqdcEXxU= + 5V2dkm2gDUPTb4Gq4CQC+n75XI0= </data> <key>CDVLaunchScreen.storyboardc/01J-lp-oVM-view-Ze5-6b-2t3.nib</key> <data> - cz+4SGs/fYf5KwDHDMojpnTTb0c= + HIAIWn8WMF5gLUslVBO7Gt/Adeg= </data> <key>CDVLaunchScreen.storyboardc/Info.plist</key> <data> @@ -106,7 +106,7 @@ </data> <key>CDVLaunchScreen.storyboardc/UIViewController-01J-lp-oVM.nib</key> <data> - qDRqT+KNdSJ4AMXEyQATUBF9nrc= + OFeqxmdlUVe/HeAnXsfYklHTI8s= </data> <key>CDVNotification.bundle/beep.wav</key> <data> @@ -114,20 +114,16 @@ </data> <key>Info.plist</key> <data> - 7WlhIjtoNeudQAXVr74fcDAM4X0= + b4D+Lf6xgGGZFYlX9eTrEJhK6bI= </data> <key>MainViewController.nib</key> <data> - WiFU90oAbYH/FsFJOC5GukNWJyI= + tM5p+DaSXlhkzMObAJjU9pyJ9ZQ= </data> <key>PkgInfo</key> <data> n57qDP4tZfLD1rCS43W0B4LQjzE= </data> - <key>archived-expanded-entitlements.xcent</key> - <data> - uVC4UsEAjsaAorNMAW+mHUKgk9o= - </data> <key>config.xml</key> <data> 1fxqjJEa5NBEatrUFi1CqzM5mso= @@ -234,15 +230,19 @@ </data> <key>www/css/products.css</key> <data> - +fUNkWTJRbnCPObOIppxTXdSwz0= + 2lbW/9zg4FVs6UQJ/vCCpeQnF6k= </data> <key>www/css/vendor/flickity.css</key> <data> xW5wsn/T/+uaGvIT+Sl9WY/IM2k= </data> + <key>www/css/vendor/imageviewer.css</key> + <data> + E6k71W5TG9qx4En63f4c4zW2Wvw= + </data> <key>www/db.json</key> <data> - 64YXkyZnHPlUjbdGUPQJgTFyBlg= + q3GcOypUIs2uCduVrFJaj2/zc1A= </data> <key>www/img/Resources/CDVNotification.bundle/beep.wav</key> <data> @@ -350,11 +350,11 @@ </data> <key>www/index.html</key> <data> - AeJ9ZW4dSLpPZ9mK19X+IQME5zE= + GBQzWeYnZsBBpRtqFyrG/Cj58oM= </data> <key>www/js/index.js</key> <data> - XgJhs0VV6cJQmVhMxypE070GJsU= + PU6t7rDvh1Y4wF4NUupQG4kDn48= </data> <key>www/js/lib/_router.js</key> <data> @@ -402,11 +402,11 @@ </data> <key>www/js/lib/blogs/BlogView.js</key> <data> - pxMCp0HAvBjzDyH6hAZ9lHU2DZ4= + qSUN0kjez9Eywws2XkO+B1Y7dn8= </data> <key>www/js/lib/blogs/HubView.js</key> <data> - luEFl2azLXI4GqM5qKF7ePgcKAY= + w3T7QXHUtGjf5b3UCcQugEvvQvg= </data> <key>www/js/lib/blogs/PageView.js</key> <data> @@ -506,11 +506,11 @@ </data> <key>www/js/lib/products/GalleryView.js</key> <data> - CpqSBwnIKxV0wFGD8GdU82L9oqI= + 6JQpjWlaofZTFXzrii03KZnlDL0= </data> <key>www/js/lib/products/ProductView.js</key> <data> - TotXCPY4LKw4D0gnNBqMeeWH3Ko= + 6JrWWnP1sp7k9EeS0yPee5WcyI8= </data> <key>www/js/lib/products/Selector.js</key> <data> @@ -584,6 +584,10 @@ <data> 7+L7DJW+IWJnI8uOkBFuyww3Bk0= </data> + <key>www/js/vendor/imageviewer.js</key> + <data> + YO5G3tby8VirIt68DzUoEznYtxE= + </data> <key>www/js/vendor/iscroll.js</key> <data> zmIJQRtMdsZHuPuHvHEe8K1HC7w= @@ -937,22 +941,22 @@ <dict> <key>hash</key> <data> - KMH8+1Pz/iClgaz6CR0EqdcEXxU= + 5V2dkm2gDUPTb4Gq4CQC+n75XI0= </data> <key>hash2</key> <data> - 9A43GMBRlZDbye/YZpSILYrghChHjsdGe4JLDdnmaRw= + twnDz14NPdISTa9jpLyxR0tlyjVTLWgpZrsiVMQGJCk= </data> </dict> <key>CDVLaunchScreen.storyboardc/01J-lp-oVM-view-Ze5-6b-2t3.nib</key> <dict> <key>hash</key> <data> - cz+4SGs/fYf5KwDHDMojpnTTb0c= + HIAIWn8WMF5gLUslVBO7Gt/Adeg= </data> <key>hash2</key> <data> - nReb2Hotj7c6xngzepueLGaI/cM5k0w2sw6PP9IQ9XQ= + hT0K1MW3ga6BW9WpZzYwWcmIEED74WKaZi1i6lGGmQ4= </data> </dict> <key>CDVLaunchScreen.storyboardc/Info.plist</key> @@ -970,11 +974,11 @@ <dict> <key>hash</key> <data> - qDRqT+KNdSJ4AMXEyQATUBF9nrc= + OFeqxmdlUVe/HeAnXsfYklHTI8s= </data> <key>hash2</key> <data> - w7UOLBJYlGtr8/R6CW+s3Idfs0L9zaFPyq8cHmx51H4= + cocZEHwRc89gIIQpkoYZEiqUdcbCHB8kiSL0Pq1lfHE= </data> </dict> <key>CDVNotification.bundle/beep.wav</key> @@ -992,22 +996,11 @@ <dict> <key>hash</key> <data> - WiFU90oAbYH/FsFJOC5GukNWJyI= + tM5p+DaSXlhkzMObAJjU9pyJ9ZQ= </data> <key>hash2</key> <data> - 86ytNF45A7zHJmcFIdDG/UoJXqvuZv2l4HFgSseVH9E= - </data> - </dict> - <key>archived-expanded-entitlements.xcent</key> - <dict> - <key>hash</key> - <data> - uVC4UsEAjsaAorNMAW+mHUKgk9o= - </data> - <key>hash2</key> - <data> - e/joE7ObU4L5jO1+1JUxZxM/FUkgLPoVg6yex5UVEFk= + CzrrCX/iNFT8uVxJieK9+RuNEf6AHBT3YvxU0A5ovq4= </data> </dict> <key>config.xml</key> @@ -1300,11 +1293,11 @@ <dict> <key>hash</key> <data> - +fUNkWTJRbnCPObOIppxTXdSwz0= + 2lbW/9zg4FVs6UQJ/vCCpeQnF6k= </data> <key>hash2</key> <data> - 4YeXdsIzAETntWgyK3wdkERMCmdwsxiCWwq8yJ0bm3Q= + VMqP0OZJ/5Vu8PUadIzvPo+yyYSTjFL6nWySZURNyOU= </data> </dict> <key>www/css/vendor/flickity.css</key> @@ -1318,15 +1311,26 @@ T95IzwnM3icXTFFGjaoJ60KBvjBZRIGdOLBHp6g1odc= </data> </dict> + <key>www/css/vendor/imageviewer.css</key> + <dict> + <key>hash</key> + <data> + E6k71W5TG9qx4En63f4c4zW2Wvw= + </data> + <key>hash2</key> + <data> + Mn6/BFesMh2kNFV4JR7De/LEf7T0O6ozcUvxFHquLxA= + </data> + </dict> <key>www/db.json</key> <dict> <key>hash</key> <data> - 64YXkyZnHPlUjbdGUPQJgTFyBlg= + q3GcOypUIs2uCduVrFJaj2/zc1A= </data> <key>hash2</key> <data> - jziLeozhXx/Yym/+NBwWSW6FbKEc+kQrYOmZc77D2Oc= + Vv0ZNidUrgsLt/XFGB2F9wE4VDY2ynIFUfxlwgxDsHQ= </data> </dict> <key>www/img/Resources/CDVNotification.bundle/beep.wav</key> @@ -1619,22 +1623,22 @@ <dict> <key>hash</key> <data> - AeJ9ZW4dSLpPZ9mK19X+IQME5zE= + GBQzWeYnZsBBpRtqFyrG/Cj58oM= </data> <key>hash2</key> <data> - oI9s3C7xJ7O3jk1SBa+USad7Y6KUuwhRV0yWZrFitMM= + 2n0d5Q+XUQvxVaZgUYHRnMP8r78BLpj5SGzIOqcVkyU= </data> </dict> <key>www/js/index.js</key> <dict> <key>hash</key> <data> - XgJhs0VV6cJQmVhMxypE070GJsU= + PU6t7rDvh1Y4wF4NUupQG4kDn48= </data> <key>hash2</key> <data> - n1pWw6MNDrVQW6cXPmMapfIrKZ1W1RJY3PRmwT/UvdE= + v9PxeMM34xvkjvwnSFVyyaXHxrCHB3mU91deg4OUIes= </data> </dict> <key>www/js/lib/_router.js</key> @@ -1762,22 +1766,22 @@ <dict> <key>hash</key> <data> - pxMCp0HAvBjzDyH6hAZ9lHU2DZ4= + qSUN0kjez9Eywws2XkO+B1Y7dn8= </data> <key>hash2</key> <data> - VNSj/i3MFH6MlovNbaXrZ6GYSlfQuF60L8Y9ZVTmMmo= + R+L7y48BwjqUHNoxZRdpHiVmt4D8zMIq/MqDz1kawog= </data> </dict> <key>www/js/lib/blogs/HubView.js</key> <dict> <key>hash</key> <data> - luEFl2azLXI4GqM5qKF7ePgcKAY= + w3T7QXHUtGjf5b3UCcQugEvvQvg= </data> <key>hash2</key> <data> - cRt+q8GqIgxugNl7hJi83sX78+GUgho46RHH9fyb93g= + ojFzqE6v9Xb8lcc0dX9qQC2cGcBPkkAc47siWA5VrBY= </data> </dict> <key>www/js/lib/blogs/PageView.js</key> @@ -2048,22 +2052,22 @@ <dict> <key>hash</key> <data> - CpqSBwnIKxV0wFGD8GdU82L9oqI= + 6JQpjWlaofZTFXzrii03KZnlDL0= </data> <key>hash2</key> <data> - n3fH37jyJVsN6JkJvkx3OIotptVwo/xM41D0vs6EefY= + yvxnfm61aB8V8wdqpECJqGwJUD/pohw5zqxRj88/2xg= </data> </dict> <key>www/js/lib/products/ProductView.js</key> <dict> <key>hash</key> <data> - TotXCPY4LKw4D0gnNBqMeeWH3Ko= + 6JrWWnP1sp7k9EeS0yPee5WcyI8= </data> <key>hash2</key> <data> - +YqrE8M9ROhEazgX585crxTZPfNpJAEhzCEh7l3YldE= + I+zNYv5BUGQowjmh49eQKvgQsqCkeA//igObCbN5cEY= </data> </dict> <key>www/js/lib/products/Selector.js</key> @@ -2264,6 +2268,17 @@ vF2sYxgNn4r/4NnhBHz/44B9O8nWsxHRUd0Gf1FOK3w= </data> </dict> + <key>www/js/vendor/imageviewer.js</key> + <dict> + <key>hash</key> + <data> + YO5G3tby8VirIt68DzUoEznYtxE= + </data> + <key>hash2</key> + <data> + UUel6KiMbw9gmarwhD4ZjGm9/5uCf8AFftD8M2g63hs= + </data> + </dict> <key>www/js/vendor/iscroll.js</key> <dict> <key>hash</key> diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/archived-expanded-entitlements.xcent b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/archived-expanded-entitlements.xcent deleted file mode 100644 index 903def2a..00000000 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/archived-expanded-entitlements.xcent +++ /dev/null @@ -1,8 +0,0 @@ -<?xml version="1.0" encoding="UTF-8"?> -<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> -<plist version="1.0"> -<dict> - <key>aps-environment</key> - <string>development</string> -</dict> -</plist> diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/products.css b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/products.css index 1f858898..532beb69 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/products.css +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/products.css @@ -232,9 +232,9 @@ } #collection .content { -position:relative; -padding-top:45px; -padding-bottom:45px; + position:relative; + padding-top:45px; + padding-bottom:45px; } #collection h1 { @@ -252,3 +252,7 @@ padding-bottom:45px; z-index:9 } +.red { + color: red; +} + diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/vendor/imageviewer.css b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/vendor/imageviewer.css new file mode 100644 index 00000000..dedbb7de --- /dev/null +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/css/vendor/imageviewer.css @@ -0,0 +1,227 @@ +/* + ImageViewer v 1.1.0 + Author: Sudhanshu Yadav + Copyright (c) 2015 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license. + Demo on: http://ignitersworld.com/lab/imageViewer.html +*/ + +/***** image viewer css *****/ +#iv-container { + position: fixed; + background: #ffffff; + width: 100%; + height: 100%; + top: 0; + left: 0; + display: none; + z-index: 1000; +} + +.iv-container { + overflow: hidden; +} + +.iv-close { + width: 32px; + height: 32px; + position: fixed; + right: 20px; + top: 20px; + cursor: pointer; + text-align: center; + overflow: hidden; + text-shadow: 0px 0px 3px #6d6d6d; + -webkit-transition: all ease 200ms; + -moz-transition: all ease 200ms; + -o-transition: all ease 200ms; + transition: all ease 200ms; +} +.iv-close:after, +.iv-close:before { + content: ""; + height: 4px; + width: 32px; + background: #000; + position: absolute; + left: 0; + top: 50%; + margin-top: -2px; +} +.iv-close:before { + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -ms-transform: rotate(45deg); + -o-transform: rotate(45deg); + transform: rotate(45deg); +} +.iv-close:after { + -webkit-transform: rotate(-45deg); + -moz-transform: rotate(-45deg); + -ms-transform: rotate(-45deg); + -o-transform: rotate(-45deg); + transform: rotate(-45deg); +} +.iv-close:hover { + -webkit-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -ms-transform: rotate(90deg); + -o-transform: rotate(90deg); + transform: rotate(90deg); +} +/***** snap view css *****/ +.iv-snap-view { + display: none !important; + width: 150px; + height: 150px; + position: absolute; + top: 20px; + left: 20px; + border: 1px solid #666; + background: black; + z-index: 100; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-transition: all ease 400ms; + -moz-transition: all ease 400ms; + -o-transition: all ease 400ms; + transition: all ease 400ms; + opacity: 0; +} + +.iv-snap-image-wrap { + display: inline-block; + position: absolute; + max-width: 150px; + max-height: 150px; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + overflow: hidden; +} + +.iv-snap-image { + position: relative; +} + +.iv-snap-handle { + position: absolute; + border: 1px solid #ccc; + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); + -moz-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); + box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); +} + +/*** zoom slider ***/ +.iv-zoom-slider { + width: 100%; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + border: 1px solid #666; + border-top: 0; + background: rgba(204, 204, 204, 0.1); + height: 15px; + position: absolute; + top: 150px; + left: -1px; +} + +.iv-zoom-handle { + width: 20px; + height: 15px; + background: #ccc; + position: absolute; +} + +/**** snap view css end *****/ +.iv-image-view { + position: absolute; + height: 100%; + width: 100%; +} + +.iv-image-wrap { + display: inline-block; +} + +.iv-image-wrap:active { + cursor: move; +} + +.iv-large-image { + max-width: 100%; + max-height: 100%; + position: absolute; + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} + +/****** CSS loader by http://projects.lukehaas.me/css-loaders/ *****/ +.iv-loader { + top: 50%; + left: 50%; + border-radius: 50%; + width: 32px; + height: 32px; + z-index: 100; + margin-top: -16px; + margin-left: -16px; + font-size: 5px; + position: absolute; + text-indent: -9999em; + border-top: 1.1em solid rgba(255, 255, 255, 0.2); + border-right: 1.1em solid rgba(255, 255, 255, 0.2); + border-bottom: 1.1em solid rgba(255, 255, 255, 0.2); + border-left: 1.1em solid #ffffff; + -webkit-transform: translateZ(0); + -ms-transform: translateZ(0); + transform: translateZ(0); + -webkit-animation: load8 1.1s infinite linear; + animation: load8 1.1s infinite linear; +} +.iv-loader:after { + width: 10em; + height: 10em; + border-radius: 50%; +} +@-webkit-keyframes load8 { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@keyframes load8 { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + + +@media screen and (max-width: 767px) { + .iv-snap-view { + z-index: -1; + visibility: hidden; + } +} diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/db.json b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/db.json index 71fb3826..f8067d3d 100644 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/db.json +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/db.json @@ -3418,7 +3418,7 @@ "Departments": [ { "text": "APP_PERTEX_USCA", - "uri": "PPPRTXSC" + "uri": "PPSFTSHLLSC" } ], "StoreStatus": "open", diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/index.html b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/index.html index fb5a3c0a..943b2b05 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/index.html +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/index.html @@ -20,6 +20,7 @@ <link rel="stylesheet" type="text/css" href="css/fonts/fonts.css"> <link rel="stylesheet" type="text/css" href="css/fonts/ionicons.css"> <link rel="stylesheet" type="text/css" href="css/vendor/flickity.css"> + <link rel="stylesheet" type="text/css" href="css/vendor/imageviewer.css"> <link rel="stylesheet" type="text/css" href="css/index.css"> <link rel="stylesheet" type="text/css" href="css/nav.css"> <link rel="stylesheet" type="text/css" href="css/account.css"> @@ -1087,6 +1088,7 @@ <script src="js/vendor/lodash.min.js"></script> <script src="js/vendor/moment.js"></script> <script src="js/vendor/oktween.js"></script> +<script src="js/vendor/imageviewer.js"></script> <script src="js/vendor/prefixfree.js"></script> <script src="js/vendor/promise.js"></script> <script src="js/vendor/flickity.pkgd.js"></script> diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/index.js b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/index.js index 164d98cc..9b54ad44 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/index.js +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/index.js @@ -127,6 +127,7 @@ var app = (function(){ if (window.deepLinkRoute) { app.router.go(window.deepLinkRoute) } + app.fullscreenViewer = ImageViewer() $("body").removeClass("loading") } diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/BlogView.js b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/BlogView.js index 6eea977f..55320e7c 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/BlogView.js +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/BlogView.js @@ -97,6 +97,11 @@ var BlogView = View.extend({ app.store.FittingCodes.split("\n").forEach(function(code){ app.product.fitLargeCodes[code] = true }) + if (app.store.FitsLarge === 'use_alt_text' && (app.store.FitsLargeText || "").length) { + var fit_lines = app.store.FitsLargeText.split('\n').replace(/</g, "<").replace(/>/g, "&rt;").join("<br>") + $('.fit').html(fit_lines) + $('.fit').addClass('altText') + } } if (app.store.BackgroundIsGray === "true") { diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/HubView.js b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/HubView.js index 20046fdf..c09dd3b3 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/HubView.js +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/blogs/HubView.js @@ -74,7 +74,7 @@ var HubView = ScrollableView.extend({ el.className = "item" $gallery.append(el) }) - this.galleries[row.id] = new Flickity( ".gallery-" + row.id, { + var gallery = this.galleries[row.id] = new Flickity( ".gallery-" + row.id, { selector: '.item', cellAlign: 'center', autoPlay: false, @@ -86,6 +86,10 @@ var HubView = ScrollableView.extend({ contain: true, draggable: true, }) + gallery.on('staticClick', function(e){ + var url = gallery.selectedElement.style.backgroundImage.replace(/url\(\"?/,"").replace(/\"?\)/,"") + app.fullscreenViewer.show(url, url) + }) } else { // single image @@ -108,6 +112,10 @@ var HubView = ScrollableView.extend({ var ytid = (url.match(/v=([-_a-zA-Z0-9]{11})/i) || url.match(/youtu.be\/([-_a-zA-Z0-9]{11})/i) || url.match(/embed\/([-_a-zA-Z0-9]{11})/i))[1].split('&')[0]; e.style.backgroundImage = "url(https://i.ytimg.com/vi/" + ytid + "/maxresdefault.jpg" } + } else { + $(el).click(function(){ + app.fullscreenViewer.show(row.image[0].uri) + }) } $t.find(".gallery-left").remove() $t.find(".gallery-right").remove() diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/GalleryView.js b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/GalleryView.js index 1428aca9..0c928739 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/GalleryView.js +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/GalleryView.js @@ -9,6 +9,7 @@ var GalleryView = View.extend({ // "touchstart .gallery": "touchstart", // "touchmove .gallery": "touchmove", // "touchend .gallery": "touchend", + "click": "click", }, initialize: function(){ @@ -22,21 +23,27 @@ var GalleryView = View.extend({ populate: function(code, image_ids){ var valid_styles = {} + var large_styles = this.large_styles = {} image_ids.forEach(function(id){ if (id.indexOf("_") == -1) return var partz = id.split("_") var size = parseInt(partz[0]), style = partz[1] + + if (! large_styles[style] || large_styles[style] < size) { + large_styles[style] = size + } if (size > 13) return; if (! valid_styles[style] || valid_styles[style] < size) { valid_styles[style] = size } }) + Object.keys(valid_styles).sort(sort_image_styles).forEach(function(style){ var id = valid_styles[style] + "_" + style var t = this.template.replace(/{{image}}/, sdk.image(code, id)) this.$el.append(t) }.bind(this)) - + this.gallery = new Flickity( "#gallery", { selector: '.item', cellAlign: 'center', @@ -50,7 +57,18 @@ var GalleryView = View.extend({ draggable: true, }) }, - + click: function(e){ + var currentImage = this.gallery.selectedElement.style.backgroundImage.replace(/url\(\"?/,"").replace(/\"?\)/,"") + var partz = currentImage.split("_") + var head = partz[0] + var size = partz[1] + var tail = partz[2] + var end_partz = tail.split(/\./) + var style = end_partz[0] + var largest_size = this.large_styles[style] + var hiresImage = [head, largest_size, tail].join("_") + app.fullscreenViewer.show(currentImage, hiresImage) + }, touchstart: function(e){ }, touchmove: function(e){ diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/ProductView.js b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/ProductView.js index 214819cf..97654a3f 100755 --- a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/ProductView.js +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/lib/products/ProductView.js @@ -183,6 +183,15 @@ var ProductView = ScrollableView.extend({ console.log( data['DefaultCode10'] ) + if (title.indexOf('<br>') !== -1) { + var title_lines = title.split('<br>').map(function(s){ + if (s.indexOf("LIMITED EDITION")) { + return "<span class='red'>" + s + "</span>" + } + return s + }) + title = title_lines.join('<br><br>') + } this.$title.html(title) this.$type.html(type) this.$price.html(price) diff --git a/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/vendor/imageviewer.js b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/vendor/imageviewer.js new file mode 100644 index 00000000..0efebf1d --- /dev/null +++ b/StoneIsland/platforms/ios/Stone Island.xcarchive/Products/Applications/Stone Island.app/www/js/vendor/imageviewer.js @@ -0,0 +1,816 @@ +/* + ImageViewer v 1.1.3 + Author: Sudhanshu Yadav + Copyright (c) 2015-2016 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license. + Demo on: http://ignitersworld.com/lab/imageViewer.html +*/ + +/*** picture view plugin ****/ +(function ($, window, document, undefined) { + "use strict"; + + //an empty function + var noop = function () {}; + + var $body = $('body'), + $window = $(window), + $document = $(document); + + var openTime = 0 + + //constants + var ZOOM_CONSTANT = 15; //increase or decrease value for zoom on mouse wheel + var MOUSE_WHEEL_COUNT = 5; //A mouse delta after which it should stop preventing default behaviour of mouse wheel + + //ease out method + /* + t : current time, + b : intial value, + c : changed value, + d : duration + */ + function easeOutQuart(t, b, c, d) { + t /= d; + t--; + return -c * (t * t * t * t - 1) + b; + }; + + + // http://paulirish.com/2011/requestanimationframe-for-smart-animating/ + // http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating + + // requestAnimationFrame polyfill by Erik Möller + // fixes from Paul Irish and Tino Zijdel + + (function () { + var lastTime = 0; + var vendors = ['ms', 'moz', 'webkit', 'o']; + for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { + window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame']; + window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || window[vendors[x] + 'CancelRequestAnimationFrame']; + } + + if (!window.requestAnimationFrame) + window.requestAnimationFrame = function (callback, element) { + var currTime = new Date().getTime(); + var timeToCall = Math.max(0, 16 - (currTime - lastTime)); + var id = window.setTimeout(function () { + callback(currTime + timeToCall); + }, + timeToCall); + lastTime = currTime + timeToCall; + return id; + }; + + if (!window.cancelAnimationFrame) + window.cancelAnimationFrame = function (id) { + clearTimeout(id); + }; + }()); + + //function to check if image is loaded + function imageLoaded(img) { + return img.complete && (typeof img.naturalWidth === 'undefined' || img.naturalWidth !== 0); + } + + var imageViewHtml = '<div class="iv-loader"></div>' + + '<div class="iv-snap-view">' + + '<div class="iv-snap-image-wrap">' + + '<div class="iv-snap-handle"></div>' + + '</div>' + + '<div class="iv-zoom-slider"><div class="iv-zoom-handle"></div></div>' + + '</div>' + + '<div class="iv-image-view"><div class="iv-image-wrap" ></div></div>'; + + //add a full screen view + $(function () { + if(!$body.length) $body = $('body'); + $body.append('<div id="iv-container">' + imageViewHtml + '<div class="iv-close"></div><div>'); + imageViewHtml = null + }); + + function Slider(container, options) { + this.container = container; + this.onStart = options.onStart || noop; + this.onMove = options.onMove || noop; + this.onEnd = options.onEnd || noop; + this.sliderId = options.sliderId || 'slider' + Math.ceil(Math.random() * 1000000); + } + + Slider.prototype.init = function () { + var self = this, + container = this.container, + eventSuffix = '.' + this.sliderId; + + //assign event on snap image wrap + this.container.on('touchstart' + eventSuffix + ' mousedown' + eventSuffix, function (estart) { + estart.preventDefault(); + var touchMove = (estart.type == "touchstart" ? "touchmove" : "mousemove") + eventSuffix, + touchEnd = (estart.type == "touchstart" ? "touchend" : "mouseup") + eventSuffix, + eOrginal = estart.originalEvent, + sx = eOrginal.clientX || eOrginal.touches[0].clientX, + sy = eOrginal.clientY || eOrginal.touches[0].clientY; + + var start = self.onStart(estart, { + x: sx, + y: sy + }); + + if (start === false) return; + + var moveListener = function (emove) { + emove.preventDefault(); + + eOrginal = emove.originalEvent; + + //get the cordinates + var mx = eOrginal.clientX || eOrginal.touches[0].clientX, + my = eOrginal.clientY || eOrginal.touches[0].clientY; + + self.onMove(emove, { + dx: mx - sx, + dy: my - sy, + mx: mx, + my: my + }); + + }; + + var endListener = function () { + $document.off(touchMove, moveListener); + $document.off(touchEnd, endListener); + self.onEnd(); + }; + + $document.on(touchMove, moveListener); + $document.on(touchEnd, endListener); + }); + + return this; + } + + + function ImageViewer(container, options) { + var self = this; + + if (container.is('#iv-container')) { + self._fullPage = true; + } + + self.container = container; + options = self.options = $.extend({}, ImageViewer.defaults, options); + + self.zoomValue = 100; + + if (!container.find('.snap-view').length) { + container.prepend(imageViewHtml); + } + + container.addClass('iv-container'); + + if (container.css('position') == 'static') container.css('position', 'relative'); + + self.snapView = container.find('.iv-snap-view'); + self.snapImageWrap = container.find('.iv-snap-image-wrap'); + self.imageWrap = container.find('.iv-image-wrap'); + self.snapHandle = container.find('.iv-snap-handle'); + self.zoomHandle = container.find('.iv-zoom-handle'); + self._viewerId = 'iv' + Math.floor(Math.random() * 1000000); + } + + + ImageViewer.prototype = { + constructor: ImageViewer, + _init: function () { + var viewer = this, + options = viewer.options, + zooming = false, // tell weather we are zooming trough touch + container = this.container; + + var eventSuffix = '.' + viewer._viewerId; + + //cache dom refrence + var snapHandle = this.snapHandle; + var snapImgWrap = this.snapImageWrap; + var imageWrap = this.imageWrap; + + var snapSlider = new Slider(snapImgWrap, { + sliderId: viewer._viewerId, + onStart: function () { + + if (!viewer.loaded) return false; + + var handleStyle = snapHandle[0].style; + + this.curHandleTop = parseFloat(handleStyle.top); + this.curHandleLeft = parseFloat(handleStyle.left); + this.handleWidth = parseFloat(handleStyle.width); + this.handleHeight = parseFloat(handleStyle.height); + this.width = snapImgWrap.width(); + this.height = snapImgWrap.height(); + + //stop momentum on image + clearInterval(imageSlider.slideMomentumCheck); + cancelAnimationFrame(imageSlider.sliderMomentumFrame); + }, + onMove: function (e, position) { + var xPerc = this.curHandleLeft + position.dx * 100 / this.width, + yPerc = this.curHandleTop + position.dy * 100 / this.height; + + xPerc = Math.max(0, xPerc); + xPerc = Math.min(100 - this.handleWidth, xPerc); + + yPerc = Math.max(0, yPerc); + yPerc = Math.min(100 - this.handleHeight, yPerc); + + + var containerDim = viewer.containerDim, + imgWidth = viewer.imageDim.w * (viewer.zoomValue / 100), + imgHeight = viewer.imageDim.h * (viewer.zoomValue / 100), + imgLeft = imgWidth < containerDim.w ? (containerDim.w - imgWidth) / 2 : -imgWidth * xPerc / 100, + imgTop = imgHeight < containerDim.h ? (containerDim.h - imgHeight) / 2 : -imgHeight * yPerc / 100; + + snapHandle.css({ + top: yPerc + '%', + left: xPerc + '%' + }) + + viewer.currentImg.css({ + left: imgLeft, + top: imgTop + }) + } + }).init(); + + + /*Add slide interaction to image*/ + var imageSlider = viewer._imageSlider = new Slider(imageWrap, { + sliderId: viewer._viewerId, + onStart: function (e, position) { + if (!viewer.loaded) return false; + if (zooming) return; + var self = this; + snapSlider.onStart(); + self.imgWidth = viewer.imageDim.w * viewer.zoomValue / 100; + self.imgHeight = viewer.imageDim.h * viewer.zoomValue / 100; + + self.positions = [position, position]; + + self.startPosition = position; + + //clear all animation frame and interval + viewer._clearFrames(); + + self.slideMomentumCheck = setInterval(function () { + if (!self.currentPos) return; + self.positions.shift(); + self.positions.push({ + x: self.currentPos.mx, + y: self.currentPos.my + }) + }, 50); + }, + onMove: function (e, position) { + if (zooming) return; + this.currentPos = position; + + snapSlider.onMove(e, { + dx: -position.dx * snapSlider.width / this.imgWidth, + dy: -position.dy * snapSlider.height / this.imgHeight + }); + }, + onEnd: function () { + if (zooming) return; + var self = this; + + var xDiff = this.positions[1].x - this.positions[0].x, + yDiff = this.positions[1].y - this.positions[0].y; + + function momentum() { + if (step <= 60) { + self.sliderMomentumFrame = requestAnimationFrame(momentum); + } + + positionX = positionX + easeOutQuart(step, xDiff / 3, -xDiff / 3, 60); + positionY = positionY + easeOutQuart(step, yDiff / 3, -yDiff / 3, 60) + + + snapSlider.onMove(null, { + dx: -((positionX) * snapSlider.width / self.imgWidth), + dy: -((positionY) * snapSlider.height / self.imgHeight) + }); + step++; + } + + if (Math.abs(xDiff) > 30 || Math.abs(yDiff) > 30) { + var step = 1, + positionX = self.currentPos.dx, + positionY = self.currentPos.dy; + + momentum(); + } + } + }).init(); + + + /*Add zoom interation in mouse wheel*/ + var changedDelta = 0; + imageWrap.on("mousewheel" + eventSuffix + " DOMMouseScroll" + eventSuffix, function (e) { + if(!options.zoomOnMouseWheel) return; + + if (!viewer.loaded) return; + + + //clear all animation frame and interval + viewer._clearFrames(); + + // cross-browser wheel delta + var delta = Math.max(-1, Math.min(1, (e.originalEvent.wheelDelta || -e.originalEvent.detail))), + zoomValue = viewer.zoomValue * (100 + delta * ZOOM_CONSTANT) / 100; + + if(!(zoomValue >= 100 && zoomValue <= options.maxZoom)){ + changedDelta += Math.abs(delta); + } + else{ + changedDelta = 0; + } + + if(changedDelta > MOUSE_WHEEL_COUNT) return; + + e.preventDefault(); + + var contOffset = container.offset(), + x = (e.pageX || e.originalEvent.pageX) - contOffset.left, + y = (e.pageY || e.originalEvent.pageY) - contOffset.top; + + + + viewer.zoom(zoomValue, { + x: x, + y: y + }); + + //show the snap viewer + showSnapView(); + }); + + + //apply pinch and zoom feature + imageWrap.on('touchstart' + eventSuffix, function (estart) { + if (!viewer.loaded) return; + var touch0 = estart.originalEvent.touches[0], + touch1 = estart.originalEvent.touches[1]; + + if (!(touch0 && touch1)) { + return; + } + + + zooming = true; + + var contOffset = container.offset(); + + var startdist = Math.sqrt(Math.pow(touch1.pageX - touch0.pageX, 2) + Math.pow(touch1.pageY - touch0.pageY, 2)), + startZoom = viewer.zoomValue, + center = { + x: ((touch1.pageX + touch0.pageX) / 2) - contOffset.left, + y: ((touch1.pageY + touch0.pageY) / 2) - contOffset.top + } + + var moveListener = function (emove) { + emove.preventDefault(); + + var touch0 = emove.originalEvent.touches[0], + touch1 = emove.originalEvent.touches[1], + newDist = Math.sqrt(Math.pow(touch1.pageX - touch0.pageX, 2) + Math.pow(touch1.pageY - touch0.pageY, 2)), + zoomValue = startZoom + (newDist - startdist) / 2; + + viewer.zoom(zoomValue, center); + }; + + var endListener = function () { + $document.off('touchmove', moveListener); + $document.off('touchend', endListener); + zooming = false; + }; + + $document.on('touchmove', moveListener); + $document.on('touchend', endListener); + + }); + + + //handle double tap for zoom in and zoom out + var touchtime = 0, + point; + imageWrap.on('click' + eventSuffix, function (e) { + if (touchtime == 0) { + touchtime = Date.now(); + point = { + x: e.pageX, + y: e.pageY + }; + } else { + if ((Date.now() - touchtime) < 500 && Math.abs(e.pageX - point.x) < 50 && Math.abs(e.pageY - point.y) < 50) { + if (viewer.zoomValue == options.zoomValue) { + viewer.zoom(200) + } else { + viewer.resetZoom() + } + touchtime = 0; + } else { + touchtime = 0; + } + } + }); + + //zoom in zoom out using zoom handle + var slider = viewer.snapView.find('.iv-zoom-slider'); + var zoomSlider = new Slider(slider, { + sliderId: viewer._viewerId, + onStart: function (eStart) { + + if (!viewer.loaded) return false; + + this.leftOffset = slider.offset().left; + this.handleWidth = viewer.zoomHandle.width(); + this.onMove(eStart); + + }, + onMove: function (e, position) { + var newLeft = (e.pageX || e.originalEvent.touches[0].pageX) - this.leftOffset - this.handleWidth / 2; + + newLeft = Math.max(0, newLeft); + newLeft = Math.min(viewer._zoomSliderLength, newLeft); + + var zoomValue = 100 + (options.maxZoom - 100) * newLeft / viewer._zoomSliderLength; + + viewer.zoom(zoomValue); + } + }).init(); + + + //display snapView on interaction + var snapViewTimeout, snapViewVisible; + + function showSnapView(noTimeout) { + if(!options.snapView) return; + + if (snapViewVisible || viewer.zoomValue <= 100 || !viewer.loaded) return; + clearTimeout(snapViewTimeout); + snapViewVisible = true; + viewer.snapView.css('opacity', 1); + if (!noTimeout) { + snapViewTimeout = setTimeout(function () { + viewer.snapView.css('opacity', 0); + snapViewVisible = false; + }, 4000); + } + } + + imageWrap.on('touchmove' + eventSuffix + ' mousemove' + eventSuffix, function () { + showSnapView(); + }); + + var snapEventsCallback = {}; + snapEventsCallback['mouseenter' + eventSuffix + ' touchstart' + eventSuffix] = function () { + snapViewVisible = false; + showSnapView(true); + }; + + snapEventsCallback['mouseleave' + eventSuffix + ' touchend' + eventSuffix] = function () { + snapViewVisible = false; + showSnapView(); + }; + + viewer.snapView.on(snapEventsCallback); + + + //calculate elments size on window resize + if (options.refreshOnResize) $window.on('resize' + eventSuffix, function () { + viewer.refresh() + }); + + if (viewer._fullPage) { + //prevent scrolling the backside if container if fixed positioned + container.on('touchmove' + eventSuffix + ' mousewheel' + eventSuffix + ' DOMMouseScroll' + eventSuffix, function (e) { + e.preventDefault(); + }); + + //assign event on close button + container.find('.iv-close').on('click' + eventSuffix, function () { + viewer.hide(); + }); + } + }, + + //method to zoom images + zoom: function (perc, point) { + perc = Math.round(Math.max(100, perc)); + perc = Math.min(this.options.maxZoom, perc); + + point = point || { + x: this.containerDim.w / 2, + y: this.containerDim.h / 2 + }; + + var self = this, + maxZoom = this.options.maxZoom, + curPerc = this.zoomValue, + curImg = this.currentImg, + containerDim = this.containerDim, + curLeft = parseFloat(curImg.css('left')), + curTop = parseFloat(curImg.css('top')); + + self._clearFrames(); + + var step = 0; + + //calculate base top,left,bottom,right + var containerDim = self.containerDim, + imageDim = self.imageDim; + var baseLeft = (containerDim.w - imageDim.w) / 2, + baseTop = (containerDim.h - imageDim.h) / 2, + baseRight = containerDim.w - baseLeft, + baseBottom = containerDim.h - baseTop; + + function zoom() { + step++; + + if (step < 20) { + self._zoomFrame = requestAnimationFrame(zoom); + } + + var tickZoom = easeOutQuart(step, curPerc, perc - curPerc, 20); + + + var ratio = tickZoom / curPerc, + imgWidth = self.imageDim.w * tickZoom / 100, + imgHeight = self.imageDim.h * tickZoom / 100, + newLeft = -((point.x - curLeft) * ratio - point.x), + newTop = -((point.y - curTop) * ratio - point.y); + + //fix for left and top + newLeft = Math.min(newLeft, baseLeft); + newTop = Math.min(newTop, baseTop); + + //fix for right and bottom + if((newLeft + imgWidth) < baseRight){ + newLeft = baseRight - imgWidth; //newLeft - (newLeft + imgWidth - baseRight) + } + + if((newTop + imgHeight) < baseBottom){ + newTop = baseBottom - imgHeight; //newTop + (newTop + imgHeight - baseBottom) + } + + + curImg.css({ + height: imgHeight + 'px', + width: imgWidth + 'px', + left: newLeft + 'px', + top: newTop + 'px' + }); + + self.zoomValue = tickZoom; + + self._resizeHandle(imgWidth, imgHeight, newLeft, newTop); + + //update zoom handle position + self.zoomHandle.css('left', ((tickZoom - 100) * self._zoomSliderLength) / (maxZoom - 100) + 'px'); + } + + zoom(); + }, + _clearFrames: function () { + clearInterval(this._imageSlider.slideMomentumCheck); + cancelAnimationFrame(this._imageSlider.sliderMomentumFrame); + cancelAnimationFrame(this._zoomFrame) + }, + resetZoom: function () { + this.zoom(this.options.zoomValue); + }, + //calculate dimensions of image, container and reset the image + _calculateDimensions: function () { + //calculate content width of image and snap image + var self = this, + curImg = self.currentImg, + container = self.container, + snapView = self.snapView, + imageWidth = curImg.width(), + imageHeight = curImg.height(), + contWidth = container.width(), + contHeight = container.height(), + snapViewWidth = snapView.innerWidth(), + snapViewHeight = snapView.innerHeight(); + + //set the container dimension + self.containerDim = { + w: contWidth, + h: contHeight + } + + //set the image dimension + var imgWidth, imgHeight, ratio = imageWidth / imageHeight; + + imgWidth = (imageWidth > imageHeight && contHeight >= contWidth) || ratio * contHeight > contWidth ? contWidth : ratio * contHeight; + + imgHeight = imgWidth / ratio; + + self.imageDim = { + w: imgWidth, + h: imgHeight + } + + //reset image position and zoom + curImg.css({ + width: imgWidth + 'px', + height: imgHeight + 'px', + left: (contWidth - imgWidth) / 2 + 'px', + top: (contHeight - imgHeight) / 2 + 'px', + 'max-width': 'none', + 'max-height': 'none' + }); + + //set the snap Image dimension + var snapWidth = imgWidth > imgHeight ? snapViewWidth : imgWidth * snapViewHeight / imgHeight, + snapHeight = imgHeight > imgWidth ? snapViewHeight : imgHeight * snapViewWidth / imgWidth; + + self.snapImageDim = { + w: snapWidth, + h: snapHeight + } + + self.snapImg.css({ + width: snapWidth, + height: snapHeight + }); + + //calculate zoom slider area + self._zoomSliderLength = snapViewWidth - self.zoomHandle.outerWidth(); + + }, + refresh: function () { + if (!this.loaded) return; + this._calculateDimensions(); + this.resetZoom(); + }, + _resizeHandle: function (imgWidth, imgHeight, imgLeft, imgTop) { + var curImg = this.currentImg, + imageWidth = imgWidth || this.imageDim.w * this.zoomValue / 100, + imageHeight = imgHeight || this.imageDim.h * this.zoomValue / 100, + left = Math.max(-(imgLeft || parseFloat(curImg.css('left'))) * 100 / imageWidth, 0), + top = Math.max(-(imgTop || parseFloat(curImg.css('top'))) * 100 / imageHeight, 0), + handleWidth = Math.min(this.containerDim.w * 100 / imageWidth, 100), + handleHeight = Math.min(this.containerDim.h * 100 / imageHeight, 100); + + + this.snapHandle.css({ + top: top + '%', + left: left + '%', + width: handleWidth + '%', + height: handleHeight + '%' + }); + }, + show: function (image, hiResImg) { + if (this._fullPage) { + this.container.show(); + if (image) this.load(image, hiResImg); + } + }, + hide: function () { + if (this._fullPage) { + this.container.hide(); + } + }, + options: function (key, value) { + if (!value) return this.options[key]; + + this.options[key] = value; + }, + destroy: function (key, value) { + var eventSuffix = '.' + this._viewerId; + if (this._fullPage) { + container.off(eventSuffix); + container.find('[class^="iv"]').off(eventSuffix); + } else { + this.container.remove('[class^="iv"]'); + } + $window.off(eventSuffix); + return null; + }, + load: function (image, hiResImgSrc) { + var self = this, + container = this.container; + + container.find('.iv-snap-image,.iv-large-image').remove(); + var snapImageWrap = this.container.find('.iv-snap-image-wrap'); + + var snapImage = new Image + snapImage.className = 'iv-snap-image' + snapImage.src = image + + var largeImage = new Image + largeImage.className = 'iv-large-image' + + var hiResImg; + + snapImageWrap.prepend(snapImage); + this.imageWrap.prepend(largeImage); + + var currentImg = this.currentImg = $(largeImage); + this.snapImg = $(snapImage); + self.loaded = false; + + //show loader + container.find('.iv-loader').show(); + currentImg.hide(); + self.snapImg.hide(); + + //refresh the view + function refreshView() { + self.loaded = true; + self.zoomValue = 100; + + //reset zoom of images + currentImg.show(); + self.snapImg.show(); + self.refresh(); + self.resetZoom(); + + //hide loader + container.find('.iv-loader').hide(); + openTime = Date.now() + $(currentImg).click(function(){ + console.log('cliiiiiiiiiick') + if (openTime + 1000 < Date.now()) { + $('.im-close').trigger('click') + } + }) + } + + var loaded = false + largeImage.onload = function(){ + if (loaded) return + loaded = true + refreshView() + } + if (hiResImgSrc) { + largeImage.src = hiResImgSrc + } else { + largeImage.src = image + } + if (largeImage.complete) largeImage.onload() + } + } + + ImageViewer.defaults = { + zoomValue: 100, + snapView: true, + maxZoom: 500, + refreshOnResize: true, + zoomOnMouseWheel : true + } + + window.ImageViewer = function (container, options) { + var imgElm, imgSrc, hiResImg; + if (!(container && (typeof container == "string" || container instanceof Element || container[0] instanceof Element))) { + options = container; + container = $('#iv-container'); + } + + container = $(container); + + if (container.is('img')) { + imgElm = container; + imgSrc = imgElm[0].src; + hiResImg = imgElm.attr('high-res-src') || imgElm.attr('data-high-res-src'); + container = imgElm.wrap('<div class="iv-container" style="display:inline-block; overflow:hidden"></div>').parent(); + imgElm.css({ + opacity: 0, + position: 'relative', + zIndex: -1 + }); + } else { + imgSrc = container.attr('src') || container.attr('data-src'); + hiResImg = container.attr('high-res-src') || container.attr('data-high-res-src'); + } + + + var viewer = new ImageViewer(container, options); + viewer._init(); + + if (imgSrc) viewer.load(imgSrc, hiResImg); + + return viewer; + }; + + + $.fn.ImageViewer = function (options) { + return this.each(function () { + var $this = $(this); + var viewer = window.ImageViewer($this, options); + $this.data('ImageViewer', viewer); + }); + } + +}((window.jQuery), window, document));
\ No newline at end of file diff --git a/StoneIsland/platforms/ios/www/css/products.css b/StoneIsland/platforms/ios/www/css/products.css index 1f858898..532beb69 100755 --- a/StoneIsland/platforms/ios/www/css/products.css +++ b/StoneIsland/platforms/ios/www/css/products.css @@ -232,9 +232,9 @@ } #collection .content { -position:relative; -padding-top:45px; -padding-bottom:45px; + position:relative; + padding-top:45px; + padding-bottom:45px; } #collection h1 { @@ -252,3 +252,7 @@ padding-bottom:45px; z-index:9 } +.red { + color: red; +} + diff --git a/StoneIsland/platforms/ios/www/css/vendor/imageviewer.css b/StoneIsland/platforms/ios/www/css/vendor/imageviewer.css new file mode 100644 index 00000000..dedbb7de --- /dev/null +++ b/StoneIsland/platforms/ios/www/css/vendor/imageviewer.css @@ -0,0 +1,227 @@ +/* + ImageViewer v 1.1.0 + Author: Sudhanshu Yadav + Copyright (c) 2015 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license. + Demo on: http://ignitersworld.com/lab/imageViewer.html +*/ + +/***** image viewer css *****/ +#iv-container { + position: fixed; + background: #ffffff; + width: 100%; + height: 100%; + top: 0; + left: 0; + display: none; + z-index: 1000; +} + +.iv-container { + overflow: hidden; +} + +.iv-close { + width: 32px; + height: 32px; + position: fixed; + right: 20px; + top: 20px; + cursor: pointer; + text-align: center; + overflow: hidden; + text-shadow: 0px 0px 3px #6d6d6d; + -webkit-transition: all ease 200ms; + -moz-transition: all ease 200ms; + -o-transition: all ease 200ms; + transition: all ease 200ms; +} +.iv-close:after, +.iv-close:before { + content: ""; + height: 4px; + width: 32px; + background: #000; + position: absolute; + left: 0; + top: 50%; + margin-top: -2px; +} +.iv-close:before { + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -ms-transform: rotate(45deg); + -o-transform: rotate(45deg); + transform: rotate(45deg); +} +.iv-close:after { + -webkit-transform: rotate(-45deg); + -moz-transform: rotate(-45deg); + -ms-transform: rotate(-45deg); + -o-transform: rotate(-45deg); + transform: rotate(-45deg); +} +.iv-close:hover { + -webkit-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -ms-transform: rotate(90deg); + -o-transform: rotate(90deg); + transform: rotate(90deg); +} +/***** snap view css *****/ +.iv-snap-view { + display: none !important; + width: 150px; + height: 150px; + position: absolute; + top: 20px; + left: 20px; + border: 1px solid #666; + background: black; + z-index: 100; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-transition: all ease 400ms; + -moz-transition: all ease 400ms; + -o-transition: all ease 400ms; + transition: all ease 400ms; + opacity: 0; +} + +.iv-snap-image-wrap { + display: inline-block; + position: absolute; + max-width: 150px; + max-height: 150px; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + overflow: hidden; +} + +.iv-snap-image { + position: relative; +} + +.iv-snap-handle { + position: absolute; + border: 1px solid #ccc; + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + -webkit-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); + -moz-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); + box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); +} + +/*** zoom slider ***/ +.iv-zoom-slider { + width: 100%; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + border: 1px solid #666; + border-top: 0; + background: rgba(204, 204, 204, 0.1); + height: 15px; + position: absolute; + top: 150px; + left: -1px; +} + +.iv-zoom-handle { + width: 20px; + height: 15px; + background: #ccc; + position: absolute; +} + +/**** snap view css end *****/ +.iv-image-view { + position: absolute; + height: 100%; + width: 100%; +} + +.iv-image-wrap { + display: inline-block; +} + +.iv-image-wrap:active { + cursor: move; +} + +.iv-large-image { + max-width: 100%; + max-height: 100%; + position: absolute; + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} + +/****** CSS loader by http://projects.lukehaas.me/css-loaders/ *****/ +.iv-loader { + top: 50%; + left: 50%; + border-radius: 50%; + width: 32px; + height: 32px; + z-index: 100; + margin-top: -16px; + margin-left: -16px; + font-size: 5px; + position: absolute; + text-indent: -9999em; + border-top: 1.1em solid rgba(255, 255, 255, 0.2); + border-right: 1.1em solid rgba(255, 255, 255, 0.2); + border-bottom: 1.1em solid rgba(255, 255, 255, 0.2); + border-left: 1.1em solid #ffffff; + -webkit-transform: translateZ(0); + -ms-transform: translateZ(0); + transform: translateZ(0); + -webkit-animation: load8 1.1s infinite linear; + animation: load8 1.1s infinite linear; +} +.iv-loader:after { + width: 10em; + height: 10em; + border-radius: 50%; +} +@-webkit-keyframes load8 { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@keyframes load8 { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + + +@media screen and (max-width: 767px) { + .iv-snap-view { + z-index: -1; + visibility: hidden; + } +} diff --git a/StoneIsland/platforms/ios/www/db.json b/StoneIsland/platforms/ios/www/db.json index 71fb3826..f8067d3d 100644 --- a/StoneIsland/platforms/ios/www/db.json +++ b/StoneIsland/platforms/ios/www/db.json @@ -3418,7 +3418,7 @@ "Departments": [ { "text": "APP_PERTEX_USCA", - "uri": "PPPRTXSC" + "uri": "PPSFTSHLLSC" } ], "StoreStatus": "open", diff --git a/StoneIsland/platforms/ios/www/index.html b/StoneIsland/platforms/ios/www/index.html index fb5a3c0a..943b2b05 100755 --- a/StoneIsland/platforms/ios/www/index.html +++ b/StoneIsland/platforms/ios/www/index.html @@ -20,6 +20,7 @@ <link rel="stylesheet" type="text/css" href="css/fonts/fonts.css"> <link rel="stylesheet" type="text/css" href="css/fonts/ionicons.css"> <link rel="stylesheet" type="text/css" href="css/vendor/flickity.css"> + <link rel="stylesheet" type="text/css" href="css/vendor/imageviewer.css"> <link rel="stylesheet" type="text/css" href="css/index.css"> <link rel="stylesheet" type="text/css" href="css/nav.css"> <link rel="stylesheet" type="text/css" href="css/account.css"> @@ -1087,6 +1088,7 @@ <script src="js/vendor/lodash.min.js"></script> <script src="js/vendor/moment.js"></script> <script src="js/vendor/oktween.js"></script> +<script src="js/vendor/imageviewer.js"></script> <script src="js/vendor/prefixfree.js"></script> <script src="js/vendor/promise.js"></script> <script src="js/vendor/flickity.pkgd.js"></script> diff --git a/StoneIsland/platforms/ios/www/js/index.js b/StoneIsland/platforms/ios/www/js/index.js index 164d98cc..9b54ad44 100755 --- a/StoneIsland/platforms/ios/www/js/index.js +++ b/StoneIsland/platforms/ios/www/js/index.js @@ -127,6 +127,7 @@ var app = (function(){ if (window.deepLinkRoute) { app.router.go(window.deepLinkRoute) } + app.fullscreenViewer = ImageViewer() $("body").removeClass("loading") } diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js index 6eea977f..55320e7c 100755 --- a/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/BlogView.js @@ -97,6 +97,11 @@ var BlogView = View.extend({ app.store.FittingCodes.split("\n").forEach(function(code){ app.product.fitLargeCodes[code] = true }) + if (app.store.FitsLarge === 'use_alt_text' && (app.store.FitsLargeText || "").length) { + var fit_lines = app.store.FitsLargeText.split('\n').replace(/</g, "<").replace(/>/g, "&rt;").join("<br>") + $('.fit').html(fit_lines) + $('.fit').addClass('altText') + } } if (app.store.BackgroundIsGray === "true") { diff --git a/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js b/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js index 20046fdf..c09dd3b3 100755 --- a/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js +++ b/StoneIsland/platforms/ios/www/js/lib/blogs/HubView.js @@ -74,7 +74,7 @@ var HubView = ScrollableView.extend({ el.className = "item" $gallery.append(el) }) - this.galleries[row.id] = new Flickity( ".gallery-" + row.id, { + var gallery = this.galleries[row.id] = new Flickity( ".gallery-" + row.id, { selector: '.item', cellAlign: 'center', autoPlay: false, @@ -86,6 +86,10 @@ var HubView = ScrollableView.extend({ contain: true, draggable: true, }) + gallery.on('staticClick', function(e){ + var url = gallery.selectedElement.style.backgroundImage.replace(/url\(\"?/,"").replace(/\"?\)/,"") + app.fullscreenViewer.show(url, url) + }) } else { // single image @@ -108,6 +112,10 @@ var HubView = ScrollableView.extend({ var ytid = (url.match(/v=([-_a-zA-Z0-9]{11})/i) || url.match(/youtu.be\/([-_a-zA-Z0-9]{11})/i) || url.match(/embed\/([-_a-zA-Z0-9]{11})/i))[1].split('&')[0]; e.style.backgroundImage = "url(https://i.ytimg.com/vi/" + ytid + "/maxresdefault.jpg" } + } else { + $(el).click(function(){ + app.fullscreenViewer.show(row.image[0].uri) + }) } $t.find(".gallery-left").remove() $t.find(".gallery-right").remove() diff --git a/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js b/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js index 1428aca9..0c928739 100755 --- a/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js +++ b/StoneIsland/platforms/ios/www/js/lib/products/GalleryView.js @@ -9,6 +9,7 @@ var GalleryView = View.extend({ // "touchstart .gallery": "touchstart", // "touchmove .gallery": "touchmove", // "touchend .gallery": "touchend", + "click": "click", }, initialize: function(){ @@ -22,21 +23,27 @@ var GalleryView = View.extend({ populate: function(code, image_ids){ var valid_styles = {} + var large_styles = this.large_styles = {} image_ids.forEach(function(id){ if (id.indexOf("_") == -1) return var partz = id.split("_") var size = parseInt(partz[0]), style = partz[1] + + if (! large_styles[style] || large_styles[style] < size) { + large_styles[style] = size + } if (size > 13) return; if (! valid_styles[style] || valid_styles[style] < size) { valid_styles[style] = size } }) + Object.keys(valid_styles).sort(sort_image_styles).forEach(function(style){ var id = valid_styles[style] + "_" + style var t = this.template.replace(/{{image}}/, sdk.image(code, id)) this.$el.append(t) }.bind(this)) - + this.gallery = new Flickity( "#gallery", { selector: '.item', cellAlign: 'center', @@ -50,7 +57,18 @@ var GalleryView = View.extend({ draggable: true, }) }, - + click: function(e){ + var currentImage = this.gallery.selectedElement.style.backgroundImage.replace(/url\(\"?/,"").replace(/\"?\)/,"") + var partz = currentImage.split("_") + var head = partz[0] + var size = partz[1] + var tail = partz[2] + var end_partz = tail.split(/\./) + var style = end_partz[0] + var largest_size = this.large_styles[style] + var hiresImage = [head, largest_size, tail].join("_") + app.fullscreenViewer.show(currentImage, hiresImage) + }, touchstart: function(e){ }, touchmove: function(e){ diff --git a/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js b/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js index 214819cf..97654a3f 100755 --- a/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js +++ b/StoneIsland/platforms/ios/www/js/lib/products/ProductView.js @@ -183,6 +183,15 @@ var ProductView = ScrollableView.extend({ console.log( data['DefaultCode10'] ) + if (title.indexOf('<br>') !== -1) { + var title_lines = title.split('<br>').map(function(s){ + if (s.indexOf("LIMITED EDITION")) { + return "<span class='red'>" + s + "</span>" + } + return s + }) + title = title_lines.join('<br><br>') + } this.$title.html(title) this.$type.html(type) this.$price.html(price) diff --git a/StoneIsland/platforms/ios/www/js/vendor/imageviewer.js b/StoneIsland/platforms/ios/www/js/vendor/imageviewer.js new file mode 100644 index 00000000..0efebf1d --- /dev/null +++ b/StoneIsland/platforms/ios/www/js/vendor/imageviewer.js @@ -0,0 +1,816 @@ +/* + ImageViewer v 1.1.3 + Author: Sudhanshu Yadav + Copyright (c) 2015-2016 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license. + Demo on: http://ignitersworld.com/lab/imageViewer.html +*/ + +/*** picture view plugin ****/ +(function ($, window, document, undefined) { + "use strict"; + + //an empty function + var noop = function () {}; + + var $body = $('body'), + $window = $(window), + $document = $(document); + + var openTime = 0 + + //constants + var ZOOM_CONSTANT = 15; //increase or decrease value for zoom on mouse wheel + var MOUSE_WHEEL_COUNT = 5; //A mouse delta after which it should stop preventing default behaviour of mouse wheel + + //ease out method + /* + t : current time, + b : intial value, + c : changed value, + d : duration + */ + function easeOutQuart(t, b, c, d) { + t /= d; + t--; + return -c * (t * t * t * t - 1) + b; + }; + + + // http://paulirish.com/2011/requestanimationframe-for-smart-animating/ + // http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating + + // requestAnimationFrame polyfill by Erik Möller + // fixes from Paul Irish and Tino Zijdel + + (function () { + var lastTime = 0; + var vendors = ['ms', 'moz', 'webkit', 'o']; + for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { + window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame']; + window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || window[vendors[x] + 'CancelRequestAnimationFrame']; + } + + if (!window.requestAnimationFrame) + window.requestAnimationFrame = function (callback, element) { + var currTime = new Date().getTime(); + var timeToCall = Math.max(0, 16 - (currTime - lastTime)); + var id = window.setTimeout(function () { + callback(currTime + timeToCall); + }, + timeToCall); + lastTime = currTime + timeToCall; + return id; + }; + + if (!window.cancelAnimationFrame) + window.cancelAnimationFrame = function (id) { + clearTimeout(id); + }; + }()); + + //function to check if image is loaded + function imageLoaded(img) { + return img.complete && (typeof img.naturalWidth === 'undefined' || img.naturalWidth !== 0); + } + + var imageViewHtml = '<div class="iv-loader"></div>' + + '<div class="iv-snap-view">' + + '<div class="iv-snap-image-wrap">' + + '<div class="iv-snap-handle"></div>' + + '</div>' + + '<div class="iv-zoom-slider"><div class="iv-zoom-handle"></div></div>' + + '</div>' + + '<div class="iv-image-view"><div class="iv-image-wrap" ></div></div>'; + + //add a full screen view + $(function () { + if(!$body.length) $body = $('body'); + $body.append('<div id="iv-container">' + imageViewHtml + '<div class="iv-close"></div><div>'); + imageViewHtml = null + }); + + function Slider(container, options) { + this.container = container; + this.onStart = options.onStart || noop; + this.onMove = options.onMove || noop; + this.onEnd = options.onEnd || noop; + this.sliderId = options.sliderId || 'slider' + Math.ceil(Math.random() * 1000000); + } + + Slider.prototype.init = function () { + var self = this, + container = this.container, + eventSuffix = '.' + this.sliderId; + + //assign event on snap image wrap + this.container.on('touchstart' + eventSuffix + ' mousedown' + eventSuffix, function (estart) { + estart.preventDefault(); + var touchMove = (estart.type == "touchstart" ? "touchmove" : "mousemove") + eventSuffix, + touchEnd = (estart.type == "touchstart" ? "touchend" : "mouseup") + eventSuffix, + eOrginal = estart.originalEvent, + sx = eOrginal.clientX || eOrginal.touches[0].clientX, + sy = eOrginal.clientY || eOrginal.touches[0].clientY; + + var start = self.onStart(estart, { + x: sx, + y: sy + }); + + if (start === false) return; + + var moveListener = function (emove) { + emove.preventDefault(); + + eOrginal = emove.originalEvent; + + //get the cordinates + var mx = eOrginal.clientX || eOrginal.touches[0].clientX, + my = eOrginal.clientY || eOrginal.touches[0].clientY; + + self.onMove(emove, { + dx: mx - sx, + dy: my - sy, + mx: mx, + my: my + }); + + }; + + var endListener = function () { + $document.off(touchMove, moveListener); + $document.off(touchEnd, endListener); + self.onEnd(); + }; + + $document.on(touchMove, moveListener); + $document.on(touchEnd, endListener); + }); + + return this; + } + + + function ImageViewer(container, options) { + var self = this; + + if (container.is('#iv-container')) { + self._fullPage = true; + } + + self.container = container; + options = self.options = $.extend({}, ImageViewer.defaults, options); + + self.zoomValue = 100; + + if (!container.find('.snap-view').length) { + container.prepend(imageViewHtml); + } + + container.addClass('iv-container'); + + if (container.css('position') == 'static') container.css('position', 'relative'); + + self.snapView = container.find('.iv-snap-view'); + self.snapImageWrap = container.find('.iv-snap-image-wrap'); + self.imageWrap = container.find('.iv-image-wrap'); + self.snapHandle = container.find('.iv-snap-handle'); + self.zoomHandle = container.find('.iv-zoom-handle'); + self._viewerId = 'iv' + Math.floor(Math.random() * 1000000); + } + + + ImageViewer.prototype = { + constructor: ImageViewer, + _init: function () { + var viewer = this, + options = viewer.options, + zooming = false, // tell weather we are zooming trough touch + container = this.container; + + var eventSuffix = '.' + viewer._viewerId; + + //cache dom refrence + var snapHandle = this.snapHandle; + var snapImgWrap = this.snapImageWrap; + var imageWrap = this.imageWrap; + + var snapSlider = new Slider(snapImgWrap, { + sliderId: viewer._viewerId, + onStart: function () { + + if (!viewer.loaded) return false; + + var handleStyle = snapHandle[0].style; + + this.curHandleTop = parseFloat(handleStyle.top); + this.curHandleLeft = parseFloat(handleStyle.left); + this.handleWidth = parseFloat(handleStyle.width); + this.handleHeight = parseFloat(handleStyle.height); + this.width = snapImgWrap.width(); + this.height = snapImgWrap.height(); + + //stop momentum on image + clearInterval(imageSlider.slideMomentumCheck); + cancelAnimationFrame(imageSlider.sliderMomentumFrame); + }, + onMove: function (e, position) { + var xPerc = this.curHandleLeft + position.dx * 100 / this.width, + yPerc = this.curHandleTop + position.dy * 100 / this.height; + + xPerc = Math.max(0, xPerc); + xPerc = Math.min(100 - this.handleWidth, xPerc); + + yPerc = Math.max(0, yPerc); + yPerc = Math.min(100 - this.handleHeight, yPerc); + + + var containerDim = viewer.containerDim, + imgWidth = viewer.imageDim.w * (viewer.zoomValue / 100), + imgHeight = viewer.imageDim.h * (viewer.zoomValue / 100), + imgLeft = imgWidth < containerDim.w ? (containerDim.w - imgWidth) / 2 : -imgWidth * xPerc / 100, + imgTop = imgHeight < containerDim.h ? (containerDim.h - imgHeight) / 2 : -imgHeight * yPerc / 100; + + snapHandle.css({ + top: yPerc + '%', + left: xPerc + '%' + }) + + viewer.currentImg.css({ + left: imgLeft, + top: imgTop + }) + } + }).init(); + + + /*Add slide interaction to image*/ + var imageSlider = viewer._imageSlider = new Slider(imageWrap, { + sliderId: viewer._viewerId, + onStart: function (e, position) { + if (!viewer.loaded) return false; + if (zooming) return; + var self = this; + snapSlider.onStart(); + self.imgWidth = viewer.imageDim.w * viewer.zoomValue / 100; + self.imgHeight = viewer.imageDim.h * viewer.zoomValue / 100; + + self.positions = [position, position]; + + self.startPosition = position; + + //clear all animation frame and interval + viewer._clearFrames(); + + self.slideMomentumCheck = setInterval(function () { + if (!self.currentPos) return; + self.positions.shift(); + self.positions.push({ + x: self.currentPos.mx, + y: self.currentPos.my + }) + }, 50); + }, + onMove: function (e, position) { + if (zooming) return; + this.currentPos = position; + + snapSlider.onMove(e, { + dx: -position.dx * snapSlider.width / this.imgWidth, + dy: -position.dy * snapSlider.height / this.imgHeight + }); + }, + onEnd: function () { + if (zooming) return; + var self = this; + + var xDiff = this.positions[1].x - this.positions[0].x, + yDiff = this.positions[1].y - this.positions[0].y; + + function momentum() { + if (step <= 60) { + self.sliderMomentumFrame = requestAnimationFrame(momentum); + } + + positionX = positionX + easeOutQuart(step, xDiff / 3, -xDiff / 3, 60); + positionY = positionY + easeOutQuart(step, yDiff / 3, -yDiff / 3, 60) + + + snapSlider.onMove(null, { + dx: -((positionX) * snapSlider.width / self.imgWidth), + dy: -((positionY) * snapSlider.height / self.imgHeight) + }); + step++; + } + + if (Math.abs(xDiff) > 30 || Math.abs(yDiff) > 30) { + var step = 1, + positionX = self.currentPos.dx, + positionY = self.currentPos.dy; + + momentum(); + } + } + }).init(); + + + /*Add zoom interation in mouse wheel*/ + var changedDelta = 0; + imageWrap.on("mousewheel" + eventSuffix + " DOMMouseScroll" + eventSuffix, function (e) { + if(!options.zoomOnMouseWheel) return; + + if (!viewer.loaded) return; + + + //clear all animation frame and interval + viewer._clearFrames(); + + // cross-browser wheel delta + var delta = Math.max(-1, Math.min(1, (e.originalEvent.wheelDelta || -e.originalEvent.detail))), + zoomValue = viewer.zoomValue * (100 + delta * ZOOM_CONSTANT) / 100; + + if(!(zoomValue >= 100 && zoomValue <= options.maxZoom)){ + changedDelta += Math.abs(delta); + } + else{ + changedDelta = 0; + } + + if(changedDelta > MOUSE_WHEEL_COUNT) return; + + e.preventDefault(); + + var contOffset = container.offset(), + x = (e.pageX || e.originalEvent.pageX) - contOffset.left, + y = (e.pageY || e.originalEvent.pageY) - contOffset.top; + + + + viewer.zoom(zoomValue, { + x: x, + y: y + }); + + //show the snap viewer + showSnapView(); + }); + + + //apply pinch and zoom feature + imageWrap.on('touchstart' + eventSuffix, function (estart) { + if (!viewer.loaded) return; + var touch0 = estart.originalEvent.touches[0], + touch1 = estart.originalEvent.touches[1]; + + if (!(touch0 && touch1)) { + return; + } + + + zooming = true; + + var contOffset = container.offset(); + + var startdist = Math.sqrt(Math.pow(touch1.pageX - touch0.pageX, 2) + Math.pow(touch1.pageY - touch0.pageY, 2)), + startZoom = viewer.zoomValue, + center = { + x: ((touch1.pageX + touch0.pageX) / 2) - contOffset.left, + y: ((touch1.pageY + touch0.pageY) / 2) - contOffset.top + } + + var moveListener = function (emove) { + emove.preventDefault(); + + var touch0 = emove.originalEvent.touches[0], + touch1 = emove.originalEvent.touches[1], + newDist = Math.sqrt(Math.pow(touch1.pageX - touch0.pageX, 2) + Math.pow(touch1.pageY - touch0.pageY, 2)), + zoomValue = startZoom + (newDist - startdist) / 2; + + viewer.zoom(zoomValue, center); + }; + + var endListener = function () { + $document.off('touchmove', moveListener); + $document.off('touchend', endListener); + zooming = false; + }; + + $document.on('touchmove', moveListener); + $document.on('touchend', endListener); + + }); + + + //handle double tap for zoom in and zoom out + var touchtime = 0, + point; + imageWrap.on('click' + eventSuffix, function (e) { + if (touchtime == 0) { + touchtime = Date.now(); + point = { + x: e.pageX, + y: e.pageY + }; + } else { + if ((Date.now() - touchtime) < 500 && Math.abs(e.pageX - point.x) < 50 && Math.abs(e.pageY - point.y) < 50) { + if (viewer.zoomValue == options.zoomValue) { + viewer.zoom(200) + } else { + viewer.resetZoom() + } + touchtime = 0; + } else { + touchtime = 0; + } + } + }); + + //zoom in zoom out using zoom handle + var slider = viewer.snapView.find('.iv-zoom-slider'); + var zoomSlider = new Slider(slider, { + sliderId: viewer._viewerId, + onStart: function (eStart) { + + if (!viewer.loaded) return false; + + this.leftOffset = slider.offset().left; + this.handleWidth = viewer.zoomHandle.width(); + this.onMove(eStart); + + }, + onMove: function (e, position) { + var newLeft = (e.pageX || e.originalEvent.touches[0].pageX) - this.leftOffset - this.handleWidth / 2; + + newLeft = Math.max(0, newLeft); + newLeft = Math.min(viewer._zoomSliderLength, newLeft); + + var zoomValue = 100 + (options.maxZoom - 100) * newLeft / viewer._zoomSliderLength; + + viewer.zoom(zoomValue); + } + }).init(); + + + //display snapView on interaction + var snapViewTimeout, snapViewVisible; + + function showSnapView(noTimeout) { + if(!options.snapView) return; + + if (snapViewVisible || viewer.zoomValue <= 100 || !viewer.loaded) return; + clearTimeout(snapViewTimeout); + snapViewVisible = true; + viewer.snapView.css('opacity', 1); + if (!noTimeout) { + snapViewTimeout = setTimeout(function () { + viewer.snapView.css('opacity', 0); + snapViewVisible = false; + }, 4000); + } + } + + imageWrap.on('touchmove' + eventSuffix + ' mousemove' + eventSuffix, function () { + showSnapView(); + }); + + var snapEventsCallback = {}; + snapEventsCallback['mouseenter' + eventSuffix + ' touchstart' + eventSuffix] = function () { + snapViewVisible = false; + showSnapView(true); + }; + + snapEventsCallback['mouseleave' + eventSuffix + ' touchend' + eventSuffix] = function () { + snapViewVisible = false; + showSnapView(); + }; + + viewer.snapView.on(snapEventsCallback); + + + //calculate elments size on window resize + if (options.refreshOnResize) $window.on('resize' + eventSuffix, function () { + viewer.refresh() + }); + + if (viewer._fullPage) { + //prevent scrolling the backside if container if fixed positioned + container.on('touchmove' + eventSuffix + ' mousewheel' + eventSuffix + ' DOMMouseScroll' + eventSuffix, function (e) { + e.preventDefault(); + }); + + //assign event on close button + container.find('.iv-close').on('click' + eventSuffix, function () { + viewer.hide(); + }); + } + }, + + //method to zoom images + zoom: function (perc, point) { + perc = Math.round(Math.max(100, perc)); + perc = Math.min(this.options.maxZoom, perc); + + point = point || { + x: this.containerDim.w / 2, + y: this.containerDim.h / 2 + }; + + var self = this, + maxZoom = this.options.maxZoom, + curPerc = this.zoomValue, + curImg = this.currentImg, + containerDim = this.containerDim, + curLeft = parseFloat(curImg.css('left')), + curTop = parseFloat(curImg.css('top')); + + self._clearFrames(); + + var step = 0; + + //calculate base top,left,bottom,right + var containerDim = self.containerDim, + imageDim = self.imageDim; + var baseLeft = (containerDim.w - imageDim.w) / 2, + baseTop = (containerDim.h - imageDim.h) / 2, + baseRight = containerDim.w - baseLeft, + baseBottom = containerDim.h - baseTop; + + function zoom() { + step++; + + if (step < 20) { + self._zoomFrame = requestAnimationFrame(zoom); + } + + var tickZoom = easeOutQuart(step, curPerc, perc - curPerc, 20); + + + var ratio = tickZoom / curPerc, + imgWidth = self.imageDim.w * tickZoom / 100, + imgHeight = self.imageDim.h * tickZoom / 100, + newLeft = -((point.x - curLeft) * ratio - point.x), + newTop = -((point.y - curTop) * ratio - point.y); + + //fix for left and top + newLeft = Math.min(newLeft, baseLeft); + newTop = Math.min(newTop, baseTop); + + //fix for right and bottom + if((newLeft + imgWidth) < baseRight){ + newLeft = baseRight - imgWidth; //newLeft - (newLeft + imgWidth - baseRight) + } + + if((newTop + imgHeight) < baseBottom){ + newTop = baseBottom - imgHeight; //newTop + (newTop + imgHeight - baseBottom) + } + + + curImg.css({ + height: imgHeight + 'px', + width: imgWidth + 'px', + left: newLeft + 'px', + top: newTop + 'px' + }); + + self.zoomValue = tickZoom; + + self._resizeHandle(imgWidth, imgHeight, newLeft, newTop); + + //update zoom handle position + self.zoomHandle.css('left', ((tickZoom - 100) * self._zoomSliderLength) / (maxZoom - 100) + 'px'); + } + + zoom(); + }, + _clearFrames: function () { + clearInterval(this._imageSlider.slideMomentumCheck); + cancelAnimationFrame(this._imageSlider.sliderMomentumFrame); + cancelAnimationFrame(this._zoomFrame) + }, + resetZoom: function () { + this.zoom(this.options.zoomValue); + }, + //calculate dimensions of image, container and reset the image + _calculateDimensions: function () { + //calculate content width of image and snap image + var self = this, + curImg = self.currentImg, + container = self.container, + snapView = self.snapView, + imageWidth = curImg.width(), + imageHeight = curImg.height(), + contWidth = container.width(), + contHeight = container.height(), + snapViewWidth = snapView.innerWidth(), + snapViewHeight = snapView.innerHeight(); + + //set the container dimension + self.containerDim = { + w: contWidth, + h: contHeight + } + + //set the image dimension + var imgWidth, imgHeight, ratio = imageWidth / imageHeight; + + imgWidth = (imageWidth > imageHeight && contHeight >= contWidth) || ratio * contHeight > contWidth ? contWidth : ratio * contHeight; + + imgHeight = imgWidth / ratio; + + self.imageDim = { + w: imgWidth, + h: imgHeight + } + + //reset image position and zoom + curImg.css({ + width: imgWidth + 'px', + height: imgHeight + 'px', + left: (contWidth - imgWidth) / 2 + 'px', + top: (contHeight - imgHeight) / 2 + 'px', + 'max-width': 'none', + 'max-height': 'none' + }); + + //set the snap Image dimension + var snapWidth = imgWidth > imgHeight ? snapViewWidth : imgWidth * snapViewHeight / imgHeight, + snapHeight = imgHeight > imgWidth ? snapViewHeight : imgHeight * snapViewWidth / imgWidth; + + self.snapImageDim = { + w: snapWidth, + h: snapHeight + } + + self.snapImg.css({ + width: snapWidth, + height: snapHeight + }); + + //calculate zoom slider area + self._zoomSliderLength = snapViewWidth - self.zoomHandle.outerWidth(); + + }, + refresh: function () { + if (!this.loaded) return; + this._calculateDimensions(); + this.resetZoom(); + }, + _resizeHandle: function (imgWidth, imgHeight, imgLeft, imgTop) { + var curImg = this.currentImg, + imageWidth = imgWidth || this.imageDim.w * this.zoomValue / 100, + imageHeight = imgHeight || this.imageDim.h * this.zoomValue / 100, + left = Math.max(-(imgLeft || parseFloat(curImg.css('left'))) * 100 / imageWidth, 0), + top = Math.max(-(imgTop || parseFloat(curImg.css('top'))) * 100 / imageHeight, 0), + handleWidth = Math.min(this.containerDim.w * 100 / imageWidth, 100), + handleHeight = Math.min(this.containerDim.h * 100 / imageHeight, 100); + + + this.snapHandle.css({ + top: top + '%', + left: left + '%', + width: handleWidth + '%', + height: handleHeight + '%' + }); + }, + show: function (image, hiResImg) { + if (this._fullPage) { + this.container.show(); + if (image) this.load(image, hiResImg); + } + }, + hide: function () { + if (this._fullPage) { + this.container.hide(); + } + }, + options: function (key, value) { + if (!value) return this.options[key]; + + this.options[key] = value; + }, + destroy: function (key, value) { + var eventSuffix = '.' + this._viewerId; + if (this._fullPage) { + container.off(eventSuffix); + container.find('[class^="iv"]').off(eventSuffix); + } else { + this.container.remove('[class^="iv"]'); + } + $window.off(eventSuffix); + return null; + }, + load: function (image, hiResImgSrc) { + var self = this, + container = this.container; + + container.find('.iv-snap-image,.iv-large-image').remove(); + var snapImageWrap = this.container.find('.iv-snap-image-wrap'); + + var snapImage = new Image + snapImage.className = 'iv-snap-image' + snapImage.src = image + + var largeImage = new Image + largeImage.className = 'iv-large-image' + + var hiResImg; + + snapImageWrap.prepend(snapImage); + this.imageWrap.prepend(largeImage); + + var currentImg = this.currentImg = $(largeImage); + this.snapImg = $(snapImage); + self.loaded = false; + + //show loader + container.find('.iv-loader').show(); + currentImg.hide(); + self.snapImg.hide(); + + //refresh the view + function refreshView() { + self.loaded = true; + self.zoomValue = 100; + + //reset zoom of images + currentImg.show(); + self.snapImg.show(); + self.refresh(); + self.resetZoom(); + + //hide loader + container.find('.iv-loader').hide(); + openTime = Date.now() + $(currentImg).click(function(){ + console.log('cliiiiiiiiiick') + if (openTime + 1000 < Date.now()) { + $('.im-close').trigger('click') + } + }) + } + + var loaded = false + largeImage.onload = function(){ + if (loaded) return + loaded = true + refreshView() + } + if (hiResImgSrc) { + largeImage.src = hiResImgSrc + } else { + largeImage.src = image + } + if (largeImage.complete) largeImage.onload() + } + } + + ImageViewer.defaults = { + zoomValue: 100, + snapView: true, + maxZoom: 500, + refreshOnResize: true, + zoomOnMouseWheel : true + } + + window.ImageViewer = function (container, options) { + var imgElm, imgSrc, hiResImg; + if (!(container && (typeof container == "string" || container instanceof Element || container[0] instanceof Element))) { + options = container; + container = $('#iv-container'); + } + + container = $(container); + + if (container.is('img')) { + imgElm = container; + imgSrc = imgElm[0].src; + hiResImg = imgElm.attr('high-res-src') || imgElm.attr('data-high-res-src'); + container = imgElm.wrap('<div class="iv-container" style="display:inline-block; overflow:hidden"></div>').parent(); + imgElm.css({ + opacity: 0, + position: 'relative', + zIndex: -1 + }); + } else { + imgSrc = container.attr('src') || container.attr('data-src'); + hiResImg = container.attr('high-res-src') || container.attr('data-high-res-src'); + } + + + var viewer = new ImageViewer(container, options); + viewer._init(); + + if (imgSrc) viewer.load(imgSrc, hiResImg); + + return viewer; + }; + + + $.fn.ImageViewer = function (options) { + return this.each(function () { + var $this = $(this); + var viewer = window.ImageViewer($this, options); + $this.data('ImageViewer', viewer); + }); + } + +}((window.jQuery), window, document));
\ No newline at end of file diff --git a/StoneIsland/www/css/vendor/imageviewer.css b/StoneIsland/www/css/vendor/imageviewer.css index c5709bb4..dedbb7de 100644 --- a/StoneIsland/www/css/vendor/imageviewer.css +++ b/StoneIsland/www/css/vendor/imageviewer.css @@ -24,7 +24,7 @@ .iv-close { width: 32px; height: 32px; - position: absolute; + position: fixed; right: 20px; top: 20px; cursor: pointer; @@ -70,6 +70,7 @@ } /***** snap view css *****/ .iv-snap-view { + display: none !important; width: 150px; height: 150px; position: absolute; diff --git a/StoneIsland/www/js/vendor/imageviewer.js b/StoneIsland/www/js/vendor/imageviewer.js index 9f7087da..0efebf1d 100644 --- a/StoneIsland/www/js/vendor/imageviewer.js +++ b/StoneIsland/www/js/vendor/imageviewer.js @@ -16,6 +16,7 @@ $window = $(window), $document = $(document); + var openTime = 0 //constants var ZOOM_CONSTANT = 15; //increase or decrease value for zoom on mouse wheel @@ -72,12 +73,20 @@ return img.complete && (typeof img.naturalWidth === 'undefined' || img.naturalWidth !== 0); } - var imageViewHtml = '<div class="iv-loader"></div> <div class="iv-snap-view">' + '<div class="iv-snap-image-wrap">' + '<div class="iv-snap-handle"></div>' + '</div>' + '<div class="iv-zoom-slider"><div class="iv-zoom-handle"></div></div></div>' + '<div class="iv-image-view" ><div class="iv-image-wrap" ></div></div>'; + var imageViewHtml = '<div class="iv-loader"></div>' + + '<div class="iv-snap-view">' + + '<div class="iv-snap-image-wrap">' + + '<div class="iv-snap-handle"></div>' + + '</div>' + + '<div class="iv-zoom-slider"><div class="iv-zoom-handle"></div></div>' + + '</div>' + + '<div class="iv-image-view"><div class="iv-image-wrap" ></div></div>'; //add a full screen view $(function () { if(!$body.length) $body = $('body'); $body.append('<div id="iv-container">' + imageViewHtml + '<div class="iv-close"></div><div>'); + imageViewHtml = null }); function Slider(container, options) { @@ -730,6 +739,13 @@ //hide loader container.find('.iv-loader').hide(); + openTime = Date.now() + $(currentImg).click(function(){ + console.log('cliiiiiiiiiick') + if (openTime + 1000 < Date.now()) { + $('.im-close').trigger('click') + } + }) } var loaded = false |