Moja global: FLINT JSON User Interface

Hi Abhishek,
Happy to see that you work hard and party hard.
Nice to see that the great work keeps coming. Connecting two pieces of code is never easy, even in the best of times. So good luck this week.

1 Like

Week 11 of GSoC’20

GSoC’20 : Week-7 of Coding Period | Started Implementing layouts of different JSON Files

PR6: Integration of Tabbed Layout editor with Home Page, bug fixes

The PR is intended to integrate the already implemented Tabbed Layout with Home Page and minor bug fixes and change in coding practices like changing React prop drilling to Context API.

The Pending task is to integrate the new form-like editor with Tabbed Layout so as user can edit files in whichever mode they are interested to.

This week’s work

The week, I was working on creating a basic layout of the generic JSON files like localdomain.json, variables.json, pools.json etc. The work includes, getting inference about the key-value fields and easing the user experience, from the already created JSON files.

Discussion regarding layout of template JSON Editors

The issue is opened and will be used to discuss about the intricacies of the JSON files and the science behind them. For eg: there may be different choices for the FlintData configurations and getting a first-hand experience of the configurations is important to create the UI.

LocalDomain.json
The simulation shows creation of a LocalDomain.json based JSON file from scratch.

  • It shows key-value pairs on the left hand side and the corresponding JSON file updates on the right hand side, in real-time.

  • There are controls for deleting and adding new libraries.

  • There are also other controls like DatePicker or TextField for other JSON entries.

A live simulation of the project can be found at https://gsoc-abhi-147d7.web.app/ (Just choose the type of file at the right corner of the navgation bar)

Once the UI/UX is approved by @mfellows sir, it will be patched to main project.

moja global’s showcase

moja global showcased our month long progress on their blog. Thanks a lot @guy sir for reposting it in LinkedIn. It really helps us to showcase our work and widen our connections. :grinning:

Inclusion to moja global’s GitHub organisation

It means a lot to me for getting an invite to any open source community. Regular and meaningful contribution to any community is one thing, but then getting included to the community feels like joining a whole new family of great developers. :partying_face::partying_face:

Conclusion

This week has been an awesome headstart, first interacting with @mfellows sir and then implementing the ideas. I hope, the next week will be even more awesome, creating whole lot of a framework for creation of JSON files. Thank You!

This article can also be found at my personal blog.

1 Like

Week 12 of GSoC’20

GSoC’20 : Week-8 of Coding Period | Implemented template forms for JSON files

PR7: Initial layout of Form-like editors

This PR is intended to push the newly created form like editors for the file variants localdomain.json, variables.json, pools.json, modules.json.

A live simulation can be experienced at https://gsoc-abhi-147d7.web.app.

This week, I had been working on creating the UI of the form like editor, which can be regarded as the most interesting feature which is being built in the GSoC period and I can undoubtedly say that the users working with FLINT will also have the same opinion, after the software is rolled out to production.

I would like to share some of the illustrations which has been built over the week.

Illustartion of LocalDomain.json showing the basic fields

Illustartion of Variables.json showing the basic fields

Illustartion of preliminary version of Modules.json key-value pairs

  • User has provision to change key of any module.

  • Add Module and Delete Module feature has been provided.

This form is in development phase, it will be refined in a few weeks

Illustartion of Pools.json key-value pairs

moja global’s Technical Steering Committee meeting

We had a TSC meeting day before yesterday, where we had a lot of new members, both mentors and mentees across the globe. The agenda of the meeting was to come up with new ideas, features and functionality, which can be infused with existing moja global’s softwares, getting new contributors to contribute to the repositories and helping them to ease their onboarding process. This is an awesome new idea, to sustain the open source ecosystem, to help new-comers to feel comfortable and increase the reach of the organisation. All thanks to @guy sir for the awesome new initiatives.

This article can also be found at my personal blog.

1 Like

Hi Abhishek,
I love the excellent animations you are providing and the speed at which you are making progress. I tried the live simulation (I did not see the selector for the file type at first, :flushed:, but once I did, I was impressed by your JSON generator.)
Really well done.

1 Like

Hi Abhishek,
The reply above was still in response to your blog from last week. I am sorry, I am running behind.
Great additional features this week and the additions like DatePicker give a really professional feel to the UI. I am also looking forward to your suggestions on how to improve moja global software more generally.
Thank you for the great work.

1 Like

