Paris Movie

.editorconfig

@@ -0,0 +1,12 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc

@@ -0,0 +1,9 @@
+{
+  "extends": "vue",
+  "plugins": [
+    "html"
+  ],
+  "rules": {
+    "space-before-function-paren": 0
+  }
+}

.gitignore

@@ -0,0 +1,6 @@
+.DS_Store
+node_modules
+npm-debug.log
+.idea
+dist
+public

.gitlab-ci.yml

@@ -0,0 +1,15 @@
+image: node:6.11
+
+pages:
+  stage: deploy
+  script:
+    - npm install
+    - npm run build
+    - mv static public
+    - mv dist/assets public/assets
+    - ls public
+  artifacts:
+    paths:
+      - public
+  only:
+    - master

DEBRIEFING.md

@@ -1,15 +1,19 @@
 # Debriefing
 
-> Explique en quelques mots à quoi sert ton application.
+Liste des lieux de tournage et lien vers StreetView.
 
 ## Application
 
-> Ajouter ici un screenshot, une vidéo ou un lien vers ton application.
+[https://xneomac.gitlab.io/parismovie/](https://xneomac.gitlab.io/parismovie/)
 
-## Outils
+La réutilisation à été publiée sur [data.gouv.fr](https://www.data.gouv.fr/fr/reuses/paris-movie/).
+
+![screenshot](screen1.png)
 
-> Liste ici les outils que tu a utilisé.
-> Tu peux aussi dire rapidement a quoi ils servent et pourquoi tu les utilisent
+## Outils
 
-> - React (Framework JS)
-> - ...
+- React (Framework JS)
+- Gitlab pages (Hebergement)
+- Google Street View
+- Webpack
+- Bulma.io (framework CSS)

LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 aikin <[email protected]> (aikin)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

build/webpack.base.js

@@ -0,0 +1,51 @@
+const path = require("path");
+const webpack = require('webpack')
+
+module.exports = {
+  entry: './src/index.js',
+  watch: false,
+  watchOptions: {},
+  output: {
+    filename: 'app.js',
+    path: path.resolve(__dirname, '../dist/assets'),
+    publicPath: '/assets/'
+  },
+  resolve: {
+    extensions: ['.js', '.jcx', '.css', '.json'],
+    alias: {
+      root: path.join(__dirname, 'src'),
+      components: path.join(__dirname, 'src/components')
+    }
+  },
+  plugins: [],
+  module: {
+      loaders: [
+          {
+              test: /\.scss$/,
+              loaders: ['style-loader', 'css-loader', 'sass-loader']
+          },
+          {
+              test: /\.css$/,
+              loader: ['style-loader', 'css-loader']
+          },
+          {
+              test: /.jsx?$/,
+              loader: 'babel-loader',
+              exclude: ['/node_modules/'],
+              query: {
+                presets: ['es2015', 'react'],
+                plugins: ['transform-class-properties', 'transform-node-env-inline', 'transform-regenerator']
+              }
+          },
+          {
+            test: /\.csv$/,
+            loader: 'csv-loader',
+            options: {
+              dynamicTyping: true,
+              header: true,
+              skipEmptyLines: true
+            }
+          }
+      ]
+  }
+};

build/webpack.dev.js

@@ -0,0 +1,10 @@
+const webpack = require('webpack')
+const config = require('./webpack.base')
+
+config.watch = true
+config.watchOptions = {
+  aggregateTimeout: 300,
+  poll: 1000
+},
+
+module.exports = config

build/webpack.prod.js

@@ -0,0 +1,19 @@
+const webpack = require('webpack')
+const config = require('./webpack.base')
+
+config.plugins.push(
+  new webpack.DefinePlugin({
+    'process.env.NODE_ENV': JSON.stringify('production')
+  }),
+  new webpack.LoaderOptionsPlugin({
+    minimize: true
+  }),
+  new webpack.optimize.UglifyJsPlugin({
+    compress: {
+      warnings: false
+    },
+    comments: false
+  })
+)
+
+module.exports = config

package.json

@@ -0,0 +1,42 @@
+{
+  "name": "ParisMovie",
+  "version": "1.0.0",
+  "description": "A simple app for a simple task",
+  "main": "src/index.js",
+  "scripts": {
+    "build": "webpack --config build/webpack.prod.js",
+    "dev": "webpack --config build/webpack.dev.js",
+    "dev-server": "webpack-dev-server --config build/webpack.dev.js --content-base static/"
+  },
+  "author": {
+    "name": "xneomac",
+    "email": "[email protected]",
+    "url": "http://martignoni.fr"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://gitlab.com/xneomac/parismovie"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "babel-core": "^6.26.0",
+    "babel-loader": "^7.1.2",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-node-env-inline": "^0.2.0",
+    "babel-plugin-transform-regenerator": "^6.26.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
+    "csv-loader": "^2.1.1",
+    "google-maps-react": "^1.1.11",
+    "react": "15.5.4",
+    "react-dom": "15.5.4",
+    "react-redux": "^5.0.6",
+    "redux": "^3.7.2"
+  },
+  "devDependencies": {
+    "webpack": "^2.1.0-beta.22",
+    "webpack-dev-middleware": "^1.8.3",
+    "webpack-dev-server": "^2.9.4",
+    "webpack-hot-middleware": "^2.12.2"
+  }
+}

src/App.js

@@ -0,0 +1,108 @@
+import React from 'react';
+
+import data from './data/lieu_de_tournage.csv'
+
+export class App extends React.Component
+{
+  constructor(props)
+  {
+    super(props)
+    this.state = {
+      search: '',
+    }
+    this.handleSearch = this.handleSearch.bind(this);
+
+    this.data = [];
+
+    for (let i in data)
+    {
+      let one = {
+        titre: data[i].titre.toLowerCase(),
+        adresse: data[i].adresse.toLowerCase(),
+        xy: data[i].xy,
+      }
+      this.data.push(one)
+    }
+  }
+
+  handleOpenStreetView(info)
+  {
+    let xy = info.xy;
+    window.open(`https://www.google.com/maps/@?api=1&map_action=pano&viewpoint=${xy}&heading=-45&pitch=38&fov=80`);
+  }
+
+  getMovie()
+  {
+    let components = this.data.map((info, i) =>
+    {
+      if (info.titre.includes(this.state.search))
+      {
+        return (
+          <tr key={i}>
+            <td>{info.titre}</td>
+            <td>{info.adresse}</td>
+            <td><button className="button" onClick={() => this.handleOpenStreetView(info)}>StreetView</button></td>
+          </tr>
+        )
+      }
+      else
+      {
+        return (<tr></tr>)
+      }
+    })
+    return components;
+  }
+
+  handleSearch(event)
+  {
+    this.setState({search: event.target.value});
+  }
+
+  render()
+  {
+    return (
+      <div>
+        <section className="hero is-primary">
+          <div className="hero-body">
+            <div className="container">
+              <h1 className="title is-1">Paris Movie</h1>
+            </div>
+          </div>
+        </section>
+
+        <section className="hero">
+          <div className="hero-body">
+            <div className="container">
+
+              <h2 className="title is-3">Les films et séries</h2>
+
+              <div className="field">
+                <p className="control has-icons-left">
+                  <input className="input" onChange={this.handleSearch} type="email" placeholder="rechercher"/>
+                  <span className="icon is-small is-left">
+                    <i className="fas fa-search"></i>
+                  </span>
+                </p>
+              </div>
+
+              <table className="table" style={{width: '100%', backgroundColor: 'transparent'}}>
+                <thead>
+                  <tr>
+                    <th><abbr title="Film">Film/Série</abbr></th>
+                    <th><abbr title="Adresse">Adresse</abbr></th>
+                    <th><abbr title="Action">Action</abbr></th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {this.getMovie()}
+                </tbody>
+              </table>
+
+            </div>
+          </div>
+        </section>
+
+      </div>
+    )
+  }
+}

src/components/Home.js

@@ -0,0 +1,23 @@
+import React from 'react';
+
+export class Home extends React.Component
+{
+  static defaultProps = {}
+
+  constructor(props)
+  {
+    super(props);
+  }
+
+  componentDidMount()
+  {
+
+  }
+
+  render()
+  {
+    return (
+
+    )
+  }
+}