var SELECTED_GRAPH_NODE = "";
function createSocialNetworkGraphKey() {
var tb1 = new Element("div", {'id':'graphkeydivtoolbar','class':'toolbarrow col-12'});
var key = new Element("div", {'id':'key','class':'row mb-3'});
var text = "";
text += '
Il piĆ¹ connesso
';
text += 'fortemente connesso
';
text += 'moderatamente connesso
';
text += 'scarsamente connesso
';
text += 'Seleziona elemento
';
key.insert(text);
var count = new Element("div", {'id':'graphConnectionCount','class':'col-auto'});
key.insert(count);
tb1.insert(key);
return tb1;
}
/**
* Create the key for the graph node types etc...
* @return a div holding the graph key.
*/
function createNetworkGraphKey() {
var tb1 = new Element("div", {'id':'graphkeydivtoolbar','class':'toolbarrow col-12'});
var key = new Element("div", {'id':'key','class':'row mb-3'});
var text = "";
if (hasChallenge) {
text += '-
';
}
text+= 'SFIDA
';
if (hasClaim){
text += '-
';
}
if (hasSolution) {
text += 'PROPOSTA
';
}
text += 'ARGOMENTAZIONE
';
text += 'FONTE
';
text += 'Seleziona elemento
';
text += 'elemento focale
';
key.insert(text);
var count = new Element("div", {'id':'graphConnectionCount','class':'col-auto'});
key.insert(count);
tb1.insert(key);
return tb1;
}
/**
* Create the key for the graph node types etc...
* @return a div holding the graph key.
*/
function createNetworkOrgGraphKey() {
var tb1 = new Element("div", {'id':'graphkeydivtoolbar','class':'toolbarrow'});
var key = new Element("div", {'id':'key','class':'row mb-3'});
var text = "";
if (hasChallenge) {
text += '-
';
}
text+= 'SFIDA
';
if (hasClaim){
text += '-
';
}
if (hasSolution) {
text += 'PROPOSTA
';
}
text += 'ARGOMENTAZIONE
';
text += 'FONTE
';
text += 'SOGGETTO O ORGANIZZAZIONE
';
text += 'PROGETTO, SERVIZIO O INIZIATIVA
';
text += 'Seleziona elemento
';
text += 'elemento focale
';
key.insert(text);
tb1.insert(key);
var count = new Element("div", {'id':'graphConnectionCount','class':'col-auto'});
tb1.insert(count);
return tb1;
}
/**
* Create the basic graph toolbar for all network graphs
*/
function createBasicGraphToolbar(forcedirectedGraph, contentarea) {
var tb2 = new Element("div", {'id':'graphmaintoolbar','class':'graphmaintoolbar toolbarrow col-12'});
var button = new Element("button", {'id':'expandbutton','title':'Ridimensiona la mappa', "class":"d-none"});
var icon = new Element("img", {'id':'expandicon', 'src':"https://netlab.evidence-hub.net/images/enlarge2.gif", 'title':'Ridimensiona la mappa'});
button.insert(icon);
tb2.insert(button);
var link = new Element("a", {'id':'expandlink', 'title':'Ridimensiona la mappa', "class":"col-auto map-btn"});
link.insert(' ingrandisci la mappa');
var handler = function() {
if ($('header').style.display == "none") {
$('linkbuttonsvn').update(' ingrandisci la mappa');
reduceMap(contentarea, forcedirectedGraph);
} else {
$('linkbuttonsvn').update(' Rimpicciolisci la mappa');
enlargeMap(contentarea, forcedirectedGraph);
}
};
Event.observe(link,"click", handler);
Event.observe(button,"click", handler);
tb2.insert(link);
var zoomOut = new Element("button", {'class':'btn btn-link', 'title':'Riduci'});
zoomOut.insert(' Riduci');
var zoomOuthandler = function() {
zoomFD(forcedirectedGraph, 5.0);
};
Event.observe(zoomOut,"click", zoomOuthandler);
tb2.insert(zoomOut);
var zoomIn = new Element("button", {'class':'btn btn-link', 'title':'Ingrandisci'});
zoomIn.insert(' Ingrandisci');
var zoomInhandler = function() {
zoomFD(forcedirectedGraph, -5.0);
};
Event.observe(zoomIn,"click", zoomInhandler);
tb2.insert(zoomIn);
var zoom1to1 = new Element("button", {'class':'btn btn-link', 'title':'Ingrandisci questo grafico di rete al 100% e centra l\'elemento focale'});
zoom1to1.insert(' 1:1 focus');
var zoom1to1handler = function() {
zoomFDFull(forcedirectedGraph);
};
Event.observe(zoom1to1,"click", zoom1to1handler);
tb2.insert(zoom1to1);
var zoomFit = new Element("button", {'class':'btn btn-link', 'title':'Ridimensiona il grafico se necessario e spostalo per adattarlo all\'area visibile'});
zoomFit.insert(' Fit all');
var zoomFithandler = function() {
zoomFDFit(forcedirectedGraph);
};
Event.observe(zoomFit,"click", zoomFithandler);
tb2.insert(zoomFit);
var printButton = new Element("button", {'class':'btn btn-link', 'title':'Stampa questo grafico di rete '});
printButton.insert(' Stampa questo grafico di rete ');
var printButtonhandler = function() {
printCanvas(forcedirectedGraph);
};
Event.observe(printButton,"click", printButtonhandler);
tb2.insert(printButton);
return tb2;
}
/**
* Create the graph toolbar for Social network graphs
*/
function createSocialGraphToolbar(forcedirectedGraph,contentarea) {
var tb2 = createBasicGraphToolbar(forcedirectedGraph,contentarea);
var button3 = new Element("button", {'id':'viewdetailbutton','class':'d-none','title':'Apri la home page della persona attualmente selezionata'});
tb2.insert(button3);
var view3 = new Element("a", {'id':'viewdetaillink', "class":"map-btn", 'title':"Apri la home page della persona attualmente selezionata"});
view3.insert(' Esplora la persona selezionata');
var handler3 = function() {
var node = getSelectFDNode(forcedirectedGraph);
if (node != null && node != "") {
var userid = node.getData('oriuser').userid;
if (userid != "") {
viewUserHome(userid);
} else {
alert("Per favore assicurati di aver effettuato una selezione nella mappa.");
}
}
};
Event.observe(button3,"click", handler3);
Event.observe(view3,"click", handler3);
tb2.insert(view3);
var hint2 = "Mostra tutti i collegamenti per il link selezionato";
var link2 = "Esplora il collegamento selezionato";
var button2 = new Element("button", {'id':'viewdetailbutton',"class":"d-none",'title':hint2});
tb2.insert(button2);
// console.log(hint);
var view = new Element("a", {'id':'viewdetaillink', "class":"map-btn", 'title': hint2});
var spancontent = "";
view.insert(" "+link2+"");
var handler2 = function() {
var adj = getSelectFDLink(forcedirectedGraph);
var connectionids = adj.getData('connections');
if (connectionids != "") {
showMultiConnections(connectionids);
} else {
alert("Per favore assicurati di aver effettuato una selezione nella mappa.");
}
};
Event.observe(button2,"click", handler2);
Event.observe(view,"click", handler2);
tb2.insert(view);
return tb2;
}
/**
* Create the graph toolbar for Node network graphs
*/
function createGraphToolbar(forcedirectedGraph,contentarea) {
var tb2 = createBasicGraphToolbar(forcedirectedGraph,contentarea);
var hint2 = "Apri la pagine per visualizzare i dettagli completi dell'elemento selezionato";
var link2 = "Esplora l'elemento selezionato";
var button2 = new Element("button", {'id':'viewdetailbutton','class':'btn btn-link','title':hint2});
button2.insert(" "+link2+"");
tb2.insert(button2);
var handler2 = function() {
var node = getSelectFDNode(forcedirectedGraph);
if (node != null && node != "") {
var nodeid = node.id;
var nodetype = node.getData('nodetype');
var width = getWindowWidth();
var height = getWindowHeight()-20;
viewNodeDetails(nodeid, nodetype, width, height);
} else {
alert("Per favore assicurati di aver effettuato una selezione nella mappa.");
}
};
Event.observe(button2,"click", handler2);
var hint3 = "Apri la home page dell'autore per l'elemento attualmente selezionato";
var link3 = "Esplora l'autore dell'elemento selezionato";
var button3 = new Element("button", {'id':'viewdetailbutton','class':'btn btn-link','title':hint3});
button3.insert(" "+link3+"");
tb2.insert(button3);
var handler3 = function() {
var node = getSelectFDNode(forcedirectedGraph);
if (node != null && node != "") {
var userid = node.getData('oriuser').userid;
if (userid != "") {
viewUserHome(userid);
} else {
alert("Per favore assicurati di aver effettuato una selezione nella mappa.");
}
}
};
Event.observe(button3,"click", handler3);
return tb2;
}
/**
* Calulate the width and height of the visible graph area
* depending if it is reduced or enlarged at present.
*/
function resizeFDGraph(graphview, contentarea, withInner){
if ($('header')&& $('header').style.display == "none") {
var width = $(contentarea).offsetWidth - 35;
var height = getWindowHeight();
//alert(height);
if ($('graphkeydivtoolbar')) {
height -= $('graphkeydivtoolbar').offsetHeight;
}
if ($('graphmaintoolbar')) {
height -= $('graphmaintoolbar').offsetHeight;
}
//if ($('nodearealineartitle')) {
// height -= $('nodearealineartitle').offsetHeight;
//}
height -= 20;
//alert(height);
$(graphview.config.injectInto+'-outer').style.width = width+"px";
$(graphview.config.injectInto+'-outer').style.height = height+"px";
//if (withInner) {
resizeFDGraphCanvas(graphview, width, height);
//}
} else {
var size = calulateInitialGraphViewport(contentarea)
$(graphview.config.injectInto+'-outer').style.width = size.width+"px";
$(graphview.config.injectInto+'-outer').style.height = size.height+"px";
//if (withInner) {
resizeFDGraphCanvas(graphview, width, height);
//}
}
// GRAB FOCUS
graphview.canvas.getPos(true);
}
function calulateInitialGraphViewport(areaname) {
var w = $(areaname).offsetWidth - 30;
var h = getWindowHeight();
//alert(h);
if ($('header')) {
h -= $('header').offsetHeight;
}
// The explore views toolbar
if ($('nodearealineartitle')) {
h -= $('nodearealineartitle').offsetHeight;
}
if ($('headertoolbar')) {
h -= $('headertoolbar').offsetHeight;
h -= 30;
}
if ($('graphkeydivtoolbar')) {
h -= $('graphkeydivtoolbar').offsetHeight;
}
if ($('graphmaintoolbar')) {
h -= $('graphmaintoolbar').offsetHeight;
}
// Main social Network
if ($('tabs')) { // +user social uses this
h -= $('tabs').offsetHeight;
}
if ($('tab-content-user-title')) {
h -= $('tab-content-user-title').offsetHeight;
h -= 35;
}
if ($('tab-content-user-search')) {
h -= $('tab-content-user-search').offsetHeight;
}
if ($('usertabs')) {
h -= $('usertabs').offsetHeight;
}
// User social network
if ($('context')) {
h -= $('context').offsetHeight;
}
if ($('tab-content-user-bar')) {
h -= $('tab-content-user-bar').offsetHeight;
h -= 20;
}
//alert(h);
return {width:w, height:h};
}
/**
* Called to set the screen to standard view
*/
function reduceMap(contentarea, forcedirectedGraph) {
if ($('header')) {
$('header').style.display="flex";
}
// The explore views toolbar
if ($('headertoolbar')) {
$('headertoolbar').style.display="flex";
}
if ($('nodearealineartitle')) {
$('nodearealineartitle').style.display="flex";
}
// Main social Network
if ($('tabs')) { // +user social uses this
$('tabs').style.display="flex";
}
if ($('tab-content-user-title')) {
$('tab-content-user-title').style.display="flex";
}
if ($('tab-content-user-search')) {
$('tab-content-user-search').style.display="flex";
}
if ($('usertabs')) {
$('usertabs').style.display="flex";
}
// User social network
if ($('context')) {
$('context').style.display="flex";
}
if ($('tab-content-user-bar')) {
$('tab-content-user-bar').style.display="flex";
}
resizeFDGraph(forcedirectedGraph, contentarea, true);
}
/**
* Called to remove some screen realestate to increase map area.
*/
function enlargeMap(contentarea, forcedirectedGraph) {
if ($('header')) {
$('header').style.display="none";
}
// The explore views toolbar
if ($('headertoolbar')) {
$('headertoolbar').style.display="none";
}
if ($('nodearealineartitle')) {
$('nodearealineartitle').style.display="none";
}
// Main social Network
if ($('tabs')) { // +user social uses this
$('tabs').style.display="none";
}
if ($('tab-content-user-title')) {
$('tab-content-user-title').style.display="none";
}
if ($('tab-content-user-search')) {
$('tab-content-user-search').style.display="none";
}
if ($('usertabs')) {
$('usertabs').style.display="none";
}
// User social network
if ($('context')) {
$('context').style.display="none";
}
if ($('tab-content-user-bar')) {
$('tab-content-user-bar').style.display="none";
}
resizeFDGraph(forcedirectedGraph, contentarea, true);
}
/**
* Called by the Applet to open the applet help
*/
function showHelp() {
loadDialog('help', URL_ROOT+'help/networkmap.php');
}
/**
* Called by the Applet to go to the home page of the given userid
*/
function viewUserHome(userid) {
var width = getWindowWidth();
var height = getWindowHeight()-20;
loadDialog('userdetails', URL_ROOT+"user.php?userid="+userid, width,height);
}
/**
* Called by the Applet to go to the multi connection expanded view for the given connection
*/
function showMultiConnections(connectionids) {
loadDialog("multiconnections", URL_ROOT+"ui/popups/showmulticonns.php?connectionids="+connectionids, 790, 450);
}
/**
* Check if the current brwoser supports HTML5 Canvas.
* Return true if it does, else false.
*/
function isCanvasSupported(){
var elem = document.createElement('canvas');
return !!(elem.getContext && elem.getContext('2d'));
}