lentil 0.1.7 → 0.1.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 2d44b83634b22f894a3ab4c92eb52724edd830d2
-  data.tar.gz: 3cd9d69ab0aafa2133af86a2971b0c93db661aad
+  metadata.gz: 6eb56f9468aa49f44f97b76acb8713076fd16845
+  data.tar.gz: 9d8b405b398bbe5cb2158ff23413458e3fd8c140
 SHA512:
-  metadata.gz: db2ea9abc4a69a3653824331911fc3a02293ea6b17558b903012464ad7b2982f3e8846e3dee26d1552c300a05ca98033ded401ad1998ca932568af7d12e08037
-  data.tar.gz: fdb53dccd0ce72c218875884b41f929b9ff6b094f8138fdd8ba2bcf44bd8c8a0130eddf45ccb0291f1ea97f115b8b8665c981895174bb7f739b99f847e62b011
+  metadata.gz: 4c725f7fe7d23d9c408bb7c3f10a739a02034d414ee32a5c6011d781b150d7529a9497fab675a0de8fcb624443d75d87570d169c17070d642d014e5510794b35
+  data.tar.gz: 5ee673035086d54b67b36d63ed47a1cdbe3279361840653234b76cb4755bde61c7e8a4c7b875467fde72e2f8af08f3bd40b2f7f5beadde342af68ef5e4c599ab

data/README.md

@@ -135,6 +135,16 @@ div.header {
 }
 ```
 
+## Special displays
+
+### Embeddable iframe view
+
+This is a simple responsive non-interactive image grid that is intended to be embedded as an iframe. You can find this at `http://YOUR_HOST/images/iframe`.
+
+### Large animated view
+
+This is an example of an animated image grid that is designed for non-interactive displays. We have used customized versions of this on e-boards as well as very large video walls. This view will require some customization based on your project and target display. You can find this at `http://YOUR_HOST/images/animate`.
+
 ## Testing
 
 - Install all of the dependencies:

data/app/assets/javascripts/lentil/addfancybox.js

