ES6 plugins support

pull/412/head
Piero Toffanin 2018-03-19 16:46:28 -04:00
rodzic 9e07e297c6
commit 149d7b6729
7 zmienionych plików z 166 dodań i 78 usunięć

Wyświetl plik

@ -21,6 +21,11 @@ def register_plugins():
logger.info("Running npm install for {}".format(plugin.get_name()))
subprocess.call(['npm', 'install'], cwd=plugin.get_path("public"))
# Check for webpack.config.js (if we need to build it)
if plugin.path_exists("public/webpack.config.js") and not plugin.path_exists("public/build"):
logger.info("Running webpack for {}".format(plugin.get_name()))
subprocess.call(['webpack'], cwd=plugin.get_path("public"))
plugin.register()
logger.info("Registered {}".format(plugin))

Wyświetl plik

@ -24,6 +24,7 @@ export default class ApiFactory{
this.events.addListener(`${api.namespace}::${eventName}`, (...args) => {
Promise.all(callbackOrDeps.map(dep => SystemJS.import(dep)))
.then((...deps) => {
console.log(eventName, deps);
callbackOrUndef(...(Array.from(args).concat(...deps)));
});
});

Wyświetl plik

@ -4,9 +4,6 @@ import 'leaflet/dist/leaflet.css';
import Leaflet from 'leaflet';
import async from 'async';
import 'leaflet-draw/dist/leaflet.draw.css';
import 'leaflet-draw/dist/leaflet.draw';
import '../vendor/leaflet/L.Control.MousePosition.css';
import '../vendor/leaflet/L.Control.MousePosition';
import '../vendor/leaflet/Leaflet.Autolayers/css/leaflet.auto-layers.css';
@ -103,7 +100,6 @@ class Map extends React.Component {
// Associate metadata with this layer
meta.name = info.name;
window.meta = meta;
layer[Symbol.for("meta")] = meta;
if (forceAddLayers || prevSelectedLayers.indexOf(layerId(layer)) !== -1){
@ -184,80 +180,6 @@ class Map extends React.Component {
map: this.map
});
const featureGroup = L.featureGroup();
featureGroup.addTo(this.map);
new L.Control.Draw({
draw: {
polygon: {
allowIntersection: false, // Restricts shapes to simple polygons
shapeOptions: {
color: '#707070'
}
},
rectangle: false,
circle: false,
circlemarker: false,
marker: false
},
edit: {
featureGroup: featureGroup,
edit: {
selectedPathOptions: {
maintainColor: true,
dashArray: '10, 10'
}
}
}
}).addTo(this.map);
this.map.on(L.Draw.Event.CREATED, function(e) {
e.layer.feature = {geometry: {type: 'Polygon'} };
featureGroup.addLayer(e.layer);
const meta = window.meta;
var paramList;
$.ajax({
type: 'POST',
async: false,
url: `/api/projects/${meta.task.project}/tasks/${meta.task.id}/volume`,
data: JSON.stringify(e.layer.toGeoJSON()),
contentType: "application/json",
success: function (msg) {
paramList = msg;
},
error: function (jqXHR, textStatus, errorThrown) {
alert("get session failed " + errorThrown);
}
});
e.layer.bindPopup('Volume: ' + paramList.toFixed(2) + 'Mètres Cubes (m3)');
});
this.map.on(L.Draw.Event.EDITED, function(e) {
e.layers.eachLayer(function(layer) {
const meta = window.meta;
var paramList = null;
$.ajax({
type: 'POST',
async: false,
url: `/api/projects/${meta.task.project}/tasks/${meta.task.id}/volume`,
data: JSON.stringify(layer.toGeoJSON()),
contentType: "application/json",
success: function (msg) {
paramList = msg;
},
error: function (jqXHR, textStatus, errorThrown) {
alert("get session failed " + errorThrown);
}
});
layer.setPopupContent('Volume: ' + paramList.toFixed(2) + 'Mètres Cubes (m3)');
});
});
Leaflet.control.scale({
maxWidth: 250,
}).addTo(this.map);

Wyświetl plik

@ -3,6 +3,9 @@ from app.plugins import PluginBase
from .api import TaskVolume
class Plugin(PluginBase):
def include_js_files(self):
return ['main.js']
def api_mount_points(self):
return [
MountPoint('task/(?P<pk>[^/.]+)/calculate$', TaskVolume.as_view())

Wyświetl plik

@ -0,0 +1,5 @@
module.exports = class Hello{
constructor(){
console.log("INSTANTIATED");
}
}

Wyświetl plik

@ -0,0 +1,79 @@
PluginsAPI.Map.willAddControls([
'volume/build/app.js'
], function(options, App){
new App();
});
/*
const featureGroup = L.featureGroup();
featureGroup.addTo(this.map);
new L.Control.Draw({
draw: {
polygon: {
allowIntersection: false, // Restricts shapes to simple polygons
shapeOptions: {
color: '#707070'
}
},
rectangle: false,
circle: false,
circlemarker: false,
marker: false
},
edit: {
featureGroup: featureGroup,
edit: {
selectedPathOptions: {
maintainColor: true,
dashArray: '10, 10'
}
}
}
}).addTo(this.map);
this.map.on(L.Draw.Event.CREATED, function(e) {
e.layer.feature = {geometry: {type: 'Polygon'} };
featureGroup.addLayer(e.layer);
var paramList;
$.ajax({
type: 'POST',
async: false,
url: `/api/projects/${meta.task.project}/tasks/${meta.task.id}/volume`,
data: JSON.stringify(e.layer.toGeoJSON()),
contentType: "application/json",
success: function (msg) {
paramList = msg;
},
error: function (jqXHR, textStatus, errorThrown) {
alert("get session failed " + errorThrown);
}
});
e.layer.bindPopup('Volume: ' + paramList.toFixed(2) + 'Mètres Cubes (m3)');
});
this.map.on(L.Draw.Event.EDITED, function(e) {
e.layers.eachLayer(function(layer) {
const meta = window.meta;
var paramList = null;
$.ajax({
type: 'POST',
async: false,
url: `/api/projects/${meta.task.project}/tasks/${meta.task.id}/volume`,
data: JSON.stringify(layer.toGeoJSON()),
contentType: "application/json",
success: function (msg) {
paramList = msg;
},
error: function (jqXHR, textStatus, errorThrown) {
alert("get session failed " + errorThrown);
}
});
layer.setPopupContent('Volume: ' + paramList.toFixed(2) + 'Mètres Cubes (m3)');
});
});*/

Wyświetl plik

@ -0,0 +1,73 @@
// Magic to include node_modules of root WebODM's directory
process.env.NODE_PATH = "../../../node_modules";
require("module").Module._initPaths();
let path = require("path");
let webpack = require('webpack');
let ExtractTextPlugin = require('extract-text-webpack-plugin');
let LiveReloadPlugin = require('webpack-livereload-plugin');
module.exports = {
context: __dirname,
entry: {
app: ['./app.jsx']
},
output: {
path: path.join(__dirname, './build'),
filename: "[name].js",
libraryTarget: "amd"
},
plugins: [
new LiveReloadPlugin(),
new ExtractTextPlugin('css/[name].css', {
allChunks: true
})
],
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
use: [
{
loader: 'babel-loader',
query: {
"plugins": [
'syntax-class-properties',
'transform-class-properties'
],
presets: ['es2015', 'react']
}
}
],
},
{
test: /\.s?css$/,
use: ExtractTextPlugin.extract({
use: 'css-loader!sass-loader'
})
},
{
test: /\.(png|jpg|jpeg|svg)/,
loader: "url-loader?limit=100000"
}
]
},
resolve: {
modules: ['node_modules', 'bower_components'],
extensions: ['.js', '.jsx']
},
externals: {
// require("jquery") is external and available
// on the global let jQuery
"jquery": "jQuery",
"SystemJS": "SystemJS",
"PluginsAPI": "PluginsAPI"
}
}