From 94e707da8aa7b684a96282c3e9d656eecc2b266a Mon Sep 17 00:00:00 2001
From: Danny Coates <dannycoates@gmail.com>
Date: Wed, 31 Jan 2018 11:46:29 -0800
Subject: [PATCH] added gradient experiment

---
 app/experiments.js       | 21 +++++++++++++++++----
 app/templates/fxPromo.js | 11 +++++++++--
 assets/main.css          | 17 ++++++++++++++++-
 3 files changed, 42 insertions(+), 7 deletions(-)

diff --git a/app/experiments.js b/app/experiments.js
index 7fd56ad0..0b27b358 100644
--- a/app/experiments.js
+++ b/app/experiments.js
@@ -1,10 +1,19 @@
 import hash from 'string-hash';
 
 const experiments = {
-  XnN0idVWSxO6A0kiNkxzGw: {
-    id: 'XnN0idVWSxO6A0kiNkxzGw',
+  S9wqVl2SQ4ab2yZtqDI3Dw: {
+    id: 'S9wqVl2SQ4ab2yZtqDI3Dw',
     run: function(variant, state, emitter) {
-      state.promo = variant === 1 ? 'blue' : 'grey';
+      switch (variant) {
+        case 1:
+          state.promo = 'blue';
+          break;
+        case 2:
+          state.promo = 'pink';
+          break;
+        default:
+          state.promo = 'grey';
+      }
       emitter.emit('render');
     },
     eligible: function() {
@@ -14,7 +23,11 @@ const experiments = {
       );
     },
     variant: function(state) {
-      return this.luckyNumber(state) > 0.5 ? 1 : 0;
+      const n = this.luckyNumber(state);
+      if (n < 0.33) {
+        return 0;
+      }
+      return n < 0.66 ? 1 : 2;
     },
     luckyNumber: function(state) {
       return luckyNumber(
diff --git a/app/templates/fxPromo.js b/app/templates/fxPromo.js
index e4637a25..611b277a 100644
--- a/app/templates/fxPromo.js
+++ b/app/templates/fxPromo.js
@@ -5,8 +5,15 @@ module.exports = function(state, emit) {
   function clicked() {
     emit('experiment', { cd3: 'promo' });
   }
-
-  const classes = state.promo === 'blue' ? 'banner banner-blue' : 'banner';
+  let classes = 'banner';
+  switch (state.promo) {
+    case 'blue':
+      classes = 'banner banner-blue';
+      break;
+    case 'pink':
+      classes = 'banner banner-pink';
+      break;
+  }
 
   return html`
     <div class="${classes}">
diff --git a/assets/main.css b/assets/main.css
index 32884b25..196fbcf3 100644
--- a/assets/main.css
+++ b/assets/main.css
@@ -1039,7 +1039,7 @@ tbody {
 }
 
 .banner-blue {
-  background-color: #0098f7;
+  background: linear-gradient(-180deg, #45a1ff 0%, #00feff 94%);
   color: #fff;
 }
 
@@ -1053,6 +1053,21 @@ tbody {
   font-weight: bold;
 }
 
+.banner-pink {
+  background: linear-gradient(-180deg, #ff9400 0%, #ff1ad9 94%);
+  color: #fff;
+}
+
+.banner-pink a {
+  color: #fff;
+  font-weight: bold;
+}
+
+.banner-pink a:hover {
+  color: #eee;
+  font-weight: bold;
+}
+
 .selectbox {
   display: inline-block;
   position: relative;