Support sending multiple images

This commit is contained in:
Magnus Hauge Bakke 2015-10-12 21:09:13 +02:00 committed by Lorenz Hübschle-Schneider
parent f2bb543796
commit 3f661ded6c
5 changed files with 55 additions and 31 deletions

View File

@ -362,15 +362,19 @@ td.time {
}
#imgur-upload-progress {
display: none;
content: " ";
width: 100%;
height: auto;
position: absolute;
bottom: 100%;
left: 0;
}
.imgur-progress-bar {
width: 0%;
height: 5px;
position: absolute;
top: -5px;
left: 0;
margin-top: 1px;
background: #428BCA;
}
}
/* fix for mobile firefox which ignores :hover */
.nav-pills > li > a:active, .nav-pills > li > a:active span {

View File

@ -5,7 +5,7 @@
<span class="input-group-btn">
<label class="btn btn-send-image unselectable" for="imgur-upload" title="Send image">
<i class="glyphicon glyphicon-picture"></i>
<input type="file" accept="image/*" title="Send image" id="imgur-upload" class="imgur-upload" file-change="uploadImage($event, files)">
<input type="file" accept="image/*" multiple title="Send image" id="imgur-upload" class="imgur-upload" file-change="uploadImage($event, files)">
</label>
<button class="btn btn-send unselectable"><i class="glyphicon glyphicon-send"></i></button>
</span>

View File

@ -21,20 +21,25 @@ weechat.directive('imgurDrop', ['connection','imgur', function(connection, imgur
e.stopPropagation();
e.preventDefault();
// Check files length
if (files.length > 0) {
// Sorry only one file
var file = files[0];
// Upload to imgur
imgur.process(file, function(imageUrl) {
// Send image url after upload
var sendImageUrl = function(imageUrl) {
// Send image
if(imageUrl !== undefined && imageUrl !== '') {
connection.sendMessage( String(imageUrl) );
connection.sendMessage(String(imageUrl));
}
};
// Check files
if(typeof files !== "undefined" && files.length > 0) {
// Loop through files
for (var i = 0; i < files.length; i++) {
// Upload to imgur
imgur.process(files[i], sendImageUrl);
}
});
}
};
}

View File

@ -29,9 +29,16 @@ weechat.factory('imgur', ['$rootScope', function($rootScope) {
// Set client ID (Glowing Bear)
var clientId = "164efef8979cd4b";
// Progress bar DOM elment
var progressBar = document.getElementById("imgur-upload-progress");
progressBar.style.width = '0';
// Progress bars container
var progressBars = document.getElementById("imgur-upload-progress"),
currentProgressBar = document.createElement("div");
// Set progress bar attributes
currentProgressBar.className='imgur-progress-bar';
currentProgressBar.style.width = '0';
// Append progress bar
progressBars.appendChild(currentProgressBar);
// Create new form data
var fd = new FormData();
@ -51,7 +58,8 @@ weechat.factory('imgur', ['$rootScope', function($rootScope) {
// Handler for response
xhttp.onload = function() {
progressBar.style.display = 'none';
// Remove progress bar
currentProgressBar.parentNode.removeChild(currentProgressBar);
// Check state and response status
if(xhttp.status === 200) {
@ -87,8 +95,7 @@ weechat.factory('imgur', ['$rootScope', function($rootScope) {
var complete = (event.loaded / event.total * 100 | 0);
// Set progress bar width
progressBar.style.display = 'block';
progressBar.style.width = complete + '%';
currentProgressBar.style.width = complete + '%';
}
};

View File

@ -70,12 +70,9 @@ weechat.directive('inputBar', function() {
}, 0);
};
$scope.uploadImage = function( $event, files ) {
// Get file
var file = files[0];
// Process image
imgur.process(file, function(imageUrl) {
$scope.uploadImage = function($event, files) {
// Send image url after upload
var sendImageUrl = function(imageUrl) {
// Send image
if(imageUrl !== undefined && imageUrl !== '') {
@ -98,10 +95,21 @@ weechat.directive('inputBar', function() {
inputNode.focus();
var pos = $scope.command.length - suffix.length;
inputNode.setSelectionRange(pos, pos);
// force refresh?
$scope.$apply();
}, 0);
}
});
};
if(typeof files !== "undefined" && files.length > 0) {
// Loop through files
for (var i = 0; i < files.length; i++) {
// Process image
imgur.process(files[i], sendImageUrl);
}
}
};
// Send the message to the websocket