Updated 011 Component Scripts (markdown)

Amigo 2019-06-10 11:41:15 +02:00
parent 3047c61ae4
commit a07edebb7c

@ -11,30 +11,28 @@ Now the 'user helper method' is simply code. If you do not know how to write PHP
Ideally you would connect that company to a user in the system. (It can happen that you are not going to add that company to a user because a user can have multiple companies). If you click on this tab'select user', you could select the user. But if you haven't selected a user and you've entered an email address and a name [00:01:49](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m49s) and the needed information, then once you click save, close or save, the system will actually create a user for you
and will automatically email the user details to that user. That is because of that specific helper class that I added. Clicking 'helper class', [00:02:14](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m14s) it doesn't do it on its own, you need to write the code for it. Let me show you where I did it in the controller(See video). There is an area if we open up company, called: 'PostsaveHook'. [00:02:38](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m38s)
Remember when we looked at the admin views we could target this area. That's exactly what I did. This is how we go about: I'm in the 'admin view' for 'company'. If I go to PHP you would see that I have some Ajax there and I have an area which is the 'postsavehook method'. [00:03:03](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m03s) In the postsavehook method, I'm basically checking some things, some values. If the user does not exist, A check is done (See video). Then the 'create user' is used. [00:03:41](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m41s) This placeholder convention has been mentioned before. Here you are using the brackets convention not the # one. [[[Component]]]Helper and this will be replaced with the components code name. It gets the helper class: create_user. In the helper class of this component, [00:04:13](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m13s) if this is closed, go to the helper and open the 'helper class'. That is the name 'costbenefitprojection'. It is the components name and then it's called helper. In helper class there is a feature called 'create_user'. [00:04:39](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m39s) It gets an array in it, and that array has some values which we will be using, like password 1, password 2. and it will set the password. I'm not going to explain this code. Basically it just shows you where the function is. The function was added to the components helper class and in that script, I'm simply calling that function after having build the user. I set the array as; 'name' and the email as 'validData'. The function, if there is no password set, will set a random password and again use another method which is also part of the helper class we've exported with all helper classes, this 'random [00:05:28](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m28s) method' where you can get a random string. That is creating a user and then it sets up the password and then it gets the array ready. It gets a model. The model, I got it from there, 'getmodel'. Again we are using a component builder custom method which gets the specific model from the system and then fires the register method upon this dataset and then updates [00:06:11](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m11s) the parameters for the system regarding this new user. Sends the email and then returns the ID. We need the ID. [00:06:41](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m41s) If you don't have the ID, it will send a message to the user and if we have the ID, it will store it into that database to connect that item to that user automatically and then click 'save'. That is custom scripting. [00:06:59](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m59s) <<<<<<<<<<<<<<<<<
Remember when we looked at the admin views we could target this area. That's exactly what I did. This is how we go about: I'm in the 'admin view' for 'company'. If I go to PHP you would see that I have some Ajax there and I have an area which is the 'postsavehook method'. [00:03:03](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m03s) In the postsavehook method, I'm basically checking some things, some values. If the user does not exist, A check is done (See video). Then the 'create user' is used. [00:03:41](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m41s) This placeholder convention has been mentioned before. Here you are using the brackets convention not the # one.'[[[Component]]]Helper' and this will be replaced with the components code name. It gets the helper class: create_user. In the helper class of this component, [00:04:13](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m13s) if this is closed, go to the helper and open the 'helper class'. That is the name 'costbenefitprojection'. It is the components name and then it's called helper. In helper class there is a feature called 'create_user'. [00:04:39](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m39s) It gets an array in it, and that array has some values which we will be using, like password 1, password 2. and it will set the password. I'm not going to explain this code. Basically it just shows you where the function is. The function was added to the components helper class and in that script, I'm simply calling that function after having build the user. I set the array as; 'name' and the email as 'validData'. The function, if there is no password set, will set a random password and again use another method which is also part of the helper class we've exported with all helper classes, this 'random [00:05:28](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m28s) method' where you can get a random string. That is creating a user and then it sets up the password and then it gets the array ready. It gets a model. The model, I got it from there, 'getmodel'. Again we are using a component builder custom method which gets the specific model from the system and then fires the register method upon this dataset and then updates [00:06:11](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m11s) the parameters for the system regarding this new user. Sends the email and then returns the ID. We need the ID. [00:06:41](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m41s) If you don't have the ID, it will send a message to the user and if we have the ID, it will store it into that database to connect that item to that user automatically and then click 'save'. That is custom scripting. [00:06:59](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m59s)
### Add UiKit
This little switch is just adding that Method to your helper class. That's all it does. Where as this switch adds the Uikit library to your media folder. As well as integrates it dynamically wherever you use [00:07:19](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m19s) the Uikit class names. You won't need to write that in any custom way, it automatically adds it. The same goes with FooTable.
All that this switch does is that it adds that method to your helper class. Whereas this switch adds the Uikit library to your media folder, as well as integrates it dynamically wherever you use [00:07:19](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m19s) the Uikit class names. You won't need to write that in any custom way, it automatically adds it. The same goes with FooTable.
### Add Global CSS To Admin Back End
This CSS is global CSS for all the back end views, entire back end. If you want to add CSS that would target the whole back end, then you do it here.
This CSS is global CSS for all the back end views. If you want to add CSS that would target the entire back end, then you do it here.
### Add Custom PhP Helper Admin Class
### Add Custom PHP Helper Admin Class
This is a place for you to add your own custom scripting to the helper_admin Class. [00:07:47](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m47s) As you can see I have a whole custom scripting here for Sermon distributor. For the admin area, as well as an event.
This is a place for you to add your own custom scripting to the helper_admin Class. [00:07:47](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m47s) As you can see ,here is a whole custom scripting here for Sermon distributor. For the admin area, as well as an event.
### Add Global Admin Event
I spoke about this event concept briefly before, but what we want to achieve with the event is basically on every page, [00:08:09](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m09s) if you look at this sermon distributor, the back end part of it, it has a file which is the in main file which Joomla calls first. Calls sermon distributor, and in that file it basically triggers that global admin event. The global admin event is nothing else than a function inside of your helper function. So it always triggers it, [00:08:40](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m40s) if you add that switch. Then it passes the document object. The document object is being built up here. I'm just passing it over to the global event. We don't need to clear it there. If I was to open the helper class, which we have here, and scroll to the top, it says here [00:09:08](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m08s) loaddropboxajax. This again it's just another function. I wrote that function that you can add whatever functions you want to run globally every time a page opens. That is a way to run it like a chronicle job on the front and the back end of the component. If you have things that you want to be done chronically, this feature is targeted at doing that. [00:09:35](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m35s) Here we are loading the LoadDropboxAjax. If we go back to the component, you see that I am just adding that script. First I just clicked global admin event yes. And I added that script. That's all they added. And that script was taken and placed inside of the global event. The trigger(globalevent) is set by component builder itself you don't need to write that. [00:10:03](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m03s) It will insert this(globalevent) trigger itself just because you clicked yes. You need to then just add the script that must run inside of the global event. Which I decided to be another function. And then this function which I want to run, I added to the admin view, you see here at the admin helper class. [00:10:29](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m29s) I added that function here. So I basically just used that(loadDropboxAjax) name, and called it "self", because we are inside of that class. That's how you call static class method. And a pass to save information. In my method I'm adding JavaScript to the dorm to the document object. I want that document and then I set addScriptDeclaration. [00:10:59](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m59s) That means on every page of this component in the back end, it adds this little script which then calls by Ajax which I explained previously. And it starts checking the Dropbox listing automatically. So that's an automatic feature I wanted to add to my component. And this is way that I did it. And then I felt that I want to add it that you can do this in other components. That's why I added this event switch.
This event concept has been briefly mentioned before, but what we want to achieve with the event is basically: Let me explain. [00:08:09](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m09s) If you look at the back end part of 'sermon distributor', it has a file which is the in main file which Joomla calls 'first', and in that file it basically triggers that global admin event. The global admin event is nothing else than a function inside of your helper function. So it always triggers it, [00:08:40](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m40s) if you add that switch. Then it passes the document object. The document object is being built up here. I'm just passing it over to the global event. There is no need to clear it. If I was to open the helper class, which we have here(See video), and scroll to the top, it says here [00:09:08](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m08s) 'loaddropboxajax'. This again is just another function. I wrote that function that you can add whatever functions you want to run globally every time a page opens. That is a way to run it like a chronicle task on the front and the back end of the component. If you have things that you want to be done chronically, this feature is targeted at doing that. [00:09:35](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m35s) In this instance we are loading the 'LoadDropboxAjax'. If we go back to the component, you see that I am just adding that script. First I just clicked global admin event 'yes' and added that script. That's all they added. That script was taken and placed inside of the global event. The trigger'globalevent' is set by component builder you don't need to write that. [00:10:03](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m03s) It will insert this'globalevent' trigger itself just because you clicked 'yes'. You need to then just add the script that must run inside of the global event. Which I decided to be another function and then this function which I want to run, I added to the admin view, you see here(See video) at the admin helper class. [00:10:29](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m29s) I added that function . So I basically just used that'loadDropboxAjax' name, and called it 'self', because we are inside of that class. That's how you call 'static class method' and pass same information. In my method I'm adding JavaScript to the document object. I want that document and then I set 'addScriptDeclaration'. [00:10:59](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m59s) That means on every page of this component in the back end, it adds this little script which then calls by Ajax which I explained previously and it starts checking the Dropbox listing automatically. This automatic feature has been added to the component so that you can do the same in other components. That's the purpose of the event switch.<<<<<<<<<<<<<<<<<<<<<<
### Add Custom PhP Helper Site View