pageflow-embedded-video 1.5.0 → 1.8.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f861657148c6bfefc6327c08dce8f7872e15c0ec81f5ad9e02ac2f0842c5154c
-  data.tar.gz: 218618d0c5b9e19194165d04c75db9dd738e487b6825c2167c41977c883de3c2
+  metadata.gz: 4953d1e48d49ae77ee788c40eafa938d6cbdf6120dbe0d8958bc43cc2d661485
+  data.tar.gz: cada1c6fdc972ed53bc66b8419918dc9c7491a79bae641b19fc48bb00df2f806
 SHA512:
-  metadata.gz: 4f4f5a460405ae6344e7c483478c9685f4f2716d6c1c0bd7c9f542c5918270923bde37dccf683047a8c0cd550c232cc143287b65adf4b11ead6a485ffb046140
-  data.tar.gz: d0345f1836a7b30a077570e78d8b33d4bc713c2f815bab909fcde6f83efce3e4c9958d6428065d9ef99bf1ba1e2d0cf059e92c4511990d87bb4695be8d06380a
+  metadata.gz: dd4e3644d0a87253544a5f0ad4a7e57a39adc130165aa5c431513b2cbb321baa368fc171b3857f98dbba79911ca2bf39e34f2c040727980f9212afdca10927c4
+  data.tar.gz: 592cfb3a4363ea49b54b16ba6b48788762f55e97ce46d45727d88e03a87f54bc40cd4b913524e7aef9bb89f96772b51a6acbce8dd084d5ba242c86cce3bc5282

data/.travis.yml

@@ -8,3 +8,6 @@ cache: bundler
 
 script:
   - bin/rspec
+
+services:
+  - mysql

data/CHANGELOG.md

@@ -1,14 +1,14 @@
 # CHANGELOG
 
-### Version 1.5.0
+### Version 1.8.0
 
-2019-06-18
+2022-07-18
 
