now able to load and save

appinfo/routes.php

@@ -20,5 +20,7 @@
 return [
     'routes' => [
         ['name' => 'page#index', 'url' => '/', 'verb' => 'GET'],
+        ['name' => 'page#getgpx', 'url' => '/getgpx', 'verb' => 'POST'],
+        ['name' => 'page#savegpx', 'url' => '/savegpx', 'verb' => 'POST'],
     ]
 ];

controller/pagecontroller.php

@@ -180,4 +180,97 @@ class PageController extends Controller {
         return $response;
     }
 
+    /**
+     * 
+     * @NoAdminRequired
+     * @NoCSRFRequired
+     */
+    public function getgpx($path) {
+        $userFolder = \OC::$server->getUserFolder();
+        $cleanpath = str_replace(array('../', '..\\'), '',  $path);
+        $gpxContent = '';
+        if ($userFolder->nodeExists($cleanpath)){
+            $file = $userFolder->get($cleanpath);
+            if ($file->getType() === \OCP\Files\FileInfo::TYPE_FILE and
+                (endswith($file->getName(), '.GPX') or endswith($file->getName(), '.gpx'))
+            ){
+                // all ok
+            }
+            else{
+                $file = null;
+            }
+        }
+
+        if ($file !== null){
+            $gpxContent = $file->getContent();
+        }
+
+        $response = new DataResponse(
+            [
+                'gpx'=>$gpxContent
+            ]
+        );
+        $csp = new ContentSecurityPolicy();
+        $csp->addAllowedImageDomain('*')
+            ->addAllowedMediaDomain('*')
+            ->addAllowedConnectDomain('*');
+        $response->setContentSecurityPolicy($csp);
+        return $response;
+    }
+
+    /**
+     * 
+     * @NoAdminRequired
+     * @NoCSRFRequired
+     */
+    public function savegpx($path, $content) {
+        $userFolder = \OC::$server->getUserFolder();
+        $cleanpath = str_replace(array('../', '..\\'), '',  $path);
+        $status = false;
+        if (endswith($cleanpath, '.GPX') or endswith($cleanpath, '.gpx')){
+            if ($userFolder->nodeExists($cleanpath)){
+                $file = $userFolder->get($cleanpath);
+                if ($file->getType() === \OCP\Files\FileInfo::TYPE_FILE and
+                    $file->isUpdateable()){
+                    $file->putContent($content);
+                    $status = true;
+                }
+                else{
+                    $status = 'fiw';
+                }
+            }
+            else{
+                $dirpath = dirname($cleanpath);
+                $newFileName = basename($cleanpath);
+                if ($userFolder->nodeExists($dirpath)){
+                    $dir = $userFolder->get($dirpath);
+                    if ($dir->getType() === \OCP\Files\FileInfo::TYPE_FOLDER and
+                        $dir->isCreatable()){
+                        $dir->newFile($newFileName);
+                        $dir->get($newFileName)->putContent($content);
+                        $status = true;
+                    }
+                    else{
+                        $status = 'fw';
+                    }
+                }
+                else{
+                    $status = 'fu';
+                }
+            }
+        }
+
+        $response = new DataResponse(
+            [
+                'status'=>$status
+            ]
+        );
+        $csp = new ContentSecurityPolicy();
+        $csp->addAllowedImageDomain('*')
+            ->addAllowedMediaDomain('*')
+            ->addAllowedConnectDomain('*');
+        $response->setContentSecurityPolicy($csp);
+        return $response;
+    }
+
 }

css/gpxedit.css

@@ -224,7 +224,7 @@ h3 {
     margin-left:20px;
     list-style-type:circle;
 }
-#loading, #loadingmarkers, #deleting {
+#saved {
     /*width: 330px;*/
     padding-left: 5px;
     /*height: 35px;*/
@@ -244,15 +244,11 @@ h3 {
     display:none;
     /*z-index: 1000;*/
 }
-#loading .fa, #loadingmarkers .fa, #deleting .fa {
+#saved .fa {
     font-size: 22px;
 }
 
-#loadingmarkers {
+#saved p{
-    background-color: green;
-}
-
-#loading p, #loadingmarkers p, #deleting p{
     padding: 6px 6px 6px 6px;
 }
 .clear {

js/gpxedit.js

@@ -396,6 +396,19 @@ function parseGpx(xml){
     });
 }
 
+// remove layers from map and delete all layers data
+function clear(){
+    var layersToRemove = [];
+    gpxedit.editableLayers.eachLayer(function (layer) {
+          delete gpxedit.layersData[layer.gpxedit_id];
+          layersToRemove.push(layer);
+    });
+
+    for(var i=0; i<layersToRemove.length; i++){
+        gpxedit.editableLayers.removeLayer(layersToRemove[i]);
+    }
+}
+
 /*
  * get key events
  */
@@ -418,6 +431,15 @@ function checkKey(e){
     }
 }
 
