89 lines
		
	
	
	
		
			2.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			89 lines
		
	
	
	
		
			2.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| played_sound = false
 | |
| position = ''
 | |
| 
 | |
| function removeClass() {
 | |
| 	$("#main").removeClass();
 | |
| 	$("#wrapper").removeClass();
 | |
| }
 | |
| 
 | |
| window.addEventListener('message', function(event) {
 | |
| 	var sound = new Audio('sound.mp3');
 | |
| 	sound.volume = 0.2;
 | |
| 
 | |
| 	if (event.data.action == 'open') {
 | |
| 		position = event.data.position;
 | |
| 		message = event.data.message;
 | |
| 
 | |
| 		$('#message').html(message);
 | |
| 
 | |
| 		if (position == 'right') {
 | |
| 			$('#ui').css('left', '');
 | |
| 			$('#ui').css('right', '1%');
 | |
| 			$('#ui').removeClass('hideright');
 | |
| 			$('#ui').addClass('showright');
 | |
| 		} 
 | |
| 		if (position == 'left') {
 | |
| 			$('#ui').css('right', '');
 | |
| 			$('#ui').css('left', '1%');
 | |
| 			$('#ui').removeClass('hideleft');
 | |
| 			$('#ui').addClass('showleft');
 | |
| 		}   
 | |
|         
 | |
| 		if (event.data.color == 'lightblue') { // Light Blue
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('lightblue-icon');
 | |
| 			$('#wrapper').addClass('lightblue lightblue-border');
 | |
| 		} else if (event.data.color == 'lightgreen') { // Light Green
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('lightgreen-icon');
 | |
| 			$('#wrapper').addClass('lightgreen lightgreen-border');
 | |
| 		} else if (event.data.color == 'lightred') { // Light Red
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('lightred-icon');
 | |
| 			$('#wrapper').addClass('lightred lightred-border');
 | |
| 		} else if (event.data.color == 'lightgrey') { // Light Red
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('lightgrey-icon');
 | |
| 			$('#wrapper').addClass('lightgrey lightgrey-border');
 | |
| 		} else if (event.data.color == 'darkblue') { // Dark Blue
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('darkblue-icon');
 | |
| 			$('#wrapper').addClass('darkblue darkblue-border');
 | |
| 		} else if (event.data.color == 'darkgreen') { // Dark Green
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('darkgreen-icon');
 | |
| 			$('#wrapper').addClass('darkgreen darkgreen-border');
 | |
| 		} else if (event.data.color == 'darkred') { // Dark Red
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('darkred-icon');
 | |
| 			$('#wrapper').addClass('darkred darkred-border');
 | |
| 		} else if (event.data.color == 'darkgrey') { // Dark Grey
 | |
| 			removeClass();
 | |
| 			$('#main').addClass('darkgrey-icon');
 | |
| 			$('#wrapper').addClass('darkgrey darkgrey-border');
 | |
| 		}
 | |
| 
 | |
| 		if (played_sound == false) {
 | |
| 			played_sound = true;
 | |
| 		}
 | |
| 
 | |
| 	} else if (event.data.action == 'close') {
 | |
| 
 | |
| 		if (position == 'right') {
 | |
| 			$('#ui').removeClass('hideleft');
 | |
| 			$('#ui').removeClass('showleft');
 | |
| 			$('#ui').removeClass('showright');
 | |
| 			$('#ui').addClass('hideright');
 | |
| 		} 
 | |
| 
 | |
| 		if (position == 'left') {
 | |
| 			$('#ui').removeClass('hideright');
 | |
| 			$('#ui').removeClass('showright');
 | |
| 			$('#ui').removeClass('showleft');
 | |
| 			$('#ui').addClass('hideleft');
 | |
| 		}
 | |
| 	}
 | |
| 
 | |
| 	played_sound = false;
 | |
| })
 | |
| 
 | 
