Blame view

common/modules/file/assets/js/jquery.fileupload-video.js 3.45 KB
8c448b56   Administrator   add yii jquery
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
  /*
   * jQuery File Upload Video Preview Plugin
   * https://github.com/blueimp/jQuery-File-Upload
   *
   * Copyright 2013, Sebastian Tschan
   * https://blueimp.net
   *
   * Licensed under the MIT license:
   * http://www.opensource.org/licenses/MIT
   */
  
  /* jshint nomen:false */
  /* global define, require, window, document */
  
  (function (factory) {
      'use strict';
      if (typeof define === 'function' && define.amd) {
          // Register as an anonymous AMD module:
          define([
              'jquery',
              'load-image',
              './jquery.fileupload-process'
          ], factory);
      } else if (typeof exports === 'object') {
          // Node/CommonJS:
          factory(
              require('jquery'),
              require('load-image')
          );
      } else {
          // Browser globals:
          factory(
              window.jQuery,
              window.loadImage
          );
      }
  }(function ($, loadImage) {
      'use strict';
  
      // Prepend to the default processQueue:
      $.blueimp.fileupload.prototype.options.processQueue.unshift(
          {
              action: 'loadVideo',
              // Use the action as prefix for the "@" options:
              prefix: true,
              fileTypes: '@',
              maxFileSize: '@',
              disabled: '@disableVideoPreview'
          },
          {
              action: 'setVideo',
              name: '@videoPreviewName',
              disabled: '@disableVideoPreview'
          }
      );
  
      // The File Upload Video Preview plugin extends the fileupload widget
      // with video preview functionality:
      $.widget('blueimp.fileupload', $.blueimp.fileupload, {
  
          options: {
              // The regular expression for the types of video files to load,
              // matched against the file type:
              loadVideoFileTypes: /^video\/.*$/
          },
  
          _videoElement: document.createElement('video'),
  
          processActions: {
  
              // Loads the video file given via data.files and data.index
              // as video element if the browser supports playing it.
              // Accepts the options fileTypes (regular expression)
              // and maxFileSize (integer) to limit the files to load:
              loadVideo: function (data, options) {
                  if (options.disabled) {
                      return data;
                  }
                  var file = data.files[data.index],
                      url,
                      video;
                  if (this._videoElement.canPlayType &&
                          this._videoElement.canPlayType(file.type) &&
                          ($.type(options.maxFileSize) !== 'number' ||
                              file.size <= options.maxFileSize) &&
                          (!options.fileTypes ||
                              options.fileTypes.test(file.type))) {
                      url = loadImage.createObjectURL(file);
                      if (url) {
                          video = this._videoElement.cloneNode(false);
                          video.src = url;
                          video.controls = true;
                          data.video = video;
                          return data;
                      }
                  }
                  return data;
              },
  
              // Sets the video element as a property of the file object:
              setVideo: function (data, options) {
                  if (data.video && !options.disabled) {
                      data.files[data.index][options.name || 'preview'] = data.video;
                  }
                  return data;
              }
  
          }
  
      });
  
  }));