Develop Reference

PhotoeditorSDK - how to implement export function

I'm leaving my moving from a flash based image editor for our custom CMS to the last minute I know, but PhotoeditorSDK seems to be the thing we need. However my Javascript programming is not up to much so I'm struggling with how to deal with the resultant image I want to export.
I can upload and pass the file to the editor no problem.
I just want to post the resulting processed image to my file handling (which is CFML Lucee) by passing it a file or url or form field - doesnt matter which really.
But the documentation on the SDK only appears to be limited to this (in the export documentation)
editor.on(UIEvent.EXPORT, async (image) => {
// todo: handle exported image here
So I'm stuck.
What I would like to happen is to have the resulting image (post editing) sent to my script, where I can do what I need to to on solid ground.
Any suggestions or areas to explore greatfully received

A lot of these editors export DIRECTLY from the browser using SVG or other techniques, so chances are that is what they are doing.
to export or save image simply just redirect to the url of the download which will download the file without navigating the page. you can add any params you want to the get request including the base64 of image
document.location='./imageout.cfm?content='+image; (or whatever url generates the exported doc and myimageref is the variable with a reference or path of what to export.
Any docs url we can look at?
otherwise you can just create a form object in js and submit the form with image as a field with POST.

Cordova - Saving/ Downloading a backup JSON file that is dynamically generated

I am building an HTML5 phonegap application. This app exports data so that the user can backup and restore any time. I'm doing this exporting with the following javascript code:
var dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(this.data, null, "\t"));
var dlAnchorElem = document.createElement('a');
dlAnchorElem.setAttribute("href", dataStr);
dlAnchorElem.setAttribute("download", "data.json");
document.body.appendChild(dlAnchorElem);
dlAnchorElem.click();
This generates an anchor tag with an encoded file and clicks so it downloads. Works great on browser, but does nothing in a compiled Cordova application.
After doing some research, I found that the default solution would be to use a download plugin for Cordova, specifically this one: https://github.com/apache/cordova-plugin-file-transfer
I read the documentation, but it does not seem to take an encoded file as parameter, but an encoded URL for download. Also, it takes the save path on the phone, which I prefer would just default to the download folder.
My question is: What is the best way to achieve this, considering I'm dynamically generating the JSON backup file. Is there perhaps an AndroidManifest directive that allows for file downloads?

After some research and trying many different hacks, I came to the conclusion that it's currently not allowed natively with cordova or with the available plugins. My solution was to, instead of writing to the filesystem, use the web share api to let the user export the way he finds best (including file, if he chooses dropbox, onedrive or google drive).

NodeJS/ReactJS: Create downloadable file with string for mobile browser

I want to create a vCard in the frontend and to make it downloadable (by clicking a button) in a ReactJs Project. I use a NodeJS module called vcards-js that creates a string with the content of the desired vCard (v3.0). The thing I am struggling with is to make it downloadable (as .vcf file). I have tried to achieve this with the modules react-file-download and file-saver but none of them worked properly. Last one worked fine on desktop, but did not manage to provide a download from mobile browsers. Chrome mobile opened a new tab and loaded forever, Safari mobile just opened the string in a new tap, but did not download it as a .vcf file.
Any clues or experiences? Do I need to create the vCard Server-side and provide a download link? Seems too circuitous to me.
If it helps, this is my file-saver approach:
var FileSaver = require('file-saver');
var blob = new Blob([card.getFormattedString()], {type: "text/x-vCard;charset=iso-8859-1"});
FileSaver.saveAs(blob, 'card.vcf');

I'm looking over the docs on vcardjs
https://github.com/enesser/vCards-js
you have to have a route on your backend on node to handle the process
It looks pretty intuitive
//save to file
vCard.saveToFile('./eric-nesser.vcf');

I was able to get this to work on vue.js by generating a vcf blob using the following code
var vcfBlob = new Blob(vcfBytes.split('\n').map(function(x) { return x + '\n' }));
and then passing that blob to a file saver
saveAs(vcfBlob, "hello world.vcf")

You might want to try generating it on the back-end, using NodeJS / TS package:
npm/ez-vcard; GitHub/Maxim-Mazurok/ez-vcard
Also, see readme and example for usage.

upload image from local computer and saving them to a folder with redactor in meteorjs

I am using redactor plugin with meteorjs, to format the texts and add images, videos and links.Redactor supports uploading images as a web link, but here I wanted to add a button to upload images from local machine. For this I have added the button to the redactor. It is showing the browse image selection and is working.
$('.editor').redactor({
imageUpload:"/upload",
imageUploadCallback: function(image, json)
{
console.log(image);
console.log(json);
},
imageUploadErrorCallback: function(json)
{
console.log(json.error);
}
});
When I print console.log("#redactor_file").val()); it gives the name of the file. But, when I do console.log(console.log(html);) its gives <p><img src="undefined"></p>. Can I get the link or the url of the image here. If yes then how?
HTTP.methods({
'upload': function(data) {
console.log(data)
return JSON.stringify( {'data':"data"})
}
});
When I do console.log(data) using the above code it shows me Image in String format. Now I want to store the Image using GridFS. Or is there any better way to store Image in MongoDB. If yes then tell me or guide me to store image using GridFS ?

While Redactor provides a client-side method for uploading files, it does not provide a server-side method for receipt of uploaded files. Also, stock Meteor doesn't provide such a method either.
So you have a few choices. First is through using a router such as Iron Router, which you could create a server-side /uploads route, and Iron Router gives you access to the request, response objects. Which might work, but because this is no longer over DDP, you don't have access to Meteor.userId, etc. See How to respond server-side to routes using Meteor and Iron-Router?
A more Meteor-like way of doing the file upload is Meteor File or CollectionFS though I'm not sure how simply these would integrate with Redactor. You could definitely get them to work together, just off the top of my head I don't know how easy it would be.

Sending google visualization chart to email

Can we send Google Visualization chart to an email client?
I tried to copy paste the javascript code while sending the email, but its been removed on the fly by gmail.
Thanks and Regards.

Disclaimer: I'm Image-Charts founder.
6 years later! Google Image-Charts is deprecated since 2012, and as an indiehacker, I don't want to rewrite from scratch an image generation backend each time I started a new SaaS to just be able to send charts in email...
That's why I've built Image-charts 👍 and added gif animation on top of it 🚀(chart animations in emails are awesome!!), no more server-side chart rendering pain, no scaling issues, it's blazing fast, 1 URL = 1 image chart.
https://image-charts.com/chart
?cht=bvg
&chd=t:10,15,25,30,40,80
&chs=700x300
&chxt=x,y
&chxl=0:|March '18|April '18|May '18|June '18|July '18|August '18|
&chdl=Visitors (in thousands)
&chf=b0,lg,90,05B142,1,0CE858,0.2
&chxs=1N**K
&chtt=Visitors report
&chma=0,0,10,10
&chl=||||+33% !|x2 !

I ran into this problem as well. In order to send a chart in email, you need to render it as an image because email clients strip Javascript.
If you're using Google Charts, you'll have to run the Javascript and then export it using getImageURI. To automate this, you need a headless renderer like puppeteer.
The solution to the problem is open source. I wrapped chart rendering in a library and web server: https://github.com/typpo/quickchart. This web service handles the rendering details, all you do is call the API with your data.
For example, define your chart in the query parameters:
https://quickchart.io/chart?width=500&height=300&c={type:'bar',data:{labels:['January','February','March','April','May'],datasets:[{label:'Dogs',data:[50,60,70,180,190]},{label:'Cats',data:[100,200,300,400,500]}]}}
The above URL renders this image:
Hope this helps!

Google charts could be published in 2 ways:
as an Image. Edit Chart-> Publish Chart-> Format : image. An image link is generated. This image link could be either used in any html page or could be embedded in any email.
as an Interactive Chart. Edit Chart-> Publish Chart-> Format : Interactive Chart. In this case javascript code has to be inserted. This could only be published in html pages. This could not be attached in email body as most email servers/clients do not process javascript code (AFAIK).

3.5 years later... :)
My team at Ramen recently spun out some internal functionality into a standalone product that does just this: https://ChartURL.com
You can generate charts on the fly using an "Encrypted URL" scheme, or you can send us huge amounts of data and return a Short URL that'll resolve to an image.
It was built on top of C3js.org so there's a ton of flexibility in what you can generate.
These URLs can be used in web apps & mobile apps, but the original intent was email charts so I hope this helps!

There is very little JS support in email clients. so you will have to use an image chart. But you could wrap the chart in a link to the svg version.

Doesn't Google Charts have an API where you can just build a URL and it returns an image - no Javascript needed? It certainly used to. If you can use that, then:
a) Just put the URL in the email and let the users email client get it
b) Fetch the image with CURL and attach to the email.