DO NOT MERGE THIS PR :-) Just an experiment in using Tangerine client as a Tangerine widget that just plays assessments.
The problem
Tangerine used to be one code base wether you were on a Tablet or on the Internet. Now because we had to go with a different architecture direction for the tablets than what we have on the server, they have to be two different code bases. Yet, they still need to have the same code for playing assessments. If we stay this course, every time there is a bug or a new feature request, we may have to spend the development effort twice.
Tangerine Widget Proposal
My proposal is we extract code related to the Assessment into it's own codebase like an "Assessment Player" similar to an embeddable widget like Flow Player for videos. Tangerine Server and Tangerine Client codebases then import Tangerine Widget as a Bower dependency and their own Assessment routes are modified to use the Tangerine Widget. I believe this is a clean way to share the core Tangerine functionality between all kinds of contexts no matter how we need to package it for other environments in the future.
Here's a potential path for proceeding on this trajectory.
Incorporate Tangerine Widget into Tangerine Client.
Incorporate Tangerine Widget into Tangerine Server.
Extract the editor for Assessments into Tangerine Widget.
Incorporate the Tangerine Widget editing capabilities into Tangerine Server.
The parent page in the example includes the child index.html in an iframe tag AKA the Tangerine widget. The parent page then attaches a data-assessment property that the App inside the iframe then imports and then navigates to the assessment route of what was just imported. The Assessment route callback is modified to skip the authentication check and then update the parent iframe tag with a data-result attribute every time the the AssessmentCompositeView renders, also tacking on an event emitter on the parent iframe tag so things in the parent know when the data-result property is updated. The example code listens for that event and prints the result JSON to the screen when it updates.
DO NOT MERGE THIS PR :-) Just an experiment in using Tangerine client as a Tangerine widget that just plays assessments.
The problem
Tangerine used to be one code base wether you were on a Tablet or on the Internet. Now because we had to go with a different architecture direction for the tablets than what we have on the server, they have to be two different code bases. Yet, they still need to have the same code for playing assessments. If we stay this course, every time there is a bug or a new feature request, we may have to spend the development effort twice.
Tangerine Widget Proposal
My proposal is we extract code related to the Assessment into it's own codebase like an "Assessment Player" similar to an embeddable widget like Flow Player for videos. Tangerine Server and Tangerine Client codebases then import Tangerine Widget as a Bower dependency and their own Assessment routes are modified to use the Tangerine Widget. I believe this is a clean way to share the core Tangerine functionality between all kinds of contexts no matter how we need to package it for other environments in the future.
Here's a potential path for proceeding on this trajectory.
Example
I created a Tangerine-widget repo that is publishing a gh-pages branch to here http://tangerine-community.github.io/Tangerine-widget/examples/embedded-widget.html
The parent page in the example includes the child index.html in an iframe tag AKA the Tangerine widget. The parent page then attaches a
data-assessment
property that the App inside the iframe then imports and then navigates to the assessment route of what was just imported. The Assessment route callback is modified to skip the authentication check and then update the parent iframe tag with adata-result
attribute every time the the AssessmentCompositeView renders, also tacking on an event emitter on the parent iframe tag so things in the parent know when thedata-result
property is updated. The example code listens for that event and prints the result JSON to the screen when it updates.