Week 13 of GSoC’20

GSoC’20 : Week-9 of Coding Period | Implemented template forms for JSON files and integrated tabbed layout with the template editors

Pending templates

As cited in the previous blog, the templates involving WriteVariableGeotiff like peatland_output_modules.json were to be implemented in this week, and so they are, implemented in this week. peatland_output_modules.json has a completely different structure of JSON tree, so it could not be punched to the simple modules.json template implemented in the previous work.

Illustartion of peatland_output_modules.json showing the fields specific to WriteVariableGeotiff and the settings.

  • The WriteVariableGeotiff section contains three basic fields, enabled, order and a library.

  • The settings key is a dynamic key consisting of multiple items in the form of an array.

  • Each object in the array is populated in the form of multiple cards.

  • Each card contains basic keys like enabled, variable_data_type etc.

  • The dynamic keys like variable_name, pools, flux are provisioned using a drop-down list. The changes in the choice of the keys is reflected in the JSON tree(right side of the page).

  • There is also a provision to delete a particular card, similar to deleting an element of an array.

Integration of the templates with the tabbed editor(built on Week9)

The implementation of the peatland_output_modules.json concludes the creation of templates(as of now), and I have started integrating the templates with the tabbed editor.

A preliminary glimse of the integration is shown below!
Illustartion of the preliminary integration

Phase II Evaluation

The Phase II evaluation is going to conclude tonight 11:59PM and I am really thrilled for the results! May the source be with me! :sweat_smile: Fingers Crossed :crossed_fingers:

This article can also be found at my personal blog.

2 Likes

Week 14 of GSoC’20

GSoC’20 : Week-10 of Coding Period | Passed Second Evaluation | Re-Implemented the modules variant for user ease

Passed Second Evaluation

Passed Second Evaluations

The second phase was really an exhilarating one, started off with ElectronJS and ended up with ReactJS to build web based prototypes for the app so as getting feedback for the app is super easy and a seamless procedure. The week started on with a great zeal and excitement, getting my second stipend.
Party Mode ON

Improvement in modules.json variant

The modules.json variant editor lacked a feature to edit the settings key-value pair. The user may need to input a string, an array, a boolean or an object for a corresponding key in the settings key.

  • The settings card offers user to choose a value type to be an array, string, boolean or object with the help of a drop-down menu.

  • As the object type can be a very complex structure, and it depends on the user, on how the settings is configured, the jsoneditor API(used in ScratchJSONEditor, developed in Week 8) is integrated with the editor.

  • The object can be edited in the new window.

Glimse of the modules.json variant

Working of modules.json variant

Other Implementations and Improvements

The other file variant’s editors are ready to be integrated with the tabbed editor. Once, the file operations of the editor is implemented, it can be surely said that the editor is ready to be shipped to the users.

This article can also be found at my personal blog.

2 Likes

Week 15 of GSoC’20

GSoC’20 : Week-11 of Coding Period | Integration of form like editors and Implementation of file operations

PR:8 Integration of form like editors to the tabbed layout

The implementation of the form templates was a difficult yet interesting job, but what was more engaging was, integrating the forms to the tabbed layout, giving users the feature to switch between tabs and edit any JSON file easily, either in Scratch mode or Form mode.

A glimse of the editor is given below.
ntegration of tabbed layout eith forms!

Implementation of File Operations for the form like editors

The file operations like reading a file from local directory and populating the data in the form was implemented in this week. Also, the save feature was implemented.

A save button is placed in the title bar which is used to save the current file in focus in the tabbed layout.


Also, keeping in mind, the ease of access for users, Ctrl+S accelerator is registered, so as users can easily save files from the keyboard. A SnackBar is also implemented which indicates if file is properly saved or not!


With the conclusion of this feature, it can be said that the main features of the project is completed, and maybe, some minor code refactoring or issues need to be addressed.

moja global TSC meeting

We had a meeting on Wednesday, mainly a discussion on the future aspects and sustenance of the projects, which also involved coining of new ideas. Also, it was the last meeting in the GSoC tenure, and we may not be able to engage ourselves completely into the projects, but I am really enthusiatic to extend my support to the newcomers who will take over the project and expand it to new horizons. Also, I will be always ready to redress any issue related to the project, as it has a different place in my heart, it provided me with lots of scope to learn new topics and concepts, which I may haven’t strived enough to learn without the zeal of the project.

