bachir/edlp_d8
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

corpus node popup done

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2018-03-06 13:51:00 +01:00
parent be9ee5fde2
commit 4c3c7c6577
8 changed files with 243 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/modules/figli/edlp_corpus/assets/dist/scripts/corpus.min.js
Vendored
+36 -22
View File
@@ -102,11 +102,11 @@
onCorpusLoaded(data);
})
.fail(function(jqxhr, textStatus, error){
onCorpusLoadError(jqxhr, textStatus, error, $link, sys_path);
onCorpusLoadError(jqxhr, textStatus, error);
});
};
function onCorpusLoadError(jqxhr, textStatus, error, $link, sys_path){
function onCorpusLoadError(jqxhr, textStatus, error){
console.warn('corpus load failed', jqxhr.responseText);
};
@@ -114,9 +114,9 @@
console.log('corpus loaded : data', data);
// console.log('first node', data.nodes[0]);
// buildParticles(data.nodes);
initNodePopup();
buildNodes(data.nodes);
initEvents();
initNodePopup();
startAnime();
};
@@ -180,6 +180,10 @@
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);
// if(this.id == '620'){
// _node_pop_up.setNode(this);
// }
// prototypes
if (typeof Node.initialized == "undefined") {
@@ -234,10 +238,9 @@
&& _m_pos.x < this.x + this.r
&& _m_pos.y > this.y - this.r
&& _m_pos.y < this.y + this.r){
if(_node_hover_id == -1 || _node_hover_id == this.id){
// console.log("Node hover", this.id);
if(_node_hover_id == -1 || _node_hover_id !== this.id){
console.log("Node hover", this.id);
this.hover = true;
// this.highlightEntries();
_node_hover_id = this.id;
_node_pop_up.setNode(this);
}
@@ -250,17 +253,6 @@
}
};
// 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
// clouleur aléatoire ds les entrees
@@ -439,26 +431,48 @@
if (typeof NodePopUp.initialized == "undefined") {
NodePopUp.prototype.setNode = function(n){
console.log('NodePopUp setNode()');
this.node = n;
// positioning NodePopUp regarding node position
this.setPositioning();
// update NodePopUp content
this.setContent();
};
NodePopUp.prototype.setPositioning = function(){
switch(true){
case n.x > n.wall_limits.right-350 && n.y < n.wall_limits.top+200:
case this.node.x > this.node.wall_limits.right-350 && this.node.y < this.node.wall_limits.top+200:
this.$dom.attr('pos', 'bottom-left');
break;
case n.x > n.wall_limits.right-350:
case this.node.x > this.node.wall_limits.right-350:
this.$dom.attr('pos', 'top-left');
break;
case n.y < n.wall_limits.top+200:
case this.node.y < this.node.wall_limits.top+200:
this.$dom.attr('pos', 'bottom-right');
break;
default:
this.$dom.attr('pos', 'top-right');
}
// update NodePopUp content
this.$content.html(this.node.title);
};
NodePopUp.prototype.setContent = function(){
// console.log(this.node);
this.$content.html('');
var $entrees = $('<div>').addClass('entrees');
for (var i = 0; i < this.node.entrees.length; i++) {
var tid = this.node.entrees[i];
$entrees.append($('<span>').addClass('entree').attr('tid', tid));
}
this.$content
.append($entrees)
.append('<h2 class="title">'+this.node.title+'</h2>')
.append('<section class="description">'+this.node.description+'</section>');
// TODO: favoris marker
};
NodePopUp.prototype.removeNode = function(){
console.log('NodePopUp removeNode()');
this.node = false;
};
sites/all/modules/figli/edlp_corpus/assets/dist/styles/corpus.min.css
Vendored
+2 -1
View File
@@ -17,7 +17,8 @@ div.node-popup {
min-height: 30px;
pointer-events: none;
top: 60%;
left: 30%; }
left: 30%;
pointer-events: none; }
div.node-popup .inner {
padding: 1em;
outline: 1px solid red;
sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js
+36 -22
View File
@@ -102,11 +102,11 @@
onCorpusLoaded(data);
})
.fail(function(jqxhr, textStatus, error){
onCorpusLoadError(jqxhr, textStatus, error, $link, sys_path);
onCorpusLoadError(jqxhr, textStatus, error);
});
};
function onCorpusLoadError(jqxhr, textStatus, error, $link, sys_path){
function onCorpusLoadError(jqxhr, textStatus, error){
console.warn('corpus load failed', jqxhr.responseText);
};
@@ -114,9 +114,9 @@
console.log('corpus loaded : data', data);
// console.log('first node', data.nodes[0]);
// buildParticles(data.nodes);
initNodePopup();
buildNodes(data.nodes);
initEvents();
initNodePopup();
startAnime();
};
@@ -180,6 +180,10 @@
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);
// if(this.id == '620'){
// _node_pop_up.setNode(this);
// }
// prototypes
if (typeof Node.initialized == "undefined") {
@@ -234,10 +238,9 @@
&& _m_pos.x < this.x + this.r
&& _m_pos.y > this.y - this.r
&& _m_pos.y < this.y + this.r){
if(_node_hover_id == -1 || _node_hover_id == this.id){
// console.log("Node hover", this.id);
if(_node_hover_id == -1 || _node_hover_id !== this.id){
console.log("Node hover", this.id);
this.hover = true;
// this.highlightEntries();
_node_hover_id = this.id;
_node_pop_up.setNode(this);
}
@@ -250,17 +253,6 @@
}
};
// 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
// clouleur aléatoire ds les entrees
@@ -439,26 +431,48 @@
if (typeof NodePopUp.initialized == "undefined") {
NodePopUp.prototype.setNode = function(n){
console.log('NodePopUp setNode()');
this.node = n;
// positioning NodePopUp regarding node position
this.setPositioning();
// update NodePopUp content
this.setContent();
};
NodePopUp.prototype.setPositioning = function(){
switch(true){
case n.x > n.wall_limits.right-350 && n.y < n.wall_limits.top+200:
case this.node.x > this.node.wall_limits.right-350 && this.node.y < this.node.wall_limits.top+200:
this.$dom.attr('pos', 'bottom-left');
break;
case n.x > n.wall_limits.right-350:
case this.node.x > this.node.wall_limits.right-350:
this.$dom.attr('pos', 'top-left');
break;
case n.y < n.wall_limits.top+200:
case this.node.y < this.node.wall_limits.top+200:
this.$dom.attr('pos', 'bottom-right');
break;
default:
this.$dom.attr('pos', 'top-right');
}
// update NodePopUp content
this.$content.html(this.node.title);
};
NodePopUp.prototype.setContent = function(){
// console.log(this.node);
this.$content.html('');
var $entrees = $('<div>').addClass('entrees');
for (var i = 0; i < this.node.entrees.length; i++) {
var tid = this.node.entrees[i];
$entrees.append($('<span>').addClass('entree').attr('tid', tid));
}
this.$content
.append($entrees)
.append('<h2 class="title">'+this.node.title+'</h2>')
.append('<section class="description">'+this.node.description+'</section>');
// TODO: favoris marker
};
NodePopUp.prototype.removeNode = function(){
console.log('NodePopUp removeNode()');
this.node = false;
};
sites/all/modules/figli/edlp_corpus/assets/styles/corpus.scss
+8
View File
@@ -16,6 +16,13 @@ canvas#corpus-map{
// width:100%; height:100%;
z-index:0;
}
// _ _ _ ___ _ _
// | \| |___ __| |___| _ \___ _ __| | | |_ __
// | .` / _ \/ _` / -_) _/ _ \ '_ \ |_| | '_ \
// |_|\_\___/\__,_\___|_| \___/ .__/\___/| .__/
// |_| |_|
div.node-popup{
// display:none;
// outline: 1px dotted green;
@@ -25,6 +32,7 @@ div.node-popup{
width:300px; min-height: 30px;
pointer-events: none;
top:60%; left:30%;
pointer-events: none;
.inner{
padding:1em;
sites/all/modules/figli/edlp_corpus/src/Controller/CorpusController.php
+19 -3
View File
@@ -17,6 +17,7 @@ class CorpusController extends ControllerBase {
*/
public function contentjson() {
// @see https://www.droptica.com/blog/drupal-8-restjson-integration-simple-javascript-application/
// @see https://www.sitepoint.com/drupal-8-version-entityfieldquery/
// @see https://www.frobiovox.com/posts/2016/03/28/simplify-drupal-8-field-value-calls.html
@@ -36,14 +37,26 @@ class CorpusController extends ControllerBase {
$nids = $query->execute();
$nodes = entity_load_multiple('node', $nids);
$view_builder = \Drupal::entityTypeManager()->getViewBuilder('node');
$nodes_data = [];
foreach ($nodes as $node) {
// this is ideal but it's too heavy to load : the whole ajax json goes from 138kb to 1.23Md (even optimized)...
// $node_builder = $view_builder->view($node, 'popup');
$entrees = [];
foreach ($node->get('field_entrees')->getValue() as $key => $term) {
$entrees[] = $term['target_id'];
}
$son_fid = $node->get('field_son')->getValue();
$description_values = $node->get('field_description')->getValue();
$description = count($description_values) ? $description_values[0]['value'] : "";
// dpm($description);
$field_son_values = $node->get('field_son')->getValue();
$son_fid = count($field_son_values) ? $field_son_values[0]['target_id'] : "";
// TODO: how to get this fucking file uri, fuck !!
// $son_file = $file_storage->load($fid);
// $son_file = File::load($son_fid);
@@ -51,13 +64,16 @@ class CorpusController extends ControllerBase {
// $son_uri = \Drupal\file\Entity\File::load($son_fid);//->getFileUri();
// $son_uri = file_create_url($node->get('field_son')->entity->getFileUri());
// TODO: favoris marker
$nodes_data[] = array(
"nid" => $node->get('nid')->getString(),
"title" => $node->get('title')->getString(),
"description" => $node->get('field_description')->getString(),
"description" => $description,
"entrees" => $entrees,
"son_fid" => $son_fid,
// "son" => $son_file,
"entrees" => $entrees,
// "popup_content" => render($node_builder), // trop lourd
);
}