From f226a33016062da368032dfde5949e3312c42237 Mon Sep 17 00:00:00 2001
From: Thirumal Ravula <travula@gmail.com>
Date: Thu, 19 Oct 2017 00:59:54 +0530
Subject: [PATCH 1/2] design with post messages captured

---
 src/design/img/header.png  | Bin 0 -> 6408 bytes
 src/design/img/layout.png  | Bin 0 -> 6009 bytes
 src/design/index.org       | 167 +++++++++++++++++++++++++++++++------
 src/requirements/index.org |   2 +-
 4 files changed, 143 insertions(+), 26 deletions(-)
 create mode 100644 src/design/img/header.png
 create mode 100644 src/design/img/layout.png

diff --git a/src/design/img/header.png b/src/design/img/header.png
new file mode 100644
index 0000000000000000000000000000000000000000..976dfa9f71e9e5ba28aa96bd3e561331a58bba29
GIT binary patch
literal 6408
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
Wsm|piQ%C+~0qAQRYN0fsk^cvfk?9Hm

literal 0
HcmV?d00001

diff --git a/src/design/img/layout.png b/src/design/img/layout.png
new file mode 100644
index 0000000000000000000000000000000000000000..69fbf661804405b250280ee531902501a4957cdd
GIT binary patch
literal 6009
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
CC&}0V

literal 0
HcmV?d00001

diff --git a/src/design/index.org b/src/design/index.org
index 988c862..2e5e841 100644
--- a/src/design/index.org
+++ b/src/design/index.org
@@ -8,32 +8,149 @@
 #+LATEX: Literal LaTeX code for export
 
 * Introduction 
-  :PROPERTIES:
-  :CUSTOM_ID: introduction
-  :END: 
   This document describes  the design of =vlabs-landing-pages=.
 
 * Design
