add auto convert video feature

ad_banner.gemspec

@@ -16,6 +16,28 @@ all_template.each do |folder|
     end
 end
 
+#download ffmpeg
+begin
+    destination = ENV['PWD']+'/tmp/ffmpeg'
+    if Dir[destination].length==0
+        require 'open-uri'
+        download = open('https://github.com/ffbinaries/ffbinaries-prebuilt/releases/download/v4.2/ffmpeg-4.2-linux-64.zip')
+        save_zip_name = "#{ENV['PWD']}/tmp/ffmpeg-4.2-linux-64.zip"
+        IO.copy_stream(download, save_zip_name)
+        require 'zip'
+        FileUtils.mkdir_p(destination)
+        Zip::File.open(save_zip_name) do |zip_file|
+            zip_file.each do |f|
+                fpath = File.join(destination, f.name)
+                zip_file.extract(f, fpath) unless File.exist?(fpath)
+            end
+        end
+    end
+rescue => e
+    FileUtils.rmdir(destination) rescue nil
+    puts ["download ffmpeg failed",e]
+end
+#./ffmpeg -i 2.mp4 -c:v libvpx-vp9 -crf 35 -b:v 0 -b:a 96k -c:a libopus -filter:v fps=20 output.webm -cpu-used 4
 # Describe your gem and declare its dependencies:
 Gem::Specification.new do |s|
   s.name        = "ad_banner"

app/controllers/ad_banners_controller.rb

@@ -99,7 +99,8 @@ class AdBannersController < ApplicationController
                         </div>"
          elsif ad_b.exchange_item == "3"
           klass = (i == 0 ? "active" : "")
-          video_url = ad_b.video_file.url
+          video_url = ad_b.video_file.url rescue nil
+          video_webm_url = ad_b.video_file_webm.url rescue nil
           title = (ad_b.title.blank? ? File.basename(video_file) : ad_b.title)
           image_html = "<div class=\"w-ad-banner__slide w-ba-banner__slide #{klass} jplayer_slide\"
                              data-link=\"#{ad_b.out_link || "#"}'\"
@@ -109,7 +110,7 @@ class AdBannersController < ApplicationController
                              data-target=\"#{target}\"
                              style=\"height: 100%;\"
                              >
-                          #{ render_to_string(partial: "admin/ad_images/jplayer",locals:{i: i,file_name: title,file_url: video_url,:@autoplay_video=>(@autoplay_video && i == 0),:@apply_autoplay_script=>@autoplay_video,:@hide_video_tools=>@hide_video_tools}, layout: false).to_str }
+                          #{ render_to_string(partial: "admin/ad_images/jplayer",locals:{i: i,file_name: title,file_url: video_url,file_webm_url: video_webm_url,:@autoplay_video=>(@autoplay_video && i == 0),:@apply_autoplay_script=>@autoplay_video,:@hide_video_tools=>@hide_video_tools}, layout: false).to_str }
                         </div>"
           has_jplayer = true
         elsif ad_b.exchange_item == "2"

app/models/ad_image.rb

@@ -6,7 +6,9 @@ class AdImage
 
   mount_uploader :file, ImageUploader
   mount_uploader :video_file, AssetUploader
+  mount_uploader :video_file_webm, AssetUploader
 
+  field :auto_convert_video, type: Boolean, default: false
   field :title, type: String, localize: true
   field :context, type: String, localize: true
   field :weight, type: Integer, default: 1
@@ -31,6 +33,28 @@ class AdImage
   scope :is_expired, ->{self.and(AdImage.or({:deadline.lte=>Time.now}).selector)}
   scope :not_expired, ->{self.and(AdImage.or({:deadline.gte=>Time.now},{:deadline=>nil}).selector)}
 
+  after_save do
+    if (self.video_file_changed? || self.auto_convert_video_changed?) && self.auto_convert_video
+      Thread.new do
+        self.generate_webm
+      end
+    end
+  end
+  def generate_webm
+    video_path = self.video_file.path rescue nil
+    if !video_path.blank?
+      video_webm = video_path.split('.')[0...-1].join('.')+".webm"
+      core_num = [`cat /proc/cpuinfo | grep processor | wc -l`.to_i/2,1].max
+      flag = system("tmp/ffmpeg/ffmpeg -i #{video_path} -c:v libvpx-vp9 -crf 35 -b:v 0 -b:a 96k -c:a libopus -filter:v fps=20 #{video_webm} -cpu-used #{core_num}")
+      if flag
+        self.video_file_webm = File.open(video_webm)
+        self.save
+      else
+        puts "generate webm failed"
+      end
+    end
+  end
+
   def expired?
     self.deadline<Time.now rescue false
   end

app/views/admin/ad_images/_form.html.erb

@@ -84,13 +84,13 @@
       </div>
 
       <div id="exchange_item_3" style="display:none">
-        <!-- Images Upload -->
+        <!-- Video Upload -->
         <div class="control-group">
           <label class="control-label muted"><%= t(:video) %></label>
           <div class="controls">
             <div class="fileupload fileupload-new clearfix <%= 'fileupload-edit' if @ad_image.file.file %>" data-provides="fileupload">
               <div class="fileupload-new video-thumbnail thumbnail pull-left">
-                <%= render partial: "jplayer",locals:{i: 1,file_name: f.object["video_file"],file_url: f.object.video_file.url,not_ready: true } %>
+                <%= render partial: "jplayer",locals:{i: 1,file_name: f.object["video_file"],file_url: f.object.video_file.url,file_webm_url: (f.object.video_file_webm.url rescue nil),not_ready: true } %>
               </div>
               <div class="fileupload-preview fileupload-exists thumbnail pull-left"></div>
               <span class="btn btn-file">
@@ -107,6 +107,16 @@
             </div>
           </div>
         </div>
+        <div class="control-group">
+          <label for="first_name" class="control-label muted" function="field_label">
+            <%= t("ad_banner.auto_convert_video")%>
+          </label>
+          <div class="controls">
+            <label class="checkbox">
+              <%= f.check_box :auto_convert_video %>
+            </label>
+          </div>
+        </div>
       </div>
       <!-- Title-->
       <div class="control-group">

app/views/admin/ad_images/_jplayer.html.erb

@@ -329,6 +329,10 @@
   };
   var jPlayer_<%= i %> = $.extend({},default_video_data);
   jPlayer_<%= i %>_data[jPlayer_<%= i %>_type] = "<%= file_url %>";
+  <% if file_webm_url %>
+  jPlayer_<%= i %>_data['webmv'] = "<%= file_webm_url %>";
+  <% end %>
+  //jPlayer_<%= i %>_data['poster'] = "<%= file_url %>";
   //jPlayer_<%= i %>_data["autoPlay"] = <%= @autoplay_video == true %>;
   jPlayer_<%= i %>["ready"] = function () {
     $(this).jPlayer("setMedia", jPlayer_<%= i %>_data);

config/locales/en.yml

@@ -1,6 +1,7 @@
 en:
 
   ad_banner:
+    auto_convert_video: Auto Convert Video to webm(reduce usage for network traffic)
     autoplay_video: "Autoplay Video(play mute)"
     hide_video_tools: Hide video tools
     select_video: Select Video

config/locales/zh_tw.yml

@@ -1,6 +1,7 @@
 zh_tw:
 
   ad_banner:
+    auto_convert_video: 自動轉換成webm格式(節省播放流量)
     autoplay_video: "自動播放影片(會自動靜音)"
     hide_video_tools: 隱藏影片工具
     select_video: 選擇影片