Commit b659076c authored by Steffen Vogel's avatar Steffen Vogel 🎅🏼
Browse files

Merge branch '157-replace-pintura-files-by-npm-package' into develop

parents 7b11f6d0 3a0d98b1
variables: variables:
GIT_SUBMODULE_STRATEGY: normal GIT_SUBMODULE_STRATEGY: normal
DOCKER_TAG: ${CI_COMMIT_REF_NAME}
DOCKER_IMAGE_DEV: villas/web-dev:${CI_COMMIT_REF_NAME}
cache: cache:
untracked: true untracked: true
key: "$CI_PROJECT_ID" key: ${CI_PROJECT_ID}
paths: paths:
- node_modules/ - node_modules/
- _site/vendor/ - _site/vendor/
...@@ -14,11 +16,12 @@ stages: ...@@ -14,11 +16,12 @@ stages:
- prepare - prepare
- build - build
- test - test
- deploy
prepare: prepare:
stage: prepare stage: prepare
script: script:
- docker build -t villas/web-dev . - docker build -t ${DOCKER_IMAGE_DEV} -f packaging/docker/Dockerfile.dev .
tags: tags:
- linux - linux
- shell - shell
...@@ -30,7 +33,7 @@ build_job: ...@@ -30,7 +33,7 @@ build_job:
script: script:
- npm install - npm install
- npm run build - npm run build
image: villas/web-dev image: ${DOCKER_IMAGE_DEV}
artifacts: artifacts:
paths: paths:
- build/ - build/
...@@ -42,8 +45,22 @@ test_job: ...@@ -42,8 +45,22 @@ test_job:
stage: test stage: test
script: script:
- npm test - npm test
image: villas/web-dev image: ${DOCKER_IMAGE_DEV}
dependencies: dependencies:
- build_job - build_job
tags: tags:
- docker - docker
deploy:docker:
stage: deploy
script:
- docker build -t ${DOCKER_IMAGE} -f packaging/docker/Dockerfile .
- docker tag villas/web:${DOCKER_TAG} villas/web:latest
- docker push villas/web:${DOCKER_TAG}
- docker push villas/web:latest
tags:
- shell
- linux
only:
refs:
- master
FROM node:8.2
# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
# use changes to package.json to force Docker not to use the cache
# when we change our application's nodejs dependencies:
ADD package.json /usr/src/app
RUN npm install
# Install app dependencies
COPY . /usr/src/app
RUN npm run build
# Run the app in a local webserver
RUN npm install -g serve
EXPOSE 5000
CMD [ "serve", "-s", "build" ]
packaging/docker/Dockerfile
\ No newline at end of file
This diff is collapsed.
...@@ -19,7 +19,10 @@ ...@@ -19,7 +19,10 @@
"file-saver": "^1.3.8", "file-saver": "^1.3.8",
"flux": "^3.1.2", "flux": "^3.1.2",
"gaugeJS": "^1.3.2", "gaugeJS": "^1.3.2",
"handlebars": "^4.1.1",
"immutable": "^3.8.1", "immutable": "^3.8.1",
"jszip": "^3.2.0",
"libcimsvg": "git+https://git.rwth-aachen.de/acs/public/cim/pintura-npm-package.git",
"lodash": "^4.17.11", "lodash": "^4.17.11",
"prop-types": "^15.6.2", "prop-types": "^15.6.2",
"rc-slider": "^8.6.3", "rc-slider": "^8.6.3",
...@@ -36,7 +39,7 @@ ...@@ -36,7 +39,7 @@
"react-rnd": "^7.4.3", "react-rnd": "^7.4.3",
"react-router": "^4.3.1", "react-router": "^4.3.1",
"react-router-dom": "^4.3.1", "react-router-dom": "^4.3.1",
"react-scripts": "^1.1.5", "react-scripts": "^3.0.1",
"react-sortable-tree": "^0.1.19", "react-sortable-tree": "^0.1.19",
"react-svg-pan-zoom": "^2.18.0", "react-svg-pan-zoom": "^2.18.0",
"superagent": "^3.8.3", "superagent": "^3.8.3",
...@@ -51,5 +54,17 @@ ...@@ -51,5 +54,17 @@
"test": "react-scripts test --env=jsdom", "test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject" "eject": "react-scripts eject"
}, },
"proxy": "http://localhost:4000" "proxy": "http://localhost:4000",
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
} }
FROM node:12.2 AS builder
RUN apt-get install -y \
git
# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
# use changes to package.json to force Docker not to use the cache
# when we change our application's nodejs dependencies:
ADD package.json /usr/src/app
RUN npm install
# Install app dependencies
COPY . /usr/src/app
RUN npm run build
FROM nginx
COPY --from=builder /usr/src/app/build /usr/share/nginx/html
FROM node:12.2
RUN apt-get install -y \
git
#menu {
color:#fff!important;
background-color:#000!important
}
.dark-grey-background {
color:black;
background:#aaa;
}
.light-grey-background {
color:black;
background:#ddd;
}
.blue-grey-background {
color:white;
background:#607d8b;
}
.floating-panel-item {
font-size:12px;
}
#floating-panel-list-div {
background:#aaa;
}
.floating-panel-list {
background:grey;
border:none;
}
.w3-ul li {
border-bottom:0px;
}
#sidebar {
background:#607d8b;
border-right:thick solid white;
}
.component-type-name {
color:black;
font-size:12px;
}
.floating-panel-name {
font-size:12px;
}
.dark-font {
color:black;
}
.dropdown-menu {
border:medium solid black;
background:#607d8b;
border:medium solid black;
border-width: 1px 1px 1px 1px;
}
.dropdown-menu h4 {
color:white;
}
.dropdown-menu a {
color: black;
background:#ddd;
font-size:14px;
}
.dropdown-menu a:hover {
background:#bbb;
color: white;
}
.bar {
stroke: #000;
stroke-width: 3px;
}
.highlighted-node:hover {
stroke: #ff0;
}
line {
stroke: #000;
stroke-width: 1px;
}
.line {
stroke: #000;
stroke-width: 2px;
}
.terminal-connnode {
stroke: #000;
stroke-width: 1px;
}
.terminal-toponode {
stroke: #000;
stroke-width: 1px;
}
.conduct {
stroke: #000;
stroke-width: 1px;
}
.unknown {
stroke: #f0f;
stroke-width: 1px;
height: 20px;
width: 20px;
}
.acline {
stroke: #000;
stroke-width: 2px;
}
#backing {
fill: whitesmoke;
}
/* Below here are SVG elements that we don't want the user to interact with
therefore we disable pointer events */
.svglabel {
visibility: hidden;
pointer-events: none;
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */
}
.svglabel-high {
visibility: visible;
font-size: 12px;
font-family: "sans-serif";
text-anchor: right;
fill: black;
stroke-width: 1px;
pointer-events: none;
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */
}
.gridLine {
stroke: #aaa;
stroke-width: 1px;
pointer-events: none;
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */
}
.gridLabel {
font-size: 8px;
font-family: "sans-serif";
fill: grey;
stroke-width: 0px;
pointer-events: none;
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */
}
This diff is collapsed.
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="24" width="24" xmlns="http://www.w3.org/2000/svg">
<rect x="4" y="4" height="16" width="16" fill-opacity="0" stroke="black" stroke-width="1" />
<line x1="4" y1="12" x2="8" y2="12" fill-opacity="0" stroke="black" stroke-width="1" />
<line x1="8" y1="12" x2="14" y2="8" fill-opacity="0" stroke="black" stroke-width="1" />
<line x1="15" y1="12" x2="20" y2="12" fill-opacity="0" stroke="black" stroke-width="1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="27" width="27" xmlns="http://www.w3.org/2000/svg">
<circle id="circle" cx="13" cy="14" r="6" fill-opacity="1" stroke="black" stroke-width="1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="24" width="24" xmlns="http://www.w3.org/2000/svg">
<polygon points="7,10 17,10 12,24" style="fill:black;stroke:black;stroke-width:1" />
<line x1="12" y1="3" x2="12" y2="22" style="fill:black;stroke:black;stroke-width:1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="36" width="36" xmlns="http://www.w3.org/2000/svg">
<defs>
<pattern id="diagonalHatch" width="8" height="8" patternUnits="userSpaceOnUse">
<line x1="0" y1="0" x2="8" y2="8" style="stroke:black; stroke-width:1" />
<line x1="8" y1="0" x2="0" y2="8" style="stroke:black; stroke-width:1" />
</pattern>
</defs>
<rect x="6" y="6" width="24" height="24" style="fill:url(#diagonalHatch);stroke:black;stroke-width:1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="36" width="36" xmlns="http://www.w3.org/2000/svg">
<defs>
<marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
<path d="M0,2 L0,4 L2,3 z" fill="#000" />
</marker>
<pattern id="diagonalHatch" width="8" height="8" patternUnits="userSpaceOnUse">
<line x1="8" y1="0" x2="0" y2="8" style="stroke:black; stroke-width:1" />
</pattern>
</defs>
<line x1="8" y1="8" x2="12" y2="12" stroke="#000" stroke-width="3" marker-end="url(#arrow)" />
<line x1="16" y1="8" x2="20" y2="12" stroke="#000" stroke-width="3" marker-end="url(#arrow)" />
<rect x="6" y="18" width="24" height="12" style="fill:url(#diagonalHatch);stroke:black;stroke-width:1" />
<rect x="6" y="6" width="24" height="24" style="fill:none;stroke:black;stroke-width:1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="24" width="24" xmlns="http://www.w3.org/2000/svg">
<circle id="circle" cx="12" cy="12" r="10" fill-opacity="0" stroke="black" stroke-width="1" />
<path d="M4 12 C 6 5, 10 5, 12 12 S 19 19, 20 12" stroke="black" fill="transparent"/>
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="24" width="24" xmlns="http://www.w3.org/2000/svg">
<rect x="8" y="8" width="8" height="8" style="fill:black;stroke:black;stroke-width:1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="12" width="12" xmlns="http://www.w3.org/2000/svg" stroke-width="1">
<circle cx="6" cy="6" r="1" fill-opacity="1" stroke="black" stroke-width="1" />
<rect x="0" y="0" height="12" width="12" fill-opacity="0" stroke="black" stroke-width="1" />
</svg>
<?xml version="1.0"?>
<!--
Copyright © 2016-2017, RWTH Aachen University
Authors: Richard Marston
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
A copy of the GNU General Public License is in the LICENSE file
in the top level directory of this source tree.
-->
<svg height="24" width="24" xmlns="http://www.w3.org/2000/svg">
<circle id="leftcircle" cx="13" cy="10" r="7" fill-opacity="0" stroke="black" stroke-width="1" />
<circle id="rightcircle" cx="13" cy="14" r="7" fill-opacity="0" stroke="black" stroke-width="1" />
</svg>
/*
* Copyright © 2016-2017, RWTH Aachen University
* Authors: Richard Marston
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* A copy of the GNU General Public License is in the LICENSE file
* in the top level directory of this source tree.
*/
var cimjson = cimjson || (function() {
var pathBase = '';
const imageNames = {
"cim:ACLineSegment": "images/term.svg",
"cim:Terminal": "images/term.svg",
"cim:Breaker": "images/brea.svg",
"cim:ConnectivityNode": "images/conn.svg",
"cim:EnergyConsumer": "images/cons.svg",
"cim:EquivalentInjection": "images/cons.svg",
"cim:ExternalNetworkInjection": "images/net.svg",
"cim:PowerTransformer": "images/trans.svg",
"cim:SolarGeneratingUnit": "images/solar.svg",
"cim:SynchronousMachine": "images/sync.svg",
"cim:TopologicalNode": "images/topo.svg",
"cim:TransformerWinding": "images/trans.svg",
};
const PinturaDiagramObjectPoints = "Pintura:DiagramObjectPoints";
var getImageName = function(type) {
return pathBase + imageNames[type];
}
var convertDiagramObjectToTemplateFormat = function(diagramObject, graph, categoryGraphName, diagramList) {
let originalPoints = diagramObject[PinturaDiagramObjectPoints];
let preOffsetPoints = [];
let imagePoints = [];
let labelPoint;
let object;
let categoryGraph = graph[categoryGraphName];
const imageHeight = 12;
const imageWidth = 12;
if (diagramObject["cim:DiagramObject.IdentifiedObject"] != undefined) {
let rdfId = diagramObject["cim:DiagramObject.IdentifiedObject"]["rdf:resource"].substring(1);
for (let index in originalPoints) {
let point = originalPoints[index];
preOffsetPoints.push(
{
"x": parseInt(point["cim:DiagramObjectPoint.xPosition"]).toString(),
"y": parseInt(point["cim:DiagramObjectPoint.yPosition"]).toString()