Add a guess of what a storage selector may look like

src/views/app.js

@@ -681,6 +681,16 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
         busyDataDir: false,
         dataDir: null,
 
+        dataPrefix: '',
+
+        location: {
+            id: '', // default, custom, volume+<volumeid>
+            type: '', // default, custom, volume
+            value: '' // emtpy, path, volumeId
+        },
+
+        locationOptions: [],
+
         busyBinds: false,
         mounts: [], // { volume, readOnly }
 
@@ -691,6 +701,23 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
             $scope.storage.dataDir = app.dataDir;
             $scope.storage.mounts = [];
 
+            $scope.storage.locationOptions = [
+                { id: 'default', type: 'default', value: '', displayName: 'Default - /home/yellowtent/appsdata/<appid>' },
+                { id: 'custom', type: 'custom', value: app.dataDir, displayName: 'Custom Folder Path' }
+            ];
+
+            $scope.volumes.forEach(function (volume) {
+                $scope.storage.locationOptions.push({ id: 'volume-'+volume.id, type: 'volume', value: volume.id, displayName: 'Volume - ' + volume.name });
+            });
+
+            if (!app.dataDir) {
+                $scope.storage.location = { id: 'default', type: 'default', value: '' };
+            } else if (app.dataDir) {
+                $scope.storage.location = { id: 'custom', type: 'custom', value: app.dataDir };
+            } else {
+                // TODO how to determine volume is used?
+            }
+
             app.mounts.forEach(function (mount) { // { volumeId, readOnly }
                 var volume = $scope.volumes.find(function (v) { return v.id === mount.volumeId; });
                 $scope.storage.mounts.push({ volume: volume, readOnly: mount.readOnly });