diff --git a/app/display/display.html b/app/display/display.html index f5dee2e..ce12b2d 100644 --- a/app/display/display.html +++ b/app/display/display.html @@ -18,13 +18,34 @@ + + + +

Display

- +
+ +
+
+

Owner: {{selected.owner}}

+

Subject: {{selected.subject}}

+

Group ID: {{selected.permit}}

+

Location: {{selected.place}}

+

Date Taken: {{selected.timing}}

+

Photo ID: {{selected.id}}

+
+
@@ -34,7 +55,7 @@

My Pictures

Group Pictures

- +
diff --git a/app/display/display.js b/app/display/display.js index 805bcfc..6c55963 100644 --- a/app/display/display.js +++ b/app/display/display.js @@ -9,12 +9,14 @@ angular.module("myApp.display", ["ngRoute", "LocalStorageModule", "myApp.display .controller("displayController", function($scope, $location, localStorageService, displayHandler) { var usernameFromStorage, - storageKey = "user"; + storageKey = "user", + currentImage; // Initializes array of pictures $scope.myPictures = []; $scope.groupPictures = []; $scope.popularPictures = []; + $scope.selected; function getItem(key) { return localStorageService.get(key); @@ -28,19 +30,27 @@ angular.module("myApp.display", ["ngRoute", "LocalStorageModule", "myApp.display } function parseImageResult (result){ - var photo = result.slice(7, result.length-2); + // var photo = result.slice(8, result.length-2); + var photo = result.slice(7, result.length-2); + //console.log(photo); return photo; }; function parseThumbResult (result){ var thumb = result.slice(8, result.length-2); - //console.log(thumb); return thumb; }; + $scope.editPhoto = function(){ + displayHandler.curr_image = currentImage; + $location.url("/edit"); + } + $scope.showImageDetails = function (selectedImage){ - console.log(selectedImage); + //UPDATE IMAGE TRACKING HERE + $scope.selected = selectedImage; + currentImage = selectedImage; }; // Gets the gallery for the user's uploaded images @@ -55,7 +65,9 @@ angular.module("myApp.display", ["ngRoute", "LocalStorageModule", "myApp.display thumbString = result.data.thumbs[index], thumb = parseThumbResult(thumbString); - image.src = "data:image/jpeg;base64," + photo; + // image.src = "data:image/jpeg;base64," + photo; + image.src = "data:image/png;base64," + photo; + imageThumb.src = "data:image/png;base64," + thumb; $scope.myPictures.push({src: image.src, id: result.data.rows[index][0], @@ -85,7 +97,15 @@ angular.module("myApp.display", ["ngRoute", "LocalStorageModule", "myApp.display image.src = "data:image/png;base64," + photo; imageThumb.src = "data:image/png;base64," + thumb; // $scope.groupPictures.push({thumb: image.src, img: image.src, description: result.data.rows[index][3]}) - $scope.groupPictures.push({src: image.src}); + $scope.groupPictures.push({src: image.src, + id: result.data.rows[index][0], + owner: result.data.rows[index][1], + permit: result.data.rows[index][2], + subject: result.data.rows[index][3], + place: result.data.rows[index][4], + timing: result.data.rows[index][5], + desc: result.data.rows[index][6] + }); } }; diff --git a/app/display/displayHandler.js b/app/display/displayHandler.js index 54ef3c1..c69f37b 100644 --- a/app/display/displayHandler.js +++ b/app/display/displayHandler.js @@ -34,7 +34,7 @@ angular.module("myApp.display.displayHandler", []) $http({ url: SERVICE_BASE_URL + "getPopularPictures", method: "POST", - params: {userName: username} + data: {userName: username} }) .then(function(result) { return callback(result); @@ -44,11 +44,13 @@ angular.module("myApp.display.displayHandler", []) }); }; - this.editImage = function (photo_id, permitted, subject, loc, date, desc, callback) { + this.editImage = function (requestBody, callback) { + console.log(requestBody); $http({ - url: SERVICE_BASE_URL + "editImage", + url: SERVICE_BASE_URL + "updatePhoto", method: "POST", - params: {photo_id: photo_id, permitted: permitted, subject: subject, loc: loc, timing: date, desc: desc} + data: requestBody + // {photoid: requestBody.photo_id, permit: requestBody.permitted, subject: requestBody.subject, place: requestBody.loc, timing: requestBody.date, desc: requestBody.desc} }) .then(function(result) { return callback(result); diff --git a/app/edit/edit.html b/app/edit/edit.html index a189ddd..8bd72bb 100644 --- a/app/edit/edit.html +++ b/app/edit/edit.html @@ -22,6 +22,13 @@ + +

Edit an Image

+ +
+ +
+
@@ -46,9 +53,8 @@ - +
-
diff --git a/app/edit/edit.js b/app/edit/edit.js index 1246ddf..65625fc 100644 --- a/app/edit/edit.js +++ b/app/edit/edit.js @@ -11,17 +11,8 @@ angular.module("myApp.edit", ["ngRoute", "LocalStorageModule", "ngFileUpload", " var usernameFromStorage, storageKey = "user", selected_image = displayHandler.curr_image; - // ** Need to make sure that the image passed through is actually called curr_image ** - - // Initialize the page with the pre-existing values - // May need to reformat this to format "yyyy/mm/dd" if original format doesn't work - var imageDate = new Date(selected_image.timing); - $scope.imgPerm = selected_image.permitted; - $scope.imgSubject = selected_image.subject; - $scope.imgLocation = selected_image.place; - $scope.imgWhen = imageDate; - $scope.imgDesc = selected_image.desc; + $scope.selected; function getItem(key) { return localStorageService.get(key); @@ -34,6 +25,19 @@ angular.module("myApp.edit", ["ngRoute", "LocalStorageModule", "ngFileUpload", " usernameFromStorage = getItem(storageKey); } + if(!selected_image){ + $location.url("/display"); + }else { + var imageDate = new Date(selected_image.timing); + $scope.imgPerm = selected_image.permit; + $scope.imgSubject = selected_image.subject; + $scope.imgLocation = selected_image.place; + $scope.imgWhen = imageDate; + $scope.imgDesc = selected_image.desc; + + $scope.selected = selected_image; + } + // Formats the date to be put into the database function formatDate(date) { var dd = date.getDate(), @@ -48,22 +52,25 @@ angular.module("myApp.edit", ["ngRoute", "LocalStorageModule", "ngFileUpload", " } dateString = yyyy + "/" + mm + "/" + dd return dateString - } - - $scope.editImage = function() { - console.log("Editing image") + }; - var id = selected_image.id, - permitted = $scope.imgPerm, - subject = $scope.imgSubject, - location = $scope.imgLocation, - date = $scope.imgWhen, - desc = $scope.imgDesc; - date = formatDate(date); + $scope.editImage = function() { + var requestBody = { + photoid : selected_image.id, + permit : $scope.imgPerm, + subject : $scope.imgSubject, + place : $scope.imgLocation, + desc : $scope.imgDesc, + timing : formatDate($scope.imgWhen) + }; - uploadHandler.uploadFile(id, permitted, subject, location, date, desc, function(result){ - alert("Edited Image"); + displayHandler.editImage(requestBody, function(result){ + if(result.status !== 200){ + alert("Error trying to update. Please try again.") + }else{ + alert("Edited Image"); + } }); }; diff --git a/app/search/search.html b/app/search/search.html index 193f5e3..6e72f01 100644 --- a/app/search/search.html +++ b/app/search/search.html @@ -40,20 +40,12 @@

Search

+ - diff --git a/app/search/search.js b/app/search/search.js index 81171ff..59fc7aa 100644 --- a/app/search/search.js +++ b/app/search/search.js @@ -11,6 +11,8 @@ angular.module("myApp.search", ["ngRoute", "LocalStorageModule", "myApp.search.s var usernameFromStorage, storageKey = "user"; + $scope.searchResults = []; + function getItem(key) { return localStorageService.get(key); }; @@ -39,10 +41,48 @@ angular.module("myApp.search", ["ngRoute", "LocalStorageModule", "myApp.search.s } dateString = yyyy + "/" + mm + "/" + dd return dateString - } + }; + + function parseImageResult (result){ + // var photo = result.slice(8, result.length-2); + var photo = result.slice(7, result.length-2); + + //console.log(photo); + return photo; + }; + + displayResults = function (photoResults, rowResults) { + var image = new Image(), + photoString, + photo; + + + for(var i = 0; i < photoResults.length; i++){ + photoString = photoResults[i]; + photo = parseImageResult(photoString); + + image.src = "data:image/png;base64," + photo; + $scope.searchResults.push({src: image.src, + id: rowResults[i][0], + owner: rowResults[i][1], + permit: rowResults[i][2], + subject: rowResults[i][3], + place: rowResults[i][4], + timing: rowResults[i][5], + desc: rowResults[i][6] + }); + } + + + }; + + // Search function after the SEARCH button is pressed $scope.search = function() { + //clear results from previous searches + $scope.searchResults = []; + // Only uses keyword var keywords = $scope.searchKey, keyArray = []; @@ -50,7 +90,8 @@ angular.module("myApp.search", ["ngRoute", "LocalStorageModule", "myApp.search.s keyArray = $.map(keywords.split(","), $.trim); console.log(keyArray); searchHandler.getKeyResults(usernameFromStorage, keyArray, function(result){ - console.log(result.data); + console.log(result.data); + displayResults(result.data.images, result.data.rows); }); // Only uses time @@ -60,7 +101,8 @@ angular.module("myApp.search", ["ngRoute", "LocalStorageModule", "myApp.search.s timeBegin = formatDate(timeBegin, 0); timeEnd = formatDate(timeEnd, 1); searchHandler.getTimeResults(usernameFromStorage, timeBegin, timeEnd, function(result){ - console.log(result.data); + console.log(result.data); + displayResults(result.data.images, result.data.rows); }); // Uses all fields @@ -71,7 +113,8 @@ angular.module("myApp.search", ["ngRoute", "LocalStorageModule", "myApp.search.s timeBegin = formatDate(timeBegin, 0); timeEnd = formatDate(timeEnd, 1); searchHandler.getKeyTimeResults(usernameFromStorage, keyArray, timeBegin, timeEnd, function(result){ - console.log(result.data); + console.log(result.data); + displayResults(result.data.images, result.data.rows); }); // All other inputs diff --git a/server.js b/server.js index 3b6dee8..44ec8fe 100644 --- a/server.js +++ b/server.js @@ -176,14 +176,46 @@ app.post("/groupid", function(req, res){ ); }); + + +app.post("/updatePhoto", function(req, res){ + var DBQueryString = + "UPDATE IMAGES " + + "SET PERMITTED = :permitted1, SUBJECT = :subject1, PLACE = :place1, TIMING = TO_DATE (:timing1, 'yyyy/mm/dd'), DESCRIPTION = :desc1 " + + "WHERE PHOTO_ID = :photoid1", + DBQueryParam = {permitted1: req.body.permit, + subject1: req.body.subject, + place1: req.body.place, + timing1: req.body.timing, + desc1: req.body.desc, + photoid1: req.body.photoid + }; + + oracledb.getConnection(dbConfig, function (err, connection) { + if (err) { + connectionError(err, res); + return; + } + connection.execute(DBQueryString, DBQueryParam, + {autoCommit: true}, + function (err, result) { + if (err) { + executeError(err, res); + } else { + res.send({success:true}); + } + doRelease(connection); + } + ); + }); + +}); + + //Based on code found here: https://github.com/oracle/node-oracledb/blob/master/doc/api.md#lobhandling app.post("/upload", function(req, res){ - // console.log(req.body.timing); var DBQueryString = - // "INSERT INTO images (photo_id, owner_name, permitted, subject, place, timing, description, thumbnail, photo) VALUES (:photo_id, :owner_name, :permitted, :subject, :place, :timing, :description, EMPTY_BLOB(), EMPTY_BLOB()) RETURNING photo, thumbnail INTO :lobbv, :lobtn", - // "INSERT INTO images (photo_id, owner_name, permitted, subject, place, timing, description, thumbnail, photo) VALUES (7, 'test1', null, null, null, null, null, EMPTY_BLOB(), EMPTY_BLOB()) RETURNING photo, thumbnail INTO :lobbv, :lobtn", -//TO_DATE(timing, 'YYYY-MM-DD') -"INSERT INTO images (photo_id, owner_name, permitted, subject, place, timing, description, thumbnail, photo) VALUES (:photo_id, :owner_name, :permitted, :subject, :place, TO_DATE (:timing, 'yyyy/mm/dd'), :description, EMPTY_BLOB(), EMPTY_BLOB()) RETURNING photo, thumbnail INTO :lobbv, :lobtn", + "INSERT INTO images (photo_id, owner_name, permitted, subject, place, timing, description, thumbnail, photo) VALUES (:photo_id, :owner_name, :permitted, :subject, :place, TO_DATE (:timing, 'yyyy/mm/dd'), :description, EMPTY_BLOB(), EMPTY_BLOB()) RETURNING photo, thumbnail INTO :lobbv, :lobtn", DBQueryParam = {photo_id: req.body.photo_id, owner_name: req.body.owner_name, @@ -196,8 +228,6 @@ app.post("/upload", function(req, res){ lobtn: {type: oracledb.BLOB, dir: oracledb.BIND_OUT} }; - console.log(req.body.timing); - oracledb.getConnection(dbConfig, function (err, connection) { if (err) { connectionError(err, res); @@ -752,28 +782,31 @@ getImages = function (row, index) { thumbnailBufferLength = 0; if (lob) { - + // console.log("LOB " + util.inspect(lob, false, null)); // When data comes in from the stream, add it to the buffer lob.on("data", function (chunk) { bufferLength = bufferLength + chunk.length; buffer = Buffer.concat([buffer, chunk], bufferLength); + // console.log("DATA " + bufferLength); }); //When the data is finished coming in, change it to base 64 and add to result lob.on("end", function () { imageObj = buffer.toString("base64"); + // console.log("END " + imageObj); }); // When the stream closes, resolce the promsie lob.on("close", function (chunk) { - // console.log("CLOSE PHOTO + RESOLVE"); + console.log("CLOSE PHOTO + RESOLVE"); // Fulfill promise lobLoadingPhoto.resolve(); }); // Make sure we reject the promise when the stream fails so that we don't have a memory leak - lob.on("error", function () { - executeError(err, res); + lob.on("error", function (err) { + // executeError(err, res); // Reject promise + console.log("ERROR " + err); lobLoadingPhoto.reject(); }); } @@ -794,7 +827,7 @@ getImages = function (row, index) { }); // Make sure we reject the promise when the stream fails so that we don't have a memory leak thumbnailLob.on("error", function () { - executeError(err, res); + // executeError(err, res); // Reject promise lobLoadingThumb.reject(); }); @@ -841,7 +874,6 @@ app.post("/editImage", function(req, res){ }); }); - // Retrieves pictures that the user uploaded onto the database app.post("/getMyPictures", function(req, res){ var DBQueryString = @@ -954,7 +986,7 @@ app.post("/getKeyResults", function(req, res){ } DBQueryString = DBQueryString + ")" - console.log(DBQueryString); + // console.log(DBQueryString); oracledb.getConnection(dbConfig, function (err, connection) { if (err) { @@ -964,12 +996,32 @@ app.post("/getKeyResults", function(req, res){ connection.execute(DBQueryString, DBQueryParam, {autoCommit: true}, function (err, result) { + var imageArr = []; + var thumbArr = []; if (err) { executeError(err, res); } else { - res.send({success: true, results: result.rows}); + // console.log(util.inspect(result, false, null)); + + result.rows.forEach(function(row, index, array){ + // console.log("ROW " + util.inspect(row, false, null)); + + getImages(row).then(function(photoData){ + imageArr.push(photoData.imageObj); + thumbArr.push(photoData.thumbObj); + + if(imageArr.length == result.rows.length){ + // console.log("seding back"); + doRelease(connection); + res.send({ + rows:result.rows, + images: imageArr, + thumbs: thumbArr + }); + } + }); + }); } - doRelease(connection); } ); }); @@ -986,9 +1038,9 @@ app.post("/getTimeResults", function(req, res){ "OR (images.permitted = 2 AND images.owner_name = :userName)) " + "AND (images.timing BETWEEN TO_DATE (:startDate, 'yyyy/mm/dd') AND TO_DATE (:endDate, 'yyyy/mm/dd'))", DBQueryParam = {userName: req.query.userName, startDate: req.query.timeStart, endDate: req.query.timeEnd}; - - console.log(DBQueryString); - console.log(DBQueryParam); + // + // console.log(DBQueryString); + // console.log(DBQueryParam); oracledb.getConnection(dbConfig, function (err, connection) { if (err) { connectionError(err, res); @@ -997,12 +1049,29 @@ app.post("/getTimeResults", function(req, res){ connection.execute(DBQueryString, DBQueryParam, {autoCommit: true}, function (err, result) { + var imageArr = []; + var thumbArr = []; if (err) { - executeError(err, res); + executeError(err, result); } else { - res.send({success: true, results: result.rows}); + result.rows.forEach(function(row, index, array){ + getImages(row).then(function(photoData){ + imageArr.push(photoData.imageObj); + thumbArr.push(photoData.thumbObj); + + if(imageArr.length == result.rows.length){ + // console.log("seding back"); + doRelease(connection); + res.send({ + rows:result.rows, + images: imageArr, + thumbs: thumbArr + }); + } + }); + }); } - doRelease(connection); + } ); }); @@ -1035,7 +1104,7 @@ app.post("/getKeyTimeResults", function(req, res){ } DBQueryString = DBQueryString + ")" - console.log(DBQueryString); + // console.log(DBQueryString); oracledb.getConnection(dbConfig, function (err, connection) { if (err) { @@ -1045,12 +1114,28 @@ app.post("/getKeyTimeResults", function(req, res){ connection.execute(DBQueryString, DBQueryParam, {autoCommit: true}, function (err, result) { + var imageArr = []; + var thumbArr = []; if (err) { executeError(err, res); } else { - res.send({success: true, results: result.rows}); + result.rows.forEach(function(row, index, array){ + getImages(row).then(function(photoData){ + imageArr.push(photoData.imageObj); + thumbArr.push(photoData.thumbObj); + + if(imageArr.length == result.rows.length){ + // console.log("seding back"); + doRelease(connection); + res.send({ + rows:result.rows, + images: imageArr, + thumbs: thumbArr + }); + } + }); + }); } - doRelease(connection); } ); });