Merge pull request #166 from Wikia/XW-2595-release-74

XW-2595-release-74
Wikia · Sep 25, 2017 · 6c40d32 · 6c40d32
2 parents c653679 + eea31e2
commit 6c40d32
Show file tree

Hide file tree

Showing 9 changed files with 55 additions and 25 deletions.
diff --git a/app/components/application-wrapper.js b/app/components/application-wrapper.js
@@ -65,6 +65,10 @@ export default Component.extend({
 			this.get('currentUser.language') === 'en' &&
 			inGroup('FANDOM_APP_SMART_BANNER_IOS_EXPERIMENT', 'BANNER');
 	}),
+
+	isIosBannerVisible: computed('shouldShowABTestBannerOnIOS', 'smartBannerVisible', function () {
+		return this.get('shouldShowABTestBannerOnIOS') && this.get('smartBannerVisible');
+	}),
 	// Smart Banner AB Testing
 
 	/**

diff --git a/app/components/site-head.js b/app/components/site-head.js
@@ -11,9 +11,10 @@ export default Component.extend(
 	HeadroomMixin, NotificationsUnreadCountMixin,
 	{
 		classNames: ['site-head-container'],
-		classNameBindings: ['themeBar'],
+		classNameBindings: ['themeBar', 'testSmartBannerVisible'],
 		tagName: 'div',
 		themeBar: false,
+		testSmartBannerVisible: false,
 		closableDrawerStates: ['nav', 'user-profile'],
 		closeIcon: 'close',
 

diff --git a/app/mixins/head-tags-dynamic.js b/app/mixins/head-tags-dynamic.js
@@ -4,6 +4,7 @@ import {inGroup} from '../modules/abtest';
 export default Ember.Mixin.create({
 	headData: Ember.inject.service(),
 	wikiVariables: Ember.inject.service(),
+	fastboot: Ember.inject.service(),
 
 	/**
 	 * @param {Object} model
@@ -62,9 +63,10 @@ export default Ember.Mixin.create({
 			headData.pageImage = model.details.thumbnail;
 		}
 
-		if (headData.appId &&
+		if (!this.get('fastboot.isFastBoot') && headData.appId &&
 			// Smart Banner AB Testing
-			!inGroup('FANDOM_APP_SMART_BANNER_IOS_TEST', 'banner') && !inGroup('FANDOM_APP_SMART_BANNER_IOS_TEST', 'button')
+			!inGroup('FANDOM_APP_SMART_BANNER_IOS_EXPERIMENT', 'BANNER') &&
+			!inGroup('FANDOM_APP_SMART_BANNER_IOS_EXPERIMENT', 'BUTTON')
 			// Smart Banner AB Testing
 		) {
 			headData.appleItunesApp = `app-id=${headData.appId}`;

diff --git a/app/styles/component/_site-head.scss b/app/styles/component/_site-head.scss
@@ -23,6 +23,12 @@ $site-head-default-box-shadow: 0 1px 4px 0 $site-head-box-shadow-color;
 
 .site-head-container {
 	min-height: $site-head-height;
+
+	&.test-smart-banner-visible {
+		.site-head {
+			top: 85px;
+		}
+	}
 }
 
 .site-head-wrapper {
@@ -117,7 +123,8 @@ $site-head-default-box-shadow: 0 1px 4px 0 $site-head-box-shadow-color;
 		color: $wds-fandom-color-navy;
 		font-size: 12px;
 		font-weight: bold;
-		padding: 3px;
+		margin: 0 auto;
+		padding: 4px;
 	}
 }
 

diff --git a/app/styles/component/_smart-banner-test.scss b/app/styles/component/_smart-banner-test.scss
@@ -1,13 +1,16 @@
+$wds-fandom-color-light-gray: #f2f5f5;
+
 .smart-banner-test {
+	-webkit-font-smoothing: antialiased;
 	align-items: center;
-	background: $wds-color-light-blue-gray;
+	background: $wds-fandom-color-light-gray;
 	background-size: auto 100%;
 	display: flex;
 	height: 85px;
-	margin-left: 3px;
-	width: 100%;
 	justify-content: flex-start;
-	-webkit-font-smoothing: antialiased;
+	position: fixed;
+	width: 100%;
+	z-index: $z-site-head;
 }
 
 .smart-banner-link {
@@ -35,7 +38,7 @@
 	display: flex;
 	font-size: 17px;
 	font-weight: 500;
-	margin-right: 12px;
+	margin-right: 24px;
 	text-align: center;
 }
 
@@ -52,23 +55,27 @@
 	.sb-test-meta {
 		display: flex;
 		flex-direction: column;
-		margin-left: 6px;
+		margin-left: 8px;
 	}
 
 	.sb-test-title {
+		color: #191919;
 		font-size: 16px;
 		font-weight: bold;
-		color: #191919;
 		letter-spacing: .4px;
+		margin-bottom: 3px;
 	}
 
 	.sb-test-description {
+		color: #4a4a4a;
 		font-size: 14px;
 		line-height: 1;
 	}
 
 	.sb-test-app-store {
+		color: #4a4a4a;
 		font-size: 14px;
 		line-height: 1;
+		margin-bottom: 5px;
 	}
 }
diff --git a/app/styles/layout/_page-wrapper.scss b/app/styles/layout/_page-wrapper.scss
@@ -1,4 +1,9 @@
 .page-wrapper {
+	&.with-ios-banner {
+		//smart banner height + site head height
+		margin-top: 140px;
+	}
+
 	.mobile-top-leaderboard ~ & {
 		margin-top: 0;
 	}

diff --git a/app/templates/components/application-wrapper.hbs b/app/templates/components/application-wrapper.hbs
@@ -1,6 +1,12 @@
 {{#if fullPage}}
 	{{outlet}}
 {{else}}
+	{{#if shouldShowABTestBannerOnIOS}}
+		{{smart-banner-test
+			toggleVisibility=attrs.toggleSmartBanner
+			isVisible=smartBannerVisible
+		}}
+	{{/if}}
 	{{site-head
 		drawerContent=activeDrawerContent
 		drawerVisible=drawerVisible
@@ -10,6 +16,7 @@
 		setDrawerContent=(action 'setDrawerContent')
 		smartBannerVisible=smartBannerVisible
 		themeBar=themeBar
+		testSmartBannerVisible=isIosBannerVisible
 		toggleDrawer=this.attrs.toggleDrawer
 	}}
 	{{#wikia-drawer
@@ -31,18 +38,13 @@
 			}}
 		{{/if}}
 	{{/wikia-drawer}}
-	{{#if shouldShowABTestBannerOnIOS}}
-		{{smart-banner-test
-			toggleVisibility=attrs.toggleSmartBanner
-			isVisible=smartBannerVisible
-		}}
-	{{else}}
+	{{#unless shouldShowABTestBannerOnIOS}}
 		{{smart-banner-android
 			isVisible=smartBannerVisible
 			toggleVisibility=attrs.toggleSmartBanner
 		}}
-	{{/if}}
-	<div class="page-wrapper row" lang={{language.content}} dir={{language.contentDir}}>
+	{{/unless}}
+	<div class="page-wrapper row {{if isIosBannerVisible 'with-ios-banner'}}" lang={{language.content}} dir={{language.contentDir}}>
 		{{outlet}}
 	</div>
 	{{lightbox-wrapper

diff --git a/app/templates/components/site-head.hbs b/app/templates/components/site-head.hbs
@@ -36,9 +36,11 @@
 		</div>
 	</nav>
 </div>
-{{site-head-fandom-bar
-	wikiaHomepage=wikiaHomepage
-	isVisible=displayFandomBar
-	globalNavigation=this.attrs.globalNavigation
-}}
+{{#unless testSmartBannerVisible}}
+	{{site-head-fandom-bar
+		wikiaHomepage=wikiaHomepage
+		isVisible=displayFandomBar
+		globalNavigation=this.attrs.globalNavigation
+	}}
+{{/unless}}
 <div id="site-head-sub-header" class="{{unless displayFandomBar 'site-head-fandom-bar-hidden'}}"></div>
diff --git a/app/templates/components/smart-banner-test.hbs b/app/templates/components/smart-banner-test.hbs
@@ -2,7 +2,7 @@
 <a href="https://itunes.apple.com/us/developer/wikia-inc/id422467077" class="smart-banner-link">
 	<div class="sb-test-info">
 		<img class="sb-test-icon"
-			 src="/mobile-wiki/images/sb-test-ios.png">
+			 src="https://services.wikia.com/static-assets/image/9b0dfb2e-9a8e-4c2d-ab24-232664ebe6d3">
 		<div class="sb-test-meta">
 			<div class="sb-test-title">FANDOM</div>
 			<span class="sb-test-description">Get it free at the</span>