Class: Wedge::Plugins::Uploader

Inherits:
Component show all
Defined in:
lib/wedge/plugins/uploader.rb

Defined Under Namespace

Classes: S3Signature

Instance Method Summary collapse

Methods inherited from Component

config, dom, html, html!, #method_missing, method_missing, set_dom, store, tmpl, #to_js, #wedge, wedge_config, #wedge_config, #wedge_dom, wedge_dom, #wedge_from_client?, #wedge_from_server?, #wedge_function, #wedge_html, wedge_html, #wedge_javascript, wedge_name, wedge_new, wedge_on, wedge_on_server, #wedge_plugin, #wedge_scope, #wedge_store, #wedge_tmpl, wedge_tmpl, #wedge_trigger

Methods included from Methods

#client?, included, #server?

Dynamic Method Handling

This class handles dynamic methods through the method_missing method in the class Wedge::Component

Instance Method Details

#button(el, options = {}) ⇒ Object 



85
86
87
88
 
# File 'lib/wedge/plugins/uploader.rb', line 85

def button el, options = {}
  options = { multiple: false }.merge options
  drag_n_drop el, options
end

#delete(options = {}) ⇒ Object 



58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
 
# File 'lib/wedge/plugins/uploader.rb', line 58

def delete options = {}
  options     = options.indifferent
  wedge_name   = options.delete :wedge_name
  wedge_method = options.delete :delete_method

  if wedge_name
    response.headers["Content-Type"] = 'application/json; charset=UTF-8'
    {
      success: true,
      wedge_name: wedge_name,
      wedge_method: wedge_method,
      wedge_response: wedge(wedge_name).to_js(wedge_method, options)
    }.to_json
  end
end

#drag_n_drop(el, options = {}) ⇒ Object 



90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
 
# File 'lib/wedge/plugins/uploader.rb', line 90

def drag_n_drop el, options = {}
  id            = el.attr 'id'
  container_id  = "#{id}-container"
  template_id   = "#{id}-tmpl"
  key           = options.delete(:aws_name) || '{name}-{uuid}'

  # add s3 container
  el.after drag_n_drop_tmpl template_id, options
  el.after "<div id='#{container_id}'></div>"

  container = dom.find("##{container_id}")

  uploader = el.fine_uploader_dnd({
    classes: {
      dropActive: "cssClassToAddToDropZoneOnEnter"
    }
  })

  uploader.on('processingDroppedFiles') do |event|
    # todo: display some sort of a "processing" or spinner graphic
  end

  uploader.on('processingDroppedFilesComplete') do |event, files, dropTarget|
    # todo: hide spinner/processing graphic
    container.fine_uploader_s3('addFiles', files)
  end

  uploader_settings = {
      objectProperties: {
        key: function { |key_id|
          promise = Native(`new qq.Promise()`)
          @this.setName(key_id, @this.getName(key_id).gsub(/[^0-9A-Za-z_\.\s-]/, '').gsub(/\s{1,}/,'_'));
          uuid = @this.getUuid(key_id).split('-').last
          ext = @this.getName(key_id).split('.').last
          promise.success(key.gsub('{uuid}', uuid).gsub('{name}', @this.getName(key_id)).gsub('{ext}',ext));
          promise.to_n
        }
      },
      request: {
        # // REQUIRED: We are using a custom domain
        # // for our S3 bucket, in this case.  You can
        # // use any valid URL that points to your bucket.
        endpoint: "https://#{settings[:bucket]}.s3.amazonaws.com",
        # // REQUIRED: The AWS public key for the client-side user
        # // we provisioned.
        accessKey: settings[:aws_access_key_id]
      },

      template: template_id,

      # // REQUIRED: Path to our local server where requests
      # // can be signed.
      signature: {
        endpoint: "#{Wedge.assets_url}/wedge/plugins/uploader.call?__wedge_method__=signature&__wedge_args__=__wedge_data__&__wedge_name__=uploader_plugin",
        customHeaders: {'X-CSRF-Token' => Element.find('head > meta[name="_csrf"]').attr('content') }
      },

      # // OPTIONAL: An endopint for Fine Uploader to POST to
      # // after the file has been successfully uploaded.
      # // Server-side, we can declare this upload a failure
      # // if something is wrong with the file.
      uploadSuccess: {
        endpoint: "#{Wedge.assets_url}/wedge/plugins/uploader.call?__wedge_method__=success&__wedge_args__=__wedge_data__&__wedge_name__=uploader_plugin",
        customHeaders: {'X-CSRF-Token' => Element.find('head > meta[name="_csrf"]').attr('content') }
      },

      # // optional feature
      chunking: {
          enabled: true
      },

      # // optional feature
      resume: {
          enabled: true
      },

      thumbnails: {
          placeholders: {
              # notAvailablePath: "assets/not_available-generic.png",
              # waitingPath: "assets/waiting-generic.png"
          }
      },

      callbacks: {
        onSubmitted: function { |fu_id|
          params             = options
          button             = Native(@this._buttons[0])
          el                 = Element.find(button.getInput).closest('.s3-uploader');
          params[:dom_id]      = el.attr('id')
          params[:dom_file_id] = fu_id

          if `qq.supportedFeatures.canDetermineSize`
            size = @this.getSize(fu_id)
            params[:size] = size
          end

          @this.setUploadSuccessParams(params, fu_id)
        }
      }
  }

  if options[:delete_method]
    uploader_settings[:deleteFile] = {
      enabled: true,
      forceConfirm: true,
      endpoint: "#{Wedge.assets_url}/wedge/plugins/uploader.call?__wedge_method__=delete&__wedge_args__=__wedge_data__&__wedge_name__=uploader_plugin",
      params: options,
      customHeaders: {
        'X-CSRF-Token' => Element.find('head > meta[name="_csrf"]').attr('content'),
        'Accept' => '*/*;q=0.5, text/javascript, application/javascript, application/ecmascript, application/x-ecmascript'
      }
    }
  end

  if options[:accept_files]
    uploader_settings[:validation] = {
      acceptFiles: options[:accept_files]
    }
  end

  if options[:resume_method]
    uploader_settings[:session] = {
      endpoint: "#{Wedge.assets_url}/wedge/plugins/uploader.call?__wedge_method__=resume&__wedge_args__=__wedge_data__&__wedge_name__=uploader_plugin",
      # endpoint: "#{Wedge.assets_url}/app/components/#{options[:wedge_name]}.call?wedge_method=#{options[:resume_method]}&wedge_method_args=wedge_data&wedge_name=registration",
      params: options
    }
  end
  if !options[:multiple].nil?
    uploader_settings[:multiple] = options.delete(:multiple)
  end
  fine_uploader = container.fine_uploader_s3(uploader_settings)

  fine_uploader.on('complete') do |event, _, name, response|
    return unless response

    name          = `response.wedge_name`
    dom_file_id   = `response.dom_file_id`
    method_called = `response.wedge_method`
    # fix: we should be able to get the object better than this
    data          = JSON.parse(`JSON.stringify(response.wedge_response)`)

    wedge(name).send(method_called, data)

    dom.find(".qq-file-id-#{dom_file_id}").remove unless options[:preserve_upload]
  end
