Progress on embeddding image

demo/demo5.js

@@ -2,8 +2,10 @@ const docx = require('../build');
 
 var doc = new docx.File();
 
-const image = doc.createImage("./demo/penguins.jpg");
+var paragraph = new docx.Paragraph("Hello World");
+doc.addParagraph(paragraph);
 
+const image = doc.createImage("./demo/image1.jpeg");
 
 var exporter = new docx.LocalPacker(doc);
 exporter.pack('My Document');

src/export/packer/compiler.ts

@@ -32,7 +32,7 @@ export class Compiler {
             cwd: TEMPLATE_PATH,
         });
 
-        const xmlDocument = xml(this.formatter.format(this.file.Document));
+        const xmlDocument = xml(this.formatter.format(this.file.Document), true);
         const xmlStyles = xml(this.formatter.format(this.file.Styles));
         const xmlProperties = xml(this.formatter.format(this.file.Properties), {
             declaration: {

src/file/drawing/inline/graphic/graphic-data/graphic-data-attribute.ts

@@ -0,0 +1,11 @@
+import { XmlAttributeComponent } from "file/xml-components";
+
+export interface IGraphicDataAttributes {
+    uri?: string;
+}
+
+export class GraphicDataAttributes extends XmlAttributeComponent<IGraphicDataAttributes> {
+    protected xmlKeys = {
+        uri: "uri",
+    };
+}

src/file/drawing/inline/graphic/graphic-data/graphic-data.ts

@@ -0,0 +1,16 @@
+import { XmlComponent } from "file/xml-components";
+import { GraphicDataAttributes } from "./graphic-data-attribute";
+import { Pic } from "./pic";
+
+export class GraphicData extends XmlComponent {
+
+    constructor(referenceId: number) {
+        super("a:graphicData");
+
+        this.root.push(new GraphicDataAttributes({
+            uri: "http://schemas.openxmlformats.org/drawingml/2006/picture",
+        }));
+
+        this.root.push(new Pic(referenceId));
+    }
+}

src/file/drawing/inline/graphic/graphic-data/index.ts

@@ -1,10 +1 @@
-import { XmlComponent } from "file/xml-components";
+export * from "./graphic-data";
-import { Pic } from "./pic";
-
-export class GraphicData extends XmlComponent {
-
-    constructor(referenceId: number) {
-        super("a:graphicData");
-        this.root.push(new Pic(referenceId));
-    }
-}

src/file/drawing/inline/graphic/graphic-data/pic/blip/blip.ts

@@ -2,11 +2,13 @@ import { XmlAttributeComponent, XmlComponent } from "file/xml-components";
 
 interface IBlipProperties {
     embed: string;
+    cstate: string;
 }
 
 class BlipAttributes extends XmlAttributeComponent<IBlipProperties> {
     protected xmlKeys = {
         embed: "r:embed",
+        cstate: "cstate",
     };
 }
 
@@ -16,6 +18,7 @@ export class Blip extends XmlComponent {
         super("a:blip");
         this.root.push(new BlipAttributes({
             embed: `rId${referenceId}`,
+            cstate: "none",
         }));
     }
 }

src/file/drawing/inline/graphic/graphic-data/pic/pic-attributes.ts

@@ -0,0 +1,11 @@
+import { XmlAttributeComponent } from "file/xml-components";
+
+export interface IPicAttributes {
+    xmlns?: string;
+}
+
+export class PicAttributes extends XmlAttributeComponent<IPicAttributes> {
+    protected xmlKeys = {
+        xmlns: "xmlns:pic",
+    };
+}

src/file/drawing/inline/graphic/graphic-data/pic/pic.ts

@@ -2,13 +2,16 @@
 import { XmlComponent } from "file/xml-components";
 import { BlipFill } from "./blip/blip-fill";
 import { NonVisualPicProperties } from "./non-visual-pic-properties/non-visual-pic-properties";
+import { PicAttributes } from "./pic-attributes";
 import { ShapeProperties } from "./shape-properties/shape-properties";
 
 export class Pic extends XmlComponent {
-
     constructor(referenceId: number) {
         super("pic:pic");
 
+        this.root.push(new PicAttributes({
+            xmlns: "http://schemas.openxmlformats.org/drawingml/2006/picture",
+        }));
         this.root.push(new NonVisualPicProperties());
         this.root.push(new BlipFill(referenceId));
         this.root.push(new ShapeProperties());

src/file/drawing/inline/inline-attributes.ts

@@ -0,0 +1,17 @@
+import { XmlAttributeComponent } from "file/xml-components";
+
+export interface IInlineAttributes {
+    distT?: number;
+    distB?: number;
+    distL?: number;
+    distR?: number;
+}
+
+export class InlineAttributes extends XmlAttributeComponent<IInlineAttributes> {
+    protected xmlKeys = {
+        distT: "distT",
+        distB: "distB",
+        distL: "distL",
+        distR: "distR",
+    };
+}

src/file/drawing/inline/inline.ts

@@ -1,12 +1,20 @@
 import { XmlComponent } from "file/xml-components";
 import { Graphic } from "./graphic";
 import { GraphicFrameProperties } from "./graphic-frame/graphic-frame-properties";
+import { InlineAttributes } from "./inline-attributes";
 
 export class Inline extends XmlComponent {
 
     constructor(referenceId: number) {
         super("wp:inline");
 
+        this.root.push(new InlineAttributes({
+            distT: 0,
+            distB: 0,
+            distL: 0,
+            distR: 0,
+        }));
+
         this.root.push(new GraphicFrameProperties());
         this.root.push(new Graphic(referenceId));
     }

template/[Content_Types].xml

@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
     <Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types">
+        <Default Extension="jpeg" ContentType="image/jpeg"/>
         <Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml" />
         <Default Extension="xml" ContentType="application/xml" />
         <Override PartName="/word/document.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.document.main+xml" />