embedded iframe for videos

Repo_README.md

@@ -0,0 +1,12 @@
+# ATLA Hyku
+## Project Specific Info
+### Youtube/Vimeo Video Player For Works
+- Works will have the option to add a youtube or vimeo player via an embed link
+- This link must be a correctly formatted embed link from either youtube or vimeo.
+- To find this link:
+    - Navigate to the url of the video you would like to include.
+    - Click the "share" button
+    - You will see a link or a section called "Embed". View the embed code for the video
+    - Copy JUST the link. The link will be formatted as so for Youtube and Vimeo respectively:
+      - https://www.youtube.com/embed/Znf73dsFdC8
+      - https://player.vimeo.com/video/467264493?h=b089de0eab

app/assets/stylesheets/viewer.scss

@@ -5,9 +5,6 @@
 .viewer {
   height: 100%;
   padding: 10px;
-  iframe {
-    // position: absolute;
-  }
 }
 
 #viewer-modal {
@@ -21,3 +18,8 @@
     margin-bottom: 10px;
   }
 }
+
+.video-embed-viewer {
+  aspect-ratio: 16 / 9;
+  width: 100%;
+}

app/forms/hyrax/generic_work_form.rb

@@ -7,6 +7,10 @@ class GenericWorkForm < Hyrax::Forms::WorkForm
     include Hyrax::FormTerms
     self.model_class = ::GenericWork
     include HydraEditor::Form::Permissions
-    self.terms += %i[resource_type]
+    self.terms += %i[resource_type video_embed]
+
+    def primary_terms
+      super + %i[video_embed]
+    end
   end
 end

app/models/generic_work.rb

@@ -2,12 +2,33 @@
 
 class GenericWork < ActiveFedora::Base
   include ::Hyrax::WorkBehavior
-  include ::Hyrax::BasicMetadata
   include IiifPrint.model_configuration(
     pdf_split_child_model: self
   )
+  # this line needs to be before the validations & properties in order for them to be indexed correctly
+  self.indexer = GenericWorkIndexer
 
   validates :title, presence: { message: 'Your work must have a title.' }
+  # rubocop:disable Style/RegexpLiteral
+  validates :video_embed,
+            format: {
+              # regex matches only youtube & vimeo urls that are formatted as embed links.
+              with: /(http:\/\/|https:\/\/)(www\.)?(player\.vimeo\.com|youtube\.com\/embed)/,
+              message: "Error: must be a valid YouTube or Vimeo Embed URL."
+            },
+            if: :video_embed?
+  # rubocop:enable Style/RegexpLiteral
 
-  self.indexer = GenericWorkIndexer
+  property :video_embed, predicate: ::RDF::URI("https://atla.com/terms/video_embed"), multiple: false do |index|
+    index.as :stored_searchable
+  end
+
+  def video_embed?
+    video_embed.present?
+  end
+
+  # This must be included at the end of the file,
+  # This line finalizes the metadata schema
+  # (by adding accepts_nested_attributes)
+  include ::Hyrax::BasicMetadata
 end

app/models/solr_document.rb

@@ -30,6 +30,7 @@ class SolrDocument
   attribute :extent, Solr::Array, 'extent_tesim'
   attribute :rendering_ids, Solr::Array, 'hasFormat_ssim'
   attribute :account_cname, Solr::Array, 'account_cname_tesim'
+  attribute :video_embed, Solr::String, 'video_embed_tesim'
   attribute :institution, Solr::String, 'institution_tesim'
   attribute :format, Solr::Array, 'format_tesim'
   attribute :rights_holder, Solr::Array, 'rights_holder_tesim'

app/presenters/hyku/work_show_presenter.rb

@@ -66,8 +66,16 @@ def iiif_viewer?
         members_include_viewable?
     end
 
+    def video_embed_viewer?
+      extract_video_embed_presence
+    end
+
     private
 
+      def extract_video_embed_presence
+        solr_document[:video_embed_tesim].present?
+      end
+
       def iiif_media?(presenter: representative_presenter)
         presenter.image? || presenter.video? || presenter.audio? || presenter.pdf?
       end

app/views/hyrax/base/_form.html.erb

