GSOC 2021 PSF PyAr Final code submission PyZombis Angela Remolina

Final Code Submission

Hello to all readers! My name is Angela Remolina, I took part of GSOC 2021 with the organization: Python Software Foundation and the suborganization Python Argentina. This document has the records of everything that was accomplished by me during Google Summer of Code 2021 for the PyZombis project.

What was proposed

I proposed two milestones to improve the PyZombis course that were mostly accomplished.

1. Build a Brython module from Runestone (that is the main tool to build the PyZombis course) that would help to implement advance exercises, such as GUI exercises, games and more.
2. Enhance the frontend and the UX/UI in general.

What was done

From what was originally proposed I accomplished:

From the first milestone

• The Brython module was built from Runestone, that is why I had to make my own Runestone fork and change the requirements in PyZombis to my fork. Here is the commit.
• Inside this fork I made the whole brython module.
  • This JavaScript class: activecode_brython.js was created to function as an activecode directive.
  • These other files were edited to get the previous class to work.
  • A console was added to this brython so outputs were visible onscreen. First commit to this update
  • The next upcoming commits after that one were updates on the styling of these components.
• I wanted this module to be accepted into Runestone so PyZombis wouldn't have to use my fork as a requirement reference so I opened a PR proposing the final Brython module and to this date is still opened. Here is the PR.

Final result:

In the gif above you can see an activecode block working with Brython syntax.

From the second milestone

• Instead of showing only code blocks that explains what to do, and interactive interpreter was implemented so students could use it: this is the PR.

• I deleted repeated content, added some new one and fixed some problems on the matter of images, tables, static code, and titles. Here are some commits refering to this task:

  • HTML styling for lecture TWP30: commit
  • Table from lecture TWP10: commit
  • Change code screenshot to codeblock from lecture TWP38: commit
  • There are more examples of these changes in other lectures.

• I divided all lectures in the course into smaller sublectures. That way, when a student enters a lecture is not overwhelmed by a lot of content. Here is an example of lecture TWP56 that was divided into 3 sublectures: commit. This same procedure was done with all lectures of the course.

Final result:

In the gif above you can see:

• An introduction video that was added in the index page.
• The interactive interpreter added for the first lecture.
• The division structure for one of the lectures that has 5 sublectures.

What was left to do

• I proposed a division so the menu on the index page look smaller from (41 subsections into 4) and also changing the style of blue hyperlinks to buttons. However this is still under discussion with my mentors. Here is the PR I opened for this change.
• Some of the advance lectures still have code screenshots instead of interactive content. For instance, the lecture of databases: TWP42: Bases de datos that I was in charged of could not be concluded. I tried 3 alternatives to refactor this lecture (1, 2 and 3) but I ran out of time to fix it, however I left an issue with detail information of what was attempted to do. That way a future collaborator of PyZombis will be able to continue my work. Here is the issue.

These were the 3 alternatives:

1. Using the activecode SQL languge from Runestone: https://github.com/PyAr/PyZombis/pull/185 Some configuration to use this SQL tool from Runestone must be done, because when you try to access the file surf.db, a CORS error shows up in console and nothing is shown. There might be something related with the book not being served by Runestone because in this error it tries to access to the db from an URL in runestone site: /runestone/books/published/PyZombis/_static/sql-wasm.wasm asuming that the book is published.

2. Using sql.js library from javascript: https://github.com/PyAr/PyZombis/pull/184 This other option loads the database using the .. raw:html instruction from runestone. This is the best attempt since you need to find a way to access to the global javascript variable db from the brython activecode block. Enter this PR for more detail, but if you call db in browser console you can see the database.

3. With indexedDB: https://github.com/PyAr/PyZombis/pull/171 This aproach works, but the syntax changes a lot from the original lecture where sqlite3 was used.

For example:

cursor.execute("select * from surfers  where age > 25")
linhas = cursor.fetchall()
for linha in linhas:
    print("id :",linha['id'])
    print("Nombre :",linha['name'])
    print("Pais  :",linha['country'])
    print("Media  :",linha['average'])
    print("Estilo :",linha['board'])
    print("Edad  :",linha['age'])
    print()

had to change to:

if(getattr(v, "edad") >=25):
    for key in ["nombre", "pais", "media", "estilo", "edad"]:
        print(f"{key}: {getattr(v, key)}")
  getattr(res, "continue")()

It is not a friendly syntax for new students that are learning this for the first time.

General summary

• Contrubution directly to PyZombis: commit history.
• Contribution from Runestone to PyZombis: commit history.
• Here is my weekly blog for Python where I tracked week by week the advances and changes I was making: My blog

Git log table to PyZombis master:

The next table is a summary of the result of the git log with the most important commits to PyZombis master, to get the full commit report do:

git log --pretty=format:"| %h | %as | %<(50)%s | " --shortstat [email protected] [email protected]

