pageflow-linkmap-page 2.6.1 → 2.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
-SHA256:
-  metadata.gz: f4c43af6b804159bf2faa198090f1e1f538d1c9f3d53c44047a9e220e072b874
-  data.tar.gz: 3ec34a027a778e1a8dfccdd8f81d9a332e4e4eaf663eea9c6c97f8f440188fd9
+SHA1:
+  metadata.gz: 83d3c8769a850d2e0fd78e7be7b6e0d9b6531703
+  data.tar.gz: 00a2904f41804a23f93159697c21ec2afeb6fee2
 SHA512:
-  metadata.gz: b38107bbe3d0ed938eac8082aa06e800c887cb0d4ef07f6e8b495100fe167fd41dcb8e362473fb285d13bff5519d3f98aa39a881aa494a417f37104f76c9f775
-  data.tar.gz: 4fa0f7f3985f396dea8b9d46fb197b07d0532932f695337d1dc73f1f2c7a1eaf5142132eb0227be30f1f5211b494c46ae55b3d846ef1487e8f96eace2d528cd1
+  metadata.gz: 711a2d93aabe16e4de29d6cb7521072d53fa3a21c2d6011865cfddfaf719db81c00096b42d101a06878725288cab25e2f9b96ca3bfcff4ae7333583889a7efe2
+  data.tar.gz: 98f2ca1f2d8449c4bca1490ccac8e0e6e28395a5327b667cff00a0ddc92f81ed4165e8f21b3133f33f977831edc092310bfc59b13017d7e156f86eb23a42bd1b

data/CHANGELOG.md

@@ -1,29 +1,16 @@
 # CHANGELOG
 
-### Version 2.6.1
+### Version 2.7.0
 
-2019-11-21
+2020-04-01
 
