What does visibleContentsAsDataURL exactly do? - safari

I am currently trying to build my first Safari extension. The SafariBrowserTab Class has a Method called "visibleContentsAsDataURL".
I don't exactly understand what it does and can't get it to work.
The docs just say: "Returns a data URL for an image of the visible contents of the tab."
What does it mean? That I get the URL of a screenshot of the tabs' content back? Can someone explain me?
Thanks!

I think it returns what is effectively a screenshot of the tab. The format is explained here
http://en.wikipedia.org/wiki/Data_URI_scheme
According to Apple's Safari reference documentation the return value is "a base-64 encoded PNG."

A data URL is a specal type of url basically consisting of a mimetype and data, in the case of png you'll get something along the lines of:
data:image/png;base64;lotsofstuff
You can then do whatever you want with it (it's just a string), or if you want to display the content:
img = new Image();
img.src = someTab.visibleContentsAsDataURL();
someElement.appendChild(img);
or
someCanvasContext.drawImage(img);
etc

Related

Access the image URL of a product

I am trying to get the image URL inside Edit Theme Files -> product.html
I already have some values like:
{{product.title}}, that gives me "Product name"
{{product.url}}, that gives me the URL
etc...
but no matter what i try, i can't get the URL.
The closest I got was using this: {{product.main_image.data}}
which gives me something like this:
https://cdn3.bigcommerce.com/s-8lxh1/images/stencil/%7B:size%7D/products/882/1700/RAM_VB_193_SW1__09586.1463668242.jpg?c=2
But that does not produce a image link.
Would appreciate any help or insights.
Thanks in advance!
The string that you're returning doesn't work because there's a "size" placeholder embedded in the URL. You can use Stencil's getImage Handlebars helper to specify the image dimensions and return a working URL:
{{getImage product.main_image.data "thumbnail"}}
The "thumbnail" string specifies an image size that exists in your theme settings. You can also specify a numeric size, like "200x200". Check out the docs here

new BitmapImage from Imagelist.images

Im trying to change the source of windows.media.imagesource
I store all my images in a windows.forms.imagelist
my code is: Source = New BitmapImage((MyImageList.Images(2)))
a system.uri is expected but I cannot find the conversion method
ok i dont know the rest of your code but i asume that for adding the images to the image list you first look for an uri, save the uri's in an Array and then call them from there.
Note:there is no method for getting an Uri from a Bitmap.

Why doesn't setImageInterlaceScheme() make a jpeg progressive?

I'm using php Gmagick to modify images. The following code works as expected except that the images are not progressive. Why? According to the GraphicsMagick docs it should. For reference, the input image is 666 x 1000.
$img = new Gmagick();
$img->setSize(900, 900)
->readImageBlob($image->getBytes())
->setImageInterlaceScheme(Gmagick::INTERLACE_PLANE)
->setImageResolution(96, 96)
->setImageFormat('jpeg')
->setCompressionQuality(70)
->resizeImage(900, 1351, Gmagick::FILTER_UNDEFINED, 1);
Note that
$img->getImageInterlaceScheme() === Gmagick::INTERLACE_PLANE
does return true after setting it.
Edit
I've tried both the INTERLACE_LINE and INTERLACE_PLANE constants. With neither seeming to have an effect on the output.
The original author created a bug on php.net (https://bugs.php.net/bug.php?id=66444), where the correct answer was eventually posted. You need to use the undocumented method:
->setInterlaceScheme(Gmagick::INTERLACE_LINE)
Instead of:
->setImageInterlaceScheme(Gmagick::INTERLACE_LINE)
This worked for me! For reference I am using PHP 5.4.20 with gmagick 1.1.7RC2 on top of GraphicsMagick 1.3.18.
The documentation you point to states:
Use Line to create an interlaced PNG or GIF or progressive JPEG image.
So, I think you should be setting the interlace to line.
->setImageInterlaceScheme(Gmagick::INTERLACE_LINE)
Note: I'm not sure if INTERLACE_LINE is an actual value. I assumed it was based on your code. Basically, try the line option.
Have you tried calling setImageInterlaceScheme before anything else? i cannot find the code, but maybe when you read the bits it already compose the image and then the interlacings takes no place.
$img
->setImageInterlaceScheme(Gmagick::INTERLACE_PLANE)
->readImageBlob($image->getBytes())
->setSize(900, 900)
->setImageResolution(96, 96)
->setImageFormat('jpeg')
->setCompressionQuality(70)
->resizeImage(900, 1351, Gmagick::FILTER_UNDEFINED, 1);
For sure the interlaceScheme has to be INTERLACE_PLANE, as you can read in the docs you already know http://www.graphicsmagick.org/GraphicsMagick.html#details-interlace
I've finally found the answer to this (using PHP IMagick) after struggling for weeks.
It turns out you have to set the image format to 'pjpeg' instead of just jpeg.
I have no idea why by by doing so my Images are correctly detect as progressive and render progressively in the browser.
I assume this will be the same for 'GMagick'
$im->setImageFormat('pjpeg')

TextControl Images/Watermarks

In version 18 of TextControl (http://www.textcontrol.com) there is supposed to be the ability to add background images/watermarks to the document, however I find that the behavior of the various overloads, etc is not working correctly and that the documentation is rather scarce on examples. Does any one have a working example of adding watermarks to a Word document through the ServerTextControl object?
This functionality didn't exist in previous versions, so I recognize it's still rather new, I just find it weird that doing something like
tx.Images.Add(draftImage, pageNumber, location, ImageInsertionMode.BelowTheText);
doesn't actually add the images to the document, but if I use another overload beforehand, it adds both?
I just need a loop along the lines of
foreach (TXTextControl.Page page in pages){
page.Select();
var location = tx.InputPosition.Location;
var pageNumber = page.Number;
tx.Images.Add(draftImage, pageNumber, location, ImageInsertionMode.BelowTheText);
}
where location is supposed to be the beginning of the page.
Any help would be appreciated, this should be simple!
Thank you
Finally got a response to this on their forum, it's not a complete solution, but it works for the most part. Figured I would follow up here, so that anyone who ends up on this page would get the help I wanted.
http://forums.textcontrol.com/showthread.php?325522-Watermarking-Background-Image-on-Saved-Documents-in-X8&p=41815#post41815

HTML File API: getting the text 'onprogress'

Using the HTML5 File API, I wonder if I can process the content of a file on the fly.
I know I can get the content of the file when onload is called:
function fileLoaded(e)
{
alert("content is "+e.target.result);
}
but can I get the current content when onprogress is called ?
Thanks.
Seems like yes, according to the spec. The onprogress event will fill the result property of your FileReader as more data is read in. However, as Matt pointed out, if you're only interested in a portion of the file in the first place, only read that section:
var blob = file.webkitSlice|mozSlice(startByte, stopByte, contentType);
reader.readAsBinaryString(blob);
I don't think so, but look at this example which shows you how to read slices of files.