153 lines
		
	
	
		
			4.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			153 lines
		
	
	
		
			4.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
|   <head>
 | |
|     <meta charset="utf-8" />
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
 | |
| 
 | |
|     <title>{{{title}}}</title>
 | |
|     <link rel="stylesheet" href="{{{base}}}dist/reveal.css" />
 | |
|     <link rel="stylesheet" href="{{{base}}}{{{themeUrl}}}" id="theme" />
 | |
|     <link rel="stylesheet" href="{{{base}}}{{{highlightThemeUrl}}}" />
 | |
| 	<link rel="stylesheet" href="{{{base}}}css/layout.css" />
 | |
| 
 | |
| 	{{#cssPaths}}
 | |
|     <link rel="stylesheet" href="{{{base}}}{{{.}}}" />
 | |
|     {{/cssPaths}}
 | |
| 
 | |
|     <script defer src="{{{base}}}dist/fontawesome/all.min.js"></script>
 | |
| 
 | |
| 	<script type="text/javascript">
 | |
| 
 | |
| 		function fitElements(){
 | |
| 			const itemsToFit = document.getElementsByClassName('fitText');
 | |
| 			for (const item in itemsToFit) {
 | |
| 				if (Object.hasOwnProperty.call(itemsToFit, item)) {
 | |
| 					var element = itemsToFit[item];
 | |
| 					fitElement(element,1, 1000);
 | |
| 					element.classList.remove('fitText');
 | |
| 				}
 | |
| 			}
 | |
| 		}
 | |
| 
 | |
| 		function fitElement(element, start, end){
 | |
| 
 | |
| 			let size = (end + start) / 2;
 | |
| 			element.style.fontSize = `${size}px`;
 | |
| 
 | |
| 			if(Math.abs(start - end) < 1){
 | |
| 				while(element.scrollHeight > element.offsetHeight){
 | |
| 					size--;
 | |
| 					element.style.fontSize = `${size}px`;
 | |
| 				}
 | |
| 				return;
 | |
| 			}
 | |
| 
 | |
| 			if(element.scrollHeight > element.offsetHeight){
 | |
| 				fitElement(element, start, size);
 | |
| 			} else {
 | |
| 				fitElement(element, size, end);
 | |
| 			}		
 | |
| 		}
 | |
| 
 | |
| 
 | |
| 		document.onreadystatechange = () => {
 | |
| 			fitElements();
 | |
| 	};
 | |
| 
 | |
| 
 | |
|         </script>
 | |
|   </head>
 | |
|   <body>
 | |
|     <div class="reveal">
 | |
|       <div class="slides">{{{slides}}}</div>
 | |
|     </div>
 | |
| 
 | |
|     <script src="{{{base}}}dist/reveal.js"></script>
 | |
| 
 | |
|     <script src="{{{base}}}plugin/markdown/markdown.js"></script>
 | |
|     <script src="{{{base}}}plugin/highlight/highlight.js"></script>
 | |
|     <script src="{{{base}}}plugin/zoom/zoom.js"></script>
 | |
|     <script src="{{{base}}}plugin/notes/notes.js"></script>
 | |
|     <script src="{{{base}}}plugin/math/math.js"></script>
 | |
| 	<script src="{{{base}}}plugin/mermaid/mermaid.js"></script>
 | |
| 	<script src="{{{base}}}plugin/chart/chart.min.js"></script>
 | |
| 	<script src="{{{base}}}plugin/chart/plugin.js"></script>
 | |
| 
 | |
|     <script>
 | |
|       function extend() {
 | |
|         var target = {};
 | |
|         for (var i = 0; i < arguments.length; i++) {
 | |
|           var source = arguments[i];
 | |
|           for (var key in source) {
 | |
|             if (source.hasOwnProperty(key)) {
 | |
|               target[key] = source[key];
 | |
|             }
 | |
|           }
 | |
|         }
 | |
|         return target;
 | |
|       }
 | |
| 
 | |
|       function isLight(color) {
 | |
|         let hex = color.replace('#', '');
 | |
| 
 | |
|         // convert #fff => #ffffff
 | |
|         if(hex.length == 3){
 | |
|           hex = `${hex[0]}${hex[0]}${hex[1]}${hex[1]}${hex[2]}${hex[2]}`;
 | |
|         }
 | |
| 
 | |
|         const c_r = parseInt(hex.substr(0, 2), 16);
 | |
|         const c_g = parseInt(hex.substr(2, 2), 16);
 | |
|         const c_b = parseInt(hex.substr(4, 2), 16);
 | |
|         const brightness = ((c_r * 299) + (c_g * 587) + (c_b * 114)) / 1000;
 | |
|         return brightness > 155;
 | |
|       }
 | |
| 
 | |
| 	var bgColor = getComputedStyle(document.documentElement).getPropertyValue('--r-background-color').trim();
 | |
| 
 | |
| 	if(isLight(bgColor)){
 | |
| 		document.body.classList.add('has-light-background');
 | |
| 	} else {
 | |
| 		document.body.classList.add('has-dark-background');
 | |
| 	}
 | |
| 
 | |
|       // default options to init reveal.js
 | |
|       var defaultOptions = {
 | |
|         controls: false,
 | |
|         progress: false,
 | |
|         history: false,
 | |
|         center: true,
 | |
|         transition: 'default', // none/fade/slide/convex/concave/zoom
 | |
|         plugins: [
 | |
|           RevealMarkdown,
 | |
|           RevealHighlight,
 | |
|           RevealZoom,
 | |
|           RevealNotes,
 | |
|           RevealMath.MathJax3,
 | |
| 		  RevealMermaid,
 | |
| 		  RevealChart,
 | |
|         ],
 | |
| 
 | |
| 		mathjax3: {
 | |
| 			mathjax: '{{{base}}}plugin/math/mathjax/tex-mml-chtml.js',
 | |
| 		},
 | |
|       };
 | |
| 
 | |
|       // options from URL query string
 | |
|       var queryOptions = Reveal().getQueryHash() || {};
 | |
| 
 | |
|       var options = extend(defaultOptions, {{{revealOptionsStr}}}, queryOptions);
 | |
| 
 | |
|       options.controls = false;
 | |
|       options.progress = false;
 | |
|       options.history = false;
 | |
|       options.overview = false;
 | |
|       options.slideNumber = false;
 | |
|       options.keyboard = false;
 | |
|     </script>
 | |
| 
 | |
|     <script>
 | |
|       Reveal.initialize(options);
 | |
|     </script>
 | |
|   </body>
 | |
| </html>
 |