@@ -0,0 +1,24 @@
+<%# OVERRIDE Hyrax 3.5.0 to remove the broken error alerts from form validations %>
+
+<%= simple_form_for [main_app, @form],
+                    html: {
+                      data: { behavior: 'work-form',
+                              'param-key' => @form.model_name.param_key },
+                      multipart: true
+                    } do |f| %>
+  <%# OVERRIDE Here to remove broken error alert from form validation %>
+  <% if Flipflop.batch_upload? && !f.object.persisted? %>
+    <% provide :metadata_tab do %>
+      <p class="switch-upload-type"><%= t('.batch_upload_hint') %> <%= link_to t('.batch_link'), hyrax.new_batch_upload_path(payload_concern: @form.model.class) %></p>
+    <% end %>
+  <% end %>
+  <%= render 'hyrax/base/guts4form', f: f, tabs: form_tabs_for(form: f.object) %>
+<% end %>
+
+<script type="text/javascript">
+  Blacklight.onLoad(function() {
+    <%# This causes the page to switch back to the default template if they've
+        previously visited the batch download page in this Turbolinks session %>
+    $("#fileupload").fileupload('option', 'downloadTemplateId', 'template-download')
+  });
+</script>

app/views/hyrax/base/_video_embed_viewer.html.erb

@@ -0,0 +1,3 @@
+<div class="col-sm-12">
+  <iframe class='video-embed-viewer' src="<%="#{@presenter.solr_document[:video_embed_tesim].first}"%>" title="Video Player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+</div>

app/views/hyrax/base/show.html.erb

@@ -15,16 +15,27 @@
       <div class="panel-body">
         <div class="row">
           <%= render 'workflow_actions_widget', presenter: @presenter %>
-          <% if @presenter.iiif_viewer? %>
-            <div class="col-sm-12">
-              <%= render 'representative_media', presenter: @presenter, viewer: true %>
+          <% if @presenter.video_embed_viewer? %>
+            <%= render 'video_embed_viewer', presenter: @presenter %>
+          <% else %>
+            <% if @presenter.iiif_viewer? %>
+              <div class="col-sm-12">
+                <%= render 'representative_media', presenter: @presenter, viewer: true %>
+              </div>
+            <% else %>
+              <div class="col-sm-3 text-center">
+                <%= render 'representative_media', presenter: @presenter, viewer: false %>
+                <%= render 'citations', presenter: @presenter %>
+                <%= render 'social_media' %>
+              </div>
+            <% end %>
+          <% end %>
+          <% if @presenter.iiif_viewer? || @presenter.video_embed_viewer?%>
+            <div class="col-sm-3 text-center">
+              <%= render 'citations', presenter: @presenter %>
+              <%= render 'social_media' %>
             </div>
           <% end %>
-          <div class="col-sm-3 text-center">
-            <%= render 'representative_media', presenter: @presenter, viewer: false unless @presenter.iiif_viewer? %>
-            <%= render 'citations', presenter: @presenter %>
-            <%= render 'social_media' %>
-          </div>
           <div class="col-sm-9">
             <%= render 'work_description', presenter: @presenter %>
             <%= render 'metadata', presenter: @presenter %>

app/views/layouts/hyrax/dashboard.html.erb

@@ -0,0 +1,43 @@
+<%# OVERRIDE from Hyrax 3.5.0 to hide broken flash messages on the dashboard edit work pages %>
+
+<!DOCTYPE html>
+<html lang="<%= I18n.locale.to_s %>" prefix="og:http://ogp.me/ns#">
+  <head>
+    <%= render partial: 'layouts/head_tag_content' %>
+    <%= content_for(:head) %>
+  </head>
+
+  <body class="dashboard">
+    <div class="skip-to-content">
+      <%= link_to "Skip to Content", "#skip-to-content" %>
+    </div>
+    <%= render '/masthead' %>
+    <%= content_for(:navbar) %>
+    <div id="content-wrapper" role="main">
+      <div class="sidebar maximized">
+        <%= render 'hyrax/dashboard/sidebar' %>
+      </div>
+      <div class="main-content maximized">
+        <%# OVERRIDE here to hide broken flash messages on the dashboard edit work pages. %>
+        <%# regex includes only the paths for works since this is the only known place flash messages are broken. %>
+          <%= render '/flash_msg' %>
+          <%#= raise 'hell' %>
+        <%= render_breadcrumbs builder: Hyrax::BootstrapBreadcrumbsBuilder %>
+        <% if content_for?(:page_header) %>
+          <div class="row">
+            <div class="col-xs-12 main-header">
+              <%= yield(:page_header) %>
+            </div>
+          </div>
+        <% end %>
+
+          <a name="skip-to-content" id="skip-to-content"></a>
+          <%= render 'shared/read_only' if Flipflop.read_only? %>
+          <%= content_for?(:content) ? yield(:content) : yield %>
+
+      </div>
+
+    </div><!-- /#content-wrapper -->
+    <%= render 'shared/ajax_modal' %>
+  </body>
+</html>

app/views/themes/cultural_show/hyrax/base/show.html.erb

@@ -11,17 +11,22 @@
       <div class="panel-body">
         <div class="row">
           <%= render 'workflow_actions_widget', presenter: @presenter %>
