pageflow-progress-navigation-bar 1.2.0 → 1.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: bc3ada5ee1ebf8e36e163d8f415f1f43db7e4c1fe622b2e88444dfe076faaf88
-  data.tar.gz: 761f973c0b17e09bdb8525c533af54b7d6ea932737465f16ff4c139da7a0ed28
+  metadata.gz: cf06426b17ba444d42299f2943c94c7c75984c68e00a9a98401ca4df592036d2
+  data.tar.gz: 21ca0c8f998db2699389c30a40a1743764b8d7241f7166335c2c85d52e37fd35
 SHA512:
-  metadata.gz: c3f74b6a6fedb9d6895e5975ce36c848f982fd45668e8680827f81f5e150ec21b037577a0980fa22fe7b57c640347d0ad099983c4eaf7f36ed2fd98ef54fbedb
-  data.tar.gz: 836438dc00c023d1086fed00509772d0f9be5cba2067706a523a3524c4f15d4757176f4843bb2b28bb0e7dced76f6f79014b824e4750325fdc4092a998dcce2e
+  metadata.gz: 6642b276844f2840532a6798e96a2ccf69670443bf7911cd77c99059e4127e7861bb92c39f429d18b8273b87123153dd0b842a20bab12c97f69f496eb7367edc
+  data.tar.gz: 36c3a96f76318fb727ce9cd2935d1e6bd3b126b316ec11f9a8c20c74f9b7e143720da5f41a35307fb6d0d2ffc5f6f842c26aa8acb6ec2ee8fb1af4ae28d67c03

data/CHANGELOG.md

@@ -1,15 +1,14 @@
 # CHANGELOG
 
-### Version 1.2.0
+### Version 1.7.0
 
-2019-02-08
+2021-06-07
 
