From 8de0317498b0b3f67023cc082e3be331d16ada70 Mon Sep 17 00:00:00 2001 From: Ismail Sunni Date: Thu, 22 Feb 2024 18:02:21 +0700 Subject: [PATCH 1/4] Add cancel print. --- src/types.ts | 4 ++++ src/utils.ts | 6 +++++- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/src/types.ts b/src/types.ts index cb4ba89..999f34a 100644 --- a/src/types.ts +++ b/src/types.ts @@ -168,3 +168,7 @@ export interface MFPStatusResponse { status: string; waitingTime: number; } + +export interface MFPCancelResponse { + status: string; +} diff --git a/src/utils.ts b/src/utils.ts index 2a7448b..a892183 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,6 +1,6 @@ import WMTSTileGrid from 'ol/tilegrid/WMTS.js'; import {toSize} from 'ol/size.js'; -import type {MFPReportResponse, MFPSpec, MFPStatusResponse, MFPWmtsMatrix} from './types'; +import type {MFPCancelResponse, MFPReportResponse, MFPSpec, MFPStatusResponse, MFPWmtsMatrix} from './types'; import type {WMTS} from 'ol/source.js'; import type {Extent} from 'ol/extent'; import {Constants, CalculatedConstants} from './constants'; @@ -107,6 +107,10 @@ export async function getStatus(mfpBaseUrl: string, ref: string): Promise { + return await (await fetch(`${mfpBaseUrl}/cancel/${ref}`, {method: 'DELETE'})).json(); +} + export async function requestReport(mfpBaseUrl: string, spec: MFPSpec): Promise { const report = await fetch(`${mfpBaseUrl}/report.${spec.format}`, { method: 'POST', From e718a16c4592de482193e5c2b9718c3dfc4a8cc2 Mon Sep 17 00:00:00 2001 From: Ismail Sunni Date: Thu, 22 Feb 2024 18:03:34 +0700 Subject: [PATCH 2/4] Add cancel button to demo. --- demo/demo.html | 20 +++++++++---------- demo/demo.js | 54 +++++++++++++++++++++++++++++++++++++------------- 2 files changed, 50 insertions(+), 24 deletions(-) diff --git a/demo/demo.html b/demo/demo.html index 03074da..f4ecff6 100644 --- a/demo/demo.html +++ b/demo/demo.html @@ -1,10 +1,10 @@ - + - + Mapfishprint geoblocks demo - - + +

Print OL map as pdf with Mapfish Print

-
+
- - - + + + + - - + diff --git a/demo/demo.js b/demo/demo.js index d7f6a41..71f1732 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -1,6 +1,12 @@ import {Map, View} from 'ol'; -import {MFPEncoder, BaseCustomizer, requestReport, getDownloadUrl} from '@geoblocks/mapfishprint'; +import { + MFPEncoder, + BaseCustomizer, + requestReport, + getDownloadUrl, + cancelPrint, +} from '@geoblocks/mapfishprint'; import TileLayer from 'ol/layer/Tile.js'; import OSM from 'ol/source/OSM.js'; import {fromLonLat} from 'ol/proj.js'; @@ -20,6 +26,22 @@ const map = new Map({ }), }); +var report = null; + +document.querySelector('#cancel').addEventListener('click', async () => { + console.log('Cancel print'); + if (report) { + const cancelResult = await cancelPrint(MFP_URL, report.ref); + if (cancelResult.status === 200) { + console.log('Print is canceled'); + } else { + console.log('Failed to cancel print'); + } + } else { + console.log('No print in progress'); + } +}); + document.querySelector('#print').addEventListener('click', async () => { const specEl = document.querySelector('#spec'); const reportEl = document.querySelector('#report'); @@ -56,20 +78,24 @@ document.querySelector('#print').addEventListener('click', async () => { console.log('spec', spec); specEl.innerHTML = JSON.stringify(spec, null, ' '); - const report = await requestReport(MFP_URL, spec); + report = await requestReport(MFP_URL, spec); console.log('report', report); reportEl.innerHTML = JSON.stringify(report, null, ' '); - await getDownloadUrl(MFP_URL, report, 1000).then( - (url) => { - resultEl.innerHTML = url; - document.location = url; - return url; - }, - (error) => { - console.log('result', 'error', error); - resultEl.innerHTML = error; - return error; - }, - ); + await getDownloadUrl(MFP_URL, report, 1000) + .then( + (url) => { + resultEl.innerHTML = url; + document.location = url; + return url; + }, + (error) => { + console.log('result', 'error', error); + resultEl.innerHTML = error; + return error; + }, + ) + .then(() => { + report = null; + }); }); From 3d9a588e090d63bf0705ae336b82fe570a0c4c2e Mon Sep 17 00:00:00 2001 From: Ismail Sunni Date: Thu, 22 Feb 2024 20:33:18 +0700 Subject: [PATCH 3/4] Address PR review. --- demo/demo.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/demo/demo.js b/demo/demo.js index 71f1732..8261c1d 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -26,7 +26,7 @@ const map = new Map({ }), }); -var report = null; +let report = null; document.querySelector('#cancel').addEventListener('click', async () => { console.log('Cancel print'); @@ -95,7 +95,7 @@ document.querySelector('#print').addEventListener('click', async () => { return error; }, ) - .then(() => { + .finally(() => { report = null; }); }); From 5cafaebfa2524ce0a605981d211d4a0b5add11f8 Mon Sep 17 00:00:00 2001 From: Ismail Sunni Date: Thu, 22 Feb 2024 21:12:40 +0700 Subject: [PATCH 4/4] Use textarea not console.log --- demo/demo.js | 8 ++++---- src/types.ts | 2 +- src/utils.ts | 6 ++++-- 3 files changed, 9 insertions(+), 7 deletions(-) diff --git a/demo/demo.js b/demo/demo.js index 8261c1d..cb29899 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -29,16 +29,16 @@ const map = new Map({ let report = null; document.querySelector('#cancel').addEventListener('click', async () => { - console.log('Cancel print'); + const resultEl = document.querySelector('#result'); if (report) { const cancelResult = await cancelPrint(MFP_URL, report.ref); if (cancelResult.status === 200) { - console.log('Print is canceled'); + resultEl.innerHTML = 'Print is canceled'; } else { - console.log('Failed to cancel print'); + resultEl.innerHTML = 'Failed to cancel print'; } } else { - console.log('No print in progress'); + resultEl.innerHTML = 'No print in progress'; } }); diff --git a/src/types.ts b/src/types.ts index 999f34a..731f6ec 100644 --- a/src/types.ts +++ b/src/types.ts @@ -170,5 +170,5 @@ export interface MFPStatusResponse { } export interface MFPCancelResponse { - status: string; + status: number; } diff --git a/src/utils.ts b/src/utils.ts index a892183..0492937 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -104,11 +104,13 @@ export function getWmtsUrl(source: WMTS): string { } export async function getStatus(mfpBaseUrl: string, ref: string): Promise { - return await (await fetch(`${mfpBaseUrl}/status/${ref}.json`)).json(); + const response = await fetch(`${mfpBaseUrl}/status/${ref}.json`); + return await response.json(); } export async function cancelPrint(mfpBaseUrl: string, ref: string): Promise { - return await (await fetch(`${mfpBaseUrl}/cancel/${ref}`, {method: 'DELETE'})).json(); + const response = await fetch(`${mfpBaseUrl}/cancel/${ref}`, {method: 'DELETE'}); + return {status: response.status}; } export async function requestReport(mfpBaseUrl: string, spec: MFPSpec): Promise {