Sunday, November 9, 2014

How to save a base64 decoded image in the filesystem using grails

How to save a base64 decoded image in the filesystem using grails

Controller


import sun.misc.BASE64Decoder

class TestController

def index()

def save()
def file = params.file.toString().substring((params.file.toString().indexOf(",") + 1), params.file.toString().size())
byte[] decodedBytes = new BASE64Decoder().decodeBuffer(file)
def image = new File("C:/Users/Steven/Desktop/test/testimage.jpg")
image.setBytes(decodedBytes)


View


<!DOCTYPE HTML>
<html>
<head>
<style>
body
margin: 0px;
padding: 0px;

#buttons
position: absolute;
left: 10px;
top: 0px;

button
margin-top: 10px;
display: block;

</style>
</head>
<body>
<div id="container"></div>
<div id="buttons">
<button id="save">
Save
</button>
</div>
<script type="text/javascript" src="$resource(dir: 'js', file: 'jquery-1.7.min.js')"></script>
<script type="text/javascript" src="$resource(dir: 'js', file: 'sammy.js')"></script>
<script type="text/javascript" src="$resource(dir: 'js', file: 'kinetic-v5.1.0.min.js')"></script>
<script defer="defer">
var stage = new Kinetic.Stage(
container: 'container',
width: 578,
height: 200
);
var layer = new Kinetic.Layer();

var box = new Kinetic.Rect(
x: 200,
y: 80,
width: 100,
height: 50,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 4,
draggable: true,
dragOnTop: true
);

box.on('mouseover', function()
document.body.style.cursor = 'pointer';
);

box.on('mouseout', function()
document.body.style.cursor = 'default';
);

var box2 = new Kinetic.Rect(
x: 200,
y: 80,
width: 100,
height: 50,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 4,
draggable: true,
dragOnTop: true
);

box2.on('mouseover', function()
document.body.style.cursor = 'pointer';
);

box2.on('mouseout', function()
document.body.style.cursor = 'default';
);

var box3 = new Kinetic.Rect(
x: 200,
y: 80,
width: 100,
height: 50,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 4,
draggable: true,
dragOnTop: true
);

box3.on('mouseover', function()
document.body.style.cursor = 'pointer';
);

box3.on('mouseout', function()
document.body.style.cursor = 'default';
);

var box = new Kinetic.Rect(
x: 200,
y: 80,
width: 100,
height: 50,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 4,
draggable: true,
dragOnTop: true
);




layer.add(box);
layer.add(box2);
layer.add(box3);
stage.add(layer);

// $(stage.content).on('mousewheel', ui.zoom);

document.getElementById('save').addEventListener('click', function()

stage.toDataURL(
callback: function(dataUrl)

$.ajax(
type: "POST",
url: "save",
data: file: dataUrl
).done(function( respond )
alert(respond);
);

// window.open(dataUrl);

);
, false);
</script>
</body>
</html>


How to save a base64 decoded image in the filesystem using grails

No comments:

Post a Comment