Difference between revisions of "Widget:PDF"

Revision as of 00:40, 23 July 2023

This widget allows you to embed PDF files on your wiki page.

Created by Wilhelm Bühler and adapted by Karsten Hoffmeyer.

Using this widget

For information on how to use this widget, see widget description page on MediaWikiWidgets.org.

Copy to your site

To use this widget on your site, install MediaWiki Widgets extension and copy the complete source code of this page to your wiki as page Widget:PDF.

@@ Line 9: / Line 9: @@
 == Copy to your site ==
 To use this widget on your site, install [https://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy the [{{fullurl:{{FULLPAGENAME}}|action=edit}} complete source code] of this page to your wiki as page '''{{FULLPAGENAME}}'''.
-</noinclude><includeonly><object class="pdf-widget" data="<!--{$url|validate:url|escape:html|regex_replace:"#^(?!(https?:)?//).*#i":''}-->" type="application/pdf" wmode="transparent" style="z-index: 999; height: 100%; min-height: <!--{$height|escape:'html'|default:680}-->px; width: 100%; max-width: <!--{$width|escape:'html'|default:960}-->px;"><param name="wmode" value="transparent">
+</noinclude>
-<p>Currently, your browser does not use a PDF plugin. You may however <a href="<!--{$url|validate:url|escape:html|regex_replace:"#^(?!(https?:)?//).*#i":''}-->">download the PDF file</a> instead.</p></object></includeonly>
+<includeonly>
+<script src="https://mozilla.github.io/pdf.js/build/pdf.js"></script>
+<div id="pdf"></div>
+<script>
+var pdfDoc = new PDFJS.Document("https://mywikis-wiki-media.s3.us-central-1.wasabisys.com/ayso/Zipbooks_Getting_Started.pdf");
+pdfDoc.getPage(1).then(function(page) {
+  var viewport = page.getViewport({scale: 0.8});
+  var canvas = document.getElementById("pdf");
+  canvas.width = viewport.width;
+  canvas.height = viewport.height;
+  var ctx = canvas.getContext("2d");
+  ctx.drawImage(page.getImage(), 0, 0, viewport.width, viewport.height);
+});
+</script>
+</includeonly>