MOBILE-1158 splitview: Avoid params collision in split view

dpalou · dpalou · commit d9d43b7ca3f3 · 2016-02-02T16:02:27.000+01:00
diff --git a/www/addons/mod_forum/controllers/discussion.js b/www/addons/mod_forum/controllers/discussion.js
@@ -25,7 +25,7 @@ angular.module('mm.addons.mod_forum')
             $ionicScrollDelegate, mmaModForumComponent) {
 
     var discussionid = $stateParams.discussionid,
-        courseid = $stateParams.courseid,
+        courseid = $stateParams.cid,
         scrollView;
 
     $scope.component = mmaModForumComponent;
diff --git a/www/addons/mod_forum/controllers/newdiscussion.js b/www/addons/mod_forum/controllers/newdiscussion.js
@@ -24,7 +24,7 @@ angular.module('mm.addons.mod_forum')
 .controller('mmaModForumNewDiscussionCtrl', function($scope, $stateParams, $mmGroups, $q, $mmaModForum, $mmEvents, $ionicPlatform,
             $mmUtil, $ionicHistory, $translate, mmaModForumNewDiscussionEvent) {
 
-    var courseid = $stateParams.courseid,
+    var courseid = $stateParams.cid,
         forumid = $stateParams.forumid,
         cmid = $stateParams.cmid;
 
diff --git a/www/addons/mod_forum/main.js b/www/addons/mod_forum/main.js
@@ -40,7 +40,7 @@ angular.module('mm.addons.mod_forum', [])
         url: '/mod_forum-discussion',
         params: {
             discussionid: null,
-            courseid: null
+            cid: null // Not naming it courseid because it collides with 'site.mod_forum' param in split-view.
         },
         views: {
             'site': {
@@ -53,7 +53,7 @@ angular.module('mm.addons.mod_forum', [])
     .state('site.mod_forum-newdiscussion', {
         url: '/mod_forum-newdiscussion',
         params: {
-            courseid: null,
+            cid: null, // Not naming it courseid because it collides with 'site.mod_forum' param in split-view.
             forumid: null,
             cmid: null
         },
diff --git a/www/addons/mod_forum/templates/discussions.html b/www/addons/mod_forum/templates/discussions.html
@@ -11,12 +11,12 @@
                 <mm-course-mod-description watch="true" description="description" note="'mma.mod_forum.numdiscussions' | translate:{numdiscussions: forum.numdiscussions}" ></mm-course-mod-description>
                 <ul class="list" ng-if="forum">
                     <li class="item" ng-if="isCreateEnabled && forum.cancreatediscussions">
-                        <button class="button button-block" mm-split-view-link="site.mod_forum-newdiscussion({forumid: forum.id, cmid: forum.cmid, courseid: courseid})">
+                        <button class="button button-block" mm-split-view-link="site.mod_forum-newdiscussion({forumid: forum.id, cmid: forum.cmid, cid: courseid})">
                             {{ 'mma.mod_forum.addanewdiscussion' | translate }}
                         </button>
                     </li>
                     <li class="card" ng-repeat="discussion in discussions track by $index">
-                        <a class="mma-forum-discussion-link" mm-split-view-link="site.mod_forum-discussion({courseid: courseid, discussionid: discussion.discussion})">
+                        <a class="mma-forum-discussion-link" mm-split-view-link="site.mod_forum-discussion({cid: courseid, discussionid: discussion.discussion})">
                             <article>
                                 <div class="item item-avatar item-text-wrap">
                                     <img ng-if="discussion.userpictureurl" ng-src="{{discussion.userpictureurl}}" mm-external-content mm-split-view-link="{{userStateName}}({courseid: courseid, userid: discussion.userid})" alt="" role="presentation">
diff --git a/www/addons/mod_glossary/controllers/entry.js b/www/addons/mod_glossary/controllers/entry.js
@@ -24,7 +24,7 @@ angular.module('mm.addons.mod_glossary')
 .controller('mmaModGlossaryEntryCtrl', function($scope, $stateParams, $mmaModGlossary, $translate,
         mmUserProfileState) {
     var entry = $stateParams.entry || {},
-        courseid = $stateParams.courseid || 0,
+        courseid = $stateParams.cid || 0,
         glossary;
 
     // This is a coding error, for now the course ID is required here as we need it for the author link.
diff --git a/www/addons/mod_glossary/main.js b/www/addons/mod_glossary/main.js
@@ -35,7 +35,7 @@ angular.module('mm.addons.mod_glossary', ['mm.core'])
     .state('site.mod_glossary-entry', {
       url: '/mod_glossary-entry',
       params: {
-        courseid: null,
+        cid: null, // Not naming it courseid because it collides with 'site.mod_glossary' param in split-view.
         entry: null
       },
       views: {
diff --git a/www/addons/mod_glossary/templates/index.html b/www/addons/mod_glossary/templates/index.html
@@ -33,7 +33,7 @@
                             <h2>{{getDivider(entries[$index])}}</h2>
                         </div>
 
-                        <a class="item" mm-split-view-link="site.mod_glossary-entry({entry: {{ entry }}, courseid: {{ courseid }}})">
+                        <a class="item" mm-split-view-link="site.mod_glossary-entry({entry: {{ entry }}, cid: {{ courseid }}})">
                             <p>{{entry.concept}}</p>
                         </a>
                     </div>
diff --git a/www/core/components/course/controllers/section.js b/www/core/components/course/controllers/section.js
@@ -25,7 +25,7 @@ angular.module('mm.core.course')
             $mmEvents, $ionicScrollDelegate, $mmCourses, $q, mmCoreEventCompletionModuleViewed) {
 
     // Default values are course 1 (front page) and all sections.
-    var courseid = $stateParams.courseid || 1,
+    var courseid = $stateParams.cid || 1,
         sectionid = $stateParams.sectionid || -1;
 
     $scope.sitehome = (courseid === 1); // Are we visiting the site home?
diff --git a/www/core/components/course/main.js b/www/core/components/course/main.js
@@ -38,7 +38,7 @@ angular.module('mm.core.course', ['mm.core.courses'])
         url: '/mm_course-section',
         params: {
             sectionid: null,
-            courseid: null
+            cid: null // Not naming it courseid because it collides with 'site.mm_course' param in split-view.
         },
         views: {
             'site': {
diff --git a/www/core/components/course/templates/sections.html b/www/core/components/course/templates/sections.html
@@ -6,7 +6,7 @@
             <mm-loading hide-until="sectionsLoaded">
                 <ul class="list">
                     <li ng-repeat="section in sections">
-                        <a class="item item-text-wrap item-button-right" mm-split-view-link="site.mm_course-section({courseid: courseid, coursecompletion: coursecompletion, sectionid: section.id})" title="{{section.name}}">
+                        <a class="item item-text-wrap item-button-right" mm-split-view-link="site.mm_course-section({cid: courseid, coursecompletion: coursecompletion, sectionid: section.id})" title="{{section.name}}">
                             <mm-format-text watch="true">{{section.name}}</mm-format-text>
 
                             <button ng-if="section.showDownload && !section.isDownloading" ng-click="prefetch($event, section)" class="button button-icon" aria-label="{{ 'mm.core.download' | translate }}">
diff --git a/www/core/directives/splitview.js b/www/core/directives/splitview.js
@@ -19,6 +19,12 @@ angular.module('mm.core')
 /**
  * Directive to create a split view layout. This directive should be used along with mm-split-view-link.
  *
+ * IMPORTANT: Due to a limitation in Angular ui-router, the left pane state and the right pane state should NOT have
+ * parameters with the same name but different value. It can cause unexpected behaviors.
+ * Example: if the left pane loads a state with param 'courseid', then all the states that can be loaded in the right pane
+ * should avoid having a parameter named 'courseid'. The right pane state can have a 'courseid' param only if it will always
+ * have the same value than in left pane state.
+ *
  * @module mm.core
  * @ngdoc directive
  * @name mmSplitView
@@ -37,6 +43,12 @@ angular.module('mm.core')
  * immediately load the link set (if no link is set it will load the first link found). Example:
  * $rootScope.$broadcast(mmCoreSplitViewLoad, {load: 2});
  *
+ * IMPORTANT: Due to a limitation in Angular ui-router, the left pane state and the right pane state should NOT have
+ * parameters with the same name but different value. It can cause unexpected behaviors.
+ * Example: if the left pane loads a state with param 'courseid', then all the states that can be loaded in the right pane
+ * should avoid having a parameter named 'courseid'. The right pane state can have a 'courseid' param only if it will always
+ * have the same value than in left pane state.
+ *
  * Accepts the following params:
  *
  * @param {String} [menuWidth] Width of the left menu. Can be specified in pixels ('200px') or in percentage ('30%').
diff --git a/www/core/directives/splitviewlink.js b/www/core/directives/splitviewlink.js
@@ -18,6 +18,12 @@ angular.module('mm.core')
  * Directive to load a state in a split-view-content pane in tablet or in a new page in phone.
  * Requires being a child of mmSplitView.
  *
+ * IMPORTANT: Due to a limitation in Angular ui-router, the left pane state and the right pane state should NOT have
+ * parameters with the same name but different value. It can cause unexpected behaviors.
+ * Example: if the left pane loads a state with param 'courseid', then all the states that can be loaded in the right pane
+ * should avoid having a parameter named 'courseid'. The right pane state can have a 'courseid' param only if it will always
+ * have the same value than in left pane state.
+ *
  * @module mm.core
  * @ngdoc directive
  * @name mmSplitViewLink