-  :PROPERTIES:
-  :CUSTOM_ID: design
-  :END: 
+  The virtual labs portal is built dynamically using lab
+  data service since the data related to a lab - hosting
+  information, lab image, etc. will change over time.  The
+  lab data service provides data about different
+  disciplines, institutes, labs and their hosted url.
+
+** The case for iframes
+  Each lab in virtual labs is a web application.  Since each
+  lab is a web application without any API, the access to
+  its content which is laid out as html files is through the
+  url for each html file.  Therefore, each lab becomes an
+  external source to the vlabs portal which has to be
+  embedded into the virtual labs portal.  To display the
+  contents from an external source, an [[https://www.w3schools.com/TAgs/tag_iframe.asp][iframe]] is used.
+
+** Layout
+   The landing page is divided into three main
+   divisions: 1. header, 2. content and 3. footer. 
+
+   #+caption: layout of landing page
+   #+name: fig:layout
+   [[./img/layout.png]]
+
+   The header contains all the control actions.  It is the
+   controller for the portal.  The content division has an
+   iframe to display the lab.  The footer division also has
+   an iframe to contain the footer.html served from footer
+   server. 
+
+** Header Division
+   #+caption: layout of header division
+   #+name: fig:header
+   [[./img/header.png]]
+   
+   Event handlers are attached to each of the elements in
+   the header division.  The event here is either click or
+   select and on the occurrence of the event, the iframe in
+   the content division is loaded.  =All Labs=, =Search=,
+   =Login= and =Register= are buttons while =Institutes= and
+   =Disciplines= are dropdown menus.
+
+   Events on =Login= and =Register= load login page and
+   register page from the Open edX platform respectively in
+   the iframe contained in the content division. 
+   
+   Events on the elements in the header division load the
+   listing of labs in the iframe contained in the content
+   division.
+
+   The handler for either the click or select event on the
+   elements -- =All Labs=, =Institutes=, =Disciplines= and
+   =Search= -- constructs the content with event handlers
+   attached for the click event on each of lab element
+   listed.  The attached event handler opens the lab on the
+   =click= event in the same iframe.
+
+** Content Division
+   This division contains the iframe.  The handlers attached
+   to the elements in the header division manipulate the src
+   of this iframe to display the content of the labs.
+
+** Footer Division
+   This division contains an iframe whose source is set to
+   =footer.html= served from a footer service.
+
+* Iframe Management
+  The event handlers responsible for lab listing in the
+  content division and the event handlers attached to each
+  lab within content division manipulate the iframe inside
+  it.
+
+  Once a lab is loaded into the iframe, the handlers served
+  from the portal cannot reset the content since they are of
+  different origin.  To overcome this problem, every time
+  content is created by the handlers in the header division,
+  the existing iframe in the content division is deleted, a
+  new one is created and content that is dynamically
+  generated is set to the iframe.
+
+  The handler attached for each lab listed within this
+  iframe, sets the source of the iframe to the url of the
+  lab.
+
+* Login and Registration
+  Open edX platform login & registration infrastructure is
+  used for all the labs.  
+  
+  A handler attached to each lab checks a cookie if a login
+  happened in that browser.  If the login has not happened,
+  the iframe in the content division is loaded with the
+  login/registration page from Open edX platform.  If the
+  user is inactive for a certain period after successful
+  login/registration, the session cookie is cleared.
+
+  Open edX does not provide the login/registration as
+  services through API.  If this was not the case, the
+  portal could have displayed it's own login/registration
+  and made REST calls to the login/registration API of Open
+  edX.  Since this was not the case, the portal has to
+  depend on the login/registration web pages served from
+  Open edX platform.
+
+  The event handler attached to the click event on the
+  login/register buttons loads these pages in the iframe
+  contained in the content division.  But how will the
+  controller -- header division -- know that the user has
+  either successfully logged in or registered.  The state of
+  the iframe changes on a successful login or a registration
+  and this state has to be captured by the controller and
+  the login and register buttons should be flipped to
+  =logout= button.
+
+** Capture the state
+   Since the login/register pages are served from a
+   different origin than the landing pages, the controller
+   in the header division cannot access the DOM element of
+   the iframe to read the contents and identify the state
+   change.  Instead [[https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage][postMessage]] mechanism is used to relay
+   the state change information from the iframe in the
+   content division to the header division.  The listener in
+   the header division intercepts the post message and takes
+   the appropriate action of:
+   1. flipping the login/register to logout and vice versa
+      and
+   2. setting or clearing the cookie used by the handlers to
+      determine if the user is logged in that session. 
+
+
+** Embedding the javascript to post message
+   Since the login/register pages are served from Open edX
+   portal whose code is black box, the javascript code to
+   post messages from these pages has to be inserted.  Open
+   edX platform used nginx as it's web server.  To
+   accomplish this, nginx's [[http://nginx.org/en/docs/http/ngx_http_addition_module.html][http addition module]] is
+   harnessed.  This module allows to add additional html to
+   the requested resource.
+
+   When login/register pages are requested, before the
+   response is sent back by the ngnix server on the Open edX
+   platform, the javascript code to post messages is
+   appended.
+   
   
-  Landing page will be divided into 3 frames.
-  1) Header Iframe 
-  2) Content Iframe
-  3) Footer Iframe
-** Header Iframe 
-   On click of header tabs like institutes, disciplines and
-   labs it has to load the data of institutes, disciplines
-   and labs dynamically in content iframe. On Click of any
-   loaded data like list of institutes, disciplines or labs
-   it has to call a function such that it loads all labs in
-   institutes, disciplines, labs respectively. once the list
-   of labs are displayed users can access based on their
-   choice.
-
-** Content Iframe
-   When the state changes, all the user actions will be loaded into the body Iframe. 
-** Footer Iframe
-   Footer will be served from footer service and will be loaded into footer
-   iframe of vlabs landing page.
diff --git a/src/requirements/index.org b/src/requirements/index.org
index df0a0a2..cf800b7 100644
--- a/src/requirements/index.org
+++ b/src/requirements/index.org
@@ -40,7 +40,7 @@
 ** Requirement 4
    Currently, the styling of the VLABS portal is tied to the
    Open edX platform.  This is constraint in terms of
