Better image fetching and scaling

tsi · Mar 1, 2017 · 3279eef · 3279eef
1 parent 91c4ba5
commit 3279eef
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 52 deletions.
diff --git a/game/js/puzzled.js b/game/js/puzzled.js
@@ -9,6 +9,7 @@
   }
 
   function setPosition(width, height) {
+
     var pos = {},
         cont = $('.game');
     pos.top = Math.floor((Math.random() * (cont.height() - height)));
@@ -118,32 +119,24 @@
       }
     }).done(function( data ) {
 
-        var photos,
-            randomImg,
-            randomPost;
-
-        for (var i = data.response.posts.length - 1; i >= 0; i--) {
-          randomPost = Math.floor(Math.random() * data.response.posts.length)
-          // console.log(data.response.posts[randomPost]);
-          if (data.response.posts[randomPost].photos) {
-            photos = data.response.posts[randomPost].photos;
-            // console.log(photos);
-            for (var i = photos.length - 1; i >= 0; i--) {
-              randomImg = Math.floor(Math.random() * photos.length);
-              // console.log(photos[randomImg]);
-              if (photos[randomImg].original_size.url) {
-                settings.imgPath = photos[randomImg].original_size.url;
-                break;
-              }
-            };
-            break;
-          }
-          else {
-            alert('Could not find an image. Try again.');
-          }
-        };
+      var posts,
+          photos,
+          randomImg,
+          randomPost;
+
+      posts = data.response.posts.filter(function (post) {
+        return post.type == "photo";
+      });
+
+      try {
+        randomPost = posts[Math.floor(Math.random() * posts.length)];
+        randomImg = randomPost.photos[Math.floor(Math.random() * randomPost.photos.length)];
+        settings.imgPath = randomImg.original_size.url;
+      } catch (error) {
+        alert('Could not find an image. Try again.');
+      }
 
-        getImageDimensions();
+      getImageDimensions();
 
     });
 
@@ -155,18 +148,19 @@
         pageWidth = $(document).width() * widthRatio,
         heightRatio = 1,
         widthRatio = 1,
-        minRation = 1;
+        minRatio = 1;
     $("<img />").attr("src", settings.imgPath).load(function() {
       if (this.height > pageHeight) {
         heightRatio = pageHeight / this.height;
       }
       if (this.width > pageWidth) {
         widthRatio = pageWidth / this.width;
       }
-      minRation = Math.min(heightRatio, widthRatio);
+      minRatio = Math.min(heightRatio, widthRatio);
       settings.image = {
-        width: this.width * minRation * settings.zoom / 100,
-        height: this.height * minRation * settings.zoom / 100
+        // Allow zooming only if image is smaller then page.
+        width: this.width * (minRatio == 1 ? settings.zoom / 100 : minRatio),
+        height: this.height * (minRatio == 1 ? settings.zoom / 100 : minRatio)
       };
       $(document).trigger('puzzled');
     });

diff --git a/index.html b/index.html
@@ -56,9 +56,9 @@
       <label>Share:</label>
       <input type="text" id="share"/>
     </div>
-    <div id="fb-root"></div>
+    <!--<div id="fb-root"></div>
     <div class="fb-like" data-href="http://tsi.github.io/puzzled/" data-send="false" data-layout="button_count" data-width="1" data-show-faces="false"></div>
-    <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal"  data-text="Make A Puzzle by @shlidor">Tweet</a>
+    <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal"  data-text="Make A Puzzle by @shlidor">Tweet</a>-->
     <div class="credit">Made by <a href="http://twitter.com/shlidor">Tsachi Shlidor</a></div>
   </div>
 

diff --git a/js/puzzled-app.js b/js/puzzled-app.js
@@ -137,24 +137,24 @@
 
 })(jQuery);
 
-// Async Sharing Buttons (Facebook, Twitter)
-// http://css-tricks.com/snippets/javascript/async-sharing-buttons-g-facebook-twitter/
-(function(doc, script) {
-  var js,
-      fjs = doc.getElementsByTagName(script)[0],
-      frag = doc.createDocumentFragment(),
-      add = function(url, id) {
-          if (doc.getElementById(id)) {return;}
-          js = doc.createElement(script);
-          js.src = url;
-          id && (js.id = id);
-          frag.appendChild( js );
-      };
-
-    // Facebook SDK
-    add('//connect.facebook.net/en_US/all.js#xfbml=1&appId=200103733347528', 'facebook-jssdk');
-    // Twitter SDK
-    add('//platform.twitter.com/widgets.js');
-
-    fjs.parentNode.insertBefore(frag, fjs);
-}(document, 'script'));
+// // Async Sharing Buttons (Facebook, Twitter)
+// // http://css-tricks.com/snippets/javascript/async-sharing-buttons-g-facebook-twitter/
+// (function(doc, script) {
+//   var js,
+//       fjs = doc.getElementsByTagName(script)[0],
+//       frag = doc.createDocumentFragment(),
+//       add = function(url, id) {
+//           if (doc.getElementById(id)) {return;}
+//           js = doc.createElement(script);
+//           js.src = url;
+//           id && (js.id = id);
+//           frag.appendChild( js );
+//       };
+
+//     // Facebook SDK
+//     add('//connect.facebook.net/en_US/all.js#xfbml=1&appId=200103733347528', 'facebook-jssdk');
+//     // Twitter SDK
+//     add('//platform.twitter.com/widgets.js');
+
+//     fjs.parentNode.insertBefore(frag, fjs);
+// }(document, 'script'));