Serve some dynamic pages using transclusion components (oppia#7195)

* serve library page statically * serve creator dashboard page statically * serve exploration player statically * serve exploration_editor statically * serve profile page statically * serve collection editor page statically * serve collection player statically * serve collection_player statically * get exploration player meta via ajax * remove unnecessary console * modify test to add objective * work on failing backend tests * work on failing e2e tests * work on failing e2e test * fix issues arising from rootScope propagation * move dev mode test to e2e test * removed csrf token * work on failing accessibility test * fix lint issue * issues with rootscope * work on failing tests and address review comments * fix issue with collection player * removed exploration editor from this PR * work on failing test * still on backend test * remove unneeded file * remove remaining changes * minor changes * minor changes * address review comment * modified dev mode test * wrok on e2e tests * revert pre_commit_hook * address review comment * work on e2e test * work on failing test * fix e2e test * remove unnecessary files
aishacodes · Jul 22, 2019 · 71fdef7 · 71fdef7
1 parent ba1fc92
commit 71fdef7
Show file tree

Hide file tree

Showing 24 changed files with 625 additions and 649 deletions.
diff --git a/core/controllers/base_test.py b/core/controllers/base_test.py
@@ -87,21 +87,6 @@ def setUp(self):
         self.signup(self.TEST_CREATOR_EMAIL, self.TEST_CREATOR_USERNAME)
         self.signup(self.TEST_EDITOR_EMAIL, self.TEST_EDITOR_USERNAME)
 
-    def test_dev_indicator_appears_in_dev_and_not_in_production(self):
-        """Test dev indicator appears in dev and not in production."""
-
-        with self.swap(constants, 'DEV_MODE', True):
-            response = self.get_html_response(feconf.LIBRARY_INDEX_URL)
-            self.assertIn(
-                '<div ng-if="DEV_MODE" class="oppia-dev-mode" ng-cloak>',
-                response.body)
-
-        with self.swap(constants, 'DEV_MODE', False):
-            response = self.get_html_response(feconf.LIBRARY_INDEX_URL)
-            self.assertIn(
-                '<div ng-if="DEV_MODE" class="oppia-dev-mode" ng-cloak>',
-                response.body)
-
     def test_that_no_get_results_in_500_error(self):
         """Test that no GET request results in a 500 error."""
 

diff --git a/core/controllers/collection_viewer.py b/core/controllers/collection_viewer.py
@@ -43,8 +43,6 @@ def get(self, collection_id):
             'collection_id': collection_id,
             'collection_title': collection.title,
             'is_private': rights_manager.is_collection_private(collection_id),
-            'meta_name': collection.title,
-            'meta_description': utils.capitalize_string(collection.objective)
         })
 
         self.render_template('dist/collection-player-page.mainpage.html')
@@ -71,6 +69,9 @@ def get(self, collection_id):
             'collection': collection_dict,
             'is_logged_in': bool(self.user_id),
             'session_id': utils.generate_new_session_id(),
+            'meta_name': collection_dict['title'],
+            'meta_description': utils.capitalize_string(
+                collection_dict['objective'])
         })
 
         self.render_json(self.values)
diff --git a/core/controllers/library.py b/core/controllers/library.py
@@ -74,16 +74,7 @@ class LibraryPage(base.BaseHandler):
     @acl_decorators.open_access
     def get(self):
         """Handles GET requests."""
-        search_mode = 'search' in self.request.url
 
-        self.values.update({
-            'meta_description': (
-                feconf.SEARCH_PAGE_DESCRIPTION if search_mode
-                else feconf.LIBRARY_PAGE_DESCRIPTION),
-            'has_fully_registered': bool(
-                self.user_id and
-                user_services.has_fully_registered(self.user_id)),
-        })
         self.render_template('dist/library-page.mainpage.html')
 
 

diff --git a/core/domain/exp_domain.py b/core/domain/exp_domain.py
@@ -3167,6 +3167,7 @@ def to_player_dict(self):
                 - states: dict. Keys are states names and values are dict
                     representation of State domain object.
                 - title: str. The exploration title.
+                - objective: str. The exploration objective.
                 - language_code: str. The language code of the exploration.
                 - correctness_feedback_enabled: str. Whether to show correctness
                     feedback.
