gemma: client/src/components/Pdftool.vue comparison

comparison client/src/components/Pdftool.vue @ 2714:4dd38840d74b

client:pdf-gen:imporve some template elements * add property to define the border color of the elements * fix rounding of boxes to handle case that box is not rounded * check text for small version of date

author	Fadi Abbud <fadi.abbud@intevation.de>
date	Mon, 18 Mar 2019 17:52:04 +0100
parents	4d5f419a2318
children	4a5c0e7cb75b

comparison

equal deleted inserted replaced

-:b79f5c5404c2
+:4dd38840d74b
 let defaultFontSize = 11,
 defaultRounding = 2,
 defaultTextColor = "black",
 defaultBgColor = "white",
 defaultPadding = 3,
-defaultOffset = { x: 0, y: 0 };
+defaultOffset = { x: 0, y: 0 },
+defaultBorderColor = "white";
 this.templateData.elements.forEach(e => {
 switch (e.type) {
 case "text": {
 this.addText(
 e.position,
 e.offset || defaultOffset,
 e.width,
 e.height,
 // handling the case when the rectangle  not rounded (rounding = 0)
 e.rounding === 0 || e.rounding ? e.rounding : defaultRounding,
-e.color || defaultBgColor
+e.color || defaultBgColor,
+e.brcolor || defaultBorderColor
 );
 break;
 }
 case "textbox": {
 this.addTextBox(
 e.rounding === 0 || e.rounding ? e.rounding : defaultRounding,
 e.padding || defaultPadding,
 e.fontSize || defaultFontSize,
 e.color || defaultTextColor,
 e.background || defaultBgColor,
-e.text
+e.text,
+e.brcolor || defaultBorderColor
 );
 break;
 }
 case "image": {
 this.addImage(
 }
 case "bottleneck": {
 this.addBottleneckInfo(
 e.position,
 e.offset || defaultOffset,
-e.rounding || defaultRounding,
+e.rounding === 0 || e.rounding ? e.rounding : defaultRounding,
-e.color || defaultTextColor
+e.color || defaultTextColor,
+e.brcolor || defaultBorderColor
 );
 break;
 }
 case "legend": {
 this.addLegend(
 e.position,
 e.offset || defaultOffset,
-e.rounding || defaultRounding
+e.rounding === 0 || e.rounding ? e.rounding : defaultRounding,
+e.brcolor || defaultBorderColor
 );
 break;
 }
 case "scalebar": {
 this.addScaleBar(
 scaleNominator,
 e.position,
 e.offset || defaultOffset,
-e.rounding || defaultRounding
+e.rounding === 0 || e.rounding ? e.rounding : defaultRounding,
+e.brcolor || defaultBorderColor
 );
 break;
 }
 case "northarrow": {
 this.addNorthArrow(
 );
 this.openLayersMap.setSize(this.mapSize);
 this.openLayersMap.getView().fit(this.mapExtent, { size: this.mapSize });
 this.readyToGenerate = true;
 },
-addRoundedBox(x, y, w, h, color, rounding) {
+addRoundedBox(x, y, w, h, color, rounding, brcolor) {
 // draws a rounded background box at (x,y) width x height
 // using jsPDF units
-this.pdf.doc.setDrawColor(color);
+this.pdf.doc.setDrawColor(brcolor);
 this.pdf.doc.setFillColor(color);
 this.pdf.doc.roundedRect(x, y, w, h, rounding, rounding, "FD");
 },
 // add some text at specific coordinates and determine how many wrolds in single line
 addText(position, offset, width, fontSize, color, text) {
 y = this.pdf.height - offset.y - this.getTextHeight(textLines.length);
 }
 this.pdf.doc.text(textLines, x, y, { baseline: "hanging" });
 },
-addBox(position, offset, width, height, rounding, color) {
+addBox(position, offset, width, height, rounding, color, brcolor) {
 // x/y defaults to offset for topleft corner (normal x/y coordinates)
 let x = offset.x;
 let y = offset.y;
 // if position is on the right, x needs to be calculate with pdf width and
 }
 if (["bottomright", "bottomleft"].indexOf(position) !== -1) {
 y = this.pdf.height - offset.y - height;
 }
-this.addRoundedBox(x, y, width, height, color, rounding);
+this.addRoundedBox(x, y, width, height, color, rounding, brcolor);
 },
 // add some text at specific coordinates with a background box
 addTextBox(
 position,
 offset,
 rounding,
 padding,
 fontSize,
 color,
 background,
-text
+text,
+brcolor
 ) {
 this.pdf.doc.setFontSize(fontSize);
 text = this.replacePlaceholders(text);
 if (!width) {
 if (!height) {
 let textLines = this.pdf.doc.splitTextToSize(text, textWidth);
 height = this.getTextHeight(textLines.length) + 2 * padding;
 }
-this.addBox(position, offset, width, height, rounding, background);
+this.addBox(
+position,
+offset,
+width,
+height,
+rounding,
+background,
+brcolor
+);
 this.addText(
 position,
 { x: offset.x + padding, y: offset.y + padding },
 textWidth,
 fontSize,
 }
 }
 this.pdf.doc.addImage(image, x, y, width, height);
 },
-addScaleBar(scaleNominator, position, offset, rounding) {
+addScaleBar(scaleNominator, position, offset, rounding, brcolor) {
 // scaleNominator is the x in 1:x of the map scale
 // hardcode maximal width for now
 let maxWidth = 80; // in mm
 // to give the outer white box 4mm padding
 let scaleBarX = x + 4;
 let scaleBarY = y + 5; // 5 because above the scalebar will be the numbers
 // draw outer white box
-this.addRoundedBox(x, y, fullSize + 8, 10, "white", rounding);
+this.addRoundedBox(x, y, fullSize + 8, 10, "white", rounding, brcolor);
 // draw first part of scalebar
 this.pdf.doc.setDrawColor(0, 0, 0);
 this.pdf.doc.setFillColor(0, 0, 0);
 this.pdf.doc.rect(scaleBarX, scaleBarY, size, 1, "FD");
 this.pdf.doc.setFontSize(size * 3);
 this.pdf.doc.setTextColor(0, 0, 0);
 this.pdf.doc.setFontStyle("normal");
 this.pdf.doc.text(size < 3 ? x1 - 0.5 : x1 - 1.3, y3 + 1, "N");
 },
-addLegend(position, offset, rounding) {
+addLegend(position, offset, rounding, brcolor) {
 if (
 this.selectedBottleneck &&
 this.selectedSurvey &&
 this.getLayerByName(LAYERS.BOTTLENECKISOLINE).isVisible
 ) {
 }
 if (["bottomright", "bottomleft"].indexOf(position) !== -1) {
 y = this.pdf.height - offset.y - height;
 }
-this.addRoundedBox(x, y, width, height, "white", rounding);
+this.addRoundedBox(x, y, width, height, "white", rounding, brcolor);
 this.pdf.doc.addImage(
 legendImage,
 x + padding,
 y + padding,
 width - 2 * padding,
 height - 2 * padding
 );
 }
 },
-addBottleneckInfo(position, offset, rounding, color) {
+addBottleneckInfo(position, offset, rounding, color, brcolor) {
 if (
 this.selectedBottleneck &&
 this.selectedSurvey &&
 this.getLayerByName(LAYERS.BOTTLENECKISOLINE).isVisible
 ) {
 if (["bottomright", "bottomleft"].indexOf(position) !== -1) {
 y = this.pdf.height - offset.y - height;
 }
 // white background box
-this.addRoundedBox(x, y, width, height, "white", rounding);
+this.addRoundedBox(x, y, width, height, "white", rounding, brcolor);
 // bottleneck
 this.pdf.doc.setFontStyle("italic");
 this.pdf.doc.text(x + padding, y + padding, str1_1, textOptions);
 this.pdf.doc.setFontStyle("bold");
 }
 },
 replacePlaceholders(text) {
 if (text.includes("{date}")) {
 text = text.replace("{date}", new Date().toLocaleString(locale2));
+}
+//get only day,month and year from the Date object
+if (text.includes("{date-minor}")) {
+var date = new Date();
+var dt =
+(date.getDate() < 10 ? "0" : "") +
+date.getDate() +
+"." +
+(date.getMonth() + 1 < 10 ? "0" : "") +
+(date.getMonth() + 1) +
+"." +
+date.getFullYear();
+text = text.replace("{date-minor}", dt.toLocaleString(locale2));
 }
 if (text.includes("{user}")) {
 text = text.replace("{user}", this.user);
 }
 return text;

Mercurial > gemma

comparison client/src/components/Pdftool.vue @ 2714:4dd38840d74b