How to call var from within an other function in javascript

Question

I'm trying to get the exif orientation variable in my function, but I can grab it to the other function... How could I get it please (var orientat)?

$(function() {
        $('#takePictureField').change(function(e) {
            $("#canvas_captimg").show();
            $( "#imgcaptmobile" ).empty();
            $( "#imgcaptmobile" ).hide();

            var file = e.target.files[0],
                imageType = /image.*/;

            if (!file.type.match(imageType))
                return;
                    var fr = new FileReader();
                    fr.onload = function() {
                 var exif = EXIF.readFromBinaryFile(new BinaryFile(this.result));
                   // console.log(exif.Orientation);
                    var orientat = exif.Orientation;
                };
                fr.readAsBinaryString(file);

            var reader = new FileReader();
            reader.onloadend = fileOnload;
            reader.readAsDataURL(file);
        });

        function fileOnload(e) {
            var $img = $('<img>', { src: e.target.result });
            var canvas = $('#canvas_captimg')[0];
            var context = canvas.getContext('2d');

            $img.load(function() {
                var MAX_WIDTH = 487;
                  var MAX_HEIGHT = 1800;
                  var width = this.width;
                  var height = this.height;

                  var moit_width_2 = 0;
                  var moit_height_2 = 0;
console.log(orientat);
                  if (orientat > 1) {
                    if (orientat == 3 || orientat == 4) {
                        var rotation = 180;
                    }
                    if (orientat == 6 || orientat == 5) {
                        var rotation = 90;
                    }
                    if (orientat == 8 || orientat == 7) {
                        var rotation = 270;
                    }
                    var moit_width = width / 2;
                      var moit_height = height / 2;
                      var moit_width_2 = 0 - moit_width;
                      var moit_height_2 = 0 - moit_height;

                      context.translate(moit_width, moit_height);
                            context.rotate(rotation * Math.PI/180);
                  }

                  if (width > height) {
                    if (width > MAX_WIDTH) {
                      height *= MAX_WIDTH / width;
                      width = MAX_WIDTH;
                    }
                  } else {
                    if (height > MAX_HEIGHT) {
                      width *= MAX_HEIGHT / height;
                      height = MAX_HEIGHT;
                    }
                  }

                context.drawImage(this, moit_width_2, moit_height_2, width, height);
                 $( "#imgcaptmobile" ).append( '<img id="imagecaptmobile" src="' + canvas.toDataURL("image/png") + '" style="display:hidden">');
            });
        }
        });

Answer 1

You should check out the answer at - What is the scope of variables in JavaScript? about how variable scope works within javascript to gain some understanding of what you are requesting.

To answer your question, make the variable global or pass it as a parameter to the function.

To make it global try the following:

add the following line at the start.

var orientat;

update the assignment to

orientat = exif.Orientation;