diff options
| -rw-r--r-- | css/sally.css | 28 | ||||
| -rw-r--r-- | index.html | 44 | ||||
| -rw-r--r-- | js/app.js | 2 | ||||
| -rw-r--r-- | js/ui/controls.js | 8 |
4 files changed, 58 insertions, 24 deletions
diff --git a/css/sally.css b/css/sally.css index 978a78d..3661d12 100644 --- a/css/sally.css +++ b/css/sally.css @@ -42,12 +42,16 @@ a:hover { text-decoration: underline } #gallery_rapper { display: inline } +#ui_rapper .block { + width: 100px; +} .block { padding:4px; } .block:nth-child(n+2) { padding-left: 30px; } +#textarea_mode { padding: 4px; } .tool { cursor: pointer; } @@ -122,7 +126,7 @@ textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color: .vertical #canvas_rapper div, .vertical #tools_rapper, .vertical #palette_rapper, -.vertical #brush_container { display: inline-block; float: left} +.vertical #brush_container { display: inline-block; float: left; } .vertical #workspace_rapper { width: auto; position: relative; float: left; } .vertical #palette_rapper { margin-right: 10px; } .vertical #tools_block { min-width: 100%; } @@ -160,6 +164,7 @@ textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color: border: 1px solid; display: inline-block; margin-bottom: 13px; + float: left; } #letters_rapper { display: inline-block; @@ -226,3 +231,24 @@ textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color: 66% { color: hsl(320,100%,50%) } 100% { color: hsl(360,100%,50%) } } + +.can_save { + color: white; + text-decoration: underline; +} +.panke #shader_el, +.panke #load_el, +.panke #gallery_el, +.panke #import_textarea, +.panke #doc_el, +.panke #gallery_el, +.panke #save_button, +.panke #upload_button, +.panke #export_button, +.panke #username_input, +.panke #upload_input, +.panke #grid_el, +.panke #save_el, +.panke #vertical_checkbox, +.panke #add_custom_el, +.panke #format_el { display: none !important; } @@ -7,7 +7,7 @@ <link rel="stylesheet" href="css/ak.css" type="text/css" charset="utf-8" /> </head> -<body class="loading"> +<body class="loading panke"> <div id="goodies_rapper"> </div> @@ -35,14 +35,11 @@ <span id="char_checkbox" class="tool">x char</span><br> <br> <span id="add_custom_el" class="tool">+ add</span> - <div id="nopaint_rapper"> - <br> - <span id="nopaint_no_el" class="tool">no</span><br> - <span id="nopaint_paint_el" class="tool">paint</span><br> - <span id="nopaint_pause_el" class="tool hidden">pause</span><br> - </div> <span id="mirror_x_checkbox" class="tool">_ mirror x</span><br> <span id="mirror_y_checkbox" class="tool">_ mirror y</span><br> + <br> + <span id="undo_el" class="tool hidden">undo</span><br> + <span id="redo_el" class="tool hidden">redo</span><br> </div> <div id="tools_rapper" class="block"> <span id="square_el" class="tool">square</span><br> @@ -56,29 +53,33 @@ <span id="scale_el" class="tool">scale</span><br> <span id="translate_el" class="tool">translate</span><br> <span id="slice_el" class="tool">slice</span><br> - <br> - <span id="undo_el" class="tool hidden">undo</span><br> - <span id="redo_el" class="tool hidden">redo</span><br> - <br> - <span id="grid_el" class="tool">_ grid</span><br> + + <span id="grid_el" class="tool">_ grid</span> <!-- <span id="rotate_checkbox" class="tool">_ rotate</span><br> --> - <span id="vertical_checkbox" class="tool">x vertical</span><br> + <span id="vertical_checkbox" class="tool">x vertical</span> <!-- <span id="pixels_checkbox" class="tool">_ pixels</span><br> --> - <br> - brush size: <span id="brush_w_el" class="ed">5</span> x <span id="brush_h_el" class="ed">5</span><br> - canvas size: <span id="canvas_w_el" class="ed">100</span> x <span id="canvas_h_el" class="ed">30</span><br> </div> <div id="textarea_mode" style="float: left"> <div> <span id="shader_el" class="tool">shader</span> - <span id="webcam_el" class="tool">webcam</span> - <span id="load_el" class="tool">load</span> + <span id="clear_el" class="tool">new</span><br> <span id="save_el" class="tool">save</span> - <span id="clear_el" class="tool">new</span> - <a href="http://asdf.us/ascii/doc/" target="_blank">doc</a> - <a href="http://asdf.us/im/gallery/?tag=ascii&limit=80" target="_blank">gallery</a> + <span id="send_to_irc_el" class="tool can_save">> send to IRC</span><br> + <span id="load_el" class="tool">load</span> + <span id="webcam_el" class="tool">webcam</span><br> + <a id="doc_el" href="http://asdf.us/ascii/doc/" target="_blank">doc</a> + <a id="gallery_el" href="http://asdf.us/im/gallery/?tag=ascii&limit=80" target="_blank">gallery</a> + <br> + <div id="nopaint_rapper"> + <br> + <span id="nopaint_no_el" class="tool">no</span><br> + <span id="nopaint_paint_el" class="tool">paint</span><br> + <span id="nopaint_pause_el" class="tool hidden">pause</span><br> + </div> <br> + brush: <span id="brush_w_el" class="ed">5</span> x <span id="brush_h_el" class="ed">5</span><br> + canvas: <span id="canvas_w_el" class="ed">100</span> x <span id="canvas_h_el" class="ed">30</span><br> </div> <div id="import_rapper"> @@ -104,7 +105,6 @@ <textarea id="shader_textarea"></textarea> </div> </div> - </div> <div id="webcam_rapper" class="transparent"> <span class="close" id="webcam_close">x</span> @@ -82,7 +82,7 @@ function bind () { }) window.onbeforeunload = function() { - if (changed && !in_iframe()) return "You have edited this drawing." + // if (changed && !in_iframe()) return "You have edited this drawing." } function in_iframe () { diff --git a/js/ui/controls.js b/js/ui/controls.js index 8da4994..32a329a 100644 --- a/js/ui/controls.js +++ b/js/ui/controls.js @@ -164,6 +164,14 @@ var controls = (function(){ clipboard.show() clipboard.export_mode() } + controls.send_to_irc = new ClipboardTool (send_to_irc_el) + controls.send_to_irc.use = function(){ + changed && clipboard.upload_png() + clipboard.show() + clipboard.export_mode() + alert('your ascii art is now on display on the IRC channel inside the panke.gallery!') + } + controls.load = new ClipboardTool (load_el) controls.load.use = function(){ // console.log("use") |