Exif image

[epos4u]

any way we can read the exif from uploaded image to see what the rotation is

thanks

[Sherzod]

1 hour ago, epos4u said:

any way we can read the exif from uploaded image to see what the rotation is

Hi,

Exactly where would you like to get it?

[epos4u]

Hi Sherzod,

using UnimFileUpload then display the image in UnimImage, selecting image from phone, camera rotation is not always correct to display

exif to see what the rotation is, so can be rotated in code in UnimImage

 

thanks,

[Sherzod]

12 minutes ago, epos4u said:

using UnimFileUpload then display the image in UnimImage, selecting image from phone, camera rotation is not always correct to display

exif to see what the rotation is, so can be rotated in code in UnimImage

Hi,

I will try to analyze.

[epos4u]

thank you Sherzod

 

[Sherzod]

12 hours ago, epos4u said:

using UnimFileUpload then display the image in UnimImage

Hi,

Can you use an UnimFileUploadButton instead? It seems I have a solution.

Or another solution, you need to try to read EXIF data on the Delphi side.

[epos4u]

Hi Sherzod,

i don't mind using UnimFileUploadButton , if you have a solution that would be great

thank you

 

 

[Sherzod]

1 hour ago, epos4u said:

i don't mind using UnimFileUploadButton , if you have a solution that would be great

OK. Try these steps...

1. UnimFileUploadButton1

2. CustomFiles: files/orientation.js

function getOrientation(file, callback) {
    var reader = new FileReader();
    reader.onload = function(e) {

        var view = new DataView(e.target.result);
        if (view.getUint16(0, false) != 0xFFD8)
        {
            return callback(-2);
        }
        var length = view.byteLength, offset = 2;
        while (offset < length)
        {
            if (view.getUint16(offset+2, false) <= 8) return callback(-1);
            var marker = view.getUint16(offset, false);
            offset += 2;
            if (marker == 0xFFE1)
            {
                if (view.getUint32(offset += 2, false) != 0x45786966)
                {
                    return callback(-1);
                }

                var little = view.getUint16(offset += 6, false) == 0x4949;
                offset += view.getUint32(offset + 4, little);
                var tags = view.getUint16(offset, little);
                offset += 2;
                for (var i = 0; i < tags; i++)
                {
                    if (view.getUint16(offset + (i * 12), little) == 0x0112)
                    {
                        return callback(view.getUint16(offset + (i * 12) + 8, little));
                    }
                }
            }
            else if ((marker & 0xFF00) != 0xFF00)
            {
                break;
            }
            else
            {
                offset += view.getUint16(offset, false);
            }
        }
        return callback(-1);
    };
    reader.readAsArrayBuffer(file);
}

3. 

  private
     FOrientation: Byte;
    { Private declarations }

4. MainmForm -> OnCreate:

procedure TMainmForm.UnimFormCreate(Sender: TObject);
begin
  UnimFileUploadButton1.JSInterface.JSAddListener('change', 'function(sender){getOrientation(sender.getFiles()[0], function(orientation) {ajaxRequest(sender, "getOrientation", ["orientation="+orientation])})}');
end;

 5. UnimFileUploadButton1 -> OnAjaxEvent:

procedure TMainmForm.UnimFileUploadButton1AjaxEvent(Sender: TComponent;
  EventName: string; Params: TUniStrings);
begin
  if EventName = 'getOrientation' then
  begin
    FOrientation := Params.Values['orientation'].ToInteger;
  end;

end;

 

Orientation values:

Source: https://stackoverflow.com/questions/7584794/accessing-jpeg-exif-rotation-data-in-javascript-on-the-client-side

[Sherzod]

And here you can already use the value of FOrientation:

procedure TMainmForm.UnimFileUploadButton1Completed(Sender: TObject;
  AStream: TFileStream);
begin
  
  ...
  
  Case FOrientation of
  ...

end;

 

[epos4u]

Thank you Sherzod

 

[epos4u]

Hi Sherzod,

4. MainmForm -> OnCreate:

procedure TMainmForm.UnimFormCreate(Sender: TObject);
begin
  UnimFileUploadButton1.JSInterface.JSAddListener('change', 'function(sender){getOrientation(sender.getFiles()[0], function(orientation) {ajaxRequest(sender, "getOrientation", ["orientation="+orientation])})}');
end;

does not trigger on complete , not sure why

[Sherzod]

2 hours ago, epos4u said:

does not trigger on complete , not sure why

Hi,

Yes, this is another event. When you select a file (take a picture), this event is triggered, in which you store a global variable that stores the last selected orientation of the 'image':

6 hours ago, Sherzod said:

5. UnimFileUploadButton1 -> OnAjaxEvent:

procedure TMainmForm.UnimFileUploadButton1AjaxEvent(Sender: TComponent;
  EventName: string; Params: TUniStrings);
begin
  if EventName = 'getOrientation' then
  begin
    FOrientation := Params.Values['orientation'].ToInteger;
  end;

end;

 

[epos4u]

Hi Sherzod,

could you try it on the demo uniCloud please

[Sherzod]

5 minutes ago, epos4u said:

could you try it on the demo uniCloud please

Exactly in what sequence?

[epos4u]

1 minute ago, Sherzod said:

Exactly in what sequence?

1. click upload media

2. click on image

3. browse image and start upload

4. click on show media

depending how the image was taken , that's why i need to able to rotate to view correctly

thanks

[Sherzod]

Ok I will try.

[Sherzod]

But as you "remember", UnimFileUpload1 is used here instead of UnimFileUploadButton1

[epos4u]

3 minutes ago, Sherzod said:

But as you "remember", UnimFileUpload1 is used here instead of UnimFileUploadButton1

can you change it to UnimFileUploadButton1 to get the same results please

if possible

[x11]

On 9/4/2019 at 2:39 PM, Sherzod said:

UnimFileUploadButton1.JSInterface.JSAddListener(

 

how about TUnimFileUpload?

theare is no JSInterface