From 95dfe14528663923ca2a88ec928f1d8d9df2402b Mon Sep 17 00:00:00 2001
From: bai
Date: Fri, 29 Mar 2019 02:14:43 +0000
Subject: Init
---
static/js/wpaint/.gitignore | 3 +
static/js/wpaint/README.md | 421 +++++++
static/js/wpaint/bai.js | 23 +
static/js/wpaint/demo/demo.css | 266 +++++
static/js/wpaint/demo/img/facebook-icon.png | Bin 0 -> 274 bytes
static/js/wpaint/demo/img/favicon.ico | Bin 0 -> 1150 bytes
.../js/wpaint/demo/img/forkme_right_darkblue.png | Bin 0 -> 7791 bytes
static/js/wpaint/demo/img/github-icon.png | Bin 0 -> 596 bytes
static/js/wpaint/demo/img/googleplus-icon.png | Bin 0 -> 522 bytes
static/js/wpaint/demo/img/linkedin-icon.png | Bin 0 -> 380 bytes
static/js/wpaint/demo/img/rss-icon.png | Bin 0 -> 521 bytes
static/js/wpaint/demo/img/stumbleupon-icon.png | Bin 0 -> 537 bytes
static/js/wpaint/demo/img/twitter-icon.png | Bin 0 -> 514 bytes
.../demo/img/websanova-logo-small-full-black.png | Bin 0 -> 1028 bytes
static/js/wpaint/demo/img/youtube-icon.png | Bin 0 -> 587 bytes
static/js/wpaint/gruntfile.js | 90 ++
static/js/wpaint/index.html | 136 +++
static/js/wpaint/lib/jquery.1.10.2.min.js | 6 +
static/js/wpaint/lib/jquery.ui.core.1.10.3.min.js | 4 +
.../wpaint/lib/jquery.ui.draggable.1.10.3.min.js | 4 +
static/js/wpaint/lib/jquery.ui.mouse.1.10.3.min.js | 4 +
.../js/wpaint/lib/jquery.ui.widget.1.10.3.min.js | 4 +
static/js/wpaint/lib/mixins.styl | 7 +
static/js/wpaint/lib/wColorPicker.min.css | 42 +
static/js/wpaint/lib/wColorPicker.min.js | 2 +
static/js/wpaint/package.json | 25 +
.../plugins/file/img/icons-menu-main-file.png | Bin 0 -> 835 bytes
.../plugins/file/src/wPaint.menu.main.file.js | 75 ++
.../plugins/file/wPaint.menu.main.file.min.js | 1 +
.../js/wpaint/plugins/main/img/cursor-bucket.png | Bin 0 -> 450 bytes
.../wpaint/plugins/main/img/cursor-crosshair.png | Bin 0 -> 208 bytes
.../js/wpaint/plugins/main/img/cursor-dropper.png | Bin 0 -> 403 bytes
.../js/wpaint/plugins/main/img/cursor-eraser1.png | Bin 0 -> 193 bytes
.../js/wpaint/plugins/main/img/cursor-eraser10.png | Bin 0 -> 247 bytes
.../js/wpaint/plugins/main/img/cursor-eraser2.png | Bin 0 -> 200 bytes
.../js/wpaint/plugins/main/img/cursor-eraser3.png | Bin 0 -> 206 bytes
.../js/wpaint/plugins/main/img/cursor-eraser4.png | Bin 0 -> 209 bytes
.../js/wpaint/plugins/main/img/cursor-eraser5.png | Bin 0 -> 225 bytes
.../js/wpaint/plugins/main/img/cursor-eraser6.png | Bin 0 -> 229 bytes
.../js/wpaint/plugins/main/img/cursor-eraser7.png | Bin 0 -> 236 bytes
.../js/wpaint/plugins/main/img/cursor-eraser8.png | Bin 0 -> 240 bytes
.../js/wpaint/plugins/main/img/cursor-eraser9.png | Bin 0 -> 244 bytes
.../js/wpaint/plugins/main/img/cursor-pencil.png | Bin 0 -> 449 bytes
.../wpaint/plugins/main/img/icon-group-arrow.png | Bin 0 -> 208 bytes
.../js/wpaint/plugins/main/img/icons-menu-main.png | Bin 0 -> 2836 bytes
static/js/wpaint/plugins/main/src/fillArea.min.js | 1 +
.../js/wpaint/plugins/main/src/wPaint.menu.main.js | 338 ++++++
.../js/wpaint/plugins/main/wPaint.menu.main.min.js | 1 +
.../plugins/shapes/img/icons-menu-main-shapes.png | Bin 0 -> 903 bytes
static/js/wpaint/plugins/shapes/src/shapes.min.js | 1 +
.../plugins/shapes/src/wPaint.menu.main.shapes.js | 207 ++++
.../plugins/shapes/wPaint.menu.main.shapes.min.js | 1 +
.../js/wpaint/plugins/text/img/icons-menu-text.png | Bin 0 -> 802 bytes
.../js/wpaint/plugins/text/src/wPaint.menu.text.js | 227 ++++
.../js/wpaint/plugins/text/wPaint.menu.text.min.js | 1 +
static/js/wpaint/src/wPaint.css | 348 ++++++
static/js/wpaint/src/wPaint.js | 1181 ++++++++++++++++++++
static/js/wpaint/src/wPaint.utils.js | 70 ++
static/js/wpaint/test/dev.html | 123 ++
static/js/wpaint/test/fullscreen.html | 79 ++
static/js/wpaint/test/upload.php | 11 +
static/js/wpaint/test/uploads/test1.png | Bin 0 -> 432 bytes
static/js/wpaint/test/uploads/test2.png | Bin 0 -> 462 bytes
static/js/wpaint/test/uploads/test3.png | Bin 0 -> 454 bytes
static/js/wpaint/test/uploads/wPaint.png | Bin 0 -> 3096 bytes
static/js/wpaint/wPaint.jquery.json | 38 +
static/js/wpaint/wPaint.min.css | 66 ++
static/js/wpaint/wPaint.min.js | 1 +
68 files changed, 3807 insertions(+)
create mode 100644 static/js/wpaint/.gitignore
create mode 100644 static/js/wpaint/README.md
create mode 100644 static/js/wpaint/bai.js
create mode 100644 static/js/wpaint/demo/demo.css
create mode 100644 static/js/wpaint/demo/img/facebook-icon.png
create mode 100644 static/js/wpaint/demo/img/favicon.ico
create mode 100644 static/js/wpaint/demo/img/forkme_right_darkblue.png
create mode 100644 static/js/wpaint/demo/img/github-icon.png
create mode 100644 static/js/wpaint/demo/img/googleplus-icon.png
create mode 100644 static/js/wpaint/demo/img/linkedin-icon.png
create mode 100644 static/js/wpaint/demo/img/rss-icon.png
create mode 100644 static/js/wpaint/demo/img/stumbleupon-icon.png
create mode 100644 static/js/wpaint/demo/img/twitter-icon.png
create mode 100644 static/js/wpaint/demo/img/websanova-logo-small-full-black.png
create mode 100644 static/js/wpaint/demo/img/youtube-icon.png
create mode 100644 static/js/wpaint/gruntfile.js
create mode 100644 static/js/wpaint/index.html
create mode 100644 static/js/wpaint/lib/jquery.1.10.2.min.js
create mode 100644 static/js/wpaint/lib/jquery.ui.core.1.10.3.min.js
create mode 100644 static/js/wpaint/lib/jquery.ui.draggable.1.10.3.min.js
create mode 100644 static/js/wpaint/lib/jquery.ui.mouse.1.10.3.min.js
create mode 100644 static/js/wpaint/lib/jquery.ui.widget.1.10.3.min.js
create mode 100644 static/js/wpaint/lib/mixins.styl
create mode 100644 static/js/wpaint/lib/wColorPicker.min.css
create mode 100644 static/js/wpaint/lib/wColorPicker.min.js
create mode 100644 static/js/wpaint/package.json
create mode 100644 static/js/wpaint/plugins/file/img/icons-menu-main-file.png
create mode 100644 static/js/wpaint/plugins/file/src/wPaint.menu.main.file.js
create mode 100644 static/js/wpaint/plugins/file/wPaint.menu.main.file.min.js
create mode 100644 static/js/wpaint/plugins/main/img/cursor-bucket.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-crosshair.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-dropper.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser1.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser10.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser2.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser3.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser4.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser5.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser6.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser7.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser8.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-eraser9.png
create mode 100644 static/js/wpaint/plugins/main/img/cursor-pencil.png
create mode 100644 static/js/wpaint/plugins/main/img/icon-group-arrow.png
create mode 100644 static/js/wpaint/plugins/main/img/icons-menu-main.png
create mode 100644 static/js/wpaint/plugins/main/src/fillArea.min.js
create mode 100644 static/js/wpaint/plugins/main/src/wPaint.menu.main.js
create mode 100644 static/js/wpaint/plugins/main/wPaint.menu.main.min.js
create mode 100644 static/js/wpaint/plugins/shapes/img/icons-menu-main-shapes.png
create mode 100644 static/js/wpaint/plugins/shapes/src/shapes.min.js
create mode 100644 static/js/wpaint/plugins/shapes/src/wPaint.menu.main.shapes.js
create mode 100644 static/js/wpaint/plugins/shapes/wPaint.menu.main.shapes.min.js
create mode 100644 static/js/wpaint/plugins/text/img/icons-menu-text.png
create mode 100644 static/js/wpaint/plugins/text/src/wPaint.menu.text.js
create mode 100644 static/js/wpaint/plugins/text/wPaint.menu.text.min.js
create mode 100644 static/js/wpaint/src/wPaint.css
create mode 100644 static/js/wpaint/src/wPaint.js
create mode 100644 static/js/wpaint/src/wPaint.utils.js
create mode 100644 static/js/wpaint/test/dev.html
create mode 100644 static/js/wpaint/test/fullscreen.html
create mode 100644 static/js/wpaint/test/upload.php
create mode 100644 static/js/wpaint/test/uploads/test1.png
create mode 100644 static/js/wpaint/test/uploads/test2.png
create mode 100644 static/js/wpaint/test/uploads/test3.png
create mode 100644 static/js/wpaint/test/uploads/wPaint.png
create mode 100644 static/js/wpaint/wPaint.jquery.json
create mode 100644 static/js/wpaint/wPaint.min.css
create mode 100644 static/js/wpaint/wPaint.min.js
(limited to 'static/js/wpaint')
diff --git a/static/js/wpaint/.gitignore b/static/js/wpaint/.gitignore
new file mode 100644
index 0000000..7a48116
--- /dev/null
+++ b/static/js/wpaint/.gitignore
@@ -0,0 +1,3 @@
+test/uploads/wPaint-*
+node_modules/
+npm-debug.txt
\ No newline at end of file
diff --git a/static/js/wpaint/README.md b/static/js/wpaint/README.md
new file mode 100644
index 0000000..eac4c2a
--- /dev/null
+++ b/static/js/wpaint/README.md
@@ -0,0 +1,421 @@
+# wPaint.js
+
+A jQuery paint plugin for a simple drawing surface that you can easily pop into your pages, similar to the basic windows paint program.
+
+* [View the wPaint demo](http://wpaint.websanova.com)
+* [Download the lastest version of wPaint](https://github.com/websanova/wPaint/tags)
+
+
+## Related Plugins
+
+* [wScratchPad](http://wscratchpad.websanova.com) - Plugin simulating scratch card.
+* [wColorPicker](http://wcolorpicker.websanova.com) - Color pallette seleciton plugin.
+
+
+## Support
+
+If you enjoy this plugin please leave a small contribution on [Gittip](https://gittip.com/websanova). I work on these plugins completely in my free time and any contribution is greatly appreciated.
+
+
+## Settings
+
+Settings are available per plugin. Meaning only when that plugin is included will those settings be available.
+
+### core
+
+```js
+$.fn.wPaint.defaults = {
+ path: '/', // set absolute path for images and cursors
+ theme: 'standard classic', // set theme
+ autoScaleImage: true, // auto scale images to size of canvas (fg and bg)
+ autoCenterImage: true, // auto center images (fg and bg, default is left/top corner)
+ menuHandle: true, // setting to false will means menus cannot be dragged around
+ menuOrientation: 'horizontal', // menu alignment (horizontal,vertical)
+ menuOffsetLeft: 5, // left offset of primary menu
+ menuOffsetTop: 5, // top offset of primary menu
+ bg: null, // set bg on init
+ image: null, // set image on init
+ imageStretch: false, // stretch smaller images to full canvans dimensions
+ onShapeDown: null, // callback for draw down event
+ onShapeMove: null, // callback for draw move event
+ onShapeUp: null // callback for draw up event
+};
+```
+
+### main
+
+```js
+$.extend($.fn.wPaint.defaults, {
+ mode: 'pencil', // set mode
+ lineWidth: '3', // starting line width
+ fillStyle: '#FFFFFF', // starting fill style
+ strokeStyle: '#FFFF00' // start stroke style
+});
+```
+
+### text
+
+```js
+$.extend($.fn.wPaint.defaults, {
+ fontSize : '12', // current font size for text input
+ fontFamily : 'Arial', // active font family for text input
+ fontBold : false, // text input bold enable/disable
+ fontItalic : false, // text input italic enable/disable
+ fontUnderline : false // text input italic enable/disable
+});
+```
+
+### shapes
+
+No settings.
+
+### file
+
+Note that the callbacks for `file` are user generated for the most part as they deal heavily with client/server side code. You can view the demo code to get a feeling for how they might be setup.
+
+```js
+$.extend($.fn.wPaint.defaults, {
+ saveImg: null, // callback triggerd on image save
+ loadImgFg: null, // callback triggered on image fg
+ loadImgBg: null // callback triggerd on image bg
+});
+```
+
+
+## Examples
+
+To start, you will need to include any dependencies (the paths and versions may differ):
+```html
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+Then you need to include the wPaint core files:
+```html
+
+
+```
+
+From here we will need to include plugin files for whatever menu icons we would like to support. This can include the plugins provided with the release of this plugin or any additional plugins that you can write on your own.
+
+```html
+
+
+
+
+```
+
+
+### path
+
+If you are putting wPaint into a path other than root (most likely you will) then you will need to set the `path` option since the image and cursor icon paths are set in the JavaScript and not in CSS. This means we can not make them relative from the included file like we can in the CSS file but rather relative to the dispalying page. The default path is just the root folder `/` but a path can be set for wpaint.
+
+```js
+$('#wPaint').wPaint({
+ path: '/js/lib/wPaint/'
+});
+```
+
+
+### save / load
+
+There have been many questions regarding saving / loading images using wPaint. Loading images CANNOT be done locally or from other domains due to browser restrictions with [cross origin](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript) policies. There are some potential workarounds for this using [CORS](https://developer.mozilla.org/en-US/docs/HTML/CORS_Enabled_Image?redirectlocale=en-US&redirectslug=CORS_Enabled_Image) but this has not been implemented yet.
+
+As it stands the best approach to this is to first upload the image to your server, save it, then use the url from your server to set images in the future. You can check the `upload.php` file in the `test` folder with a php example for saving an image. However note that saving the image on your server will depend on the language/framework being used.
+
+
+### themes
+
+With this release multiple themeing has been introduced by simply space separating multiple theme keywords. For example 'standard classic'. This is to allow us to theme colours and sizes separately and use them interchangeably.
+
+```js
+$("#elem").wPaint({
+ theme: 'standard classic'
+});
+```
+
+
+### image data
+
+Set image on the fly. This can be a base64 encoded image or simply a path to any image on the same domain.
+
+```js
+$('#wPaint').wPaint('image', '');
+```
+
+Get the image data:
+
+```js
+var imageData = $("#wPaint").wPaint("image");
+
+$("#canvasImage").attr('src', imageData);
+```
+
+
+### callbacks
+
+There are three callbacks available for each drawing operation of `down`, `move`, and `up`. Available is the `this` object which refers to the `wPaint` object and gives access to all internal functions.
+
+```js
+$("#elem").wPaint({
+ onDrawDown: function (e) {
+ console.log(this.settings.mode + ": " + e.pageX + ',' + e.pageY);
+ },
+ onDrawMove: function (e) {
+ console.log(this.settings.mode + ": " + e.pageX + ',' + e.pageY);
+ },
+ onDrawUp: function (e) {
+ console.log(this.settings.mode + ": " + e.pageX + ',' + e.pageY);
+ }
+});
+```
+
+
+### image / bg
+
+Set the image or background with an image or color at any time.
+
+```js
+$("#wPaint").wPaint({
+ image: './some/path/imagepreload.png',
+ bg: '#ff0000'
+});
+```
+
+
+### resize
+
+In case you want to resize your canvas there is a `resize` utility function available. Call this after you change the dimensions of your canvas element. Check the `test/fullscreen.html` demo for sample code.
+
+```js
+$("#wPaint").wPaint('resize');
+```
+
+
+### clear
+
+Clear the canvas manually.
+
+```javascript
+$('#wPaint').wPaint('clear');
+```
+
+
+### undo / redo
+
+We can also manually run an `undo` or `redo`.
+
+```javascript
+$('#wPaint').wPaint('undo');
+$('#wPaint').wPaint('redo');
+```
+
+
+## Extending
+
+With version 2.0 wPaint can now easily be extended by setting all or some of the following properties:
+
+```js
+// add menu
+$.fn.wPaint.menus.main = {
+ img: '/plugins/main/img/icons-menu-main.png',
+ items: {
+ undo: {
+ icon: 'generic',
+ title: 'Undo',
+ index: 0,
+ callback: function () { this.undo(); }
+ }
+}
+
+// extend cursors
+$.extend($.fn.wPaint.cursors, {
+ pencil: 'url("/plugins/main/img/cursor-pencil.png") 0 11.99, default',
+});
+
+// extend defaults
+$.extend($.fn.wPaint.defaults, {
+ mode: 'pencil', // set mode
+ lineWidth: '3', // starting line width
+ fillStyle: '#FFFFFF', // starting fill style
+ strokeStyle: '#FFFF00' // start stroke style
+});
+
+// extend functions
+$.fn.wPaint.extend({
+ undo: function () {
+ if (this.undoArray[this.undoCurrent - 1]) {
+ this._setUndo(--this.undoCurrent);
+ }
+
+ this._undoToggleIcons();
+ }
+});
+```
+
+
+### overriding
+
+When calling the `$.fn.wPaint.extend()` function the values for functions will not override the existing functions but just extend them with duck punching technique. This means the original funciton will always run followed by your extended function.
+
+This allows us to just string multiple `generate` or `init` functions together and not have to worry about overwriting any code.
+
+
+
+### menus
+
+The first menu appended will always automatically become the `primary` menu meaning it is the one displayed on init. All other menus will become `secondary` menus meaning they are toggled by icons.
+
+We can extend, modify or add items in the menu by updating the object we want. So for instance if we want to add a new icon to the main menu we could just do:
+
+```js
+$.fn.wPaint.menus.main.items.undo = {
+ // set properties here
+};
+```
+
+Likewise we can overwrite or add properties to an existing object. For instance below we modified the title and added the `after` property to change the position in which the `undo` icon will appear in the menu.
+
+```js
+$.fn.wPaint.menus.main.items.undo = {
+ title: 'Undo at your own risk',
+ after: 'clear'
+};
+```
+
+
+### icon properties
+
+Below is just a sample to list all possible icon properties. Note that the icon name such as `undo` is the `key` name used for CSS styling and internal naming.
+
+```js
+undo: {
+
+ // The icon sets the type of icon we want to generate
+ // below are the available types that come out of the box.
+ //
+ // generic: just runs a callback and nothing else
+ // activate: runs callback and activates (highlights)
+ // colorPicker: generates a color picker
+ // select: generates a select box (list)
+ // toggle: toggles on/off returns true or false
+ // menu: toggles secondary menu (icon/menu name must match)
+ icon: 'generic',
+
+ // Set a group for an icon turning it into a stacked
+ // group select (list). All icons with this group name will
+ // be appended to that select list. If not set the icon will
+ // just be standalone.
+ group: null,
+
+ // Set placement of icon in reference to another icon
+ after: 'clear',
+
+ // Title displayed on hover.
+ title: 'Undo',
+
+ // set an alternate image path to use for this icon
+ img: '/som/path.png',
+
+ // Index position in image file starting from 0
+ index: 0,
+
+ // a range of values to use for a select icon
+ range: [1, 2, 3, 4, 5],
+
+ // User range will set the value of the range as the
+ // css property based on the name of the icon. For instance
+ // if the icon is fontFamily that css property will get set.
+ useRange: true,
+
+ // The default value to set for this icon. This of course
+ // can be overridden using `set` calls on init.
+ value: 3,
+
+ // Callback when icon is clicked.
+ callback: function () { this.undo(); }
+}
+```
+
+If you want to create a new icon type you will need to extend wPaint to include processing for this new icon. A funciton in the form below should be written:
+
+```js
+_createIconType: function (item) {
+
+ // Get your started with a base icon.
+ var $icon = this._createIconBase(item);
+
+ // Return the icon with whatever functionality
+ // you want to add to it.
+ return $icon;
+}
+```
+
+
+### icon images
+
+Images for each plugin should be kept in one file and can be either specificed by the `img` value on the top level and can be overriden at the icon level. Each icon should also specify an index value as to the position of the icon in the image starting from 0. Icons should alll be the same size and dimensions should be set in the `size` theme.
+
+```js
+$.fn.wPaint.menus.main.items.undo = {
+ img: '/plugins/main/img/icons-menu-main.png',
+ items: {
+ undo: {
+ icon: 'generic',
+ title: 'Undo',
+ img: '/some/other/path.png'
+ index: 0,
+ callback: function () { this.undo(); }
+ }
+}
+```
+
+
+### cursors
+
+There is now a master `cursors` object used to store cursor references.
+
+$.extend($.fn.wPaint.cursors, {
+ pencil: 'url("/plugins/main/img/cursor-pencil.png") 0 11.99, default',
+});
+
+We can sepcify the cursor to use by calling `setCursor()` and passing the cursor name to use. Note that this is a set function and we can set the cursor at any time.
+
+```js
+$('#wPaint').wPaint('cursor', 'rocket');
+```
+
+Note that when you are setting the position of the cursor never set it to the exact dimension. For instance if the iamge is `12x12` and you want it's position to be `12` set it to `11.99`. This is do to some strange bug in Chrome which will not position the curosr if set exactly.
+
+
+## Thanks
+
+Thanks to everyone who has contribute code in the previous version and has showed interest in the plugin. Below is some thanks and attribution for code used in this plugin (if I left you out please let me know).
+
+* [Rounded corners and extending Canvas with new shapes](http://js-bits.blogspot.com/2010/07/canvas-rounded-corner-rectangles.html)
+* [Nice efficient algorithm for fill tool](http://www.williammalone.com/articles/html5-canvas-javascript-paint-bucket-tool)
+
+
+## Resources
+
+* [More jQuery plugins by Websanova](http://websanova.com/plugins)
+* [Websanova JavaScript Extensions Project](http://websanova.com/extensions)
+* [jQuery Plugin Development Boilerplate](http://wboiler.websanova.com)
+* [The Ultimate Guide to Writing jQuery Plugins](http://www.websanova.com/blog/jquery/the-ultimate-guide-to-writing-jquery-plugins)
+
+
+## License
+
+MIT licensed
+
+Copyright (C) 2011-2012 Websanova http://www.websanova.com
diff --git a/static/js/wpaint/bai.js b/static/js/wpaint/bai.js
new file mode 100644
index 0000000..6b436c1
--- /dev/null
+++ b/static/js/wpaint/bai.js
@@ -0,0 +1,23 @@
+function saveImg(image) {
+ var _this = this;
+ var url = document.getElementById('finish').href;
+
+ $.ajax({
+ type: 'POST',
+ url: '/oek_temp/upload.php',
+ data: {image: image},
+ success: function (resp) {
+ _this._displayStatus('Image saved successfully');
+ window.location.href = url;
+ }
+ });
+}
+
+$('#wPaint').wPaint({
+ path: '/static/js/wpaint/',
+ bg: '#ffffff',
+ menuOffsetLeft: -35,
+ menuOffsetTop: -50,
+ menuOrientation: 'horizontal',
+ saveImg: saveImg
+});
\ No newline at end of file
diff --git a/static/js/wpaint/demo/demo.css b/static/js/wpaint/demo/demo.css
new file mode 100644
index 0000000..ad8a418
--- /dev/null
+++ b/static/js/wpaint/demo/demo.css
@@ -0,0 +1,266 @@
+/*** layout ***/
+
+body, html {
+ font-family: verdana;
+ font-size: 12px;
+ line-height:20px;
+ color: #333;
+ background-color: #FEFEFE;
+ margin: 0;
+ text-rendering: optimizeLegibility;
+}
+a {
+ color: #3399FF;
+ text-decoration: none;
+}
+code {
+ padding: 1px 3px;
+ color: #D14;
+ background-color: #F7F7F9;
+ border: 1px solid #E1E1E8;
+ border-radius: 5px;
+}
+
+h2 {
+ display: inline-block;
+}
+
+.no-margin-top {
+ margin-top: 0px;
+}
+
+/*** header ***/
+
+header {
+ position: fixed;
+ left: 0px;
+ top: 0px;
+ width: 100%;
+ height: 40px;
+ line-height: 40px;
+ background-color: #1B1B1B;
+ background-image: linear-gradient(to bottom, #222222, #111111);
+ background-repeat: repeat-x;
+ border-color: #252525;
+ box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
+ border-width: 0 0 1px;
+ color: #FFF;
+ font-size: 10px;
+ text-align: left;
+ vertical-align: middle;
+ z-index: 100;
+}
+#header-logo {
+ position: absolute;
+ display: block;
+ width: 94px;
+ height: 20px;
+ left: 10px;
+ top: 10px;
+ background-image: url('./img/websanova-logo-small-full-black.png');
+}
+#header-links {
+ display: none;
+ position: absolute;
+ width: 100%;
+ left: 0px;
+ top: 40px;
+}
+#header-links a {
+ display: block;
+ font-size: 9px;
+ font-weight: bold;
+ font-family: Verdana;
+ color: #FAFAFA;
+ text-transform: uppercase;
+ margin-left: 0px;
+ text-align: center;
+ background-color: #1B1B1B;
+ border-top: solid 1px #CACACA;
+ line-height: 14px;
+ padding: 10px;
+}
+#header-links a:hover {
+ color: #636363;
+}
+
+/*** menu ***/
+
+#header-menu-button {
+ position: absolute;
+ right: 6px;
+ top: 6px;
+ display: block;
+ color: #757575;
+ background-color: #e1e1e1;
+ background-repeat: repeat-x;
+ background-image: -moz-linear-gradient(top, #ebebeb, #e1e1e1);
+ background-image: -ms-linear-gradient(top, #ebebeb, #e1e1e1);
+ background-image: -webkit-linear-gradient(top, #ebebeb, #e1e1e1);
+ background-image: -o-linear-gradient(top, #ebebeb, #e1e1e1);
+ background-image: linear-gradient(top, #ebebeb, #e1e1e1);
+ box-shadow: inset 0 0 8px 2px #c6c6c6, 0 1px 0 0 #f4f4f4;
+ border: none;
+ border-radius: 3px;
+ -webkit-border-radius: 3px;
+ padding: 6px 10px;
+ font-size: 11px;
+ line-height: 16px;
+ cursor: pointer;
+}
+
+/*** content ***/
+
+#plugin-name {
+ padding-bottom: 30px;
+ font-size: 24px;
+ border-bottom: solid #CACACA 1px;
+}
+#github-button {
+ display: block;
+ float: left;
+ margin-right: 2px;
+ width: 16px;
+ height: 16px;
+ cursor: pointer;
+ background-image: url('./img/addthis-github.png');
+}
+#addthis-toolbox {
+ position: absolute;
+ right: 15px;
+ top: 40px;
+}
+#content {
+ position: relative;
+ background: #FEFEFE;
+ max-width: 728px;
+ padding: 20px;
+ margin: 30px auto;
+}
+.content-box {
+ padding-left: 10px;
+}
+#content ul {
+ padding-left: 30px;
+}
+/*** footer ***/
+
+footer {
+ position: fixed;
+ left: 0px;
+ bottom: -1px;
+ width: 100%;
+ height: 40px;
+ line-height: 40px;
+ background-color: #1B1B1B;
+ background-image: linear-gradient(to bottom, #222222, #111111);
+ background-repeat: repeat-x;
+ border-color: #252525;
+ box-shadow: 10px 1px 10px rgba(0, 0, 0, 0.5);
+ border-width: 0 0 1px;
+ color: #FFF;
+ font-size: 10px;
+ text-align: left;
+ vertical-align: middle;
+ z-index: 100;
+}
+#footer-icons {
+ position: absolute;
+ right: 10px;
+ top: 0px;
+}
+#footer-icons a {
+ display: inline-block;
+ *display: inline;
+ zoom: 1;
+ width: 17px;
+ height: 17px;
+ margin: 12px 0 0 10px;
+ background-repeat: no-repeat;
+ background-position: center center;
+}
+#linkedin-icon { background-image: url('./img/linkedin-icon.png'); width: 18px; }
+#stumbleupon-icon { background-image: url('./img/stumbleupon-icon.png'); }
+#googleplus-icon { background-image: url('./img/googleplus-icon.png'); }
+#youtube-icon { background-image: url('./img/youtube-icon.png'); width: 17px; height: 18px; }
+#facebook-icon { background-image: url('./img/facebook-icon.png'); width: 8px; }
+#twitter-icon { background-image: url('./img/twitter-icon.png'); width: 20px; }
+#github-icon { background-image: url('./img/github-icon.png'); width: 20px; }
+#rss-icon { background-image: url('./img/rss-icon.png'); }
+
+
+/*** media ***/
+
+@media screen and (min-width: 600px) {
+ #header-logo {
+ left: 50px;
+ }
+ #footer-icons {
+ left: auto;
+ right: 50px;
+ }
+ #header-links {
+ display: block !important;
+ width: auto;
+ top: 0px;
+ left: auto;
+ right: 50px;
+ }
+ #header-links a {
+ display: inline;
+ font-size: 10px;
+ margin-left: 20px;
+ text-align: left;
+ background-color: none;
+ border-top: 0px;
+ margin-left: 10px;
+ line-height: inherit;
+ padding: 0px;
+ }
+ #header-menu-button {
+ display: none;
+ }
+ #plugin-name {
+ font-size: 30px;
+ }
+ #addthis-toolbox {
+ top: 44px;
+ }
+}
+
+/*** ads ***/
+
+.websanova-plugins-page-horizontal-responsive { display:block; margin:0 auto; width: 320px; height: 50px; }
+@media(min-width: 520px) { .websanova-plugins-page-horizontal-responsive { width: 468px; height: 60px; } }
+@media(min-width: 800px) { .websanova-plugins-page-horizontal-responsive { width: 728px; height: 90px; } }
+
+.adsblock {
+ position: relative;
+ margin: 0 auto;
+}
+.ads2block {
+ margin-top: 20px;
+}
+.adsblock-mobile-banner {
+ width: 320px;
+ height: 50px;
+}
+.adsblock-banner {
+ display: none;
+ width: 468px;
+ height: 60px;
+}
+.adsblock-leaderboard {
+ display: none;
+ width: 728px;
+ height: 90px;
+}
+@media (min-width:520px) {
+ .adsblock-mobile-banner { display: none; }
+ .adsblock-banner { display: block; }
+}
+@media (min-width:800px) {
+ .adsblock-mobile-banner { display: none; }
+ .adsblock-banner { display: none; }
+ .adsblock-leaderboard { display: block; }
+}
\ No newline at end of file
diff --git a/static/js/wpaint/demo/img/facebook-icon.png b/static/js/wpaint/demo/img/facebook-icon.png
new file mode 100644
index 0000000..dfb0f3e
Binary files /dev/null and b/static/js/wpaint/demo/img/facebook-icon.png differ
diff --git a/static/js/wpaint/demo/img/favicon.ico b/static/js/wpaint/demo/img/favicon.ico
new file mode 100644
index 0000000..9bd6326
Binary files /dev/null and b/static/js/wpaint/demo/img/favicon.ico differ
diff --git a/static/js/wpaint/demo/img/forkme_right_darkblue.png b/static/js/wpaint/demo/img/forkme_right_darkblue.png
new file mode 100644
index 0000000..146ef8a
Binary files /dev/null and b/static/js/wpaint/demo/img/forkme_right_darkblue.png differ
diff --git a/static/js/wpaint/demo/img/github-icon.png b/static/js/wpaint/demo/img/github-icon.png
new file mode 100644
index 0000000..a28067c
Binary files /dev/null and b/static/js/wpaint/demo/img/github-icon.png differ
diff --git a/static/js/wpaint/demo/img/googleplus-icon.png b/static/js/wpaint/demo/img/googleplus-icon.png
new file mode 100644
index 0000000..6567f6e
Binary files /dev/null and b/static/js/wpaint/demo/img/googleplus-icon.png differ
diff --git a/static/js/wpaint/demo/img/linkedin-icon.png b/static/js/wpaint/demo/img/linkedin-icon.png
new file mode 100644
index 0000000..a2628e7
Binary files /dev/null and b/static/js/wpaint/demo/img/linkedin-icon.png differ
diff --git a/static/js/wpaint/demo/img/rss-icon.png b/static/js/wpaint/demo/img/rss-icon.png
new file mode 100644
index 0000000..faae141
Binary files /dev/null and b/static/js/wpaint/demo/img/rss-icon.png differ
diff --git a/static/js/wpaint/demo/img/stumbleupon-icon.png b/static/js/wpaint/demo/img/stumbleupon-icon.png
new file mode 100644
index 0000000..5e82ea8
Binary files /dev/null and b/static/js/wpaint/demo/img/stumbleupon-icon.png differ
diff --git a/static/js/wpaint/demo/img/twitter-icon.png b/static/js/wpaint/demo/img/twitter-icon.png
new file mode 100644
index 0000000..499ca0c
Binary files /dev/null and b/static/js/wpaint/demo/img/twitter-icon.png differ
diff --git a/static/js/wpaint/demo/img/websanova-logo-small-full-black.png b/static/js/wpaint/demo/img/websanova-logo-small-full-black.png
new file mode 100644
index 0000000..a5bd0f6
Binary files /dev/null and b/static/js/wpaint/demo/img/websanova-logo-small-full-black.png differ
diff --git a/static/js/wpaint/demo/img/youtube-icon.png b/static/js/wpaint/demo/img/youtube-icon.png
new file mode 100644
index 0000000..e697406
Binary files /dev/null and b/static/js/wpaint/demo/img/youtube-icon.png differ
diff --git a/static/js/wpaint/gruntfile.js b/static/js/wpaint/gruntfile.js
new file mode 100644
index 0000000..4e1eb06
--- /dev/null
+++ b/static/js/wpaint/gruntfile.js
@@ -0,0 +1,90 @@
+module.exports = function(grunt) {
+ grunt.initConfig({
+ pkg: grunt.file.readJSON('package.json'),
+ jshint: {
+ options: {
+ bitwise: true,
+ camelcase: true,
+ indent: 2,
+ curly: true,
+ eqeqeq: true,
+ immed: true,
+ latedef: true,
+ newcap: true,
+ noarg: true,
+ sub: true,
+ undef: true,
+ unused: true,
+ boss: true,
+ eqnull: true,
+ white: true,
+ validthis: true,
+ quotmark: 'single',
+ globals: {
+ 'window': true,
+ 'jQuery': true,
+ 'document': true,
+ 'Image': true,
+ 'setTimeout': true,
+ 'clearTimeout': true,
+ 'event': true,
+ 'CanvasRenderingContext2D': true
+ }
+ },
+ files: {
+ src: ['./plugins/**/src/wPaint-*.js', './src/*.js']
+ }
+ },
+ uglify: {
+ options: {
+ banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today("yyyy-mm-dd") %> */'
+ },
+ my_target: {
+ files: {
+ './wPaint.min.js': ['./src/wPaint.js', './src/wPaint.utils.js'],
+ './plugins/main/wPaint.menu.main.min.js': ['./plugins/main/src/wPaint.menu.main.js', './plugins/main/src/fillArea.min.js'],
+ './plugins/text/wPaint.menu.text.min.js': ['./plugins/text/src/wPaint.menu.text.js'],
+ './plugins/shapes/wPaint.menu.main.shapes.min.js': ['./plugins/shapes/src/wPaint.menu.main.shapes.js', './plugins/shapes/src/shapes.min.js'],
+ './plugins/file/wPaint.menu.main.file.min.js': ['./plugins/file/src/wPaint.menu.main.file.js']
+ }
+ }
+ },
+ stylus: {
+ compile: {
+ options: {
+ import: ['nib', '../lib/mixins'],
+ },
+ files: {
+ './wPaint.min.css': './src/wPaint.css'
+ }
+ }
+ },
+ concat: {
+ basic_and_extras: {
+ files: {
+ 'wPaint-min.js': ['./lib/wColorPicker.min.js', './wPaint.min.js'],
+ 'wPaint-min.css': ['./lib/wColorPicker.min.css', './wPaint.min.css'],
+ },
+ }
+ },
+ watch: {
+ files: [
+ './src/wPaint.css',
+ './src/wPaint.js',
+ './plugins/file/src/wPaint.menu.main.js',
+ './plugins/file/src/wPaint.menu.text.js',
+ './plugins/file/src/wPaint.menu.main.shapes.js',
+ './plugins/file/src/wPaint.menu.main.file.js'
+ ],
+ tasks: ['uglify']
+ }
+ });
+
+ grunt.loadNpmTasks('grunt-contrib-watch');
+ grunt.loadNpmTasks('grunt-contrib-stylus');
+ grunt.loadNpmTasks('grunt-contrib-jshint');
+ grunt.loadNpmTasks('grunt-contrib-uglify');
+ grunt.loadNpmTasks('grunt-contrib-concat');
+
+ grunt.registerTask('default', ['jshint', 'stylus', 'uglify']);
+};
\ No newline at end of file
diff --git a/static/js/wpaint/index.html b/static/js/wpaint/index.html
new file mode 100644
index 0000000..391261e
--- /dev/null
+++ b/static/js/wpaint/index.html
@@ -0,0 +1,136 @@
+
+
+
+
+
+
+ Websanova :: wPaint
+
+
+
+
+
+
+
+
+
+
+
+
+
a",n=d.getElementsByTagName("*")||[],r=d.getElementsByTagName("a")[0],!r||!r.style||!n.length)return t;s=a.createElement("select"),u=s.appendChild(a.createElement("option")),o=d.getElementsByTagName("input")[0],r.style.cssText="top:1px;float:left;opacity:.5",t.getSetAttribute="t"!==d.className,t.leadingWhitespace=3===d.firstChild.nodeType,t.tbody=!d.getElementsByTagName("tbody").length,t.htmlSerialize=!!d.getElementsByTagName("link").length,t.style=/top/.test(r.getAttribute("style")),t.hrefNormalized="/a"===r.getAttribute("href"),t.opacity=/^0.5/.test(r.style.opacity),t.cssFloat=!!r.style.cssFloat,t.checkOn=!!o.value,t.optSelected=u.selected,t.enctype=!!a.createElement("form").enctype,t.html5Clone="<:nav>"!==a.createElement("nav").cloneNode(!0).outerHTML,t.inlineBlockNeedsLayout=!1,t.shrinkWrapBlocks=!1,t.pixelPosition=!1,t.deleteExpando=!0,t.noCloneEvent=!0,t.reliableMarginRight=!0,t.boxSizingReliable=!0,o.checked=!0,t.noCloneChecked=o.cloneNode(!0).checked,s.disabled=!0,t.optDisabled=!u.disabled;try{delete d.test}catch(h){t.deleteExpando=!1}o=a.createElement("input"),o.setAttribute("value",""),t.input=""===o.getAttribute("value"),o.value="t",o.setAttribute("type","radio"),t.radioValue="t"===o.value,o.setAttribute("checked","t"),o.setAttribute("name","t"),l=a.createDocumentFragment(),l.appendChild(o),t.appendChecked=o.checked,t.checkClone=l.cloneNode(!0).cloneNode(!0).lastChild.checked,d.attachEvent&&(d.attachEvent("onclick",function(){t.noCloneEvent=!1}),d.cloneNode(!0).click());for(f in{submit:!0,change:!0,focusin:!0})d.setAttribute(c="on"+f,"t"),t[f+"Bubbles"]=c in e||d.attributes[c].expando===!1;d.style.backgroundClip="content-box",d.cloneNode(!0).style.backgroundClip="",t.clearCloneStyle="content-box"===d.style.backgroundClip;for(f in x(t))break;return t.ownLast="0"!==f,x(function(){var n,r,o,s="padding:0;margin:0;border:0;display:block;box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;",l=a.getElementsByTagName("body")[0];l&&(n=a.createElement("div"),n.style.cssText="border:0;width:0;height:0;position:absolute;top:0;left:-9999px;margin-top:1px",l.appendChild(n).appendChild(d),d.innerHTML="