pageflow-progress-navigation-bar 0.1.0

checksums.yaml

@@ -0,0 +1,15 @@
+---
+!binary "U0hBMQ==":
+  metadata.gz: !binary |-
+    NWI2M2IyODk5ZmM1YmVhMGMwODBkZWE5OTFhYTZlODNhMGFkODM3Yw==
+  data.tar.gz: !binary |-
+    OWMwODE2OGU3ZWU0MTYyNjg3NzI5MTc1MDQwZWM1MTM3YTY5YmM5Mg==
+SHA512:
+  metadata.gz: !binary |-
+    ZmVkODdjNTJlNjcyOTE5YThkN2RlYzNjNTIxMDViYjg3MWY5ZjdiYzc3ODY5
+    NDBmYzU3YTQyZjdhMjU5MzliZGJjYzBjYmMwNmE2MWVlZGFiM2I0NTZhMWQ4
+    ZTFiYzI5Zjk1NjMzYWMyNjg0NTUwMjQ2NDNiOTVlNzAyOWIyZGQ=
+  data.tar.gz: !binary |-
+    OTVjMmUzNWVmNmM3MzY4ZmQ2ZTdkYjUxNTkzOTNiZmE0MDYwYTcyYWVlOWYx
+    NGQ3MjZjMzIwOWVlNzc4NmM3MDA2NDg5OWY0Y2M4YjlmOTVjZjkwNzk5N2I3
+    YjY3ZDQwY2ZlZDczNzBkNTRjMjMxOTI0MWRjZDUyYjY4NDg1Y2Y=

data/.gitignore

@@ -0,0 +1,22 @@
+*.gem
+*.rbc
+*.sqlite3
+.bundle
+.config
+.yardoc
+.idea
+InstalledFiles
+_yardoc
+coverage
+doc/
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp
+log
+Gemfile.lock
+
+.localeapp

data/.jshintrc

@@ -0,0 +1,18 @@
+{
+  "browser": true,
+  "undef": true,
+  "immed": true,
+  "trailing": true,
+  "globals": {
+    "jQuery": true,
+    "$": true,
+    "Backbone": true,
+    "_": true,
+    "I18n": true,
+
+    "pageflow": true,
+
+    "confirm": true,
+    "alert": true
+  }
+}

data/CHANGELOG.md

@@ -0,0 +1,8 @@
+# CHANGELOG
+
+### Version 0.1.0
+
+2015-02-03
+
+Initial release.
+

data/Gemfile

@@ -0,0 +1,10 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in chart.gemspec
+gemspec
+
+# Rails 4 compat
+gem 'activeadmin', git: 'https://github.com/codevise/active_admin.git', branch: 'rails4'
+gem 'ransack'
+gem 'inherited_resources', '1.4.1'
+gem 'formtastic', '2.3.0.rc2'

data/README.md

