|
@@ -21,8 +21,13 @@
|
|
|
let entities = {};
|
|
|
[...$form_entities].forEach($entity => {
|
|
|
console.log($entity);
|
|
|
+ let ajax_new_content = $entity.classList.contains('ajax-new-content');
|
|
|
+ if(ajax_new_content){
|
|
|
+ // its a new paragraph just added by ajax
|
|
|
+ $entity = $entity.querySelector(':scope>div');
|
|
|
+ }
|
|
|
+
|
|
|
let id = $entity.getAttribute('id');
|
|
|
- let $title = $entity.querySelector('.paragraphs-subform>.field--type-entity-reference.field--name-field-entite td.inline-entity-form-node-label');
|
|
|
let $af = $entity.querySelector('.paragraphs-subform .field--name-field-actuel-future');
|
|
|
let $p = $entity.querySelector('.paragraphs-subform .field--name-field-prise input');
|
|
|
let $mm = $entity.querySelector('.paragraphs-subform .field--name-field-menace-maintien-degres input');
|
|
@@ -32,8 +37,8 @@
|
|
|
id: id
|
|
|
},
|
|
|
title: {
|
|
|
- $dom: $title,
|
|
|
- value: $title.textContent
|
|
|
+ $dom: null,
|
|
|
+ value: null
|
|
|
},
|
|
|
af: {
|
|
|
$dom: $af,
|
|
@@ -48,6 +53,17 @@
|
|
|
value: parseFloat($mm.value)
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ // title does not exists when we add an "entité intégrée" as we also have to create the referenced node
|
|
|
+ let $title = $entity.querySelector('.paragraphs-subform>.field--type-entity-reference.field--name-field-entite td.inline-entity-form-node-label');
|
|
|
+ if ($title) {
|
|
|
+ e.title= {
|
|
|
+ $dom: $title,
|
|
|
+ value: $title.textContent
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
entities[id] = e;
|
|
|
});
|
|
|
console.log(entities);
|
|
@@ -120,18 +136,18 @@
|
|
|
updateCreateEntities(entities){
|
|
|
// console.log('Class Boussole update entities', entities);
|
|
|
for (const [id, values] of Object.entries(entities)) {
|
|
|
- // console.log(id, typeof this.entities[id], values);
|
|
|
+ console.log(id, typeof this.entities[id], values);
|
|
|
if (typeof this.entities[id] === 'undefined') {
|
|
|
this.entities[id] = new Entity(this.$boussole, id, values);
|
|
|
}else{
|
|
|
- this.entities[id].updateValues(values);
|
|
|
+ this.entities[id].updateValuesFromForm(values);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
updateEntities(){
|
|
|
for (const [id, entity] of Object.entries(this.entities)) {
|
|
|
- entity.update();
|
|
|
+ entity.updatePos();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -158,12 +174,30 @@
|
|
|
this.$e = document.createElement('div');
|
|
|
this.$e.classList.add('entity');
|
|
|
this.$e.setAttribute('id', `${this.id}-boussole-point`);
|
|
|
- this.$e.setAttribute('title', this.values.title.value);
|
|
|
+ if (this.values.title.value) {
|
|
|
+ // the paragraph as an entity referenced
|
|
|
+ this.$e.setAttribute('title', this.values.title.value);
|
|
|
+ }else{
|
|
|
+ // new paragraph with no entity referenced
|
|
|
+ this.$e.classList.add('ajax-new');
|
|
|
+ }
|
|
|
+
|
|
|
this.$container.append(this.$e);
|
|
|
console.log(this.$e);
|
|
|
this.updatePos();
|
|
|
this.initDraggable()
|
|
|
}
|
|
|
+
|
|
|
+ updateDomElemt(){
|
|
|
+ if (this.values.title.value) {
|
|
|
+ // the paragraph as an entity referenced
|
|
|
+ this.$e.setAttribute('title', this.values.title.value);
|
|
|
+ this.$e.classList.remove('ajax-new');
|
|
|
+ }else{
|
|
|
+ // new paragraph with no entity referenced
|
|
|
+ this.$e.classList.add('ajax-new');
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
initDraggable(){
|
|
|
this.$e.setAttribute('draggable', true);
|
|
@@ -193,10 +227,10 @@
|
|
|
dropedOnBoussole(data){
|
|
|
this.$e.style.left = data.clientX + data.dragging_start_x + 'px';
|
|
|
this.$e.style.top = data.clientY + data.dragging_start_y + 'px';
|
|
|
- this.updateValuesFromBoussole();
|
|
|
+ this.updateFormValuesFromBoussole();
|
|
|
}
|
|
|
|
|
|
- updateValuesFromBoussole(){
|
|
|
+ updateFormValuesFromBoussole(values){
|
|
|
let compstyle = window.getComputedStyle(this.$e);
|
|
|
// AF
|
|
|
let top = parseInt(compstyle.top);
|
|
@@ -240,8 +274,16 @@
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+ updateValuesFromForm(values){
|
|
|
+ this.values = values;
|
|
|
+ this.updateDomElemt();
|
|
|
+ }
|
|
|
+
|
|
|
updatePos(){
|
|
|
console.log('update pos');
|
|
|
+
|
|
|
+ this.updateSceneSize()
|
|
|
+
|
|
|
// converte degres to radian, inverse it and rotate it
|
|
|
let a = parseInt((this.values.mm.value) * -1 + 90) * (Math.PI/180);
|
|
|
// https://stackoverflow.com/questions/5731863/mapping-a-numeric-range-onto-another
|
|
@@ -268,11 +310,6 @@
|
|
|
this.$e.style.top = top+'px';
|
|
|
}
|
|
|
|
|
|
- update(){
|
|
|
- console.log('Entity update');
|
|
|
- this.updateSceneSize()
|
|
|
- this.updatePos()
|
|
|
- }
|
|
|
|
|
|
}
|
|
|
|