| Index: chrome/common/extensions/docs/examples/extensions/imageinfo/info.js
|
| diff --git a/chrome/common/extensions/docs/examples/extensions/imageinfo/info.js b/chrome/common/extensions/docs/examples/extensions/imageinfo/info.js
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..40f3b27e7ab1cdf979ff6a0418e49c75d06a9f29
|
| --- /dev/null
|
| +++ b/chrome/common/extensions/docs/examples/extensions/imageinfo/info.js
|
| @@ -0,0 +1,145 @@
|
| +// Copyright (c) 2011 The Chromium Authors. All rights reserved.
|
| +// Use of this source code is governed by a BSD-style license that can be
|
| +// found in the LICENSE file.
|
| +
|
| +
|
| +/**
|
| + * Quick template rendering function. For each cell passed to it, check
|
| + * to see if the cell's text content is a key in the supplied data array.
|
| + * If yes, replace the cell's contents with the corresponding value and
|
| + * unhide the cell. If no, then remove the cell's parent (tr) from the
|
| + * DOM.
|
| + */
|
| +function renderCells(cells, data) {
|
| + for (var i = 0; i < cells.length; i++) {
|
| + var cell = cells[i];
|
| + var key = cell.innerText;
|
| + if (data[key]) {
|
| + cell.innerText = data[key];
|
| + cell.parentElement.className = "rendered";
|
| + } else {
|
| + cell.parentElement.parentElement.removeChild(cell.parentElement);
|
| + }
|
| + }
|
| +};
|
| +
|
| +/**
|
| + * Returns true if the supplies object has no properties.
|
| + */
|
| +function isEmpty(obj) {
|
| + for (var key in obj) {
|
| + if (obj.hasOwnProperty(key)) {
|
| + return false;
|
| + }
|
| + }
|
| + return true;
|
| +};
|
| +
|
| +/**
|
| + * Resizes the window to the current dimensions of this page's body.
|
| + */
|
| +function resizeWindow() {
|
| + window.setTimeout(function() {
|
| + chrome.tabs.getCurrent(function (tab) {
|
| + var newHeight = Math.min(document.body.offsetHeight + 140, 700);
|
| + chrome.windows.update(tab.windowId, {
|
| + height: newHeight,
|
| + width: 520
|
| + });
|
| + });
|
| + }, 150);
|
| +};
|
| +
|
| +/**
|
| + * Called directly by the background page with information about the
|
| + * image. Outputs image data to the DOM.
|
| + */
|
| +function renderImageInfo(imageinfo) {
|
| + console.log('imageinfo', imageinfo);
|
| +
|
| + var divloader = document.querySelector('#loader');
|
| + var divoutput = document.querySelector('#output');
|
| + divloader.style.display = "none";
|
| + divoutput.style.display = "block";
|
| +
|
| + var divinfo = document.querySelector('#info');
|
| + var divexif = document.querySelector('#exif');
|
| +
|
| + // Render general image data.
|
| + var datacells = divinfo.querySelectorAll('td');
|
| + renderCells(datacells, imageinfo);
|
| +
|
| + // If EXIF data exists, unhide the EXIF table and render.
|
| + if (imageinfo['exif'] && !isEmpty(imageinfo['exif'])) {
|
| + divexif.style.display = 'block';
|
| + var exifcells = divexif.querySelectorAll('td');
|
| + renderCells(exifcells, imageinfo['exif']);
|
| + }
|
| +};
|
| +
|
| +/**
|
| + * Renders the URL for the image, trimming if the length is too long.
|
| + */
|
| +function renderUrl(url) {
|
| + var divurl = document.querySelector('#url');
|
| + var urltext = (url.length < 45) ? url : url.substr(0, 42) + '...';
|
| + var anchor = document.createElement('a');
|
| + anchor.href = url;
|
| + anchor.innerText = urltext;
|
| + divurl.appendChild(anchor);
|
| +};
|
| +
|
| +/**
|
| + * Renders a thumbnail view of the image.
|
| + */
|
| +function renderThumbnail(url) {
|
| + var canvas = document.querySelector('#thumbnail');
|
| + var context = canvas.getContext('2d');
|
| +
|
| + canvas.width = 100;
|
| + canvas.height = 100;
|
| +
|
| + var image = new Image();
|
| + image.addEventListener('load', function() {
|
| + var src_w = image.width;
|
| + var src_h = image.height;
|
| + var new_w = canvas.width;
|
| + var new_h = canvas.height;
|
| + var ratio = src_w / src_h;
|
| + if (src_w > src_h) {
|
| + new_h /= ratio;
|
| + } else {
|
| + new_w *= ratio;
|
| + }
|
| + canvas.width = new_w;
|
| + canvas.height = new_h;
|
| + context.drawImage(image, 0, 0, src_w, src_h, 0, 0, new_w, new_h);
|
| + });
|
| + image.src = url;
|
| +};
|
| +
|
| +/**
|
| + * Returns a function which will handle displaying information about the
|
| + * image once the ImageInfo class has finished loading.
|
| + */
|
| +function getImageInfoHandler(url) {
|
| + return function() {
|
| + renderUrl(url);
|
| + renderThumbnail(url);
|
| + var imageinfo = ImageInfo.getAllFields(url);
|
| + renderImageInfo(imageinfo);
|
| + resizeWindow();
|
| + };
|
| +};
|
| +
|
| +/**
|
| + * Load the image in question and display it, along with its metadata.
|
| + */
|
| +document.addEventListener("DOMContentLoaded", function () {
|
| + // The URL of the image to load is passed on the URL fragment.
|
| + var imageUrl = window.location.hash.substring(1);
|
| + if (imageUrl) {
|
| + // Use the ImageInfo library to load the image and parse it.
|
| + ImageInfo.loadInfo(imageUrl, getImageInfoHandler(imageUrl));
|
| + }
|
| +});
|
|
|