fastlane_iac_publish 0.1.0

data/snapshot/lib/snapshot/fixes/hardware_keyboard_fix.rb

@@ -0,0 +1,27 @@
+require_relative '../module'
+
+module Snapshot
+  module Fixes
+    # Having "Connect Hardware Keyboard" enabled causes issues with entering text in secure textfields
+    # Fixes https://github.com/fastlane/fastlane/issues/2494
+
+    class HardwareKeyboardFix
+      def self.patch
+        UI.verbose("Patching simulator to work with secure text fields")
+
+        Helper.backticks("defaults write com.apple.iphonesimulator ConnectHardwareKeyboard 0", print: FastlaneCore::Globals.verbose?)
+
+        # For > Xcode 9
+        # https://stackoverflow.com/questions/38010494/is-it-possible-to-toggle-software-keyboard-via-the-code-in-ui-test/47820883#47820883
+        Helper.backticks("/usr/libexec/PlistBuddy "\
+                         "-c \"Print :DevicePreferences\" ~/Library/Preferences/com.apple.iphonesimulator.plist | "\
+                         "perl -lne 'print $1 if /^    (\\S*) =/' | while read -r a; do /usr/libexec/PlistBuddy "\
+                         "-c \"Set :DevicePreferences:$a:ConnectHardwareKeyboard false\" "\
+                         "~/Library/Preferences/com.apple.iphonesimulator.plist "\
+                         "|| /usr/libexec/PlistBuddy "\
+                         "-c \"Add :DevicePreferences:$a:ConnectHardwareKeyboard bool false\" "\
+                         "~/Library/Preferences/com.apple.iphonesimulator.plist; done", print: FastlaneCore::Globals.verbose?)
+      end
+    end
+  end
+end

data/snapshot/lib/snapshot/fixes/simulator_zoom_fix.rb

@@ -0,0 +1,27 @@
+require_relative '../module'
+
+module Snapshot
+  module Fixes
+    # This fix is needed due to a bug in UI Tests that creates invalid screenshots when the
+    # simulator is not scaled to a 100%
+    # Issue: https://github.com/fastlane/fastlane/issues/2578
+    # Radar: https://openradar.appspot.com/radar?id=6127019184095232
+
+    class SimulatorZoomFix
+      def self.patch
+        UI.message("Patching simulators '#{config_path}' to scale to 100%")
+
+        FastlaneCore::DeviceManager.simulators.each do |simulator|
+          simulator_name = simulator.name.tr("\s", "-")
+          key = "SimulatorWindowLastScale-com.apple.CoreSimulator.SimDeviceType.#{simulator_name}"
+
+          Helper.backticks("defaults write '#{config_path}' '#{key}' '1.0'", print: FastlaneCore::Globals.verbose?)
+        end
+      end
+
+      def self.config_path
+        File.join(File.expand_path("~"), "Library", "Preferences", "com.apple.iphonesimulator.plist")
+      end
+    end
+  end
+end

data/snapshot/lib/snapshot/latest_os_version.rb

