Sha256: ef642438dc076f5a47e538d3024a650019d674df97e45ef50c530c23836b8550

Contents?: true

Size: 1.1 KB

Versions: 1

Compression:

Stored size: 1.1 KB

Contents

<!doctype html>
<html>
  <head>
      <title>demo</title>
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
      <script type="text/javascript" src="/shutterbug/shutterbug.js"></script>
      <link rel="stylesheet" type="text/css" href="main.css">
  </head>

  <body>
    <div>
      <canvas id="src" width="350" height="350"></canvas>
    </div>
    <button class="shutterbug" data-dst="#dst">Snapshot</button>
    <div id="dst"></div>
  </body>
  <script type="text/javascript">
    $(document).ready(function(e) {
      var img = new Image();
      img.onload = function () {
        var ctx = $("canvas")[0].getContext("2d");
        ctx.fillStyle = "green";
        ctx.fillRect(0, 0, 350, 350);
        ctx.fillStyle = "orange";
        ctx.fillRect(10, 10, 330, 330);
        ctx.drawImage(img, 20, 20, 310, 310);
      };
      img.src = "The_Scream.jpg";

      var bug = new Shutterbug("#src", "#dst", null, null, null, {format: "jpeg", quality: 0.75});
      $("button.shutterbug").click(function(e) {
        bug.getDomSnapshot();
      });
    });
  </script>
</html>

Version data entries

1 entries across 1 versions & 1 rubygems

Version Path
shutterbug-0.4.3 demo/canvas_example.html