Finished Camera WebApp

AGI Documentation.md

@@ -431,6 +431,7 @@ if (!requirelib("filelib")){
 ```
 	filelib.writeFile("user:/Desktop/test.txt", "Hello World"); 		//Write to file
 	filelib.readFile("user:/Desktop/test.txt");							//Read from file
+	filelib.deleteFile("user:/Desktop/test.txt"); 						//Delete a file by given path
 	filelib.readdir("user:/Desktop/"); 									//List all subdirectories within this directory
 	filelib.walk("user:/Desktop/"); 									//Recursive scan dir and return all files and folder in subdirs
 	filelib.glob("user:/Desktop/*.jpg");

web/Camera/backend/delPhoto.js

@@ -0,0 +1,41 @@
+/*
+    Delete a given photo file by path
+
+    Require paramter
+    - savetarget
+    - filename
+*/
+
+requirelib("filelib");
+
+function deleteFile(){
+    //Check if the save dir 
+    if (savetarget.substring(savetarget.length - 1,1) != "/"){
+        savetarget = savetarget + "/";
+    }
+
+    //Check if the file exists
+    var targetFilepath = savetarget + filename;
+    if (!filelib.fileExists(targetFilepath)){
+        sendJSONResp(JSON.stringify({
+            error: "Target file not exists"
+        }));
+        return
+    }
+
+    //Check if it is supported image file extension
+    var ext = targetFilepath.split(".").pop();
+    if (ext != "png" && ext != "jpg"){
+        //This is not an image file. Reject delete operation
+        sendJSONResp(JSON.stringify({
+            error: "Target file is not an image taken by Camera"
+        }));
+        return
+    }
+
+    //OK. Remove the file.
+    filelib.deleteFile(targetFilepath);
+    sendJSONResp(JSON.stringify("OK"));
+}
+
+deleteFile();

web/Camera/backend/listPhoto.js

@@ -7,8 +7,6 @@
 
 requirelib("filelib");
 
-var savetarget = "user:/Photo/DCIM";
-
 function generatePhotoList(){
     //Check if savetarget is empty
     if (typeof savetarget == 'undefined' || savetarget == ""){

web/Camera/preview.html

@@ -80,7 +80,7 @@
                 <div class="clickable" onclick="openInFolder();" style="display: inline-block;">
                     <img class="ui mini image" src="img/icons/folder.svg"/>
                 </div>
-                <div class="clickable" onclick="deleteThis();" style="display: inline-block;">
+                <div class="clickable" onclick="confirmDelete();" style="display: inline-block;">
                     <img class="ui mini image" src="img/icons/delete.svg"/>
                 </div>
             </div>
@@ -98,6 +98,26 @@
                 <img id="viewpoint" class="center-fit" src='img/place-holder.png'>
             </div>
         </div>
+
+        <div id="confirmDelete" class="ui basic modal">
+            <div class="ui icon header">
+              <i class="red remove icon"></i>
+              <span id="confirmmsg"></span>
+            </div>
+            <div class="content" align="center">
+              <p>This operation is not reversible. Are you sure you want to delete this photo?</p>
+            </div>
+            <div class="actions">
+              <div class="ui red basic cancel inverted button">
+                <i class="remove icon"></i>
+                No
+              </div>
+              <div class="ui red ok button" onclick="deleteThis();">
+                <i class="trash icon"></i>
+                Yes
+              </div>
+            </div>
+          </div>
         
         <script>
             let photoList = [];
@@ -118,6 +138,10 @@
 
             $(document).ready(function(){
                 //Load the latest image
+                initPhotoList();
+            });
+
+            function initPhotoList(overrideIndex = 0){
                 ao_module_agirun("Camera/backend/listPhoto.js",{
                     savetarget: saveTarget,
                 }, function(data){
@@ -125,12 +149,38 @@
                         //No photo
                     }else{
                         //Load it
-                        currentViewingPhoto = 0;
+                        currentViewingPhoto = overrideIndex;
                         photoList = data;
-                        $("#viewpoint").attr('src', '../media/?file=' + data[0]);
+                        $("#viewpoint").attr('src', '../media/?file=' + data[overrideIndex]);
                     }
                 });
-            });
+            }
+
+            function confirmDelete(){
+                //Generate a confirm message
+                var filedata = photoList[currentViewingPhoto].split("/");
+                var filename = filedata.pop();
+                $("#confirmmsg").text("Confirm Delete " + filename + "?")
+
+                $("#confirmDelete").modal('show');
+            }
+
+            function deleteThis(){
+                var filedata = photoList[currentViewingPhoto].split("/");
+                var filename = filedata.pop();
+
+                ao_module_agirun("Camera/backend/delPhoto.js", {
+                    savetarget: saveTarget,
+                    filename: filename
+                }, function(data){
+                    if (data.error !== undefined){
+                        alert(data.error);
+                    }else{
+                        //OK. Reload the list
+                        initPhotoList(currentViewingPhoto);
+                    }
+                })
+            }
 
             function openInFolder(){
                 if (currentViewingPhoto == ""){
@@ -138,7 +188,7 @@
                     ao_module_openPath(saveTarget);
                 }else{
                     //Open the folder and highlight the picture
-                    var filedata = currentViewingPhoto.split("/");
+                    var filedata = photoList[currentViewingPhoto].split("/");
                     var filename = filedata.pop();
                     var fileRoot = filedata.join("/");
                     ao_module_openPath(fileRoot, filename);
@@ -148,7 +198,7 @@
 
 
             function nextPhoto(){
-                if (currentViewingPhoto == currentViewingPhoto.length - 1){
+                if (currentViewingPhoto == photoList.length - 1){
                     //Already the last photo
                 }else{
                     renderPhotoByPath(currentViewingPhoto + 1);

web/SystemAO/system_setting/index.html

@@ -165,7 +165,7 @@
                                 console.log(inputFields[i]);
                             }else{
                                 //Not supported type of inputs
-
+                                
                             }
                         }else{
                             //text area