diff --git a/CHANGELOG.md b/CHANGELOG.md index 2bc1de18..4eb68296 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0. - **image:** Set width and height of an image, closes [#36](https://github.com/connium/simple-odf/issues/36) - **image:** Set anchor type of an image, closes [#11](https://github.com/connium/simple-odf/issues/11) +### Changed +- **image:** Move size configuration of an image to the image style, closes [#41](https://github.com/connium/simple-odf/issues/41) + ## [0.4.0] (2018-05-19) ### Added - **chore:** Add code coverage analysis with Codecov by @oncletom, closes [#17](https://github.com/connium/simple-odf/issues/17) diff --git a/README.md b/README.md index 42edb63b..778db2fc 100644 --- a/README.md +++ b/README.md @@ -23,7 +23,8 @@ const simpleOdf = require("simple-odf"); const document = new simpleOdf.TextDocument(); const image = document.addParagraph().addImage("/home/homer/myself.png"); -image.setSize(29.4, 36.5); +image.getStyle().setAnchorType(simpleOdf.AnchorType.AsChar); +image.getStyle().setSize(29.4, 36.5); document.addHeading("Welcome to simple-odf"); diff --git a/src/draw/Image.ts b/src/draw/Image.ts index e70e2128..375c1991 100644 --- a/src/draw/Image.ts +++ b/src/draw/Image.ts @@ -1,11 +1,9 @@ import { readFileSync } from "fs"; -import { OdfAttributeName } from "../OdfAttributeName"; import { OdfElement } from "../OdfElement"; import { OdfElementName } from "../OdfElementName"; import { IImageStyle } from "../style/IImageStyle"; import { ImageStyle } from "../style/ImageStyle"; -const MINIMAL_SIZE = 1; const ENCODING = "base64"; /** @@ -15,8 +13,6 @@ const ENCODING = "base64"; */ export class Image extends OdfElement { private style: IImageStyle; - private height: number | undefined; - private width: number | undefined; /** * Creates an image @@ -30,58 +26,6 @@ export class Image extends OdfElement { this.style = new ImageStyle(); } - /** - * Sets the target height of the image. - * - * @param {number} height The target height of the image in millimeter - * @since 0.5.0 - */ - public setHeight(height: number): void { - this.height = Math.max(height, MINIMAL_SIZE); - } - - /** - * Returns the target height of the image or `undefined` if no height was set. - * - * @returns {number | undefined} The target height of the image in millimeter or `undefined` if no height was set - * @since 0.5.0 - */ - public getHeight(): number | undefined { - return this.height; - } - - /** - * Sets the target width of the image. - * - * @param {number} width The target width of the image in millimeter - * @since 0.5.0 - */ - public setWidth(width: number): void { - this.width = Math.max(width, MINIMAL_SIZE); - } - - /** - * Returns the target width of the image or `undefined` if no width was set. - * - * @returns {number | undefined} The target width of the image in millimeter or `undefined` if no width was set - * @since 0.5.0 - */ - public getWidth(): number | undefined { - return this.width; - } - - /** - * Sets the target size of the image. - * - * @param {number} width The target width of the image in millimeter - * @param {number} height The target height of the image in millimeter - * @since 0.5.0 - */ - public setSize(width: number, height: number): void { - this.setWidth(width); - this.setHeight(height); - } - /** * Sets the new style of this image. * @@ -111,27 +55,11 @@ export class Image extends OdfElement { this.embedImage(document, frameElement); - this.style.toXml(document, frameElement); - this.setFrameAttributes(frameElement); + this.style.toXml(frameElement); super.toXml(document, frameElement); } - /** - * Sets the attributes for the image frame. - * - * @param {Element} frameElement The element which will take the attribute - */ - private setFrameAttributes(frameElement: Element): void { - if (this.width !== undefined) { - frameElement.setAttribute(OdfAttributeName.SvgWidth, + this.width + "mm"); - } - - if (this.height !== undefined) { - frameElement.setAttribute(OdfAttributeName.SvgHeight, + this.height + "mm"); - } - } - /** * Creates the image element and embeds the denoted image base64 encoded binary data. * diff --git a/src/index.ts b/src/index.ts index b5aaadaf..d75f5062 100644 --- a/src/index.ts +++ b/src/index.ts @@ -4,6 +4,7 @@ export { TextDocument } from "./TextDocument"; export { Image } from "./draw/Image"; // style +export { AnchorType } from "./style/AnchorType"; export { Color } from "./style/Color"; export { FontPitch } from "./style/FontPitch"; export { HorizontalAlignment } from "./style/HorizontalAlignment"; diff --git a/src/style/IImageStyle.ts b/src/style/IImageStyle.ts index 4174cb68..babffc7d 100644 --- a/src/style/IImageStyle.ts +++ b/src/style/IImageStyle.ts @@ -22,12 +22,52 @@ export interface IImageStyle { */ getAnchorType(): AnchorType; + /** + * Sets the target height of the image. + * + * @param {number} height The target height of the image in millimeter + * @since 0.5.0 + */ + setHeight(height: number): void; + + /** + * Returns the target height of the image or `undefined` if no height was set. + * + * @returns {number | undefined} The target height of the image in millimeter or `undefined` if no height was set + * @since 0.5.0 + */ + getHeight(): number | undefined; + + /** + * Sets the target width of the image. + * + * @param {number} width The target width of the image in millimeter + * @since 0.5.0 + */ + setWidth(width: number): void; + + /** + * Returns the target width of the image or `undefined` if no width was set. + * + * @returns {number | undefined} The target width of the image in millimeter or `undefined` if no width was set + * @since 0.5.0 + */ + getWidth(): number | undefined; + + /** + * Sets the target size of the image. + * + * @param {number} width The target width of the image in millimeter + * @param {number} height The target height of the image in millimeter + * @since 0.5.0 + */ + setSize(width: number, height: number): void; + /** * Transforms the image style into Open Document Format. * - * @param {Document} document The XML document * @param {Element} parent The parent node in the DOM (`draw:frame`) * @since 0.5.0 */ - toXml(document: Document, parent: Element): void; + toXml(parent: Element): void; } diff --git a/src/style/ImageStyle.ts b/src/style/ImageStyle.ts index dfb88a2f..7ddc4df5 100644 --- a/src/style/ImageStyle.ts +++ b/src/style/ImageStyle.ts @@ -3,6 +3,7 @@ import { AnchorType } from "./AnchorType"; import { IImageStyle } from "./IImageStyle"; const DEFAULT_ANCHOR_TYPE = AnchorType.Paragraph; +const MINIMAL_SIZE = 1; /** * This class represents the style of an image @@ -11,6 +12,8 @@ const DEFAULT_ANCHOR_TYPE = AnchorType.Paragraph; */ export class ImageStyle implements IImageStyle { private anchorType: AnchorType; + private height: number | undefined; + private width: number | undefined; /** * Constructor. @@ -29,8 +32,60 @@ export class ImageStyle implements IImageStyle { return this.anchorType; } + /** + * Sets the target height of the image. + * + * @param {number} height The target height of the image in millimeter + * @since 0.5.0 + */ + public setHeight(height: number): void { + this.height = Math.max(height, MINIMAL_SIZE); + } + + /** + * Returns the target height of the image or `undefined` if no height was set. + * + * @returns {number | undefined} The target height of the image in millimeter or `undefined` if no height was set + * @since 0.5.0 + */ + public getHeight(): number | undefined { + return this.height; + } + + /** + * Sets the target width of the image. + * + * @param {number} width The target width of the image in millimeter + * @since 0.5.0 + */ + public setWidth(width: number): void { + this.width = Math.max(width, MINIMAL_SIZE); + } + + /** + * Returns the target width of the image or `undefined` if no width was set. + * + * @returns {number | undefined} The target width of the image in millimeter or `undefined` if no width was set + * @since 0.5.0 + */ + public getWidth(): number | undefined { + return this.width; + } + + /** + * Sets the target size of the image. + * + * @param {number} width The target width of the image in millimeter + * @param {number} height The target height of the image in millimeter + * @since 0.5.0 + */ + public setSize(width: number, height: number): void { + this.setWidth(width); + this.setHeight(height); + } + /** @inheritDoc */ - public toXml(document: Document, parent: Element): void { + public toXml(parent: Element): void { this.setFrameAttributes(parent); } @@ -41,5 +96,13 @@ export class ImageStyle implements IImageStyle { */ private setFrameAttributes(frameElement: Element): void { frameElement.setAttribute(OdfAttributeName.TextAnchorType, this.anchorType); + + if (this.width !== undefined) { + frameElement.setAttribute(OdfAttributeName.SvgWidth, + this.width + "mm"); + } + + if (this.height !== undefined) { + frameElement.setAttribute(OdfAttributeName.SvgHeight, + this.height + "mm"); + } } } diff --git a/test/draw/Image.spec.ts b/test/draw/Image.spec.ts index fcafb55d..815293f3 100644 --- a/test/draw/Image.spec.ts +++ b/test/draw/Image.spec.ts @@ -11,66 +11,6 @@ describe(Image.name, () => { document = new TextDocument(); }); - describe("#setHeight", () => { - it("set a minimum height", () => { - const image = new Image("somePath"); - image.setHeight(-23); - - expect(image.getHeight()).toBe(1); - }); - }); - - describe("#getHeight", () => { - it("return `undefined` as default", () => { - const image = new Image("somePath"); - - expect(image.getHeight()).toBeUndefined(); - }); - - it("return the current height", () => { - const image = new Image("somePath"); - - image.setHeight(23); - - expect(image.getHeight()).toBe(23); - }); - }); - - describe("#setWidth", () => { - it("set a minimum width", () => { - const image = new Image("somePath"); - image.setWidth(-42); - - expect(image.getWidth()).toBe(1); - }); - }); - - describe("#getWidth", () => { - it("return `undefined` as default", () => { - const image = new Image("somePath"); - - expect(image.getWidth()).toBeUndefined(); - }); - - it("return the current width", () => { - const image = new Image("somePath"); - - image.setWidth(42); - - expect(image.getWidth()).toBe(42); - }); - }); - - describe("#setSize", () => { - it("set width and height", () => { - const image = new Image("somePath"); - image.setSize(42, 23); - - expect(image.getWidth()).toBe(42); - expect(image.getHeight()).toBe(23); - }); - }); - describe("#setStyle", () => { it("set text anchor attribute on frame", () => { document.addParagraph().addImage(join(__dirname, "..", "data", "ODF.png")); @@ -121,17 +61,5 @@ describe(Image.name, () => { + ""); expect(document.toString()).toMatch(regex); }); - - it("set the height", () => { - image.setHeight(23); - - expect(document.toString()).toMatch(//); - }); - - it("set the width", () => { - image.setWidth(42); - - expect(document.toString()).toMatch(//); - }); }); }); diff --git a/test/integration.spec.ts b/test/integration.spec.ts index 07e0851c..636f2b06 100644 --- a/test/integration.spec.ts +++ b/test/integration.spec.ts @@ -36,7 +36,7 @@ xdescribe("integration", () => { const image = paragraph.addImage(join(__dirname, "data", "ODF.png")); image.getStyle().setAnchorType(AnchorType.AsChar); - image.setSize(29.4, 36.5); + image.getStyle().setSize(29.4, 36.5); }); it("add heading", () => { diff --git a/test/style/ImageStyle.spec.ts b/test/style/ImageStyle.spec.ts index a822bf82..02d4255e 100644 --- a/test/style/ImageStyle.spec.ts +++ b/test/style/ImageStyle.spec.ts @@ -26,15 +26,78 @@ describe(ImageStyle.name, () => { }); }); + describe("#setHeight", () => { + it("set a minimum height", () => { + testStyle.setHeight(-23); + + expect(testStyle.getHeight()).toBe(1); + }); + }); + + describe("#getHeight", () => { + it("return `undefined` as default", () => { + expect(testStyle.getHeight()).toBeUndefined(); + }); + + it("return the current height", () => { + testStyle.setHeight(23); + + expect(testStyle.getHeight()).toBe(23); + }); + }); + + describe("#setWidth", () => { + it("set a minimum width", () => { + testStyle.setWidth(-42); + + expect(testStyle.getWidth()).toBe(1); + }); + }); + + describe("#getWidth", () => { + it("return `undefined` as default", () => { + expect(testStyle.getWidth()).toBeUndefined(); + }); + + it("return the current width", () => { + testStyle.setWidth(42); + + expect(testStyle.getWidth()).toBe(42); + }); + }); + + describe("#setSize", () => { + it("set width and height", () => { + testStyle.setSize(42, 23); + + expect(testStyle.getWidth()).toBe(42); + expect(testStyle.getHeight()).toBe(23); + }); + }); + describe("toXml", () => { let image: Image; - it("set the anchor type", () => { + beforeEach(() => { image = document.addParagraph().addImage(join(__dirname, "..", "data", "ODF.png")); + }); + it("set the anchor type", () => { image.getStyle().setAnchorType(AnchorType.AsChar); expect(document.toString()).toMatch(//); }); + + it("set the height", () => { + image.getStyle().setHeight(23); + + expect(document.toString()).toMatch(//); + }); + + it("set the width", () => { + image.getStyle().setWidth(42); + + expect(document.toString()).toMatch(//); + }); }); });