Skip to content

Commit 924e21c

Browse files
committed
Report Updated
1 parent 92d2a0b commit 924e21c

1 file changed

Lines changed: 45 additions & 35 deletions

File tree

gsoc/README.md

Lines changed: 45 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,75 +1,85 @@
1-
# Google Summer of Code 2024 project report
1+
# Google Summer of Code 2024 Project Report
22

33
## Proposal Link
44
[AIIDA-GOOGLE SUMMER OF CODE 2024](https://docs.google.com/document/d/1VQOJ9eUC1KmGdjK3tjwNfsAXz1ttTVwR7MdOs2SziRA/edit?usp=sharing)
55

6-
## Github Repo
6+
## GitHub Repository
77
[aiida-explorer](https://github.com/aiidateam/aiida-explorer)
88

9-
### **Mentors:**
10-
- **Kristjan Eimre**
11-
- **Edan Bainglass**
12-
- **Xing Wang**
13-
- **Jusong Yu**
9+
### Mentors:
10+
- Kristjan Eimre
11+
- Edan Bainglass
12+
- Xing Wang
13+
- Jusong Yu
1414

1515
---
1616

17-
## **Project Overview**
17+
## Project Overview
1818

19-
The objective of this project is to develop an **intuitive tool in React** for browsing **AiiDA graphs**, effectively replacing the **outdated AiiDA Provenance Browser** currently used in **Materials Cloud Explore**.
19+
The goal of this project is to build an easy-to-use tool in React for exploring AiiDA graphs. This tool will replace the old AiiDA Provenance Browser currently used in Materials Cloud Explore.
2020

21-
This new tool will interface seamlessly with AiiDA via a **REST API**, allowing users to:
21+
The new tool connects smoothly with AiiDA using a REST API, and it lets users:
2222

23-
- **Dynamically explore graphs.**
24-
- **Clearly differentiate between input and output nodes.**
25-
- **Fully visualize all connecting nodes.**
26-
- **Preview node details without the need for page redirection.**
23+
- Explore graphs interactively.
24+
- Easily see the difference between input and output nodes.
25+
- View all the nodes connected to each other.
26+
- Check out node details without needing to open a new page.
2727

28-
The end goal is to create an **AiiDA node graph viewer** that is both robust and user-friendly, which will be developed in React and potentially published as a reusable component on the npm repository**.
28+
The final aim is to create a strong and user-friendly AiiDA node graph viewer. This viewer is being built with React and might even be published as a reusable component on the npm repository.
2929

3030
---
3131

32-
## **Key Improvements Compared to Previous Version**
32+
## Key Improvements Compared to the Previous Version
3333

34-
- **Modernized User Interface:**
35-
- Upgraded the existing interface from **AngularJS to React**, providing a more **streamlined** and **responsive experience**.
34+
- **Updated User Interface:**
35+
- The old interface was built with angular.js. We have now upgraded it to React, which makes the tool look and feel smoother and more responsive.
3636

37-
- **Enhanced Functionality:**
38-
- Added new features that were missing in the previous implementation, ensuring a more **comprehensive tool for users**.
37+
- **Better Features:**
38+
- We've added new functions that were missing in the old version, so now users can do more with this tool.
3939

40-
- **Increased Node Threshold:**
41-
- Expanded the node display limit to handle **larger and more complex graphs effectively**.
40+
- **Can Handle Larger Graphs:**
41+
- The tool can now display more nodes at once, which is helpful for working with bigger and more complex graphs.
4242

4343
---
4444

45-
## **Project Outcome**
45+
## Project Outcome
4646

47-
### **Node Grid Component:**
47+
### Node Grid Component:
4848
![Node Grid](images/grid.png "Grid")
4949

50-
The **Node Grid Component** lets you **select the type of Node** you want to explore. Once a type is selected, you can view all possible options available under that category.
50+
The Node Grid Component allows users to explore nodes by their types. Here’s what it can do:
5151

52-
### **Node Details Page:**
52+
- **Filter by Node Type:** You can choose to see only certain types of nodes, like data nodes, process nodes, or computer nodes.
53+
- **Sort Nodes:** You can sort the nodes based on different fields.
54+
- **Filter Section and Table:** On the left side of the image, you see the filter options. On the right side, there's a table that lists all the nodes that match the filter.
55+
- **Details Button:** Each node in the table has a button that takes you to the Node Details Page (described below).
56+
57+
### Node Details Page:
5358

5459
![Node Details](images/Details.png "Details Page")
5560

56-
This page displays **detailed information** about the selected Node. If the selected Node has **visualization capabilities**, it can be viewed in the **Rich View**.
61+
The Node Details Page shows all the important information about a node. You can view the node’s details in two ways: as raw data or in a rich view.
5762

58-
- **Left Side:** Shows detailed node information.
59-
- **Right Side:** Contains the **main graph component** which helps in visualizing the Node structure and related Nodes. They are arranged in a way that helps to **better segregate** them.
63+
- **Left Side:** This part of the page shows all the node’s details, like general information, attributes, and extra data.
64+
- **Right Side:** This part contains a graph that shows how the selected node is connected to other nodes. The nodes are arranged to make it easy to see different types of connections. If you click on another node in this graph, it will open that node's detail page.
6065

61-
### **Statistics Section:**
66+
### Statistics Section:
6267

6368
![Statistics](images/Statistics.png "Statistics Page")
6469

65-
The **Statistics** also contains statistics about the selected Node, providing relevant information depending on the users who created those nodes.
70+
The Statistics section shows data about the AiiDA database, including general information about the nodes and details about the users who created them.
6671

6772
---
6873

69-
## **Future Goals**
74+
## Future Outlook
7075

71-
As of now, our implementation supports the **local provenance view**. Looking ahead, we’re planning to introduce the **global provenance view**.
76+
### Current Functionality:
77+
Right now, the tool works well for looking at the local provenance view (the view that shows how nodes are connected within a small area). However, there are still some issues:
7278

73-
This broader perspective will allow you to **visualize interconnected nodes** on a larger scale, rather than focusing solely on a **small subset of nodes**.
79+
- **Graph Browser Bugs:** Sometimes the connections between nodes appear from the wrong side.
80+
- **Data Loading Issues:** Occasionally, the data doesn’t load correctly.
7481

75-
---
82+
### Future Goals:
83+
In the future, we plan to add a global provenance view. This new feature will allow users to see how nodes are connected on a larger scale, not just within a small area.
84+
85+
---

0 commit comments

Comments
 (0)