Skip to content

D
docxtemplater-image-module
Commit be262a7c by Edgar HIPP
Options

Update config files

parent 53064f9f
Showing with 315 additions and 76 deletions
.editorconfig 0 → 100644
root = true
[*]
end_of_line = lf
insert_final_newline = true
[*.js]
charset = utf-8
indent_style = tab
[{.travis.yml,package.json}]
indent_style = space
indent_size = 2
.eslintignore 0 → 100644
*.sublime-project
*.sublime-workspace
npm-debug.log
node_modules
.idea
test/spec/output.docx
/output.docx
tags
/docs/build
*.spec.js
*.spec.map
*.log
/js
/build
/browser
examples/index.html
*.es5
.babel.json
browser/
build/
vendor/
js/
test/
.eslintrc 0 → 100644
{
"parser": "babel-eslint",
"globals":{
"saveAs": true,
"JSZipUtils": true
},
"env": {
"node": true,
"browser": true,
"mocha": true
},
"rules": {
"accessor-pairs": 2,
"array-bracket-spacing": [2, "never"],
"arrow-parens": [2, "always"],
"arrow-spacing": [2, {"before": true, "after": true}],
"block-scoped-var": 2,
"block-spacing": [2, "always"],
"brace-style": [2, "stroustrup", { "allowSingleLine": true }],
"callback-return": 2,
"camelcase": [2 , {"properties": "never"}],
"comma-dangle": [2 , "always-multiline"],
"comma-spacing": [2, {"before": false, "after": true}],
"comma-style": [2, "last"],
"complexity": [2, 6],
"computed-property-spacing": [2, "never"],
"consistent-return": 0,
"consistent-this": [2, "self"],
"constructor-super": 2,
"curly": [2, "all"],
"default-case": 0,
"dot-location": [2, "property"],
"dot-notation": 2,
"eol-last": 2,
"eqeqeq": [2, "smart"],
"func-names": 0,
"func-style": [2, "expression"],
"generator-star-spacing": [2, {"before": false, "after": true}],
"global-require": 0,
"guard-for-in": 2,
"handle-callback-err": 2,
"id-length": 0,
"id-match": 0,
"indent": [2, "tab", {"SwitchCase": 1}],
"init-declarations": 0,
"key-spacing": [2, {"beforeColon": false, "afterColon": true, "mode": "strict"}],
"linebreak-style": 0,
"lines-around-comment": 0,
"max-nested-callbacks": 0,
"new-cap": [2, {
"newIsCapExceptions": ["Boom.badRequest", "Boom.forbidden", "Boom.unauthorized", "Boom.wrap"],
"capIsNewExceptions": ["squeeze.Squeeze"]
}],
"new-parens": 2,
"newline-after-var": 0,
"no-alert": 2,
"no-array-constructor": 2,
"no-caller": 2,
"no-catch-shadow": 0,
"no-class-assign": 2,
"no-cond-assign": [2, "always"],
"no-console": 2,
"no-const-assign": 2,
"no-constant-condition": 2,
"no-continue": 0,
"no-control-regex": 0,
"no-debugger": 2,
"no-delete-var": 2,
"no-div-regex": 2,
"no-dupe-args": 2,
"no-dupe-class-members": 2,
"no-dupe-keys": 2,
"no-duplicate-case": 2,
"no-else-return": 2,
"no-empty": 2,
"no-empty-label": 2,
"no-empty-character-class": 2,
"no-eval": 2,
"no-ex-assign": 2,
"no-extend-native": 2,
"no-extra-bind": 2,
"no-extra-boolean-cast": 2,
"no-extra-parens": [2, "functions"],
"no-extra-semi": 2,
"no-fallthrough": 2,
"no-floating-decimal": 2,
"no-func-assign": 2,
"no-implicit-coercion": 0,
"no-implied-eval": 2,
"no-inline-comments": 0,
"no-inner-declarations": 2,
"no-invalid-regexp": 2,
"no-irregular-whitespace": 2,
"no-iterator": 2,
"no-label-var": 2,
"no-labels": 0,
"no-lone-blocks": 2,
"no-lonely-if": 2,
"no-loop-func": 2,
"no-mixed-requires": 2,
"no-mixed-spaces-and-tabs": 2,
"no-multi-spaces": 2,
"no-multi-str": 2,
"no-multiple-empty-lines": [2, {"max": 1}],
"no-native-reassign": 2,
"no-negated-in-lhs": 2,
"no-nested-ternary": 2,
"no-new": 2,
"no-new-func": 2,
"no-new-object": 2,
"no-new-require": 2,
"no-new-wrappers": 2,
"no-obj-calls": 2,
"no-octal": 2,
"no-octal-escape": 2,
"no-param-reassign": 0,
"no-path-concat": 2,
"no-process-env": 2,
"no-process-exit": 2,
"no-proto": 2,
"no-redeclare": 2,
"no-regex-spaces": 2,
"no-restricted-modules": 0,
"no-restricted-syntax": 0,
"no-return-assign": 2,
"no-script-url": 2,
"no-self-compare": 2,
"no-sequences": 2,
"no-shadow": 0,
"no-shadow-restricted-names": 2,
"no-spaced-func": 2,
"no-sparse-arrays": 2,
"no-ternary": 0,
"no-this-before-super": 2,
"no-throw-literal": 2,
"no-trailing-spaces": 2,
"no-undef": 2,
"no-undef-init": 0,
"no-undefined": 0,
"no-underscore-dangle": 0,
"no-unexpected-multiline": 2,
"no-unneeded-ternary": 2,
"no-unreachable": 2,
"no-unused-expressions": 2,
"no-unused-vars": 2,
"no-use-before-define": [2, "nofunc"],
"no-useless-call": 2,
"no-useless-concat": 2,
"no-var": 0,
"no-void": 2,
"no-warning-comments": [2, {"terms": ["todo", "fixme"], "location": "anywhere"}],
"no-with": 2,
"object-curly-spacing": [2, "never"],
"object-shorthand": 0,
"one-var": 0,
"operator-assignment": [2, "always"],
"operator-linebreak": [2, "before"],
"padded-blocks": [2, "never"],
"prefer-arrow-callback": 0,
"prefer-const": 2,
"prefer-reflect": 0,
"prefer-spread": 0,
"prefer-template": 0,
"quotes": [2, "double", "avoid-escape"],
"quote-props": [2, "as-needed"],
"radix": 2,
"require-jsdoc": 0,
"require-yield": 2,
"semi": [2, "always"],
"semi-spacing": [2, {"before": false, "after": true}],
"sort-vars": 0,
"space-before-blocks": 2,
"space-before-keywords": 0,
"space-before-function-paren": [2, {"anonymous": "always", "named": "never"}],
"space-after-keywords": 2,
"space-in-parens": [2, "never"],
"space-infix-ops": 2,
"space-return-throw-case": 2,
"space-unary-ops": [2, {"words": true, "nonwords": false}],
"spaced-comment": [2, "always"],
"use-isnan": 2,
"valid-jsdoc": 0,
"valid-typeof": 2,
"vars-on-top": 0,
"wrap-iife": [2, "inside"],
"wrap-regex": 0,
"yoda": [2, "never"]
}
}
.gitignore
...@@ -2,4 +2,3 @@ ...@@ -2,4 +2,3 @@
test/ test/
js/ js/
node_modules node_modules
es6
package.json
...@@ -6,9 +6,12 @@ ...@@ -6,9 +6,12 @@
"scripts": { "scripts": {
"compile": "rm js -rf ; mkdir -p test/spec; mkdir -p js; babel es6 --out-dir js; mv js/test.js test/test.js", "compile": "rm js -rf ; mkdir -p test/spec; mkdir -p js; babel es6 --out-dir js; mv js/test.js test/test.js",
"test:compiled": "mocha", "test:compiled": "mocha",
"lint": "eslint .",
"test": "npm run compile && npm run test:compiled" "test": "npm run compile && npm run test:compiled"
}, },
"devDependencies": { "devDependencies": {
"babel-cli": "^6.4.0",
"babel-eslint": "^4.1.2",
"babel-preset-es2015": "^6.3.13", "babel-preset-es2015": "^6.3.13",
"chai": "^3.4.1", "chai": "^3.4.1",
"docxtemplater": "^2.0.0", "docxtemplater": "^2.0.0",
...@@ -22,11 +25,8 @@ ...@@ -22,11 +25,8 @@
"author": "Edgar Hipp", "author": "Edgar Hipp",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"decaffeinate": "^1.44.12",
"docxtemplater": "^2.0.0",
"jszip": "^2.4.0",
"png-js": "^0.1.1", "png-js": "^0.1.1",
"qrcode-reader": "0.0.7", "qrcode-reader": "0.0.7",
"xmldom": "0.1.19" "xmldom": "0.1.21"
} }
} }
readme.md
This is the master branch, which is not completely stable yet (version 1). No npm module has been released to npm yet. This is the master branch, which is not completely stable yet (version 1). No npm module has been released to npm yet. For up to date documentation, please switch to the 0.x branch.
For up to date documentation, please switch to the 0.x branch.
This version is only compatible with docxtemplater version 2
The v1 has added two mandatory arguments: `opts.getImage` and `opts.getSize`. See Usage (v1) The v1 has added two mandatory arguments: `opts.getImage` and `opts.getSize`. See Usage (v1)
[![Build Status](https://travis-ci.org/open-xml-templating/docxtemplater-image-module.svg?branch=master&style=flat)](https://travis-ci.org/open-xml-templating/docxtemplater-image-module) [![Build Status](https://travis-ci.org/open-xml-templating/docxtemplater-image-module.svg?branch=master&style=flat)](https://travis-ci.org/open-xml-templating/docxtemplater-image-module) [![Download count](http://img.shields.io/npm/dm/docxtemplater-image-module.svg?style=flat)](https://www.npmjs.org/package/docxtemplater-image-module) [![Current tag](http://img.shields.io/npm/v/docxtemplater-image-module.svg?style=flat)](https://www.npmjs.org/package/docxtemplater-image-module) [![Issues closed](http://issuestats.com/github/open-xml-templating/docxtemplater-image-module/badge/issue?style=flat)](http://issuestats.com/github/open-xml-templating/docxtemplater-image-module)
[![Download count](http://img.shields.io/npm/dm/docxtemplater-image-module.svg?style=flat)](https://www.npmjs.org/package/docxtemplater-image-module)
[![Current tag](http://img.shields.io/npm/v/docxtemplater-image-module.svg?style=flat)](https://www.npmjs.org/package/docxtemplater-image-module)
[![Issues closed](http://issuestats.com/github/open-xml-templating/docxtemplater-image-module/badge/issue?style=flat)](http://issuestats.com/github/open-xml-templating/docxtemplater-image-module)
# Installation: Installation:
=============
You will need docxtemplater v1: `npm install docxtemplater` You will need docxtemplater v1: `npm install docxtemplater`
install this module: `npm install docxtemplater-image-module` install this module: `npm install docxtemplater-image-module`
# Usage (v1) Usage (v1)
==========
Your docx should contain the text: `{%image}` Your docx should contain the text: `{%image}`
var ImageModule=require('docxtemplater-image-module') ```
var ImageModule=require('docxtemplater-image-module')
var opts = {}
opts.centered = false;
opts.getImage=function(tagValue, tagName) {
return fs.readFileSync(tagValue,'binary');
}
opts.getSize=function(img,tagValue, tagName) { var opts = {}
return [150,150]; opts.centered = false;
} opts.getImage=function(tagValue, tagName) {
return fs.readFileSync(tagValue,'binary');
}
var imageModule=new ImageModule(opts); opts.getSize=function(img,tagValue, tagName) {
return [150,150];
}
var docx=new DocxGen() var imageModule=new ImageModule(opts);
.attachModule(imageModule)
.load(content)
.setData({image:'examples/image.png'})
.render()
var buffer= docx var docx=new DocxGen()
.getZip() .attachModule(imageModule)
.generate({type:"nodebuffer"}) .load(content)
.setData({image:'examples/image.png'})
.render()
fs.writeFile("test.docx",buffer); var buffer= docx
.getZip()
.generate({type:"nodebuffer"})
fs.writeFile("test.docx",buffer);
```
To understand what `img`, `tagValue`, `tagName` mean, lets take an example : To understand what `img`, `tagValue`, `tagName` mean, lets take an example :
If your template is : If your template is :
{%myImage} ```
{%myImage}
and your data: and your data:
{ {
"myImage":'sampleImage.png' "myImage":'sampleImage.png'
} }
tagValue will be equal to "sampleImage.png", tagName will be equal to "myImage" and img will be what ever the getImage function returned tagValue will be equal to "sampleImage.png", tagName will be equal to "myImage" and img will be what ever the getImage function returned
```
One of the most useful cases of this is to set the images to be the size of that image. One of the most useful cases of this is to set the images to be the size of that image.
For this, you will need to install the [npm package 'image-size'](https://www.npmjs.com/package/image-size) For this, you will need to install the [npm package 'image-size'](https://www.npmjs.com/package/image-size) then, write:
then, write:
opts = {centered:false} ```
opts.getImage=function(tagValue) { opts = {centered:false}
return fs.readFileSync(tagValue,'binary'); opts.getImage=function(tagValue) {
} return fs.readFileSync(tagValue,'binary');
opts.getSize=function(img) { }
sizeOf=require('image-size'); opts.getSize=function(img) {
sizeObj=sizeOf(img); sizeOf=require('image-size');
console.log(sizeObj); sizeObj=sizeOf(img);
return [sizeObj.width,sizeObj.height]; console.log(sizeObj);
} return [sizeObj.width,sizeObj.height];
imageModule=new ImageModule(opts) }
imageModule=new ImageModule(opts)
```
# Centering images Centering images
================
You can center the images using opts.centered=true instead You can center the images using opts.centered=true instead
# Size and path based on placeholder Size and path based on placeholder
==================================
You can have customizable image loader using the template's placeholder name. You can have customizable image loader using the template's placeholder name.
opts.getImage = function (tagValue, tagName) { ```
if(tagName === 'logo') opts.getImage = function (tagValue, tagName) {
return fs.readFileSync(__dirname + '/logos/' + tagValue); if(tagName === 'logo')
return fs.readFileSync(__dirname + '/logos/' + tagValue);
return fs.readFileSync(__dirname + '/images/' + tagValue); return fs.readFileSync(__dirname + '/images/' + tagValue);
}; };
```
The same thing can be used to customize image size. The same thing can be used to customize image size.
opts.getSize = function (img, tagValue, tagName) { ```
if(tagName === 'logo') opts.getSize = function (img, tagValue, tagName) {
return [100, 100]; if(tagName === 'logo')
return [100, 100];
return [300, 300]; return [300, 300];
}; };
```
# Notice Notice
======
For the imagereplacer to work, the image tag: `{%image}` needs to be in its own `<w:p>`, so that means that you have to put a new line after and before the tag. For the imagereplacer to work, the image tag: `{%image}` needs to be in its own `<w:p>`, so that means that you have to put a new line after and before the tag.
# Testing Testing
=======
You can test that everything works fine using the command `mocha`. This will also create some docx files under the root directory that you can open to check if the generation was correct. You can test that everything works fine using the command `mocha`. This will also create some docx files under the root directory that you can open to check if the generation was correct.
# Building in the browser Building in the browser
=======================
You can build a release for the browser with the following commands You can build a release for the browser with the following commands
npm install -g gulp jasmine-node uglify-js browserify ```
npm install npm install -g gulp jasmine-node uglify-js browserify
gulp allCoffee npm install
mkdir build -p gulp allCoffee
browserify -r ./js/index.js -s ImageModule > build/imagemodule.js mkdir build -p
uglifyjs build/imagemodule.js > build/imagemodule.min.js # Optional browserify -r ./js/index.js -s ImageModule > build/imagemodule.js
uglifyjs build/imagemodule.js > build/imagemodule.min.js # Optional
```
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment