Fix referenceId +1 error and spelling mistakes

Add demo

demo/demo1.js

@@ -13,4 +13,4 @@ doc.addParagraph(paragraph);
 var exporter = new docx.LocalPacker(doc);
 exporter.pack('My Document');
 
-console.log('Document created succesfully at project root!');
+console.log('Document created successfully at project root!');

demo/demo2.js

@@ -70,3 +70,5 @@ para.createTextRun('and back to normal.');
 
 const exporter = new docx.LocalPacker(doc);
 exporter.pack('My Document');
+
+console.log('Document created successfully at project root!');

demo/demo3.js

@@ -32,4 +32,4 @@ doc.addParagraph(subSubP);
 var exporter = new docx.LocalPacker(doc);
 exporter.pack('My Document');
 
-console.log('Document created succesfully at project root!');
+console.log('Document created successfully at project root!');

demo/demo4.js

@@ -9,4 +9,4 @@ table.getCell(2, 2).addContent(new docx.Paragraph('Hello'));
 var exporter = new docx.LocalPacker(doc);
 exporter.pack('My Document');
 
-console.log('Document created succesfully at project root!');
+console.log('Document created successfully at project root!');

demo/demo6.js

@@ -22,4 +22,4 @@ doc.createParagraph("5th Dec 2015");
 var exporter = new docx.LocalPacker(doc);
 exporter.pack("My Document");
 
-console.log("Document created succesfully at project root!");
+console.log("Document created successfully at project root!");

demo/demo7.js

@@ -11,4 +11,4 @@ doc.addParagraph(paragraph);
 var exporter = new docx.LocalPacker(doc);
 exporter.pack("My Document");
 
-console.log("Document created succesfully at project root!");
+console.log("Document created successfully at project root!");

demo/demo8.js

@@ -10,4 +10,4 @@ doc.Footer.createParagraph("Footer text");
 var exporter = new docx.LocalPacker(doc);
 exporter.pack('My Document');
 
-console.log('Document created succesfully at project root!');
+console.log('Document created successfully at project root!');

demo/demo9.js

@@ -0,0 +1,13 @@
+const docx = require('../build');
+
+var doc = new docx.File();
+
+doc.createParagraph("Hello World");
+
+doc.Header.createImage("./demo/images/pizza.gif");
+// doc.Footer.createImage("./demo/images/pizza.gif");
+
+var exporter = new docx.LocalPacker(doc);
+exporter.pack('My Document');
+
+console.log('Document created successfully at project root!');

src/file/file.ts

@@ -38,8 +38,8 @@ export class File {
         this.numbering = new Numbering();
         this.relationships = new Relationships();
         this.media = new Media();
-        this.header = new Header();
+        this.header = new Header(this.media, this.relationships);
-        this.footer = new Footer();
+        this.footer = new Footer(this.media, this.relationships);
     }
 
     public addParagraph(paragraph: Paragraph): void {

src/file/footer/footer.ts

@@ -1,12 +1,13 @@
 // http://officeopenxml.com/WPfooters.php
-import { IMediaData } from "file/media";
+import { IMediaData, Media } from "file/media";
+import { Relationships } from "file/relationships";
 import { XmlComponent } from "file/xml-components";
 import { Paragraph, PictureRun } from "../paragraph";
 import { Table } from "../table";
 import { FooterAttributes } from "./footer-attributes";
 
 export class Footer extends XmlComponent {
-    constructor() {
+    constructor(private readonly media: Media, private readonly relationships: Relationships) {
         super("w:ftr");
         this.root.push(
             new FooterAttributes({
@@ -58,9 +59,13 @@ export class Footer extends XmlComponent {
         this.root.push(paragraph);
     }
 
-    public createDrawing(imageData: IMediaData): void {
+    public createImage(image: string): void {
-        this.addDrawing(imageData);
+        const mediaData = this.media.addMedia(image, this.relationships.RelationshipCount);
-
+        this.relationships.createRelationship(
-        return;
+            mediaData.referenceId,
+            "http://schemas.openxmlformats.org/officeDocument/2006/relationships/image",
+            `media/${mediaData.fileName}`,
+        );
+        this.addDrawing(mediaData);
     }
 }

src/file/header/header.ts

@@ -1,12 +1,13 @@
 // http://officeopenxml.com/WPheaders.php
-import { IMediaData } from "file/media";
+import { IMediaData, Media } from "file/media";
+import { Relationships } from "file/relationships";
 import { XmlComponent } from "file/xml-components";
 import { Paragraph, PictureRun } from "../paragraph";
 import { Table } from "../table";
 import { HeaderAttributes } from "./header-attributes";
 
 export class Header extends XmlComponent {
-    constructor() {
+    constructor(private readonly media: Media, private readonly relationships: Relationships) {
         super("w:hdr");
         this.root.push(
             new HeaderAttributes({
@@ -58,9 +59,13 @@ export class Header extends XmlComponent {
         this.root.push(paragraph);
     }
 
-    public createDrawing(imageData: IMediaData): void {
+    public createImage(image: string): void {
-        this.addDrawing(imageData);
+        const mediaData = this.media.addMedia(image, this.relationships.RelationshipCount);
-
+        this.relationships.createRelationship(
-        return;
+            mediaData.referenceId,
+            "http://schemas.openxmlformats.org/officeDocument/2006/relationships/image",
+            `media/${mediaData.fileName}`,
+        );
+        this.addDrawing(mediaData);
     }
 }

src/file/media/media.ts

@@ -26,7 +26,7 @@ export class Media {
         const dimensions = sizeOf(filePath);
 
         const imageData = {
-            referenceId: this.map.size + relationshipsCount,
+            referenceId: this.map.size + relationshipsCount + 1,
             stream: fs.createReadStream(filePath),
             path: filePath,
             fileName: key,