-   maintenence and the ease of applying new styles.  To move
+   maintenance and the ease of applying new styles.  To move
    away from this dependence, the styling of VLABS portal is
    done while the pages are rendered from the new portal.
 

From c1173324896d591119d03cb3ffbe7206cf080e01 Mon Sep 17 00:00:00 2001
From: Thirumal Ravula <travula@gmail.com>
Date: Thu, 19 Oct 2017 17:17:03 +0530
Subject: [PATCH 2/2] reviewed the document

---
 src/design/index.org | 25 +++++++++++++------------
 1 file changed, 13 insertions(+), 12 deletions(-)

diff --git a/src/design/index.org b/src/design/index.org
index 2e5e841..6c86c5d 100644
--- a/src/design/index.org
+++ b/src/design/index.org
@@ -1,4 +1,4 @@
-#+TITLE: Vlabs Landing Pages
+#+TITLE: Design of Vlabs Landing Pages
 #+AUTHOR: VLEAD
 #+DATE: [2017-05-03 Wednesday]
 #+PROPERTY: results output
@@ -22,7 +22,7 @@
   lab is a web application without any API, the access to
   its content which is laid out as html files is through the
   url for each html file.  Therefore, each lab becomes an
-  external source to the vlabs portal which has to be
+  external source to the vlabs portal that will have to be
   embedded into the virtual labs portal.  To display the
   contents from an external source, an [[https://www.w3schools.com/TAgs/tag_iframe.asp][iframe]] is used.
 
@@ -78,7 +78,7 @@
 
 * Iframe Management
   The event handlers responsible for lab listing in the
-  content division and the event handlers attached to each
+  header division and the event handlers attached to each
   lab within content division manipulate the iframe inside
   it.
 
@@ -91,7 +91,7 @@
   generated is set to the iframe.
 
   The handler attached for each lab listed within this
-  iframe, sets the source of the iframe to the url of the
+  iframe sets the source of the iframe to the url of the
   lab.
 
 * Login and Registration
@@ -108,8 +108,8 @@
   Open edX does not provide the login/registration as
   services through API.  If this was not the case, the
   portal could have displayed it's own login/registration
-  and made REST calls to the login/registration API of Open
-  edX.  Since this was not the case, the portal has to
+  pages and made REST calls to the login/registration API of
+  Open edX.  Since this was not the case, the portal has to
   depend on the login/registration web pages served from
   Open edX platform.
 
@@ -128,7 +128,7 @@
    different origin than the landing pages, the controller
    in the header division cannot access the DOM element of
    the iframe to read the contents and identify the state
-   change.  Instead [[https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage][postMessage]] mechanism is used to relay
+   change.  Therefore [[https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage][postMessage]] mechanism is used to relay
    the state change information from the iframe in the
    content division to the header division.  The listener in
    the header division intercepts the post message and takes
@@ -141,12 +141,13 @@
 
 ** Embedding the javascript to post message
    Since the login/register pages are served from Open edX
-   portal whose code is black box, the javascript code to
+   portal whose code is a black box, the javascript code to
    post messages from these pages has to be inserted.  Open
-   edX platform used nginx as it's web server.  To
-   accomplish this, nginx's [[http://nginx.org/en/docs/http/ngx_http_addition_module.html][http addition module]] is
-   harnessed.  This module allows to add additional html to
-   the requested resource.
+   edX platform uses nginx as it's web server.  To
+   accomplish the insertion of javascript for posting
+   messages, nginx's [[http://nginx.org/en/docs/http/ngx_http_addition_module.html][http addition module]] is harnessed.
+   This module allows addition of html to the requested
+   resource in the response. 
 
    When login/register pages are requested, before the
    response is sent back by the ngnix server on the Open edX