@@ -0,0 +1,45 @@
+# Pageflow Progress Navigation Bar
+
+[![Gem Version](https://badge.fury.io/rb/pageflow-progress-navigation-bar.svg)](http://badge.fury.io/rb/pageflow-progress-navigation-bar)
+
+A navigation bar resembling a progress bar.
+
+## Installation
+
+Add this line to your application's `Gemfile`:
+
+    gem 'pageflow-progress-navigation-bar'
+
+Register the widget type inside the configure block in `config/initializers/pageflow.rb`
+
+    Pageflow.configure do |config|
+      config.widget_types.register(Pageflow::ProgressNavigationBar.widget_type)
+    end
+
+Include javascripts and stylesheets:
+
+    # app/assets/javascripts/pageflow/application.js
+    //= require pageflow/progress_navigation_bar
+
+    # app/assets/stylesheets/pageflow/application.css.scss
+    @import "pageflow/progress_navigation_bar";
+
+    # Adding basic style to your theme
+    # app/assets/stylesheets/pageflow/themes/default.css.scss
+    @import "pageflow/progress_navigation_bar/themes/default";
+
+Execute `bundle install` Restart the application server.
+
+## Troubleshooting
+
+If you run into problems while installing the page type, please also refer to the
+[Troubleshooting](https://github.com/codevise/pageflow/wiki/Troubleshooting) wiki
+page in the [Pageflow  repository](https://github.com/codevise/pageflow). If that
+doesn't help, consider
+[filing an issue](https://github.com/codevise/pageflow-progress-navigation-bar/issues).
+
+## Contributing Locales
+
+Edit the translations directly on the
+[pageflow-progress-navigation-bar](http://www.localeapp.com/projects/public?search=tf/pageflow-progress-navigation-bar)
+locale project.

data/Rakefile

@@ -0,0 +1,7 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+Bundler::GemHelper.install_tasks

data/app/assets/javascript/pageflow/progress_navigation_bar.js

@@ -0,0 +1,8 @@
+//= require_self
+//= require ./progress_navigation_bar/widget
+
+pageflow.widgetTypes.register('progress_navigation_bar', {
+  enhance: function(element) {
+    element.progressNavigationBar();
+  }
+});

data/app/assets/javascript/pageflow/progress_navigation_bar/widget.js

@@ -0,0 +1,342 @@
+/*global IScroll*/
+
+(function($) {
+  $.widget('pageflow.progressNavigationBar', {
+    _create: function() {
+      var overlays = this.element.find('.navigation_site_detail'),
+          that = this,
+          hasHomeButton = !!this.element.find('.navigation_home').length;
+
+      this.element.addClass('js').append(overlays);
+
+      $('a.navigation_top', this.element).topButton();
+
+      $('.navigation_bar_bottom', this.element)
+        .append($('.navigation_bar_top > li', this.element).slice(hasHomeButton ? 4 : 3));
+
+
+      /* open menu magic */
+      var checkingForMouseDelta = false,
+        lastPosition,
+        openBarTimeout,
+        closeBarTimeout,
+        measuringDistance = 600,
+        recentPosition;
+
+      $('body').on('mousemove', function(e) {
+        recentPosition = e.pageX;
+        var measuredDistance = that.element.offset().left - e.pageX;
+        if(measuredDistance < measuringDistance && !checkingForMouseDelta && measuredDistance > 0) {
+          checkingForMouseDelta = true;
+          lastPosition = e.pageX;
+
+          closeBarTimeout = setTimeout(function() {
+            that.element.removeClass('hover');
+            checkingForMouseDelta = false;
+          }, 2000);
+
+          openBarTimeout = setTimeout(function() {
+              if(recentPosition - lastPosition > 100 * (measuredDistance / measuringDistance) + 10) {
+                that.element.addClass('hover');
+
+              }
+              else {
+                checkingForMouseDelta = false;
+                clearTimeout(closeBarTimeout);
+              }
+          },50);
+        }
+      });
+
+      pageflow.slides.on('slideshowchangepage', function() {
+        that.element.addClass('show_on_mobile');
+        setTimeout(function() {
+          that.element.removeClass('show_on_mobile');
+        }, 1000);
+      });
+
+
+
+      that.element.on('mouseenter', function() { that.element.addClass('hover'); clearTimeout(closeBarTimeout);});
+      that.element.on('mousemove', function() { clearTimeout(closeBarTimeout); });
+      that.element.on('mouseleave', function() { that.element.removeClass('hover'); checkingForMouseDelta = false; });
+
+
+      /* keyboard / skiplinks */
+
+      that.element.find('a, *[tabindex]').on('blur', function() {
+        that.element.removeClass('focus');
+      });
+
+      that.element.find('a, *[tabindex]').on('focus', function() {
+        that.element.addClass('focus');
+      });
+
+      /*that.element.on('mousemove', function() {
+        clearTimeout(closeBarTimeout);
+        closeBarTimeout = setTimeout(function() {
+          that.element.removeClass('hover');
+        }, 500);
+      });*/
+
+      /* Volume */
+
+      var handlingVolume = false;
+      var volumeBeforeMute = 1;
+      var muteButton = $('.navigation_bg.navigation_mute', that.element);
+      var changeVolume = function(event) {
+        var volume = 1 - (event.pageY - $('.volume-slider', that.element).offset().top) / $(('.volume-slider')).height();
+        if (volume > 1) { volume = 1; }
+        if (volume < 0) { volume = 0; }
+        setVolume(volume);
+      };
+
+      var setVolume = function(volume) {
+        $('.volume-level', that.element).css({height: volume * 100 + "%"});
+        pageflow.settings.set('volume', volume);
+
+        if (volume === 0) {
+          muteButton
+            .attr('title', muteButton.attr('data-muted-title'))
+            .addClass('muted');
+        }
+        else {
+          muteButton
+            .attr('title', muteButton.attr('data-not-muted-title'))
+            .removeClass('muted');
+        }
+      };
+
+      var toggleMute = function () {
+        if (pageflow.settings.get('volume') > 0) {
+          volumeBeforeMute = pageflow.settings.get('volume');
+          setVolume(0);
+        }
+        else {
+          setVolume(volumeBeforeMute);
+        }
+      };
+
+      muteButton.on("click", function() {
+        toggleMute();
+      });
+
+      $('.volume-level', this.element).css({
+        height: pageflow.settings.get("volume") * 100 + "%"
+      });
+
+      $('.navigation_volume_box', this.element).on("mousedown", function(event) {
+        handlingVolume = true;
+        changeVolume(event);
+      });
+
+      $('.navigation_volume_box', this.element).on("mousemove", function(event) {
+        if(handlingVolume) {
+          changeVolume(event);
+        }
+      });
+
+      setVolume(pageflow.settings.get('volume'));
+
+      /* hide buttons on mobile devices */
+      if (pageflow.features.has('mobile platform')) {
+        that.element.find('.navigation_butten_area').hide();
+
+      }
+
+      /* header button */
+      $('.navigation_main', this.element).click(function() {
+        $(this)
+          .toggleClass('active')
+          .updateTitle();
+        $('.header').toggleClass('active');
+        that.element.toggleClass('header_active');
+      });
+
+      /* open header through skiplinks */
+      $('a[href="#header"], a[href="#search"]', '#skipLinks').click(function() {
+        $('.navigation_main', that.element).addClass('active');
+        $('.header').addClass('active');
+        $(this.getAttribute('href')).select();
+      });
+
+      /* share-button */
+      $('.navigation_menu .navigation_menu_box a', this.element).focus(function() {
+        $(this).parent().parent().addClass('focused');
+      }).blur(function() {
+        $(this).parent().parent().removeClass('focused');
+      });
+
+      var shareBox = $('.navigation_share_box', this.element),
+          links = $('> a', shareBox);
+        shareBox.shareMenu({
+        subMenu: $('.sub_share', shareBox),
+        links: links,
+        insertAfter: links.last(),
+        closeOnMouseLeaving: shareBox
+      });
+
+      /* pages */
+      var pageLinks = $('.navigation_dots a', that.element),
+        target;
+
+      function registerHandler() {
+        target = $(this);
+        target.one('mouseup touchend', goToPage);
+      }
+
+      function removeHandler() {
+        pageLinks.off('mouseup touchend', goToPage);
+      }
+
+      function closeOverview() {
+        $('.overview').removeClass("active");
+        $('.navigation_index', that.element).removeClass("active");
+      }
+
+      function hideOverlay() {
+        $(overlays).addClass('hidden').removeClass('visible');
+      }
+
+      function goToPage(e) {
+        if (target && target[0] != e.currentTarget) {
+          return;
+        }
+        hideOverlay();
+        closeOverview();
+        $('.page .content, .scroll_indicator').removeClass('hidden');
+        pageflow.slides.goToById(this.getAttribute("data-link"));
+        e.preventDefault();
+      }
+
+      pageLinks.each(function(index) {
+        var handlerIn = function() {
+          if (!('ontouchstart' in document.documentElement)) {
+            var calculatedOffset = $(this).offset().top + $(overlays[index]).outerHeight() > $('.progress_navigation_bar').height() ? $('.progress_navigation_bar').height() - $(overlays[index]).outerHeight() : $(this).offset().top;
+            $(overlays[index]).css("top", calculatedOffset).addClass('visible').removeClass('hidden');
+          }
+        };
+
+        $(this).on({
+          'mouseenter focus': handlerIn,
+          'mouseleave blur': hideOverlay,
+          'mousedown touchstart': registerHandler,
+          'click': goToPage
+        });
+      });
+
+      var resizeDots = function() {
+        var pageDotsMaxHeight = 20,
+        pageDotsMinHeight = 1,
+        maxBarHeight = $('#outer_wrapper').height() ? $('#outer_wrapper').height() : $('main').height(),
+        wantedHeight = maxBarHeight / pageLinks.length,
+        appliedHeight = pageDotsMinHeight;
+
+
+        if(wantedHeight <= pageDotsMaxHeight && wantedHeight > pageDotsMinHeight) {
+          appliedHeight = wantedHeight;
+        }
+        else if(wantedHeight > pageDotsMinHeight) {
+          appliedHeight = pageDotsMaxHeight;
+        }
+
+        $('.navigation_dots > li').css('height', appliedHeight + 'px');
+      };
+
+      resizeDots();
+
+      $(window).on('resize', function () {
+        $(overlays).css("top","0");
+        resizeDots();
+      });
+
+      $('.scroller', this.element).each(function () {
+        var scrollerOptions = {
+          mouseWheel: true,
+          bounce    : false,
+          probeType : 2
+        };
+
+        /*
+          This is just a quick fix to detect IE10. We should
+          refactor this condition if we decide to use Modernizr
+          or another more global detection.
+         */
+        if (window.navigator.msPointerEnabled) {
+          scrollerOptions.preventDefault = false;
+        }
+
+        var scroller = new IScroll(this, scrollerOptions);
+
+        $('ul.navigation_dots', that.element).pageNavigationList({
+          scroller: scroller,
+          scrollToActive: true
+        });
+
+      });
+
+      /* hide text button */
+      var hideText = $('.navigation_hide_text', this.element);
+
+      hideText.click(function() {
+        pageflow.hideText.toggle();
+      });
+
+      pageflow.hideText.on('activate deactivate', function() {
+        hideText.toggleClass('active', pageflow.hideText.isActive()).updateTitle();
+      });
+
+      /* fullscreen button */
+      if ($.support.fullscreen) {
+        var fs = $('.navigation_fullscreen', this.element),
+            fullscreenCallback = function(isFullScreen) {
+              fs
+                .toggleClass('active', !!isFullScreen)
+                .updateTitle();
+            };
+
+        fs.click(function() {
+          fs.toggleClass('fs').updateTitle();
+          $('#outer_wrapper').fullScreen({'callback': fullscreenCallback});
+        });
+      }
+      else {
+        $('.navigation_bar_bottom .fullscreen a', this.element).css('visibility', 'hidden');
+      }
+
+      $('.button, .navigation_mute, .scroll_indicator', this.element).on({
+        'touchstart mousedown': function() {
+          $(this).parent().addClass('pressed');
+        },
+        'touchend mouseup': function() {
+          $(this).parent().removeClass('pressed');
+        }
+      });
+
+      $('.navigation_share, .navigation_credits', this.element).on({
+        'touchstart': function() {
+          var element = $(this).parent().parent();
+          element.addClass('open');
+
+          function close(e) {
+            if (!element.find(e.target).length) {
+              element.removeClass('open');
+              $('body').off('touchstart', close);
+            }
+          }
+          $('body').on('touchstart', close);
+        }
+      });
+
+      $('li', this.element).on('mouseleave', function() {
+        $(this).blur();
+      });
+
+      $('body').on({
+        'mouseup': function() {
+          handlingVolume = false;
+        }
+      });
+    }
+  });
+}(jQuery));