Servoy tech webinar series 7: svyUtils

Just real quick, we’re doing a whole variety of topics every two weeks. And so the topic that we chose for this one is sort of a reintroduction of a module that’s been available for quite a long time. And the reason we’re re-introducing it is to do there’s some new stuff in there. And also we notice that not everyone knows about it. And it is used in all every project that I see. So I think that hopefully you find something in there useful for you. That’s the whole point of this module. It’s a lot of low level utility generic application functionality. So we’re re-introducing it today and we will probably re-introduction it again in the future because there isn’t stuff being added all the time. And there are not yet samples for everything that’s in there. So it’s something that we’re working on. But for today, in the time that we have, I thought I would pick two examples. One is new wish. So I wanted to get it to show you that and that’s cryptography APIs. The other one has been in there for quite a while. But it’s quite visual. So it lent itself well to a demonstration. But then we’ll take a quick look at a list of the APIs and sort of what they do so that you can get a feel for what else is in there and what kinds of stuff will be in there in the future. So let’s start with the demo and then we’ll do a overview. I have here a demo solution that I built yesterday based on the SVY Crypto Scope in the SVY Details module. This is a scope which is dedicated to all things cryptographic. And currently what we have in there right now is poured for encrypting and decrypting data using a few well-known algorithms. So let’s just walk through the example. First of all, you can select a supported algorithm right now. We support AES and DES. AES is a bit newer and stronger. So I’ll pick that. The next we want to do is choose a scheme because we need to either encrypt with a cryptographic key or we need a seat passphrase. You can see that if I try to encrypt my text right now, it’s going to ask me to generate a valid key. The API provides a method for generating a key based on your selected algorithm. So I can now. And what you see here is a base encoded, base 64 encoded string version of a key which is really just an array of bytes. That is the thing that you need to hang on to and keep secret because you need that to decrypt your to both encrypt and decrypt your data. Something you share. It’s typically something you store in the database or in a file. And so you can quite easily just take the string version of this and write it to wherever you need to store. And then once you have that, you can encrypt a piece of plain text. I have our hello world here. And you can see the base 64 encoded string version of the encrypted text. So if you wanted to store an encrypted password or something like that and later decrypt it, you can do it that way. So again, there’s an API call to encrypt using your select algorithm and you give in key. If I want to later decrypt that, there’s a method to decrypt it and I can convert that back into my plain text. Some folks prefer not to use a cryptographic key. They prefer to use a passphrase instead. So I could select use a passphrase and enter my passphrase. I’m going to use Servoy as my secret top secret password. You’ll notice that when I selected the passphrase option, this initialization vector text box came up. And the reason I put that in there is to show you that when you do AES encryption, it’s a stronger encryption algorithm and there’s a requirement for when you do passphrase because you’re not using a full cryptographic key. There could be a weakness. And so there’s a second component called the initialization vector. And in the demo here, there’s a little info box here showing you what it’s there for. And just without getting too much into cryptography and the details of it, there could be repeating patterns in the message that you’re trying to encrypt. And someone who’s looking at the encrypted version of that might see repeated encrypted patterns. So the initialization vector ensures that every time, every encrypted message is different. And so that you kind of obfuscate any patterns that could be detected and used to reverse engineer the encryption. So you’ll notice that when I encrypt my hello world message, here is the encrypted value. But there’s also this initialization vector that gets generated. So, and that’s unique per encrypted message. It’s going to be different every time. So when you use AES with password encryption, you want to make sure that you store that. Again, I can decrypt this back into my original message. You’ll notice that with this algorithm, with the passphrase, the actual encrypted value is different every time. You can see as they go back and forth, it’s really changing. And also that’s because this initialization vector is changing as well. So it’s a bit more complicated, but it’s good to know that you need to store both the encrypted message and the initialization vector. Because you need that to later decrypt it along with your secret passphrase. Finally, encryption is not limited just to messages. You may want to encrypt images, whole files, etc. So you can operate on bytes, not just string. For that, I will use an image. And I’ll select a file from, I think I have a picture in here. That’s me. And I want to encrypt the picture of myself. So I’m going to select encrypt. And here you can see what I printed out is the bytes that, you know, the scrambled bytes, the image. I can no longer show it as an image because it’s too scrambled, but I can show it as base 64 encoded text. So if you want to encrypt whole files, you can do that in a single call. And I can, of course, reverse that back to the original image. Let’s take a look at just a quick overview of that. The primary case, it’s really for data at rest. So we see with clients that we work with in healthcare and finance. Usually there’s an internal requirement or regulatory requirement to encrypt certain data at rest. Maybe in a database, it may be things like words for external services. We see that in healthcare a lot. And, you know, we realize there was a need to just make this simple because cryptography can seem really complex to get stood with. So from the beginning, we support DES and AES algorithms. If you support for other algorithms, let us know it’s possible that we could add support for pretty easily for other algorithms. And, of course, the two schemes that we pointed out, key-based and password-based are both supported. And that’s for those algorithms that supported. We could quickly take a look at what this looks like from an API point of view. You can see that I have, in my example solution, I have module SFI U-TILs installed. And there’s a scope there, SFI crypto, and it has other methods I need. There’s really only just a few public methods that you need to call. It’s quite simple. You’ll see that the first one that I called was generate key. If we look at the method here, I’m just calling my cryptography library. I’m passing in the algorithm that I want. You have to generate the key specifically for algorithm of choice. Then I generate the key and I get it as a string representation because the key is really quite array. But I want that as a string. The next thing that I did in the workflow here was I just went and I encrypted it. And this, you can see, after I do a bit of validation, really the magic happens right here. Well, first of all, I get my encryption options. So I call the API, I create this options object. And then I can set the algorithm name and I can set the key or the store. If I’m using a key, if I’m using a secret passphrase, I don’t have to set the key. And then I just call encrypt and it returns back a message. And the message is a complex object in that it contains the bytes, but you can get the text version, the bytes version. And if there was an initialization vector, you can get that as well. So you can see that I store this back to my form variable, which you saw, which was updated. So it’s really just this one line of code after you create some encryption options. And that’s it. It’s quite simple. Reversing that out when I decrypt it again, I create that options object. And then I call the decrypt as string. And I pass in the encrypted text, the options, a secret passphrase if I’m using it. And an initialization vector, remember I said that that’s required to do AES with password. So you need to hang on to that. You can pass that again as bytes or as string. And it will return back the plain text. The next thing we did was to encrypt a file, which is really no different encryption just works on bytes. And so in fact, we’re converting string to bytes to do the encryption. So when we do the file, it’s no different. For my encrypt image, you can see that again, I create the encryption options. I pass in the plain image, which is a binary. And then the options and optionally the decrypt passphrase. And you’ll notice that I just got the base 64 encoded version of that text. If I wanted to get the actual bytes instead of calling get value, I would call get bytes and that would return the byte array. Again, I store that initialization vector for doing AES with password encryption. Or with passphrase based encryption. Decrypting it, you can see that don’t decrypt a string. I just decrypt and I get back the byte array. And that’s how I was able to just assign that back to the form variable, which I’m just going to write there on the form. So it’s pretty straightforward. That’s all available in the SVY details module. The other example we have is the custom dialogues. Really, the primary use case for this is that I want to have simple dialogues in my solution. And I don’t want to have to design them from a UI. It may be that I have sort of a bunch of different kinds of dialogues. And I just want to grammatically and very quickly generate them and not spend time designing them and have sort of a consistent look and feel. So let’s take a look at this example. I have to switch to a different demo solution here. It is custom dialogues example. And I launch that in the debug client. Okay, so this is a really fast example. The way this works is that you can programmatically build dialogues without having to design anything. The very most basic use case would be to show a simple CINDY log or an input dialog. Let me change the… There was one thing I meant to comment out here. The very most basic one would be something like this. Where we call the custom dialogues scope and we create a custom dialog and we pass in a title, a message, and then some buttons. So not much different from the regular dialogues plugin at this part. And you can see the result. Oops, wrong one, Sean. Okay, just my title, my message and some buttons. And then I can find out which button was clicked. It may be that I want to add a text input and ask a question at a radio button. So it supports all of the components plus additional things like value lists and then you can set properties of the components. So it’s really quite flexible, but the best part is that it’s a really simple API. It’s programmatic. So if you have something coming from metadata or just from source code, you can generate these dialog and capture input easily. So the next example would be more complex input. And you saw me accidentally flash that a second ago. This is my fantastic dialogue, which captures address information. And I didn’t design this form and I didn’t lay it out using the solution model in a bunch of code. In fact, the API is built on the solution model, which if you’re not familiar with Servoy solution model, it allows you to do everything that you can do at design time, you can do programmatically. The downside to it is that it can be pretty bloated. So this sort of simplifies that and allows you to quickly build forms and capture input. So I’m going to fill this up pretty quickly and we’ll see what it looks like. You can see that I have a value list in one of these for the countries. I could also support different data types. These happen to all be text fields, but I could do dates and numeric and media, etc. Because you down here, I have a checkbox here. Let’s say I wanted to copy this address to my shipping address to something like that. When I click OK, you can see that I’ve displayed it back in the form to show that I’ve captured the input. So let’s take a look at what the code looks like. In this more complex example, still not very much code. And the best part is that it’s just fully customizable. I start by creating the dialog object. And you can see that has a fluent API so I can keep calling things on it like set the default field height set the default field width. I made it that it’s reasonable. By default now that it’s resizable, you can see that there is anchoring. So if I show this again, you can see that things are growing with the dialog. I added a label and you can see that I added a style class. So you’ll notice that when I set center address information it was shown with a different font and color. Just by adding a style class. Then I go and I add some simple text fields. I could set a lot more properties on these fields like data types or display types. So instead of text field, they could be something else. I could make them disabled and then I could handle on data change events and make them enabled. So quickly it can become kind of complex and at some point it makes more sense to just build the form. But this really helps for use cases where maybe you don’t know exactly what the layout is going to be and you don’t have to determine it at runtime. It could be coming from some data from some workflow. Anyway, all of the, all are most of the properties of normal design time component available or is on to alignment style classes, etc. And it’s all there with a nice fluent API with code complete. You’ll notice that I had the country valueless. So it just depends. It’s a valueless name. You’ll notice that postal code was not the default width of 50 or whatever I had set up here at the beginning. I overwrote that and set the width behind 100. I added a check box. So I can handle that input from the check box when the dialog closes. I added some buttons. All I need to do to show the dialog is called a show method. And in the ng client or this is blocking as we know from experience, or voice developers might know that the web client, the classic web client, doesn’t block so you can handle this in a callback. But no, I think this uses my colleague who built this if you’re on here, maybe you can answer that. I think that if you if I do this in the web client is still blocking using continuations. This built by my colleague Patrick Rooster who could probably answer that better than me. Finally, I want to know which button was clicked. And so I’m checking here basically dialogue button clicked. Text tells me if it was okay or cancel or null. If they just xed out the dialogue. So now I know which button was clicked. And here I’m just doing some array chopping to show those results in that little HTML field when I’m done. So again, you know at some point it makes sense to design the dialogue manually. But if you really just want to capture input and maybe it’s dynamically based, you don’t know what it is until we’re on time. This is great, a great feature. And it’s been in there for a while. So it’s pretty mature. Finally, I wanted to show that just to to give you an idea of what kind of stuff is in the SVY UTILES project. Deon said at the beginning that I said there’s way too much to do in a in a 30 minute webinar. You could see that these are just two two API and I you know I have an even exhausted what they can do. So let’s take a quick look at what else is in there and talk about it just for a minute. There’s many more APIs. They’re all it’s just run time APIs. It’s not heavy models with forms and you know databases and things like that. So there’s really no reason not to include this in your project and every project I’m involved in this is included just at the very beginning people added. There’s utilities for working with data manipulating. That’s a big one. There’s there’s a whole bunch of methods in the the date scope for you know adding days to a date or adding hours to a date or come you know again the age of something or someone just just really low level convenient. It’s that probably aren’t that hard to write but why do you need to write them if they’re already built and tested somewhere else you can easily reuse them. Event management for adding listeners to objects error handling custom exception types. One that we’ve demoed in the past is it’s logging you can actually create your own log of pens and so when you put logging in your own code. You can direct which where those logs get written they can be to database or to a file and they can be different for different loggers. So you can actually do some really robust logging on your applications and that’s that’s pretty easy right out of the box for this module. There’s a lot of oh and networking utils in there. Let’s say you want to zip a bunch of files that’s in there. It’s been in there for years. System level utilities a lot of convenience methods around Servoy and the operating system. One I use a lot is UI utilities. Just some things in Servoy can be cumbersome like I want to know what form is the parent form that contains this form. I want to get all instances of a particular base form things like that that are in there and we’re adding stuff there all the time. There’s a great Excel in addition module that’s in this repository. So if you want to easily generate formatted Excel files from JS status that’s found sets that’s supported. Hopefully I could go on into detail on some of these but I’ll just show you. Most of the things look the yes we why you tell us module and you can see for example I talked about date utilities. Just look at the the number of methods there. You know is this the start of the day. Is this a leap year. Get the last day of the month. You know if you want to get the third Thursday of the month you can do it in the date utils. So there’s just quite a lot of stuff in there. That’s tested. Data utilities. Lots of things converting bytes to strings and strings to bytes. Pivoting a day as data set. Some just little things like seeing for relation is global. So you can see that the number of methods. Possibly some follow up webinars to go into some of these. We’d really like to hear from you guys what you currently use if you’re using this. Get active on. Get active on get up in post issues and enhancements on the project. You can even become involved contact us if you’d like to attribute to the project. Ideally this is open source but ideally there’s community contribution as well. So we really want to hear from you and there will be more examples to come from this and other open source modules. Sure. So there’s a lot of different different points on the website. So it’s a little bit more useful. So links are the GitHub site. So I say this every webinar. If you don’t have an account, create an account and add yourself to watch these repository so you can. You can know when things are updated when things are released. Uh, yarn, we have questions. Let me have a look, uh, uh, yarn. Um, oh, there’s a comment from, uh, Patrick that, yes, it uses continuations. So it works the same across all platforms. Okay. That’s for the dialogues, um, uh, when the dialog is closed. That’s right. It resumes, uh, execution. Okay. Let me see. I’m not seeing a lot of questions. I think either you were very clear or people have fallen asleep, I’m not sure what, uh, what do you think? Uh, I hope they didn’t fall asleep. But let me launch a poll so you can see if people are sleeping on us. Okay. So I’m launching a very quick poll to figure out, are you using S-V-Y utils? Um, so let us know. Let us know what you’re doing. Interesting data is coming in. So far, 70% has voted. So people are not sleeping, actually. I’m just a good news. Or they just woke up. You just woke them up here. We should do more polls. This is quite fun to do. Um, I didn’t even like it. All right. So, the results are in nine times. What’s the results? Let’s see. I’m not sure if this is a rigged election or not, because I could just make up the numbers, isn’t it? All right. Here are some facts and alternate effects. 87 has voted. And 50% is using S-V-Y utils. 20% is not using S-V-Y utils and 30% No, but I will start right now. So let’s say this is pretty good. That’s pretty good. And then send us your use cases for the things that you saw and the things that are are maybe not in the module. Or if you want to contribute, if you find yourself writing or needing to write some generic utility, then you say, this could be useful in any project, then drop us a line. Even if you’re not comfortable being a contributor, give us the use case and we could probably contribute it pretty really for you. Cool. All right. Well, keep sending in suggestions. We, I think we have the next one in our mine already, shown or not? Yeah. Next is the online sample gallery. And this will be an interesting topic. We were working on something a better way to distribute samples of what’s possible to serve, and how to do stuff. And so we started an online sample gallery and this is, it’s meant to be more than a gallery. It’s meant to be almost like like a dictionary of samples that we can easily add to. So as we do webinars like this one where we create sample solutions, and as we build examples of how to do things, we can easily include those into this living gallery and then it will grow and grow and grow. And we can, we can keep it up to date with, with new stuff, so that it will be online in meaning like running actual running solutions. So I’m not going to say too much more about it because it’s not totally ready yet. And you need to come to the next webinar to find out more. All right. There’s still a few questions popping in. I think we can do one or two questions from Emre is that all build and JavaScript or our Java packages used. This is, this is for the cryptography stuff. I assume or SVR you do. Is it used as JavaScript? So there, the, the, the, the cryptography stuff I showed is it, it beneath it, it uses Java standard Java cryptography libraries. So there’s nothing extra to include. Everything else is, is JavaScript. The Excel integration requires you drop a jar file. If you want to do some of the extra stuff it requires that you drop a jar file, but it’s based on some stuff that is distributed already with Servoy. So in most cases you don’t need to do anything other than import the module. Cool. All right. This suggestion from Steve to do a webinar on Jasper reports, which is I think a good idea. And maybe a webinar on SVY log manager. How to use that. Okay. All right. Well, we will be posting this, this recording soon on the, on the website. And meanwhile, if you have any suggestions, questions, then the forum is the place to be, if you have any bugs or requests, then GitHub is the place to, to go to. Well, thanks Sean again for a great webinar and we look forward to meeting everybody two weeks from now. Thank you. Thanks. Bye.

Close