Browse Source

full, working wPaint oekaki implementation; fixes vichan-devel#20

pull/40/head
czaks 10 years ago
parent
commit
1a9e4eaef6
  1. 2
      js/upload-selection.js
  2. 2
      js/wPaint
  3. 111
      js/wpaint.js
  4. 2
      templates/header.html

2
js/upload-selection.js

@ -23,7 +23,6 @@ $(function(){
$("#upload_file").hide(); $("#upload_file").hide();
$("#upload_url").hide(); $("#upload_url").hide();
$("#upload_embed").hide(); $("#upload_embed").hide();
$("#oekaki").hide();
if (enabled_oekaki) { if (enabled_oekaki) {
if (window.oekaki.initialized) { if (window.oekaki.initialized) {
@ -53,7 +52,6 @@ $(function(){
enable_oekaki = function() { enable_oekaki = function() {
disable_all(); disable_all();
$("#oekaki").show();
window.oekaki.init(); window.oekaki.init();
}; };

2
js/wPaint

@ -1 +1 @@
Subproject commit a20cfb7d02631b7afa708fb91365dff165776c04 Subproject commit ae15131585dd7c40a61d440e5a3740b5fc68780f

111
js/wpaint.js

@ -5,6 +5,10 @@
* Released under the MIT license * Released under the MIT license
* Copyright (c) 2014 Marcin Łabanowski <marcin@6irc.net> * Copyright (c) 2014 Marcin Łabanowski <marcin@6irc.net>
* *
* Contains parts of old oekaki code:
* Copyright (c) 2013 copypaste <wizardchan@hush.com>
* Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net>
*
* Usage: * Usage:
* $config['additional_javascript'][] = 'js/jquery.min.js'; * $config['additional_javascript'][] = 'js/jquery.min.js';
* $config['additional_javascript'][] = 'js/jquery-ui.custom.min.js'; * $config['additional_javascript'][] = 'js/jquery-ui.custom.min.js';
@ -12,24 +16,119 @@
* $config['additional_javascript'][] = 'js/wPaint/lib/wColorPicker.min.js'; * $config['additional_javascript'][] = 'js/wPaint/lib/wColorPicker.min.js';
* $config['additional_javascript'][] = 'js/wPaint/wPaint.min.js'; * $config['additional_javascript'][] = 'js/wPaint/wPaint.min.js';
* $config['additional_javascript'][] = 'js/wPaint/plugins/main/wPaint.menu.main.min.js'; * $config['additional_javascript'][] = 'js/wPaint/plugins/main/wPaint.menu.main.min.js';
* //$config['additional_javascript'][] = 'js/wPaint/plugins/text/wPaint.menu.text.min.js'; * $config['additional_javascript'][] = 'js/wPaint/plugins/text/wPaint.menu.text.min.js';
* //$config['additional_javascript'][] = 'js/wPaint/plugins/shapes/wPaint.menu.main.shapes.min.js'; * $config['additional_javascript'][] = 'js/wPaint/plugins/shapes/wPaint.menu.main.shapes.min.js';
* //$config['additional_javascript'][] = 'js/wPaint/plugins/file/wPaint.menu.main.file.min.js'; * $config['additional_javascript'][] = 'js/wPaint/plugins/file/wPaint.menu.main.file.min.js';
* $config['additional_javascript'][] = 'js/wpaint.js'; * $config['additional_javascript'][] = 'js/wpaint.js';
* $config['additional_javascript'][] = 'js/upload-selection.js'; * $config['additional_javascript'][] = 'js/upload-selection.js';
* *
*/ */
(function(){ window.oekaki = (function(){
"use strict";
var oekaki = {};
oekaki.settings = new script_settings('wpaint');
oekaki.height = oekaki.settings.get("height", 250);
oekaki.width = oekaki.settings.get("width", 500);
var oekaki = window.oekaki = {}; function dataURItoBlob(dataURI) {
var binary = atob(dataURI.split(',')[1]);
var array = new Array(binary.length);
for(var i = 0; i < binary.length; i++) {
array[i] = binary.charCodeAt(i);
}
return new Blob([new Uint8Array(array)], {type: 'image/jpeg'});
}
oekaki.do_css = function() {
}
oekaki.init = function() { oekaki.init = function() {
var oekaki_form = '<tr id="oekaki"><th>Oekaki</th><td><div id="wpaintctr"><div id="wpaintdiv"></div></div></td></tr>';
// Add oekaki after the file input
$('form[name="post"]:not(#quick-reply) input[type="file"]').parent().parent().after(oekaki_form);
$('<link class="wpaintcss" rel="stylesheet" href="'+configRoot+'js/wPaint/wPaint.min.css" />').appendTo($("head"));
$('<link class="wpaintcss" rel="stylesheet" href="'+configRoot+'js/wPaint/lib/wColorPicker.min.css" />').appendTo($("head"));
$('<link class="wpaintcss" rel="stylesheet" href="'+configRoot+'stylesheets/jquery-ui/core.css" />').appendTo($("head"));
$('<link class="wpaintcss" rel="stylesheet" href="'+configRoot+'stylesheets/jquery-ui/resizable.css" />').appendTo($("head"));
$('<link class="wpaintcss" rel="stylesheet" href="'+configRoot+'stylesheets/jquery-ui/theme.css" />').appendTo($("head"));
var initcount = 0;
$('.wpaintcss').one('load', function() {
initcount++;
if (initcount == 5) {
$.extend($.fn.wPaint.defaults, {
mode: 'pencil', // set mode
lineWidth: '1', // starting line width
fillStyle: '#FFFFFF', // starting fill style
strokeStyle: '#000000', // start stroke style
});
delete $.fn.wPaint.menus.main.items.save;
$('#wpaintdiv').wPaint({
path: configRoot+'js/wPaint/',
menuOffsetTop: -46,
bg: "#ffffff",
loadImgFg: oekaki.load_img,
loadImgBg: oekaki.load_img
});
$("#wpaintctr").resizable({
stop: function(event,ui) {
$("#wpaintdiv").wPaint("resize");
},
alsoResize: "#wpaintdiv, #wpaintdiv canvas",
});
$('#wpaintctr .ui-resizable-se').css({'height':'12px', 'width':'12px'});
}
});
$("#wpaintdiv").width(oekaki.width).height(oekaki.height).css("position", "relative");
$("#wpaintctr").width(oekaki.width+5).height(oekaki.height+5).css("padding-top", 48).css("position", "relative");
$(document).on("ajax_before_post.wpaint", function(e, postData) {
var blob = $('#wpaintdiv').wPaint("image");
blob = dataURItoBlob(blob);
postData.append("file", blob, "Oekaki.png");
});
$(window).on('stylesheet', function() {
oekaki.do_css();
if ($('link#stylesheet').attr('href')) {
$('link#stylesheet')[0].onload = do_css;
}
});
oekaki.initialized = true;
};
oekaki.load_img = function() {
alert(_("Click on any image on this site to load it into oekaki applet"));
$('img').one('click.loadimg', function(e) {
$('img').off('click.loadimg');
e.stopImmediatePropagation();
e.preventDefault();
var url = $(this).prop('src');
$('#wpaintdiv').wPaint('setBg', url);
return false;
});
}; };
oekaki.deinit = function() { oekaki.deinit = function() {
$('#oekaki, .wpaintcss').remove();
$(document).off("ajax_before_post.wpaint");
oekaki.initialized = false;
}; };
oekaki.initialized = false; oekaki.initialized = false;
return oekaki;
})(); })();

2
templates/header.html

@ -7,7 +7,7 @@
{% if config.font_awesome %}<link rel="stylesheet" media="screen" href="{{ config.root }}{{ config.font_awesome_css }}">{% endif %} {% if config.font_awesome %}<link rel="stylesheet" media="screen" href="{{ config.root }}{{ config.font_awesome_css }}">{% endif %}
<script type="text/javascript"> <script type="text/javascript">
var configRoot="{{ config.root }}"; var configRoot="{{ config.root }}";
var inMod = {% if mod %}true{% else %}false{% end %}; var inMod = {% if mod %}true{% else %}false{% endif %};
var modRoot="{{ config.root }}"+(inMod ? "mod.php?/" : ""); var modRoot="{{ config.root }}"+(inMod ? "mod.php?/" : "");
</script> </script>
{% if not nojavascript %} {% if not nojavascript %}

Loading…
Cancel
Save