Add a page for toggling the cookie used for the new layout experiment

endpoints/web.py

@@ -168,6 +168,12 @@ def security():
   return index('')
 
 
+@web.route('/__exp/<expname>')
+@no_cache
+def exp(expname):
+  return index('')
+
+
 @web.route('/v1')
 @web.route('/v1/')
 @no_cache

static/js/app.js

@@ -60,7 +60,20 @@ quayApp.config(['$routeProvider', '$locationProvider', 'pages', function($routeP
   // index rule to make sure that deep links directly deep into the app continue to work.
   // WARNING WARNING WARNING
 
-  var layoutProfile = window.location.search.indexOf('old-ui=1') >= 0 ? 'old-layout' : 'layout';
+  var layoutProfile = 'old-layout';
+
+  // Check for the cookie for turning on the new layout.
+  if (document.cookie.toString().indexOf('quay.exp-new-layout=true') >= 0) {
+    layoutProfile = 'layout';
+  }
+
+  // Check for the override flag.
+  if (window.location.search.indexOf('old-ui=1') >= 0) {
+    layoutProfile = 'old-layout';
+  }
+
+  window.console.log('Using layout profile: ' + layoutProfile);
+
   var routeBuilder = new AngularRouteBuilder($routeProvider, pages, [
     // Start with the old pages (if we asked for it).
     {id: 'old-layout', templatePath: '/static/partials/'},
@@ -152,6 +165,9 @@ quayApp.config(['$routeProvider', '$locationProvider', 'pages', function($routeP
     // Confirm Invite
     .route('/confirminvite', 'confirm-invite')
 
+    // Enable/disable experimental layout
+    .route('/__exp/newlayout', 'exp-new-layout')
+
     // Default: Redirect to the landing page
     .otherwise({redirectTo: '/'});
 }]);
@@ -190,6 +206,8 @@ if (window.__config && window.__config.SENTRY_PUBLIC_DSN) {
 quayApp.run(['$location', '$rootScope', 'Restangular', 'UserService', 'PlanService', '$http', '$timeout', 'CookieService', 'Features', '$anchorScroll', 'UtilService',
   function($location, $rootScope, Restangular, UserService, PlanService, $http, $timeout, CookieService, Features, $anchorScroll, UtilService) {
 
+  var title = window.__config['REGISTRY_TITLE'] || 'Quay.io';
+
   // Handle session security.
   Restangular.setDefaultRequestParams(['post', 'put', 'remove', 'delete'], {'_csrf_token': window.__token || ''});
 
@@ -285,6 +303,8 @@ quayApp.run(['$location', '$rootScope', 'Restangular', 'UserService', 'PlanServi
 
     if (current.$$route.title) {
       $rootScope.title = current.$$route.title;
+    } else {
+      $rootScope.title = title;
     }
 
     if (current.$$route.pageClass) {

static/js/pages/exp-new-layout.js

@@ -0,0 +1,19 @@
+(function() {
+  /**
+   * Experiment enable page: New layout
+   */
+  angular.module('quayPages').config(['pages', function(pages) {
+    pages.create('exp-new-layout', 'exp-new-layout.html', ExpCtrl, {
+      'newLayout': true
+    });
+  }]);
+
+  function ExpCtrl($scope, CookieService) {
+    $scope.isEnabled = CookieService.get('quay.exp-new-layout') == 'true';
+
+    $scope.setEnabled = function(value) {
+      $scope.isEnabled = value;
+      CookieService.putPermanent('quay.exp-new-layout', value.toString());
+    };
+  }
+}())

static/partials/exp-new-layout.html

@@ -0,0 +1,10 @@
+<div class="page-content">
+  <div class="cor-title">
+    <span class="cor-title-link"></span>
+    <span class="cor-title-content">Experiment: New Layout</span>
+  </div>
+  <div class="co-main-content-panel">
+    <button class="btn btn-success" ng-if="!isEnabled" ng-click="setEnabled(true)">Enable Experiment</button>
+    <button class="btn btn-failure" ng-if="isEnabled" ng-click="setEnabled(false)">Disable Experiment</button>
+  </div>
+</div>