Last active
October 11, 2015 20:48
-
-
Save gkc/3917922 to your computer and use it in GitHub Desktop.
FatFractal JS server-side example: Binary object management, http requests and image transformations. (We use the excellent ImgScalr library - see http://www.thebuzzmedia.com/software/imgscalr-java-image-scaling-library/ for more info on the ImgScalr API)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| exports.testImages = function() { | |
| var io = require ('io'); // CommonJS io module | |
| var bin = require ('binary'); // CommonJS binary module | |
| var hc = require ('ringo/httpclient'); // RingoJS httpclient module - http://ringojs.org/api/v0.8/ringo/httpclient/ | |
| var Scalr = Packages.org.imgscalr.Scalr; // ImgScalr library - http://www.thebuzzmedia.com/software/imgscalr-java-image-scaling-library/ | |
| var ImageIO = Packages.javax.imageio.ImageIO; // Java ImageIO package | |
| // HTTP GET Gary's Twitter pic | |
| var picData = hc.get("https://pbs.twimg.com/profile_images/1760363547/image.jpg").contentBytes; | |
| print ("Pic response is: ", picData); | |
| // Convert the raw binary data into an ImageIO BufferedImage which is what the Java2D stuff is based around | |
| var bais = new java.io.ByteArrayInputStream(picData); | |
| var img = ImageIO.read(bais); | |
| var croppedBytes, rotatedBytes, shrunkBytes; | |
| // | |
| // Let's do a few transformations - crop the image, rotate it, resize it | |
| // | |
| // Crop the image | |
| var cropped = Scalr.crop(img, 300, 300); | |
| // Create a byte array output stream and use java ImageIO to write the cropped image to it | |
| var baos = new java.io.ByteArrayOutputStream(); | |
| ImageIO.write (cropped, 'JPG', baos); | |
| // Then get the byte array from the byte array output stream | |
| croppedBytes = new bin.ByteArray(baos.toByteArray()); | |
| // and rotate it | |
| var rotated = Scalr.rotate(img, Scalr.Rotation.FLIP_VERT); | |
| baos = new java.io.ByteArrayOutputStream(); | |
| ImageIO.write(rotated, 'PNG', baos); | |
| rotatedBytes = new bin.ByteArray(baos.toByteArray()); | |
| // and resize it | |
| var shrunk = Scalr.resize(img, 100); | |
| baos = new java.io.ByteArrayOutputStream(); | |
| ImageIO.write(shrunk, 'PNG', baos); | |
| shrunkBytes = new bin.ByteArray(baos.toByteArray()); | |
| // | |
| // Delete existing test object | |
| // | |
| try { | |
| ff.deleteObjAtUri("/JSBlobTests/GaryPic"); | |
| } catch (a) {} | |
| // | |
| // Create new test object | |
| // | |
| var obj = ff.createObjAtUri({guid:'GaryPic', createdBy:'system', clazz:'JSBlobTests'}, "/JSBlobTests"); | |
| // | |
| // Add the byte representations of our images as sub-resources of our test object | |
| // | |
| ff.saveBlob(obj, 'origPic', picData, 'image/jpeg'); | |
| ff.saveBlob(obj, 'croppedPic', croppedBytes, 'image/jpeg'); | |
| ff.saveBlob(obj, 'rotatedPic', rotatedBytes, 'image/jpeg'); | |
| ff.saveBlob(obj, 'shrunkPic', shrunkBytes, 'image/jpeg'); | |
| // | |
| // Send an HTML response showing the images we just created | |
| // | |
| ff.response().mimeType = "text/html"; | |
| var origUrl = ff.getHttpAppAddress() + "/ff/resources/JSBlobTests/GaryPic/origPic"; | |
| var rotatedUrl = ff.getHttpAppAddress() + "/ff/resources/JSBlobTests/GaryPic/rotatedPic"; | |
| var shrunkUrl = ff.getHttpAppAddress() + "/ff/resources/JSBlobTests/GaryPic/shrunkPic"; | |
| var croppedUrl = ff.getHttpAppAddress() + "/ff/resources/JSBlobTests/GaryPic/croppedPic"; | |
| var sourceUrl = "https://gist.github.com/3917922"; | |
| ff.response().result = | |
| "<html><body>" + | |
| "<h1>Binary manipulation, server-side</h1>" + | |
| "<p>(The pic is of <a href='https://twitter.com/gkc'>Gary</a>. This is one of the better ones!)</p>" + | |
| "<h2><a href='" + sourceUrl + "'>Check out the source code!</a></h2>" + | |
| "<h3>Original pic : <a href='" + origUrl + "'>" + origUrl + "</a></h3> <img src='" + origUrl + "' />" + | |
| "<h3>Rotated pic : <a href='" + rotatedUrl + "'>" + rotatedUrl + "</a></h3> <img src='" + rotatedUrl + "' />" + | |
| "<h3>Shrunk pic : <a href='" + shrunkUrl + "'>" + shrunkUrl + "</a></h3> <img src='" + shrunkUrl + "' />" + | |
| "<h3>Cropped pic : <a href='" + croppedUrl + "'>" + croppedUrl + "</a></h3> <img src='" + croppedUrl + "' />" + | |
| "</body></html>"; | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment