webp.js 3.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. /*!
  2. {
  3. "name": "Webp",
  4. "async": true,
  5. "property": "webp",
  6. "tags": ["image"],
  7. "builderAliases": ["img_webp"],
  8. "authors": ["Krister Kari", "@amandeep", "Rich Bradshaw", "Ryan Seddon", "Paul Irish"],
  9. "notes": [{
  10. "name": "Webp Info",
  11. "href": "https://developers.google.com/speed/webp/"
  12. }, {
  13. "name": "Chromium blog - Chrome 32 Beta: Animated WebP images and faster Chrome for Android touch input",
  14. "href": "https://blog.chromium.org/2013/11/chrome-32-beta-animated-webp-images-and.html"
  15. }, {
  16. "name": "Webp Lossless Spec",
  17. "href": "https://developers.google.com/speed/webp/docs/webp_lossless_bitstream_specification"
  18. }, {
  19. "name": "Article about WebP support",
  20. "href": "https://optimus.keycdn.com/support/webp-support/"
  21. }, {
  22. "name": "Chromium WebP announcement",
  23. "href": "https://blog.chromium.org/2011/11/lossless-and-transparency-encoding-in.html?m=1"
  24. }]
  25. }
  26. !*/
  27. /* DOC
  28. Tests for lossy, non-alpha webp support.
  29. Tests for all forms of webp support (lossless, lossy, alpha, and animated)..
  30. Modernizr.webp // Basic support (lossy)
  31. Modernizr.webp.lossless // Lossless
  32. Modernizr.webp.alpha // Alpha (both lossy and lossless)
  33. Modernizr.webp.animation // Animated WebP
  34. */
  35. define(['Modernizr', 'addTest'], function(Modernizr, addTest) {
  36. Modernizr.addAsyncTest(function() {
  37. var webpTests = [{
  38. 'uri': 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA=',
  39. 'name': 'webp'
  40. }, {
  41. 'uri': 'data:image/webp;base64,UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAABBxAR/Q9ERP8DAABWUDggGAAAADABAJ0BKgEAAQADADQlpAADcAD++/1QAA==',
  42. 'name': 'webp.alpha'
  43. }, {
  44. 'uri': 'data:image/webp;base64,UklGRlIAAABXRUJQVlA4WAoAAAASAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA',
  45. 'name': 'webp.animation'
  46. }, {
  47. 'uri': 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=',
  48. 'name': 'webp.lossless'
  49. }];
  50. var webp = webpTests.shift();
  51. function test(name, uri, cb) {
  52. var image = new Image();
  53. function addResult(event) {
  54. // if the event is from 'onload', check the see if the image's width is
  55. // 1 pixel (which indicates support). otherwise, it fails
  56. var result = event && event.type === 'load' ? image.width === 1 : false;
  57. var baseTest = name === 'webp';
  58. // if it is the base test, and the result is false, just set a literal false
  59. // rather than use the Boolean constructor
  60. addTest(name, (baseTest && result) ? new Boolean(result) : result);
  61. if (cb) {
  62. cb(event);
  63. }
  64. }
  65. image.onerror = addResult;
  66. image.onload = addResult;
  67. image.src = uri;
  68. }
  69. // test for webp support in general
  70. test(webp.name, webp.uri, function(e) {
  71. // if the webp test loaded, test everything else.
  72. if (e && e.type === 'load') {
  73. for (var i = 0; i < webpTests.length; i++) {
  74. test(webpTests[i].name, webpTests[i].uri);
  75. }
  76. }
  77. });
  78. });
  79. });