142 lines
		
	
	
		
			3.9 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
			
		
		
	
	
			142 lines
		
	
	
		
			3.9 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| # hi
 | |
| this showcases my worst idea yet; *extending markdown with inline javascript*
 | |
| 
 | |
| due to obvious reasons it's disabled by default, and can be enabled with `-emp`
 | |
| 
 | |
| the examples are by no means correct, they're as much of a joke as this feature itself
 | |
| 
 | |
| 
 | |
| ### sub-header
 | |
| nothing special about this one
 | |
| 
 | |
| 
 | |
| ## except/
 | |
| this one becomes a hyperlink to ./except/ thanks to
 | |
| * the `copyparty_pre` plugin at the end of this file
 | |
| * which is invoked as a markdown filter every time the document is modified
 | |
| * which looks for headers ending with a `/` and erwrites all headers below that
 | |
| 
 | |
| it is a passthrough to the markdown extension api, see https://marked.js.org/using_pro
 | |
| 
 | |
| in addition to the markdown extension functions, `ctor` will be called on document init
 | |
| 
 | |
| 
 | |
| ### these/
 | |
| and this one becomes ./except/these/
 | |
| 
 | |
| 
 | |
| #### ones.md
 | |
| finally ./except/these/ones.md
 | |
| 
 | |
| 
 | |
| ### also-this.md
 | |
| whic hshoud be ./except/also-this.md
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
| # ok
 | |
| now for another extension type, `copyparty_post` which is called to manipulate the generated dom instead
 | |
| 
 | |
| `copyparty_post` can have the following functions, all optional
 | |
| * `ctor` is called on document init
 | |
| * `render` is called when the dom is done but still in-memory
 | |
| * `render2` is called with the live browser dom as-displayed
 | |
| 
 | |
| ## post example
 | |
| 
 | |
| the values in the `ex:` columns are linkified to `example.com/$value`
 | |
| 
 | |
| | ex:foo       | bar      | ex:baz |
 | |
| | ------------ | -------- | ------ |
 | |
| | asdf         | nice     | fgsfds |
 | |
| | more one row | hi hello | aaa    |
 | |
| 
 | |
| and the table can be sorted by clicking the headers
 | |
| 
 | |
| the difference is that with `copyparty_pre` you'll probably break various copyparty features but if you use `copyparty_post` then future copyparty versions will probably break you
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
| # heres the plugins
 | |
| if there is anything below ths line in the preview then the plugin feature is disabled (good)
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
| ```copyparty_pre
 | |
| ctor() {
 | |
|     md_plug['h'] = {
 | |
|         on: false,
 | |
|         lv: -1,
 | |
|         path: []
 | |
|     }
 | |
| },
 | |
| walkTokens(token) {
 | |
|     if (token.type == 'heading') {
 | |
|         var h = md_plug['h'],
 | |
|             is_dir = token.text.endsWith('/');
 | |
|         
 | |
|         if (h.lv >= token.depth) {
 | |
|             h.on = false;
 | |
|         }
 | |
|         if (!h.on && is_dir) {
 | |
|             h.on = true;
 | |
|             h.lv = token.depth;
 | |
|             h.path = [token.text];
 | |
|         }
 | |
|         else if (h.on && h.lv < token.depth) {
 | |
|             h.path = h.path.slice(0, token.depth - h.lv);
 | |
|             h.path.push(token.text);
 | |
|         }
 | |
|         if (!h.on)
 | |
|             return false;
 | |
| 
 | |
|         var path = h.path.join('');
 | |
|         var emoji = is_dir ? '📂' : '📜';
 | |
|         token.tokens[0].text = '<a href="' + path + '">' + emoji + ' ' + path + '</a>';
 | |
|     }
 | |
|     if (token.type == 'paragraph') {
 | |
|         //console.log(JSON.parse(JSON.stringify(token.tokens)));
 | |
|         for (var a = 0; a < token.tokens.length; a++) {
 | |
|             var t = token.tokens[a];
 | |
|             if (t.type == 'text' || t.type == 'strong' || t.type == 'em') {
 | |
|                 var ret = '', text = t.text;
 | |
|                 for (var b = 0; b < text.length; b++)
 | |
|                     ret += (Math.random() > 0.5) ? text[b] : text[b].toUpperCase();
 | |
|                 
 | |
|                 t.text = ret;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
|     return true;
 | |
| }
 | |
| ```
 | |
| 
 | |
| 
 | |
| 
 | |
| ```copyparty_post
 | |
| render(dom) {
 | |
|     var ths = dom.querySelectorAll('th');
 | |
|     for (var a = 0; a < ths.length; a++) {
 | |
|         var th = ths[a];
 | |
|         if (th.textContent.indexOf('ex:') === 0) {
 | |
|             th.textContent = th.textContent.slice(3);
 | |
|             var nrow = 0;
 | |
|             while ((th = th.previousSibling) != null)
 | |
|                 nrow++;
 | |
|             
 | |
|             var trs = ths[a].parentNode.parentNode.parentNode.querySelectorAll('tr');
 | |
|             for (var b = 1; b < trs.length; b++) {
 | |
|                 var td = trs[b].childNodes[nrow];
 | |
|                 td.innerHTML = '<a href="//example.com/' + td.innerHTML + '">' + td.innerHTML + '</a>';
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| },
 | |
| render2(dom) {
 | |
|     window.makeSortable(dom.getElementsByTagName('table')[0]);
 | |
| }
 | |
| ```
 | 
