Converting text to BinaryData during bootstrap?

Converting text to BinaryData during bootstrap?

  

Hello everyone,

I'm having a bit of trouble with bootstrapping my pictures entity. I'm creating a prototype of an application that allows cooks to sell their homemade food. For the moment I'm just making a preset number of cooks with their menu items already made, pictures and details included. For this I've created a table called MenuItems and another called MenuItemPicture. MenuItemPicture contains Picture - binary datatype, filename and filetype. When attempting to bootstrap this with the base64 text in the excel file outsystems doesn't read it as binarydata, so I changed the datatype to text and switched it to binarydata after bootstrapping. Now going off other posts, I am supposed to create an action that converts the text to binaryData however I don't understand how to and where to do this.



All help is appreciated. Thank you! 

Hello Zainab,

I would use the approach mentioned by Daniel Martins in this post.
If you want to try it, you may want to do the bootstrap in a separated module, so that the image zip file will not have impact in your other modules (the size problem).

You can also try to use the TextToBinary function from the binary api: https://success.outsystems.com/Documentation/10/Reference/OutSystems_APIs/BinaryData_API#TextToBinaryData

Never used it in this context, don't know if it works. 

In both cases you need to change the Bootstrap in order to convert/retrieve the data and assign to the binary field in the assignment node of the bootstrap.

Cheers.

Hello!


I had very similar situation few months ago and found this approach is the fastest and simplest as of now and here are few steps to get it solved:

  1. In screen preparation there is the iteration cycle that creates a list of items with some additional props calculated and added "on the fly" to data fetched from aggregate.

  2. Here I should mention that images are stored in DB as this three attributes:
    Image: Binary Data
    ImageFilename: Text (254)
    ImageFiletype: Text (50)
  3. Finally when there is a need to show an image as picture or photo to real user and not as binary/text file or string with tons of symbols - there can be used so-called Data-URL resource type. Here is how it looks in my assign to node:


    In common case this can be written as:


    Node.image = "data:"
                + Nodes.List.Current.ImageFiletype
                + ";base64,"
                + BinaryToBase64(Nodes.List.Current.Image)


    You don't need to change anything in your code or create additional scripts/pages/modules/etc. Just use those three fields that you alredy have: 

    Image = "data:" + ImageFiletype + ";base64," + BinaryToBase64(ImageContent)
    Image = "data:image/png;base64," + BinaryToBase64(ImageContent)
    Text = "data:text/plain;base64,bWFpbHRvOnRiYWx0cnVzaGFpdGlzQGdtYWlsLmNvbQ=="


    And this is how it looks on web page:


    Hope this helps!

     Regards

Tomkas wrote:

Hello!


I had very similar situation few months ago and found this approach is the fastest and simplest as of now and here are few steps to get it solved:

  1. In screen preparation there is the iteration cycle that creates a list of items with some additional props calculated and added "on the fly" to data fetched from aggregate.

  2. Here I should mention that images are stored in DB as this three attributes:
    Image: Binary Data
    ImageFilename: Text (254)
    ImageFiletype: Text (50)
  3. Finally when there is a need to show an image as picture or photo to real user and not as binary/text file or string with tons of symbols - there can be used so-called Data-URL resource type. Here is how it looks in my assign to node:


    In common case this can be written as:


    Node.image = "data:"
                + Nodes.List.Current.ImageFiletype
                + ";base64,"
                + BinaryToBase64(Nodes.List.Current.Image)


    You don't need to change anything in your code or create additional scripts/pages/modules/etc. Just use those three fields that you alredy have: 

    Image = "data:" + ImageFiletype + ";base64," + BinaryToBase64(ImageContent)
    Image = "data:image/png;base64," + BinaryToBase64(ImageContent)
    Text = "data:text/plain;base64,bWFpbHRvOnRiYWx0cnVzaGFpdGlzQGdtYWlsLmNvbQ=="


    And this is how it looks on web page:


    Hope this helps!

     Regards


Hi! Thanks for your response. My application is a mobile application, will these steps still apply?

Zainab Uddin wrote:

Hi! Thanks for your response. My application is a mobile application, will these steps still apply?

I believe you should try this first and then come back with results if something wouldn't work.

Have a great day!


Tomkas wrote:

Zainab Uddin wrote:

Hi! Thanks for your response. My application is a mobile application, will these steps still apply?

I believe you should try this first and then come back with results if something wouldn't work.

Have a great day!


Sorry, I am looking for screen preparation, I can't seem to find it? 

Zainab Uddin wrote:

Tomkas wrote:

Zainab Uddin wrote:

Hi! Thanks for your response. My application is a mobile application, will these steps still apply?

I believe you should try this first and then come back with results if something wouldn't work.

Have a great day!


Sorry, I am looking for screen preparation, I can't seem to find it? 

In web applications we have preparations - the same thing that ServerAction called BootstrapMenuItemPucture on your screenshots.

Regards!


Eduardo Jauch wrote:

Hello Zainab,

I would use the approach mentioned by Daniel Martins in this post.
If you want to try it, you may want to do the bootstrap in a separated module, so that the image zip file will not have impact in your other modules (the size problem).

You can also try to use the TextToBinary function from the binary api: https://success.outsystems.com/Documentation/10/Reference/OutSystems_APIs/BinaryData_API#TextToBinaryData

Never used it in this context, don't know if it works. 

In both cases you need to change the Bootstrap in order to convert/retrieve the data and assign to the binary field in the assignment node of the bootstrap.

Cheers.

Hi Eduardo,

Thanks for your reply. I tried the text to binary conversion but it seems a bit futile as changing the bootstrap can only occur once you've bootstrapped once. After the initial bootstrap doesn't it see that the excel is not empty therefore it ends the action? Just curious about this. 

Sorry, Zainab, but I didn't understand your comment.

A bootstrap is by definition an action used to fill an entity at publish, to initialize it with data, and happens only once (or every time the entity is empty).

If you need to bootstrap images, Daniel's approach seems the best, unless you converted the images to base64, and add a column with this strings in the excel, than you have to convert it to binary before storing.

This is a server side action.

Cheers.