merge-in upstream wegue master

Author: justb4

.travis.yml

@@ -3,8 +3,8 @@ node_js: stable
 install:
 - npm install
 script:
-- npm run test
 - npm run init:app
+- npm run test
 - npm run build
 after_success:
 - ./ci/update-gh-pages.sh > /dev/null 2>&1

README.md

@@ -39,7 +39,7 @@ Prerequisites: Node.js and npm need to be available on your system.
 npm install
 ```
 
-  - Run the init script, which creates a base application for your project in `app/WguApp.vue` and a CSS file `app/css/app.css` to place custom styling for your project.
+  - Run the init-app script, which creates a base application (a copy of the `app-starter` dir) under `app/` to extend with custom components and resources (e.g. CSS styling) for your project.
 
 ``` bash
 # initializes the Wegue app

app/.gitignore app-starter/.gitignore

@@ -1,4 +1,5 @@
 # Ignore everything in this directory
-*
+#*
 # Except this file
-!.gitignore
+#!.gitignore
+

app-starter/README.md

@@ -0,0 +1,5 @@
+# Wegue App Starter Dir
+This directory contains a Wegue starter app.
+By using the command `npm run init:app` this directory is copied to the `app/` directory.
+For now this copy will not overwrite files already present in the `app/` dir.
+

app-starter/WguApp.vue

@@ -0,0 +1,17 @@
+<!-- Created by init-app.js at Tue Mar 10 2020 16:02:41 GMT+0100 (GMT+01:00) -->
+<template>
+  <wgu-app-tpl>
+    <!-- insert your app slots here  -->
+  </wgu-app-tpl>
+</template>
+
+<script>
+  import WguAppTemplate from './WguAppTemplate.vue';
+  export default {
+    name: 'my-wgu-app',
+    components: {
+      'wgu-app-tpl': WguAppTemplate
+    }
+    // add Vue methods and hooks here
+  }
+</script>

src/WguAppTemplate.vue app-starter/WguAppTemplate.vue

@@ -54,15 +54,15 @@
 
 <script>
   import Vue from 'vue'
-  import { WguEventBus } from './WguEventBus'
-  import OlMap from './components/ol/Map'
+  import { WguEventBus } from '../src/WguEventBus'
+  import OlMap from '../src/components/ol/Map'
   import AppHeader from './components/AppHeader'
   import AppFooter from './components/AppFooter'
-  import AppLogo from './components/AppLogo'
-  import MeasureWin from './components/measuretool/MeasureWin'
-  import LayerListWin from './components/layerlist/LayerListWin'
-  import InfoClickWin from './components/infoclick/InfoClickWin'
-  import MapLoadingStatus from './components/progress/MapLoadingStatus'
+  import AppLogo from '../src/components/AppLogo'
+  import MeasureWin from '../src/components/measuretool/MeasureWin'
+  import LayerListWin from '../src/components/layerlist/LayerListWin'
+  import InfoClickWin from '../src/components/infoclick/InfoClickWin'
+  import MapLoadingStatus from '../src/components/progress/MapLoadingStatus'
 
   export default {
     name: 'wgu-app-tpl',

src/components/AppFooter.vue app-starter/components/AppFooter.vue

@@ -54,13 +54,13 @@
 <script>
 
 import Vue from 'vue'
-import LayerListToggleButton from './layerlist/ToggleButton'
-import HelpWinToggleButton from './helpwin/ToggleButton'
-import MeasureToolToggleButton from './measuretool/ToggleButton'
-import InfoClickButton from './infoclick/ToggleButton'
-import ShareButton from './sharebutton/ShareButton'
-import ZoomToMaxExtentButton from './maxextentbutton/ZoomToMaxExtentButton'
-import Geocoder from './geocoder/Geocoder'
+import LayerListToggleButton from '../../src/components/layerlist/ToggleButton'
+import HelpWinToggleButton from '../../src/components/helpwin/ToggleButton'
+import MeasureToolToggleButton from '../../src/components/measuretool/ToggleButton'
+import InfoClickButton from '../../src/components/infoclick/ToggleButton'
+import ShareButton from '../../src/sharebutton/ShareButton'
+import ZoomToMaxExtentButton from '../../src/components/maxextentbutton/ZoomToMaxExtentButton'
+import Geocoder from '../../src/components/geocoder/Geocoder'
 
 export default {
   name: 'wgu-app-header',

src/components/AppHeader.vue app-starter/components/AppHeader.vue

@@ -27,14 +27,6 @@
     ]
   ],
 
-  "tileGridDefs": {
-    "dutch_rd": {
-      "extent": [-285401.920, 22598.080, 595401.920, 903401.920],
-      "resolutions": [3440.640, 1720.320, 860.160, 430.080, 215.040, 107.520, 53.760, 26.880, 13.440, 6.720, 3.360, 1.680, 0.840, 0.420, 0.210],
-      "tileSize": [256, 256]
-    }
-  },
-
   "permalink": {
     "location": "search",
     "layers": true,
@@ -44,7 +36,37 @@
     "precision": 6
   },
 
