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

before_compile, 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



73
74
75
76
# File 'lib/wedge/plugins/uploader.rb', line 73

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

#delete(options = {}) ⇒ Object



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

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



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
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
# File 'lib/wedge/plugins/uploader.rb', line 78

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}/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



224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
# File 'lib/wedge/plugins/uploader.rb', line 224

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

#settingsObject



262
263
264
# File 'lib/wedge/plugins/uploader.rb', line 262

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

#signature(policy_data) ⇒ Object



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

def signature policy_data
  s3 = S3Signature.new policy_data, settings

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

#success(options = {}) ⇒ Object



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

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