Comparing version 1.0.6 to 1.0.7
@@ -0,0 +0,0 @@ { |
@@ -0,0 +0,0 @@ { |
@@ -22,5 +22,8 @@ import { EventEmitter, ElementRef, AfterContentInit, QueryList, OnDestroy, OnInit } from '@angular/core'; | ||
nameNode: string; | ||
added: boolean; | ||
private cacheProps; | ||
private _stage; | ||
private _config; | ||
getStage(): any; | ||
getConfig(): any; | ||
constructor(elementRef: ElementRef); | ||
@@ -27,0 +30,0 @@ ngOnInit(): void; |
@@ -23,4 +23,6 @@ import { EventEmitter, AfterContentInit, ElementRef, QueryList, OnInit, OnDestroy } from '@angular/core'; | ||
private _stage; | ||
private _config; | ||
private cacheProps; | ||
getStage(): any; | ||
getConfig(): any; | ||
constructor(elementRef: ElementRef); | ||
@@ -27,0 +29,0 @@ private uploadKonva(config); |
@@ -176,2 +176,3 @@ import { Component, ContentChildren, ElementRef, EventEmitter, Input, NgModule, Output, QueryList } from '@angular/core'; | ||
this.dragend = new EventEmitter(); | ||
this.added = false; | ||
this.cacheProps = {}; | ||
@@ -190,2 +191,8 @@ this._stage = {}; | ||
*/ | ||
CoreShapeComponent.prototype.getConfig = function () { | ||
return this._config || {}; | ||
}; | ||
/** | ||
* @return {?} | ||
*/ | ||
CoreShapeComponent.prototype.ngOnInit = function () { | ||
@@ -216,2 +223,3 @@ this.initKonva(); | ||
this.config.subscribe(function (config) { | ||
_this._config = config; | ||
_this.uploadKonva(config); | ||
@@ -237,2 +245,3 @@ }); | ||
if (_this !== item) { | ||
item.added = true; | ||
_this._stage.add(item.getStage()); | ||
@@ -319,2 +328,8 @@ updatePicture(_this._stage); | ||
/** | ||
* @return {?} | ||
*/ | ||
StageComponent.prototype.getConfig = function () { | ||
return this._config || {}; | ||
}; | ||
/** | ||
* @param {?} config | ||
@@ -335,2 +350,3 @@ * @return {?} | ||
this.config.subscribe(function (config) { | ||
_this._config = config; | ||
if (!_this._stage) { | ||
@@ -370,3 +386,3 @@ _this._stage = new Konva.Stage({ | ||
selector: 'ko-stage', | ||
template: "<div><ng-content></ng-content>{{config}}</div>", | ||
template: "<div><ng-content></ng-content>{{config}}</div>" | ||
},] }, | ||
@@ -373,0 +389,0 @@ ]; |
@@ -1,3 +0,7 @@ | ||
export interface KonvaComponent { | ||
import { Component } from '@angular/core'; | ||
import { Observable } from 'rxjs/Observable'; | ||
export interface KonvaComponent extends Component { | ||
getStage: Function; | ||
getConfig: Function; | ||
config: any | Observable<any>; | ||
} |
@@ -1,1 +0,1 @@ | ||
{"__symbolic":"module","version":3,"metadata":{"KonvaModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"declarations":[{"__symbolic":"reference","name":"StageComponent"},{"__symbolic":"reference","name":"CoreShapeComponent"}],"exports":[{"__symbolic":"reference","name":"StageComponent"},{"__symbolic":"reference","name":"CoreShapeComponent"}]}]}],"members":{}},"StageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ko-stage","template":"<div><ng-content></ng-content>{{config}}</div>"}]}],"members":{"shapes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","name":"CoreShapeComponent"}]}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"click":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dblclick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mousemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"tap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dbltap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"touchstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"scaleXChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"fillChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragmove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"getStage":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"uploadKonva":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"CoreShapeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ko-shape, ko-layer, ko-circle, ko-fastlayer, ko-group, ko-label, ko-rect, ko-ellipse, ko-wedge, ko-line, ko-sprite, ko-image, ko-text, ko-text-path, ko-star, ko-ring, ko-arc, ko-tag, ko-path, ko-regular-polygon, ko-arrow","template":"<div><ng-content></ng-content></div>"}]}],"members":{"shapes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","name":"CoreShapeComponent"}]}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"click":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dblclick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mousemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"tap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dbltap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"touchstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"scaleXChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"fillChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragmove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"getStage":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"ngOnInit":[{"__symbolic":"method"}],"initKonva":[{"__symbolic":"method"}],"uploadKonva":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"KonvaComponent":{"__symbolic":"interface"}},"origins":{"KonvaModule":"./index","StageComponent":"./components/stage.component","CoreShapeComponent":"./components/core-shape.component","KonvaComponent":"./ko.interface"},"importAs":"ng2-konva"} | ||
{"__symbolic":"module","version":3,"metadata":{"KonvaModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"declarations":[{"__symbolic":"reference","name":"StageComponent"},{"__symbolic":"reference","name":"CoreShapeComponent"}],"exports":[{"__symbolic":"reference","name":"StageComponent"},{"__symbolic":"reference","name":"CoreShapeComponent"}]}]}],"members":{}},"StageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ko-stage","template":"<div><ng-content></ng-content>{{config}}</div>"}]}],"members":{"shapes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","name":"CoreShapeComponent"}]}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"click":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dblclick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mousemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"tap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dbltap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"touchstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"scaleXChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"fillChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragmove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"getStage":[{"__symbolic":"method"}],"getConfig":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"uploadKonva":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"CoreShapeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ko-shape, ko-layer, ko-circle, ko-fastlayer, ko-group, ko-label, ko-rect, ko-ellipse, ko-wedge, ko-line, ko-sprite, ko-image, ko-text, ko-text-path, ko-star, ko-ring, ko-arc, ko-tag, ko-path, ko-regular-polygon, ko-arrow","template":"<div><ng-content></ng-content></div>"}]}],"members":{"shapes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","name":"CoreShapeComponent"}]}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"click":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dblclick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mouseout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"mousemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"tap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dbltap":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"touchstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"scaleXChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"fillChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragstart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragmove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dragend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"getStage":[{"__symbolic":"method"}],"getConfig":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"ngOnInit":[{"__symbolic":"method"}],"initKonva":[{"__symbolic":"method"}],"uploadKonva":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"KonvaComponent":{"__symbolic":"interface"}},"origins":{"KonvaModule":"./index","StageComponent":"./components/stage.component","CoreShapeComponent":"./components/core-shape.component","KonvaComponent":"./ko.interface"},"importAs":"ng2-konva"} |
@@ -178,2 +178,3 @@ (function (global, factory) { | ||
this.dragend = new core.EventEmitter(); | ||
this.added = false; | ||
this.cacheProps = {}; | ||
@@ -192,2 +193,8 @@ this._stage = {}; | ||
*/ | ||
CoreShapeComponent.prototype.getConfig = function () { | ||
return this._config || {}; | ||
}; | ||
/** | ||
* @return {?} | ||
*/ | ||
CoreShapeComponent.prototype.ngOnInit = function () { | ||
@@ -218,2 +225,3 @@ this.initKonva(); | ||
this.config.subscribe(function (config) { | ||
_this._config = config; | ||
_this.uploadKonva(config); | ||
@@ -239,2 +247,3 @@ }); | ||
if (_this !== item) { | ||
item.added = true; | ||
_this._stage.add(item.getStage()); | ||
@@ -321,2 +330,8 @@ updatePicture(_this._stage); | ||
/** | ||
* @return {?} | ||
*/ | ||
StageComponent.prototype.getConfig = function () { | ||
return this._config || {}; | ||
}; | ||
/** | ||
* @param {?} config | ||
@@ -337,2 +352,3 @@ * @return {?} | ||
this.config.subscribe(function (config) { | ||
_this._config = config; | ||
if (!_this._stage) { | ||
@@ -372,3 +388,3 @@ _this._stage = new Konva.Stage({ | ||
selector: 'ko-stage', | ||
template: "<div><ng-content></ng-content>{{config}}</div>", | ||
template: "<div><ng-content></ng-content>{{config}}</div>" | ||
},] }, | ||
@@ -375,0 +391,0 @@ ]; |
@@ -0,0 +0,0 @@ { |
@@ -1,2 +0,2 @@ | ||
# ng2-konva (WORK IN PROGRESS) | ||
# ng2-konva | ||
@@ -19,3 +19,3 @@ **ng2-konva** is a JavaScript library for drawing complex canvas graphics using Angular. | ||
```bash | ||
$ npm install ng2-konva --save | ||
$ npm install konva ng2-konva --save | ||
``` | ||
@@ -22,0 +22,0 @@ |
@@ -0,0 +0,0 @@ /* eslint-disable */ |
{ | ||
"name": "ng2-konva", | ||
"version": "1.0.6", | ||
"version": "1.0.7", | ||
"description": "Angular binding to canvas element via Konva framework", | ||
@@ -73,3 +73,3 @@ "keywords": [ | ||
"markdown-loader": "^2.0.1", | ||
"ng2-konva": "^1.0.4", | ||
"ng2-konva": "^1.0.6", | ||
"ngx-bootstrap": "^2.0.0-beta.8", | ||
@@ -89,2 +89,4 @@ "node-sass": "^4.5.2", | ||
"typescript": "~2.2.0", | ||
"uglifyjs-webpack-plugin": "^1.0.1", | ||
"url-loader": "^0.6.2", | ||
"webpack": "^3.8.1", | ||
@@ -91,0 +93,0 @@ "zone.js": "^0.8.4" |
@@ -15,2 +15,3 @@ ### Shape types | ||
- `getConfig`: Getting config props | ||
- `getStage`: Getting reference to Konva objects. Returns — Konva object | ||
@@ -17,0 +18,0 @@ |
@@ -30,2 +30,3 @@ import { DomSanitizer } from '@angular/platform-browser'; | ||
<div class="container"> | ||
<img src="../../n2-konva.png"> | ||
<section id="introduction" [innerHtml]="introduction"></section> | ||
@@ -54,3 +55,20 @@ <api></api> | ||
</example-section> | ||
<event-example></event-example> | ||
<example-section | ||
[ts]="desc.event.ts" | ||
[id]="desc.event.id" | ||
[heading]="desc.event.heading"> | ||
<event-example></event-example> | ||
</example-section> | ||
<example-section | ||
[ts]="desc.animation.ts" | ||
[id]="desc.animation.id" | ||
[heading]="desc.animation.heading"> | ||
<animation-example></animation-example> | ||
</example-section> | ||
<example-section | ||
[ts]="desc.star.ts" | ||
[id]="desc.star.id" | ||
[heading]="desc.star.heading"> | ||
<star-example></star-example> | ||
</example-section> | ||
</div> | ||
@@ -91,2 +109,12 @@ </section> | ||
}, | ||
animation: { | ||
heading: 'Animation', | ||
id: 'animation', | ||
ts: require('!!raw-loader?lang=typescript!./components/examples/animation-example.component.ts') | ||
}, | ||
star: { | ||
heading: 'Star', | ||
id: 'star', | ||
ts: require('!!raw-loader?lang=typescript!./components/examples/star-example.component.ts') | ||
}, | ||
}; | ||
@@ -93,0 +121,0 @@ |
@@ -15,2 +15,4 @@ import { BrowserModule } from '@angular/platform-browser'; | ||
import { StylesExampleComponent } from './components/examples/styles-example.component'; | ||
import { AnimationExampleComponent } from './components/examples/animation-example.component'; | ||
import { StarExampleComponent } from './components/examples/star-example.component'; | ||
@@ -27,2 +29,4 @@ @NgModule({ | ||
StylesExampleComponent, | ||
AnimationExampleComponent, | ||
StarExampleComponent, | ||
ApiComponent | ||
@@ -29,0 +33,0 @@ ], |
@@ -10,3 +10,3 @@ import { Component, ViewChild } from '@angular/core'; | ||
<section> | ||
<ko-stage #layer [config]="configStage"> | ||
<ko-stage #stage [config]="configStage"> | ||
<ko-layer #layer> | ||
@@ -58,3 +58,2 @@ <ko-regular-polygon | ||
public handleMouseOut() { | ||
console.log('handleMouseOut') | ||
this.writeMessage('Mouseout triangle'); | ||
@@ -64,3 +63,2 @@ } | ||
public handleMouseMove() { | ||
console.log('handleMouseMove') | ||
const mousePos = this.stage.getStage().getPointerPosition(); | ||
@@ -67,0 +65,0 @@ const x = mousePos.x - 190; |
@@ -10,3 +10,3 @@ **ng2-konva** is a JavaScript library for drawing complex canvas graphics using Angular. | ||
```bash | ||
$ npm install ng2-konva --save | ||
$ npm install konva ng2-konva --save | ||
``` | ||
@@ -13,0 +13,0 @@ |
@@ -0,0 +0,0 @@ 'use strict'; |
@@ -1,2 +0,2 @@ | ||
# ng2-konva (WORK IN PROGRESS) | ||
# ng2-konva | ||
@@ -14,2 +14,6 @@ **ng2-konva** is a JavaScript library for drawing complex canvas graphics using Angular. | ||
## Documentation | ||
[http://rafaelescala.com/ng2-konva/](http://rafaelescala.com/ng2-konva/) | ||
## Installation | ||
@@ -20,3 +24,3 @@ | ||
```bash | ||
$ npm install ng2-konva --save | ||
$ npm install konva ng2-konva --save | ||
``` | ||
@@ -81,18 +85,10 @@ | ||
## Development | ||
## Related repositories | ||
To generate all `*.js`, `*.d.ts` and `*.metadata.json` files: | ||
* [react-konva](https://github.com/lavrton/react-konva) - React + Konva | ||
* [vue-konva](http://rafaelescala.com/vue-konva-doc/) - Vue + Konva | ||
```bash | ||
$ npm run build | ||
``` | ||
To lint all `*.ts` files: | ||
```bash | ||
$ npm run lint | ||
``` | ||
## License | ||
MIT © [Rafael Escala](mailto:rafaesc92@gmail.com) |
@@ -0,0 +0,0 @@ { |
@@ -0,0 +0,0 @@ /* eslint-disable */ |
@@ -0,0 +0,0 @@ { |
const path = require('path'); | ||
const UglifyJSPlugin = require('uglifyjs-webpack-plugin') | ||
@@ -12,3 +13,3 @@ module.exports = { | ||
devtool: 'source-map', | ||
externals: [ | ||
/*externals: [ | ||
'@angular/core', | ||
@@ -19,3 +20,3 @@ '@angular/forms', | ||
'@angular/platform-browser-dynamic' | ||
], | ||
],*/ | ||
resolve: { | ||
@@ -42,5 +43,12 @@ // Add `.ts` and `.tsx` as a resolvable extension. | ||
] | ||
}, | ||
{ | ||
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, | ||
loader: 'url-loader', | ||
} | ||
] | ||
} | ||
}, | ||
plugins: [ | ||
new UglifyJSPlugin() | ||
] | ||
}; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Uses eval
Supply chain riskPackage uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 1 instance in 1 package
1517615
55
0
100
1
1
43
5756
92