Is there a way to convert an HTML5 canvas to a some sort of an image format so that it can be uploaded to facebook users application album though the js api,
I'm currently successfully uploading an image link to an album with the following function:
FB.api('/me/photos', 'post', { message:'the message', url:imgURL});
Yes, there is way to convert HTML5 Canvas to an image. Following javascript function on the Canvas JS element will do this:
toDataURL('image/jpeg', 1.0);
You can have PNG also.
This function will generate a Base64 representation of the canvas image. I am not sure if you can directly give a Base64 string to the Facebook API.
If you can, then it will be great, otherwise you need to save it temporarily on the server and give that URL to the FB API.
Related
I have a webform with and want to open it on smartphone - than take pictures of some documents which need to be merged in one PDF, and on the end this file need to be uploaded to server.
My solution is to use Google Drive to upload PDF (scan) to GDrive and then somehow download this file from gdrive to server via some sort of widget (any links appreciate) installed on website.
Maybe someone have a better idea?
I know its late but my answer might help others. I also face the same challenge and implemented a custom solution based on Javascript and Since you are using web form so this solution will perfectly fits on your need.
You have to use JSPdf javascript library, JSPdf provide you pdf object in your browser and you can upload it download it and there are many other thing to play with.
First you have to initialize JSPdf object as per your requirement. I am creating PDF with page size width:500px and height 500px.
pdf = new jsPDF("l", "pt", [500,500]);
Simply when you will take picture from camera you will have each picture in form of base64, that base64 format you have to insert in JSPdf object
pdf.addImage(imgData, 'JPEG', 0, 0);
you can repeat the above code to add pictures from camera as much as you want, at the back-end these images are compiling and creating pdf document where each page have each images in sequence.
Once you are done, you can get PDF object in form of base64 object using below code that you can upload to any server.
pdf.output('datauristring')
above is only pdf part, you can find complete working example including camera part here Javascript Component to Scan Document
Steam images have url like this:
http://steamcommunity-a.akamaihd.net/economy/image/-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXQ9QVcJY8gulRNRULFV_eS1M7DQEh4IEtDt7ekOQYu1aOQcGgSutizwIPYw6-mYe-AzzhQ68Mj2rmRpd-g3gXm80s9Zm_2cZjVLFH7KrlnRw/330x192
In the API can find these string:
-9a81dlWLwJ2UUGcVs_nsVtzdOEdtWwKGZZLQHTxDZ7I56KU0Zwwo4NUX4oFJZEHLbXQ9QVcJY8gulRNRULFV_eS1M7DQEh4IEtDt7ekOQYu1aOQcGgSutizwIPYw6-mYe-AzzhQ68Mj2rmRpd-g3gXm80s9Zm_2cZjVLFH7KrlnRw
Is there a way to decrypt it?
I believe that's off topic.
That's probably the image hash not the image itself.
You should then make a call to download said image the same way a browser to.
From the steam API docs:
img_icon_url, img_logo_url - these are the filenames of various images for the game. To construct the URL to the image, use this format: http://media.steampowered.com/steamcommunity/public/images/apps/{appid}/{hash}.jpg . For example, the TF2 logo is returned as "07385eb55b5ba974aebbe74d3c99626bda7920b8", which maps to the URL: [1]
I'm evaluating Fine Uploader compared to various other options, specifically JQuery File Upload.
I generally prefer the Fine Uploader approach as it's more lightweight, compared to JQuery File Uploader which has dependencies on Bootstrap and JQuery UI.
However it's important to be able to resize images: e.g., a user may select a large file from their camera and this may be very large - uploading the full resolution photo may take a very long time. JQuery File Upload doe this.
Additionally we don't have much use for very high resolution files.
If possible (I'm aware some browsers may not support this), I'd like to be able to resize images client size.
Is this possible?
Fine Uploader does not currently have any native support for image manipulation. This is a feature in our backlog, but we have not had many users tell us they are interested in this. This is one of the reasons why such a feature has yet to be implemented natively. There is a case, #707 that marks the start of native image-editing support for Fine Uploader. It is tentatively scheduled for 4.0.
However, you can certainly make use of FileReader and Canvas to resize the image. You can then submit this resized image as a Blob to Fine Uploader via the addFiles API method. At that point, the file has been submitted and Fine Uploader is ready to upload the item.
Essentially, the steps you would follow to handle this specific scenario, before Fine Uploader natively supports image manipulation:
Provide your own file input element(s) or make use of Fine Uploader's file/folder drag and drop support to get a handle on some files selected by the user.
Use FileReader to read the contents of the image.
FileReader will provide you with a URL for the image, assign that to the src attribute of an img element.
Draw the img onto a canvas element. This is where the resizing occurs.
Grab the URL of the resized image from the canvas element (canvas.toDataURL(...)).
Convert the URL to a Blob.
Pass the Blob to the addFiles API method of Fine Uploader.
The intent is to take care of most if not all of this for integrators such as yourself in the future by adding native image manipulation support to Fine Uploader.
Hope this helps.
Google recently added high resolution support (720x720) for contacts' images via the gmail interface. Previously, it would to convert all images to 96x96. However, when I post an image using the Contacts API it still gets converted to 96x96. I currently use the picture url in the link ref http://schemas.google.com/contacts/2008/rel#photo. Is there a way to post higher resolution images or are we still stuck at 96x96 if we use the Contacts API? Is there another programmatic way to accomplish this?
Thanks!
I'm assuming that you are using the Google+ API to retrieve their profile and are looking at the profile image, as seen here using the API explorer:
https://developers.google.com/apis-explorer/#search/profile/m/plus/v1/plus.people.get?userId=107345380056943591322&_h=1&
In the response is an image URL:
"image": {
"url": "https://lh3.googleusercontent.com/-2N7UIsa-tLI/AAAAAAAAAAI/AAAAAAAAAK8/XJiZoMReZr0/photo.jpg?sz=50"
},
You can alter the sz parameter to indicate the width/height of the rendered image, for example:
https://lh3.googleusercontent.com/-2N7UIsa-tLI/AAAAAAAAAAI/AAAAAAAAAK8/XJiZoMReZr0/photo.jpg?sz=500
There are other url formats, it's not clear which url you are getting but if you paste an example, I'd be happy to help.
I am using the Python SDK to upload videos on dmcloud.net.
Now I want to give the user of my application the possibility to choose a thumbnail to the video he uploaded. How can I generate different thumbnails from an uploaded video on dmcloud.net.
Thanks.
Through the SDK, you can update the video thumbnail using the set_thumbnail method of the Media API. You have two options:
Specify a URL to a new thumbnail
Specify a timecode, which is a time offset within the video
For your end-users, provide a way to let them specify a URL or an offset (verify it's an offset that's appropriate for the video's duration). If you're using a custom player, you can probably let them choose an offset visually by pausing the player on their frame of choice and then extracting a time offset from your player for the dmcloud API call.
If you choose to set a thumbnail by timecode (offset), the SDK call would look like this:
cloudkey.media.set_thumbnail(id, timecode)
SDK Link: http://www.dmcloud.net/doc/api/python-sdk.html#media-object