Also we took a virtual group screenshot with the team members and mentors as a token of remembrance :heart: which I will surely post in my final blog. :grinning:

This article can also be found at my personal blog:

2 Likes

Week 16 of GSoC’20

GSoC’20 : Week-12 of Coding Period | Preparing for TouchDown | Documentation, Minor Fixes and Initiatives for sustenance of project

Documentation Updates

Currently, I am working on the documentation, penning down some of the important aspects of the App and GSoC’20 experience in all. The main topics which I am trying to cover in the docs(or you can say, an extended blog featuring my experience) are:

  • Introduction

  • Features Implemented and Relevant Pull Requests

  • Issues Opened

  • Tests

  • Features to be Implemented

  • Weekly Blogs and Standups

  • My Experience with moja global

  • Related Links(proposals, links to various APIs, frameworks used in the project)

Minor Fixes

There were minor issues like invocation of form-like editors from dashboard, which were resolved during the week.

Initiatives for sustenance of project

The two major initiatives which were taken to scale up the project are:

  • Initially, during the pre GSoC period, I had pitched an idea of creating a dashboard which can control the execution of FLINT, check if necessary libraries(like pip libraries or vcpkg) are installed for smooth functioning of FLINT. But with the recent developments of the projects, various projects can be infused to create an universal dashboard, which can trigger FLINT(docker images or the core software), initiate my project to create JSON files, and visualise rasters simultaneously from a single platform.

  • Also, I had pitched an idea of online storage facilities for JSON files, but as of now, the feature is not going to be included into the release, and will be shipped, once users of FLINT JSON Editor feels it to be an important one.

Also, I am thoroughly testing the app in this week, and will be putting up good-first-issues, which can be solved by new contributors.

This article can also be found at my personal blog:

2 Likes

Week 17 of GSoC’20

GSoC’20 : Week-13 of Coding Period | TouchDown Successful | Final Showdown

Introduction

So, as you all might be knowing that we are in the final stretch of the Google Summer of Code’20 coding period, mainly wrapping up the coding work and putting things at proper places in the codebase, and working on the docs, I will quickly jump to those aspects after discussing the week’s work!

We are in the endgame now

PR:9 Minor fixes, Packaging methods added!

This PR was made to add build methods for different platforms like Windows, Ubuntu, MacOS etc.

PR:10 Fixed minor bugs in OpenFile, OpenProject, feature updates!

This PR was made to fix some features like loading of files such as standard_gcbm_spinup.json, standard_gcbm_provider_config.json etc. which didn’t have properly implemented templates! The files will now be loaded in the ScratchJSONEditor.

New features like Home button is implemented which can be used to navigate to the landing page of the app from any particular location!

Also minor improvements in the UI for standard_gcbm_output_modules.json were made.

Documentation

I have been working on the final documentation for the last 4-5 days, which contains a gist of all the features which have been implemented in the coding period. The documentation can be found here!

I have also created a small video explaining the features of the project which will provide a glimse of the same.

Also, I have created the executables of the project, which can be used in platforms like Windows, Ubuntu, Fedora, MacOS etc, thanks to ElectronJS and its APIs.
The executables can be found at GitHub releases.

Epilogue

It’s been almost six months since I am working for moja global as a student developer, and if I were to describe my experience in one word, it was a mind-boggling one.

With, Google Summer of Code’20 coming to an end, I would like to take a small break from the daily contribution but would continue to work on the project as and when time permits!

And here goes some cherishable snaps, which I promised to share in Week15’s blog!

It was and always will be a great time working with the @project-mojaglobal l team, @abhineet97 , @partharora1010 and @sulay15399 . Though the online meetings and chats are cool, I hope, it will be a hell lot of fun when we meet in person! :wave::wave:

Lastly, I would like to thank @guy Janssen and @mfellows, you guys are awesome :grinning:! Thanks for providing me the opportunity to work with the awesome team and awesome projects which helped me a lot to learn new technologies, which I am sure, will help me a lot in future, to be a better programmer or developer. Also, I would like to thank @partner-dial for providing a great platform like DIAL Hub, which has helped me discover a new angle of blogger in me, and I plan to invest some time on my blogging skills in the post GSoC period :grinning:!

Thrilled for the final evaluation of GSoC’20. :rocket::rocket:

Signing off,

Abhishek Garain :writing_hand:

This article can also be found at my personal blog.

4 Likes