end

#drag_n_drop_tmpl(id, options = {}) ⇒ Object 



237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
 
# File 'lib/wedge/plugins/uploader.rb', line 237

def drag_n_drop_tmpl id, options = {}
  <<-EOF
  <script type="text/template" id="#{id}">
    <div class="qq-uploader-selector qq-uploader">
      <div class="qq-upload-button-selector qq-upload-button">
        <div>#{options.delete(:button_name) || 'Upload a file'}</div>
      </div>
      <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
          <span>Drop file here to upload</span> </div>
      <span class="qq-drop-processing-selector qq-drop-processing">
        <span>Processing dropped files...</span>
        <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
      </span>
        <ul class="qq-upload-list-selector qq-upload-list">
            <li>
                <div class="qq-progress-bar-container-selector">
                    <div class="qq-progress-bar-selector qq-progress-bar"></div>
                </div>
                <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
                <img class="qq-thumbnail-selector" qq-max-size="100" qq-server-scale>
                <span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
                <span class="qq-upload-file-selector qq-upload-file"></span>
                <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
                <span class="qq-upload-size-selector qq-upload-size"></span>
                <a class="qq-upload-cancel-selector btn-small btn-warning" href="#">Cancel</a>
                <a class="qq-upload-retry-selector btn-small btn-info" href="#">Retry</a>
                <a class="qq-upload-delete-selector btn-small btn-warning" href="#">Delete</a>
                <a class="qq-upload-pause-selector btn-small btn-info" href="#">Pause</a>
                <a class="qq-upload-continue-selector btn-small btn-info" href="#">Continue</a>
                <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
                <a class="view-btn btn-small btn-info hide" target="_blank">View</a>
            </li>
        </ul>
    </div>
  </script>
  EOF
end

#resume(options = {}) ⇒ Object 



74
75
76
77
78
79
80
81
82
83
 
# File 'lib/wedge/plugins/uploader.rb', line 74

def resume options = {}
  options     = options.indifferent
  wedge_name   = options.delete :wedge_name
  wedge_method = options.delete :resume_method

  if wedge_name
    response.headers["Content-Type"] = 'application/json; charset=UTF-8'
    wedge(wedge_name).send(wedge_method, options)
  end
end

#settings ⇒ Object 



275
276
277
 
# File 'lib/wedge/plugins/uploader.rb', line 275

def settings
  @settings ||= store[:settings]
end

#signature(policy_data) ⇒ Object 



32
33
34
35
36
37
38
39
 
# File 'lib/wedge/plugins/uploader.rb', line 32

def signature policy_data
  s3 = S3Signature.new policy_data, settings

  {
    policy: s3.policy,
    signature: s3.signature
  }.to_json
end

#success(options = {}) ⇒ Object 



41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 
# File 'lib/wedge/plugins/uploader.rb', line 41

def success options = {}
  options      = options.indifferent
  wedge_name   = options.delete :wedge_name
  wedge_method = options.delete :wedge_method

  if wedge_name
    response.headers["Content-Type"] = 'application/json; charset=UTF-8'
    {
      success: true,
      wedge_name: wedge_name,
      wedge_method: wedge_method,
      wedge_response: wedge(wedge_name).to_js(wedge_method, options),
      dom_file_id: options[:dom_file_id]
    }.to_json
  end
end