tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixed the cached svgs.

This commit is contained in:
mdtrooper 2016-03-04 15:20:27 +01:00
parent 5be789038e
commit aa8ce714d8
3 changed files with 146 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pandora_console/images/maps/body_arrow.svg
View File

@ -14,6 +14,6 @@ xmlns:xlink="http://www.w3.org/1999/xlink">
height="50"
width="100"
id="rect27734"
style="fill: rgb(255, 0, 0);fill-opacity:1.0;stroke:#00ff00;stroke-width:9.28252983;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
style="fill: rgb(255, 255, 0); fill-opacity:1.0;stroke:#00ff00;stroke-width:9.28252983;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</symbol>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 526 B

After

Width:  |  Height:  |  Size: 529 B

101
pandora_console/include/class/Map.class.php
View File

@ -174,14 +174,109 @@ $this->nodes = json_decode('[
{
"graph_id": 213,
"type": 2
},
{
"graph_id": 214,
"id": 666,
"type": 0,
"x": 300,
"y": 300
},
{
"graph_id": 215,
"id": 999,
"type": 0,
"x": 300,
"y": 100
},
{
"graph_id": 216,
"id": 999,
"type": 0,
"x": 300,
"y": 500
},
{
"graph_id": 217,
"id": 666,
"type": 0,
"x": 100,
"y": 300
},
{
"graph_id": 218,
"id": 666,
"type": 0,
"x": 500,
"y": 300
},
{
"graph_id": 219,
"id": 666,
"type": 0,
"x": 500,
"y": 100
},
{
"graph_id": 220,
"id": 666,
"type": 0,
"x": 500,
"y": 500
},
{
"graph_id": 221,
"id": 666,
"type": 0,
"x": 100,
"y": 100
},
{
"graph_id": 222,
"id": 666,
"type": 0,
"x": 100,
"y": 500
},
{
"graph_id": 400,
"type": 2
},
{
"graph_id": 401,
"type": 2
},
{
"graph_id": 402,
"type": 2
},
{
"graph_id": 403,
"type": 2
}
]', true);
$this->edges = json_decode(
'[
{"to":"180","from":"184","graph_id":213},
{"to":"165","from":"166","graph_id":208},
{"to":"165","from":"169","graph_id":209}]', true);
{"to":"215","from":"214","graph_id":400},
{"to":"216","from":"214","graph_id":401},
{"to":"217","from":"214","graph_id":402},
{"to":"218","from":"214","graph_id":403}
]', true);
$this->edges = json_decode(
'[
{"to":"218","from":"214","graph_id":400},
{"to":"217","from":"214","graph_id":401}
]', true);
//~ $this->edges = json_decode('[{"to":"165","from":"166","graph_id":208}]', true);

158
pandora_console/include/javascript/map/MapController.js
View File

