| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201 |
- define(function(require, exports, module) {
- var Class = require('../core/class');
- var utils = require('../core/utils');
- var svg = require('./svg');
- var Container = require('./container');
- var ShapeContainer = require('./shapecontainer');
- var ViewBox = require('./viewbox');
- var EventHandler = require('./eventhandler');
- var Styled = require('./styled');
- var Matrix = require('./matrix');
- var Paper = Class.createClass('Paper', {
- mixins: [ShapeContainer, EventHandler, Styled, ViewBox],
- constructor: function(container) {
- this.callBase();
- this.node = this.createSVGNode();
- this.node.paper = this;
- this.node.appendChild(this.resourceNode = svg.createNode('defs'));
- this.node.appendChild(this.shapeNode = svg.createNode('g'));
- this.resources = new Container();
- this.setWidth('100%').setHeight('100%');
- if (container) {
- this.renderTo(container);
- }
- this.callMixin();
- },
- renderTo: function(container) {
- if (utils.isString(container)) {
- container = document.getElementById(container);
- }
- this.container = container;
- container.appendChild(this.node);
- },
- createSVGNode: function() {
- var node = svg.createNode('svg');
- node.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
- node.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink');
- node.setAttribute('version', '1.1');
- return node;
- },
- getNode: function() {
- return this.node;
- },
- getContainer: function() {
- return this.container;
- },
- getWidth: function() {
- return this.node.clientWidth;
- },
- setWidth: function(width) {
- this.node.setAttribute('width', width);
- return this;
- },
- getHeight: function() {
- return this.node.clientHeight;
- },
- setHeight: function(height) {
- this.node.setAttribute('height', height);
- return this;
- },
- setViewPort: function(cx, cy, zoom) {
- var viewport, box;
- if (arguments.length == 1) {
- viewport = arguments[0];
- cx = viewport.center.x;
- cy = viewport.center.y;
- zoom = viewport.zoom;
- }
- zoom = zoom || 1;
- box = this.getViewBox();
- var matrix = new Matrix();
- var dx = (box.x + box.width / 2) - cx,
- dy = (box.y + box.height / 2) - cy;
- matrix.translate(-cx, -cy);
- matrix.scale(zoom);
- matrix.translate(cx, cy);
- matrix.translate(dx, dy);
- this.shapeNode.setAttribute('transform', 'matrix(' + matrix + ')');
- this.viewport = {
- center: {
- x: cx,
- y: cy
- },
- offset: {
- x: dx,
- y: dy
- },
- zoom: zoom
- };
- return this;
- },
- getViewPort: function() {
- if (!this.viewport) {
- var box = this.getViewBox();
- return {
- zoom: 1,
- center: {
- x: box.x + box.width / 2,
- y: box.y + box.height / 2
- },
- offset: {
- x: 0,
- y: 0
- }
- };
- }
- return this.viewport;
- },
- getViewPortMatrix: function() {
- return Matrix.parse(this.shapeNode.getAttribute('transform'));
- },
- getViewPortTransform: function() {
- var m = this.shapeNode.getCTM();
- return new Matrix(m.a, m.b, m.c, m.d, m.e, m.f);
- },
- getTransform: function() {
- return this.getViewPortTransform().reverse();
- },
- addResource: function(resource) {
- this.resources.appendItem(resource);
- if (resource.node) {
- this.resourceNode.appendChild(resource.node);
- }
- return this;
- },
- removeResource: function(resource) {
- if (resource.remove) {
- resource.remove();
- }
- if (resource.node) {
- this.resourceNode.removeChild(resource.node);
- }
- return this;
- },
- getPaper: function() {
- return this;
- }
- });
- var Shape = require('./shape');
- Class.extendClass(Shape, {
- getPaper: function() {
- var parent = this.container;
- while (parent && parent instanceof Paper === false) {
- parent = parent.container;
- }
- return parent;
- },
- isAttached: function() {
- return !!this.getPaper();
- },
- whenPaperReady: function(fn) {
- var me = this;
- function check() {
- var paper = me.getPaper();
- if (paper && fn) {
- fn.call(me, paper);
- }
- return paper;
- }
- if (!check()) {
- this.on('add treeadd', function listen() {
- if (check()) {
- me.off('add', listen);
- me.off('treeadd', listen);
- }
- });
- }
- return this;
- }
- });
- return Paper;
- });
|