new parameters in print (orientation => landscape or portrait) and pr…

dist/helper.js

@@ -18,6 +18,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function print() {
     var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'document';
     var id = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'root';
+    var orientation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'p';
+    var saveOrOutPut = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'save';
+
+    console.log('output', saveOrOutPut);
 
     var element = document.querySelector('#' + id);
     if (!element) {
@@ -27,8 +31,12 @@ function print() {
     }
     (0, _html2canvas2.default)(element).then(function (canvas) {
         var imgData = canvas.toDataURL('image/png');
-        var pdf = new _jspdf2.default();
+        var pdf = new _jspdf2.default(orientation);
         pdf.addImage(imgData, 'PNG', 0, 0);
-        pdf.save(name + '.pdf');
+        if (saveOrOutPut === 'save') {
+            pdf.save(name + '.pdf');
+        } else {
+            pdf.output('dataurlnewwindow', name + '.pdf');
+        }
     });
 }

dist/page.js

@@ -11,14 +11,18 @@ var _react2 = _interopRequireDefault(_react);
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var Page = function Page(_ref) {
+  console.log(_ref);
   var children = _ref.children,
-      singleMode = _ref.singleMode,
-      id = _ref.id;
+    singleMode = _ref.singleMode,
+    id = _ref.id,
+    width = _ref.width || '210',
+    height = _ref.height || '297';
   return _react2.default.createElement(
     "div",
     {
       id: id, className: "bg-white shadow-1 center pa4",
-      style: { width: "210mm", height: singleMode ? "297mm" : "" } },
+      style: { width: `${width}mm`, height: singleMode ? `${height}mm` : "" }
+    },
     children
   );
 };

dist/preview.js

@@ -43,9 +43,11 @@ var Preview = function (_React$Component) {
     key: 'render',
     value: function render() {
       var _props = this.props,
-          html = _props.html,
-          id = _props.id,
-          children = _props.children;
+        html = _props.html,
+        id = _props.id,
+        children = _props.children,
+        width = _props.width,
+        height = _props.height;
 
       var htmlDoc = { __html: html };
       return _react2.default.createElement(
@@ -56,7 +58,7 @@ var Preview = function (_React$Component) {
           { style: { opacity: 0, position: 'absolute', top: 0 } },
           _react2.default.createElement(
             _page2.default,
-            { id: id },
+            { id: id, width: width, height: height },
             htmlDoc && _react2.default.createElement(Base, { html: htmlDoc }),
             children
           )

examples/index.js

@@ -1,16 +1,16 @@
 import React from 'react';
 import { render } from 'react-dom';
-import { Preview, print } from '../src';
+import { Preview, print } from '../';
 import template from './template.html';
 
 const App = () => (
     <div>
-        <Preview id={'html-template'} html={template}/>
-        <button onClick={()=>print('a', 'html-template')}> print</button>
-        <Preview id={'jsx-template'} >
+        <Preview id={'html-template'} html={template} width={'330'} height={'210'} />
+        <button onClick={() => print('a', 'html-template', 'l', 'output')}> print landscape</button>
+        <Preview id={'jsx-template'} width={'210'} height={'297'} >
             <p>adsf</p>
         </Preview>
-        <button onClick={()=>print('a', 'jsx-template')}> print</button>
+        <button onClick={() => print('a', 'jsx-template', 'p')}> print portrait</button>
     </div>
 );
 render(<App />, document.getElementById("root"));

webpack.config.js

@@ -3,11 +3,11 @@
 const path = require('path');
 const HtmlWebpackPlugin = require("html-webpack-plugin");
 const htmlWebpackPlugin = new HtmlWebpackPlugin({
-    template: path.join(__dirname, "examples/src/index.html"),
+    template: path.join(__dirname, "examples/index.html"),
     filename: "./index.html"
 });
 module.exports = {
-    entry: path.join(__dirname, "examples/src/index.js"),
+    entry: path.join(__dirname, "examples/index.js"),
     output: {
         path: path.join(__dirname, "examples/dist"),
         filename: "bundle.js"
@@ -26,10 +26,10 @@ module.exports = {
             {
                 test: /\.(html)$/,
                 use: {
-                  loader: 'html-loader',
-                  options: {
-                    attrs: [':data-src']
-                  }
+                    loader: 'html-loader',
+                    options: {
+                        attrs: [':data-src']
+                    }
                 }
             }
         ]