+function showSaveSuccessAnimation(){
+    $('#saved').show();
+    setTimeout(hideSaveSuccessAnimation, 4000);
+}
+
+function hideSaveSuccessAnimation(){
+    $('#saved').hide();
+}
+
 $(document).ready(function(){
     gpxedit.username = $('p#username').html();
     load_map();
@@ -437,12 +459,56 @@ $(document).ready(function(){
         gpxedit.map.closePopup();
     });
 
-    $('button#saveButton').click(function(e){
+    $('button#clearButton').click(function(e){
-        var gpxText = generateGpx();
+        clear();
-        alert(gpxText);
+    });
+
+    $('button#saveButton').click(function(e){
+        var gpxText = generateGpx();
+        //alert(gpxText);
+        var req = {
+            path: $('input#savePath').val(),
+            content: gpxText 
+        }
+        var url = OC.generateUrl('/apps/gpxedit/savegpx');
+        $.post(url, req).done(function (response) {
+            if (response.status === 'fiw'){
+                alert('Impossible to write file : write access denied');
+            }
+            else if (response.status === 'fu'){
+                alert('Impossible to write file : folder does not exist');
+            }
+            else if (response.status === 'fw'){
+                alert('Impossible to write file : folder write access denied');
+            }
+            else{
+                showSaveSuccessAnimation();
+            }
+        });
+    });
+
+    //parseGpx('<?xml version="1.0" encoding="UTF-8" standalone="no" ?>            <gpx xmlns="http://www.topografix.com/GPX/1/1" xmlns:gpxx="http://www.garmin.com/xmlschemas/GpxExtensions/v3" xmlns:wptx1="http://www.garmin.com/xmlschemas/WaypointExtension/v1" xmlns:gpxtpx="http://www.garmin.com/xmlschemas/TrackPointExtension/v1" creator="GpxEdit Owncloud/Nextcloud app" version="1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.topografix.com/GPX/1/1 http://www.topografix.com/GPX/1/1/gpx.xsd http://www.garmin.com/xmlschemas/GpxExtensions/v3 http://www8.garmin.com/xmlschemas/GpxExtensionsv3.xsd http://www.garmin.com/xmlschemas/WaypointExtension/v1 http://www8.garmin.com/xmlschemas/WaypointExtensionv1.xsd http://www.garmin.com/xmlschemas/TrackPointExtension/v1 http://www.garmin.com/xmlschemas/TrackPointExtensionv1.xsd">            <metadata>            <time>2016-11-01T14:18:24Z</time>            </metadata>            <trk>            <name>droit</name><desc>plop\nplap</desc>            <trkseg>            <trkpt lat="1" lon="3">            </trkpt>            <trkpt lat="2" lon="3">            </trkpt>            <trkpt lat="3" lon="3">            </trkpt>            </trkseg>            </trk>            <trk>            <name>yeye</name>            <trkseg>            <trkpt lat="7.449624260197829" lon="10.063476562500002">            </trkpt>            <trkpt lat="11.005904459659451" lon="9.931640625000002">            </trkpt>            <trkpt lat="9.665738395188692" lon="14.721679687500002"> </trkpt> </trkseg></trk><wpt lat="23.07973176244989" lon="40.42968750000001"><name>unnamed</name><desc>plop</desc></wpt><extensions/> </gpx>');
+
+    $('button#getButton').click(function(e){
+        var req = {
+            path : $('input#getPath').val()
+        }
+        var url = OC.generateUrl('/apps/gpxedit/getgpx');
+        $.post(url, req).done(function (response) {
+            clear();
+            if (response.gpx === ''){
+                alert('The file does not exist or it is not a gpx');
+            }
+            else{
+                parseGpx(response.gpx);
+                var bounds = gpxedit.editableLayers.getBounds();
+                gpxedit.map.fitBounds(bounds,
+                    {animate:true, paddingTopLeft: [parseInt($('#sidebar').css('width')), 0]}
+                );
+            }
+        });
     });
 
-    parseGpx('<?xml version="1.0" encoding="UTF-8" standalone="no" ?>            <gpx xmlns="http://www.topografix.com/GPX/1/1" xmlns:gpxx="http://www.garmin.com/xmlschemas/GpxExtensions/v3" xmlns:wptx1="http://www.garmin.com/xmlschemas/WaypointExtension/v1" xmlns:gpxtpx="http://www.garmin.com/xmlschemas/TrackPointExtension/v1" creator="GpxEdit Owncloud/Nextcloud app" version="1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.topografix.com/GPX/1/1 http://www.topografix.com/GPX/1/1/gpx.xsd http://www.garmin.com/xmlschemas/GpxExtensions/v3 http://www8.garmin.com/xmlschemas/GpxExtensionsv3.xsd http://www.garmin.com/xmlschemas/WaypointExtension/v1 http://www8.garmin.com/xmlschemas/WaypointExtensionv1.xsd http://www.garmin.com/xmlschemas/TrackPointExtension/v1 http://www.garmin.com/xmlschemas/TrackPointExtensionv1.xsd">            <metadata>            <time>2016-11-01T14:18:24Z</time>            </metadata>            <trk>            <name>droit</name><desc>plop\nplap</desc>            <trkseg>            <trkpt lat="1" lon="3">            </trkpt>            <trkpt lat="2" lon="3">            </trkpt>            <trkpt lat="3" lon="3">            </trkpt>            </trkseg>            </trk>            <trk>            <name>yeye</name>            <trkseg>            <trkpt lat="7.449624260197829" lon="10.063476562500002">            </trkpt>            <trkpt lat="11.005904459659451" lon="9.931640625000002">            </trkpt>            <trkpt lat="9.665738395188692" lon="14.721679687500002"> </trkpt> </trkseg></trk><wpt lat="23.07973176244989" lon="40.42968750000001"><name>unnamed</name><desc>plop</desc></wpt><extensions/> </gpx>');
 
 });
 

templates/gpxcontent.php

@@ -52,9 +52,18 @@ if (count($_['dirs']) === 0){
     <div style="clear:both"></div>
     </form>
     <hr/>
+    <input id="getPath"></input>
+    <button id="getButton">Load</button>
+    <hr/>
+    <input id="savePath"></input>
     <button id="saveButton">Save</button>
     <div style="clear:both"></div>
     <hr/>
+    <button id="clearButton">Clear map</button>
+    <div id="saved"><p>
+        <i class="fa fa-save fa-spin fa-3x fa-fw"></i>
+        <?php p($l->t('File saved')); ?>&nbsp;</p>
+    </div>
 <?php
 
 echo '<p id="username" style="display:none">';