30 minutes with Servoy 8 2 launch part 1 of 3
30 minutes with Servoy 8 2 launch part 1 of 3
Three webinars, eight, two is live as of today. We’re gonna start by just jumping into one of the plugins that was offered on Wednesday. We’re gonna circle back to a bit more about what’s new and eight to from an overview, especially in the developer, because there’s quite a few enhancements in the developer. Then on Friday, we’re excited to launch a new extension for Servoy and in fact it’s compatible with eight, one, and eight, too. It’s a new security multi-tenancy module. So it’s gonna be a busy week, but we’ll try to keep these webinars to 30 minutes as usual. So let’s jump into all about the client manager plugin. Basically, I’m gonna go through a few demos first. This plugin adds the ability to send messages between clients on a very generic level. So of course the obvious example would be a chat example. Although that’s maybe not the best business case or use case for a business. So we’ll do another more sort of involved example that involves chat integrated with a CRM or something. The other side of this component is the ability to manage the connected clients. And so this was already offered in the maintenance plugin if any of you are familiar with that. However, that was only available during a solution import and maintenance mode. So this makes that portion available at any runtime. And we’ll get to see an example of what that looks like. Then I’ll jump back and do a quick overview of what we saw with some slides and a bit of how to’s. So you can see the condensed version. And we can discuss possible use cases. So let’s get right to it. The first demo I have up here is I have two, here we go. Side by side windows for just a simple chat example. And this is what I also demoed at Servoy World in the little preview. So for those of you that saw that, this will be a bit of a review. But just to show you sort of the basics of the plugin, I’m going to enter a username for each one of these chat channels. I’ll be very creative here and signed in to Sean one and Sean two. So now as I start chatting, you can see the message is going back and forth and this is a broadcast. So you can see from the source on the left, it’s broadcast to the right. And I can go back and forth. Pretty simple. We can jump in and look at the code here just to get an overview of how it works. Let me activate this solution here. I had the wrong solution active. And is going to be this chat example here. Is going to be this chat example here. So what happens on the first show of this form, if we jump into the event handler for that, is that we first capture the username because we need that to be, you know, to chat under identified user to send messages. Then I initialize the broadcaster. I call broadcaster destroy. We’ll get back to that because that’s actually removing from the chat if we were already at it. But the one I want you to focus on is right here. Where we call the client manager plug in and we call it the get broadcaster method. And that takes three arguments. One is the username. So now I’m getting a hook to be able to broadcast to a channel. So I need to provide the username that I’m going to use. The second argument is the name of the channel. This is what I had demoed at Servoy world. So it was called conference channel. And at the end everyone could sign on and chat on the conference channel. But that’s I just have a constant there. And it’s set to be Servoy world. Then finally, you pass in a callback method to receive the broadcast. So this I’m providing a reference to a function here. And your callback method that you provide when you initialize that broadcaster is really going to take two arguments. One is the username. So that’s the user that’s that’s posting to that channel. And then the message or the payload. And so that’s a simple string. Although if you’re doing a more complex. Chatson area. It might be not a message from a person to a person, but it could be like a payload object. Like serialized JavaScript or something. So that’s that’s what we do when we receive it. And in this case, I’m just printing it out to. To a little chat log variable that shows what’s going on. With bit of HTML. And that’s why you see here that it’s sort of formatted and showing. Who said what then the user’s involved. So that’s the very, very simple example. We get a broadcaster for a name channel and under a given username. And then we can both post and receive messages on that channel. And that’s the basics for it. The next example that I would show you. Maybe I can just bring this up right here. Would be. It will be the chat support server. And let me use my other window here. And bring up chat. For example, client. Oops. Yes, chat support client. Those are good. I need to call Evo and buy some licenses apparently because I’m getting the. The welcome to the community edition. I’m going to shrink these down a bit. So that it’s a bit more visible because I have to do a bit of scrolling. So again, I’m going to sign in with a username. Now, the scenario here is that. Rather than just a chat back and forth between users because why would we build that? We could already get that with Slack or Skype or whatever. The example that I want to use here is that. I have let’s say support system. Maybe an interdepartmental and I have thousands of users and I have a customer service rep on the phone. And they’re looking at an order with a customer and they need to work with a tech support person. And maybe they just need to submit like a request for support from the tech support person around a given case ID or given order number or something like that. So that’s the scenario here a bit more of like a real world business example. So I’m going to first sign in as the support tech. I’ll call it support one on the left side. And over here I’ll call it client one, the sign in on the right side. Okay, so client one on the right side is maybe finding a case or an order and they’re on the phone. And they decide they want to flag for support or request for support. So I’m going to hit this button here and you can see that it opens up a chat channel over here. But what I also did is I broadcast over to the left screen here that I am now requesting. So I have a list of open cases here. If I were to add another another client. For the same one I’m using a server in the UK so there’s a bit of a latency here to get it started. There we go. So I’m going to call this client to. And I’m on a different order here. I’m going to request support for this one as well. So now now I have two users in two locations. Let’s say I’ve client one and client two. And they both requested support. I’m going to also add another. that support person. So let me just copy the URL here. Just one moment. Well that’s loading what I can do. I don’t know what’s going on there. Well we can do it with one. It’s not a big deal. I can come over here and as a tech support person I’m going to say okay. I’m going to help this person here so I’m going to select it. And it selects the record then I’m going to say begin support. And then I could start chatting with them say how can I help. And as I answer that you can see now that it goes to. To this user here. And you know they could say. fix the shipper I don’t know. And then you can see that it comes back over here and let’s say I change. The shipper serve way of course does data broadcasting so you can see that was updated over here. And then maybe from the client we’re going to close the support case so. You know did it work. And this person says yes. And then maybe they close the support now what you’ll see is that. That removes the the case from the list of open cases that this support person was working on. Did this one ever come up I don’t know what happened there so I’ll just close that. We’ll just do this with one one person and support over here. So I could switch over to this other client that’s running and say okay I’m going to start working on that one as well. So this way we can have distributed users working in a complex application and there’s a bit of client to client messaging now. The Servoy has data broadcasting built in for data changes but maybe this is a scenario where we’re not really changing data we don’t have a table that’s being updated and issuing data broadcast. And this is a way to broadcast between clients and and and start chatting about a record or something. So that’s the the more complex example. I hope it makes sense from a use case point of view. Let’s take a little look at the source code. So I have the first form up here orders chat. This is the forms JavaScript file. This was the client that had requested support. So when they click that button and and and asked for support. It was calling this method here request support and I so what I’ve done here is set up two broadcast channels a main channel and then I’m creating a new channel. So I’m going to do the chat around a specific order. So the first channel notifies anyone that’s watching any one from the support department that there’s a new case open available to to handle. But once that has been handled and we’re chatting on a sub channel about just that specific order. So there could be hundreds of thousands of channels open for specific things and a main channel for delegating if you will. So get main channel, which I I do here is basically a lazy lazy load thing where it creates it if it doesn’t already exist. Again, this is the same method to get broadcaster with the username the channel name and the callback. So the channel name here is is just a constant for the main support channel. Once we get that we broadcast this message and this is a bit different than the simple example because here’s like a real business case where it’s going to be a payload a complex payload not just a high how you’re doing chat message. So this contains some serialized JavaScript which has the order ID and what the status is so we can see that a new a new order came in because the status went to open. I’m basically saying I need some support. This is the order ID you know I’m opening a ticket something like that and it goes to open. So then I open up as a client I open up a sub channel and this is just a convention where it’s going to be the main support channel colon and then the order ID. And then I get a broadcaster to listen and and to send to so I have another channel I call support channel and I have a callback for that which then prints the chat. So now I’ve created a main channel to issue the request and then I create the sub channel to where the rest of the chat gets delegated to if we go over to the. I think I actually have to switch the active solution here I didn’t have these all in one module. If I go over to the chat support server and I open this in the script editor. Bring up the outline. So you can see that. I have a main channel which I initialize down here. And I get once it’s initialized I. I have to get the. Receive one here that’s on the sub chat. Here it is so on my main channel the callback that I provide when I initialize that is this one here and this is where I’m looking if it’s. If the status was open then I’m I won’t get into the details of this one but I’m keeping an array of open cases and that’s a value list and all that stuff. But essentially if the status was open I’m consuming that payload and set and checking the status here that I added to the list of cases. If this the case was assigned to another support person or it was closed then I’m going to remove it from my list of cases so the moment that someone else grabs that case it disappears from my view. So it’s also broadcasting from support person to support person about who’s who’s assigned to which cases. So you can see that there could be a complex tree of channels that you know are opening and closing all the time. So that basically just sets the value list items which is what happens down here. The the next thing that happens if I do. want to decide to help on one of those cases is to assign the case and that’s what that was this message method so when I click the the case I I select or hit the button to. To start supporting that case then I first I broadcast everyone else that hey I’m going to I’m going to take this case so they all remove it from there. And they’re listed of open cases and then I open up also a sub channel with the same convention as was done with the client and now I’m free to start chatting on there and everything in the chat window is the same as the simple example. So I know it’s a lot of code and more of a complex example but just to summarize is that we created a main channel to talk about which cases are open and which cases are being handled and then every case has its own sub channel where an individual support tech and an individual customer service tech or someone within communicate about a single thread you know single order or something. So that’s the more complex chat exam will I said I would do one more demo here. Hey Sean before you move on there is one question related to this. The question is can you have the two supports opened in server at the same time. And I think what he’s asking is can you can you have two channels of chat open at the same time in the clients. Okay yeah that’s I get the question so yeah you can have as many chat channels as you want so even in this example both the the client support and the client. The right the right side one here I was just going to chat client and the left side the support server the support tech are both listening and chatting on two channels. One is is the main channel which says what’s available in the second one is a sub channel but this particular person could be supporting you know dozens of open you know chat cases while they wait for someone to respond they’ll go to the other one. And so there really could be listening on you know dozens of different sub channels so it’s it really is a dedicated channel that you can use and you can use many as you want per client you can have as many clients as you want talking on one channel or listening on one channel. So the final example that I’ll show is I’ll do is I’ll open another window I think is the best way to visualize this. And we’ll do the. The client manager example and this is the other component of the client manager plug in I think I’m running out of licenses because I didn’t plug in demo licenses. I’ve hit my limit what I’ll do is I’ll close a couple of these. Unfortunately that’s what I wanted to show with this one so a bit of a. Maybe I can get one up now there we go okay. What I have here is the client manager plug in has another component to show connected clients and what you can do with them. And this is you know similar to what you would do on the server admin what I was just doing over here except you could embed this in a user interface. So that’s the key difference. So I’m showing here a list of clients and as I select one it shows me the. The information the IP address the host name the unique ID when they logged in and also what what solution is open so basically everything you can get from the the server admin page so you can see that the solutions changing here. Everything else is basically the same except for the the times. I also tried to do a geolocation on the IP address with a Google map component something with that wasn’t working I was trying to add that at the last minute to make it look a bit nicer that’s quite easy to do you just send a request to a web service and it’ll give you back location for a lat long for an IP address. We have a better example of that on Friday when we talk about security. Anyway, so what I could do is take one of these clients and maybe send a message like server will shut down in five minutes and then send and you can see that immediately it switched over to the other client that I had up. And it’s giving me the notification direct to the user interface so just like if you send a message from the the app server administration page. If I go back here I could then. Follow through on that and say shut down and I’ll say you sure you want to shut down on this client I say okay. And then I see the refresh list there’s no there’s one fewer clients there and back here you can see that it’s the page is expired so. So close that client so you can you can message clients you can shut down a single client you can also send a message to all clients and you can shut down all clients at once if you want to so if you’re doing some. maybe some import hook that’s doing some maintenance and while the import hook is running you want to send a message and then shut them down or maybe the. You’re going through and someone says they’re stuck and you’re doing it you want to have an application to manage a server and they’re stuck and you want to go ahead and kill their session for them so they could login again something like that. So that’s the the final component to the. The plugin. I’ll just go through quickly and overview what we looked at. So the primary functions of the client manager plug in our to broadcast messages on a channel to listen to messages on a channel. To get the information about connected clients and with that information you can send messages direct like straight to the UI to those clients and you can also shut them down remotely. That’s pretty much it. To broadcast a message you got to get what’s called a broadcaster so you call get broadcaster on the plugin you have to provide three things a username so that’s the name you want to you want to broadcast under the channel that you want to broadcast to. And the callback function to receive messages that are broadcast on that same channel so you would create one broadcaster for every channel that you’re interested in. When you have a broadcaster that you want to send a message on you just call send message and you pass in a string now that could be a high how are you doing message or it could be serialized JavaScript so for that use the Jason helper class to stringify some objects and that’s what we did in the more complex example where it had the order ID and a status embedded in it when it was broadcasting to the main channel. When you receive a message you get that message that payload. The you get the payload first you get the username that sent the message and then you get the payload as a string and again. You would parse that you do the Jason dot parse the inverse of the of the stringify if it was serialized JavaScript to get to read it back. For the client information it’s pretty straightforward get connected clients gets you an array of client information objects and on those objects you can call get host name get host address I didn’t show the code for that but. If you were to look in. Developer here. The client manager example form. I can show it right down here so. When it’s loading the clients it’s calling get connect the clients and it’s it’s building a value list for me to select from. But storing that and then when I select a client is calling this load client and it’s just getting all that stuff straight from the client object all those get methods. As how I put them in form variables to show it. So that’s pretty much how you get the client info and then when you want to send a message same thing you just send message you give the client ID or all all clients and because to everyone. Same for shutdown you want to shut down a client you give a client ID if you want to shut down all clients you just call it once and it works. Any other questions Steve. No just overflowing praise at what a great example this was. I am going to be posting right now in the chat area you link to the forum post that contains the links to download subway point to register for seminars see the release notes the fixes all that good stuff thanks to you on for posting that.