-[Compare changes](https://github.com/codevise/pageflow-progress-navigation-bar/compare/1-1-stable...v1.2.0)
+[Compare changes](https://github.com/codevise/pageflow-progress-navigation-bar/compare/1-6-stable...v1.7.0)
 
-- Prevent loading of invisible thumbnails before load event
-  ([#37](https://github.com/codevise/pageflow-progress-navigation-bar/pull/37),
-   [#38](https://github.com/codevise/pageflow-progress-navigation-bar/pull/38))
+- Add theme option to use custom indicator image
+  ([#47](https://github.com/codevise/pageflow-progress-navigation-bar/pull/47))
 
 See
-[1-1-stable branch](https://github.com/codevise/pageflow-progress-navigation-bar/blob/1-1-stable/CHANGELOG.md)
+[1-6-stable branch](https://github.com/codevise/pageflow-progress-navigation-bar/blob/1-6-stable/CHANGELOG.md)
 for previous changes.

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

@@ -44,6 +44,21 @@
       }
     },
 
+    _toggleChapterDisplay: function() {
+      var dots = $('.navigation_dots a', this.element),
+          chaptersInCurrentStoryLine;
+
+      chaptersInCurrentStoryLine = dots.filter(':not(.filtered)').get().map(function(pageLink) {
+        return $(pageLink).data('chapterId');
+      });
+
+      if (_.uniq(chaptersInCurrentStoryLine).length == 1) {
+        this.element.addClass('no_chapters');
+      } else {
+        this.element.removeClass('no_chapters');
+      }
+    },
+
     _create: function() {
       var overlays = this.element.find('.navigation_site_detail'),
           that = this,
@@ -123,11 +138,11 @@
       });
 
       var shareBox = $('.navigation_share_box', this.element),
-          links = $('> a', shareBox);
+          links = $('.share_box_icons > a', shareBox);
       shareBox.shareMenu({
         subMenu: $('.sub_share', shareBox),
         links: links,
-        insertAfter: links.last(),
+        insertAfter: $('.share_box_icons'),
         closeOnMouseLeaving: shareBox
       });
 
@@ -221,7 +236,10 @@
           scroller: scroller,
           scrollToActive: true,
           animationDuration: 400,
-          onFilterChange: that._resizeDots()
+          onFilterChange: function() {
+            that._resizeDots();
+            that._toggleChapterDisplay();
+          }
         });
 
       });

data/app/assets/stylesheets/pageflow/progress_navigation_bar.scss

@@ -4,15 +4,8 @@ $nav-color: #9c9c9c;
 $nav-hint-color: #A9A9A9;
 $nav-hint-hover-color: #b4c552;
 
-$nav-dot-even: #afafaf;
-$nav-dot-odd: #afafaf;
-
 $nav-button-hr: #6f6f6f;
 
-$nav-active-page: #b4c552;
-$nav-active-chapter-beginning: #879438;
-$nav-active-chapter: #6D772E;
-
 $progressbar-mobile-width: 14px;
 
 @import "./progress_navigation_bar/cross_dependant_styles";
@@ -72,7 +65,6 @@ $progressbar-mobile-width: 14px;
     display: block;
     width: 28px;
     height: 28px;
-    background-image: image-url('pageflow/progress_navigation_bar/indicator.png');
     position: absolute;
     right: 60px;
     @include transition(opacity 0.3s linear);
@@ -256,6 +248,7 @@ $progressbar-mobile-width: 14px;
   .navigation_dots a {
     position: relative;
     outline: none;
+    @include hide-text;
 
     &:focus:after {
       content: " ";
@@ -301,30 +294,6 @@ $progressbar-mobile-width: 14px;
     }
   }
 
-  .navigation_share_box {
-    $size: 28px;
-    width: 210px;
-
-    a {
-      @include float-start;
-      text-decoration: none;
-      padding: 0 15px 0 15px;
-      width: 39px;
-
-      p {
-        color: $nav-color;
-        margin-bottom: 0;
-        text-align: center;
-      }
-
-      .button {
-        width: $size;
-        height: $size;
-        margin: auto;
-      }
-    }
-  }
-
   .navigation_credits_box {
     min-width: 230px;
     min-height: 4px;
@@ -446,17 +415,11 @@ $progressbar-mobile-width: 14px;
           left: 0;
           height: 100%;
           width: 100%;
-          background-color: $nav-dot-even;
           border-bottom: 1px solid $bg-color;
           @include box-sizing(border-box);
 
-          &.in_active_chapter {
-            background-color: $nav-active-chapter;
-          }
-
           &.active {
             cursor: default;
-            background-color: $nav-active-page;
 
             img {
               border-left: 5px solid #A6D513;
@@ -464,25 +427,14 @@ $progressbar-mobile-width: 14px;
           }
         }
 
-        li.chapter_beginning a {
-          background-color: $nav-color;
-
-          &.in_active_chapter {
-            background-color: $nav-active-chapter-beginning;
-          }
-        }
-
         img {
           display: block;
         }
       }
     }
-    .no_chapters li.chapter_beginning a, .no_chapters li a.in_active_chapter, .scroller ul.no_chapters li.chapter_beginning a.in_active_chapter {
-      background-color: $nav-dot-even;
 
-      &.active {
-        background-color: $nav-active-page;
-      }
+    &.no_chapters .navigation_site_detail .chapter {
+      display: none;
     }
 
     .navigation_menu_box {
@@ -551,7 +503,7 @@ $progressbar-mobile-width: 14px;
   }
 }
 
-.navigation_site_detail.progress_navigation h2 {
+.navigation_site_detail.progress_navigation .chapter {
   > span {
     display: block;
   }

data/app/assets/stylesheets/pageflow/progress_navigation_bar/horizontal.scss

@@ -6,6 +6,7 @@ $thumbnail-small-width: 50px;
   left: 0;
   height: 30px;
   width: 100%;
+  z-index: 2;
 
   @include pageflow-progress-mobile-variant {
     height: $progressbar-mobile-width;
@@ -56,7 +57,7 @@ $thumbnail-small-width: 50px;
       }
 
       .navigation_share_box {
-        right: -62.5px;
+        right: -45px;
       }
 
       .navigation_credits_box {

data/app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default.scss

@@ -48,8 +48,8 @@ $nav-bg-color-transparent: $basic-background-color-transparent;
   @import "./default/credits";
   @import "./default/icons/icon_font";
   @import "./default/icons/sprite";
+  @import "./default/indicator";
   @import "./default/menu_boxes";
-  @import "./default/share_box";
   @import "./default/typography";
 
   @if $progress-navigation-bar-icons == "sprite" {
@@ -155,7 +155,7 @@ $nav-bg-color-transparent: $basic-background-color-transparent;
   }
 
   @if not $progress-navigation-bar-display-share-button {
-    .navigation_menu.share {
+    .navigation_button_area .navigation_bar_buttons li.navigation_menu.share {
       display: none;
     }
   }
@@ -186,6 +186,13 @@ $nav-bg-color-transparent: $basic-background-color-transparent;
     }
   }
 
+  &.without_sharing_button,
+  &.mobile_sharing_only {
+    .navigation_button_area .navigation_bar_buttons li.navigation_menu.share {
+      display: none;
+    }
+  }
+
   .navigation_button_area .navigation_bar_buttons {
     &:after {
       background-color: $nav-bg-color-transparent;
@@ -198,12 +205,6 @@ $nav-bg-color-transparent: $basic-background-color-transparent;
     &.js a.scroll_indicator {
       background-image: image-url('pageflow/themes/default/scroll_indicator_sprite.png');
     }
-
-    .navigation_share_box {
-      a {
-        text-align: center;
-      }
-    }
   }
 
   &.js .scroller:after {
@@ -250,8 +251,11 @@ $nav-bg-color-transparent: $basic-background-color-transparent;
     img {
       display: block;
     }
+  }
 
-    &.no_chapters {
+  &.no_chapters,
+  &.no_chapters.js {
+    .scroller ul.navigation_dots {
       li.chapter_beginning a, li a.in_active_chapter, li.chapter_beginning a.in_active_chapter {
         background-color: $progress-navigation-bar-inactive-chapter-color;
 

data/app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/icons/icon_font.scss

@@ -4,10 +4,7 @@
 
   $button-icon-color,
   $active-button-icon-color,
-  $deactivated-button-icon-color,
-
-  $share-icon-color: $widget-text-color,
-  $active-share-icon-color: $main-color
+  $deactivated-button-icon-color
 ) {
   .navigation_button_area .navigation_bar_buttons {
 
@@ -135,44 +132,6 @@
         @include fa-info-icon;
       }
     }
-
-    .share_google,
-    .share_facebook,
-    .share_twitter {
-      font-size: 1.5em;
-      &:before {
-        font-family: "FontAwesome";
-        color: $share-icon-color;
-        text-shadow: none;
-      }
-    }
-
-    .share_google {
-      @include fa-google-plus-icon;
-    }
-    .share_facebook {
-      @include fa-facebook-icon;
-    }
-    .share_twitter {
-      @include fa-twitter-icon;
-    }
-
-    .navigation_share_box {
-      a.active,
-      a:hover {
-        p {
-          color: $active-share-icon-color;
-        }
-
-        .share_google,
-        .share_facebook,
-        .share_twitter {
-          &:before {
-            color: $active-share-icon-color;
-          }
-        }
-      }
-    }
   }
 
   .volume-control:before,

data/app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/icons/sprite.scss

@@ -66,30 +66,6 @@
     @include pageflow-sprite-icon-credits($target: ".button");
   }
 
-  .share.google {
-    @include pageflow-sprite-icon-google($offset: -5px, $target: ".button");
-
-    &.active {
-      @include pageflow-sprite-icon-google("active", $offset: -5px, $target: ".button");
-    }
-  }
-
-  .share.twitter {
-    @include pageflow-sprite-icon-twitter($offset: -5px, $target: ".button");
-
-    &.active {
-      @include pageflow-sprite-icon-twitter("active", $offset: -5px, $target: ".button");
-    }
-  }
-
-  .share.facebook {
-    @include pageflow-sprite-icon-facebook($offset: -5px, $target: ".button");
-
-    &.active {
-      @include pageflow-sprite-icon-facebook("active", $offset: -5px, $target: ".button");
-    }
-  }
-
   .volume-control {
     &:before,
     &:after {

data/app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/indicator.scss

@@ -0,0 +1,16 @@
+/// Images to use as indicator to expand navigation bar.
+///
+/// Possible values:
+///
+/// - `"default"`: Use default image.
+/// - `"custom"`: Use `progress_navigation_bar/indicator.png` from
+///   current theme directory.
+$progress-navigation-bar-indicator-image: "default" !default;
+
+&::before {
+  @if $progress-navigation-bar-indicator-image == "custom" {
+    background-image: image-url("pageflow/themes/#{$theme-name}/progress_navigation_bar/indicator.png");
+  } @else {
+    background-image: image-url("pageflow/progress_navigation_bar/indicator.png");
+  }
+}

data/app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/typography.scss

@@ -42,11 +42,12 @@ $progress-navigation-bar-credits-box-typography: () !default;
     )
   );
 
-  h2 {
+  .chapter {
     @include typography(
       $progress-navigation-bar-chapter-header-typography,
       (
         font-size: 1em,
+        font-weight: bold,
         line-height: 1.2em,
         margin: 0
       )

data/app/views/pageflow/progress_navigation_bar/_widget.html.erb

@@ -5,7 +5,7 @@
     <%= render 'pageflow/progress_navigation_bar/widget/bar_top', :entry => entry %>
   </div>
   <div class="scroller">
-    <ul class="navigation_dots <%= entry.chapters.count > 1 ? '' : 'no_chapters' %>">
+    <ul class="navigation_dots">
       <%= render :partial => 'pageflow/progress_navigation_bar/widget/page',
                  :collection => entry.pages.displayed_in_navigation,
                  :locals => {:image_style => :navigation_thumbnail_small, :image_width => 85, :chapters_count => entry.chapters.count} %>

data/app/views/pageflow/progress_navigation_bar/widget/_bar_top.html.erb

@@ -38,9 +38,11 @@
   </li>
   <li class="navigation_menu share" tabindex="2">
     <div class="navigation_menu_box navigation_share_box">
-      <%= render 'pageflow/entries/share_menu/facebook_link', entry: entry %>
-      <%= render 'pageflow/entries/share_menu/twitter_link', entry: entry %>
-      <%= render 'pageflow/entries/share_menu/google_link', entry: entry %>
+      <div class="share_box_icons">
+        <% entry.active_share_providers.each do |provider| %>
+          <%= render "pageflow/entries/share_menu/#{provider}_link", entry: entry %>
+        <% end %>
+      </div>
       <div class="sub_share">
         <a tabindex="2" target="_blank"><%= t('pageflow.public.share_this_entry') %></a>
         <a tabindex="2" target="_blank"><%= t('pageflow.public.share_this_page') %></a>

data/app/views/pageflow/progress_navigation_bar/widget/_page.html.erb

@@ -1,17 +1,18 @@
 <%= content_tag(:li, :class => page_navigation_css_class(page)) do %>
   <%= link_to "##{page.perma_id}", :data => {:link => page.id, :chapter_id => page.chapter_id} do %>
+    <%= page.title %>
   <% end %>
   <div class="navigation_site_detail progress_navigation">
     <% if chapters_count > 1 %>
-    <h2>
+    <div class="chapter">
       <span class="chapter_number"><%= "#{I18n.t('pageflow.public.chapter')} #{page.chapter.position + 1}" %></span>
       <span class="chapter_title"><%= page.chapter.title %></span>
-    </h2>
-    <hr />
+      <hr />
+    </div>
     <% end %>
     <%= page.title %>
     <div class="thumbnail is_<%= page.template %>">
-      <%= image_tag('', data: {src: asset_path(page.thumbnail_url(:navigation_thumbnail_large))}) %>
+      <%= image_tag('', data: {src: asset_path(page_thumbnail_url(page, :navigation_thumbnail_large))}) %>
     </div>
   </div>
 <% end %>

data/lib/pageflow/progress_navigation_bar/version.rb

@@ -1,5 +1,5 @@
 module Pageflow
   module ProgressNavigationBar
-    VERSION = '1.2.0'.freeze
+    VERSION = '1.7.0'.freeze
   end
 end

data/pageflow-progress-navigation-bar.gemspec

@@ -18,10 +18,10 @@ Gem::Specification.new do |spec|
 
   spec.required_ruby_version = '~> 2.1'
 
-  spec.add_runtime_dependency 'pageflow', ['>= 12.5.x', '< 14']
+  spec.add_runtime_dependency 'pageflow', '~> 15.x'
   spec.add_runtime_dependency 'pageflow-public-i18n', '~> 1.0'
 
-  spec.add_development_dependency 'bundler', '~> 1.0'
+  spec.add_development_dependency 'bundler', '>=1.0', '<3.0'
   spec.add_development_dependency 'rake', '~> 12.0'
 
   # Semantic versioning rake tasks

metadata

@@ -1,35 +1,29 @@
 --- !ruby/object:Gem::Specification
 name: pageflow-progress-navigation-bar
 version: !ruby/object:Gem::Version
-  version: 1.2.0
+  version: 1.7.0
 platform: ruby
 authors:
 - Codevise Solutions Ltd.
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-02-08 00:00:00.000000000 Z
+date: 2021-06-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: pageflow
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: 12.5.x
-    - - "<"
+    - - "~>"
       - !ruby/object:Gem::Version
-        version: '14'
+        version: 15.x
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: 12.5.x
-    - - "<"
+    - - "~>"
       - !ruby/object:Gem::Version
-        version: '14'
+        version: 15.x
 - !ruby/object:Gem::Dependency
   name: pageflow-public-i18n
   requirement: !ruby/object:Gem::Requirement
@@ -48,16 +42,22 @@ dependencies:
   name: bundler
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
         version: '1.0'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '3.0'
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
         version: '1.0'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '3.0'
 - !ruby/object:Gem::Dependency
   name: rake
   requirement: !ruby/object:Gem::Requirement
@@ -115,8 +115,8 @@ files:
 - app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/credits.scss
 - app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/icons/icon_font.scss
 - app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/icons/sprite.scss
+- app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/indicator.scss
 - app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/menu_boxes.scss
-- app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/share_box.scss
 - app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/typography.scss
 - app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/widget_margin.scss
 - app/assets/stylesheets/pageflow/progress_navigation_bar/vertical.scss
@@ -154,8 +154,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubyforge_project: 
-rubygems_version: 2.7.5
+rubygems_version: 3.0.8
 signing_key: 
 specification_version: 4
 summary: Pageflow navigation widget.

data/app/assets/stylesheets/pageflow/progress_navigation_bar/themes/default/share_box.scss

@@ -1,9 +0,0 @@
-$navigation-share-link-color: #9c9c9c !default;
-
-$progress-navigation-bar-share-link-color: $navigation-share-link-color !default;
-
-.navigation_share_box {
-  a p {
-    color: $progress-navigation-bar-share-link-color;
-  }
-}