Last active
August 29, 2016 09:01
-
-
Save gr2m/5463605 to your computer and use it in GitHub Desktop.
Imagine you could convert all kind of things to all kind of different things, e.g. taking a screenshot of a dom element or converting another website to a screenshot. Forks & comments much appreciated! #nobackend #dreamcode
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// convert a dom element to a PDF and download it | |
convert( $('.invoice') ).to( 'invoice.pdf' ).download() | |
// alternatively | |
download( convert( $('.invoice') ).to( 'invoice.pdf' ) ) | |
// convert another website to a png and show it on the page | |
convert( 'http://exam.pl/page' ).toImage().then( $('.screenshots').append ) | |
// attach a file to an email | |
sendEmail({ | |
subject: "Hello, World!", | |
text: "This mail has been sent from the frontend", | |
to: "joe@exam.pl", | |
attachments: [ | |
convert( 'http://exam.pl/page' ).to("screenshot.png") | |
] | |
}) |
I like that - looks really clean. So download() and save()
How does it handle different MIME types, or is that not applicable in a node.js scenario?
not sure about a node.js scenario, I did it all with a browser environment in mind, and there I expect the right mime types to be sent as headers
I would suggest https://www.filepicker.com for file format conversions and anything to do with pictures and files. All the above functional abstractions are covered using REST API
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks for the input @stuartlangridge!
My expectiations would be that the moment you call
later = convert( $('.invoice') )
it makes an internal copy / snapshot of the DOM element. So if you change the dom afterwards, but before callinglater.download()
, the DOM change should not affect the output.To answer your question:
convert( $('.invoice') ).to( 'invoice.pdf' )
returns a promise. I've learned that this is a Monad ( https://en.wikipedia.org/wiki/Monad_(functional_programming) ), what ever that is ;-)The idea is, that you can do several things with the promise, representing the conversion task. You can download it, but you could also pass it to other functions, for example as attachment to an email:
or imagine there would be a method to build archives
Does that make sense? I personally find it a very beautiful API, that hides away the asynchronous nature of the code in a very elegant way. But I haven't discussed these things with many other developers yet, so I'm very much looking forward to your thoughts on it