').addClass('inner').appendTo(this.$dom);
+
+ if (typeof NodePopUp.initialized == "undefined") {
+
+ NodePopUp.prototype.setNode = function(node){
+ this.node = node;
+ this.$content.html(this.node.title);
+ };
+
+ NodePopUp.prototype.removeNode = function(){
+ this.node = false;
+ };
+
+ NodePopUp.prototype.draw = function(){
+ if(this.node){
+ this.$dom.css({
+ 'display':"block",
+ 'left':this.node.x+"px",
+ 'top':this.node.y+"px",
+ });
+ }else{
+ this.$dom.css({
+ 'display':"none",
+ });
+ }
+ };
+
+ NodePopUp.initialized = true;
+ }
+ }
+
// ____ __
// / __ \___ ____ ____/ /__ _____
// / /_/ / _ \/ __ \/ __ / _ \/ ___/
@@ -428,14 +475,42 @@
for (var i = 0; i < _nodes.length; i++) {
_nodes[i].onUpdate();
}
- // if(_node_hover_id != -1){
- // _canvas.style.cursor = 'pointer';
- // }else{
- // _canvas.style.cursor = 'auto';
- // }
- _canvas.style.cursor = _node_hover_id != -1 ? 'pointer' : 'auto';
+
+ _node_pop_up.draw();
+
+ if(_node_hover_id != -1){
+ _canvas.style.cursor = 'pointer';
+ highlightEntries();
+ // _node_pop_up.visible = true;
+ }else{
+ _canvas.style.cursor = 'auto';
+ _$entrees_block_termlinks.removeClass('highlighted');
+ // _node_pop_up.visible = false;
+ }
};
+
+ // _ _ _ _ _ _ _ _ ___ _ _
+ // | || (_)__ _| |_ | |_(_)__ _| |_| |_| __|_ _| |_ _ _(_)___ ___
+ // | __ | / _` | ' \| / / / _` | ' \ _| _|| ' \ _| '_| / -_|_-<
+ // |_||_|_\__, |_||_|_\_\_\__, |_||_\__|___|_||_\__|_| |_\___/__/
+ // |___/ |___/
+ function highlightEntries(){
+ _$entrees_block_termlinks.removeClass('highlighted');
+ var entree;
+ for (var i = 0; i < _nodes[_node_hover_id].entrees.length; i++) {
+ entree = _nodes[_node_hover_id].entrees[i];
+ _$entrees_block_termlinks.filter(function(){
+ return $(this).attr('tid') == entree;
+ }).addClass('highlighted');
+ }
+ }
+
+
+ // ___ _ _ _ _
+ // / __| |_ __ _ _ _| |_ /_\ _ _ (_)_ __ ___
+ // \__ \ _/ _` | '_| _|/ _ \| ' \| | ' \/ -_)
+ // |___/\__\__,_|_| \__/_/ \_\_||_|_|_|_|_\___|
function startAnime(){
_physics.onUpdate(render);
_physics.play()
diff --git a/sites/all/modules/figli/edlp_corpus/assets/dist/styles/corpus.min.css b/sites/all/modules/figli/edlp_corpus/assets/dist/styles/corpus.min.css
index dfb0ca670..5e8a4aa72 100644
--- a/sites/all/modules/figli/edlp_corpus/assets/dist/styles/corpus.min.css
+++ b/sites/all/modules/figli/edlp_corpus/assets/dist/styles/corpus.min.css
@@ -7,3 +7,26 @@ canvas#corpus-map {
z-index: 0; }
canvas#corpus-map.de-activated {
background-color: #f4f4f4; }
+
+div.node-popup {
+ display: none;
+ position: absolute;
+ -webkit-box-sizing: content-box;
+ box-sizing: content-box;
+ width: 140px;
+ min-height: 30px;
+ pointer-events: none; }
+ div.node-popup .inner {
+ padding: 1em;
+ outline: 1px solid red;
+ background-color: white; }
+ div.node-popup:before {
+ content: "";
+ position: absolute;
+ bottom: -15px;
+ left: -29px;
+ width: 30px;
+ height: 0;
+ border-top: 1px solid red;
+ -webkit-transform: rotateZ(135deg);
+ transform: rotateZ(135deg); }
diff --git a/sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js b/sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js
index 35d98ce25..625f50ba6 100644
--- a/sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js
+++ b/sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js
@@ -41,7 +41,7 @@
var _node_hover_id = -1;
var _$entrees_block = $('#block-edlpentreesblock');
var _$entrees_block_termlinks = $('a.term-link', _$entrees_block);
-
+ var _node_pop_up;
// Colors depend on edlp_vars loaded by edlptheme
// console.log('Corpus : edlp_vars', edlp_vars);
@@ -97,7 +97,17 @@
// console.log('drupalSettings',drupalSettings);
// console.log('window.location', window.location);
var path = window.location.origin + drupalSettings.basepath + "edlp/corpus";
- $.getJSON(path, {}, onCorpusLoaded);
+ $.getJSON(path, {})
+ .done(function(data){
+ onCorpusLoaded(data);
+ })
+ .fail(function(jqxhr, textStatus, error){
+ onCorpusLoadError(jqxhr, textStatus, error, $link, sys_path);
+ });
+ };
+
+ function onCorpusLoadError(jqxhr, textStatus, error, $link, sys_path){
+ console.warn('corpus load failed', jqxhr.responseText);
};
function onCorpusLoaded(data){
@@ -106,6 +116,7 @@
// buildParticles(data.nodes);
buildNodes(data.nodes);
initEvents();
+ initNodePopup();
startAnime();
};
@@ -114,16 +125,12 @@
// / |/ / __ \/ __ / _ \/ ___/
// / /| / /_/ / /_/ / __(__ )
// /_/ |_/\____/\__,_/\___/____/
-
function buildNodes(nodes){
console.log("buildNodes", nodes);
var x,y,d;
for (var i in nodes) {
- // console.log('i',i);
d = i < 1 ? true : false;
_nodes.push(new Node(i,nodes[i],d));
- // if(i==0)
- // break;
}
};
@@ -167,21 +174,15 @@
this.e_color = 'e_col_'+this.entrees[Math.floor(Math.random(this.entrees.length))];
-
this.hover = false;
// physics
this.p = _physics.makeParticle(this.mass, this.x, this.y);
this.p.velocity = new Physics.Vector((Math.random()-0.5)*_p_velocity_factor, (Math.random()-0.5)*_p_velocity_factor);
-
// prototypes
if (typeof Node.initialized == "undefined") {
- // Node.prototype.init = function(){
- // // console.log("Node : init()", this);
- // // this.draw();
- // };
Node.prototype.calcWallLimits = function(){
this.wall_limits = {
top: _canvas_props.margin_top +this.r,
@@ -236,28 +237,29 @@
if(_node_hover_id == -1 || _node_hover_id == this.id){
// console.log("Node hover", this.id);
this.hover = true;
- this.highlightEntries();
+ // this.highlightEntries();
_node_hover_id = this.id;
+ _node_pop_up.setNode(this);
}
}else{
this.hover = false;
if (_node_hover_id == this.id) {
_node_hover_id = -1;
- _$entrees_block_termlinks.removeClass('highlighted');
+ _node_pop_up.removeNode();
}
}
};
- Node.prototype.highlightEntries = function(){
- _$entrees_block_termlinks.removeClass('highlighted');
- var entree;
- for (var i = 0; i < this.entrees.length; i++) {
- entree = this.entrees[i];
- _$entrees_block_termlinks.filter(function(){
- return $(this).attr('tid') == entree;
- }).addClass('highlighted');
- }
- }
+ // Node.prototype.highlightEntries = function(){
+ // _$entrees_block_termlinks.removeClass('highlighted');
+ // var entree;
+ // for (var i = 0; i < this.entrees.length; i++) {
+ // entree = this.entrees[i];
+ // _$entrees_block_termlinks.filter(function(){
+ // return $(this).attr('tid') == entree;
+ // }).addClass('highlighted');
+ // }
+ // }
Node.prototype.draw = function(){
// carre plein
@@ -415,6 +417,51 @@
};
+
+ // _ _ _ ___ _ _
+ // | \| |___ __| |___| _ \___ _ __| | | |_ __
+ // | .` / _ \/ _` / -_) _/ _ \ '_ \ |_| | '_ \
+ // |_|\_\___/\__,_\___|_| \___/ .__/\___/| .__/
+ // |_| |_|
+ function initNodePopup(){
+ _node_pop_up = new NodePopUp();
+ };
+
+ function NodePopUp(){
+ this.visible = false;
+ this.node;
+ this.$dom = $('
').addClass('node-popup').appendTo('body');
+ this.$content = $('
').addClass('inner').appendTo(this.$dom);
+
+ if (typeof NodePopUp.initialized == "undefined") {
+
+ NodePopUp.prototype.setNode = function(node){
+ this.node = node;
+ this.$content.html(this.node.title);
+ };
+
+ NodePopUp.prototype.removeNode = function(){
+ this.node = false;
+ };
+
+ NodePopUp.prototype.draw = function(){
+ if(this.node){
+ this.$dom.css({
+ 'display':"block",
+ 'left':this.node.x+"px",
+ 'top':this.node.y+"px",
+ });
+ }else{
+ this.$dom.css({
+ 'display':"none",
+ });
+ }
+ };
+
+ NodePopUp.initialized = true;
+ }
+ }
+
// ____ __
// / __ \___ ____ ____/ /__ _____
// / /_/ / _ \/ __ \/ __ / _ \/ ___/
@@ -428,14 +475,42 @@
for (var i = 0; i < _nodes.length; i++) {
_nodes[i].onUpdate();
}
- // if(_node_hover_id != -1){
- // _canvas.style.cursor = 'pointer';
- // }else{
- // _canvas.style.cursor = 'auto';
- // }
- _canvas.style.cursor = _node_hover_id != -1 ? 'pointer' : 'auto';
+
+ _node_pop_up.draw();
+
+ if(_node_hover_id != -1){
+ _canvas.style.cursor = 'pointer';
+ highlightEntries();
+ // _node_pop_up.visible = true;
+ }else{
+ _canvas.style.cursor = 'auto';
+ _$entrees_block_termlinks.removeClass('highlighted');
+ // _node_pop_up.visible = false;
+ }
};
+
+ // _ _ _ _ _ _ _ _ ___ _ _
+ // | || (_)__ _| |_ | |_(_)__ _| |_| |_| __|_ _| |_ _ _(_)___ ___
+ // | __ | / _` | ' \| / / / _` | ' \ _| _|| ' \ _| '_| / -_|_-<
+ // |_||_|_\__, |_||_|_\_\_\__, |_||_\__|___|_||_\__|_| |_\___/__/
+ // |___/ |___/
+ function highlightEntries(){
+ _$entrees_block_termlinks.removeClass('highlighted');
+ var entree;
+ for (var i = 0; i < _nodes[_node_hover_id].entrees.length; i++) {
+ entree = _nodes[_node_hover_id].entrees[i];
+ _$entrees_block_termlinks.filter(function(){
+ return $(this).attr('tid') == entree;
+ }).addClass('highlighted');
+ }
+ }
+
+
+ // ___ _ _ _ _
+ // / __| |_ __ _ _ _| |_ /_\ _ _ (_)_ __ ___
+ // \__ \ _/ _` | '_| _|/ _ \| ' \| | ' \/ -_)
+ // |___/\__\__,_|_| \__/_/ \_\_||_|_|_|_|_\___|
function startAnime(){
_physics.onUpdate(render);
_physics.play()
diff --git a/sites/all/modules/figli/edlp_corpus/assets/styles/corpus.scss b/sites/all/modules/figli/edlp_corpus/assets/styles/corpus.scss
index 269a3c572..f44ab603d 100644
--- a/sites/all/modules/figli/edlp_corpus/assets/styles/corpus.scss
+++ b/sites/all/modules/figli/edlp_corpus/assets/styles/corpus.scss
@@ -16,3 +16,38 @@ canvas#corpus-map{
// width:100%; height:100%;
z-index:0;
}
+div.node-popup{
+ display:none;
+ position: absolute;
+ box-sizing: content-box;
+ width:140px; min-height: 30px;
+ pointer-events: none;
+
+ .inner{
+ padding:1em;
+ outline: 1px solid red;
+ background-color: white;
+ }
+
+ &:before{
+ content:"";
+ position: absolute;
+ bottom:-15px;left:-29px;
+ width: 30px; height:0;
+ border-top: 1px solid red;
+ transform: rotateZ(135deg);
+ }
+
+ &[pos="top-left"]{
+
+ }
+ &[pos="top-right"]{
+
+ }
+ &[pos="bottom-right"]{
+
+ }
+ &[pos="bottom-left"]{
+
+ }
+}
diff --git a/sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js b/sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js
index 827eb1c26..ec4d1373b 100644
--- a/sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js
+++ b/sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js
@@ -117,7 +117,7 @@ edlp_vars = {
};
function onAjaxLinkLoadError(jqxhr, textStatus, error, $link, sys_path){
- console.warn('fail : error', jqxhr.responseText);
+ console.warn('ajaxlink load failed', jqxhr.responseText);
$link.removeClass('ajax-loading');
_$body.removeClass('ajax-loading');
};
diff --git a/sites/all/themes/custom/edlptheme/assets/scripts/main.js b/sites/all/themes/custom/edlptheme/assets/scripts/main.js
index e099082ac..e17a5f6fa 100644
--- a/sites/all/themes/custom/edlptheme/assets/scripts/main.js
+++ b/sites/all/themes/custom/edlptheme/assets/scripts/main.js
@@ -94,7 +94,7 @@
};
function onAjaxLinkLoadError(jqxhr, textStatus, error, $link, sys_path){
- console.warn('fail : error', jqxhr.responseText);
+ console.warn('ajaxlink load failed', jqxhr.responseText);
$link.removeClass('ajax-loading');
_$body.removeClass('ajax-loading');
};