@ -231,7 +231,7 @@ MapController.prototype.paint_nodes = function() {
.attr("data-type", function(d) { return d['type'];})
.append("circle")
.attr("style", "fill: rgb(50, 50, 128);")
.attr("r", "6");
.attr("r", "15");
@ -299,91 +299,9 @@ MapController.prototype.paint_nodes = function() {
}
function wait_for_preload_symbols(target, symbols, callback) {
var count_symbols = symbols.length;
function wait(target, symbol, callback) {
switch (is_preload_symbol(target, symbol)) {
case -1:
preload_symbol(target, symbol);
setTimeout(
function() {
wait(target, symbol, callback);
},
300);
break;
case 0:
// Wait
setTimeout(
function() {
wait(target, symbol, callback);
},
300);
break;
case 1:
count_symbols--;
break;
}
if (count_symbols == 0) {
callback();
}
}
for (var i in symbols) {
if (typeof(symbols[i]) == "string")
wait(target, symbols[i], callback);
}
}
function is_preload_symbol(target, symbol) {
var base64symbol = btoa(symbol).replace(/=/g, "");
if (d3.select(target + " #" + base64symbol).node() === null)
return -1;
return parseInt(d3.select(target +" #" + base64symbol).attr("data-loaded"));
}
function preload_symbol(target, symbol, param_step) {
var step;
if (typeof(param_step) == "undefined") {
step = 1;
param_step = 1;
}
else {
step = param_step;
}
step++;
var base64symbol = btoa(symbol).replace(/=/g, "");
switch (param_step) {
case 1:
d3.select(target).append("g")
.attr("id", base64symbol)
.attr("data-loaded", 0)
.style("opacity", 0)
.append("use")
.attr("xlink:href", symbol)
.on("load",
function() {
preload_symbol(target, symbol, step);
});
break;
case 2:
d3.select("#" + base64symbol).attr("data-loaded", 1);
break;
}
}
function get_distance_between_point(point1, point2) {
var delta_x = Math.abs(point1[0] - point2[0]);
var delta_y = Math.abs(point1[1] - point1[1]);
var delta_y = Math.abs(point1[1] - point2[1]);
return Math.sqrt(
Math.pow(delta_x, 2) + Math.pow(delta_y, 2));
@ -418,40 +336,55 @@ function getBBox_Symbol(target, symbol) {
return d3.select(target + " #" + base64symbol).node().getBBox();
}
function arrow_by_pieces(target, id_arrow, id_node_to, id_node_from, step) {
if (typeof(step) === "undefined")
step = 0;
function arrow_by_pieces(target, id_arrow, id_node_to, id_node_from, wait) {
step++;
if (typeof(wait) === "undefined")
wait = 1;
switch (step) {
var count_files = 2;
function wait_load(callback) {
count_files--;
if (count_files == 0) {
callback();
}
}
var arrow_layout = d3
.select(target +" #" + id_arrow);
switch (wait) {
case 1:
wait_for_preload_symbols(
target,
["images/maps/body_arrow.svg#body_arrow",
"images/maps/head_arrow.svg#head_arrow"],
function() {
arrow_by_pieces(target, id_arrow, id_node_to, id_node_from, step);
});
break;
case 2:
var arrow_layout = d3
.select(target +" #" + id_arrow);
arrow_layout.append("g")
.attr("class", "body")
.append("use")
.attr("xlink:href", "images/maps/body_arrow.svg#body_arrow");
.attr("xlink:href", "images/maps/body_arrow.svg#body_arrow")
.on("load", function() {
wait_load(function() {
arrow_by_pieces(
target, id_arrow, id_node_to, id_node_from, 0);
});
});
arrow_layout.append("g")
.attr("class", "head")
.append("use")
.attr("xlink:href", "images/maps/head_arrow.svg#head_arrow");
var c_elem1 = get_center_element(target +" #" + id_node_to);
var c_elem2 = get_center_element(target +" #" + id_node_from);
.attr("class", "head")
.append("use")
.attr("xlink:href", "images/maps/head_arrow.svg#head_arrow")
.on("load", function() {
wait_load(function() {
arrow_by_pieces(
target, id_arrow, id_node_to, id_node_from, 0);
});
});
break;
case 0:
var c_elem2 = get_center_element(target +" #" + id_node_to);
var c_elem1 = get_center_element(target +" #" + id_node_from);
//~ console.log("centro", c_elem2, c_elem1);
var distance = get_distance_between_point(c_elem1, c_elem2);
//~ console.log("distance", distance);
var transform = d3.transform();
@ -461,9 +394,12 @@ function arrow_by_pieces(target, id_arrow, id_node_to, id_node_from, step) {
var arrow_body = arrow_layout.select(".body");
var arrow_body_b = arrow_body.node().getBBox();
console.log("arrow_body_b", arrow_body_b);
transform.translate[0] = c_elem1[0];
transform.translate[1] = c_elem1[1] + arrow_body_b['height'] / 2;
transform.rotate = get_angle_of_line(c_elem1, c_elem2);
transform.translate[1] = c_elem1[1];
transform.rotate = get_angle_of_line(c_elem1, c_elem2) +
" 0 " + (arrow_body_b['height'] / 2);
arrow_layout.attr("transform", transform.toString());