From cae29ea3bc7abaa900702672c04dd8d97d453721 Mon Sep 17 00:00:00 2001 From: viliusle Date: Fri, 14 Nov 2014 20:30:00 +0200 Subject: [PATCH 1/6] Update menu_actions.js about --- js/menu_actions.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/js/menu_actions.js b/js/menu_actions.js index a8271e5..448d8e9 100644 --- a/js/menu_actions.js +++ b/js/menu_actions.js @@ -1188,7 +1188,9 @@ function MENU_CLASS(){ else if(name == 'help_about'){ POP.add({title: "Name:", value: "miniPaint "+VERSION }); POP.add({title: "Description:", value: 'online image editor' }); - POP.add({title: "Author:", value: AUTHOR+" - "+EMAIL }); + POP.add({title: "Author:", value: AUTHOR }); + POP.add({title: "Email:", html: ''+EMAIL+'' }); + POP.add({title: "Source:", html: 'github.com/viliusle/miniPaint' }); POP.show('About', ''); } From cd5e4109c82fac6694a413716056d8433e0c8839 Mon Sep 17 00:00:00 2001 From: viliusle Date: Fri, 14 Nov 2014 21:39:58 +0200 Subject: [PATCH 2/6] paste --- js/controlls.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/js/controlls.js b/js/controlls.js index 576b26e..5b51b2f 100644 --- a/js/controlls.js +++ b/js/controlls.js @@ -615,20 +615,20 @@ function CLIPBOARD_CLASS(canvas_id){ } else{ //html - setTimeout(function(){ + /*setTimeout(function(){ if(reading_dom == true) return false; _self.paste_createText(pasteCatcher.innerHTML, false); reading_dom = true; - }, 10); + }, 10);*/ } } - else if(pasteCatcher.children.length == 0){ + /*else if(pasteCatcher.children.length == 0){ //text setTimeout(function(){ if(reading_dom == true) return false; _self.paste_createText(pasteCatcher.innerHTML, false); reading_dom = true; - }, 10); + }, 10);*/ } //register cleanup after some time. setTimeout(function(){ @@ -656,9 +656,9 @@ function CLIPBOARD_CLASS(canvas_id){ } else if(items[i].type.indexOf("text") !== -1){ //text or html - if(plain_text_used == false) + /*if(plain_text_used == false) this.paste_createText(e.clipboardData.getData('text/plain')); - plain_text_used = true; + plain_text_used = true;*/ } } e.preventDefault(); From 07953219325eaef4dd7ce83c01207ef015a8a4de Mon Sep 17 00:00:00 2001 From: viliusle Date: Fri, 14 Nov 2014 21:41:20 +0200 Subject: [PATCH 3/6] Update controlls.js --- js/controlls.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/controlls.js b/js/controlls.js index 5b51b2f..e8f2973 100644 --- a/js/controlls.js +++ b/js/controlls.js @@ -628,8 +628,8 @@ function CLIPBOARD_CLASS(canvas_id){ if(reading_dom == true) return false; _self.paste_createText(pasteCatcher.innerHTML, false); reading_dom = true; - }, 10);*/ - } + }, 10); + }*/ //register cleanup after some time. setTimeout(function(){ pasteCatcher.innerHTML = ''; From 2cb0c84f12de9f12cf17f15e6771586e204beb2d Mon Sep 17 00:00:00 2001 From: viliusle Date: Fri, 14 Nov 2014 21:59:43 +0200 Subject: [PATCH 4/6] Update index.html --- index.html | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/index.html b/index.html index 28a83e5..c4e542f 100644 --- a/index.html +++ b/index.html @@ -245,5 +245,14 @@ + + From f95cd7737b660f554db51f883494322a2a0d0df3 Mon Sep 17 00:00:00 2001 From: viliusle Date: Tue, 18 Nov 2014 10:31:16 +0200 Subject: [PATCH 5/6] Update index.html --- index.html | 9 --------- 1 file changed, 9 deletions(-) diff --git a/index.html b/index.html index c4e542f..28a83e5 100644 --- a/index.html +++ b/index.html @@ -245,14 +245,5 @@ - - From 0d1c1eaba12624b84ccf161f730ff699c9ae0002 Mon Sep 17 00:00:00 2001 From: viliusle Date: Sat, 3 Jan 2015 19:15:38 +0200 Subject: [PATCH 6/6] 1.9.6 --- README.md | 2 +- index.html | 9 ++-- js/controlls.js | 12 ----- js/draw.js | 2 +- js/layers.js | 2 +- js/main.js | 2 +- js/menu_actions.js | 117 ++++++++++++++++++++------------------------- js/popup.js | 12 +++-- js/settings.js | 4 +- js/tools.js | 2 +- styles/print.css | 31 ------------ styles/styles.css | 38 ++++++++++++++- 12 files changed, 107 insertions(+), 126 deletions(-) delete mode 100644 styles/print.css diff --git a/README.md b/README.md index 9abad8f..7cab561 100644 --- a/README.md +++ b/README.md @@ -12,7 +12,7 @@ Drag and Drop. Features: open, edit, save images, various drawing tools like Magic Wand tool, Clone tool, erase, fill, color picker, colour selector, layers, pencil, brush, shapes, trim, flip, rotate, resize, transparency, zoom, grid, EXIF data, crop, export/import layers data, -paste from clipboard, 31 various filters including blur, Tilt Shift, perspective, +paste from clipboard, 27 various filters including blur, Tilt Shift, perspective, denoise, vignette, vintage, auto colorize, auto adjust colors, decrease color deapth, histogram, gradients, Hermite resample, keypoints. diff --git a/index.html b/index.html index 28a83e5..a4e51ff 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,6 @@ - @@ -72,7 +71,6 @@
- 0 + diff --git a/js/controlls.js b/js/controlls.js index e8f2973..c70d002 100644 --- a/js/controlls.js +++ b/js/controlls.js @@ -164,18 +164,6 @@ function CONTROLLS_CLASS(){ canvas_front.clearRect(0, 0, WIDTH, HEIGHT); } } - //c - else if(k==67){ - if(CON.ctrl_pressed == true && TOOLS.select_data != false) - MENU.copy_to_clipboard(); - else if(CON.ctrl_pressed == false){ - MAIN.save_state(); - var param1 = parseInt(3); - var param2 = parseInt(30); - DRAW.colorize(canvas_active(), WIDTH, HEIGHT, param1, param2, true); - DRAW.zoom(); - } - } //v else if(k==86){ MAIN.save_state(); diff --git a/js/draw.js b/js/draw.js index 36a8f09..faf6315 100644 --- a/js/draw.js +++ b/js/draw.js @@ -805,7 +805,7 @@ function DRAW_CLASS(){ for(var yy = Math.floor(j * ratio_h); yy < (j + 1) * ratio_h; yy++){ var dy = Math.abs(center_y - (yy + 0.5)) / ratio_h_half; var center_x = (i + 0.5) * ratio_w; - var w0 = dy*dy //pre-calc part of w + var w0 = dy*dy; //pre-calc part of w for(var xx = Math.floor(i * ratio_w); xx < (i + 1) * ratio_w; xx++){ var dx = Math.abs(center_x - (xx + 0.5)) / ratio_w_half; var w = Math.sqrt(w0 + dx*dx); diff --git a/js/layers.js b/js/layers.js index bf4057f..807c75c 100644 --- a/js/layers.js +++ b/js/layers.js @@ -69,7 +69,7 @@ function LAYER_CLASS(){ DRAW.zoom(); }; img.onerror = function(ex){ - POP.add({title: "Message:", value: 'The image could not be loaded.'}); + POP.add({html: 'The image could not be loaded.

'}); if(data.substring(0,4) == 'http') POP.add({title: "Reason:", value: 'Cross-origin resource sharing (CORS) not supported. Try to save image first.'}); POP.show('Error', '.'); diff --git a/js/main.js b/js/main.js index 14aa178..d58ccdd 100644 --- a/js/main.js +++ b/js/main.js @@ -1,6 +1,6 @@ /* TODO: - letters + layers reorder issue */ var MAIN = new MAIN_CLASS(); diff --git a/js/menu_actions.js b/js/menu_actions.js index 448d8e9..4a9406b 100644 --- a/js/menu_actions.js +++ b/js/menu_actions.js @@ -120,7 +120,7 @@ function MENU_CLASS(){ else if(name == 'image_crop'){ MAIN.save_state(); if(TOOLS.select_data == false){ - POP.add({title: "Error:", value: 'Select are first' }); + POP.add({html: 'Select area first' }); POP.show('Error', ''); } else{ @@ -131,12 +131,16 @@ function MENU_CLASS(){ layer.clearRect(0, 0, WIDTH, HEIGHT); layer.putImageData(tmp, 0, 0); } + //resize MAIN.save_state(); WIDTH = TOOLS.select_data.w; HEIGHT = TOOLS.select_data.h; RATIO = WIDTH/HEIGHT; LAYER.set_canvas_size(); + + TOOLS.select_data = false; + canvas_front.clearRect(0, 0, WIDTH, HEIGHT); } } //resize @@ -145,11 +149,13 @@ function MENU_CLASS(){ //rotate left else if(name == 'image_rotate_left'){ MAIN.save_state(); + MENU.rotate_resize_doc(270, WIDTH, HEIGHT); MENU.rotate_layer({angle: 270}, canvas_active(), WIDTH, HEIGHT); } //rotate right else if(name == 'image_rotate_right'){ MAIN.save_state(); + MENU.rotate_resize_doc(90, WIDTH, HEIGHT); MENU.rotate_layer({angle: 90}, canvas_active(), WIDTH, HEIGHT); } //rotate @@ -251,6 +257,13 @@ function MENU_CLASS(){ MAIN.save_state(); DRAW.auto_adjust(canvas_active(), WIDTH, HEIGHT); } + //convert to grayscale + else if(name == 'image_GrayScale'){ + MAIN.save_state(); + var imageData = canvas_active().getImageData(0, 0, WIDTH, HEIGHT); + var filtered = ImageFilters.GrayScale(imageData); //add effect + canvas_active().putImageData(filtered, 0, 0); + } //enchance colors else if(name == 'image_decrease_colors'){ POP.add({name: "param1", title: "Colors:", value: "10", range: [2, 100] }); @@ -336,6 +349,24 @@ function MENU_CLASS(){ else if(name == 'layer_show_hide'){ LAYER.layer_visibility(LAYER.layer_active); } + //crop + else if(name == 'layer_crop'){ + MAIN.save_state(); + if(TOOLS.select_data == false){ + POP.add({html: 'Select area first'}); + POP.show('Error', ''); + } + else{ + var layer = LAYER.canvas_active(); + + var tmp = layer.getImageData(TOOLS.select_data.x, TOOLS.select_data.y, TOOLS.select_data.w, TOOLS.select_data.h); + layer.clearRect(0, 0, WIDTH, HEIGHT); + layer.putImageData(tmp, 0, 0); + + TOOLS.select_data = false; + canvas_front.clearRect(0, 0, WIDTH, HEIGHT); + } + } //delete else if(name == 'layer_delete'){ MAIN.save_state(); @@ -371,7 +402,7 @@ function MENU_CLASS(){ //show differences else if(name == 'layer_differences'){ if(parseInt(LAYER.layer_active) + 1 >= LAYERS.length){ - POP.add({title: "Error:", value: 'This can not be last layer' }); + POP.add({html: 'This can not be last layer' }); POP.show('Error', ''); return false; } @@ -393,7 +424,7 @@ function MENU_CLASS(){ "lighter", "darker", "copy", "xor"]; if(parseInt(LAYER.layer_active) + 1 >= LAYERS.length){ - POP.add({title: "Error:", value: 'This can not be last layer' }); + POP.add({html: 'This can not be last layer' }); POP.show('Error', ''); return false; } @@ -603,28 +634,6 @@ function MENU_CLASS(){ canvas_preview.stroke(); }); } - else if(name == 'effects_BrightnessContrast'){ - POP.add({name: "param1", title: "Brightness:", value: "0", range: [-100, 100] }); - POP.add({name: "param2", title: "Contrast:", value: "0", range: [-100, 100] }); - POP.show('Brightness Contrast', function(user_response){ - MAIN.save_state(); - var param1 = parseInt(user_response.param1); - var param2 = parseInt(user_response.param2); - - var imageData = canvas_active().getImageData(0, 0, WIDTH, HEIGHT); - var filtered = ImageFilters.BrightnessContrastPhotoshop(imageData, param1, param2); //add effect - canvas_active().putImageData(filtered, 0, 0); - DRAW.zoom(); - }, - function(user_response, canvas_preview, w, h){ - var param1 = parseInt(user_response.param1); - var param2 = parseInt(user_response.param2); - var imageData = canvas_preview.getImageData(0, 0, w, h); - var filtered = ImageFilters.BrightnessContrastPhotoshop(imageData, param1, param2); //add effect - - canvas_preview.putImageData(filtered, 0, 0); - }); - } else if(name == 'effects_bulge_pinch'){ POP.add({name: "param1", title: "Strength:", value: 1, range: [-1, 1], step: 0.1 }); var default_value = Math.min(WIDTH, HEIGHT); @@ -653,40 +662,12 @@ function MENU_CLASS(){ canvas_preview.drawImage(fx_filter, 0, 0); }); } - else if(name == 'effects_ColorTransformFilter'){ - POP.add({name: "param5", title: "Red offset:", value: "0", range: [-255, 255] }); - POP.add({name: "param6", title: "Green offset:", value: "0", range: [-255, 255] }); - POP.add({name: "param7", title: "Blue offset:", value: "0", range: [-255, 255] }); - POP.add({name: "param8", title: "Alpha offset:", value: "0", range: [-255, 255] }); - POP.show('Color Transform', function(user_response){ - MAIN.save_state(); - var param5 = parseInt(user_response.param5); - var param6 = parseInt(user_response.param6); - var param7 = parseInt(user_response.param7); - var param8 = parseInt(user_response.param8); - - var imageData = canvas_active().getImageData(0, 0, WIDTH, HEIGHT); - var filtered = ImageFilters.ColorTransformFilter(imageData, 1, 1, 1, 1, param5, param6, param7, param8); //add effect - canvas_active().putImageData(filtered, 0, 0); - DRAW.zoom(); - }, - function(user_response, canvas_preview, w, h){ - var param5 = parseInt(user_response.param5); - var param6 = parseInt(user_response.param6); - var param7 = parseInt(user_response.param7); - var param8 = parseInt(user_response.param8); - var imageData = canvas_preview.getImageData(0, 0, w, h); - var filtered = ImageFilters.ColorTransformFilter(imageData, 1, 1, 1, 1, param5, param6, param7, param8); //add effect - canvas_preview.putImageData(filtered, 0, 0); - }); - } else if(name == 'effects_colorize'){ var colorize_data; POP.add({name: "param1", title: "Power:", value: "3", range: [1, 10] }); POP.add({name: "param2", title: "Limit:", value: "30", range: [10, 200] }); POP.add({name: "param3", title: "Dithering:", values: ["Yes", "No"] }); - POP.add({title: "Shortcut:", value: "C" }); POP.preview_in_main = true; POP.show('Auto colorize', function(user_response){ MAIN.save_state(); @@ -813,12 +794,6 @@ function MENU_CLASS(){ canvas_preview.putImageData(filtered, 0, 0); }); } - else if(name == 'effects_GrayScale'){ - MAIN.save_state(); - var imageData = canvas_active().getImageData(0, 0, WIDTH, HEIGHT); - var filtered = ImageFilters.GrayScale(imageData); //add effect - canvas_active().putImageData(filtered, 0, 0); - } else if(name == 'effects_HSLAdjustment'){ POP.add({name: "param1", title: "Hue:", value: "0", range: [-180, 180] }); POP.add({name: "param2", title: "Saturation:", value: "0", range: [-100, 100] }); @@ -1151,7 +1126,6 @@ function MENU_CLASS(){ //shortcuts else if(name == 'help_shortcuts'){ - POP.add({title: "C", value: 'Colorize' }); POP.add({title: "Del", value: 'Delete selection' }); POP.add({title: "F", value: 'Auto adjust colors' }); POP.add({title: "G", value: 'Grid on/off' }); @@ -1328,8 +1302,8 @@ function MENU_CLASS(){ LAYER.layer_renew(); }; this.resize_box = function(){ - POP.add({name: "width", title: "Enter new width:", value: WIDTH}); - POP.add({name: "height",title: "Enter new height:", value: HEIGHT}); + POP.add({name: "width", title: "Enter new width:", value: '', placeholder:WIDTH }); + POP.add({name: "height",title: "Enter new height:", value: '', placeholder:HEIGHT }); POP.add({name: "mode", title: "Mode:", value: "Resample - Hermite", values: ["Resize", "Resample - Hermite"]}); POP.add({name: "ratio",title: "Preserve ratio:", values: ["Yes", "No"]}); POP.add({name: "preblur",title: "Pre-Blur:", values: ["Yes", "No"], value: "No" }); @@ -1343,8 +1317,21 @@ function MENU_CLASS(){ var ratio_mode = user_response.ratio; var preblur = user_response.preblur; var sharpen = user_response.sharpen; - if(isNaN(width) || width<1) return false; - if(isNaN(height) || height<1) return false; + if( (isNaN(width) || width<1) && (isNaN(height) || height<1) ) return false; + + //if only 1 dimension was provided + if(ratio_mode == 'Yes'){ + if(isNaN(width) || width<1) + width = Math.round(height * RATIO); + if(isNaN(height) || height<1) + height = Math.round(width * RATIO); + } + else{ + if(isNaN(width) || width<1) + width = WIDTH; + if(isNaN(height) || height<1) + height = HEIGHT; + } //if increasing size - use simple way - its good enough if(width > WIDTH || height > HEIGHT) @@ -1417,7 +1404,7 @@ function MENU_CLASS(){ DRAW.trim(); DRAW.zoom(); } - //sharpen? + //sharpen after? if(sharpen == 'Yes'){ var imageData = canvas_active().getImageData(0, 0, WIDTH, HEIGHT); var filtered = ImageFilters.Sharpen(imageData, 1); //add effect diff --git a/js/popup.js b/js/popup.js index 9c05c18..a0a4c9b 100644 --- a/js/popup.js +++ b/js/popup.js @@ -58,7 +58,8 @@ function popup(){ for(var i in parameters){ var parameter = parameters[i]; html += ''; - html += ''+parameter.title+''; + if(title != 'Error') + html += ''+parameter.title+''; if(parameter.name != undefined){ can_be_canceled = true; if(parameter.values != undefined){ @@ -108,6 +109,7 @@ function popup(){ } } else if(parameter.value != undefined){ + //input, range or textarea var step = 1; if(parameter.step != undefined) step = parameter.step; @@ -119,10 +121,12 @@ function popup(){ html += ''+parameter.value+''; } else{ + if(parameter.placeholder == undefined) + parameter.placeholder = ''; if(parameter.type == 'textarea') - html += ''; + html += ''; else - html += ''; + html += ''; } } } @@ -136,7 +140,7 @@ function popup(){ } else if(parameter.html != undefined){ //html - html += ''+parameter.html+''; + html += ''+parameter.html+''; } else{ //locked fields diff --git a/js/settings.js b/js/settings.js index 6a14d69..ba46a95 100644 --- a/js/settings.js +++ b/js/settings.js @@ -8,13 +8,13 @@ var canvas_preview = document.getElementById("canvas_preview").getContext("2d"); //settings var AUTHOR = 'ViliusL'; var EMAIL = 'www.viliusl@gmail.com'; -var VERSION = '1.9.4'; +var VERSION = '1.9.6'; var WIDTH = 800; //canvas midth var HEIGHT = 500; //canvas height var RATIO = WIDTH/HEIGHT; //width & height ratio var LAYERS = []; //layers data var ACTION = 'select_tool'; ///default action -var COLOUR = '#000000'; //current color +var COLOUR = '#0000ff'; //current color var COLOUR_LAST = '#ffffff'; //last used color var ZOOM = 100; //zoom level 10 - infinity var ALPHA = 255; diff --git a/js/tools.js b/js/tools.js index 5f9fb10..227211c 100644 --- a/js/tools.js +++ b/js/tools.js @@ -1103,7 +1103,7 @@ function TOOLS_CLASS(){ var size = TOOLS.action_data().attributes.size; if(clone_data === false){ - POP.add({title: "Message:", value: 'Source is empty, right click on image first.' }); + POP.add({html: 'Source is empty, right click on image first.' }); POP.show('Error', ''); } else{ diff --git a/styles/print.css b/styles/print.css deleted file mode 100644 index 90f7e65..0000000 --- a/styles/print.css +++ /dev/null @@ -1,31 +0,0 @@ -body{ - background:none !important; - background: #fff; - background-color: #fff; - font-family: Arial,Helvetica,Verdana; - width:auto !important; - padding:5px !important; - font-size: 12px; -} -progress, -.menu, -#resize-w,#resize-h, #resize-wh, -#menu_left, -#layers_container, -#canvas_back, -#drop_zone, -.ddsmoothmenu{ - display: none; - height: 0; - width: 0; -} -#canvas_layers{ - margin:0px; - padding:0px; - } -canvas{ - border:0px; - position: absolute; - top:0px; - left:0px; - } diff --git a/styles/styles.css b/styles/styles.css index a36d465..3ad25c8 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -191,7 +191,7 @@ label{ width:100%; } #popup{ - position:fixed; + position:absolute; border:1px solid #000000; background-color:#dbeaf9; width:400px; @@ -439,3 +439,39 @@ label{ font-size:0; padding:0 8px 0 8px; } + +/* ==== print =============================================================== */ + +@media print{ + body{ + background:none !important; + background: #fff; + background-color: #fff; + font-family: Arial,Helvetica,Verdana; + width:auto !important; + padding:5px !important; + font-size: 12px; + } + progress, + .menu, + #resize-w,#resize-h, #resize-wh, + #menu_left, + #layers_container, + #canvas_back, + #drop_zone, + .ddsmoothmenu{ + display: none; + height: 0; + width: 0; + } + #canvas_layers{ + margin:0px; + padding:0px; + } + canvas{ + border:0px; + position: absolute; + top:0px; + left:0px; + } + }