1
0

canvas-wrapper.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. /*
  2. * Copyright 2014, Gregg Tavares.
  3. * All rights reserved.
  4. *
  5. * Redistribution and use in source and binary forms, with or without
  6. * modification, are permitted provided that the following conditions are
  7. * met:
  8. *
  9. * * Redistributions of source code must retain the above copyright
  10. * notice, this list of conditions and the following disclaimer.
  11. * * Redistributions in binary form must reproduce the above
  12. * copyright notice, this list of conditions and the following disclaimer
  13. * in the documentation and/or other materials provided with the
  14. * distribution.
  15. * * Neither the name of Gregg Tavares. nor the names of its
  16. * contributors may be used to endorse or promote products derived from
  17. * this software without specific prior written permission.
  18. *
  19. * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
  20. * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
  21. * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
  22. * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
  23. * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
  24. * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
  25. * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
  26. * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  27. * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  28. * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  29. * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  30. */
  31. /* global define */
  32. (function(root, factory) { // eslint-disable-line
  33. if ( typeof define === 'function' && define.amd ) {
  34. // AMD. Register as an anonymous module.
  35. define( [ './transform' ], factory );
  36. } else {
  37. // Browser globals
  38. const lib = factory();
  39. root.wrapCanvasRenderingContext2D = lib.wrap;
  40. }
  41. }( this, function () {
  42. 'use strict'; // eslint-disable-line
  43. function duplicate( src ) {
  44. const d = new window.DOMMatrix();
  45. d.a = src.a;
  46. d.b = src.b;
  47. d.c = src.c;
  48. d.d = src.d;
  49. d.e = src.e;
  50. d.f = src.f;
  51. return d;
  52. }
  53. function patchCurrentTransform( ctx ) {
  54. if ( ctx.currentTransform ) {
  55. return ctx;
  56. }
  57. const stack = [];
  58. ctx.scale = function ( scale ) {
  59. return function ( x, y ) {
  60. ctx.currentTransform.scaleSelf( x, y );
  61. scale( x, y );
  62. };
  63. }( ctx.scale.bind( ctx ) );
  64. ctx.rotate = function ( rotate ) {
  65. return function ( r ) {
  66. ctx.currentTransform.rotateSelf( r * 180 / Math.PI );
  67. rotate( r );
  68. };
  69. }( ctx.rotate.bind( ctx ) );
  70. ctx.translate = function ( translate ) {
  71. return function ( x, y ) {
  72. ctx.currentTransform.translateSelf( x, y );
  73. translate( x, y );
  74. };
  75. }( ctx.translate.bind( ctx ) );
  76. ctx.save = function ( save ) {
  77. return function () {
  78. stack.push( duplicate( ctx.currentTransform ) );
  79. save();
  80. };
  81. }( ctx.save.bind( ctx ) );
  82. ctx.restore = function ( restore ) {
  83. return function () {
  84. if ( stack.length ) {
  85. ctx.currentTransform = stack.pop();
  86. } else {
  87. throw new Error( '"transform stack empty!' );
  88. }
  89. restore();
  90. };
  91. }( ctx.restore.bind( ctx ) );
  92. ctx.transform = function ( transform ) {
  93. return function ( m11, m12, m21, m22, dx, dy ) {
  94. const m = new DOMMatrix();
  95. m.a = m11;
  96. m.b = m12;
  97. m.c = m21;
  98. m.d = m22;
  99. m.e = dx;
  100. m.f = dy;
  101. ctx.currentTransform.multiplySelf( m );
  102. transform( m11, m12, m21, m22, dx, dy );
  103. };
  104. }( ctx.transform.bind( ctx ) );
  105. ctx.setTransform = function ( setTransform ) {
  106. return function ( m11, m12, m21, m22, dx, dy ) {
  107. const d = ctx.currentTransform;
  108. d.a = m11;
  109. d.b = m12;
  110. d.c = m21;
  111. d.d = m22;
  112. d.e = dx;
  113. d.f = dy;
  114. setTransform( m11, m12, m21, m22, dx, dy );
  115. };
  116. }( ctx.setTransform.bind( ctx ) );
  117. ctx.currentTransform = new DOMMatrix();
  118. ctx.validateTransformStack = function () {
  119. if ( stack.length !== 0 ) {
  120. throw new Error( 'transform stack not 0' );
  121. }
  122. };
  123. return ctx;
  124. }
  125. function wrap( ctx ) {
  126. //patchDOMMatrix();
  127. return patchCurrentTransform( ctx );
  128. }
  129. return {
  130. wrap: wrap,
  131. };
  132. } ) );