-[Compare changes](https://github.com/codevise/pageflow-linkmap-page/compare/v2.6.0...v2.6.1)
+[Compare changes](https://github.com/codevise/pageflow-linkmap-page/compare/2-6-stable...v2.7.0)
 
+- Enabled video autoplay for mobile devices.
+  ([#70](https://github.com/codevise/pageflow-linkmap-page/pull/70))
 - Delete cleanup migration
-  ([#69](https://github.com/codevise/pageflow-linkmap-page/pull/69))
-
-### Version 2.6.0
-
-2019-11-04
-
-[Compare changes](https://github.com/codevise/pageflow-linkmap-page/compare/2-5-stable...v2.6.0)
-
-- Specify mysql service for Travis build
-  ([#66](https://github.com/codevise/pageflow-linkmap-page/pull/66))
-- Use perma id for color map file and components
-  ([#65](https://github.com/codevise/pageflow-linkmap-page/pull/65))
-- Wait for color map file to be persisted
-  ([#64](https://github.com/codevise/pageflow-linkmap-page/pull/64))
-- Add import and export
-  ([#63](https://github.com/codevise/pageflow-linkmap-page/pull/63))
+  ([#68](https://github.com/codevise/pageflow-linkmap-page/pull/68))
 
 See
-[2-5-stable branch](https://github.com/codevise/pageflow-linkmap-page/blob/2-5-stable/CHANGELOG.md)
+[2-6-stable branch](https://github.com/codevise/pageflow-linkmap-page/blob/2-6-stable/CHANGELOG.md)
 for previous changes.

data/app/assets/javascript/pageflow/linkmap_page/page_type.js

@@ -187,14 +187,20 @@ pageflow.pageType.register('linkmap_page', _.extend({
     wrapper
       .attr('data-width', template.data('videoWidth'))
       .attr('data-height', template.data('videoHeight'));
-
-    var videoPlayer = this.videoPlayer = new pageflow.VideoPlayer.Lazy(template, {
+    
+    var options = {
       volumeFading: true,
       fallbackToMutedAutoplay: true,
-
       width: '100%',
       height: '100%'
-    });
+    }
+    if (pageflow.browser.has('mobile platform')) {
+      // to enable autoplay videos on mobile, 'muted' and 'playsinline' needs to be set
+      // video can be unmuted on user interaction
+      options.muted = true;
+      options.playsinline = true;
+    }
+    var videoPlayer = this.videoPlayer = new pageflow.VideoPlayer.Lazy(template, options);
 
     videoPlayer.ready(function() {
       videoPlayer.on('playmuted', function() {
@@ -431,18 +437,25 @@ pageflow.pageType.register('linkmap_page', _.extend({
   },
 
   isVideoEnabled: function(configuration) {
-    return !pageflow.browser.has('mobile platform') &&
-      (configuration.background_type === 'video' || configuration.background_type === 'hover_video');
+    return this.isBackgroundVideoEnabled(configuration) || this.isHoverVideoEnabled(configuration)
   },
 
   isBackgroundVideoEnabled: function(configuration) {
-    return !pageflow.browser.has('mobile platform') &&
-      configuration.background_type === 'video';
+    if (pageflow.browser.has('mobile platform')) {
+      return configuration.background_type === 'video' && configuration.panorama_image_id == undefined
+    }
+    else{
+      return configuration.background_type === 'video'
+    }
   },
 
   isHoverVideoEnabled: function(configuration) {
-    return !pageflow.browser.has('mobile platform') &&
-      configuration.background_type === 'hover_video';
+    if (pageflow.browser.has('mobile platform')) {
+      return configuration.background_type === 'hover_video' && configuration.hover_image_id == undefined
+    }
+    else{
+      return configuration.background_type === 'hover_video'
+    }
   },
 
   updateNavigationMode: function(configuration) {

data/app/assets/javascript/pageflow/linkmap_page/widgets/hover_video.js

@@ -75,6 +75,11 @@
       }, 300);
 
       this.element.removeClass('playing');
+    },
+
+    unmute: function () {
+      var videoPlayer = this.options.video.data('videoPlayer');
+      videoPlayer.muted(false);
     }
   });
 }(jQuery));

data/app/assets/javascript/pageflow/linkmap_page/widgets/linkmap.js

@@ -33,6 +33,10 @@
         'click': function(event) {
           var area = this.areaAt(this.positionFromEvent(event));
 
+          if (area.length && area.hasClass('hover_area')){
+            this.options.hoverVideo.unmute();
+          }
+
           if (area.length && area.hasClass('enabled')) {
             area.first().trigger($.Event('linkmapareaclick', {originalEvent: event}));
           }

data/config/locales/de.yml

@@ -101,9 +101,7 @@ de:
             so viele Hotspots angelegt werden wie gewünscht.
 
             Der Panorama Typ entscheidet darüber, ob die Seite ein
-            Hintergrund-Bild oder Hintergrund-Video zeigt. (Beachte, dass
-            Hintergrund-Videos auf mobilen Geräten nicht abgespielt werden,
-            deshalb wähle ein zusätzliches Panorama-Bild für die mobile Version)
+            Hintergrund-Bild oder Hintergrund-Video zeigt. (Ein zusätzliches Fallback-Image für die mobile Version kann bereitgestellt werden, wenn das Video nicht passt)
 
             Die Hotspot-Seite ermöglicht auch die Nutzung von Panorama-Bildern,
             die größer sind, als der sichtbare Bildschirmbereich. So können Nutzer

data/config/locales/en.yml

@@ -98,7 +98,7 @@ en:
 
             Hotspots can play audio files, link to other pages in a Pageflow or to external websites. You can define as many hotspots as you want.
 
-            Decide if you want to show a background image or a background video. (Keep in mind, that background videos will not be played on mobile devices, therefore use an additional fallback image for the mobile version)
+            Decide if you want to show a background image or a background video. (An additional fallback image for the mobile version can be provided if video does not fit)
 
             The hotspot page type allows to use panoramic images that are wider and taller than the screen-size. It enables users to explore these images by horizontal or vertical scrolling.
 

data/lib/pageflow/linkmap_page/version.rb

@@ -1,5 +1,5 @@
 module Pageflow
   module LinkmapPage
-    VERSION = '2.6.1'.freeze
+    VERSION = '2.7.0'.freeze
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: pageflow-linkmap-page
 version: !ruby/object:Gem::Version
-  version: 2.6.1
+  version: 2.7.0
 platform: ruby
 authors:
 - Codevise Solutions Ltd.
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-11-21 00:00:00.000000000 Z
+date: 2020-04-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: pageflow
@@ -372,7 +372,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.7.10
+rubygems_version: 2.6.11
 signing_key: 
 specification_version: 4
 summary: Pageflow page type for a page that contains customizable link areas