Building the Chrome Extension - First Steps

After creating a foundation for accessing data for online resources, as discussed in my last post, I decided to start work on making the actual Chrome Extension. I started with the basics, using online tutorials to learn how to setup the file structure and add basic functionality.

One thing that Academist will have to do is be versatile in accessing information on the the School Loop Student Portal, namely assignments. I experimented with sifting through HTML elements and their contents using JavaScript, and I was able to make the program print out the name of an assignment– not too difficult, although it was slow getting used to the JavaScript programming language.

Chrome Extensions are also meant to alter the HTML of a webpage to add new UI features. Of course, Academist needs to do this. The most important feature of Academist will be buttons that are displayed under assignments in the Student Portal, which will open webpages of Khan Academy and possibly other resources related to an assignment. Enabling Academist to be able to take information from an assignment on School Loop and decipher what topic it is on is going to be a lot of work. That will happen later. For now, I'll just add a button that does nothing under every assignment. Currently, the Chrome Extensions displays a button with the text, "CLICK ME" under an assignment whenever the dropdown is activated, as shown below.

I could talk about some technical things now, like how I used a Mutation Observer in order to detect when the dropdown is first opened. Or I could talk about plans for the future, which I think will be more interesting.

Here's a reminder of the two main features I had planned for Academist: Find online resources to help understand topics on School Loop assignments based on keywords in those assignments, and find online resources to help understand topics on School Loop assignments based on textbook page numbers in those assignments and the topics of the sections that those page numbers are in. From my experience, math and science teachers will more often post textbook assignments with page numbers or section numbers rather than explicitly mention the topics that the homework is on. Because of this, I will focus more on the textbook aspect of Academist. But even with that feature, the topics in a textbook still need to be matched with the correct Khan Academy page, and any other online resource I choose to add into the mix.

This leaves some important to-do's:

• Create a basic word-matching algorithm and test it against fake assignments so that it can correctly determine corresponding topics in Khan Academy.
• Convert images of table of contents of textbooks at Sage Creek to useful spreadsheets.
• Convert the spreadsheets to a readable format for the Chrome Extension.
• Create an interface in Academist that prompts student to choose which textbooks they use for their classes.
• Put all of those things together in order to enable Academist to read page numbers in School Loop, then determine the topic name for that section in the textbook, then determine the Khan Academy page that explains that topic.