Merge pull request #55 from eballo/webpack_migration_2

Version 10

.gitignore

@@ -1,9 +1,7 @@
 .DS_Store
-.qicon
 .project
-.settings/
 node_modules/
-dist/
 .sonarlint/
-package/
-assets/js/**
+dist/
+web/js/catalunya-map.min.js
+.idea/

README.md

@@ -2,7 +2,7 @@
 Interactive vectorial map of Catalunya based on a SVG/VML and the library RaphaëlJs.
 
 
-<img src="https://github.com/eballo/catalunya-map/blob/master/screenshot/screenshot-v7.5_2.png" alt="screen-shot" align="center" />
+<img src="https://github.com/eballo/catalunya-map/blob/master/screenshot/screenshot-v10.png" alt="screen-shot" align="center" />
 
 ## Current versions
 * Raphaël JS - 2.2.1
@@ -12,30 +12,11 @@ Interactive vectorial map of Catalunya based on a SVG/VML and the library Rapha
 
 ## Demo
 
-- [Demo v1.0](http://demo.catalunyamedieval.es/map1)
-- [Demo v2.0](http://demo.catalunyamedieval.es/map2)
-- [Demo v2.1](http://demo.catalunyamedieval.es/map21)
-- [Demo v3.0](http://demo.catalunyamedieval.es/map3)
-- [Demo v3.1](http://demo.catalunyamedieval.es/map31)
-- [Demo v4.0](http://demo.catalunyamedieval.es/map4)
-- [Demo v4.1](http://demo.catalunyamedieval.es/map41)
-- [Demo v5.0](http://demo.catalunyamedieval.es/map50)
-- [Demo v5.1](http://demo.catalunyamedieval.es/map51)
-- [Demo v5.2](http://demo.catalunyamedieval.es/map52)
-- [Demo v6.0](http://demo.catalunyamedieval.es/map60)
-- [Demo v6.1](http://demo.catalunyamedieval.es/map61)
-- [Demo v6.2](http://demo.catalunyamedieval.es/map62)
-- [Demo v7.0](http://demo.catalunyamedieval.es/map7)
-- [Demo v7.1](http://demo.catalunyamedieval.es/map71)
-- [Demo v7.2](http://demo.catalunyamedieval.es/map72)
-- [Demo v7.3](http://demo.catalunyamedieval.es/map73)
-- [Demo v7.4](http://demo.catalunyamedieval.es/map74)
-- [Demo v7.5](http://demo.catalunyamedieval.es/map75)
-- [Demo v8.0](http://demo.catalunyamedieval.es/map80)
+[Demo](./demo.md)
 
 ## How to create a Map using a SVG file
 
-1. Given a [SVG file](http://demo.catalunyamedieval.es/map80/src/Mapa_comarcal_de_Catalunya.svg) you can rename it to xml [XML file](http://demo.catalunyamedieval.es/map7/xml/Mapa_comarcal_de_Catalunya.svg.xml)
+1. Given a [SVG file](http://demo.catalunyamedieval.es/map90/src/Mapa_comarcal_de_Catalunya.svg) you can rename it to xml [XML file](http://demo.catalunyamedieval.es/map7/xml/Mapa_comarcal_de_Catalunya.svg.xml)
 2. Inside the xml file you will see a d="..." like this one
 ```
 	d="M 97.21875 15.40625 L 94.84375 L 100.03125 16.34375 L 98.625 15.65625 L 98.15625 15.65625 L 97.21875 15.40625 z "
@@ -75,18 +56,16 @@ Explanation:
     <footer>
     ...
     <script type="text/javascript" src="js/catalunya-map-path.js"></script>
-    <script type="text/javascript" src="js/catalunya-map.js"></script>
-    <script type="text/javascript" src="js/catalunya-map-options-v2.js"></script>
-    <script type="text/javascript" src="js/catalunya-map-init.js"></script>
+    <script type="text/javascript" src="js/catalunya-map.min.js"></script>
     ...
     </footer>
 
-Explanation :
+Source files Explanation :
 
-    catalunya-map-path.js       : js file that have the javascript array with all the data
-    catalunya-map.js            : js file that have the object to create maps
-    catalunya-map-options-vX.js : js file that have the custom options for each theme (v1/v2/v3)
-    catalunya-map-init.js       : js file that create an object map and print it in the screen
+    catalunya-map-path.js             : js file that have the javascript array with all the data
+    catalunya-map.js                  : js file that have the object to create maps
+    catalunya-map-config-local.js     : js file that have the custom options
+    catalunya-map-prod.js             : js file that create an object map and print it in the screen
 
 2. Add this code in the body
 
@@ -95,7 +74,7 @@ Explanation :
 					<div class="map-wrapper">
 						<div id="text" class="col-md-4">
 							<div id="comarcaName">
-								<h1>Catalunya Medieval</h1></div>
+								<h1>Catalunya Interactive Map</h1></div>
 							<div id="contentText">Seleccionar una comarca del mapa i fer clic per veure el seu contingut</div>
 						</div>
 						<div id="map" class="col-md-8"></div>
@@ -125,132 +104,30 @@ Explanation :
 
 ## Versions
 
-V1.0
-- Just the map
+[Change log](./changelog.md) 
 
-V2.0
-- Resize functionality using [raphael-scale.js](http://www.shapevent.com/scaleraphael/)
-
-V2.1
-- Debug information and better resize example
-
-v3.0
-- Add comarca and capital names
-
-v3.1
-- New catalunya-map-path.js
-- Add colors on mouse hover
-
-V4.0
-- Add Comarca Info box on mouse click
-
-V4.1
-- add touchStart for tablets (ipad)
-
-v5.0
-- Add Comarca del Moianes : Source image Mapa_comarcal_de_Catalunya_v2.svg (Thanks for your Contribution Hector)
-
-v5.1
-- reposition of all the names
-- new screenshot
-
-v5.2
-- add property onClick and newWindow (requested functionality by Hector)
-
-v6.0
-- add Droid Sans Font
-- change colors
-- update Raphael JS and jQuery versions
-- add bootstrap
-- add all buildings
-
-v6.1
-- Fix responsive design
-
-v6.2
-- Object Oriented implementation (refactor)
-
-v7.0
-- update readme
-- create diferent configuration option files (v1,v2)
-- beautifyed all code
-- Documentation of the code
-
-v7.1
-- Add button option configuration (https://codepen.io/piecdesmit/details/OMYNZg/)
-- Styles for icons
-
-v7.2
-- Fix styles
-
-v7.3
-- Grunt
-- nodejs
-- refactor
-- sonar fixes
-
-v7.4
-- configuracion text mes gran.
-
-v7.5
-- bloqueix de color de fons quan comarca esta seleccionada.
-- configuration option v3
-- Add text, and effects
-
-v8.0
-- Add Grunt-contrib-watch package
-- Add Grunt-replace package
-- Remove effect when click on comarca
-- Add background grey color on mouse over
-- Change typhography -> Droid Sans
-- Add configuration file parameters (remove old configuration files for environment)
-
-v9.0
-- browserSync
-- change to gulp (gulp)
 
 ## Development
 
-Since version 9.0 uses [gulp](http://gulpjs.com/) as its build system and [Bower](http://bower.io/) to manage front-end packages.
+Since version 10.0 uses [webpack](https://webpack.js.org/).
 
 ### Install gulp and Bower
 
 Building the theme requires [node.js](http://nodejs.org/download/). We recommend you update to the latest version of npm: `npm install -g npm@latest`.
 
 From the command line:
 
-1. Install [gulp](http://gulpjs.com) and [Bower](http://bower.io/) globally with `npm install -g gulp bower`
-2. Navigate to the theme directory, then run `npm install`
-3. Run `bower install`
-
-You now have all the necessary dependencies to run the build process.
-
-### Available gulp commands
+1. Navigate to the theme directory, then run `npm install`
+3. Build `npm run build`
+4. Start `npm run start` 
 
-* `gulp` — Compile and optimize the files in your assets directory (by default is development environment)
-* `gulp bundle` — Compile assets and package them in a zip file
-* `gulp bundle --production` — Compile assets for production.
+Open your browser [localhost:9000](http://localhost:9000/)
 
-### Using BrowserSync
+### Available node commands
 
-To use BrowserSync during `gulp watch` you need to update `devUrl` at the bottom of `assets/manifest.json` to reflect your local development hostname.
-
-For example, if your local development URL is `http://project-name.dev` you would update the file to read:
-```json
-...
-  "config": {
-    "devUrl": "http://project-name.dev"
-  }
-...
-```
-If your local development URL looks like `http://localhost:8888/project-name/` you would update the file to read:
-```json
-...
-  "config": {
-    "devUrl": "http://localhost:8888/project-name/"
-  }
-...
-```
+* `build`      — Compile and optimize the files in your web directory
+* `buildWatch` — Compile and optimize the files in your web directory and watch for changes to update the files
+* `start`      — Starts a web server
 
 ## Webs using this map:
 - [blog cimasdestacables](http://cimasdestacables.blogspot.com/p/mapa-comarcal-de-catalunya.html)