|
|
| (9 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| − | {{#tag:html|
| |
| − | <head>
| |
| − | <style>
| |
| − | body {
| |
| − | font: 14px 'Open Sans', sans-serif;
| |
| − | color: #555;
| |
| − | background: #eee;
| |
| − | }
| |
| − | h1 {
| |
| − | padding: 50px 0;
| |
| − | font-weight: 400;
| |
| − | text-align: center;
| |
| − | }
| |
| − | p {
| |
| − | margin: 0 0 20px;
| |
| − | line-height: 1.5;
| |
| − | }
| |
| − | main {
| |
| − | min-width: 320px;
| |
| − | max-width: 800px;
| |
| − | padding: 50px;
| |
| − | margin: 0 auto;
| |
| − | background: #fff;
| |
| − | }
| |
| − | section {
| |
| − | display: none;
| |
| − | padding: 20px 0 0;
| |
| − | border-top: 1px solid #ddd;
| |
| − | }
| |
| − | input {
| |
| − | display: none;
| |
| − | }
| |
| − | label {
| |
| − | display: inline-block;
| |
| − | margin: 0 0 -1px;
| |
| − | padding: 15px 25px;
| |
| − | font-weight: 600;
| |
| − | text-align: center;
| |
| − | color: #bbb;
| |
| − | border: 1px solid transparent;
| |
| − | }
| |
| | | | |
| − | input:checked + label {
| |
| − | color: #555;
| |
| − | border-top: 2px solid #fbb74b;
| |
| − | }
| |
| − | </style>
| |
| − | <script>
| |
| − | /**
| |
| − | * Converts an array buffer to a string
| |
| − | *
| |
| − | * @private
| |
| − | * @param {ArrayBuffer} buf The buffer to convert
| |
| − | * @param {Function} callback The function to call when conversion is complete
| |
| − | * NOTE: Quite inefficient for small data...
| |
| − | */
| |
| − | function _arrayBufferToString(buf, callback) {
| |
| − | var bb = new Blob([new Uint8Array(buf)]);
| |
| − | var f = new FileReader();
| |
| − | f.onload = function(e) {
| |
| − | callback(e.target.result);
| |
| − | };
| |
| − | f.readAsText(bb);
| |
| − | }
| |
| − |
| |
| − | var _load_unzip_format_and_insert = function(src, id) {
| |
| − | // load zip file from src, unzip and format it to text
| |
| − | // and insert content into DOM element referenced by id
| |
| − |
| |
| − | var oReq = new XMLHttpRequest();
| |
| − | oReq.open("GET", src, true);
| |
| − | oReq.responseType = "arraybuffer";
| |
| − |
| |
| − | oReq.onload = function (oEvent) {
| |
| − | var arrayBuffer = oReq.response; // Note: not oReq.responseText
| |
| − | if (arrayBuffer) {
| |
| − | var byteArray = new Uint8Array(arrayBuffer);
| |
| − | var gunzip = new Zlib.Gunzip(byteArray);
| |
| − | var plain = gunzip.decompress();
| |
| − | _arrayBufferToString(plain, function(r){$("#table").html(r)});
| |
| − | }
| |
| − | };
| |
| − | oReq.send();
| |
| − | };
| |
| − |
| |
| − | //_load_unzip_format_and_insert("PlateReader.zip", ".notebook-awesomesheet");
| |
| − | </script>
| |
| − |
| |
| − | <script type='text/javascript'>
| |
| − | $(document).ready(function(){
| |
| − | var awesomes = document.getElementsByClassName('awesome');
| |
| − | for(var i=0; i<awesomes.length; i++) {
| |
| − | awesomes[i].addEventListener("click", function(){
| |
| − | var id = $(this).attr('id');
| |
| − | var url = $(this).val();
| |
| − | //id = id.substring(3, id.length);
| |
| − | var content = '#content' + id;
| |
| − | $(content).css('display', 'block');
| |
| − | _load_unzip_format_and_insert(url, content);
| |
| − |
| |
| − | $('.awesome-content').not(content).css('display', 'none');
| |
| − | });
| |
| − | };
| |
| − | });
| |
| − |
| |
| − | </script>
| |
| − |
| |
| − | </head>
| |
| − | <body>
| |
| − | <main>
| |
| − | {{{1}}}
| |
| − | <div style="max-width: 100%">
| |
| − | <div class="col-lg-12 notebook-awesomesheet" style="overflow-x: auto !important;">
| |
| − | <div id="table">Loading...</div>
| |
| − | </div>
| |
| − | </div>
| |
| − | </main>
| |
| − | </body>
| |
| − | }}
| |
