| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | <html> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | <link rel="stylesheet" type="text/css" href="../css/editor.css"> | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-23 03:43:21 +04:00
										 |  |  | <style> | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-23 04:38:49 +04:00
										 |  |  | body.dark { | 
					
						
							|  |  |  | 	background: #0a0a0a; | 
					
						
							|  |  |  | 	color: silver; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | body.gray { | 
					
						
							|  |  |  | 	background: #333; | 
					
						
							|  |  |  | 	color: silver; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-23 03:43:21 +04:00
										 |  |  | </style> | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | <script src="../ext-lib/jquery.js"></script> | 
					
						
							|  |  |  | <script src="../ext-lib/jquery-ui.js"></script> | 
					
						
							|  |  |  | <script src="../lib/panels.js"></script> | 
					
						
							|  |  |  | <script src="../lib/editor.js"></script> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | <script> | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-23 04:38:49 +04:00
										 |  |  | function toggleThemes(){ | 
					
						
							|  |  |  | 	var b = $('body') | 
					
						
							|  |  |  | 	if(b.hasClass('gray')){ | 
					
						
							|  |  |  | 		b.removeClass('gray') | 
					
						
							|  |  |  | 		b.addClass('dark') | 
					
						
							|  |  |  | 	} else if(b.hasClass('dark')){ | 
					
						
							|  |  |  | 		b.removeClass('dark') | 
					
						
							|  |  |  | 	} else { | 
					
						
							|  |  |  | 		b.addClass('gray') | 
					
						
							|  |  |  | 	} | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-23 19:47:37 +04:00
										 |  |  | function toggleAutoHide(){ | 
					
						
							|  |  |  | 	var elem = $('.side-panel') | 
					
						
							|  |  |  | 	if(elem.attr('autohide') == 'off'){ | 
					
						
							|  |  |  | 		elem.attr('autohide', 'on') | 
					
						
							|  |  |  | 	} else { | 
					
						
							|  |  |  | 		elem.attr('autohide', 'off') | 
					
						
							|  |  |  | 	} | 
					
						
							|  |  |  | 	return false | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | $(function(){ | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	var panel = makePanel('Test Panel A', true) | 
					
						
							| 
									
										
										
										
											2013-12-23 03:43:21 +04:00
										 |  |  | 		.css({ | 
					
						
							|  |  |  | 			top: 50, | 
					
						
							|  |  |  | 			left: 50, | 
					
						
							|  |  |  | 		}) | 
					
						
							| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	makeSubPanel('Test Sub Panel A', true, panel) | 
					
						
							|  |  |  | 		.find('.content') | 
					
						
							|  |  |  | 			.html('<h1>Panel A</h1>') | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	makeSubPanel('Test Sub Panel B', true, panel) | 
					
						
							|  |  |  | 		.find('.content') | 
					
						
							|  |  |  | 			.html('<h2>Panel B</h2>') | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	makeSubPanel('Test Sub Panel C', true, panel) | 
					
						
							|  |  |  | 		.find('.content') | 
					
						
							|  |  |  | 			.html('<h3>Panel C</h3>') | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-23 03:43:21 +04:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | 
 | 
					
						
							|  |  |  | 	$('body') | 
					
						
							|  |  |  | 		.append(panel)	 | 
					
						
							|  |  |  | 		//.append(makePanel('Test Panel B', true)) | 
					
						
							|  |  |  | 		//.append(makePanel('Test Panel C', true)) | 
					
						
							| 
									
										
										
										
											2013-12-23 04:38:49 +04:00
										 |  |  | 		.append(makeSidePanel('left')) | 
					
						
							| 
									
										
										
										
											2013-12-23 03:43:21 +04:00
										 |  |  | 			 | 
					
						
							| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | 
 | 
					
						
							|  |  |  | }) | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | </script> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | <body> | 
					
						
							| 
									
										
										
										
											2013-12-23 19:47:37 +04:00
										 |  |  | 	<p>click <a href="javascript:toggleAutoHide()">here to toggle panel autohide</a> and <a href="javascript:toggleThemes()">here to toggle theme...</a></p> | 
					
						
							| 
									
										
										
										
											2013-12-11 02:47:44 +04:00
										 |  |  | 
 | 
					
						
							|  |  |  | </body> | 
					
						
							|  |  |  | </html> | 
					
						
							|  |  |  | <!-- vim:set ts=4 sw=4 : --> |