@@ -3180,6 +3181,7 @@ def to_player_dict(self):
                 for (state_name, state) in self.states.iteritems()
             },
             'title': self.title,
+            'objective': self.objective,
             'language_code': self.language_code,
             'correctness_feedback_enabled': self.correctness_feedback_enabled,
         }

diff --git a/core/domain/exp_domain_test.py b/core/domain/exp_domain_test.py
@@ -5318,6 +5318,7 @@ def _get_default_state_dict(content_str, dest_name):
         self.assertEqual(exploration.to_player_dict(), {
             'init_state_name': feconf.DEFAULT_INIT_STATE_NAME,
             'title': exp_title,
+            'objective': feconf.DEFAULT_EXPLORATION_OBJECTIVE,
             'states': {
                 feconf.DEFAULT_INIT_STATE_NAME: _get_default_state_dict(
                     feconf.DEFAULT_INIT_STATE_CONTENT_STR,

diff --git a/core/templates/dev/head/pages/Base.ts b/core/templates/dev/head/pages/Base.ts
@@ -14,10 +14,8 @@
 
 require('domain/sidebar/SidebarStatusService.ts');
 require('domain/utilities/UrlInterpolationService.ts');
-require('services/AlertsService.ts');
 require('services/CsrfTokenService.ts');
 require('services/contextual/UrlService.ts');
-require('services/stateful/BackgroundMaskService.ts');
 
 require('app.constants.ts');
 
@@ -28,19 +26,15 @@ require('app.constants.ts');
 var oppia = require('AppInit.ts').module;
 
 oppia.controller('Base', [
-  '$document', '$http', '$rootScope', '$scope', 'AlertsService',
-  'BackgroundMaskService', 'CsrfTokenService', 'SidebarStatusService',
-  'UrlInterpolationService', 'UrlService', 'DEV_MODE',
-  'SITE_FEEDBACK_FORM_URL', 'SITE_NAME',
-  function($document, $http, $rootScope, $scope, AlertsService,
-      BackgroundMaskService, CsrfTokenService, SidebarStatusService,
-      UrlInterpolationService, UrlService, DEV_MODE,
-      SITE_FEEDBACK_FORM_URL, SITE_NAME) {
+  '$document', '$rootScope', '$scope', 'CsrfTokenService',
+  'SidebarStatusService', 'UrlInterpolationService', 'UrlService', 'DEV_MODE',
+  'SITE_NAME',
+  function(
+      $document, $rootScope, $scope, CsrfTokenService,
+      SidebarStatusService, UrlInterpolationService, UrlService, DEV_MODE,
+      SITE_NAME) {
     $scope.siteName = SITE_NAME;
-    $scope.AlertsService = AlertsService;
     $scope.currentLang = 'en';
-    $scope.iframed = UrlService.isIframed();
-    $scope.siteFeedbackFormUrl = SITE_FEEDBACK_FORM_URL;
     $scope.pageUrl = UrlService.getCurrentLocation().href;
     $scope.getAssetUrl = function(path) {
       return UrlInterpolationService.getFullStaticAssetUrl(path);
@@ -50,11 +44,6 @@ oppia.controller('Base', [
     // If this is nonempty, the whole page goes into 'Loading...' mode.
     $rootScope.loadingMessage = '';
 
-    $scope.isSidebarShown = SidebarStatusService.isSidebarShown;
-    $scope.closeSidebarOnSwipe = SidebarStatusService.closeSidebar;
-
-    $scope.isBackgroundMaskActive = BackgroundMaskService.isMaskActive;
-
     CsrfTokenService.initializeToken();
 
     // Listener function to catch the change in language preference.
@@ -67,16 +56,5 @@ oppia.controller('Base', [
       SidebarStatusService.onDocumentClick();
       $scope.$apply();
     });
-
-    $scope.skipToMainContent = function() {
-      var mainContentElement = document.getElementById('oppia-main-content');
-
-      if (!mainContentElement) {
-        throw Error('Variable mainContentElement is undefined.');
-      }
-      mainContentElement.tabIndex = -1;
-      mainContentElement.scrollIntoView();
-      mainContentElement.focus();
-    };
   }
 ]);
diff --git a/core/templates/dev/head/pages/collection-editor-page/collection-editor-page.mainpage.html b/core/templates/dev/head/pages/collection-editor-page/collection-editor-page.mainpage.html
@@ -1,36 +1,33 @@
-{% extends 'dist/base.html' %}
+<!DOCTYPE html>
+<html ng-app="oppia" lang="<[currentLang]>" ng-controller="Base" itemscope itemtype="http://schema.org/Organization">
+  <head>
+    @require('../../base_components/header.html', {"title": "Oppia"})
+    <script>
+      var GLOBALS = {
+        collectionId: JSON.parse('{{collection_id|js_string}}'),
+        INTERACTION_SPECS: JSON.parse('{{INTERACTION_SPECS|js_string}}')
+      }
+    </script>
+  </head>
+  <body>
+    <service-bootstrap></service-bootstrap>
+    <base-content>
+      <navbar-breadcrumb>
+        <collection-editor-navbar-breadcrumb>
+        </collection-editor-navbar-breadcrumb>
+      </navbar-breadcrumb>
 
-{% block header_js %}
-  {{ super() }}
-  <script type="text/javascript">
-    GLOBALS.collectionId = JSON.parse('{{collection_id|js_string}}');
-    GLOBALS.INTERACTION_SPECS = JSON.parse('{{INTERACTION_SPECS|js_string}}');
-  </script>
-{% endblock header_js %}
+      <nav-options>
+        <collection-editor-navbar>
+        </collection-editor-navbar>
+      </nav-options>
 
-{% block navbar_breadcrumb %}
-  <collection-editor-navbar-breadcrumb>
-  </collection-editor-navbar-breadcrumb>
-{% endblock navbar_breadcrumb %}
+      <content>
+        <collection-editor-page></collection-editor-page>
+      </content>
 
-{% block local_top_nav_options %}
-  <collection-editor-navbar>
-  </collection-editor-navbar>
-{% endblock local_top_nav_options %}
-
-{% block content %}
-  <collection-editor-page></collection-editor-page>
-{% endblock content %}
-
-{% block footer_js %}
-  {{ super() }}
-  <!-- This code is used for inserting webpack bundles
-     https://github.com/jantimon/html-webpack-plugin#writing-your-own-templates -->
-  <% for (var chunk in htmlWebpackPlugin.files.js) { %>
-    <% if (webpackConfig.mode == 'production') { %>
-      <script src="/build/templates/head/dist/<%= htmlWebpackPlugin.files.js[chunk] %>"></script>
-    <% } else { %>
-      <script src="/dist/<%= htmlWebpackPlugin.files.js[chunk] %>"></script>
-    <% } %>
-  <% } %>
-{% endblock footer_js %}
+      <page-footer></page-footer>
+    </base-content>
+    @require('../footer_js_libs.html')
+  </body>
+</html>
diff --git a/core/templates/dev/head/pages/collection-editor-page/collection-editor-page.scripts.ts b/core/templates/dev/head/pages/collection-editor-page/collection-editor-page.scripts.ts
@@ -18,6 +18,7 @@
 
 require('App.ts');
 
+require('base_components/BaseContentDirective.ts');
 require('pages/collection-editor-page/collection-editor-page.directive.ts');
 require(
   'pages/collection-editor-page/navbar/' +

diff --git a/core/templates/dev/head/pages/collection-player-page/collection-player-page.directive.ts b/core/templates/dev/head/pages/collection-player-page/collection-player-page.directive.ts
@@ -100,6 +100,19 @@ oppia.directive('collectionPlayerPage', ['UrlInterpolationService',
             WHITELISTED_COLLECTION_IDS_FOR_SAVING_GUEST_PROGRESS);
           $anchorScroll.yOffset = -80;
 
+          $http.get('/collection_handler/data/' + ctrl.collectionId).then(
+            function(response) {
+              response = response.data;
+              angular.element('meta[itemprop="name"]').attr(
+                'content', response.meta_name);
+              angular.element('meta[itemprop="description"]').attr(
+                'content', response.meta_description);
+              angular.element('meta[property="og:title"]').attr(
+                'content', response.meta_name);
+              angular.element('meta[property="og:description"]').attr(
+                'content', response.meta_description);
+            }
+          );
           ctrl.setIconHighlight = function(index) {
             ctrl.activeHighlightedIconIndex = index;
           };