@@ -78,8 +78,10 @@ function addfancybox() {
         prevEffect  : 'none',
         loop : false,
         minWidth : '250px',
+        type: 'image',
         helpers     : {
-            title   : { type : 'inside' }
+            title   : { type : 'inside' },
+            overlay : { locked : false }
         },
         afterLoad: function(current, previous) {
 

data/app/assets/javascripts/lentil/iframe.js

@@ -0,0 +1,117 @@
+(function () {
+  var Iframe = {
+    init: function () {
+      this.buildFrame();
+      this.attachEvents();
+    },
+    attachEvents: function () {
+      var self = this,
+          images;
+
+      // Remove images that error out
+      images = document.getElementsByClassName('instagram-img');
+      for (var i = 1; i < images.length; i++) {
+        images[i].addEventListener('error', function (e) {
+          e.srcElement.parentNode.remove();
+        }, false);
+      }
+
+      // Respond to viewport changes
+      window.onresize = function (event) {
+        self.buildFrame();
+      };
+    },
+    // Sorting utility based on diff
+    compare: function (a,b) {
+      if (a.diff < b.diff) {
+        return -1;
+      }
+
+      if (a.diff > b.diff) {
+        return 1;
+      }
+
+      return 0;
+    },
+    // Get the range of possible number of columns based on image size
+    calcColumns: function(least, most) {
+      var possibleColumns = [];
+
+      for (var i = least; i < most; i++) {
+        if (possibleColumns.indexOf(i) === -1) {
+          possibleColumns.push(i);
+        }
+      }
+
+      return possibleColumns;
+    },
+    // Using columns, determine maximum floored height based on
+    // the size of the square image. Value represents the difference
+    // between the floored height of rows and the total available height
+    calcOptimumLayout: function (possibleColumns, width, height) {
+      var self = this,
+          layouts = [];
+
+      possibleColumns.forEach(function (columns) {
+        var imageSide,
+            rows;
+
+        imageSide = width/columns;
+        rows = Math.floor(height/imageSide);
+
+        layouts.push({
+          columns: columns,
+          rows: rows,
+          diff: height - (imageSide * rows),
+          visibleHeight: rows * Math.floor(imageSide)
+        });
+      });
+
+      return layouts.sort(self.compare)[0];
+    },
+    buildFrame: function () {
+      var self = this,
+          height,
+          images,
+          largestImage,
+          layout,
+          leastColumns,
+          mostColumns,
+          percent,
+          possibleColumns,
+          smallestImage,
+          width;
+
+      // Width and height of iFrame
+      width = window.innerWidth;
+      height = window.innerHeight;
+
+      // Acceptable image sizes
+      smallestImage = 64;
+      largestImage = 97;
+
+      mostColumns = Math.ceil(width/smallestImage);
+      leastColumns = Math.ceil(width/largestImage);
+      possibleColumns = self.calcColumns(leastColumns, mostColumns);
+      layout = self.calcOptimumLayout(possibleColumns, width, height);
+
+      // Calculate the percent based on the number of columns
+      percent = 100 / layout.columns;
+
+      // Set width of images to build layout
+      images = document.getElementsByClassName('iframe-tile');
+      for (var i = 0; i < images.length; i++) {
+        images[i].style.width = String(percent) + '%';
+      }
+
+      // Set height of wrapper div for overflow
+      document.getElementById('iframe-wrapper').style.height = layout.visibleHeight + 'px';
+    }
+  };
+
+  document.onreadystatechange = function () {
+    if (document.readyState == "interactive") {
+      Iframe.init();
+    }
+  };
+}());

data/app/assets/javascripts/lentil/thisorthat.js.erb

@@ -20,11 +20,12 @@
     };
 
     $(document).ready(function() {
-        $('.battle-inner:eq(0)').imagesLoaded(function($images, $proper, $broken) {
-            if ($broken.length > 0) {
-                $('.battle-wrapper:eq(0)').replaceWith(ERROR_TEXT);
-            }
-        });
+        $('.battle-inner:eq(0)').imagesLoaded()
+            .fail(function (instance) {
+                if (instance.hasAnyBroken) {
+                    $('.battle-wrapper:eq(0)').replaceWith(ERROR_TEXT);
+                }
+            })
     });
 
     $(document).on('ajax:beforeSend', function (evt, xhr, settings) {
@@ -63,19 +64,8 @@
         // Insert new images into hidden div
         $('.battle-inner:eq(1)').replaceWith(data);
 
-        // Once images are loaded, execute callback
-        $('.battle-inner:eq(1)').imagesLoaded(function($images, $proper, $broken) {
-            var wrap;
-
-            if ($broken.length > 0) {
-                // Insert error text into DOM
-                $('.battle-wrapper:eq(0)').replaceWith(ERROR_TEXT);
-                $('.battle-wrapper:eq(0)').show();
-
-                // Hide Spinner
-                $('#spinner-overlay').hide();
-                BATTLE_SPINNER.stop();
-            } else {
+        $('.battle-inner:eq(1)').imagesLoaded()
+            .done(function () {
                  // Remove old images
                 $('.battle-wrapper:eq(0)').remove();
 
@@ -90,8 +80,16 @@
                 wrap = '<div class="wrapper battle-wrapper" style="display:none">' +
                        '<div class="grid battle-inner"></div></div>';
                 $(wrap).insertAfter('.battle-wrapper:eq(0)');
-            }
-        });
+            }).fail(function () {
+                // Insert error text into DOM
+                $('.battle-wrapper:eq(0)').replaceWith(ERROR_TEXT);
+                $('.battle-wrapper:eq(0)').show();
+
+                // Hide Spinner
+                $('#spinner-overlay').hide();
+                BATTLE_SPINNER.stop();
+            })
+
     }).on('ajax:error', function (evt, xhr, status) {
         var error,
             errors,

data/app/assets/stylesheets/lentil/iframe.css.scss

@@ -0,0 +1,26 @@
+@import 'breakpoint/sass/framework';
+
+// Styles for iframe view
+body.lentil-images_iframe {
+  background: none;
+  line-height: 0;
+  margin: 0;
+}
+
+.lentil-images_iframe {
+  img {
+    margin: 0;
+  }
+
+  #iframe-wrapper {
+    width: 100%;
+    overflow: hidden;
+  }
+
+  .iframe-tile {
+    float: left;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+  }
+}

data/app/controllers/lentil/images_controller.rb

@@ -57,5 +57,9 @@ module Lentil
       render 'animate'
     end
 
+    def iframe
+      @images = Image.includes(:user).approved.recent.limit(125)
+      render :action => "iframe", :layout => "lentil/iframe"
+    end
   end
 end

data/app/controllers/lentil/thisorthat_controller.rb

@@ -6,10 +6,12 @@ module Lentil
 
     def test_urls(images, quantity)
       image = images.selecting{ |i|
-        url = URI.parse(i.jpeg)
-        req = Net::HTTP.new(url.host, url.port)
-        res = req.request_head(url.path)
-        res.code == '200'
+        begin
+          res = OEmbed::Providers::Instagram.get(i.url)
+          true
+        rescue
+          false
+        end
       }.first(quantity)
     end
 

data/app/models/lentil/image.rb

@@ -138,16 +138,26 @@ class Lentil::Image < ActiveRecord::Base
     self.wins_count + self.losses_count
   end
 
+  # legacy
   def image_url
-    if long_url.blank?
-      url + 'media/?size=l'
-    else
-      long_url
-    end
+    large_url
   end
 
+  # legacy
   def jpeg
-    image_url
+    large_url
+  end
+
+  def large_url
+    url + 'media/?size=l'
+  end
+
+  def medium_url
+    url + 'media/?size=m'
+  end
+
+  def thumbnail_url
+    url + 'media/?size=t'
   end
 
   States = {

data/app/views/layouts/lentil/iframe.html.erb

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title><%= yield(:title) %></title>
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="viewport" content="width=device-width">
+  <meta name="apple-mobile-web-app-title" content="<% application_name %>">
+
+  <%= render '/layouts/lentil/apple_touch_icons' %>
+
+  <%= meta_description_tag %>
+  <%= stylesheet_link_tag "lentil/iframe", :media => "all" %>
+  <%= javascript_include_tag "lentil/iframe" %>
+  <%= yield :javascript_includes %>
+
+  <%= analytics_init(:tracker => google_analytics_tracker()) if (Rails.env.production? && !google_analytics_tracker.nil?) %>
+  <% if content_for? :feed_auto_discovery %>
+    <%= yield  :feed_auto_discovery %>
+  <% end -%>
+
+  <%= csrf_meta_tags %>
+</head>
+<!--[if IE 7]> <body class="lt-ie9 lt-ie8 <%= body_class %>"> <![endif]-->
+<!--[if IE 8]> <body class="lt-ie9 <%= body_class %>"> <![endif]-->
+<!--[if gt IE 8]><!--> <body class="<%= body_class %>"> <!--<![endif]-->
+
+  <%= yield %>
+
+</body>
+</html>

data/app/views/lentil/images/iframe.html.erb

@@ -0,0 +1,9 @@
+<%= link_to main_app.root_path, :target => "_parent" do %>
+  <div id="iframe-wrapper">
+    <% @images.each do |image| %>
+      <div class="iframe-tile">
+        <%= image_tag(image.thumbnail_url, :class => "instagram-img " + image.id.to_s, :alt => image.description) %>
+      </div>
+    <% end -%>
+  </div>
+<% end %>

data/config/routes.rb

@@ -8,6 +8,7 @@ Lentil::Engine.routes.draw do
   get "images/staff_picks" => 'images#staff_picks', :as => :images_staff_picks
   get "images/animate" => 'images#animate', :as => :images_animate
   get "images/staff_picks_animate" => 'images#staff_picks_animate', :as => :staff_picks_animate
+  get "images/iframe" => 'images#iframe', :as => :images_iframe
   get "about" => 'pages#about', :as => :pages_about
   post 'like_votes/:image_id' => 'like_votes#tally', :as => :tally_like_vote
   post 'flags/:image_id' => 'flags#tally', :as => :tally_flag

data/lib/generators/lentil/install_generator.rb

@@ -8,6 +8,21 @@ module Lentil
         remove_file('public/index.html')
       end
 
+      desc 'insert lentil config comments'
+      def lentil_config_comments
+        insert_into_file "config/application.rb", "\n    # Inserted by lentil\n    # End of lentil changes\n\n", :after => "class Application < Rails::Application\n"
+      end
+
+      desc 'precompile additional assets'
+      def precompile_assets
+        insert_into_file "config/application.rb", "    config.assets.precompile += %w( lentil/iframe.js lentil/iframe.css )\n", :after => "# Inserted by lentil\n"
+      end
+
+      desc 'do not enforce available locales'
+      def set_enforce_available_locales
+        insert_into_file "config/application.rb", "    I18n.enforce_available_locales = true\n", :after => "# Inserted by lentil\n"
+      end
+
       desc 'install migrations'
       def install_migrations
         rake "lentil:install:migrations"
@@ -20,9 +35,9 @@ module Lentil
         rake "db:seed"
       end
 
-      desc 'create devise initializer'
-      def create_devise_initializer
-        copy_file 'devise.rb', 'config/initializers/devise.rb'
+      desc 'install_devise_files'
+      def install_devise_files
+        generate 'devise:install'
       end
 
       desc 'install active_admin'

data/lib/generators/lentil/templates/README.md

@@ -8,6 +8,12 @@ You will need to make the following changes:
 
 2. You may need to configure config/initializers/devise.rb
 
+3. From the Devise documentation: "Ensure you have defined default url options in your environments files. Here is an example of default_url_options appropriate for a development environment in config/environments/development.rb:
+
+        config.action_mailer.default_url_options = { :host => 'localhost:3000' }
+
+    In production, :host should be set to the actual host of your application."
+
 3. Update that config/lentil_config.yml with your information. It is probably a good idea to add that file to your .gitignore too. You'll definitely want to change your instagram values and the default_image_search_tag.
 
 4. Look at the README.md for how to begin harvesting images and customizing your application.

data/lib/lentil/instagram_harvester.rb

@@ -197,7 +197,7 @@ module Lentil
     #
     # @return [String] Binary image data
     def harvest_image_data(image)
-      response = Typhoeus.get(image.image_url, followlocation: true)
+      response = Typhoeus.get(image.large_url, followlocation: true)
 
       if response.success?
         raise "Invalid content type: " + response.headers['Content-Type'] unless (response.headers['Content-Type'] == 'image/jpeg')
@@ -221,7 +221,7 @@ module Lentil
     #
     # @return [Boolean] Whether the image request was successful
     def test_remote_image(image)
-      response = Typhoeus.head(image.image_url, followlocation: true)
+      response = Typhoeus.get(image.thumbnail_url, followlocation: true)
 
       if response.success?
         true

data/lib/lentil/version.rb

@@ -1,3 +1,3 @@
 module Lentil
-  VERSION = "0.1.7"
+  VERSION = "0.1.8"
 end

data/test/dummy/config/application.rb

@@ -7,6 +7,12 @@ require "lentil"
 
 module Dummy
   class Application < Rails::Application
+
+    # Inserted by lentil
+    I18n.enforce_available_locales = true
+    config.assets.precompile += %w( lentil/iframe.js lentil/iframe.css )
+    # End of lentil changes
+
     # Settings in config/environments/* take precedence over those specified here.
     # Application configuration should go into files in config/initializers
     # -- all .rb files in that directory are automatically loaded.