+  "tileGridDefs": {
+    "dutch_rd": {
+      "extent": [-285401.920, 22598.080, 595401.920, 903401.920],
+      "resolutions": [3440.640, 1720.320, 860.160, 430.080, 215.040, 107.520, 53.760, 26.880, 13.440, 6.720, 3.360, 1.680, 0.840, 0.420, 0.210],
+      "tileSize": [256, 256]
+    }
+  },
+
   "mapLayers": [
+    {
+      "type": "WFS",
+      "lid": "dutch-nat-parks",
+      "name": "WFS (Dutch National Parks PDOK)",
+      "url": "https://geodata.nationaalgeoregister.nl/nationaleparken/wfs",
+      "typeName": "nationaleparken:nationaleparken",
+      "version": "2.0.0",
+      "maxFeatures": 10,
+      "formatConfig": {
+      },
+      "format": "GeoJSON",
+      "projection": "EPSG:28992",
+      "loadOnlyVisible": true,
+      "visible": false,
+      "selectable": true,
+      "style": {
+        "strokeColor": "white",
+        "strokeWidth": 2,
+        "fillColor": "rgba(155,153,51,0.5)"
+      },
+      "attributions": "<a href='https://www.pdok.nl' target='_blank'>PDOK</a> by Dutch Kadaster"
+    },
     {
       "type": "WMS",
       "lid": "pdok-natura2000-wms",

static/app-conf-minimal.json app-starter/static/app-conf-minimal.json

@@ -42,6 +42,29 @@
         "fillColor": "rgba(155,153,51,0.5)"
       }
     },
+    {
+      "type": "WFS",
+      "lid": "gas-wfs",
+      "name": "Gas Stations WFS",
+      "url": "https://ows.terrestris.de/geoserver/osm/wfs",
+      "typeName": "osm:osm-fuel",
+      "version": "2.0.0",
+      "maxFeatures": 50,
+      "formatConfig": {
+      },
+      "format": "GML3",
+      "loadOnlyVisible": true,
+      "visible": false,
+      "selectable": true,
+      "style": {
+        "radius": 6,
+        "strokeColor": "blue",
+        "strokeWidth": 2,
+        "fillColor": "rgba(155,153,51,0.5)"
+      },
+      "attributions": "© <a href=\"https://www.openstreetmap.org/copyright\">OpenStreetMap</a> contributors."
+    },
+
     {
       "type": "VECTOR",
       "lid": "earthquakes",

static/app-conf-projected.json app-starter/static/app-conf-projected.json

@@ -0,0 +1 @@
+/* Created by init-app.js at Thu Aug 08 2019 15:59:47 GMT+0200 (GMT+02:00) */

static/app-conf.json app-starter/static/app-conf.json

@@ -0,0 +1,12 @@
+# Wegue App Dir
+This directory will contain your Wegue Application.
+By using the command `npm run init:app` this directory is populated with
+the contents from the `app-starter/` dir.
+
+You can develop your Wegue app by modifying/adding files here, under the `app/` dir, for example:
+
+* modifying the core `.vue` files like `app/WguApp.vue` and `app/WguAppTemplate.vue`
+* placing or modifying custom/app-specific components under `app/components`
+* placing or modifying  static content like configuration, data, icons and css under `app/static`.
+
+The default config file is `app/static/app-conf.json`.

app-starter/static/css/app.css

@@ -62,8 +62,14 @@ app.use(devMiddleware)
 app.use(hotMiddleware)
 
 // serve pure static assets
-var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
-app.use(staticPath, express.static('./static'))
+// var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
+// app.use(staticPath, express.static('./static'))
+
+console.log(config.dev.assetsPublicPath);
+// assetsSubDirectory: 'static',
+// assetsPublicPath: './',
+var staticPath2 = path.posix.join(config.dev.assetsPublicPath, 'static')
+app.use(staticPath2, express.static('./app/static'))
 
 var uri = 'http://localhost:' + port
 

static/data/2012_Earthquakes_Mag5.kml app-starter/static/data/2012_Earthquakes_Mag5.kml

@@ -16,6 +16,7 @@ exports.cssLoaders = function (options) {
     loader: 'css-loader',
     options: {
       minimize: process.env.NODE_ENV === 'production',
+      url: process.env.NODE_ENV !== 'production',
       sourceMap: options.sourceMap
     }
   }

static/data/shops-dannstadt.geojson app-starter/static/data/shops-dannstadt.geojson

@@ -20,10 +20,11 @@ module.exports = {
       : config.dev.assetsPublicPath
   },
   resolve: {
-    extensions: ['.js', '.vue', '.json'],
+    extensions: ['*', '.js', '.vue', '.json'],
     alias: {
       'vue$': 'vue/dist/vue.esm.js',
       '@': resolve('src'),
+      'APP': resolve('app'),
     },
     symlinks: false
   },
@@ -33,7 +34,7 @@ module.exports = {
         test: /\.(js|vue)$/,
         loader: 'eslint-loader',
         enforce: 'pre',
-        include: [resolve('src'), resolve('test')],
+        include: [resolve('app'), resolve('src'), resolve('test')],
         options: {
           formatter: require('eslint-friendly-formatter')
         }
@@ -46,7 +47,7 @@ module.exports = {
       {
         test: /\.js$/,
         loader: 'babel-loader',
-        include: [resolve('src'), resolve('test'), resolve('node_modules/ol')],
+        include: [resolve('app'), resolve('src'), resolve('test'), resolve('node_modules/ol')],
       },
       {
         test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,

static/icon/circle.svg app-starter/static/icon/circle.svg

@@ -110,16 +110,12 @@ var webpackConfig = merge(baseWebpackConfig, {
     }),
     // copy custom static assets
     new CopyWebpackPlugin([
+      // copy project- / app-specific static assets, overwrite
       {
-        from: path.resolve(__dirname, '../static'),
+        from: path.resolve(__dirname, '../app/static'),
         to: config.build.assetsSubDirectory,
+        force: true,
         ignore: ['.*']
-      },
-      // copy project- / app-specific static assets
-      {
-        context: path.resolve(__dirname, '../app/static'),
-        from: "*",
-        to: config.build.assetsSubDirectory
       }
     ])
   ]