From: Ulrich-Matthias Schäfer Date: Sat, 1 Dec 2018 17:39:37 +0000 (+0100) Subject: applied fixes from 2.x branch X-Git-Tag: 3.0.0~3 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=1edcc976b8db981ba2398036b3a39c4de4791a86;p=svg.js.git applied fixes from 2.x branch --- diff --git a/CHANGELOG.md b/CHANGELOG.md index e564245..11f15c8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,9 +15,7 @@ The document follows the conventions described in [“Keep a CHANGELOG”](http: - added `SVG.HTMLNode` which is the object wrapped around html nodes to put something in them - added `dispatch()` method on `SVG.Element` which returns the dispatched event for event cancelation (#550) - added `isRoot()` on `SVG.Doc` (#809) -- added `random` option and `randomize()` method to `SVG.Color` -> __TODO!__ - added a linter during the npm build process -- added `npm build:dev` to let you develop without getting too annoyed - added `beziere()` and `steps()` to generate easing functions - added `insertAfter()` and `insertBefore` - added `SVG.Style` which can be created with `style()` or `fontface()` (#517) @@ -89,9 +87,6 @@ The document follows the conventions described in [“Keep a CHANGELOG”](http: - `Image` callback passes normal `load` event instead of custom object (#931) - renamed `Doc` to `Svg` and `doc()` to `root` (and `toDoc()/toRoot()`) (#932) -### Fixed -- fixed a bug in clipping and masking where empty nodes persists after removal -> __TODO!__ -- fixed a bug in IE11 with `mouseenter` and `mouseleave` -> __TODO!__ ## [2.6.2] - 2017-06-05 diff --git a/README.md b/README.md index d0d7fdf..29dc14b 100644 --- a/README.md +++ b/README.md @@ -11,20 +11,25 @@ SVG.js is licensed under the terms of the MIT License. ## Installation -#### Bower: +#### Npm: -`bower install svg.js` +`npm install svg.js` -#### Node: +#### Yarn: -`npm install svg.js` +`yarn add svg.js` + + +#### Bower: + +`bower install svg.js` #### Cdnjs: [https://cdnjs.com/libraries/svg.js](https://cdnjs.com/libraries/svg.js) ## Documentation -Check [https://svgdotjs.github.io](https://svgdotjs.github.io/) to learn more. +Check [svgjs.com](https://svgjs.com) to learn more. [![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=pay%40woutfierens.com&lc=US&item_name=SVG.JS¤cy_code=EUR&bn=PP-DonationsBF%3Abtn_donate_74x21.png%3ANonHostedGuest) @@ -40,12 +45,6 @@ You'll now have all the dev dependencies installed, and you'll be ready to build This will build svg.js and make a distribution in the `/dist` folder. While developing, this may not be so convenient as the build will fail if you have any linting errors, refer to the [standard coding styleguide](https://standardjs.com/) for style we use, linters are available for most popular text editors as well. -However, because we were too nice to put you through the pain of always having to work with a linter, we added a gentle mode that you can use by running: - - npm run build:dev - -This will only warn you about linting errors and give you useful feedback about possible errors you may have in your code (but this is no substitute for tests). Please make sure that **before making any pull requests**, you pass all of our tests and can build with `npm run build` first. - ### Testing This will set up everything. While you are working, you should make sure your changes pass all of our tests, so just run: @@ -60,7 +59,7 @@ You can run performance tests by making a new benchmarks, look in the `/bench` f ### Playgrounds -If you would like a simple sandbox that you can use +If you would like a simple sandbox that you can use, take a look into the sandbox folder. ## Pull Requests diff --git a/src/elements/Dom.js b/src/elements/Dom.js index ff33d46..45a41ca 100644 --- a/src/elements/Dom.js +++ b/src/elements/Dom.js @@ -156,8 +156,9 @@ export default class Dom extends EventTarget { if (!type) return parent // loop trough ancestors if type is given - while (parent && parent.node instanceof globals.window.SVGElement) { // FIXME: That shouldnt be neccessary + while (parent) { // FIXME: That shouldnt be neccessary if (typeof type === 'string' ? parent.matches(type) : parent instanceof type) return parent + if (!parent.node.parentNode || parent.node.parentNode.nodeName === '#document' || parent.node.parentNode.nodeName === '#document-fragment') return null // #759, #720 parent = adopt(parent.node.parentNode) } } diff --git a/svg.js.d.ts b/svg.js.d.ts index f87f831..05206b3 100644 --- a/svg.js.d.ts +++ b/svg.js.d.ts @@ -44,7 +44,7 @@ declare namespace svgjs { // array.js type ArrayAlias = _Array | number[] | string; - + interface _Array { new (array?: ArrayAlias, fallback?: number[]): _Array; value: number[]; @@ -93,7 +93,7 @@ declare namespace svgjs { merge(box: Box): Box; transform(m: Matrix): Box } - + export interface BBox extends Box { new (element?: Element): BBox; } @@ -105,7 +105,7 @@ declare namespace svgjs { } interface Element { bbox(): BBox; - rbox(): RBox; + rbox(element?: Element): RBox; tbox(): TBox; } interface Library { @@ -129,16 +129,16 @@ declare namespace svgjs { unclip(): this; } interface Library { ClipPath: ClipPath; } - + // color.js interface ColorLike { r: number; g: number; b: number; } - + type ColorAlias = string | ColorLike; - + export interface Color extends ColorLike{ new (): Color; new (color: ColorAlias): Color; @@ -159,7 +159,7 @@ declare namespace svgjs { width: number; height:number; } - + export interface Container extends Parent { new (): Container; } @@ -221,6 +221,7 @@ declare namespace svgjs { } interface Library { Doc: Doc; } + type ParentTypeAlias = string | Doc | Nested | G; // element.js export interface Element { new (): Element; @@ -271,17 +272,20 @@ declare namespace svgjs { toggleClass(name: string): this; reference(type: string): Element; - + // Add HTMLElement for Doc inheritance + parent(type?: ParentTypeAlias): Parent | HTMLElement; + doc(): Parent; parents(): Parent[]; matches(selector: string): boolean; native(): LinkedHTMLElement; svg(svg: string): this; - - writeDataToDom(): this, - setData(data: object): this, - + svg(): string; + + writeDataToDom(): this; + setData(data: object): this; + is(cls: any): boolean; } interface Library { Element: Element; } @@ -313,9 +317,10 @@ declare namespace svgjs { // event.js interface Element { on(event: string, cb: Function, context?: Object): this; - off(event: string, cb: Function, context?: Object): this; + off(event: string, cb?: Function, context?: Object): this; fire(event: string, data?: any): this; fire(event: Event): this; + event(): Event | CustomEvent; click(cb: Function): this; dblclick(cb: Function): this; @@ -351,7 +356,7 @@ declare namespace svgjs { offset?: number; opacity?: number; } - + // gradient.js export interface Stop extends Element { new (): Stop; @@ -422,8 +427,8 @@ declare namespace svgjs { // line.js interface ArrayPoint extends Array { } - type PointArrayAlias = ArrayPoint | number[] | PointArray | string; - + type PointArrayAlias = ArrayPoint[] | number[] | PointArray | string; + export interface Line extends Shape { new (): Line; array(): PointArray; @@ -504,7 +509,7 @@ declare namespace svgjs { f: number; matrix: Matrix; } - + interface MatrixLike { a: number; b: number; @@ -513,9 +518,9 @@ declare namespace svgjs { e: number; f: number; } - + type MatrixAlias = MatrixLike | number[] | Element | string; - + export interface Matrix { new (): Matrix; new (source: MatrixAlias): Matrix; @@ -553,8 +558,8 @@ declare namespace svgjs { // memory.js interface Element { remember(name: string, value: any): this; - remember(obj: Object): this; remember(name: string): any; + remember(obj: Object): this; forget(...keys: string[]): this; forget(): this; memory(): Object; @@ -585,7 +590,7 @@ declare namespace svgjs { at(pos: number): _Number; } interface Library { Number: _Number; } - + type NumberAlias = _Number | number | string; // parent.js @@ -609,7 +614,7 @@ declare namespace svgjs { // path.js interface PathArrayPoint extends Array { } type PathArrayAlias = PathArray | (string | number)[] | PathArrayPoint[] | string; - + export interface Path extends Shape { new (): Path; morphArray: PathArray; @@ -654,6 +659,9 @@ declare namespace svgjs { new (point: Point): Point; new (position: { x: number, y: number }): Point; new (x: number, y: number): Point; + + x: number; + y: number; clone(): Point; morph(point: Point): this; @@ -747,7 +755,7 @@ declare namespace svgjs { // selector.js interface Library { get(id: string): Element; - select(query: string, parent: HTMLElement): Set; + select(query: string, parent?: HTMLElement): Set; } interface Parent { select(query: string): Set; @@ -768,6 +776,7 @@ declare namespace svgjs { last(): Element; valueOf(): Element[]; bbox(): BBox; + click(cb: Function): Set; } interface Container { set(members?: Element[]): Set; } interface Library { Set: Set; } @@ -914,6 +923,7 @@ declare namespace svgjs { d?: number; e?: number; f?: number; + scale?: number; } export interface Transformation { new (...transform: Transform[]): Transformation; @@ -945,7 +955,7 @@ declare namespace svgjs { element(element: Element, file?: string): this; } interface Container { - use(element: Element, file?: string): Use; + use(element: Element | string, file?: string): Use; } interface Library { Use: Use; } @@ -962,7 +972,7 @@ declare namespace svgjs { // viewbox.js type ViewBoxAlias = ViewBoxLike | number[] | string | Element; - + interface ViewBox { new (source: ViewBoxAlias): ViewBox; new (x: number, y: number, width: number, height: number): ViewBox; @@ -985,6 +995,10 @@ declare namespace svgjs { export interface Animation { stop(): Animation; + finish(): Animation; + pause(): Animation; + play(): Animation; + reverse(reversed?: boolean): Animation; attr(name: string, value: any, namespace?: string): Animation; attr(obj: Object): Animation; @@ -994,6 +1008,7 @@ declare namespace svgjs { viewbox(x: number, y: number, w: number, h: number): Animation; move(x: number, y: number, anchor?: boolean): Animation; + dmove(x: number, y: number): Animation; x(x: number, anchor?: boolean): Animation; y(y: number, anchor?: boolean): Animation; @@ -1005,12 +1020,15 @@ declare namespace svgjs { during(cb: (pos: number) => void): Animation; to(value: number): Animation; after(cb: () => void): Animation; + + delay(delayMS: number): Animation; - rotate(degrees: number, cx?: number, cy?: number): Animation - skew(skewX: number, skewY?: number, cx?: number, cy?: number): Animation - scale(scaleX: number, scaleY?: number, cx?: number, cy?: number): Animation - translate(x: number, y: number): Animation + rotate(degrees: number, cx?: number, cy?: number): Animation; + skew(skewX: number, skewY?: number, cx?: number, cy?: number): Animation; + scale(scaleX: number, scaleY?: number, cx?: number, cy?: number): Animation; + translate(x: number, y: number): Animation; + transform(t: Transform, relative?: boolean): Animation; // TODO style, etc, bbox... } -} +} \ No newline at end of file