On 2015-07-08 13:33, Krzysztof Jusiak wrote:
Hi,
I've recently added a new functionality to proposed boost.di library documentation. After `try it online` the natural next step was to add `run this code` functionality like in http://en.cppreference.com/w/ or http://www.rust-lang.org/ programming language. Powered by Wandbox and CodeMirror approach, let you play with the particular example and switch between normal quick book programming listing mode and the editor/compiler mode.
You can check it here: http://krzysztof-jusiak.github.io/di/cpp14/boost/libs/di/doc/html/di/example...
Just click on `Run this code` button and you will be switched to the editor mode, where you would be able to edit the code and compile it online using the newest version of the library.
Implementation details: https://github.com/krzysztof-jusiak/di/blob/cpp14/doc/js/run_this_code.js
It's basically the same solution as `try it online`, just implemented in js instead. Additionally, it also takes the newest version of the library from github.
Minimal html: <link rel="stylesheet" href="CodeMirror/lib/codemirror.css"> <link rel="stylesheet" href="CodeMirror/theme/zenburn.css"> <script src="CodeMirror/lib/codemirror.js"></script> <script src="CodeMirror/mode/clike/clike.js"></script> <script src="CodeMirror/addon/selection/active-line.js"></script> <script src="run_this_code.js"></script>
<button class="TryItBtn" id="run_it_btn" onclick="show(' https://raw.githubusercontent.com/krzysztof-jusiak/di/cpp14/examples/hello_world.cpp)">Run this code!<\/button> <textarea style="display: none" id="code"></textarea> <textarea style="display: none" id="output"></textarea> <div id="code_listing"> //quick book programming listing here or anything else, which should be hidden when editor mode is enabled </div>
Let me know, what do you think.
Cheers, Kris
Thanks for sharing! I added it to the things I need to get around to doing myself :-)