diff options
| -rw-r--r-- | res/client/css/partials/dev-area.scss | 32 | ||||
| -rw-r--r-- | res/client/css/partials/devtools.scss | 32 | ||||
| -rw-r--r-- | res/client/css/style.scss | 2 | ||||
| -rw-r--r-- | src/client/devtools.js | 117 | ||||
| -rw-r--r-- | src/client/main.js | 6 |
5 files changed, 153 insertions, 36 deletions
diff --git a/res/client/css/partials/dev-area.scss b/res/client/css/partials/dev-area.scss deleted file mode 100644 index fa1cfbf3..00000000 --- a/res/client/css/partials/dev-area.scss +++ /dev/null @@ -1,32 +0,0 @@ -.debug-ui { - display: none; -} - -body.debug { - .debug-ui { - display: inline; - position:fixed; - bottom:70px; - left:10px; - text-decoration: none; - } - - .debug-ui-row { - float: left; - width: 100%; - } - - .debug-ui-left { - float: left; - width: 50%; - } - - .debug-ui-right { - float: right; - width: 50%; - } - - .debug{ - - } -} diff --git a/res/client/css/partials/devtools.scss b/res/client/css/partials/devtools.scss new file mode 100644 index 00000000..0f923718 --- /dev/null +++ b/res/client/css/partials/devtools.scss @@ -0,0 +1,32 @@ +#devtools { + position: absolute; + bottom: 0; + border-top: 10px solid gray; + padding-left: 10px; + height: 20%; + width: 100%; + line-height: 20px; +} + +#devtools span { + font-family: monospace; +} + +.devtools__btn { + + &:hover { + cursor: pointer; + color: gold; + } +} + +.debug-view__multi-step-cmd-delim { + color: red; + margin-left: 4px; + margin-right: 2px; +} + +.debug-view__import__input_file_name { + font-family: monospace; + margin-left: 20px; +}
\ No newline at end of file diff --git a/res/client/css/style.scss b/res/client/css/style.scss index cb29bd5e..b3f34181 100644 --- a/res/client/css/style.scss +++ b/res/client/css/style.scss @@ -7,7 +7,7 @@ // Partials @import "partials/buttons"; @import "partials/common-form"; -@import "partials/dev-area"; +@import "partials/devtools"; @import "partials/dropdown-menu"; @import "partials/grid"; @import "partials/input-bar"; diff --git a/src/client/devtools.js b/src/client/devtools.js new file mode 100644 index 00000000..1274652e --- /dev/null +++ b/src/client/devtools.js @@ -0,0 +1,117 @@ +"use strict" + +define(['jquery', 'rz_core', 'FileSaver'], +function($, rz_core, file_saver) { + + var import_file_set; + + $('debug-view__save').click(function(){ + var json = rz_core.main_graph.save_to_json(); + console.log('saving to local storage ' + json.length + ' bytes'); + localStorage.setItem(key, json); + }); + + $('#debug-view__export_btn').click(function() { + var json = rz_core.main_graph.save_to_json(), + blob = new Blob([json], {type: 'application/json'}), + now = new Date(), + date_string = ('' + now.getYear() + now.getMonth() + now.getDay() + '-' + + now.getHours() + now.getMinutes() + now.getSeconds()), + filename = rz_config.rzdoc_cur__name + '-' + date_string + '.json'; + + console.log('saving ' + json.length + ' bytes to ' + filename); + file_saver(blob, filename); + }); + + $('#debug-view__url-copy a').click(function() { + var json = rz_core.main_graph.save_to_json(); + // TODO use jquery BBQ $.param({json: json}); + var encoded = document.location.origin + '/?json=' + encodeURIComponent(json); + window.prompt('Copy to clipboard: Ctrl-C, Enter (or Cmd-C for Mac)', encoded); + }); + + var confirm_import = function() { + if (!rz_core.main_graph.empty()) { + return confirm('Current work will be merged with the new import, are you sure?'); + } + return true; + } + + function import_file(file) { + + var file_reader; + + console.log(file); + file_reader = new FileReader(); + file_reader.onload = (function(theFile) { + return function(e) { + var result = e.target.result; + if (e.target.readyState === FileReader.DONE) { + console.log('file-import: done reading \'' + theFile.name + '\', byte count: ' + result.length); + rz_core.load_from_json(result); + } + } + })(file); + file_reader.readAsText(file, "text/javascript"); + } + + function init_import_handlers() { + + /* + * step1: propagate import file selection to hidden input element + */ + $('#devtools__import__select-files-btn').click(function(event) { + + $('#debug-view__import__input_element').click(); // trigger file selection dialog + + }); + + /* + * step2: handle file selection events, enable import-execution button + */ + $('#debug-view__import__input_element').on('change', function(event) { + + import_file_set = event.target.files; + + if (undefined === import_file_set) { + return; + } + + $.map(import_file_set, function(file){ + + var e_file_path; + + e_file_path = $('<div>'); + e_file_path.addClass('debug-view__import__input_file_name') + e_file_path.text('- ' + file.name); + $('#debug-view__import').append(e_file_path); + }); + + $('#devtools__import__step__export').show(); // enable import exec button + }); + + /* + * step3: prompt for confirmation & execute import + */ + $('#devtools__import__execute-import-btn').click(function(event) { + if (!confirm_import()) { + return; + } + + $.map(import_file_set, import_file); + }); + }; + init_import_handlers(); + + $('debug-view__local-storage-load').click(function(){ + if (!confirm_import()) { + return; + } + var json_blob = localStorage.getItem(key) + rz_core.load_from_json(json_blob); + }); + + return { + + } +});
\ No newline at end of file diff --git a/src/client/main.js b/src/client/main.js index 4e878087..e4735afe 100644 --- a/src/client/main.js +++ b/src/client/main.js @@ -3,6 +3,7 @@ */ define([ 'buttons', + 'devtools', 'drag_n_drop', 'feedback', 'history', @@ -13,7 +14,6 @@ define([ 'textanalysis', 'textanalysis.ui', 'util', - 'view/devtools', 'view/filter_menu', 'view/search', 'view/selection', @@ -24,6 +24,7 @@ define([ */ function( buttons, + devtools, drag_n_drop, feedback, history, @@ -34,7 +35,6 @@ function( textanalysis, textanalysis_ui, util, - devtools, filter_menu, search, selection @@ -89,7 +89,7 @@ function( // setup debug if (util.getParameterByName('debug')) { - $(document.body).addClass('debug'); + $('#devtools').show(); rz_core.edit_graph.set_user('fakeuser'); rz_core.main_graph.set_user('fakeuser'); drag_n_drop.init(); |