Template:ImageEditor
From OpenWetWare
<html> <style type="text/css">@import "/css/ImageEditor/ImageEditor.css";</style> <script type="text/javascript" src="/js/ImageEditor/PageInfo.js"></script> <script type="text/javascript" src="/js/ImageEditor/ImageEditor.js"></script> <script type="text/javascript"> //<![CDATA[
if (window.opener){
window.moveTo(0, 0);
window.resizeTo(screen.width, screen.height - 28);
window.focus();
}
window.onload = function(){
ImageEditor.init('</html>{{{image}}}<html>');
};
//]]> </script> <div id="image-editor">
<div class="toolbar">
<button onclick="ImageEditor.viewOriginal()">View Original</button>
<button onclick="ImageEditor.viewActive()">View Active</button>
<button onclick="ImageEditor.save()">Save As Active</button>
<span class="spacer"> || </span>
<button onclick="ImageEditor.undo()">Undo/Redo</button>
<span class="spacer"> || </span>
w:<input id="txt-width" type="text" size="3" maxlength="4" />
h:<input id="txt-height" type="text" size="3" maxlength="4" />
<input id="chk-constrain" type="checkbox" checked="checked" />Constrain
<button onclick="ImageEditor.resize();">Resize</button>
<span class="spacer"> || </span>
<button onclick="ImageEditor.rotate(90)">90°CCW</button>
<button onclick="ImageEditor.rotate(270)">90°CW</button>
<span class="spacer"> || </span>
<button onclick="ImageEditor.crop()">Crop</button>
<span id="crop-size"></span>
</div>
<div class="toolbar">
<button onclick="ImageEditor.grayscale()">Gray Scale</button>
<button onclick="ImageEditor.sepia()">Sepia</button>
<button onclick="ImageEditor.pencil()">Pencil</button>
<button onclick="ImageEditor.emboss()">Emboss</button>
<button onclick="ImageEditor.sblur()">Blur</button>
<button onclick="ImageEditor.smooth()">Smooth</button>
<button onclick="ImageEditor.invert()">Invert</button>
<button onclick="ImageEditor.brighten()">Brighten</button>
<button onclick="ImageEditor.darken()">Darken</button>
</div>
<div id="image"></div>
</div> </html>
