Tue Oct 09 2018
Copied to clipboard! Copy reply
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137
  • 138
  • 139
  • 140
  • 141
  • 142
  • 143
  • 144
  • 145
  • 146
  • 147
  • 148
  • 149
  • 150
  • 151
  • 152
  • 153
  • 154
  • 155
  • 156
  • 157
  • 158
  • 159
  • 160
  • 161
  • 162
  • 163
  • 164
  • 165
  • 166
  • 167
  • 168
  • 169
  • 170
  • 171
  • 172
  • 173
  • 174
  • 175
  • 176
  • 177
  • 178
  • 179
  • 180
  • 181
  • 182
  • 183
  • 184
  • 185
  • 186
  • 187
  • 188
  • 189
  • 190
  • 191
  • 192
  • 193
  • 194
  • 195
  • 196
  • 197
  • 198
  • 199
  • 200
  • 201
  • 202
  • 203
  • 204
  • 205
  • 206
  • 207
  • 208
  • 209
  • 210
  • 211
  • 212
  • 213
  • 214
  • 215
  • 216
  • 217
  • 218
  • 219
  • 220
  • 221
  • 222
  • 223
  • 224
  • 225
  • 226
  • 227
  • 228
  • 229
  • 230
  • 231
  • 232
  • 233
  • 234
  • 235
  • 236
  • 237
  • 238
  • 239
  • 240
  • 241
  • 242
  • 243
  • 244
  • 245
  • 246
  • 247
  • 248
  • 249
  • 250
  • 251
  • 252
  • 253
  • 254
  • 255
  • 256
  • 257
  • 258
  • 259
  • 260
  • 261
  • 262
  • 263
  • 264
  • 265
  • 266
  • 267
  • 268
  • 269
  • 270
  • 271
  • 272
  • 273
  • 274
  • 275
  • 276
  • 277
  • 278
  • 279
  • 280
  • 281
  • 282
  • 283
  • 284
  • 285
  • 286
  • 287
  • 288
  • 289
  • 290
  • 291
  • 292
  • 293
  • 294
  • 295
  • 296
  • 297
  • 298
  • 299
  • 300
  • 301
  • 302
  • 303
  • 304
  • 305
  • 306
  • 307
  • 308
  • 309
  • 310
  • 311
  • 312
  • 313
  • 314
  • 315
  • 316
  • 317
  • 318
  • 319
  • 320
  • 321
  • 322
  • 323
  • 324
  • 325
  • 326
  • 327
  • 328
  • 329
  • 330
  • 331
  • 332
  • 333
  • 334
  • 335
  • 336
  • 337
  • 338
  • 339
  • 340
  • 341
  • 342
  • 343
  • 344
  • 345
  • 346
  • 347
  • 348
  • 349
  • 350
  • 351
  • 352
  • 353
  • 354
  • 355
  • 356
  • 357
  • 358
  • 359
  • 360
  • 361
  • 362
  • 363
  • 364
  • 365
  • 366
  • 367
  • 368
  • 369
  • 370
  • 371
  • 372
  • 373
  • 374
  • 375
  • 376
  • 377
  • 378
  • 379
  • 380
  • 381
  • 382
  • 383
  • 384
  • 385
  • 386
  • 387
  • 388
  • 389
  • 390
  • 391
  • 392
  • 393
  • 394
  • 395
  • 396
  • 397
  • 398
  • 399
  • 400
  • 401
  • 402
  • 403
  • 404
  • 405
  • 406
  • 407
  • 408
  • 409
  • 410
  • 411
  • 412
  • 413
  • 414
  • 415
  • 416
/*
WS-3016 - Q4 special offers (on-page bonus offers in product boxes)

	Description:
		This system lets you update mastheads, skus, and bonus offers for all relevant levels on a schedule.

	Instructions:
		1. You can run one offer now or run offers on a schedule. Just scroll to the part that says "CHOOSE OFFER FUNCTIONALITY HERE"
		2. You can edit the schedule and offer types in the designated sections. Copy the patterns you see there.
*/


/*
todo:
	- input exact skus, offers, and messages
*/


