Skip to content

Commit

Permalink
Family Tree: Add new founder.
Browse files Browse the repository at this point in the history
  • Loading branch information
spitfire305 committed Feb 27, 2024
1 parent ed68b8d commit e3fc392
Show file tree
Hide file tree
Showing 3 changed files with 85 additions and 6 deletions.
5 changes: 5 additions & 0 deletions app/Services/Families/FamilyTreeService.php
Original file line number Diff line number Diff line change
Expand Up @@ -406,6 +406,7 @@ protected function texts(): array
'reset' => __('families/trees.actions.reset'),
'save' => __('families/trees.actions.save'),
'first' => __('families/trees.actions.first'),
'founder' => __('families/trees.actions.founder'),
],
'modals' => [
'clear' => [
Expand All @@ -430,6 +431,9 @@ protected function texts(): array
'child' => [
'title' => __('families/trees.modals.entity.child.title'),
],
'founder' => [
'title' => __('families/trees.modals.entity.founder.title'),
],
'remove' => [
'title' => __('crud.remove'),
'confirm' => __('families/trees.modals.entity.remove.confirm'),
Expand All @@ -445,6 +449,7 @@ protected function texts(): array
'css' => __('dashboard.widgets.fields.class'),
'colour' => __('crud.fields.colour'),
'unknown' => __('families/trees.modals.relations.unknown'),
'founder' => __('families/trees.modals.entity.add.founder'),
'visibility' => [
'title' => __('crud.fields.visibility'),
'all' => __('crud.visibilities.all'),
Expand Down
5 changes: 5 additions & 0 deletions lang/en/families/trees.php
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
'rename-relation' => 'Rename relation',
'reset' => 'Discard changes',
'save' => 'Save',
'founder' => 'Add a new founder',
],
'modal' => [
'first-title' => 'Select an entity',
Expand All @@ -23,6 +24,7 @@
'member' => 'Member',
'success' => 'Entity added.',
'title' => 'Add an entity',
'founder' => 'Founder',
],
'child' => [
'success' => 'Child added.',
Expand All @@ -37,6 +39,9 @@
'confirm' => 'Are you sure you want to remove this entity from the family tree?',
'success' => 'Entity removed.',
],
'founder' => [
'title' => 'Add a new founder',
],
],
'relations' => [
'add' => [
Expand Down
81 changes: 75 additions & 6 deletions resources/js/components/families/FamilyTree.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@
<i class="fa-solid fa-edit" aria-hidden="true"></i>
{{ this.texts.actions.edit }}
</button>
<a class="btn2 btn-ghost btn-sm " v-if="isEditing" v-on:click="createNewFounder()">
<i class="fa-solid fa-user" aria-hidden="true"></i>
{{ this.texts.actions.founder }}
</a>
<a class="btn2 btn-ghost btn-sm " v-if="isEditing" v-on:click="resetTree()">
<i class="fa-solid fa-redo" aria-hidden="true"></i>
{{ this.texts.actions.reset }}
Expand Down Expand Up @@ -68,6 +72,7 @@
<h4 v-else-if="isEditingEntity">{{ this.texts.modals.entity.edit.title }}</h4>
<h4 v-else-if="isAddingRelation">{{ this.texts.modals.relation.add.title }}</h4>
<h4 v-else-if="isEditingRelation">{{ this.texts.modals.relation.edit.title }}</h4>
<h4 v-else-if="isAddingNewFounder">{{ this.texts.modals.entity.founder.title }}</h4>

<button autofocus type="button" class="text-xl opacity-50 hover:opacity-100 focus:opacity-100 cursor-pointer text-decoration-none" aria-label="Close" v-on:click="closeModal()">
<i class="fa-regular fa-circle-xmark" aria-hidden="true"></i>
Expand All @@ -76,7 +81,11 @@
</header>
<article>
<div class="flex flex-col gap-5 w-full">
<div class="field field-character flex flex-col gap-1 w-full" v-show="isAddingRelation || isAddingChild || isEditingEntity || isAddingCharacter">
<div class="field field-founder flex flex-col gap-1 w-full" v-show="isAddingNewFounder">
<label>{{ this.texts.modals.fields.founder }}</label>
<select class="select2 w-full" style="width: 100%" v-bind:data-url="this.search_api" data-placeholder="Choose a character" data-language="en" data-allow-clear="true" name="founder_id_ft" data-dropdown-parent="#family-tree-modal" tabindex="-1" aria-hidden="true"></select>
</div>
<div class="field field-character flex flex-col gap-1 w-full" v-show="isAddingRelation || isAddingChild || isEditingEntity || isAddingCharacter || isAddingNewFounder">
<label>{{ this.texts.modals.fields.character }}</label>
<select class="select2 w-full" style="width: 100%" v-bind:data-url="this.search_api" data-placeholder="Choose a character" data-language="en" data-allow-clear="true" name="character_id_ft" data-dropdown-parent="#family-tree-modal" tabindex="-1" aria-hidden="true"></select>
</div>
Expand All @@ -90,8 +99,8 @@
</ul>
</div>
</div>
<div class="flex flex-col gap-5 w-full" v-show="isEditingRelation || isAddingRelation || isAddingChild || isEditingEntity">
<div v-if="isAddingRelation || isEditingEntity" class="field field-unknown checkbox flex flex-col gap-1">
<div class="flex flex-col gap-5 w-full" v-show="isEditingRelation || isAddingRelation || isAddingChild || isEditingEntity || isAddingNewFounder">
<div v-if="isAddingRelation || isEditingEntity || isAddingNewFounder" class="field field-unknown checkbox flex flex-col gap-1">
<label>
<input type="checkbox" v-model="isUnknown" id="family_tree_unknown" name="isUnknown" value="isUnknown" />
{{ this.texts.modals.fields.unknown }}
Expand All @@ -104,7 +113,7 @@
<input v-model="relation" type="text" maxlength="70" class="w-full" id="family_tree_relation" @keyup.enter="saveModal()"/>
</div>

<div class="grid grid-cols-2 gap-5" v-show="isAddingRelation || isAddingChild || isEditingEntity">
<div class="grid grid-cols-2 gap-5" v-show="isAddingRelation || isAddingNewFounder || isAddingChild || isEditingEntity">
<div class="field field field-colour flex flex-col gap-1">
<label>{{ this.texts.modals.fields.colour }}</label>
<div>
Expand Down Expand Up @@ -174,6 +183,7 @@ export default {
isEditingEntity: false,
isAddingCharacter: false,
isEditingRelation: false,
isAddingNewFounder: false,
relation: undefined,
entity: undefined,
Expand All @@ -187,6 +197,7 @@ export default {
colourField: 'input[name="colour"]',
modal: 'family-tree-modal',
founderField: 'select[name="founder_id_ft"]',
entityField: 'select[name="character_id_ft"]',
newUuid: 1,
}
Expand Down Expand Up @@ -264,6 +275,7 @@ export default {
this.isEditingRelation = false;
this.isEditingEntity = false;
this.isAddingCharacter = false;
this.isAddingNewFounder = false;
this.currentUuid = undefined;
this.relation = undefined;
this.cssClass = undefined;
Expand All @@ -274,6 +286,7 @@ export default {
window.closeDialog(this.modal);
$(this.entityField).val(null).trigger('change');
$(this.founderField).val(null).trigger('change');
},
showDialog() {
window.openDialog(this.modal);
Expand All @@ -286,6 +299,7 @@ export default {
this.isEditingRelation = false;
this.isEditingEntity = false;
this.isAddingCharacter = false;
this.isAddingNewFounder = false;
this.currentUuid = undefined;
this.relation = undefined;
this.cssClass = undefined;
Expand All @@ -296,6 +310,7 @@ export default {
window.closeDialog(this.modal);
$(this.entityField).val(null).trigger('change');
$(this.founderField).val(null).trigger('change');
},
saveSuggestion: function(character) {
this.emitter.emit('saveModal', [character]);
Expand All @@ -312,6 +327,8 @@ export default {
this.editEntity();
} else if(this.isAddingCharacter) {
this.editEntity(character);
} else if(this.isAddingNewFounder) {
this.addFounder();
}
},
showCreateNode() {
Expand All @@ -326,6 +343,11 @@ export default {
this.currentUuid = 0;
this.showDialog();
},
createNewFounder() {
this.isAddingNewFounder = true;
this.currentUuid = 0;
this.showDialog();
},
editRelation() {
this.isDirty = true;
//console.log('edit relation', this.currentUuid, this.relation);
Expand Down Expand Up @@ -439,7 +461,7 @@ export default {
this.nodes = this.nodes.reduce(getRelationNodes, []);
},
addChild() {
console.log('child');
//console.log('child');
let entity_id = $(this.entityField).val();
if (!entity_id) {
// Nothing, ignore
Expand Down Expand Up @@ -519,6 +541,47 @@ export default {
this.closeModal();
});
},
addFounder() {
let founder_id = $(this.founderField).val();
let entity_id = $(this.entityField).val();
if (!founder_id || !entity_id) {
// Nothing, ignore
this.closeModal();
return;
}
let url2 = this.entity_api.replace('/0', '/' + entity_id);
axios.get(url2).then((res) => {
let entity = res.data;
this.addFounderEntity(entity);
this.isDirty = true;
});
let url = this.entity_api.replace('/0', '/' + founder_id);
axios.get(url).then((res) => {
let entity = res.data;
this.addFounderEntity(entity, true);
window.showToast(this.texts.toasts.entity.add);
this.isDirty = true;
this.closeModal();
});
},
addFounderEntity(entity, isFounder = false) {
this.entities[entity.id] = Object.freeze(entity);
//If its founder add the other nodes as relations
if (isFounder == true) {
this.nodes = [{entity_id: entity.id, role: this.relation, cssClass: this.cssClass, colour: this.colour, visibility: this.visibility, uuid: JSON.stringify(this.newUuid), relations: this.nodes}];
} else {
//If its the relation to the founder add as children
this.nodes = [{entity_id: entity.id, role: this.relation, cssClass: this.cssClass, colour: this.colour, visibility: this.visibility, uuid: JSON.stringify(this.newUuid), children: this.nodes, isUnknown: this.isUnknown}];
}
this.newUuid++;
},
addEntity(entity) {
this.entities[entity.id] = Object.freeze(entity);
this.nodes.push({entity_id: entity.id, role: this.relation, cssClass: this.cssClass, colour: this.colour, visibility: this.visibility, uuid: JSON.stringify(this.newUuid)});
Expand Down Expand Up @@ -648,7 +711,7 @@ export default {
this.showDialog();
});
this.emitter.on('editRelation', (data) => {
console.log(data.relation);
//console.log(data.relation);
this.resetVariables();
this.currentUuid = data.uuid;
this.relation = data.relation.role;
Expand All @@ -666,6 +729,12 @@ export default {
this.isAddingChild = true;
this.showDialog();
});
this.emitter.on('addFounder', (uuid) => {
this.resetVariables();
this.showDialog();
});
this.emitter.on('trackX', (x) => {
if (x > this.maxX) {
this.maxX = x;
Expand Down

0 comments on commit e3fc392

Please sign in to comment.