-[Compare changes](https://github.com/codevise/pageflow-embedded-video/compare/1-4-stable...v1.5.0)
+[Compare changes](https://github.com/codevise/pageflow-embedded-video/compare/1-7-stable...v1.8.0)
 
-- YouTube now uses a unitless time parameter
-  ([#32](https://github.com/codevise/pageflow-embedded-video/pull/32))
+- Embed opt-in
+  ([#37](https://github.com/codevise/pageflow-embedded-video/pull/37))
 
 See
-[1-4-stable branch](https://github.com/codevise/pageflow-embedded-video/blob/1-4-stable/CHANGELOG.md)
+[1-7-stable branch](https://github.com/codevise/pageflow-embedded-video/blob/1-7-stable/CHANGELOG.md)
 for previous changes.

data/README.md

@@ -14,11 +14,11 @@ Add this line to your application's Gemfile:
 
 Run `bundle install`
 
-Register the page type:
+Register the plugin:
 
     # config/initializers/pageflow.rb
     Pageflow.configure do |config|
-      config.page_types.register(Pageflow::EmbeddedVideo.page_type)
+      config.plugin(Pageflow::EmbeddedVideo.plugin)
     end
 
 Include javascript/stylesheets:

data/app/assets/javascript/pageflow/embedded_video/consent.js

@@ -0,0 +1,41 @@
+pageflow.embeddedVideo.consent = new (pageflow.Object.extend({
+  accepted: {},
+  promises: {},
+  registered: {},
+
+  ensureVendorRegistered: function(options) {
+    var name = options.name;
+
+    if (!name || this.registered[name]) {
+      return;
+    }
+
+    this.registered[name] = true;
+
+    pageflow.consent.registerVendor(name, {
+      paradigm: options.skip ? 'skip' : 'lazy opt-in',
+      displayName: I18n.t(
+        'pageflow.public.embedded_video.consent.' + name + '.vendor_name'
+      ),
+      description: I18n.t(
+        'pageflow.public.embedded_video.consent.' + name + '.vendor_description'
+      )
+    });
+  },
+
+  setup: function(name) {
+    if (!name) {
+      return;
+    }
+
+    var that = this;
+
+    this.promises[name] = this.promises[name] ||
+      pageflow.consent.requireAccepted(name).then(function(result) {
+        if (result == 'fulfilled') {
+          that.accepted[name] = true;
+          that.trigger('accepted:' + name);
+        }
+      });
+  }
+}));

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

@@ -1,15 +1,40 @@
 /*global YT, URI, $f */
 
+pageflow.pageType.registerInitializer('embedded_video', function(configuration) {
+  var url = configuration.display_embedded_video_url;
+
+  pageflow.embeddedVideo.consent.ensureVendorRegistered({
+    name: pageflow.embeddedVideo.providerFromUrl(url),
+    skip: !pageflow.features.isEnabled('embedded_video_opt_in')
+  });
+});
+
 pageflow.react.registerPageTypeWithDefaultBackground('embedded_video', _.extend({
   prepareNextPageTimeout: 0,
 
   enhance: function(pageElement, configuration) {
+    var url = configuration.display_embedded_video_url;
+
+    pageflow.embeddedVideo.consent.setup(
+      pageflow.embeddedVideo.providerFromUrl(url)
+    );
+
+    pageElement.thirdPartyEmbedConsent();
+
+    if (!pageflow.features.isEnabled('embedded_video_opt_in')) {
+      pageElement.find('.opt_out_wrapper').hide();
+    }
+
     var that = this;
 
     pageElement.addClass('no_hidden_text_indicator');
 
     if (pageflow.features.has('mobile platform')) {
       pageElement.find('.close_button, .iframe_container').click(function(event) {
+        if ($(event.target).parents('.third_party_embed_opt_in').length) {
+          return;
+        }
+
         event.stopPropagation();
         that._pauseVideo();
         pageElement.find('.iframe_container, .close_button').removeClass('show');
@@ -101,22 +126,11 @@ pageflow.react.registerPageTypeWithDefaultBackground('embedded_video', _.extend(
     var that = this,
         iframeWrapper = pageElement.find('.iframe_wrapper'),
         captionElement = pageElement.find('.video_caption'),
+        captionTextElement = pageElement.find('.video_caption_text'),
         caption = configuration.get('video_caption');
 
-    if ((caption || '').trim() !== '') {
-      if (!captionElement.length) {
-        captionElement = $('<div class="video_caption"></div>');
-
-        if (pageElement.find('.scroller iframe').length) {
-          captionElement.insertAfter(iframeWrapper);
-        } else {
-          captionElement.appendTo(iframeWrapper);
-        }
-      }
-      captionElement.text(caption || '');
-    } else {
-      captionElement.remove();
-    }
+    captionElement.toggleClass('video_caption_blank', (caption || '').trim() === '');
+    captionTextElement.text(caption || '');
 
     if (this.active) {
       if (configuration.hasChanged('display_embedded_video_url') ||
@@ -140,6 +154,17 @@ pageflow.react.registerPageTypeWithDefaultBackground('embedded_video', _.extend(
         url = configuration.display_embedded_video_url,
         provider = pageflow.embeddedVideo.providerFromUrl(url);
 
+    pageflow.embeddedVideo.consent.setup(
+      pageflow.embeddedVideo.providerFromUrl(url)
+    );
+
+    if (!pageflow.embeddedVideo.consent.accepted[provider]) {
+      pageflow.embeddedVideo.consent.once('accepted:' + provider, function() {
+        this._createPlayer(pageElement, configuration);
+      }, this);
+      return;
+    }
+
     if (provider === 'youtube') {
       this.ytApiInitialize().done(function () {
         that._createYouTubePlayer(pageElement, url, configuration);
@@ -255,6 +280,8 @@ pageflow.react.registerPageTypeWithDefaultBackground('embedded_video', _.extend(
   },
 
   _removePlayer: function (pageElement, callback) {
+    pageflow.embeddedVideo.consent.off(null, null, this);
+
     if (this.player && typeof this.player.destroy === 'function') {
       this.player.destroy();
     }

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

@@ -1,4 +1,5 @@
 //= require_self
+//= require ./embedded_video/consent
 //= require ./embedded_video/page_type
 //= require ./URI.js
 //= require ./froogaloop.js

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

@@ -1 +1,11 @@
+$embedded-video-caption-typography: () !default;
+
 @include pageflow-page-type-pictograms("embedded_video");
+
+.embedded_video_page {
+  .video_caption {
+    @include typography(
+      $embedded-video-caption-typography
+    );
+  }
+}

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

@@ -76,6 +76,7 @@
     height: initial;
     padding-top: 56.25%;
     position: relative;
+    color: #fff;
 
     iframe {
       position: absolute;
@@ -93,7 +94,7 @@
       @include transform(translate(0,-50%));
       margin-bottom: 0;
       z-index: 1;
-      padding-top: 33%;
+      padding-top: 25.2%;
     }
 
     &:before {
@@ -214,6 +215,8 @@
     position: relative;
     display: block;
     margin-bottom: 40px;
+    padding-right: 40px;
+    box-sizing: border-box;
 
     &:before {
       content: "";
@@ -244,10 +247,22 @@
     }
   }
 
+  .video_caption_blank:before {
+    display: none;
+  }
+
   .widescreened .video_caption {
     position: absolute;
     top: 100%;
     width: 100%;
     margin-bottom: 0;
   }
+
+  .opt_out_wrapper {
+    position: absolute;
+    top: -10px;
+    right: -10px;
+    bottom: -10px;
+    left: -10px;
+  }
 }

data/app/helpers/pageflow/embedded_video/consent_helper.rb

@@ -0,0 +1,33 @@
+module Pageflow
+  module EmbeddedVideo
+    # @api private
+    module ConsentHelper
+      include PageflowPaged::ThirdPartyEmbedConsentHelper
+
+      def embedded_video_opt_in(entry, configuration)
+        vendor_name = embedded_video_consent_vendor_name(configuration)
+        return unless vendor_name
+
+        vendor_display_name = I18n.t(
+          "pageflow.public.embedded_video.consent.#{vendor_name}.vendor_name"
+        )
+
+        third_party_embed_opt_in(
+          entry: entry,
+          vendor_name: vendor_name,
+          message: t('pageflow.public.embedded_video.opt_in_prompt',
+                     vendor: vendor_display_name)
+        )
+      end
+
+      def embedded_video_consent_vendor_name(configuration)
+        if configuration['display_embedded_video_url'] =~ /youtube\.com/ ||
+           configuration['display_embedded_video_url'] =~ /youtu\.be/
+          'youtube'
+        elsif configuration['display_embedded_video_url'] =~ /vimeo\.com/
+          'vimeo'
+        end
+      end
+    end
+  end
+end

data/app/views/pageflow/embedded_video/page.html.erb

@@ -20,10 +20,18 @@
       </div>
     </div>
     <div class="iframe_container">
-      <div class="iframe_wrapper"></div>
-      <% if configuration['video_caption'].present? %>
-        <div class="video_caption"><%= configuration['video_caption'] %></div>
-      <% end %>
+      <div class="iframe_wrapper">
+        <%= embedded_video_opt_in(entry, configuration) %>
+      </div>
+      <div class="video_caption
+                  <%= configuration['video_caption'].blank? ? 'video_caption_blank' : ''%>">
+        <span class="video_caption_text">
+          <%= configuration['video_caption'] %>
+        </span>
+        <div class="opt_out_wrapper">
+          <%= third_party_embed_opt_out_info(entry) %>
+        </div>
+      </div>
     </div>
   </div>
 </div>

data/config/locales/de.yml

@@ -29,6 +29,8 @@ de:
       page_type_category_name: Media
       page_type_description: Bettet ein externes Video von YouTube oder Vimeo ein
       page_type_name: Embedded Video
+    embedded_video_opt_in:
+      feature_name: Opt-In für YouTube/Vimeo Embeds
     ui:
       configuration_editor:
         tabs:

data/config/locales/en.yml

@@ -29,6 +29,8 @@ en:
       page_type_category_name: Media
       page_type_description: Embed YouTube or Vimeo videos
       page_type_name: Embedded Video
+    embedded_video_opt_in:
+      feature_name: Opt-in for YouTube/Vimeo embeds
     ui:
       configuration_editor:
         tabs:

data/lib/pageflow/embedded_video/page_type.rb

@@ -3,10 +3,13 @@ module Pageflow
     class PageType < Pageflow::PageType
       name 'embedded_video'
 
+      def view_helpers
+        [ConsentHelper]
+      end
+
       def json_seed_template
         'pageflow/embedded_video/page_type.json.jbuilder'
       end
-
     end
   end
 end

data/lib/pageflow/embedded_video/plugin.rb

@@ -0,0 +1,10 @@
+module Pageflow
+  module EmbeddedVideo
+    class Plugin < Pageflow::Plugin
+      def configure(config)
+        config.page_types.register(EmbeddedVideo.page_type)
+        config.features.register('embedded_video_opt_in')
+      end
+    end
+  end
+end

data/lib/pageflow/embedded_video/version.rb

@@ -1,5 +1,5 @@
 module Pageflow
   module EmbeddedVideo
-    VERSION = '1.5.0'.freeze
+    VERSION = '1.8.0'.freeze
   end
 end

data/lib/pageflow-embedded-video.rb

@@ -10,6 +10,10 @@ module Pageflow
       block.call(config)
     end
 
+    def self.plugin
+      EmbeddedVideo::Plugin.new
+    end
+
     def self.page_type
       EmbeddedVideo::PageType.new
     end

data/pageflow-embedded-video.gemspec

@@ -18,11 +18,11 @@ Gem::Specification.new do |spec|
 
   spec.required_ruby_version = '~> 2.1'
 
-  spec.add_runtime_dependency 'pageflow', '~> 14.x'
+  spec.add_runtime_dependency 'pageflow', '~> 15.7.x'
   spec.add_runtime_dependency 'pageflow-public-i18n', '~> 1.0'
 
   spec.add_development_dependency 'bundler', ['>= 1.0', '< 3']
-  spec.add_development_dependency 'pageflow-support', '~> 14.x'
+  spec.add_development_dependency 'pageflow-support', ['>= 14', '< 16']
   spec.add_development_dependency 'rake', '~> 12.0'
   spec.add_development_dependency 'rspec-rails', '~> 3.0'
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: pageflow-embedded-video
 version: !ruby/object:Gem::Version
-  version: 1.5.0
+  version: 1.8.0
 platform: ruby
 authors:
 - Codevise Solutions Ltd
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-06-18 00:00:00.000000000 Z
+date: 2022-07-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: pageflow
@@ -16,14 +16,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 14.x
+        version: 15.7.x
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 14.x
+        version: 15.7.x
 - !ruby/object:Gem::Dependency
   name: pageflow-public-i18n
   requirement: !ruby/object:Gem::Requirement
@@ -62,16 +62,22 @@ dependencies:
   name: pageflow-support
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '14'
+    - - "<"
       - !ruby/object:Gem::Version
-        version: 14.x
+        version: '16'
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '14'
+    - - "<"
       - !ruby/object:Gem::Version
-        version: 14.x
+        version: '16'
 - !ruby/object:Gem::Dependency
   name: rake
   requirement: !ruby/object:Gem::Requirement
@@ -138,6 +144,7 @@ files:
 - app/assets/images/pageflow/ov-embedded_video.png
 - app/assets/javascript/pageflow/URI.js
 - app/assets/javascript/pageflow/embedded_video.js
+- app/assets/javascript/pageflow/embedded_video/consent.js
 - app/assets/javascript/pageflow/embedded_video/editor.js
 - app/assets/javascript/pageflow/embedded_video/editor/collections/embedded_videos_collection.js
 - app/assets/javascript/pageflow/embedded_video/editor/initializers/setup_collections.js
@@ -152,6 +159,7 @@ files:
 - app/assets/stylesheets/pageflow/embedded_video/custom.scss
 - app/assets/stylesheets/pageflow/embedded_video/editor.scss
 - app/assets/stylesheets/pageflow/embedded_video/themes/default.scss
+- app/helpers/pageflow/embedded_video/consent_helper.rb
 - app/views/pageflow/embedded_video/page.html.erb
 - app/views/pageflow/embedded_video/page_type.json.jbuilder
 - bin/rails-cmd
@@ -162,6 +170,7 @@ files:
 - lib/pageflow/embedded_video/configuration.rb
 - lib/pageflow/embedded_video/engine.rb
 - lib/pageflow/embedded_video/page_type.rb
+- lib/pageflow/embedded_video/plugin.rb
 - lib/pageflow/embedded_video/version.rb
 - pageflow-embedded-video.gemspec
 - spec/integration/page_type_spec.rb
@@ -185,8 +194,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubyforge_project: 
-rubygems_version: 2.7.8
+rubygems_version: 3.0.8
 signing_key: 
 specification_version: 4
 summary: Pagetype for embedded youtube/vimeo videos