(function(){


	// ********************************************************************************
	// CHOOSE OFFER FUNCTIONALITY HERE
	//     Either apply one offer directly or run offers on schedule
	// ********************************************************************************

	var which_offer_to_run = 'examplebdi'; // either pick a specific offer name or say 'schedule'



	// ********************************************************************************
	// SET SCHEDULE AND OFFER TYPES HERE
	// ********************************************************************************


	var schedule = [
		{
			start_date: '02 Oct 2018 00:00:00',
			end_date: '02 Oct 2018 23:59:59',
			offer_name: 'examplebdi'
		}
	];



	var offers = {
		'examplebdi': {
			mastheads: {
				'mobile': 'https://www.rosettastone.com/lp/common-modules/assets/modules_2018/tutor-screen.png',
				'desktop': 'https://www.rosettastone.com/lp/common-modules/assets/modules_2018/tutor-screen.png'
			},
			offer_type: 'bonus_months_high'
		}
	};



	var offer_types = {


		// *******************************************
		// BONUS MONTHS
		// *******************************************

		'bonus_months_low':{
			'12': {
				message: '+1 Month Free',
				replacement_sku: '12_REPLACEMENT_SKU_HERE'
			},
			'24': {
				message: '+3 Months Free',
				replacement_sku: '24_REPLACEMENT_SKU_HERE'
			}
		},
		'bonus_months_high':{
			'12': {
				message: '+3 Months Free',
				replacement_sku: '12_REPLACEMENT_SKU_HERE'
			},
			'24': {
				message: '+6 Months Free',
				replacement_sku: '24_REPLACEMENT_SKU_HERE'
			}
		},



		// *******************************************
		// EXTRA USER
		// *******************************************

		'extra_user':{
			'06': {
				message: 'Buy 6 Months and | Give 6 Months FREE',
				second_sku: '06M_SECOND_SKU_HERE'
			},
			'12': {
				message: 'Line 1 goes here | Line 2 goes here',
				second_sku: '12M_SECOND_SKU_HERE'
			},
			'24': {
				message: 'Line 1 goes here | Line 2 goes here',
				second_sku: '24M_SECOND_SKU_HERE'
			}
		},




		// *******************************************
		// EXTRA GIFT
		// *******************************************

		'extra_gift':{
			'06': {
				message: 'Buy 6 Months and | Give 6 Months FREE',
				second_sku: '06M_SECOND_SKU_HERE'
			},
			'12': {
				message: 'Line 1 goes here | Line 2 goes here',
				second_sku: '12M_SECOND_SKU_HERE'
			},
			'24': {
				message: 'Line 1 goes here | Line 2 goes here',
				second_sku: '24M_SECOND_SKU_HERE'
			}
		}
	};







	// ********************************************************************************
	// CORE FUNCTIONALITY
	//     No need to edit below here unless you want to change how the offers work
	// ********************************************************************************


	function pick_offer_method(which_offer_to_run){
		if(which_offer_to_run === 'schedule'){
			run_offers_on_schedule(schedule); // this runs the offers according to the schedule
		}
		else{
			apply_offer(which_offer_to_run); // this runs an offer directly by name
		}
	}
	pick_offer_method(which_offer_to_run);




	function run_offers_on_schedule(schedule){
		var date = Date.now();
		for(var i=0; i<schedule.length; i++){
			var start_date = Date.parse(schedule[i].start_date);
			var end_date = Date.parse(schedule[i].end_date);
			if(start_date <= date && date <= end_date){
				apply_offer(schedule[i].offer_name);
				return;
			}
		}
	}


	function format_offer_message(offer_type, message){
		var formatted_message = message;

		if((/bonus_months/i).test(offer_type)){
			var words = message.split(' ');
			var formatted_message = ''
				+ '<div class="bonus_months_number">'
					+ words[0]
				+ '</div>'
				+ '<div class="bonus_months_words">'
					+ '<div>'
						+ words[1]
					+ '</div>'
					+ '<div>'
						+ words[2]
					+ '</div>'
				+ '</div>'
			+ '';
		}

		if((/extra_/i).test(offer_type)){
			var lines = message.split('|');
			var formatted_message = ''
				+ '<div class="bonus_line_1">'
					+ lines[0].trim()
				+ '</div>'
				+ '<div class="bonus_line_2">'
					+ lines[1].trim()
				+ '</div>'
			+ '';
		}

		return formatted_message;
	}




	function update_masthead(offer){

		if(offer.mastheads){

			var style = document.createElement('style');
			style.id = 'masthead_change';
			var masthead = document.querySelector('#masthead');

			style.innerHTML = ''
				+'body #masthead{'
					+'background-image: url(' + offer.mastheads.mobile + ');'
				+'}'
				+'@media (min-width: 600px) {'
					+'body #masthead{'
						+'background-image: url(' + offer.mastheads.desktop + ');'
					+'}'
				+'}'
			+'';

			masthead.appendChild(style);
		}
	}




	function _$(selector){
		var elems = Array.prototype.slice.call(document.querySelectorAll(selector));
		return {
			elems: elems,
			attr: function(attr, value){
				elems.forEach(function(elem){
					var original_attr = elem.getAttribute(attr);
					var final_value = typeof value === 'function' ? value(original_attr) : value;
					elem.setAttribute(attr, final_value);
				});
				return this;
			},
			show: function(display_property){
				elems.forEach(function(elem){
					elem.style.display = display_property || 'block';
				});
				return this;
			},
			hide: function(){
				elems.forEach(function(elem){
					elem.style.display = 'none';
				});
				return this;
			},
			html: function(inner_html){
				elems.forEach(function(elem){
					elem.innerHTML = inner_html;
				});
				return this;
			}
		};
	}



	function apply_offer(offer_name){
		var set_up_offer = (function(offers, offer_name){
			var offer = offers[offer_name];
			update_masthead(offer);

			add_bonus_elements();

			update_all_cart_buttons(offer);
			show_all_bonuses(offer);
			protect_product_changes_on_lang_change(offer);

			add_bonus_styles();

		}).bind(this, offers);

		set_up_offer(offer_name);
	}



	function add_bonus_elements(){
		// this function makes sure .bonus divs are available for all levels instead of just 12 and 24
		_$('.product-d .header, .product-m').elems.forEach(function(elem){
			if(!elem.querySelector('.bonus')){
				var div = document.createElement('div');
				div.className = 'bonus';
				elem.appendChild(div);
			}
		});
	}


	function add_bonus_styles(){

		var style = document.createElement('style');
		style.id = 'masthead_change';

		style.innerHTML = ''
			+ '.products-desktop .container{'
				+ 'align-items: flex-end;'
			+ '}'
			+ '.product-d .best-value{'
				+ 'background-color: #262626;'
			+ '}'
			+ '.product-d .header > div.bonus {'
				+ 'font-size: 80%;'
				+ 'font-weight: 100;'
				+ 'position: relative;'
				+ 'bottom: -7px;'
				+ 'display: none;'

				+ 'background-color: #437414;'
				+ 'color: #fff;'
				+ 'padding: 10px;'
				+ 'margin: -30px 20px 0px;'
				+ 'bottom: -41px;'
				+ 'font-family: gothammedium, sans-serif;'
			+ '}'
			+ '.bonus_months_number{'
				+ 'display: inline-block !important;'
				+ 'font-size: 40px;'
				+ 'line-height: 1;'
				+ 'margin-right: 8px;'
			+ '}'
			+ '.bonus_months_words{'
				+ 'display: inline-block;'
				+ 'text-align: left;'
				+ 'line-height: 1;'
				+ 'text-transform: uppercase;'
			+ '}'
			+ '.bonus_months_words div:nth-of-type(1) {'
				+ 'font-size: 11px;'
			+ '}'
			+ '.bonus_months_words div:nth-of-type(2) {'
				+ 'font-size: 19px;'
			+ '}'
			+ '.bonus_line_1 {'
				+ 'line-height: 1.2;'
				+ 'font-family: gothamlight, sans-serif;'
				+ 'font-size: 15px;'
			+ '}'
			+ '.bonus_line_2 {'
				+ 'font-size: 15px;'
				+ 'line-height: 1.2;'
			+ '}'
		+'';

		document.body.appendChild(style);
	}

	function show_all_bonuses(offer){
		add_bonus_styles();

		var products = offer_types[offer.offer_type];

		for(var lvl in products){
			show_bonus(lvl, offer);
		}
	}


	function show_bonus(lvl, offer){
		var message = offer_types[offer.offer_type][lvl].message;
		var formatted_message = format_offer_message(offer.offer_type, message);
		_$('*[data-lvl="'+lvl+'"] .bonus').html(formatted_message).show();
	}


	function update_all_cart_buttons(offer){
		var offers_details_by_level = offer_types[offer.offer_type];
		for(var lvl in offers_details_by_level){
			var offer_details = offers_details_by_level[lvl];
			update_cart_button(lvl, offer_details);
		}
	}


	function update_cart_button(lvl, offer_details){
		var replacement_sku = offer_details.replacement_sku;
		var second_sku = offer_details.second_sku;

		var desktop_cart_btn_selector = '*[data-lvl="'+lvl+'"] .add-to-cart';
		var mobile_cart_btn_selector = 'a.product-m[data-lvl="'+lvl+'"]';
		_$( desktop_cart_btn_selector + ', '+ mobile_cart_btn_selector ).attr('href', function(original_href){
			var new_href = original_href;
			if(replacement_sku){
				new_href = original_href.replace(/\/\d+\//, '/'+replacement_sku+'/');
			}
			if(second_sku){
				new_href = original_href.replace(/\/sku\//, '/multi_sku/')
										.replace(/\/(\d+)\//, '/$1-'+second_sku+'/')
										.replace(/\/category_id\/(\w+)\//, '/multi_category_id/$1-fra');
			}
			return new_href;
		});
	}


	function protect_product_changes_on_lang_change(offer){
		window.jQuery && (function($){
			$(document).on('lang_change', function(){
				
				update_all_cart_buttons(offer);
			});
		})(window.jQuery);
	}



})();