diff --git a/css/main.css b/css/main.css index 7c539b7..659cd44 100644 --- a/css/main.css +++ b/css/main.css @@ -162,7 +162,7 @@ body { color: #FFFFFF; } -#uploadingMessage { +.msg-with-spinner { position: relative; } diff --git a/index.html b/index.html index 1d56fc5..e838c20 100644 --- a/index.html +++ b/index.html @@ -528,7 +528,7 @@ - ' + ); + } } if ($('.infoThumbs').length < MAX_NUM_IMAGES) { $('#edit-track-file-selector').show(); @@ -811,6 +799,10 @@ var tmForms = { saveEditedTrackInfo: function(track) { var self = this; if (self.isValidForm('edit')) { + $('#savingMessage').fadeIn('slow'); + $('#saveSpinner').spin({left: '90%'}); + $('#saveButton').attr('disabled', 'disabled'); + var trackChanged = false; var fields = ['trackName', 'trackDescription', 'trackFav', 'trackLevel', 'trackType', 'trackRegionTags']; var t = {}; @@ -837,6 +829,9 @@ var tmForms = { var photosChanged = false; t.trackPhotos = []; var photosToDelete = []; + var grabLatLonTasks = []; + var uploadPictureTasks = []; + var resizeToBlobTasks = []; if (track.trackPhotos) { photosToDelete = track.trackPhotos.map(function() {return true}); } @@ -847,17 +842,27 @@ var tmForms = { picCaption: $(this).find('input').val() }); if ($(this).hasClass('newImage')) { - console.log(index, 'new image'); photosChanged = true; trackChanged = true; t.trackPhotos[index].picIndex = Date.now() + index; - console.log($(this).find('img')[0]); - t.trackPhotos[index].picThumbDataUrl = self.resizeImage($(this).find('img')[0], THUMBNAIL_WIDTH).toDataURL('image/jpeg', THUMB_RESIZE_QUALITY); + var img = $(this).find('img')[0]; + t.trackPhotos[index].picThumbDataUrl = self.resizeImage(img, THUMBNAIL_WIDTH).toDataURL('image/jpeg', THUMB_RESIZE_QUALITY); + grabLatLonTasks.push(self.grabLatLon(img, t.trackPhotos[index])); + URL.revokeObjectURL($(this).find('img')[0].src); + var file = $('#edit-track-photo-files')[0].files[parseInt($(this).attr('file-index'))]; + + if (file.size > MAX_IMAGE_SIZE) { + resizeToBlobTasks.push(self.resizeToBlob(track.trackId, img, t.trackPhotos[index].picIndex, uploadPictureTasks)); + } else { + uploadPictureTasks.push(self.uploadPicture(track.trackId, t.trackPhotos[index].picIndex, file)); + } } else { - console.log(index, 'old image'); var oI = parseInt($(this).attr('orig-photo-index')); photosToDelete[oI] = false; // Photo is a keeper t.trackPhotos[index].picLatLng = track.trackPhotos[oI].picLatLng; + if ((track.trackPhotos[oI].picIndex) !== undefined) { + t.trackPhotos[index].picIndex = track.trackPhotos[oI].picIndex; + } t.trackPhotos[index].picThumbDataUrl = 'data:image/jpeg;base64,' + track.trackPhotos[oI].picThumbBlob; if (index !== oI) { // If pics is reordered, make sure we replace implied picIndex with explicit one @@ -868,7 +873,6 @@ var tmForms = { if ((index !== oI) || (t.trackPhotos[index].picCaption !== track.trackPhotos[oI].picCaption)) { photosChanged = true; trackChanged = true; - console.log('photos changed'); } } }); @@ -888,12 +892,12 @@ var tmForms = { } } - // Make this a function since we have to call it from different places function updateTrack(t) { tmData.updateTrack(t, localStorage.getItem('rikitraki-token'), function(data) { + $('#savingMessage').hide(); $('#editMessage').fadeIn('slow'); setTimeout(function () { - // window.location.href='?track=' + data.trackId; + window.location.href='?track=' + data.trackId; }, 2000); }, function(jqxhr) { // jqxhr, textStatus $('#editErrorText').text('Save error, status ' + jqxhr.status + ' - ' + jqxhr.responseText); @@ -901,22 +905,24 @@ var tmForms = { console.log(jqxhr); }); } + + t.hasPhotos = (t.trackPhotos.length === 0) ? t.hasPhotos = false : t.hasPhotos = true; + if (!photosChanged) { delete t.trackPhotos; } - console.log('photos to delete? ', $.inArray(true, photosToDelete)); + if (trackChanged) { - console.log(t); - if (deletePictureTasks.length > 0) { - $.when.apply(this, deletePictureTasks).then(function () { - updateTrack(t); + $.when.apply(this, resizeToBlobTasks).then(function () { + $.when.apply(this, uploadPictureTasks).then(function () { + $.when.apply(this, grabLatLonTasks).then(function () { + $.when.apply(this, deletePictureTasks).then(function () { + updateTrack(t); + }); + }); }); - } else { - updateTrack(t); - } - } else { - console.log('no changes detected'); - } + }); + } } }, removeTrack: function(trackId) {