# HG changeset patch # User Harris Baptiste # Date 1471626225 -7200 # Node ID de5736883786f9f8f5d391db7bf19ebce2499e8b # Parent 8a41415e1ab12fc68d65bb4158684892a1f2a8a4 removing iconolab-bundle diff -r 8a41415e1ab1 -r de5736883786 .hgignore --- a/.hgignore Thu Aug 18 17:22:46 2016 +0200 +++ b/.hgignore Fri Aug 19 19:03:45 2016 +0200 @@ -10,7 +10,8 @@ ^src/iconolab/static/iconolab/js/iconolab-bundle/dist/ \.orig$ -^src_js/* +^src_js/iconolab-bundle/node_modules/ +^src_js/iconolab/static/iconolab/js/iconolab-bundle/dist/ ^web/* ^\.pydevproject$ diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/.babelrc --- a/src/iconolab/static/iconolab/js/iconolab-bundle/.babelrc Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,3 +0,0 @@ -{ - "presets": ["es2015"], -} diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/.editorconfig --- a/src/iconolab/static/iconolab/js/iconolab-bundle/.editorconfig Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,9 +0,0 @@ -root = true - -[*] -charset = utf-8 -indent_style = space -indent_size = 4 -end_of_line = lf -insert_final_newline = true -trim_trailing_whitespace = true diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/.eslintignore --- a/src/iconolab/static/iconolab/js/iconolab-bundle/.eslintignore Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,2 +0,0 @@ -build/*.js -config/*.js diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/.eslintrc.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/.eslintrc.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,23 +0,0 @@ -module.exports = { - root: true, - parserOptions: { - sourceType: 'module' - }, - // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style - extends: 'standard', - // required to lint *.vue files - plugins: [ - 'html' - ], - // add your custom rules here - 'rules': { - // allow paren-less arrow functions - 'arrow-parens': 0, - // no-multiple-empty-lines - 'no-multiple-empty-lines': 0, - 'semi': 1, - // allow debugger during development - 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0 - - } -} diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/.gitignore --- a/src/iconolab/static/iconolab/js/iconolab-bundle/.gitignore Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,4 +0,0 @@ -.DS_Store -node_modules/ -dist/ -npm-debug.log diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/README.md --- a/src/iconolab/static/iconolab/js/iconolab-bundle/README.md Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,18 +0,0 @@ -# iconolab-bundle - -> iconolab js bundle - -## Build Setup - -``` bash -# install dependencies -npm install - -# serve with hot reload at localhost:8080 -npm run dev - -# build for production with minification -npm run build -``` - -For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/index.html --- a/src/iconolab/static/iconolab/js/iconolab-bundle/index.html Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,14 +0,0 @@ - - - - - iconolab-bundle - - -
- - -
- - - diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/package.json --- a/src/iconolab/static/iconolab/js/iconolab-bundle/package.json Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,37 +0,0 @@ -{ - "name": "iconolab-bundle", - "description": "iconolab js bundle", - "author": "hbaptiste", - "private": true, - "scripts": { - "start": "webpack --progress --colors --watch", - "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" - }, - "dependencies": { - "bootstrap": "^3.3.6", - "event-emitter": "^0.3.4", - "expose-loader": "^0.7.1", - "font-awesome": "^4.6.3", - "import": "0.0.6", - "imports-loader": "^0.6.5", - "jquery": "^3.0.0", - "loader": "^2.1.1", - "snapsvg": "^0.4.0", - "vue": "^2.0.0-alpha.8", - "vue-loader": "^9.1.1", - "vue-resource": "^0.9.1", - "vue-typeahead": "^2.1.0" - }, - "devDependencies": { - "babel-core": "^6.0.0", - "babel-loader": "^6.0.0", - "babel-plugin-transform-es2015-shorthand-properties": "^6.8.0", - "babel-preset-es2015": "^6.0.0", - "cross-env": "^1.0.6", - "css-loader": "^0.23.1", - "file-loader": "^0.8.4", - "vue-loader": "^9.0.0", - "webpack": "^1.12.2", - "webpack-dev-server": "^1.12.0" - } -} diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/assets/logo.png Binary file src/iconolab/static/iconolab/js/iconolab-bundle/src/assets/logo.png has changed diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/Cutout.vue --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/Cutout.vue Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,170 +0,0 @@ - - diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/index.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/index.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,9 +0,0 @@ - -import CutoutVue from './Cutout.vue' - -export default { - - init: function () { - new Vue(CutoutVue); - } -} \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/shape-resizer.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/shape-resizer.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,160 +0,0 @@ -/* Enabling us to resize a shape width a handler - #http://stackoverflow.com/questions/32390028/how-to-drag-and-resize-svg-rectangle-using-cursor-types -*/ -import { eventEmitter } from "../utils" - -var ShapeResizer = function (paper, shape, vp, vb) { - console.log("inside ShapeResizer ... "); - this.paper = paper; - this.shape = shape; - this.handlers = []; - this.viewPort = vp; - this.viewBox = vb; - this.isResizing = false; - this.currentPosition = {}; - this.HANDLER_SIZE = 8; - this.SHAPE_MIN_SIZE = 20; - this.states = {}; - this.noop = function (){} - this.init(); -} - -var api = ShapeResizer.prototype = { - - init: function () { - this.showHandlers(); - - }, - - computeHandlerSize: function () { - return this.HANDLER_SIZE * (Math.min(this.viewBox[2], this.viewBox[3])) / this.viewPort.width; //w==h - }, - - showHandlers: function () { - /* show handler here */ - var bbox = this.shape.getBBox(); - var handleX = bbox.x - (this.computeHandlerSize()/2); - var handleY = bbox.y - (this.computeHandlerSize()/2); - var handler = this.paper.rect(handleX, handleY, this.computeHandlerSize(), this.computeHandlerSize()).attr({fill: 'red'}); - handler.addClass("drawingHandler"); - this.shape.addClass("drawingHandler"); - var handlerInfos = {position: "t_r", handler: handler}; - this.handlers.push(handlerInfos); - this.shapesGroup = this.paper.g(this.shape, handler); - this.attachEvents(); - }, - - /*one handlers */ - updateShapePositions: function (handlerData, dx, dy) { - //start - var handlerBBox = handlerData.handler.getBBox(); - var shapeBBox = this.shape.data("origBbox"); - var newX = handlerBBox.x + (this.computeHandlerSize() / 2); - var newY = handlerBBox.y + (this.computeHandlerSize() / 2); - - /*to the right => reduce the size */ - var newWidth = (dx > 0) ? shapeBBox.width - dx : shapeBBox.width + Math.abs(dx); - var newHeight = (dy > 0) ? shapeBBox.height - dy : shapeBBox.height + Math.abs(dy); - - var transformValue = this.shape.data('origTransform') + (this.shape.data('origTransform') ? "T" : "t") + [dx, dy]; - this.shape.attr({'transform': transformValue, width: newWidth, height: newHeight}); - }, - - dragEvents: { - onStart: function (handlerData, dx, dy, e) { - this.startPosition = {x: e.clientX, y: e.clientY}; - this.isResizing = true; - this.currentPosition = {}; - handlerData.handler.data("origTransform", handlerData.handler.transform().local); - this.shape.data("origBbox", this.shape.getBBox()); - this.shape.data("origBounding", this.shape.node.getBoundingClientRect()); - this.shape.data("origTransform", this.shape.transform().local); - }, - - onMove: function (handlerData, dx, dy, x, y, e) { - - var tdx, tdy; - var snapInvMatrix = handlerData.handler.transform().diffMatrix.invert(); - snapInvMatrix.e = snapInvMatrix.f = 0; - tdx = snapInvMatrix.x( dx,dy ); - tdy = snapInvMatrix.y( dx,dy ); - - this.currentPosition.x = e.clientX; - this.currentPosition.y = e.clientY; - if (! this.checkBondaries(dx, dy)) { return; } - - handlerData.handler.transform( "t" + [ tdx, tdy ] + handlerData.handler.data("origTransform") ); - this.updateShapePositions(handlerData, tdx, tdy); - }, - - onStop: function () { - this.isResizing = false; - this.startPosition = {}; - this.currentPosition = {}; - } - }, - - checkBondaries: function (dx, dy) { - var result = true; - var origBounding = this.shape.data("origBounding"); - var getBoundingClientRect = this.shape.node.getBoundingClientRect(); - - if (origBounding.width - dx <= this.SHAPE_MIN_SIZE) { - result = false; - } - - if (origBounding.height - dy <= this.SHAPE_MIN_SIZE) { - result = false; - } - - return result; - }, - - destroy: function () { - this.handlers.map(function (handlerData) { - handlerData.handler.remove(); - }); - delete this; - }, - - getZoomFactor: function () { - return { - x: this.viewPort.width / this.viewBox[2], - y: this.viewPort.height / this.viewBox[3] - }; - }, - - attachEvents: function () { - var self = this; - this.handlers.map(function (handlerData) { - handlerData.handler.drag( - self.dragEvents.onMove.bind(self, handlerData), - self.dragEvents.onStart.bind(self, handlerData), - self.dragEvents.onStop.bind(self, handlerData)); - }); - - eventEmitter.on("cutout:clear", function () { - self.destroy(); - }); - - this.shapesGroup.drag(function (dx, dy) { - if (self.isResizing) { return; } - var snapInvMatrix = this.transform().diffMatrix.invert(); - snapInvMatrix.e = snapInvMatrix.f = 0; - var tdx = snapInvMatrix.x( dx,dy ); - var tdy = snapInvMatrix.y( dx,dy ); - - var transformValue = this.data('origTransform') + (this.data('origTransform') ? "T" : "t") + [tdx, tdy]; - this.transform(transformValue); - }, function () { - this.data('origTransform', this.transform().local); - }, this.noop); - }, -} - -export default { - - enable_resizer : function (paper, rect, viewPort, cViewbox) { - new ShapeResizer(paper, rect, viewPort, cViewbox); - } -} \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/snapsvg-zoom.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/snapsvg-zoom.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,173 +0,0 @@ -/* enable zoom */ -import { eventEmitter } from '../utils' - -class ZoomHandler { - - constructor (params) { - this.zoomFactor = 0.1 || params.zoomFactor; - this.paper = params.paper; - this.MIN_SIZE = 40; - this.imageWidth = parseInt(this.paper.select(".main-image").attr("width")); - this.imageHeight = parseInt(this.paper.select(".main-image").attr("height")); - - this.viewport = { - width: parseInt(this.paper.attr("width")), - height: parseInt(this.paper.attr("height")) - }; - - this.scale = 1; - this.paper.attr({stroke: 2, "fill": "blue" }); - this.disableDrag = false; - this.imgMinSize = Math.min(this.imageWidth, this.imageHeight); - this.lastPosition = []; - this.updateViewBox([0 , 0, this.imageWidth, this.imageHeight]); - } - - testShowCenter (cx, cy) { - - if (this.center) { - this.center.remove(); - } - this.center = this.paper.rect(cx - 3, cy - 3, 20, 20); - this.center.attr({"fill" : "red"}); - } - - drawTestRectangle (cx, cy, w, h) { - var x = cx - w / 2; - var y = cy - h / 2; - this.paper.rect(x, y, w, h); - } - - zoomIn () { - - /* current center */ - if ( this.scale === 9) { this.scale--; return; } - var currentCenterX = this.currentViewBox[0] + (this.currentViewBox[2] / 2); - var currentCenterY = this.currentViewBox[1] + (this.currentViewBox[3] / 2); - var scaleFactor = this.zoomFactor * this.scale; - var viewBoxW = this.imgMinSize - (this.imgMinSize * scaleFactor); - var viewBoxH = viewBoxW; - - this.currentViewBox[0] = currentCenterX - viewBoxW / 2; - this.currentViewBox[1] = currentCenterY - viewBoxH / 2; - - this.currentViewBox[2] = viewBoxW; - this.currentViewBox[3] = viewBoxH; - this.scale ++; - this.updateViewBox(); - } - - updateViewBox (currentViewBox, notify) { - notify = (typeof notify === "boolean") ? notify : true; - - if (currentViewBox && currentViewBox.length != 4) { throw new Error("Provided currentViewBox is not valid!"); } - if (currentViewBox) { - this.currentViewBox = currentViewBox; - } - - this.paper.attr({"viewBox": this.currentViewBox}); - - if (!notify) { return false; } - - var self = this; - eventEmitter.emit("zoomChanged", { - updateFunction: function (updatedViewBox) { - self.updateViewBox(updatedViewBox, false); - }, - "zoomFactor": this.getZoomFactor(), - "viewport": this.viewport, - "currentScale": this.scale, - "imageSize": {width: this.imageWidth, height: this.imageHeight}, - "minSize": Math.min(this.imageWidth, this.imageHeight), - "currentViewBox": this.currentViewBox.slice() - }); - } - - getZoomFactor () { - return { - x: this.viewport.width / this.currentViewBox[2], - y: this.viewport.height / this.currentViewBox[3] - }; - } - - onStart (x, y, e) { - - this.lastPosition[0] = this.currentViewBox[0]; - this.lastPosition[1] = this.currentViewBox[1]; - - if (e.target.className.baseVal === "drawingHandler") { - this.disableDrag = true; - } - } - - canDrag () { - return !this.disableDrag; - } - - onStop () { - this.disableDrag = false; - } - - onDrag (dx, dy, x, y, event) { - - if (!this.canDrag()) { return true; } - - var newX = this.lastPosition[0] - dx; - var newY = this.lastPosition[1] - dy; - - /* maxX bound */ - if (newX + this.currentViewBox[2] >= this.viewport.width) { - newX = this.viewport.width - this.currentViewBox[2]; - } - - /* maxY bound */ - if (newY + this.currentViewBox[3] >= this.viewport.height) { - newY = this.viewport.height - this.currentViewBox[3]; - } - - if (newX <= 0) { newX = 0; } - - if(newY <= 0) { newY = 0; } - - this.currentViewBox[0] = newX; - this.currentViewBox[1] = newY; - - this.updateViewBox(); - } - - reset () { - this.scale = 1; - this.currentViewBox = [0, 0, this.imageWidth, this.imageHeight]; - this.updateViewBox(); - } - - zoomOut () { - if (this.scale == 1) { - return false; - } - - var currentCenterX = this.currentViewBox[0] + (this.currentViewBox[2] / 2); - var currentCenterY = this.currentViewBox[1] + (this.currentViewBox[3] / 2); - var scaleFactor = this.zoomFactor * (this.scale - 1); - - var viewBoxW = this.imgMinSize - (this.imgMinSize * scaleFactor); - var viewBoxH = viewBoxW; - - var topX = currentCenterX - viewBoxW / 2; - var topY = currentCenterY - viewBoxH / 2; - - this.currentViewBox[0] = topX; //deal with X and Y - this.currentViewBox[1] = topY; - this.currentViewBox[2] = viewBoxW; - this.currentViewBox[3] = viewBoxH; - this.updateViewBox(); - this.scale--; - } -} - -export default { - - enable_zoom: function (params) { - return new ZoomHandler(params); - } -} \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/svgboard.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/cutout/svgboard.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,576 +0,0 @@ - - -import Snap from 'snapsvg' -import ShapeResizer from './shape-resizer' -import { eventEmitter } from '../utils' -import SnapsvgZoom from './snapsvg-zoom' - -/* custom plugins */ -Snap.plugin(function (Snap, Element, Paper, glob) { - var elproto = Element.prototype; - - elproto.toBack = function () { - this.prependTo(this.paper); - }; - - elproto.toFront = function () { - this.appendTo(this.paper); - }; -}); - -Element.prototype.getTransformedXY = function( x, y ) { - var m = this.transform().globalMatrix; - return { x: m.x(x,y), y: m.y(x,y) }; - }; - -var paper = null; -var mainImage = null; -var pointData = []; -var viewBoxBounds = {X: 100, Y:100}; -var zoomFactor = {x:1, y:1}; -var viewPort= {width:850, height:850}; -var currentViewBox = []; -var config = null; -var readOnly = false; -var startPoint = null; -var drawing_path = null; -var canDraw = false; -var rectZone = null; -var PATH_COLOR = "#ff00ff"; -var STROKE_COLOR = "red"; -var FILL_COLOR = "orange"; - -var SELECTED_COLOR = "#ffff00"; -var FIRST_NODE_COLOR = "#FF0000"; -var HANDLE_SIZE = 8; -var isDragged = false; -var enablePoint = true; -var pathIsClosed = false; -var ENABLE_NEW_NODE = true; -var RECT_MODE ='RECT'; -var drawingMode = RECT_MODE; //free -var FREE_MODE = 'FREE'; -var availableModes = [RECT_MODE, FREE_MODE]; -var onChangeCallback = null; - -var getId = (function () { - var cpt = 0; - var defautPrefix = "item_"; - return function (prefix) { - prefix = (typeof prefix === 'string') ? prefix : defautPrefix; - cpt = cpt + 1; - return prefix + cpt; - } - }()); - -var handleRectPath = function (path) { - if (readOnly) { - paper.path(path).attr({ stroke:'red', opacity: 0.6}); - return; - } - - var bbBox = Snap.path.getBBox(path); - rectZone = paper.rect(bbBox.x, bbBox.y, bbBox.width, bbBox.height); - rectZone.attr({fill: FILL_COLOR, stroke: STROKE_COLOR, opacity: 0.6}); - drawing_path = rectZone; - canDraw = false; - pathIsClosed = true; - ShapeResizer.enable_resizer(paper, drawing_path, viewPort, currentViewBox); -}; - - -var handleFreePath = function (path) { - - if (readOnly) { - - paper.path(path).attr({ - stroke: 'orange', - fill: 'orange', - opacity: 0.5, - }); - - return; - } - - var pathInfos = Snap.parsePathString(path); - pathInfos.map(function (pathData) { - if(pathData[0] !== 'Z') { - createPoint(paper, pathData[1], pathData[2], pointData); - } else { - pathIsClosed = true; - updatePath(paper, onClosePath); - } - }); - - /* replay the path here */ - -}; -//transform point to path -var updatePath = function (paper, updateCallback) { - var path = "M"; - - if (pointData.length <= 1) { - return; - } - - path += pointData[0].x + ',' + pointData[0].y; - - for (var i=0; i < pointData.length; i++) { - if (i == 0) continue; - - var pointInfos = pointData[i]; - var lPath = "L" + pointInfos.x + "," + pointInfos.y; - path += " " + lPath; - } - - path += (pathIsClosed) ? " Z": ""; - - /* remove prev path */ - if (drawing_path) { - drawing_path.remove(); - } - - drawing_path = paper.path(path); - - drawing_path.attr({ - stroke: STROKE_COLOR, - "vector-effect": "non-scaling-stroke",//prevent line to be zoom in - "stroke-width": 3, - fill: "white", - opacity: 0.1 - }); - - /* bring all handler to front */ - pointData.map(function (point) { - - /*deal with handler size */ - var handleSize = computeHandleSize(); - if (point.handler) { - point.handler.toFront(); - } - }); - - if (typeof updateCallback === 'function' && pathIsClosed) { - updateCallback(); - } - - if (!updateCallback && pathIsClosed) { - applyClosedStyle(); - } -}; - -var applyClosedStyle = function () { - drawing_path.attr({ fill: FILL_COLOR, strokeWidth: 1, opacity:.6 }); -} - -var onClosePath = function () { - ENABLE_NEW_NODE = false; - applyClosedStyle(); -}; - - -var onClickOnHandler = function (point, p, e) { - //close path - if (point.isFirst && pointData.length > 2) { - pathIsClosed = true; - } -}; - -var updatePointPosition = function (newPoint, x, y) { - var index = pointData.indexOf(newPoint); - if (index !== -1) { - pointData[index].x = x; - pointData[index].y = y; - return true; - } else { - return false; - } -}; - -var clearPreviousPath = function () { - drawing_path.remove(); -}; - -var computeHandleSize = function () { - - if(!currentViewBox.length) { - currentViewBox = [0, 0, parseInt(mainImage.width()), parseInt(mainImage.height())] - } - var currentHandleSize = HANDLE_SIZE * Math.min(currentViewBox[2], currentViewBox[3]) / 850; - return currentHandleSize; -} - -var onMoveHandler = function (dx, dy, posX, posY, e) { - isDragged = true; - var tdx, tdy; - var snapInvMatrix = this.transform().diffMatrix.invert(); - snapInvMatrix.e = snapInvMatrix.f = 0; - tdx = snapInvMatrix.x( dx,dy ); - tdy = snapInvMatrix.y( dx,dy ); - var transformValue = this.data('origTransform') + (this.data('origTransform') ? "T" : "t") + [tdx, tdy]; - this.attr({ transform: transformValue}); - var boxSize = this.getBBox(); - - var wasUpdated = updatePointPosition(this.data('point'), boxSize.x + (computeHandleSize() / 2) , boxSize.y + (computeHandleSize() / 2)); - - if (wasUpdated) { - updatePath(this.paper); - } -} - -var bindHandlerEvent = function (point, p) { - point.handler.click(onClickOnHandler.bind(this, point, p)); - /* -- handler -- */ - point.handler.hover(function () { - point.handler.attr({fill: 'yellow'}); - }, function () { - var fillColor = point.isFirst ? FIRST_NODE_COLOR : ""; - point.handler.attr({fill: fillColor}); - }); - - point.handler.drag(onMoveHandler, function () { - this.data('origTransform', this.transform().local ); - }, function () { - if (!isDragged) { return true; } - isDragged = false; - enablePoint = false; - }); -} - -var createPointHandler = function (p, point) { - var handler; - var handleSize = computeHandleSize(); - var handleX = point.x - handleSize / 2; - var handleY = point.y - handleSize / 2; - - /* preserve initial size of 5px a quoi correspond 5 deal with current vp */ - handler = p.rect(handleX, handleY, handleSize, handleSize); - - handler.addClass("drawingHandler"); - point.handler = handler; - point.handler.data('point', point); - if (pointData.length === 0) { - point.isFirst = true; - } - - bindHandlerEvent(point, p); - point.handler.attr({ - fill: (pointData.length === 0) ? FIRST_NODE_COLOR : "", - opacity: 0.9, - stroke: PATH_COLOR - }); - - return point; -} - -//create paper -var createPoint = function (paper, x, y, pointData) { - - var point = {x:x, y:y, id: getId()}; - - if (pathIsClosed) { - updatePath(paper, onClosePath); - return; - } - - if (!enablePoint) { - enablePoint = true; - return false; - } - - point = createPointHandler(paper, point); - pointData.push(point); - updatePath(paper); -}; - -var attachRectEvents = function (paper) { - if (readOnly) { return false; } - - var startPosition = {}; - var currentPosition = {}; - /* add resizer */ - - paper.mousedown(function (e) { - - if (drawingMode === FREE_MODE || pathIsClosed) { return; } - startPosition.x = e.offsetX; - startPosition.y = e.offsetY; - canDraw = true; - }); - - paper.mousemove(function (e) { - if (drawingMode === FREE_MODE) { return; } - if (!canDraw) { return; } - var x, y; - currentPosition.x = e.offsetX; - currentPosition.y = e.offsetY; - - if (rectZone) { - rectZone.remove(); - } - - /* bas -> droite */ - var width = Math.abs(currentPosition.x - startPosition.x); - var height = Math.abs(startPosition.y - currentPosition.y); - - if (currentPosition.y > startPosition.y && currentPosition.x > startPosition.x) { - x = startPosition.x; - y = startPosition.y; - } - - /* haut -> droite */ - if (currentPosition.y < startPosition.y && currentPosition.x > startPosition.x) { - x = currentPosition.x - width; - y = currentPosition.y; - } - - /* haut -> gauche */ - if (currentPosition.y < startPosition.y && currentPosition.x < startPosition.x) { - x = currentPosition.x; - y = currentPosition.y; - } - - /* bas -> gauche */ - if (currentPosition.y > startPosition.y && currentPosition.x < startPosition.x) { - x = currentPosition.x - y = currentPosition.y - height; - } - if(!x || !y) { return; } - - rectZone = paper.rect(x, y, width, height); - rectZone.attr({fill: FILL_COLOR, stroke: STROKE_COLOR, opacity: 0.6}); - }); - - - paper.mouseup(function () { - if ((drawingMode === FREE_MODE) || pathIsClosed || !rectZone) { return false; } - drawing_path = rectZone; - ShapeResizer.enable_resizer(paper, rectZone, viewPort, currentViewBox); - canDraw = false; - pathIsClosed = true; - }); -}; -var attachPointEvents = function (paper) { - if (readOnly) { return; } - paper.click( function(e) { - if (drawingMode === RECT_MODE) { - return true; - } - - if (!ENABLE_NEW_NODE) { return true; } - createPoint(paper, e.offsetX, e.offsetY, pointData); - }); -}; - - -var attachZoomEvents = function () { - - eventEmitter.on("zoomChanged", function (zoomInfos) { - zoomFactor = zoomInfos.zoomFactor; - currentViewBox = zoomInfos.currentViewBox; - var previousPath = API.getPath(); - API.clear(); - API.setPath(previousPath); - }); - -} - - -var API = { - - getPaper: function () { - return paper; - }, - - setPath: function (pathString) { - /* redraw the path */ - var pathInfos = pathString.split(';'); - if ( availableModes.indexOf(pathInfos[1]) === -1) { - /* We assume then it is a free path */ - pathInfos[1] = "FREE"; - } - - this.setDrawingMode(pathInfos[1]); - var pathData = pathInfos[0]; - - if (!pathData.length) { - return; - } - /* deal with path nomalization x = ImageWith/MaxXBound */ - var xRatio = mainImage.attr("width") / viewBoxBounds.X; - var yRatio = mainImage.attr("height") / viewBoxBounds.Y; - - if (isNaN(xRatio) || isNaN(yRatio)) { - new Error('Ratio should be a number.'); - } - - var transformMatrix = Snap.matrix(xRatio, 0, 0, yRatio, 0, 0); - var path = Snap.path.map(pathData, transformMatrix).toString(); - - /* always close path */ - if (path.search(/[z|Z]/gi) === -1 ) { - path += "Z"; - } - if (pathInfos.length >= 2) { - if (pathInfos[1] === RECT_MODE) { - handleRectPath(path); - } - - if (pathInfos[1] === FREE_MODE) { - handleFreePath(path); - } - } - }, - - setDrawingMode: function (mode) { - - if (availableModes.indexOf(mode) !== -1) { - drawingMode = mode; - } - if (typeof onChangeCallback === "function") { - onChangeCallback(drawingMode); - } - - this.clear(); - }, - - clear: function () { - /* clear previous path, point, handler */ - pointData.map(function (point) { - if (point.handler) { - point.handler.remove(); - } - }); - - /*clear path is exists*/ - if (drawing_path) { - drawing_path.remove(); - } - eventEmitter.emit("cutout:clear"); - pointData = []; - startPoint = null; - drawing_path = null; - isDragged = false; - enablePoint = true; - pathIsClosed = false; - ENABLE_NEW_NODE = true; - }, - - getShapeBBox: function () { - var currentPath = this.getPath(); - return Snap.path.getBBox(currentPath); - }, - - getShape: function () { - return this.getPath(); - }, - - getPath: function () { - /* retourne le chemin */ - /* send path and BBox | implement edit and load path */ - var path = ""; - if (drawing_path) { - if (drawingMode === RECT_MODE) { - var bBox = drawing_path.getBBox(); - var transform = drawing_path.transform(); - - if (!transform.global.length) { - var shapePath = drawing_path.getBBox().path; - } - - else { - - var shapeX = drawing_path.node.getAttribute('x'); - var shapeY = drawing_path.node.getAttribute('y'); - var transformMatrix = transform.totalMatrix; - var fakeShape = paper.rect(transformMatrix.x(shapeX, shapeY),transformMatrix.y(shapeX, shapeY), bBox.width, bBox.height); - shapePath = fakeShape.getBBox().path; - fakeShape.remove(); - } - - path = Snap.path.toAbsolute(shapePath).toString(); - - } - else { - path = drawing_path.attr('d'); - } - } - - var xRatio = viewBoxBounds.X / mainImage.attr("width"); - var yRatio = viewBoxBounds.Y / mainImage.attr("height"); - - if(isNaN(xRatio) || isNaN(yRatio)) { - new Error('ratio should be a number.'); - } - - if (!path.length) { - path = (drawingMode === RECT_MODE) ? ";RECT" : ";FREE"; - return path; - } - var normalizeMatrix = Snap.matrix(xRatio, 0, 0, yRatio, 0, 0); - - path = Snap.path.map(path, normalizeMatrix).toString(); - - /* save the type */ - var type = (drawingMode === RECT_MODE) ? ";RECT" : ";FREE"; - if (path.search(/[z|Z]/gi) === -1) { - path += " Z"; - } - - path += type; - - - return path; - } -}; - -/* change to a component */ -export default { - - init: function(config) { - mainImage = jQuery(config.wrapperId).find('.main-image').eq(0); - var cutCanvas = jQuery(config.wrapperId).find('.cut-canvas').eq(0); - var path = jQuery(config.wrapperId).find('.image-path').eq(0); - - if (typeof config.onDrawingModeChange === 'function') { - onChangeCallback = config.onDrawingModeChange; - } - - if (!mainImage.length) { - throw new Error("The main image Can't be found ..."); - } - - if (!cutCanvas.length) { - var cutCanvas = jQuery('').addClass('cut-canvas'); - jQuery(config.wrapperId).append(cutCanvas); - cutCanvas.append(mainImage); - } - - - - cutCanvas.css({ - marginLeft: 'auto', - marginRight: 'auto', - width: viewPort.width, - height: viewPort.height, - }); - if (typeof config.readOnly === 'boolean' && config.readOnly === true) { - readOnly = true; - } - - paper = new Snap(cutCanvas.get(0)); - - if (path.length) { - jQuery(cutCanvas).append(path); - var pathData = path.attr("d"); - API.setPath(pathData); - path.remove(); - } - /* enable zoom */ - attachZoomEvents(); - attachPointEvents(paper); - attachRectEvents(paper); - - return API; - } -}; \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/mergetool/MergeTool.vue --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/mergetool/MergeTool.vue Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,89 +0,0 @@ - \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/taglist/Taglist.vue --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/taglist/Taglist.vue Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,102 +0,0 @@ - - \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/taglist/template.html --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/taglist/template.html Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,25 +0,0 @@ -
- - - - -
diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/typeahead/Typeahead.vue --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/typeahead/Typeahead.vue Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,161 +0,0 @@ - - - - \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/typeahead/style.css --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/typeahead/style.css Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,71 +0,0 @@ -Typeahead { - position: relative; -} -.selected-tags { border: 1px solid red; width: 200px !important; } -.selected-tags select {display: inline-block;} - -.Typeahead__input { - width: 100%; - font-size: 14px; - color: #2c3e50; - line-height: 1.42857143; - box-shadow: inset 0 1px 4px rgba(0,0,0,.4); - -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; - transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; - font-weight: 300; - padding: 12px 26px; - border: none; - border-radius: 22px; - letter-spacing: 1px; - box-sizing: border-box; -} -.Typeahead__input:focus { - border-color: #4fc08d; - outline: 0; - box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #4fc08d; -} -.tag-item {border: 1px solid red;} -.fa-times { - cursor: pointer; -} - -ul { - /*position: absolute;*/ - padding: 0; - margin-top: 8px; - min-width: 100%; - background-color: #fff; - list-style: none; - border-radius: 4px; - box-shadow: 0 0 10px rgba(0,0,0, 0.25); - z-index: 1000; -} -li { - padding: 10px 16px; - border-bottom: 1px solid #ccc; - cursor: pointer; -} -li:first-child { - border-radius: 4px 4px 0 0; -} -li:last-child { - border-radius: 0 0 4px 4px; - border-bottom: 0; -} -span { - display: block; - color: #2c3e50; -} -.active { - background-color: #3aa373; -} -.active span { - color: white; -} -.name { - font-weight: 700; - font-size: 18px; -} -.screen-name { - font-style: italic; -} \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/typeahead/template.html --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/typeahead/template.html Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,24 +0,0 @@ -
- - - - - Créer ce tag - - - - -
\ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/utils/index.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/utils/index.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,15 +0,0 @@ -import EventEmitter from 'event-emitter' -var eventEmitter = EventEmitter({}); - - -var generateId = (function () { - var cpt = 0; - var defautPrefix = "item_"; - return function (prefix) { - prefix = (typeof prefix === "string") ? prefix : defautPrefix; - cpt = cpt + 1; - return prefix + cpt; - } - }()); - -export { generateId , eventEmitter } \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/zoomview/Zoomview.vue --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/zoomview/Zoomview.vue Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,164 +0,0 @@ - - - - \ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/components/zoomview/template.html --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/components/zoomview/template.html Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,22 +0,0 @@ -
- -

Zoom

- - - - - - - -
\ No newline at end of file diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/src/main.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/src/main.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,21 +0,0 @@ -import 'expose?Vue!vue/dist/vue' -import "expose?jQuery!jquery" - -import VueResource from 'vue-resource' -import Typeahead from './components/typeahead/Typeahead.vue' -import Cutout from './components/cutout' -import Zoomview from './components/zoomview/Zoomview.vue' -import MergeTool from './components/mergetool/MergeTool.vue' - -var iconolab = { - Cutout : Cutout, - VueComponents : { - Typeahead: Typeahead, - MergeTool: MergeTool, - Zoomview: Zoomview - } -}; - -if (!window.iconolab) { - window.iconolab = iconolab; -} diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/static/iconolab/js/iconolab-bundle/webpack.config.js --- a/src/iconolab/static/iconolab/js/iconolab-bundle/webpack.config.js Thu Aug 18 17:22:46 2016 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,64 +0,0 @@ -var path = require('path') -var webpack = require('webpack') -module.exports = { - entry: './src/main.js', - output: { - path: path.resolve(__dirname, './dist'), - publicPath: '/dist/', - filename: 'build.js' - }, - resolveLoader: { - root: path.join(__dirname, 'node_modules'), - }, - module: { - loaders: [ - { - test: /\.vue$/, - loader: 'vue' - }, - { - test: /\.js$/, - loader: 'babel-loader', - //exclude: /node_modules/, - query: { - presets: ['es2015'] - }, - "plugins": ["transform-es2015-shorthand-properties"] - }, - { - test: /\.(png|jpg|gif|svg)$/, - loader: 'file', - query: { - name: '[name].[ext]?[hash]' - } - }, - { - test: require.resolve('snapsvg'), - loader: 'imports-loader?this=>window,fix=>module.exports=0' - }, - ] - }, - devServer: { - historyApiFallback: true, - noInfo: true - }, - devtool: '#eval-source-map' -} - -if (process.env.NODE_ENV === 'production') { - module.exports.devtool = '#source-map' - // http://vue-loader.vuejs.org/en/workflow/production.html - module.exports.plugins = (module.exports.plugins || []).concat([ - new webpack.DefinePlugin({ - 'process.env': { - NODE_ENV: '"production"' - } - }), - new webpack.optimize.UglifyJsPlugin({ - compress: { - warnings: false - } - }), - new webpack.optimize.OccurenceOrderPlugin() - ]) -} diff -r 8a41415e1ab1 -r de5736883786 src/iconolab/templates/iconolab_base.html --- a/src/iconolab/templates/iconolab_base.html Thu Aug 18 17:22:46 2016 +0200 +++ b/src/iconolab/templates/iconolab_base.html Fri Aug 19 19:03:45 2016 +0200 @@ -11,15 +11,13 @@ {% block title %} {% endblock %} {% block main_js %} - - - + {% endblock %} {% block page_js %} {% endblock %} {% block main_css %} - - + + {% endblock %}