-          <% if @presenter.universal_viewer? %>
-            <div class="col-sm-12 centered-media">
-              <%= render 'representative_media', presenter: @presenter, viewer: true %>
-            </div>
-          <% end %>
           <div class="col-sm-12">
             <%= render "show_actions", presenter: @presenter %>
           </div>
-          <div class="centered-media <%= !@presenter.universal_viewer? ? 'col-sm-6 text-center' : '' %>">
-            <%= render 'representative_media', presenter: @presenter, viewer: false unless @presenter.universal_viewer? %>
-          </div>
+          <% if @presenter.video_embed_viewer? %>
+            <%= render 'video_embed_viewer', presenter: @presenter %>
+          <% else %>
+            <% if @presenter.universal_viewer? %>
+              <div class="col-sm-12 centered-media">
+                <%= render 'representative_media', presenter: @presenter, viewer: true %>
+              </div>
+            <% else %>
+              <div class="centered-media <%= !@presenter.universal_viewer? ? 'col-sm-6 text-center' : '' %>">
+                <%= render 'representative_media', presenter: @presenter, viewer: false %>
+              </div>
+            <% end %>
+          <% end %>
           <div class="<%= @presenter.universal_viewer? ? 'col-sm-6' : 'col-sm-6' %>">
             <%= render 'work_description', presenter: @presenter %>
             <%= render 'metadata', presenter: @presenter %>

app/views/themes/scholarly_show/hyrax/base/show.html.erb

@@ -16,26 +16,35 @@
       <div class="panel-body">
         <div class="row">
           <%= render 'workflow_actions_widget', presenter: @presenter %>
-          <% if @presenter.universal_viewer? %>
-            <div class="col-sm-12">
-              <%= render 'representative_media', presenter: @presenter, viewer: true %>
-            </div>
+          <% if @presenter.video_embed_viewer? %>
+            <%= render 'video_embed_viewer', presenter: @presenter %>
             <div class="col-sm-12">
               <div class="image-show-description">
                 <%= render 'work_description', presenter: @presenter %>
               </div>
-            </div> 
-          <% else %>
-            <div class="col-sm-3 mb-1">
-              <%= render 'representative_media', presenter: @presenter, viewer: false unless @presenter.universal_viewer? %>
-            </div>
-            <div class="col-sm-9">
-              <%= render 'work_description', presenter: @presenter %>
             </div>
+          <% else %>
+            <% if @presenter.universal_viewer? %>
+              <div class="col-sm-12 centered-media">
+                <%= render 'representative_media', presenter: @presenter, viewer: true %>
+              </div>
+              <div class="col-sm-12">
+                <div class="image-show-description">
+                  <%= render 'work_description', presenter: @presenter %>
+                </div>
+              </div>
+            <% else %>
+              <div class="col-sm-3 mb-1">
+                <%= render 'representative_media', presenter: @presenter, viewer: false %>
+              </div>
+              <div class="col-sm-9">
+                <%= render 'work_description', presenter: @presenter %>
+              </div>
+            <% end %>
           <% end %>
         </div>
         <div class="row">
-          <div class="col-sm-12 image-show-metadata">  
+          <div class="col-sm-12 image-show-metadata">
             <%= render 'metadata', presenter: @presenter %>
           </div>
           <div class="col-sm-12">

config/initializers/bulkrax.rb

@@ -64,6 +64,7 @@
 
     config.field_mappings["Bulkrax::CsvParser"] = default_field_mapping.merge({
       # add or remove custom mappings for this parser here
+      'video_embed' => { from: ['video_embed'] }
     })
 
     config.field_mappings["Bulkrax::OaiDcParser"] = default_field_mapping.merge({

config/locales/hyrax.en.yml

@@ -1142,6 +1142,7 @@ en:
         resource_type: Pre-defined categories to describe the type of content being uploaded, such as "article" or "dataset."  More than one type may be selected.
         subject: Headings or index terms describing what the work is about; these do need to conform to an existing vocabulary.
         title: A name to aid in identifying a work.
+        video_embed: "If you enter an embed link for a video, it must be a properly formatted url beginning with 'http://' or 'https://'. It also needs to contain a valid link to a hosted video that can appear in an iframe. <br /><br /><i>Examples:<br/>https://player.vimeo.com/video/467264493?h=b089de0eab<br/>https://www.youtube.com/embed/Znf73dsFdC8</i>"
     labels:
       collection:
         size: Size

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 2023_02_08_001228) do
+ActiveRecord::Schema.define(version: 2023_01_31_202855) do
 
   # These are extensions that must be enabled in order to support this database
   enable_extension "plpgsql"