@@ -0,0 +1,34 @@
+require 'open3'
+require 'fastlane_core/ui/ui'
+
+module Snapshot
+  class LatestOsVersion
+    def self.ios_version
+      return ENV["SNAPSHOT_IOS_VERSION"] if FastlaneCore::Env.truthy?("SNAPSHOT_IOS_VERSION")
+      self.version("iOS")
+    end
+
+    @versions = {}
+    def self.version(os)
+      @versions[os] ||= version_for_os(os)
+    end
+
+    def self.version_for_os(os)
+      # We do all this, because we would get all kind of crap output generated by xcodebuild
+      # so we need to ignore stderror
+      output = ''
+      Open3.popen3('xcodebuild -version -sdk') do |stdin, stdout, stderr, wait_thr|
+        output = stdout.read
+      end
+
+      matched = output.match(/#{os} ([\d\.]+) \(.*/)
+      if matched.nil?
+        FastlaneCore::UI.user_error!("Could not determine installed #{os} SDK version. Try running the _xcodebuild_ command manually to ensure it works.")
+      elsif matched.length > 1
+        return matched[1]
+      else
+        FastlaneCore::UI.user_error!("Could not determine installed #{os} SDK version. Please pass it via the environment variable 'SNAPSHOT_IOS_VERSION'")
+      end
+    end
+  end
+end

data/snapshot/lib/snapshot/module.rb

@@ -0,0 +1,44 @@
+require 'fastlane_core/helper'
+require 'fastlane/boolean'
+require_relative 'detect_values'
+require_relative 'dependency_checker'
+
+module Snapshot
+  # Use this to just setup the configuration attribute and set it later somewhere else
+  class << self
+    attr_accessor :config
+
+    attr_accessor :project
+
+    attr_accessor :cache
+
+    def config=(value)
+      @config = value
+      DetectValues.set_additional_default_values
+      @cache = {}
+    end
+
+    def snapfile_name
+      "Snapfile"
+    end
+
+    def kill_simulator
+      `killall 'iOS Simulator' &> /dev/null`
+      `killall Simulator &> /dev/null`
+    end
+  end
+
+  Helper = FastlaneCore::Helper # you gotta love Ruby: Helper.* should use the Helper class contained in FastlaneCore
+  UI = FastlaneCore::UI
+  ROOT = Pathname.new(File.expand_path('../../..', __FILE__))
+  DESCRIPTION = "Automate taking localized screenshots of your iOS and tvOS apps on every device"
+  CACHE_DIR = File.join(Dir.home, "Library/Caches/tools.fastlane")
+  SCREENSHOTS_DIR = File.join(CACHE_DIR, 'screenshots')
+  Boolean = Fastlane::Boolean
+
+  Snapshot::DependencyChecker.check_dependencies
+
+  def self.min_xcode7?
+    xcode_version.split(".").first.to_i >= 7
+  end
+end

data/snapshot/lib/snapshot/options.rb

@@ -0,0 +1,223 @@
+require 'fastlane_core/configuration/config_item'
+require 'fastlane_core/device_manager'
+require 'credentials_manager/appfile_config'
+require_relative 'module'
+
+module Snapshot
+  class Options
+    def self.available_options
+      output_directory = (File.directory?("fastlane") ? "fastlane/screenshots" : "screenshots")
+
+      @options ||= [
+        FastlaneCore::ConfigItem.new(key: :workspace,
+                                     short_option: "-w",
+                                     env_name: "SNAPSHOT_WORKSPACE",
+                                     optional: true,
+                                     description: "Path the workspace file",
+                                     verify_block: proc do |value|
+                                       v = File.expand_path(value.to_s)
+                                       UI.user_error!("Workspace file not found at path '#{v}'") unless File.exist?(v)
+                                       UI.user_error!("Workspace file invalid") unless File.directory?(v)
+                                       UI.user_error!("Workspace file is not a workspace, must end with .xcworkspace") unless v.include?(".xcworkspace")
+                                     end),
+        FastlaneCore::ConfigItem.new(key: :project,
+                                     short_option: "-p",
+                                     optional: true,
+                                     env_name: "SNAPSHOT_PROJECT",
+                                     description: "Path the project file",
+                                     verify_block: proc do |value|
+                                       v = File.expand_path(value.to_s)
+                                       UI.user_error!("Project file not found at path '#{v}'") unless File.exist?(v)
+                                       UI.user_error!("Project file invalid") unless File.directory?(v)
+                                       UI.user_error!("Project file is not a project file, must end with .xcodeproj") unless v.include?(".xcodeproj")
+                                     end),
+        FastlaneCore::ConfigItem.new(key: :xcargs,
+                                     short_option: "-X",
+                                     env_name: "SNAPSHOT_XCARGS",
+                                     description: "Pass additional arguments to xcodebuild for the test phase. Be sure to quote the setting names and values e.g. OTHER_LDFLAGS=\"-ObjC -lstdc++\"",
+                                     optional: true,
+                                     type: :shell_string),
+        FastlaneCore::ConfigItem.new(key: :xcconfig,
+                                     short_option: "-y",
+                                     env_name: "SNAPSHOT_XCCONFIG",
+                                     description: "Use an extra XCCONFIG file to build your app",
+                                     optional: true,
+                                     verify_block: proc do |value|
+                                       UI.user_error!("File not found at path '#{File.expand_path(value)}'") unless File.exist?(value)
+                                     end),
+        FastlaneCore::ConfigItem.new(key: :devices,
+                                     description: "A list of devices you want to take the screenshots from",
+                                     short_option: "-d",
+                                     type: Array,
+                                     optional: true,
+                                     verify_block: proc do |value|
+                                       available = FastlaneCore::DeviceManager.simulators
+                                       value.each do |current|
+                                         device = current.strip
+                                         unless available.any? { |d| d.name.strip == device } || device == "Mac"
+                                           UI.user_error!("Device '#{device}' not in list of available simulators '#{available.join(', ')}'")
+                                         end
+                                       end
+                                     end),
+        FastlaneCore::ConfigItem.new(key: :languages,
+                                     description: "A list of languages which should be used",
+                                     short_option: "-g",
+                                     type: Array,
+                                     default_value: ['en-US']),
+        FastlaneCore::ConfigItem.new(key: :launch_arguments,
+                                     env_name: 'SNAPSHOT_LAUNCH_ARGUMENTS',
+                                     description: "A list of launch arguments which should be used",
+                                     short_option: "-m",
+                                     type: Array,
+                                     default_value: ['']),
+        FastlaneCore::ConfigItem.new(key: :output_directory,
+                                     short_option: "-o",
+                                     env_name: "SNAPSHOT_OUTPUT_DIRECTORY",
+                                     description: "The directory where to store the screenshots",
+                                     default_value: output_directory,
+                                     default_value_dynamic: true),
+        FastlaneCore::ConfigItem.new(key: :output_simulator_logs,
+                                     env_name: "SNAPSHOT_OUTPUT_SIMULATOR_LOGS",
+                                     description: "If the logs generated by the app (e.g. using NSLog, perror, etc.) in the Simulator should be written to the output_directory",
+                                     type: Boolean,
+                                     default_value: false,
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :ios_version,
+                                     description: "By default, the latest version should be used automatically. If you want to change it, do it here",
+                                     short_option: "-i",
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :skip_open_summary,
+                                     env_name: 'SNAPSHOT_SKIP_OPEN_SUMMARY',
+                                     description: "Don't open the HTML summary after running _snapshot_",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :skip_helper_version_check,
+                                     env_name: 'SNAPSHOT_SKIP_SKIP_HELPER_VERSION_CHECK',
+                                     description: "Do not check for most recent SnapshotHelper code",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :clear_previous_screenshots,
+                                     env_name: 'SNAPSHOT_CLEAR_PREVIOUS_SCREENSHOTS',
+                                     description: "Enabling this option will automatically clear previously generated screenshots before running snapshot",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :reinstall_app,
+                                     env_name: 'SNAPSHOT_REINSTALL_APP',
+                                     description: "Enabling this option will automatically uninstall the application before running it",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :erase_simulator,
+                                     env_name: 'SNAPSHOT_ERASE_SIMULATOR',
+                                     description: "Enabling this option will automatically erase the simulator before running the application",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :localize_simulator,
+                                     env_name: 'SNAPSHOT_LOCALIZE_SIMULATOR',
+                                     description: "Enabling this option will configure the Simulator's system language",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :app_identifier,
+                                     env_name: 'SNAPSHOT_APP_IDENTIFIER',
+                                     short_option: "-a",
+                                     optional: true,
+                                     description: "The bundle identifier of the app to uninstall (only needed when enabling reinstall_app)",
+                                     code_gen_sensitive: true,
+                                     # This incorrect env name is here for backwards compatibility
+                                     default_value: ENV["SNAPSHOT_APP_IDENTITIFER"] || CredentialsManager::AppfileConfig.try_fetch_value(:app_identifier),
+                                     default_value_dynamic: true),
+        FastlaneCore::ConfigItem.new(key: :add_photos,
+                                     env_name: 'SNAPSHOT_PHOTOS',
+                                     short_option: "-j",
+                                     description: "A list of photos that should be added to the simulator before running the application",
+                                     type: Array,
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :add_videos,
+                                     env_name: 'SNAPSHOT_VIDEOS',
+                                     short_option: "-u",
+                                     description: "A list of videos that should be added to the simulator before running the application",
+                                     type: Array,
+                                     optional: true),
+
+        # Everything around building
+        FastlaneCore::ConfigItem.new(key: :buildlog_path,
+                                     short_option: "-l",
+                                     env_name: "SNAPSHOT_BUILDLOG_PATH",
+                                     description: "The directory where to store the build log",
+                                     default_value: "#{FastlaneCore::Helper.buildlog_path}/snapshot",
+                                     default_value_dynamic: true),
+        FastlaneCore::ConfigItem.new(key: :clean,
+                                     short_option: "-c",
+                                     env_name: "SNAPSHOT_CLEAN",
+                                     description: "Should the project be cleaned before building it?",
+                                     is_string: false,
+                                     default_value: false),
+        FastlaneCore::ConfigItem.new(key: :test_without_building,
+                                     short_option: "-T",
+                                     env_name: "SNAPSHOT_TEST_WITHOUT_BUILDING",
+                                     description: "Test without building, requires a derived data path",
+                                     is_string: false,
+                                     type: Boolean,
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :configuration,
+                                     short_option: "-q",
+                                     env_name: "SNAPSHOT_CONFIGURATION",
+                                     description: "The configuration to use when building the app. Defaults to 'Release'",
+                                     default_value_dynamic: true,
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :xcpretty_args,
+                                     short_option: "-x",
+                                     env_name: "SNAPSHOT_XCPRETTY_ARGS",
+                                     description: "Additional xcpretty arguments",
+                                     is_string: true,
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :sdk,
+                                     short_option: "-k",
+                                     env_name: "SNAPSHOT_SDK",
+                                     description: "The SDK that should be used for building the application",
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :scheme,
+                                     short_option: "-s",
+                                     env_name: 'SNAPSHOT_SCHEME',
+                                     description: "The scheme you want to use, this must be the scheme for the UI Tests",
+                                     optional: true), # optional true because we offer a picker to the user
+        FastlaneCore::ConfigItem.new(key: :number_of_retries,
+                                     short_option: "-n",
+                                     env_name: 'SNAPSHOT_NUMBER_OF_RETRIES',
+                                     description: "The number of times a test can fail before snapshot should stop retrying",
+                                     type: Integer,
+                                     default_value: 1),
+        FastlaneCore::ConfigItem.new(key: :stop_after_first_error,
+                                     env_name: 'SNAPSHOT_BREAK_ON_FIRST_ERROR',
+                                     description: "Should snapshot stop immediately after the tests completely failed on one device?",
+                                     default_value: false,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :derived_data_path,
+                                     short_option: "-f",
+                                     env_name: "SNAPSHOT_DERIVED_DATA_PATH",
+                                     description: "The directory where build products and other derived data will go",
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :result_bundle,
+                                     short_option: "-z",
+                                     env_name: "SNAPSHOT_RESULT_BUNDLE",
+                                     is_string: false,
+                                     description: "Should an Xcode result bundle be generated in the output directory",
+                                     default_value: false,
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :test_target_name,
+                                     env_name: "SNAPSHOT_TEST_TARGET_NAME",
+                                     description: "The name of the target you want to test (if you desire to override the Target Application from Xcode)",
+                                     optional: true),
+        FastlaneCore::ConfigItem.new(key: :namespace_log_files,
+                                     env_name: "SNAPSHOT_NAMESPACE_LOG_FILES",
+                                     description: "Separate the log files per device and per language",
+                                     optional: true,
+                                     is_string: false),
+        FastlaneCore::ConfigItem.new(key: :concurrent_simulators,
+                                     env_name: "SNAPSHOT_EXECUTE_CONCURRENT_SIMULATORS",
+                                     description: "Take snapshots on multiple simulators concurrently. Note: This option is only applicable when running against Xcode 9",
+                                     default_value: true,
+                                     is_string: false)
+      ]
+    end
+  end
+end

data/snapshot/lib/snapshot/page.html.erb

@@ -0,0 +1,285 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>fastlane/snapshot</title>
+    <meta charset="UTF-8">
+    <style type="text/css">
+      * {
+        font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+        font-weight: 300;
+      }
+      #sortMenu {
+        overflow: hidden;
+        border: 1px solid #ccc;
+        background-color: #f1f1f1;
+        display: none;
+      }
+      #sortMenu button {
+        background-color: inherit;
+        float: left;
+        border: none;
+        outline: none;
+        cursor: pointer;
+        padding: 14px 16px;
+        font-size: 17px;
+      }
+      #sortMenu button:hover {
+        background-color: #ddd;
+      }
+      #sortMenu button.active {
+        background-color: #ccc;
+      }
+      .deviceName {
+        display: block;
+        font-size: 30px;
+        padding-bottom: 24px;
+        padding-top: 45px;
+      }
+      .screenshot {
+        cursor: pointer;
+        border: 1px #EEE solid;
+        z-index: 0;
+      }
+      .caption {
+        font-size: 24px;
+        padding-bottom: 24px;
+        padding-top: 30px;
+      }
+      h1, h2 {
+        font-weight: bold;
+      }
+      th {
+        text-align: left;
+      }
+      td {
+        text-align: center;
+        min-width: 200px;
+      }
+      #overlay {
+        position:fixed;
+        top:0;
+        left:0;
+        background:rgba(0,0,0,0.8);
+        z-index:5;
+        width:100%;
+        height:100%;
+        display:none;
+        cursor: zoom-out;
+        text-align: center;
+      }
+      #imageDisplay {
+        height: auto;
+        width: auto;
+        z-index: 10;
+        cursor: pointer;
+      }
+      #imageInfo {
+        background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2);
+        border-radius: 5px;
+        color: white;
+        margin: 20px;
+        padding: 10px;
+        position: absolute;
+        right: 0;
+        top: 0;
+        width: 250px;
+        z-index: -1;
+      }
+      #imageInfo:hover {
+        z-index: 20;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="sortMenu">
+      <button id="defaultTab" class="tabLink" onclick="openTab(event, 'byLanguage')">By Language</button>
+      <button class="tabLink" onclick="openTab(event, 'byScreen')">By Screen</button>
+    </div>
+    <div id="byLanguage" class="tabContent"><h1 class="tabTitle">By Language:</h1><% image_counter = 0 %><% @data_by_language.each do |language, content| %>
+      <h2 id="<%= language %>"><%= language %></h2>
+      <hr>
+      <table><% content.each do |device_name, screens| %>
+        <tr>
+          <th colspan="<%= screens.count %>">
+            <a id="<%= language %>-<%= device_name %>" class="deviceName" href="#<%= language %>-<%= device_name %>"><%= device_name %></a>
+          </th>
+        </tr>
+        <tr><% screens.each do |screen_path| %><% next if screen_path.include?"_framed.png" %>
+          <td><% image_counter += 1 %>
+            <a href="<%= screen_path %>" target="_blank" class="screenshotLink">
+              <img class="screenshot" src="<%= screen_path %>" style="width: 100%;" alt="<%= language %> <%= device_name %>" data-tab="1" data-counter="<%= image_counter %>">
+            </a>
+          </td><% end %>
+        </tr><% end %>
+      </table><% end %>
+    </div>
+    <div id="byScreen" class="tabContent"><h1 class="tabTitle">By Screen:</h1><% image_counter = 0 %><% @data_by_screen.each do |screen, content| %>
+      <h2 id="<%= screen %>" class="screen"><%= screen %></h2>
+      <hr>
+      <table><% content.each do |device_name, screens| %>
+        <tr>
+          <th colspan="<%= screens.count %>">
+            <a id="<%= screen %>-<%= device_name %>" class="deviceName" href="#<%= screen %>-<%= device_name %>"><%= device_name %></a>
+          </th>
+        </tr>
+        <tr><% screens.each do |language, screen_path| %><% next if screen_path.include?"_framed.png" %>
+          <td><% image_counter += 1 %>
+            <a href="<%= screen_path %>" target="_blank" class="screenshotLink">
+              <img class="screenshot" src="<%= screen_path %>" style="width: 100%;" alt="<%= language %> <%= device_name %>" data-tab="2" data-counter="<%= image_counter %>">
+            </a>
+            <div class="caption"><%= language %></div>
+          </td><% end %>
+        </tr><% end %>
+      </table><% end %>
+    </div>
+    <div id="overlay">
+      <img id="imageDisplay" src="" alt="" />
+      <div id="imageInfo"></div>
+    </div>
+    <script type="text/javascript">
+      var overlay        = document.getElementById('overlay');
+      var imageDisplay   = document.getElementById('imageDisplay');
+      var imageInfo      = document.getElementById('imageInfo');
+      var screenshotLink = document.getElementsByClassName('screenshotLink');
+
+      window.onload = setup();
+
+      function setup() {
+        var i, menu, tabTitles;
+
+        // Since JS is enabled, show sort menu and hide tab titles
+        menu = document.getElementById("sortMenu");
+        menu.style.display = "block";
+
+        tabTitles = document.getElementsByClassName("tabTitle");
+        for (i = 0; i < tabTitles.length; i++) {
+          tabTitles[i].style.display = "none";
+        }
+
+        doClick(document.getElementById("defaultTab"));
+      }
+
+      function getCurrentTab() {
+        var i, tabs;
+        tabs = document.getElementsByClassName("tabContent");
+        for (i = 0; i < tabs.length; i++) {
+          if (tabs[i].style.display != "none") {
+            return i + 1;
+          }
+        }
+        return 1; // fallback
+      }
+
+      function openTab(evt, tabName) {
+        var i, tabContent, tabLinks;
+        tabs = document.getElementsByClassName("tabContent");
+        for (i = 0; i < tabs.length; i++) {
+          tabs[i].style.display = "none";
+        }
+        tabLinks = document.getElementsByClassName("tabLink");
+        for (i = 0; i < tabLinks.length; i++) {
+          tabLinks[i].className = tabLinks[i].className.replace(" active", "");
+        }
+        document.getElementById(tabName).style.display = "block";
+        evt.currentTarget.className += " active";
+      }
+
+      function doClick(el) {
+        if (document.createEvent) {
+          var evObj = document.createEvent('MouseEvents', true);
+          evObj.initMouseEvent("click", false, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
+          el.dispatchEvent(evObj);
+        } else if (document.createEventObject) { //IE
+          var evObj = document.createEventObject();
+          el.fireEvent('onclick', evObj);
+        }
+      }
+
+      for (index = 0; index < screenshotLink.length; ++index) {
+        screenshotLink[index].addEventListener('click', function(e) {
+          e.preventDefault();
+
+          var img = e.target;
+          if (e.target.tagName == 'A') {
+            img = e.target.children[0];
+          }
+
+          // beautify
+          var tmpImg = new Image();
+          tmpImg.src = img.src;
+          imageDisplay.style.height     = 'auto';
+          imageDisplay.style.width     = 'auto';
+          imageDisplay.style.paddingTop = 0;
+          if (window.innerHeight < tmpImg.height) {
+            imageDisplay.style.height = document.documentElement.clientHeight+'px';
+          } else if (window.innerWidth < tmpImg.width) {
+            imageDisplay.style.width = document.documentElement.clientWidth;+'px';
+          } else {
+            imageDisplay.style.paddingTop = parseInt((window.innerHeight - tmpImg.height) / 2)+'px';
+          }
+
+          imageDisplay.src             = img.src;
+          imageDisplay.alt             = img.alt;
+          imageDisplay.dataset.counter = img.dataset.counter;
+
+          imageInfo.innerHTML          = '<h3>'+img.alt+'</h3>';
+          imageInfo.innerHTML         += decodeURI(img.src.split("/").pop());
+          imageInfo.innerHTML         += '<br />'+tmpImg.height+'&times;'+tmpImg.width+'px';
+
+          overlay.style.display        = "block";
+        });
+      }
+
+      imageDisplay.addEventListener('click', function(e) {
+        e.stopPropagation(); // !
+
+        overlay.style.display = "none";
+
+        img_tab = parseInt(getCurrentTab());
+        img_counter = parseInt(e.target.dataset.counter) + 1;
+        try {
+          link = document.body.querySelector('img[data-tab="'+img_tab+'"][data-counter="'+img_counter+'"]').parentNode;
+        } catch (e) {
+          try {
+            link = document.body.querySelector('img[data-tab="'+img_tab+'"][data-counter="0"]').parentNode;
+          } catch (e) {
+            return false;
+          }
+        }
+        doClick(link);
+      });
+
+      overlay.addEventListener('click', function(e) {
+        overlay.style.display = "none";
+      })
+
+      function keyPressed(e) {
+        e = e || window.event;
+        var charCode = e.keyCode || e.which;
+        switch(charCode) {
+          case 27: // Esc
+            overlay.style.display = "none";
+            break;
+          case 34: // Page Down
+          case 39: // Right arrow
+          case 54: // Keypad right
+          case 76: // l
+          case 102: // Keypad right
+            e.preventDefault();
+            doClick(imageDisplay);
+            break;
+          case 33: // Page up
+          case 37: // Left arrow
+          case 52: // Keypad left
+          case 72: // h
+          case 100: // Keypad left
+            e.preventDefault();
+            document.getElementById('imageDisplay').dataset.counter -= 2; // hacky
+            doClick(imageDisplay);
+            break;
+         }
+      };
+      document.body.addEventListener('keydown', keyPressed);
+    </script>
+  </body>
+</html>