sandbox.html (27628B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <!-- Sep 03, 2024 --> 5 <meta charset="utf-8" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1" /> 7 <title>Emacs org-mode sandbox</title> 8 <meta name="author" content="Vincent Demeester" /> 9 <meta name="keywords" content="post" /> 10 <meta name="generator" content="Org Mode" /> 11 <link rel="stylesheet" type="text/css" href="./css/2022.css" /> 12 <link rel="stylesheet" type="text/css" href="./css/syntax.css" /> 13 <link rel='icon' type='image/x-icon' href='./images/favicon.ico'/> 14 <meta name='viewport' content='width=device-width, initial-scale=1'> 15 <script> 16 window.MathJax = { 17 tex: { 18 ams: { 19 multlineWidth: '85%' 20 }, 21 tags: 'ams', 22 tagSide: 'right', 23 tagIndent: '.8em' 24 }, 25 chtml: { 26 scale: 1.0, 27 displayAlign: 'center', 28 displayIndent: '0em' 29 }, 30 svg: { 31 scale: 1.0, 32 displayAlign: 'center', 33 displayIndent: '0em' 34 }, 35 output: { 36 font: 'mathjax-modern', 37 displayOverflow: 'overflow' 38 } 39 }; 40 </script> 41 42 <script 43 id="MathJax-script" 44 async 45 src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"> 46 </script> 47 </head> 48 <body> 49 <main id="content" class="content"> 50 <header> 51 <h1 class="title">Emacs org-mode sandbox</h1> 52 <p class="subtitle" role="doc-subtitle">A Clean and Comfort Stylesheet</p> 53 </header><div class="abstract" id="org648f347"> 54 <p> 55 56 </p> 57 58 <p> 59 This article serves as a complete demonstration for my <a href="notes.css">org.css</a>, a simple and 60 clean stylesheet for org-exported HTML file. You may switch between the default 61 style provided by Emacs Org mode, i.e., styles specified in the variable 62 <code>org-html-style-default</code> and my customized stylesheet using the button at the 63 top left corner. 64 </p> 65 66 </div> 67 68 <nav id="table-of-contents" role="doc-toc"> 69 <h2>Table of Contents</h2> 70 <div id="text-table-of-contents" role="doc-toc"> 71 <ul> 72 <li><a href="#sec:demo">Demo</a> 73 <ul> 74 <li><a href="#Title%20with%20TODO">Title with TODO</a></li> 75 <li><a href="#Title%20with%20DONE%20%28and%20scheduled%29">Title with DONE (and scheduled)</a></li> 76 <li><a href="#Title%20with%20DONE%20%28and%20deadline%29">Title with DONE (and deadline)</a></li> 77 <li><a href="#Title%20with%20Priority">Title with Priority</a></li> 78 <li><a href="#Title%20with%20Tag">Title with Tag   <span class="tag"><span class="tag0">tag0</span> <span class="tag1">tag1</span></span></a></li> 79 <li><a href="#Miscellaneous">Miscellaneous</a></li> 80 </ul> 81 </li> 82 <li><a href="#Org-mode%20links">Org-mode links   <span class="tag"><span class="emacs">emacs</span></span></a> 83 <ul> 84 <li><a href="#Host%20dependent%20link">Host dependent link</a></li> 85 <li><a href="#Github%20links">Github links</a></li> 86 <li><a href="#~man~"><code>man</code></a></li> 87 <li><a href="#Others">Others</a></li> 88 </ul> 89 </li> 90 <li><a href="#Org-babel">Org-babel</a> 91 <ul> 92 <li><a href="#~emacs-lisp~"><code>emacs-lisp</code></a></li> 93 <li><a href="#~go~"><code>go</code></a></li> 94 <li><a href="#~http~"><code>http</code></a></li> 95 <li><a href="#~rust~"><code>rust</code></a></li> 96 <li><a href="#~typescript~"><code>typescript</code></a></li> 97 <li><a href="#Ditaa">Ditaa</a></li> 98 <li><a href="#Graphviz">Graphviz</a></li> 99 <li><a href="#References%20and%20labels%20%21">References and labels !</a></li> 100 </ul> 101 </li> 102 <li><a href="#Counsel">Counsel</a></li> 103 <li><a href="#sec:known-issues">Known Issues</a> 104 <ul> 105 <li><a href="#sec:dangling-element"><del>Dangling Element</del>   <span class="tag"><span class="solved">solved</span></span></a></li> 106 </ul> 107 </li> 108 </ul> 109 </div> 110 </nav> 111 112 <p> 113 Hello <code>world</code> vs <code>world</code> 🙃 114 </p> 115 <section id="outline-container-sec:demo" class="outline-2"> 116 <h2 id="sec:demo">Demo</h2> 117 <div class="outline-text-2" id="text-sec:demo"> 118 <p> 119 <span class="timestamp-wrapper"><span class="timestamp"><2015-11-09 Mon 14:41></span></span> 120 </p> 121 122 <blockquote> 123 <p> 124 125 </p> 126 127 <p> 128 <a href="http://orgmode.org/">Org mode</a> is for keeping notes, maintaining TODO lists, planning projects, 129 and authoring documents with a fast and effective <i>plain-text</i> system 130 cite:dominik2003-org. 131 </p> 132 </blockquote> 133 134 135 <p> 136 We use <a href="https://en.wikipedia.org/wiki/Lorem_ipsum">Lorem ipsum</a> text to demonstrate all elements you would expect to see in 137 the org-exported HTML pages. Note however that the <code>.title</code>, <code>.subtitle</code> and 138 <code>#postamble</code> element are not included in this section. 139 </p> 140 </div> 141 <div id="outline-container-Title%20with%20TODO" class="outline-3"> 142 <h3 id="Title%20with%20TODO">Title with TODO</h3> 143 </div> 144 145 <div id="outline-container-Title%20with%20DONE%20%28and%20scheduled%29" class="outline-3"> 146 <h3 id="Title%20with%20DONE%20%28and%20scheduled%29">Title with DONE (and scheduled)</h3> 147 <div class="outline-text-3" id="text-Title%20with%20DONE%20%28and%20scheduled%29"> 148 </div> 149 </div> 150 <div id="outline-container-Title%20with%20DONE%20%28and%20deadline%29" class="outline-3"> 151 <h3 id="Title%20with%20DONE%20%28and%20deadline%29">Title with DONE (and deadline)</h3> 152 <div class="outline-text-3" id="text-Title%20with%20DONE%20%28and%20deadline%29"> 153 <p> 154 Some inactive timestamps 155 </p> 156 157 <p> 158 <span class="timestamp-wrapper"><span class="timestamp">[2019-02-20 Wed 12:03] </span></span> With time ! 159 </p> 160 161 <p> 162 Let’s write some stuff between the two ! 163 </p> 164 165 <p> 166 <span class="timestamp-wrapper"><span class="timestamp">[2019-02-20 Wed] </span></span> Without time 167 </p> 168 169 <p> 170 Maybe also some <b>active</b> timestamps 171 </p> 172 173 <p> 174 <span class="timestamp-wrapper"><span class="timestamp"><2022-05-07 Sat> </span></span> Without time as well 175 </p> 176 </div> 177 </div> 178 <div id="outline-container-Title%20with%20Priority" class="outline-3"> 179 <h3 id="Title%20with%20Priority">Title with Priority</h3> 180 </div> 181 182 <div id="outline-container-Title%20with%20Tag" class="outline-3"> 183 <h3 id="Title%20with%20Tag">Title with Tag   <span class="tag"><span class="tag0">tag0</span> <span class="tag1">tag1</span></span></h3> 184 </div> 185 186 <div id="outline-container-Miscellaneous" class="outline-3"> 187 <h3 id="Miscellaneous">Miscellaneous</h3> 188 <div class="outline-text-3" id="text-Miscellaneous"> 189 <div id="text-table-of-contents-1" role="doc-toc"> 190 <ul> 191 <li><a href="#Table">Table</a></li> 192 <li><a href="#List">List</a></li> 193 <li><a href="#Picture">Picture</a></li> 194 <li><a href="#Math">Math</a></li> 195 </ul> 196 </div> 197 </div> 198 <div id="outline-container-Table" class="outline-4"> 199 <h4 id="Table">Table</h4> 200 <div class="outline-text-4" id="text-Table"> 201 <table> 202 <caption class="t-above"><span class="table-number">Table 1:</span> Table Caption</caption> 203 204 <colgroup> 205 <col class="org-right"> 206 207 <col class="org-right"> 208 209 <col class="org-right"> 210 211 <col class="org-right"> 212 213 <col class="org-right"> 214 215 <col class="org-right"> 216 </colgroup> 217 <thead> 218 <tr> 219 <th scope="col" class="org-right">\(N\)</th> 220 <th scope="col" class="org-right">\(N^2\)</th> 221 <th scope="col" class="org-right">\(N^3\)</th> 222 <th scope="col" class="org-right">\(N^4\)</th> 223 <th scope="col" class="org-right">\(\sqrt n\)</th> 224 <th scope="col" class="org-right">\(\sqrt[4]N\)</th> 225 </tr> 226 </thead> 227 <tbody> 228 <tr> 229 <td class="org-right">1</td> 230 <td class="org-right">1</td> 231 <td class="org-right">1</td> 232 <td class="org-right">1</td> 233 <td class="org-right">1</td> 234 <td class="org-right">1</td> 235 </tr> 236 237 <tr> 238 <td class="org-right">2</td> 239 <td class="org-right">4</td> 240 <td class="org-right">8</td> 241 <td class="org-right">16</td> 242 <td class="org-right">1.4142</td> 243 <td class="org-right">1.1892</td> 244 </tr> 245 246 <tr> 247 <td class="org-right">3</td> 248 <td class="org-right">9</td> 249 <td class="org-right">27</td> 250 <td class="org-right">81</td> 251 <td class="org-right">1.7321</td> 252 <td class="org-right">1.3161</td> 253 </tr> 254 </tbody> 255 </table> 256 </div> 257 </div> 258 <div id="outline-container-List" class="outline-4"> 259 <h4 id="List">List</h4> 260 <div class="outline-text-4" id="text-List"> 261 </div> 262 <ul class="org-ul"> 263 <li><a id="The%20ordered%20list"></a>The ordered list<br> 264 <div class="outline-text-5" id="text-The%20ordered%20list"> 265 <ol class="org-ol"> 266 <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li> 267 <li>Donec et massa sit amet ligula maximus feugiat.</li> 268 <li>Morbi consequat orci et tincidunt sagittis.</li> 269 </ol> 270 </div> 271 </li> 272 <li><a id="Unordered%20list"></a>Unordered list<br> 273 <div class="outline-text-5" id="text-Unordered%20list"> 274 <ul class="org-ul"> 275 <li>Aliquam non metus nec elit pellentesque scelerisque.</li> 276 <li>In accumsan nunc ac orci varius hendrerit.</li> 277 <li>Suspendisse non eros eu nisi finibus maximus.</li> 278 </ul> 279 </div> 280 </li> 281 <li><a id="Unordered%20checked%20list%20%5B1%2F3%5D"></a>Unordered checked list <code>[1/3]</code><br> 282 <div class="outline-text-5" id="text-Unordered%20checked%20list%20%5B1%2F3%5D"> 283 <ul class="org-ul"> 284 <li class="on">☑ Aliquam non metus nec elit pellentesque scelerisque.</li> 285 <li class="off">☐ In accumsan nunc ac orci varius hendrerit.</li> 286 <li class="off">☐ Suspendisse non eros eu nisi finibus maximus.</li> 287 </ul> 288 </div> 289 </li> 290 <li><a id="Definition%20list"></a>Definition list<br> 291 <div class="outline-text-5" id="text-Definition%20list"> 292 <aside id="org5754a81"> 293 <p> 294 This is a side note. If collection is a string, item must also be a string, and is 295 compared using <code>strings.Contains()</code>. If collection is a Map, contains will succeed if item 296 is a key in the map. 297 </p> 298 </aside> 299 300 <dl class="org-dl"> 301 <dt>Lorem ipsum</dt><dd>dolor sit amet, consectetur adipiscing elit. Mauris laoreet 302 sollicitudin venenatis. Duis sed consequat dolor.</dd> 303 <dt>Etiam feugiat</dt><dd>pharetra sapien et semper. Nunc ornare lacus sit amet massa 304 auctor, vitae aliquam eros interdum. Mauris arcu ante, imperdiet vel purus 305 ac, bibendum faucibus diam. Ut blandit nec mi at ultricies. Donec eget 306 mattis nisl. In sed nibh felis. Cras quis convallis orci.</dd> 307 <dt>Sed aliquam</dt><dd>odio sed faucibus aliquam, arcu augue elementum justo, ut 308 vulputate ligula sem in augue. Maecenas ante felis, pellentesque auctor 309 semper non, eleifend quis ante. Fusce enim orci, suscipit ac dapibus et, 310 fermentum eu tortor. Duis in facilisis ante, quis faucibus dolor. Etiam 311 maximus lorem quis accumsan vehicula.</dd> 312 </dl> 313 </div> 314 </li> 315 <li><a id="Drawers"></a>Drawers<br> 316 <div class="outline-text-5" id="text-Drawers"> 317 <p> 318 Still outside the drawer 319 </p> 320 321 <div class='drawer generic'> 322 <h6>Generic</h6> 323 <p> 324 This is inside the drawer. 325 </p> 326 </div> 327 328 <p> 329 And an update 😉 330 </p> 331 332 <div class='drawer update'> 333 <h6>Update</h6> 334 <p> 335 This is an update :) 336 </p> 337 </div> 338 339 <p> 340 After the drawer. 341 </p> 342 343 <div class='drawer note'> 344 <h6>Note</h6> 345 <p> 346 This is a note 347 </p> 348 </div> 349 <div class='drawer info'> 350 <h6>Info</h6> 351 <p> 352 This is an info 353 </p> 354 </div> 355 <div class='drawer tip'> 356 <h6>Tip</h6> 357 <p> 358 This is a tip 359 </p> 360 </div> 361 <div class='drawer warning'> 362 <h6>Warning</h6> 363 <p> 364 This is a warning 365 </p> 366 </div> 367 </div> 368 </li> 369 </ul> 370 </div> 371 <div id="outline-container-Picture" class="outline-4"> 372 <h4 id="Picture">Picture</h4> 373 <div class="outline-text-4" id="text-Picture"> 374 375 <figure id="org2eda69b"> 376 <img src="./images/sandbox/pic-demo.png" alt="pic-demo.png" class="shadow"> 377 378 <figcaption><span class="figure-number">Figure 1: </span>Demo Picture with Caption</figcaption> 379 </figure> 380 381 <p> 382 And a really wide picture. 383 </p> 384 385 386 <figure id="orgbba5ba9"> 387 <img src="./images/sandbox/long-img.png" alt="long-img.png" width="100%"> 388 389 <figcaption><span class="figure-number">Figure 2: </span>A really long picture</figcaption> 390 </figure> 391 </div> 392 </div> 393 <div id="outline-container-Math" class="outline-4"> 394 <h4 id="Math">Math</h4> 395 <div class="outline-text-4" id="text-Math"> 396 \begin{align} 397 \mathcal{F}(a) &= \frac{1}{2\pi i}\oint_\gamma \frac{f(z)}{z - a}\,dz\\ 398 \int_D (\nabla\cdot \mathcal{F})\,dV &=\int_{\partial D}\mathcal{F}\cdot n\, dS 399 \end{align} 400 </div> 401 </div> 402 </div> 403 </section> 404 <section id="outline-container-Org-mode%20links" class="outline-2"> 405 <h2 id="Org-mode%20links">Org-mode links   <span class="tag"><span class="emacs">emacs</span></span></h2> 406 <div class="outline-text-2" id="text-Org-mode%20links"> 407 </div> 408 <div id="outline-container-Host%20dependent%20link" class="outline-3"> 409 <h3 id="Host%20dependent%20link">Host dependent link</h3> 410 <div class="outline-text-3" id="text-Host%20dependent%20link"> 411 <ul class="org-ul"> 412 <li>grep:foo:~/src/github.com/vdemeester</li> 413 <li>rg:foo:~/src/github.com/vdemeester</li> 414 </ul> 415 </div> 416 </div> 417 <div id="outline-container-Github%20links" class="outline-3"> 418 <h3 id="Github%20links">Github links</h3> 419 <div class="outline-text-3" id="text-Github%20links"> 420 <ul class="org-ul"> 421 <li><a hrefl="_blank" href="https://github.com/vdemeester/ape">vdemeester/ape</a></li> 422 <li><a hrefl="_blank" href="https://github.com/knative/build-pipeline/issues/123">A super PR here</a></li> 423 <li><a hrefl="_blank" href="https://github.com/knative/build-pipeline/issues/123">knative/build-pipeline#123</a></li> 424 </ul> 425 </div> 426 </div> 427 <div id="outline-container-~man~" class="outline-3"> 428 <h3 id="~man~"><code>man</code></h3> 429 <div class="outline-text-3" id="text-~man~"> 430 <ul class="org-ul"> 431 <li><a target="_blank" href="http://man.he.net/?topic=tmux§ion=all">tmux</a></li> 432 <li><a target="_blank" href="http://man.he.net/?topic=git§ion=all">git</a></li> 433 434 <li><a target="_blank" href="http://man.he.net/?topic=git-commit§ion=all">Manpage for git-commit</a></li> 435 <li><a href="https://orgmode.org/manual/store_002dlink-protocol.html">The Org Manual: store-link protocol</a></li> 436 </ul> 437 </div> 438 </div> 439 <div id="outline-container-Others" class="outline-3"> 440 <h3 id="Others">Others</h3> 441 <div class="outline-text-3" id="text-Others"> 442 <ul class="org-ul"> 443 <li>tag:foo</li> 444 445 <li>orgit:~/src/tektoncd/pipeline</li> 446 </ul> 447 </div> 448 </div> 449 </section> 450 <section id="outline-container-Org-babel" class="outline-2"> 451 <h2 id="Org-babel">Org-babel</h2> 452 <div class="outline-text-2" id="text-Org-babel"> 453 </div> 454 <div id="outline-container-~emacs-lisp~" class="outline-3"> 455 <h3 id="~emacs-lisp~"><code>emacs-lisp</code></h3> 456 <div class="outline-text-3" id="text-~emacs-lisp~"> 457 <div class="org-src-container"> 458 <pre class="src src-emacs-lisp">(message <span class="org-string">"foo is bar"</span>) 459 </pre> 460 </div> 461 462 <div class='drawer results'> 463 <h6>Results</h6> 464 <p> 465 foo is bar 466 </p> 467 </div> 468 </div> 469 </div> 470 <div id="outline-container-~go~" class="outline-3"> 471 <h3 id="~go~"><code>go</code></h3> 472 <div class="outline-text-3" id="text-~go~"> 473 <div class="org-src-container"> 474 <pre class="src src-go">fmt.Println("Hello, 世界") 475 </pre> 476 </div> 477 478 <div class='drawer results'> 479 <h6>Results</h6> 480 <p> 481 Hello, 世界 482 </p> 483 </div> 484 </div> 485 </div> 486 <div id="outline-container-~http~" class="outline-3"> 487 <h3 id="~http~"><code>http</code></h3> 488 <div class="outline-text-3" id="text-~http~"> 489 <div class="org-src-container"> 490 <pre class="src src-http">POST http://httpbin.org/post 491 Content-Type: application/json 492 493 { 494 "key": "value" 495 } 496 </pre> 497 </div> 498 499 <div class='drawer results'> 500 <h6>Results</h6> 501 <p> 502 { 503 “url”: “<a href="http://httpbin.org/post">http://httpbin.org/post</a>”, 504 “json”: { 505 “key”: “value” 506 }, 507 “headers”: { 508 “User-Agent”: “curl/7.35.0”, 509 “Host”: “httpbin.org”, 510 “Content-Type”: “application/json”, 511 “Content-Length”: “18”, 512 “Accept”: “<b>/</b>” 513 }, 514 “form”: {}, 515 “files”: {}, 516 “data”: “{ \”key\“: \”value\“}”, 517 “args”: {} 518 } 519 </p> 520 </div> 521 </div> 522 </div> 523 <div id="outline-container-~rust~" class="outline-3"> 524 <h3 id="~rust~"><code>rust</code></h3> 525 <div class="outline-text-3" id="text-~rust~"> 526 <div class="org-src-container"> 527 <pre class="src src-rust">fn main() { 528 let greetings = ["Hello", "Hola", "Bonjour", 529 "Ciao", "こんにちは", "안녕하세요", 530 "Cześć", "Olá", "Здравствуйте", 531 "chào bạn", "您好"]; 532 533 for (num, greeting) in greetings.iter().enumerate() { 534 print!("{} : ", greeting); 535 match num { 536 0 => println!("This code is editable and runnable!"), 537 1 => println!("Este código es editable y ejecutable!"), 538 2 => println!("Ce code est modifiable et exécutable!"), 539 3 => println!("Questo codice è modificabile ed eseguibile!"), 540 4 => println!("このコードは編集して実行出来ます！"), 541 5 => println!("여기에서 코드를 수정하고 실행할 수 있습니다!"), 542 6 => println!("Ten kod można edytować oraz uruchomić!"), 543 7 => println!("Esse código é editável e executável!"), 544 8 => println!("Этот код можно отредактировать и запустить!"), 545 9 => println!("Bạn có thể edit và run code trực tiếp!"), 546 10 => println!("这段代码是可以编辑并且能够运行的！"), 547 _ => {}, 548 } 549 } 550 } 551 </pre> 552 </div> 553 554 <div class='drawer results'> 555 <h6>Results</h6> 556 <p> 557 Hello : This code is editable and runnable! 558 Hola : Este código es editable y ejecutable! 559 Bonjour : Ce code est modifiable et exécutable! 560 Ciao : Questo codice è modificabile ed eseguibile! 561 こんにちは : このコードは編集して実行出来ます！ 562 안녕하세요 : 여기에서 코드를 수정하고 실행할 수 있습니다! 563 Cześć : Ten kod można edytować oraz uruchomić! 564 Olá : Esse código é editável e executável! 565 Здравствуйте : Этот код можно отредактировать и запустить! 566 chào bạn : Bạn có thể edit và run code trực tiếp! 567 您好 : 这段代码是可以编辑并且能够运行的！ 568 </p> 569 </div> 570 </div> 571 </div> 572 <div id="outline-container-~typescript~" class="outline-3"> 573 <h3 id="~typescript~"><code>typescript</code></h3> 574 <div class="outline-text-3" id="text-~typescript~"> 575 </div> 576 <div id="outline-container-Execute%20with%20node.js" class="outline-4"> 577 <h4 id="Execute%20with%20node.js">Execute with node.js</h4> 578 <div class="outline-text-4" id="text-Execute%20with%20node.js"> 579 <div class="org-src-container"> 580 <pre class="src src-typescript">module Greeting { 581 export class Hello { 582 constructor(private text : string) { 583 } 584 say() :void{ 585 console.log(this.text); 586 } 587 } 588 } 589 590 var hello : Greeting.Hello = new Greeting.Hello("Hello, World!"); 591 hello.say(); 592 </pre> 593 </div> 594 595 <div class='drawer results'> 596 <h6>Results</h6> 597 <p> 598 Hello, World! 599 </p> 600 </div> 601 </div> 602 </div> 603 <div id="outline-container-Transpile" class="outline-4"> 604 <h4 id="Transpile">Transpile</h4> 605 <div class="outline-text-4" id="text-Transpile"> 606 <p> 607 You can see transpile results by specifying “:wrap SRC js” header argument. 608 </p> 609 610 <div class="org-src-container"> 611 <pre class="src src-typescript">module Greeting { 612 export class Hello { 613 constructor(private text : string) { 614 } 615 say() :void{ 616 consonle.log(this.text); 617 } 618 } 619 } 620 621 var hello : Greeting.Hello = new Greeting.Hello("Hello, World!"); 622 hello.say(); 623 </pre> 624 </div> 625 626 <div class='drawer results'> 627 <h6>Results</h6> 628 <div class="org-src-container"> 629 <pre class="src src-js"><span class="org-keyword">var</span> <span class="org-variable-name">Greeting</span>; 630 (<span class="org-keyword">function</span> (<span class="org-variable-name">Greeting</span>) { 631 <span class="org-keyword">var</span> <span class="org-variable-name">Hello</span> = (<span class="org-keyword">function</span> () { 632 <span class="org-keyword">function</span> <span class="org-function-name">Hello</span>(<span class="org-variable-name">text</span>) { 633 <span class="org-constant">this</span>.text = text; 634 } 635 Hello.<span class="org-constant">prototype</span>.say = <span class="org-keyword">function</span> () { 636 console.log(<span class="org-constant">this</span>.text); 637 }; 638 <span class="org-keyword">return</span> Hello; 639 })(); 640 Greeting.Hello = Hello; 641 })(Greeting || (Greeting = {})); 642 <span class="org-keyword">var</span> <span class="org-variable-name">hello</span> = <span class="org-keyword">new</span> <span class="org-type">Greeting.Hello</span>(<span class="org-string">"Hello, World!"</span>); 643 hello.say(); 644 </pre> 645 </div> 646 </div> 647 </div> 648 </div> 649 </div> 650 <div id="outline-container-Ditaa" class="outline-3"> 651 <h3 id="Ditaa">Ditaa</h3> 652 <div class="outline-text-3" id="text-Ditaa"> 653 <p> 654 Let’s try something with <code>ditaa</code> 655 </p> 656 657 <div class="org-src-container"> 658 <pre class="src src-ditaa"> +-----------+ +---------+ 659 | PLC | | | 660 | Network +<------>+ PLC +<---=---------+ 661 | cRED | | c707 | | 662 +-----------+ +----+----+ | 663 ^ | 664 | | 665 | +----------------|-----------------+ 666 | | | | 667 v v v v 668 +----------+ +----+--+--+ +-------+---+ +-----+-----+ Windows clients 669 | | | | | | | | +----+ +----+ 670 | Database +<----->+ Shared +<---->+ Executive +<-=-->+ Operator +<---->|cYEL| . . .|cYEL| 671 | c707 | | Memory | | c707 | | Server | | | | | 672 +--+----+--+ |{d} cGRE | +------+----+ | c707 | +----+ +----+ 673 ^ ^ +----------+ ^ +-------+---+ 674 | | | 675 | +--------=--------------------------+ 676 v 677 +--------+--------+ 678 | | 679 | Millwide System | -------- Data --------- 680 | cBLU | --=----- Signals ---=-- 681 +-----------------+ 682 </pre> 683 </div> 684 685 686 <figure id="orgc3f2088"> 687 <img src="./images/sandbox/some_filename.png" alt="some_filename.png"> 688 689 </figure> 690 </div> 691 </div> 692 <div id="outline-container-Graphviz" class="outline-3"> 693 <h3 id="Graphviz">Graphviz</h3> 694 </div> 695 696 <div id="outline-container-References%20and%20labels%20%21" class="outline-3"> 697 <h3 id="References%20and%20labels%20%21">References and labels !</h3> 698 <div class="outline-text-3" id="text-References%20and%20labels%20%21"> 699 <p> 700 foo is bar 701 </p> 702 703 <div class="org-src-container"> 704 <pre class="src src-emacs-lisp"><span id="coderef-foo" class="coderef-off">(<span class="org-keyword">save-excursion</span> <span class="org-comment-delimiter">;;</span> (foo)</span> 705 (message <span class="org-string">"this is baz"</span>) 706 <span id="coderef-bar" class="coderef-off"> (goto-char (point-min)) <span class="org-comment-delimiter">;;</span> (bar)</span> 707 </pre> 708 </div> 709 710 <p> 711 In line <a href="#coderef-foo" class="coderef" onmouseover="CodeHighlightOn(this, 'coderef-foo');" onmouseout="CodeHighlightOff(this, 'coderef-foo');">foo</a> we remember the current position. <a href="#coderef-bar" class="coderef" onmouseover="CodeHighlightOn(this, 'coderef-bar');" onmouseout="CodeHighlightOff(this, 'coderef-bar');">Line bar</a> jumps to 712 point-min. 713 </p> 714 715 <div class="org-src-container"> 716 <pre class="src src-emacs-lisp"><span id="coderef-sc" class="coderef-off"><span class="linenr">1: </span>(<span class="org-keyword">save-excursion</span></span> 717 <span class="linenr">2: </span> (message <span class="org-string">"this is sparta"</span>) 718 <span id="coderef-jump" class="coderef-off"><span class="linenr">3: </span> (goto-char (point-min))</span> 719 </pre> 720 </div> 721 722 <p> 723 In line <a href="#coderef-sc" class="coderef" onmouseover="CodeHighlightOn(this, 'coderef-sc');" onmouseout="CodeHighlightOff(this, 'coderef-sc');">1</a> we remember the current position. <a href="#coderef-jump" class="coderef" onmouseover="CodeHighlightOn(this, 'coderef-jump');" onmouseout="CodeHighlightOff(this, 'coderef-jump');">Line 3</a> jumps to point-min. 724 </p> 725 </div> 726 </div> 727 </section> 728 <section id="outline-container-Counsel" class="outline-2"> 729 <h2 id="Counsel">Counsel</h2> 730 <div class="outline-text-2" id="text-Counsel"> 731 <p> 732 <i>this is italic</i> 733 <span class="underline">this should be underlined</span> 734 </p> 735 </div> 736 </section> 737 <section id="outline-container-sec:known-issues" class="outline-2"> 738 <h2 id="sec:known-issues">Known Issues</h2> 739 <div class="outline-text-2" id="text-sec:known-issues"> 740 <p> 741 The citation exporter, <code>ox-bibtex</code>, does NOT work seamlessly. As of <code>Org-mode 742 8.3.2</code>, I have the following issues. 743 </p> 744 </div> 745 <div id="outline-container-sec:dangling-element" class="outline-3"> 746 <h3 id="sec:dangling-element"><del>Dangling Element</del>   <span class="tag"><span class="solved">solved</span></span></h3> 747 <div class="outline-text-3" id="text-sec:dangling-element"> 748 <p> 749 The lisp function <code>insert-file-contents</code> used in <code>ox-bibtex</code> does not move point 750 and insertion-marker to the end of inserted text (I’m not sure it is a bug or an 751 intention). The result is that the citation is a dangling table not included in 752 the bibliography div. 753 </p> 754 755 <p> 756 The expected result is 757 </p> 758 759 <div class="org-src-container"> 760 <pre class="src src-html"><<span class="org-function-name">div</span> <span class="org-variable-name">id</span>=<span class="org-string">"bibliography"</span>> 761 <<span class="org-function-name">h2</span>><span class="org-underline"><span class="org-bold-italic">Bibliography</span></span></<span class="org-function-name">h2</span>> 762 <<span class="org-function-name">table</span>> 763 <span class="org-comment-delimiter"><!-- </span><span class="org-comment">Citation content goes here</span><span class="org-comment-delimiter"> --></span> 764 </<span class="org-function-name">table</span>> 765 </<span class="org-function-name">div</span>> 766 </pre> 767 </div> 768 769 <p> 770 But we got 771 </p> 772 773 <div class="org-src-container"> 774 <pre class="src src-html"><<span class="org-function-name">div</span> <span class="org-variable-name">id</span>=<span class="org-string">"bibliography"</span>> 775 <<span class="org-function-name">h2</span>><span class="org-underline"><span class="org-bold-italic">Bibliography</span></span></<span class="org-function-name">h2</span>> 776 </<span class="org-function-name">div</span>> 777 <<span class="org-function-name">table</span>> 778 <span class="org-comment-delimiter"><!-- </span><span class="org-comment">Citation content goes here</span><span class="org-comment-delimiter"> --></span> 779 </<span class="org-function-name">table</span>> 780 </pre> 781 </div> 782 783 <p> 784 Unless a patch is submitted, we may need to manually adjust this weird result. 785 </p> 786 </div> 787 </div> 788 </section> 789 </main> 790 <footer id="postamble" class="status"> 791 <footer> 792 <small><a href="/" rel="history">Index</a> • <a href="/sitemap.html">Sitemap</a> • <a href="https://dl.sbr.pm/">Files</a></small><br/> 793 <small class='questions'>Questions, comments ? Please use my <a href="https://lists.sr.ht/~vdemeester/public-inbox">public inbox</a> by sending a plain-text email to <a href="mailto:~vdemeester/public-inbox@lists.sr.ht">~vdemeester/public-inbox@lists.sr.ht</a>.</small><br/> 794 <small class='copyright'> 795 Content and design by Vincent Demeester 796 (<a rel='licence' href='http://creativecommons.org/licenses/by-nc-sa/3.0/'>Some rights reserved</a>) 797 </small><br /> 798 </footer> 799 </footer> 800 </body> 801 </html>