WIP convert post

content/post/2024_09_06_Convert_anything_to_PDF.md

@@ -0,0 +1,105 @@
++++
+title = 'Convert anything to PDF'
+date = 2024-09-06T09:22:43+02:00
+draft = false
+showonlyimage = true
+image = "img/posts/convert_to_pdf.png"
+writer = "Peter Makra"
+categories = [ "web", "files" ]
+weight = 1
+tags = [ "docker", "office", "pdf", "convert", "api", "node" ]
++++
+
+
+### Try it out
+<div style="background: #d6d5d4;padding: 10px;margin: 5px;box-shadow: 2px 2px 2px gray;border-radius: 3px;font-weight: bold"> 
+<form id="demo-form">
+    <ol>
+        <li>
+            Choose a file <input id="upload-file" type="file">
+        </li>
+        <li>
+            <span>Enter the result of the calculation with numbers before clicking convert.</span>
+            <br />
+            <span id="simple-captcha"></span>
+            <input style="padding: 0; min-height: 5px; width: 50px; line-height: 1" id="captcha-answer" type="text">
+        </li>
+        <li>
+            <span>Click convert -></span>
+            <input style="padding: 0" id="send-file" type="button" value="Convert" onclick="onSubmit()"/>
+        </li>
+        <li>
+            <span>Get your pdf</span>
+        </li>
+        <li>
+            <span>Be happy :)</span>
+        </li>
+    </ol>
+    <button class="g-recaptcha"
+        style="display: none"
+        data-sitekey="6LcZkD0qAAAAAHkQkStv2njGkKuk-aoTWDBK5frg" 
+        data-action='submit'></button>
+</form>
+</div>
+
+> Be aware that the deployed demo instance is with minimal resources. 
+If it does not work it may be maxxed out, or scaled to zero.
+In the second case after few seconds it should work again.
+In the first.. well stop ddosing pls.
+
+
+### tl;dr for the curious ones
+Resources:
+- <a href="https://github.com/mcraa/libre-to-pdf-node"  class="github" target="_blank">
+    <i class="fab fa-github" title="github"></i>
+    <span class="screen-reader-text">github logo</span>
+    mcraa/libre-to-pdf-node</a>
+- <a href="https://hub.docker.com/r/mcraa/libre-to-pdf-node"  class="github" target="_blank">
+    <i class="fab fa-docker" title="docker"></i>
+    <span class="screen-reader-text">docker logo</span>
+    docker pull mcraa/libre-to-pdf-node</a>
+- special thanks to [Libre office](https://www.libreoffice.org/) as most of the work is done by them.
+- as well as to the creator of the node<i class="fab fa-node-js" title="nodejs"></i> lib used [<i class="fab fa-npm" title="npm"></i> office-to-pdf](https://www.npmjs.com/package/office-to-pdf?activeTab=readme)
+
+#### So what is added here?
+
+Simple web server created with one endpoint making that CLI command happening.
+So you can use it with one click.
+
+![Deploy to Azure](https://aka.ms/deploytoazurebutton)
+
+Or one `docker run`.
+Or simply adding it to a kubernetes cluster.
+You choose your cup of tea.
+
+#### Background story
+
+Recently a client who handles documents with sensitive data on their web application
+wanted to have previews online of all the files uploaded.
+My colleague quickly realized converting to PDF is the way to go,
+but all solutions he quickly found were sending the file to an unknown thirdparty blackbox.
+Which was not acceptable of course.
+
+Luckily a very similar problem existed years ago (just check the commit date in the repo).
+Search on docker hub improved since then, while writing this I found a similar solution 4 years older.
+
+So we added a container to the clients cluster, the files never leave our solution, and all files can have preview now as the browser handles pdf easily.
+
+<script src="https://www.google.com/recaptcha/api.js"></script>
+<script>
+   function onSubmit() {
+        if ($('input#captcha-answer').val() == window.buzievagy) {
+            // todo call api download pdf
+            console.log('approved')
+        }
+    }
+    document.addEventListener("DOMContentLoaded", function() {
+        var numbers = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine"]
+        var operands = ["+", "-", "*"]
+        var left = Math.floor(Math.random()*10)
+        var right = Math.floor(Math.random()*10)
+        var op = operands[Math.floor(Math.random()*3)]
+        window.buzievagy = eval(`${left} ${op} ${right}`)
+        $('span#simple-captcha').text(`${numbers[left]} ${op} ${numbers[right]} =`)
+    });
+</script>