klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2024-10-18 12:58:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use new typescript api for user graphs

Browse Source
This commit is contained in:
Antoine Bartuccio 2024-10-09 17:16:48 +02:00
parent a98c924b24
commit 37f62e15cf
2 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
core/static/webpack/user/family-graph-index.js
View File

@ -1,16 +1,26 @@
import cytoscape from "cytoscape"; import cytoscape from "cytoscape";
import cxtmenu from "cytoscape-cxtmenu"; import cxtmenu from "cytoscape-cxtmenu";
import klay from "cytoscape-klay"; import klay from "cytoscape-klay";
import { familyGetFamilyGraph } from "#openapi";
cytoscape.use(klay); cytoscape.use(klay);
cytoscape.use(cxtmenu); cytoscape.use(cxtmenu);
async function getGraphData(url, godfathersDepth, godchildrenDepth) { async function getGraphData(userId, godfathersDepth, godchildrenDepth) {
const data = await ( const data = (
await fetch( await familyGetFamilyGraph({
`${url}?godfathers_depth=${godfathersDepth}&godchildren_depth=${godchildrenDepth}`, path: {
) // biome-ignore lint/style/useNamingConvention: api is snake_case
).json(); user_id: userId,
},
query: {
// biome-ignore lint/style/useNamingConvention: api is snake_case
godfathers_depth: godfathersDepth,
// biome-ignore lint/style/useNamingConvention: api is snake_case
godchildren_depth: godchildrenDepth,
},
})
).data;
return [ return [
...data.users.map((user) => { ...data.users.map((user) => {
return { data: user }; return { data: user };
@ -160,8 +170,7 @@ function createGraph(container, data, activeUserId) {
/** /**
* @typedef FamilyGraphConfig * @typedef FamilyGraphConfig
* @param {string} apiUrl Base url for fetching the tree as a string * @param {number} activeUser Id of the user to fetch the tree from
* @param {string} activeUser Id of the user to fetch the tree from
* @param {number} depthMin Minimum tree depth for godfathers and godchildren * @param {number} depthMin Minimum tree depth for godfathers and godchildren
* @param {number} depthMax Maximum tree depth for godfathers and godchildren * @param {number} depthMax Maximum tree depth for godfathers and godchildren
**/ **/
@ -248,7 +257,7 @@ window.loadFamilyGraph = (config) => {
async fetchGraphData() { async fetchGraphData() {
this.graphData = await getGraphData( this.graphData = await getGraphData(
config.apiUrl, config.activeUser,
this.godfathersDepth, this.godfathersDepth,
this.godchildrenDepth, this.godchildrenDepth,
); );

3
core/templates/core/user_godfathers_tree.jinja
View File

@ -92,8 +92,7 @@
<script> <script>
window.addEventListener("DOMContentLoaded", () => { window.addEventListener("DOMContentLoaded", () => {
loadFamilyGraph({ loadFamilyGraph({
apiUrl: "{{ api_url }}", activeUser: {{ object.id }},
activeUser: "{{ object.id }}",
depthMin: {{ depth_min }}, depthMin: {{ depth_min }},
depthMax: {{ depth_max }}, depthMax: {{ depth_max }},
}); });