calref / cadence

A strophe.js-powered XMPP web client for chatrooms.
0 stars 0 forks source link

files.calref integration #17

Open sylae opened 9 years ago

sylae commented 9 years ago

A calref-specific extension to allow uploading files to files.calref directly through the chat. The user would most likely interface with this by drag-dropping a file into inputField, which would trigger a function similar to that used on files.calref (shown below). The bulk of this code is for rendering a progress bar, but strip that away and it should work perfectly well.

// Assuming #filesCalref has an <input type="file" name="pic" /> in it.
(function() {

var bar = $('#progress');

$('#filesCalref').ajaxForm({
    beforeSend: function() {
        var percentVal = '0%';
        bar.addClass("active progress-bar-striped").removeClass("progress-bar-success progress-bar-danger");
    },
    uploadProgress: function(event, position, total, percentComplete) {
        var percentVal = percentComplete + '%';
        bar.css("width", percentVal);
        bar.html(percentVal);
    },
    success: function() {
        var percentVal = '100%';
        bar.css("width", percentVal);
        bar.html(percentVal);
    },
  complete: function(xhr) {
    var payload = $.parseJSON(xhr.responseText);
    if (payload[0] == 1) {
      bar.html("Complete");
      bar.removeClass("active progress-bar-striped progress-bar-danger").addClass("progress-bar-success");
      $("#regURL").val("https://c312441.ssl.cf1.rackcdn.com/files.calref/" + payload[1]).css("cursor", "default");
      $("#lURL").val("https://c312441.ssl.cf1.rackcdn.com/files.calref/" + payload[1]).css("cursor", "default");
      $("#urls").css("display","");
    } else {
      bar.html("Failure :(");
      bar.removeClass("active progress-bar-striped progress-bar-success").addClass("progress-bar-danger");
    }
  }
}); 

})(); 

The above code would require a new submodule to https://github.com/malsup/form/

sylae commented 9 years ago

http://stackoverflow.com/questions/9544977/using-jquery-on-for-drop-events-when-uploading-files-from-the-desktop

cburschka commented 9 years ago

Sweet!