FileAPI rotate and overlay cause issue
by RomainMazB
HTML
<!DOCTYPE html>
<!--
~~~ Демонстрация работы с изображениями ~~~
(NativeJS + FileAPI)
-->
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="user-scalable=no, width=400, initial-scale=1, maximum-scale=1" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="yes" />
<meta name="format-detection" content="email=no" />
<meta name="HandheldFriendly" content="true" />
<title>FileAPI :: Watermark :: example</title>
<script>
// Settings
var FileAPI = {
html5: !!1
, debug: !0 // debug mode
, staticPath: '../dist/'
};
</script>
<script src="https://mailru.github.io/FileAPI/dist/FileAPI.js"></script>
<script src="https://mailru.github.io/FileAPI/plugins/FileAPI.exif.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/json3/3.2.4/json3.min.js"></script>
<style>
body {
font-size: 15px;
font-family: "Helvetica Neue";
}
@keyframes color {
from { color: #000; }
to { color: #f60; }
}
@-moz-keyframes color {
from { color: #000; }
to { color: #f60; }
}
@-webkit-keyframes color {
from { color: #000; }
to { color: #f60; }
}
.anim {
-webkit-animation: color 1s infinite;
-moz-animation: color 1s infinite;
animation: color 1s infinite;
}
</style>
</head>
<body>
<div style="left: 0; right: 0; bottom: 0; position: fixed; box-shadow: 0 0 5px rgba(0,0,0,.65); background-color: #f3f3f3;">
<div style="padding: 5px 10px 10px">
<a href="../">← index</a> |
<a href="./demo.html">demo</a> -
<a href="./userpic.html">userpic</a> -
<a href="./thumbnails.html">thumbnails</a> -
<b>watermark</b> -
<a href="./webcam.html">webcam</a> -
<a href="./caman.html">caman.js</a>
</div>
</div>
<style>
h4 {
margin-bottom: 0;
}
.btn {
*zoom:...