improved pdf viewer

This commit is contained in:
vabene1111
2020-06-10 15:40:24 +02:00
parent f44ebe0d05
commit ec8a879efa
201 changed files with 27517 additions and 415 deletions

View File

@@ -20,14 +20,6 @@
}
}
/* prevent weired character stuff escaping the pdf box */
.textLayer > span {
color: transparent;
position: absolute;
white-space: pre;
cursor: text;
transform-origin: 0% 0%;
}
</style>
{% endblock %}
@@ -225,11 +217,10 @@
{% else %}
<div class="col col-12" style="margin-top: 2vh">
<div class="loader" id="id_loader"></div>
<div id="viewerContainer" class="border">
<div id="viewer" class="pdfViewer"></div>
</div>
<iframe src="{% static 'pdfjs/viewer.html' %}?file={% url 'api_get_recipe_file' recipe.id %}"
width="100%"
height="600px"
style="border: none;"></iframe>
<div class="alert alert-warning" role="alert" id="id_warning_no_preview" style="display: none">
{% trans 'Cloud not show a file preview. Maybe its not a PDF ?' %}
@@ -261,50 +252,7 @@
</div>
</div>
<script src="{% static 'js/pdf.js' %}"></script>
<script src="{% static 'js/pdf_viewer.js' %}"></script>
<script type="text/javascript">
var url = "{% url 'api_get_recipe_file' recipe_id=12345 %}".replace(/12345/, {{ recipe.id }});
$('#viewerContainer').hide();
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState === 4 && this.status === 200) {
var base64Pdf = atob(this.responseText);
$('#id_loader').hide();
$('#viewerContainer').show();
var container = document.getElementById("viewerContainer");
var pdfViewer = new pdfjsViewer.PDFViewer({
container: container,
});
document.addEventListener("pagesinit", function () {
// We can use pdfViewer now, e.g. let's change default scale.
pdfViewer.currentScaleValue = "page-width";
});
var loadingTask = pdfjsLib.getDocument({
data: base64Pdf
});
loadingTask.promise.then(function (pdfDocument) {
// Document loaded, specifying document for the viewer and
// the (optional) linkService.
pdfViewer.setDocument(pdfDocument);
});
}
};
xhttp.open("GET", url, true);
xhttp.send();
</script>
{% endif %}
</div>
{% endif %}