Commit	Date	Summary	Stats
79512e33	2021-08-15	test Q9->Q8	3 files changed, 11 insertions(+), 11 deletions(-)
78ab51ba	2021-08-15	rename quiz 9 to quiz 8	1 file changed, 0 insertions(+), 0 deletions(-)
7f44c8e5	2021-08-15	tab and ac ids for quiz 9 to quiz 8	1 file changed, 12 insertions(+), 12 deletions(-)
617fe514	2021-08-04	split TWP65	6 files changed, 228 insertions(+), 285 deletions(-)
--------	----------	Split lectures from TWP42 to TWP65	---------------------------
375deb9e	2021-07-30	split TWP42	5 files changed, 135 insertions(+), 143 deletions(-)
--------	----------	Split lectures from TWP05 to TWP40	---------------------------
c69f1f14	2021-07-23	Update activecode and codelens ids	4 files changed, 5 insertions(+), 5 deletions(-)
931ecc2a	2021-07-21	activecode and codelens ids	9 files changed, 27 insertions(+), 26 deletions(-)
d3a87d37	2021-07-20	split lecture TWP05	19 files changed, 719 insertions(+), 730 deletions(-)
dd03736e	2021-07-19	Review fixes	3 files changed, 12 insertions(+), 10 deletions(-)
eec26d3e	2021-07-17	add keywords activecode	10 files changed, 27 insertions(+), 17 deletions(-)
f23ec9ee	2021-07-16	update_playwright_test	3 files changed, 18 insertions(+), 3 deletions(-)
023e8cdd	2021-07-15	Styling title	1 file changed, 9 insertions(+), 5 deletions(-)
450eecae	2021-07-14	center-video	1 file changed, 12 insertions(+)
eef2128b	2021-07-13	Add intro video	1 file changed, 7 insertions(+), 9 deletions(-)
da85a2b7	2021-07-11	Translation mistake on TWP05	1 file changed, 5 insertions(+), 4 deletions(-)
fe280f29	2021-07-10	Test for TWP38 exercise	1 file changed, 27 insertions(+), 44 deletions(-)
97383f14	2021-07-10	Change screenshots on TWP33 and TWP38.	12 files changed, 93 insertions(+), 232 deletions(-)
b73a8de0	2021-07-10	Update TWP30.rst	1 file changed, 57 insertions(+), 96 deletions(-)
7ec494ba	2021-07-09	Table and repeated titles	3 files changed, 39 insertions(+), 89 deletions(-)
85a50dba	2021-07-08	Scroll to top	1 file changed, 15 insertions(+), 5 deletions(-)
23ad232c	2021-07-08	Extra interpreter and redaction fix	1 file changed, 15 insertions(+), 4 deletions(-)
ce64d924	2021-06-07	General navigation test with playwright	2 files changed, 14 insertions(+)
e7f8be6e	2021-05-22	Fixing bugs on lectures TWP05.rst and TWP25.rst	2 files changed, 2 insertions(+), 2 deletions(-)
9a179e8a	2021-03-31	Eliminar espacios innecesarios.	1 file changed, 2 insertions(+), 6 deletions(-)
1e8865af	2021-03-30	Quiz1	1 file changed, 214 insertions(+)
d2d9a45c	2021-03-30	Fixed unit test exercise 3-Quiz 1	1 file changed, 2 insertions(+), 2 deletions(-)
6b3dcb53	2021-03-30	Quiz 1 - Excercises 1, 2 and 4	3 files changed, 85 insertions(+), 3 deletions(-)
91a33eff	2021-03-29	Delete .vscode directory	1 file changed, 3 deletions(-)
c56ac680	2021-03-29	Fixed identation bugs and some translations.	3 files changed, 22 insertions(+), 17 deletions(-)

Git log table to my RunestoneComponents fork master branch:

The next table is a summary of the result of the git log with the most important commits to RunestoneComponents master, to get the full commit report do:

git log --pretty=format:"| %h | %as | %<(50)%s | " --shortstat [email protected] [email protected]

Commit	Date	Summary	Stats
7899d658	2021-08-16	General update	72 files changed, 332649 insertions(+), 7221 deletions(-)
9d39b6b2	2021-08-09	style fix	4 files changed, 6 insertions(+), 8 deletions(-)
a7c83445	2021-08-09	Style fixes	1 file changed, 7 insertions(+), 7 deletions(-)
e61845e1	2021-08-09	fix quotes bug	1 file changed, 4 insertions(+), 4 deletions(-)
f4ca3257	2021-08-03	Revert "Merge branch 'RunestoneInteractive:master' into master"	56 files changed, 269 insertions(+), 2286 deletions(-)
da2b499c	2021-07-30	Scrollbar always on bottom	33 files changed, 4206 insertions(+), 416 deletions(-)
ce6fd731	2021-07-28	Sticky footer	1 file changed, 17 insertions(+), 7 deletions(-)
ed4ed4da	2021-07-27	Error pre style	1 file changed, 3 insertions(+)
e3b69332	2021-07-27	page on top, output on bottom	1 file changed, 13 insertions(+), 21 deletions(-)
d45250d0	2021-07-06	Style corrections for console to display correctly	1 file changed, 5 insertions(+), 1 deletion(-)
a7d1ae60	2021-06-18	Concat using ${prog} instead of +prog+	1 file changed, 2 insertions(+), 2 deletions(-)
e6b44278	2021-06-15	Add dist folder	35 files changed, 310267 insertions(+), 2 deletions(-)
82d391d7	2021-06-14	'python3_interpreter' activecode directive for brython	6 files changed, 2746 insertions(+), 4280 deletions(-)
e418f658	2021-06-12	Work-in-progress python3_interpreter activecode directive	6 files changed, 122 insertions(+), 1 deletion(-)
c0ae589c	2021-06-09	Add the html elements needed for brython	1 file changed, 58 insertions(+)