JSFiddle - React, Tailwind, and code Playground

by icodeforlove

HTML

JPEG <input id="file" type="file">
<textarea id="result" disabled></textarea>

CSS

body {
    margin: 10px;
    font-family: helvetica;
}
#result {
    margin-top: 10px;
    width: 100%;
    height: 600px;
    border: none;
    font-size: 10px;
}

JavaScript

//Based on MinifyJpeg
//http://elicon.blog57.fc2.com/blog-entry-206.html

var ExifRestorer = (function() {
   
	var ExifRestorer = {};
	 
	ExifRestorer.KEY_STR = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';

	ExifRestorer.encode64 = function(input)
	{
		var output = '',
			chr1, chr2, chr3 = '',
			enc1, enc2, enc3, enc4 = '',
			i = 0;

		do {
			chr1 = input[i++];
			chr2 = input[i++];
			chr3 = input[i++];

			enc1 = chr1 >> 2;
			enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
			enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
			enc4 = chr3 & 63;

			if (isNaN(chr2)) {
			   enc3 = enc4 = 64;
			} else if (isNaN(chr3)) {
			   enc4 = 64;
			}

			output = output +
			   this.KEY_STR.charAt(enc1) +
			   this.KEY_STR.charAt(enc2) +
			   this.KEY_STR.charAt(enc3) +
			   this.KEY_STR.charAt(enc4);
			chr1 = chr2 = chr3 = '';
			enc1 = enc2 = enc3 = enc4 = '';
		} while (i < input.length);

		return output;
	};
	
	ExifRestorer.restore = function(origFileBase64, resizedFileBase64)
	{    	
		if (!origFileBase64.match('data:image/jpeg;base64,'))
		{
			return resizedFileBase64;
		}       
		
		var rawImage = this.decode64(origFileBase64.replace('data:image/jpeg;base64,', ''));
		var segments = this.slice2Segments(rawImage);
				
		var image = this.exifManipulation(resizedFileBase64, segments);
		
		return this.encode64(image);
		
	};


	ExifRestorer.exifManipulation = function(resizedFileBase64, segments)
	{
			var exifArray = this.getExifArray(segments),
				newImageArray = this.insertExif(resizedFileBase64, exifArray),
				aBuffer = new Uint8Array(newImageArray);

			return aBuffer;
	};


	ExifRestorer.getExifArray = function(segments)
	{
			var seg;
			for (var x = 0; x < segments.length; x++)
			{
				seg = segments[x];
				if (seg[0] == 255 & seg[1] == 225) //(ff e1)
				{
					return seg;
				}
			}
			return [];
	};


	ExifRestorer.insertExif = function(resizedFileBase64, exifArray)
	{
			var imageData =...