diff --git a/006-Basic-Fields.md b/006-Basic-Fields.md index 32826e1..5819067 100644 --- a/006-Basic-Fields.md +++ b/006-Basic-Fields.md @@ -1 +1 @@ -Ok we are looking at creating Fields there are two groups I would go Call them Easy or Plain or Common Fuel types Which we will be looking at first We are also advanced fuel types which primarily is your custom field types Which will an undercut after we have covered the admin views and how you connect Fields two views It's quite important because those custom field types Really only makes sense if you see the relationship between views and fields And if you wife already have that knowledge Well We'll acquainted in able to handle Ok so we'll First look at the most more common fuel types Not all of them of course I'm just gonna illustrate to you the text field type And a list field type And all the other sort of follow the same kind of implementation So let's create a new field type We would select Text As our first illustration I need all the magic Lee load The fields here sent all the fuel types default settings we looked at previously When it comes to this information here You need to have a a well Formulated background formulate is all right word there Well it good background On MySQL To understand exactly the What is a varchar What is what is a text what is a medium takes long text Beta basic deleted data type In relation to the database Now I've added the feature of you being able to change that Because I wanted liberate your ability to develop Applications that are more advanced Then A cookie cutter kind of component Builder So this component builder really wants to leave Enough room For you too Make Very advanced choices And the more I constrain it To a sort of just click here there Don't know any code just go on and build something The more I am gonna frustrate the real developer who is wanting to design something more it well More versatile So I didn't choose that option there are component Builders out there that most possibly have done Done that But I don't want to I wanna give you enough tools to really be creative and so that means a little bit More complexity all over Because of that But if you know PHP and you have worked BHP in relation to sequel Or any other sequel database connections via Java or any other language You will know that there is such a thing as a data type and that has a length And it you can Set some default value to it And you can decide whether it's a key or you need P just realise if you said it as a unique ESA Index type then that means that specific field will only allow a value once And if that same value is placed in it it will you know shout at you and it will be an error So You hardly ever use that Not even for an alias will you refuse that because the alias Implementation in July deals with the duplication within the model When it saves the information It actually checks whether there is an alias in the database and increments the earlier so that it doesn't Conflict Even there you did not even need the That feature But it is available and you might see a need to use it so I added it there it you can choose it And then your normal nail switch weather at the table should be know if it's empty Usually Would use One of these default values and then said it not now Ok and then The story method you will most of the time use default This being because these other methods Require much more knowledge Of what you are trying to achieve And if you do have that knowledge Then I could say that Jason Will mostly be used When You are storing An array of items To the database And yet When you are using list which will look at just now you wouldn't need to use Jason because jumilla simpler Limitation of the list fuel type Deals with eraser ready Unless you are using sorry I I'm not saying that correctly If the list Allows for multiple selection Then you need to use Jason But as far as I can remember I think they let me just check here to be sure I mean the code And here is the place where we sort of deal with you know how are we gonna store the data Are we basically tripping the switches for it And let me just look Down here Ok So If the field type is checkboxes It will It will Going here And it will add it As a Jason Object If there is multiple selected It will add a visitation option object If that The type name is tag If you using a tag field type It will not go in here no matter what you do Let me see Store If it's not 0 which is default Then it will fall back onto this Now if it is check box and you have been selected One of those Features For example If you haven't selected one of these Jason Base64 And it is a checkbox Fuel type Then It will fall back 2 To Jason So that's the default switch So in the switch it takes with what you've said If you said it to Jason it will use Jason if you said it to base you use base Done in the Christian who's that But if you said none and it is a checkbox Eagle said it To Jason so Even if you said The checkbox to default We are still gonna make sure it's safe to say Jason because Zuma doesn't deal with checkboxes correctly In fact it tells you that has a warning on their pages The component Builder Knows that and so it well I know that is why I quoted then So did it wall anyway make sure that we storing it Jason Object and not just the array itself And so This is just looking at the check boxes and other Jason items Flat for the view And So for most things That we are looking at the UI If if we are not sure how the implementation works Looking at the code is the quickest way to actually understand what would be the way to select and now That means if you're not a PHP developer And you cannot figure out where this line Or this that particular area of code is being addressed Then obviously this is to your own Disadvantage But if you're able to Read PHP Then the compiler itself leaves in the In the XML files and Another files that you are building wait My offline here Another Models of things that it's building It is showing you in which file It is actually building this part of this group And exactly on what line So that is the way for you to get in there and see exactly what is being done And I will also help you to determine what you need to change for it to possibly work if it isn't working Now there is no way for me to avoid this And the reason why there is no way to avoid them My gym allow themselves Ok so going back to just a normal text field We would just leave it 2 Default These are the options of encryption We will explain in a later video And possibly will not Ever use these I had the need for them in an AC component that I had to develop And so I added This feature is in And it's is this stage it's really Quite difficult to implement If you do not have many Let me put it this way The basic one Which is actually more secure if you were a certain people Is easy to implement But the advanced one Which is for other purposes than just your normal encryption Is little bit more advanced and difficult to implement So for now if you not that it was in your programming skills then You should just avoid these This base64 is often used We storing code into the database A Most of component Builders areas where you can add custom scripting Is is using this base64 As the story method Ok so now we here if we gonna create an email field And I'm gonna say that it's not be required I'm gonna change this to 255 Leave this to default Change that Email This is the name surnames We Uz don't do uppercase And then That's what's gonna be used for the database right So this field All over The system and all the code Is gonna be called by that Name Email Underscore Sorry Lowercase Email Can hear the name The label Is what will be visually seen in the form So They will be adding enter email Will leave the text size the same Max length is good I'm not gonna use it before field and it is if I sorry did It's optional so I can just leave it out Description I'm gonna say an enter Email Gay Remove does relief required False To ensure that it isn't required And then I'm gonna use validate email And I'm not gonna use the fuel option Option is to validate against another field that they both equal Each other We don't need that I'm here I'm gonna place there more Come on And I'm gonna leave those out Today we have an email field Now this validate Option There are some custom validating Auctions in July Email is one of them Then there is a way to create Your your own validation And The way to implement that would be to write PHP up for that so you need to know You know what's needed to Write your own validation And to place it Where are the custom adding in our fields Sorry files To place it in the correct location Where Form builder will be able to get that field validation type And added into your field So is you know What I'm talking about Then you will know where to place it And you later see that in the component Cell phone has an option to add custom Files And how to map it to the correct location Then you can use your own validation figure type there To extend on the validation of shins But currently component other itself doesn't do you know extra custom that it a thing Options it only uses to velocity faults Now that means you can also leave it out and then it doesn't do that it Asian but it still will do filtering And here is a list of the available filters that you'll allow us Ok so that's to create an email A field That is a text field You can target these text Fields with CSS and JavaScript respectively in the list and in the sea Single View The Deuce plural is the list you View single Is there a Single View till the edit view in the backend And all Both of these out most Is targeting The editing view and the listview in relation to its back in display If you extend the editing View to the front Then it will also load the JavaScript to the front But You cannot extend the list you to the front you need to build a custom front Which we will eventually get to which is called site views Ok so this is primarily targeting your admin area Movie scripts Like I said you can extend the the editing one which is this view Single View To the front Which means it will also extend that to the front The way to Target it this field Whitby That is the ID Plus g402 if you forget that You could look at any other Field And you'd see it says J for underscore And then the field name As a ID I'm just using 5 buck do that And So you that means you can just infront of this e-mail Jason from that email you just put Not in here though But if you want to Target In your JavaScript in your CSS let me show you Are you there J4 Underscore Now you can target it with CSS maybe gala or something That's gonna make it invisible but you can type it in Let's make it black Ben And The JavaScript in the same way if you view jQuery At Underscore in front of the former name The field names are And the nice thing about this Is that you can Add this group to the field And in any view where you use this field The Script wow Following It will go along with it So it will be added to that View Dynamically you don't need to rewrite it everywhere So soon as you working For example I have a I have a script The means to show you That I'm using 4 numbers Movie Nice to show you how the moment Ok found even a better option to demonstrate I had to create a repeatable field Which will not cut later is an advanced fuel But inside of that repeatable field I wanted to add a A date field Now Those of you that work with whom I will know that you can currently Not add A date field Repeatable field So what we did And this is gonna Possibly be very impressing But let me show you I simply used a text field And I added that To it As you can see here we have PHP Riding this JavaScript block And way to add PHP here is he would do the open brackets Question mark PHP And then again Question mark close There there is an a PHP and we are adding the URL jQuery framework Now I would describe I added to the repeated fields Script area not to the actual text field The reason why I didn't add it to the actual text field Because the text field is obviously gonna be repeated right so you gonna have 10 20 whatever takes That that specific text field But with this code I'm able to Target Up to 50 repeats of that Fuel price With Good at saying ok field number we said at least 50 lol And this JavaScript area is being repeated 50 times and increment it incrementally And so the course date field Date again this ID I got from after creating repeated field I went in and looked at the ideal That feel Add a datepicker Can I set the value of the date picker And Basically added to the field And it works very well so Discuss the scripting area For JavaScript can also take PHP inside of it And JavaScript That will be then added to the view in which this field is gonna be used And it's I think it's very very nice feature that we have And it's very useful It's common very useful for myself anyway Ok so we not gonna do that we just wanna use it for creating a simple email field So we will just click save or save and close SA venue So that's looking at creating a text to your type now let's quickly do a list view a list field Sorry Northview So we tick on list And we see that has An option Arrival Stream here How the options are set with a zero Pipe And then the name In a coma now that basically represents one item In the drop down So if you see this drop down here Then Then that is one item That is an item That is an item ok So each of those Would basically be represented between the cars The pipe Makes a separation between the value being stored in the database And a value being shown Today To the person accessing the form Now if that value is the same value So if it If you want to store in the database the same value as the one that Is being Displayed Can you simply drop off The fight with D Initial values like that So it will say option 12 and then that should be See right Option 3 Now That is another Allowed way to use it Or you could say I want one option to be viewed as having not selected anything yet so if you wanted to say Say option 1 Ok I wanna add another option You would say Please Select Auction Comma Bye By adding Because it's getting too long here Select an option By adding a pipe without a value Is being treated as a no So when the form when the dropdown is built Then it will it will be like nothing is selected Basically that option C select an option It's exactly what I did here although this is a custom field this type field I don't have one of those here Sorry But just that you know That will basically Behave the same as that one Gay And then the other values would be selecting And I have a you can use it as it is Or is even a total different value like that it doesn't matter just know that it possibly We would make everything lowercase which if you put it that side of the pipe Now This could be left Out And you can fill in these information based on your requirements So that's how you set up a list field I hope that Shows you what is Possible But as you can see this list field isn't dynamic In the way that a custom field possibly can be You see the list for your Gear you study to set a few values that is on changing and which should be soon But with the custom field type which will look at it latest video Hey you can I have another tables values populated the list for you So as it's been created your list gets longer Dynamically and will still look at that and that is obviously available but this is a More static said it wants music over and over where is there is actually We also a dynamic list option which I will never straight later Well that is creating a list for you Let's Quickly also look at a radio button Just very similar If you do Creating a radio button There is no one point to make here If you create a radio button It's see that there are only two values And you can add more than 2 to 2 the list but I always Think of it this way As soon as it becomes a list of values then use a list A radio button should at most have 3 selections or maybe at most 4 and really depends on the Length of the text So if it's yes no and maybe and No thank you oh my Yes No Maybe Not yet decided so that's four options Ok so that could be ok But as soon as it gets a fit value possibly you should look at a list instead Begin with a radio button you can just leave it at You know the default storing method And again the fields Attributes of Very similar to the text Tribute except for this Options array option here Then also liked the list Fuel type in a separated by comma And the store value and the display value a separate bit by a pipe Now it is important to note that You cannot use These Exclamation marks inside Sorry not exclamation quotation marks inside of your values If you wanna use Quotations inside you need to look up the html equivalent Of that Rotation marks and use that And then it all It will work but if you had a Quotation Inside here it will literally break off The Stream right there and you have only one value show up so that's just that you know Ok so that is a radio button let's look at another one quickly colour I'm in is quite straight forward it has a default value you need to remember to set the label and the name Always the type It must not be changed And if you select colour rear And you do change the type You realise that the component builder will simply ignore what you did here And also back to back It will not Because it is a field which When we set up the fuel type The type itself Was said to be mandatory and unchanging remember And That's why you you cannot override it Everything that you said to mana tree and unchanging Will fall back to the setting that you said there in the fuel type and it even if you change it here it will not Change Ok then there is the description And if it's required and show on again the show on feature is something that is very nice As we go we will get to see it in action But you can have a fuel like For example A list field which has an ID to which should be selected So did this colourfield should show So you could say Let's say that this Fields name is Access Or What would be an ideal Let's save you View And then One Would be If in the view field The option with the Value Of 1 is selected then will this field only show up No you can have it F1 Or 4 is selected Then it will show up This implementation is your Gmail Default implementation of the show on field Unfortunately It cannot target multiple other Fields yet as far as I know And that's why we have Important building our own implementation which is far more advanced And which will look at once we get 2 views Ok so that's just looking at colour And and Let's see Another one that's quite interesting is category I suppose In category You have Extension And this extension if you read it Is the name of the extension for which the category will be retrieved for example To list content categories use the value column content You can add also target 1 View Use the value Come underscore component Dot view What that means is that you can just by adding the category field Do a View You Automatically add a category to your component so it will you don't need to map the category at all Thank you cannot map with even if you wanted to Joomla Already has a category component in place And if you add a category of this category type field to which we are looking at now obviously you can Add your own category View And then use a custom field to link it's values to you to other views But if you are gonna use Gmail as category implementation that integrates with your component Then this is the way you do it and then you don't write anything for the category area the Because that itself and adds it to your component dynamically and the only thing You need to do is actually an extension Add your components name now we haven't looked at your component name And that In fact I think we possibly come back to category When we have Come to you know that area of Sermon distributor and where we add in categories to certain views But that you know The categories Can also be targeting just a specific view instead of the whole component itself So it can only be related even to just one specific View Which makes it nice that means you can have a category for listviews you can have a category for Food that you can have a category for this you can have multiple categories in one component This is maybe an overkill but it's none the less possible and the way you do that is Simply your component name Run and the specific views name And obviously the view must be in singular You you cannot target a list view it must be a editable Single View So it is only saying View Ok so that's looking at category will look at category again later stage where we actually will implement Edit is also a very Common Field Which were often using And the editor is Washington in your Joomla content article manager is that big block in which you articles are placed So here you can add such a block to your component And There are some Important things like the buttons and if you read the description we have here it explains to you how it works And including the Hide option And what kind of editor you want to load Obviously You're preferrable one and the alternative one Desire directive And the button option here is really like I said you can read it Hide buttons based on what you selected And then you have a filter option here and required Basically again your normal attributes as with with other fuel types In July Since most of them are extending your base field in Jamal and then Type in name and label and defaulted Bee stings are also available to all the others So that's quickly the editor C Media Just make sure with media that you Select the correct directory If none is said I think it falls back to y22 images What you can start with a specific directory inside of images And I can see there it's mandatory so you need to set it And you can only Target Images itself which is a limitation from Joomla site So that that directory starts at images right so says the attribute should be relative to the top level Images for the So that means let's see you you want to Target a specific folder inside images School food Then you would add that they're like that And then preview if an image is been selected do you want Image to be able to be previewed By her bring over the side of the field and you just change it to true if you want to Again the show on feature is here in the other beforward concepts that we've already discussed Another one that's nice Is notes Notes is basically about a field or like here if we said this is a note But you seeing here And so you can add notes Around your fields And it has very nice Implementation right over there But you can read through And Yeah I think that will be all for us looking at fuel types Well basically looking at the basic field types Common Field types If there is any other field types of you felt You need help with Please look up the Joomla documentation since the implementation is moral a straight forward Trying to not Resign the wheel We simply trying to implement tomorrow's way of doing it And so is he there it is if you type you need more information on you can simply Go look at you Millers documentation on that field type and if they don't have documentation then Can you can go into The field Like I said libraries Healthy places to look CMS Joomla and Legacy in the libraries folder Is the places where these Fields of found So if you look under the CMS folder UK Bipasha fuel type From style content editor to the editor So you wanna know if there is more attributes that Can be used in editor You can open the editor and look through the code And see the The attributes that are Being implemented across the board here it says sent height with acid value offer value So It Goes On And if you see that there is a attribute that we are not already targeting You can like I have to explain Go to the field type open it At the attribute After the name at the value set with its mandatory obviously I think if we left it out it's not And whether it's translatable translatable is an important concept Which not all fields are translatable and And when a field is translatable Sermon sorry component but basically translate it for you So If you look at The It's use this acronym for example You see I added there the label s acronym Then well component builder builds this field into your component it takes that value And it Converts it into a translatable stream widget as to the language file And it adds that In here so that if somebody updates the language file it updates everywhere in the system Which is basically means that Languages are implemented everywhere in component Builders components All the components it's building it translates label for everything that you said to be translatable So if we If we look at Let's go look at a certain Fuel type my text Any property That you said is translatable like here the label is yes And description is yes And that seems to be it Heat it is also translatable it's also said to us Means that you're my world Dynamic not you money Component Builder Will dynamically take hint And translated into a trance as a language string added to your language file And replace the XML with the language string like it's TUT here So That is How you can extend existing fuel types And create Fields with them I hope that is Good enough for you to get your hands into How to get excited about it in to use it Obviously having Fields might still feel very Primitive wall And so next up will be looking at Adding those Fields to views And basically making building your view Itself \ No newline at end of file +Ok we are looking at creating Fields there are two groups I would call Call them Easy or Plain or Common Field types Which we will be looking at first [00:00:15](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m15s) There are also advanced field types which primarily is your custom field types Which we'll only look at after we have covered the admin views and how you connect Fields to views It's quite important because those custom field types Really only makes sense if you see the relationship between views and fields And if you've already have that knowledge Well Well acquainted and able to handle Ok so we'll First look at the most more common field types Not all of them of course I'm just gonna illustrate to you the text field type [00:00:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m54s) And a list field type And all the other sort of follow the same kind of implementation So let's create a new field type We would select Text As our first illustration and it will automatically load The fields here set on the field types default settings we looked at previously When it comes to this information here You need to have a well [00:01:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m29s) Formulated background formulate is not right word there Well a good background On MySQL To understand exactly the What is a varchar What is what is a text what is a medium text long text these are basically the data type In relation to the database Now I've added the feature of you being able to change that Because I want to liberate your ability to develop [00:02:04](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m04s) Applications that are more advanced Than A cookie cutter kind of component Builder So this component builder really wants to leave Enough room For you too Make Very advanced choices And the more I constrain it To a sort of just click here there [00:02:25](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m25s) Don't know any code just go on and build something The more I am gonna frustrate the real developer who is wanting to design something more advanced More versatile So I didn't choose that option there are component Builders out there that most possibly have done Done that But I don't want to I wanna give you enough tools to really be creative and so that means a little bit More complexity all over Because of that But if you know PHP and you have worked [00:02:59](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m59s) with PHP in relation to sequel Or any other sequel database connections via Java or any other language You will know that there is such a thing as a data type and that it has a length And it you can Set some default value to it And you can decide whether it's a key or a unique key just realise if you set it as a unique key as a Index type then that means that specific field will only allow a value once And if that same value is placed in it it will you know shout at you and it will be an error So [00:03:38](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m38s) You hardly ever use that Not even for an alias will you use that because the alias Implementation in Joomla deals with the duplication within the model When it saves the information It actually checks whether there is an alias in the database and implements the alias so that it doesn't Conflict so even there you do not even need the That feature But it is available and you might see a need to use it so I added it there so you can choose it And then your normal null switch whether the table should be null if it's empty [00:04:15](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m15s) Usually you would use One of these default values and then set it not null Ok and then The story method you will most of the time use default This being because these other methods require much more knowledge Of what you are trying to achieve And if you do have that knowledge Then I could say that JSON [00:04:42](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m42s) Will mostly be used When You are storing An array of items To the database And yet When you are using list which we'll look at just now you wouldn't need to use JSON because Joomla's implementation of the list field type Deals with arrays already Unless you are using sorry I'm not saying that correctly [00:05:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m09s) If the list Allows for multiple selection Then you need to use JSON But as far as I can remember I think let me just check here to be sure I'm in the code And here is the place where we sort of deal with you know how are we gonna store the data Or we basically tripping the switches for it And let me just look Down here Ok [00:05:37](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m37s) So If the field type is checkboxes It will It will Going here And it will add it Is it JSON Object If there is multiple selected It will add it as a JSON option object [00:05:56](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m56s) If The type name is tag so if you using a tag field type It will not go in here no matter what you do Let me see Store If it's not zero which is default Then it will fall back onto this Now if it is check box and you haven't selected One of those [00:06:22](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m22s) Features For example If you haven't selected one of these JSON base64 And it is a checkbox Field type Then It will fall back [00:06:47](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m47s) To JSON So that's the default switch So in the switch it takes what you've set If you set it to JSON it will use JSON if you set it to base it will use base if you've done an encryption it will use that But if you've set none and it is a checkbox it will set it To JSON so Even if you set The checkbox to default [00:07:12](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m12s) We are still gonna make sure it's safe as JSON because Joomla doesn't deal with checkboxes correctly In fact it tells you that has a warning on their pages The component Builder Knows that and so well I know that is why I coded it in So that it will anyway make sure that we storing it JSON Object and not just the array itself And so This is just looking at the check boxes and other JSON items for the view And So for most things [00:07:47](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m47s) That we are looking at the UI If we are not sure how the implementation works Looking at the code is the quickest way to actually understand what would be the way to select and now That means if you're not a PHP developer And you cannot figure out where this line Or this that particular area of code is being addressed Then obviously this is to your own Disadvantage But if you're able to Read PHP [00:08:20](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m20s) Then the compiler itself leaves in the In the XML files and Another files that you are building wait I'm way off line here in other Models of things that it's building It is showing you in which file It is actually building this part of this group And exactly on what line So that is the way for you to get in there and see exactly what is being done [00:08:52](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m52s) And that will also help you to determine what you need to change for it to possibly work if it isn't working Now there is no way for me to avoid this And the reason why there is no way to avoid them by Joomla themselves Ok so going back to just a normal text field We would just leave it to Default These other options of encryption We will explain in a later video [00:09:22](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m22s) And possibly will not Ever use these I had the need for them in a component that I had to develop And so I added those features in And at this stage it's really Quite difficult to implement If you do not have many Let me put it this way The basic one Which is actually more secure if you would ask certain people [00:09:50](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m50s) Is easy to implement But the advanced one Which is for other purposes than just your normal encryption Is a little bit more advanced and difficult to implement So for now if you're not that advanced in your programming skills then You should just avoid these This base64 is often used where you're storing code into the database Most of component Builders areas where you can add custom scripting Is using this base64 [00:10:22](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m22s) As the story method Ok so now here if we gonna create an email field And I'm gonna say that it should not be required I'm gonna change this to 255 Leave this to default Change that to Email This is the name surnames We [00:10:47](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m47s) Uzusally don't do uppercase And then That's what's gonna be used for the database right So this field All over The system and all the code Is gonna be called by that Name Email Underscore [00:11:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m09s) Sorry Lowercase Email And here the name The label Is what will be visually seen in the form So There we'll be adding enter email We'll leave the text size the same Max length is good I'm not gonna use the default field and it is if I sorry did [00:11:36](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m36s) default is optional so I can just leave it out Description I'm gonna say add enter Email okay we're remove those we're going to leave required to False To ensure that it isn't required And then I'm gonna use validate email And [00:12:08](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m08s) I'm not gonna use the field option The field option is to validate against another field that they both equal Each other We don't need that for this field I'm here I'm gonna place demo Come on And I'm gonna leave those out So there we have an email field Now this validate [00:12:42](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m42s) Option There are some custom validating option in Joomla Email is one of them Then there is a way to create Your own validation And The way to implement that would be to write PHP up for that so you need to know You know what's needed to Write your own validation [00:13:07](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m07s) And to place it via the custom adding in our fields Sorry files To place it in the correct location Where the Joomla Form builder will be able to get that field validation type And add it into your field So if you know What I'm talking about Then you will know where to place it [00:13:31](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m31s) And you'll later see that in the component itself it has an option to add custom Files And how to map it to the correct location Then you can use your own validation figure type there To extend on the validation options But currently component builder itself doesn't do you know extra custom validating Options it only uses Joomla's defaults Now that means you can also leave it out and then it doesn't do validation but it still will do filtering And here is a list of the available filters that Joomla has [00:14:08](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m08s) Ok so that's to create an email A field That is a text field You can target these text Fields with CSS and JavaScript respectively in the list and in the Single View The views plural is the list you View single Is the Single View will the edit view in the backend And all Both of these are most Is targeting [00:14:36](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m36s) The editing view and the listview in relation to its backend display If you extend the editing View to the front Then it will also load the JavaScript to the front But You cannot extend the list to the front you need to build a custom front Which we will eventually get to which is called site views Ok so this is primarily targeting your admin area with these scripts altough Like I said you can extend the the editing one which is this view the Single View [00:15:10](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m10s) To the front Which means it will also extend that to the front The way to Target it this field Whould be That is the ID Plus j form if you forget that You could look at any other Field And you'd see it says j form underscore And then the field name [00:15:38](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m38s) As a ID I'm just using fire bug to do that And So you that means you can just infront of this e-mail Just in front of that email you just put Not in here though But if you want to Target it In your Java Script in your CSS let me show you Are you there J4 [00:16:08](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m08s) Underscore Now you can target it with CSS maybe color or something That's gonna make it invisible but you can target it anyway Let's make it black then And The JavaScript in the same way if you use j query Add j form underscore in front of the form name The field name sorry And the nice thing about this [00:16:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m54s) Is that you can Add this group to the field And in any view where you use this field The Script will Follow it It will go along with it So it will be added to that View Dynamically you don't need to rewrite it everywhere So soon as you working For example I have a [00:17:16](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m16s) I have a script The means to show you That I'm using for numbers that will be Nice to show you hold on for a moment Ok found even a better option to demonstrate I had to create a repeatable field Which we will look at later as a advanced field But inside of that repeatable field I wanted to add a A date field [00:17:49](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m49s) Now Those of you that work with Joomla will know that you can currently Not add A date field Repeatable field So what we did And this is gonna Possibly be very impressing But let me show you I simply used a text field [00:18:12](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m12s) And I added that To it As you can see here we have PHP right in this JavaScript block And way to add PHP here is we would do the open brackets Question mark PHP And then again Question mark close There is an a PHP and we are adding the j Query framework Now this script I added to the repeated fields [00:18:45](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m45s) Script area not to the actual text field The reason why I didn't add it to the actual text field Because the text field is obviously gonna be repeated right so you gonna have 10 20 whatever text fields That that specific text field But with this code I'm able to Target Up to 50 repeats of that Field With [00:19:11](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m11s) that saying ok field number we said at least 50 And this JavaScript area is being repeated 50 times and incrementally And so the course date field Date again this ID I got from after creating repeated field I went in and looked at the ID That field Added a date picker Can I set the value of the datepicker And Basically added to the field [00:19:43](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m43s) And it works very well so this custom scripting area For JavaScript can also take PHP inside of it And JavaScript That will be then added to the view in which this field is gonna be used And it's I think it's very very nice feature that we have And it's very useful It's come in very useful for myself anyway Ok so we not gonna do that we just wanna use it for creating a simple email field So we will just click save or save and close [00:20:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m17s) and save and new So that's looking at creating a text field type now let's quickly do a list view a list field Sorry Not view So we click on list And we see that has An option aray or String here now the options are set with a zero [00:20:45](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m45s) and a pipe And then the name In a coma now that basically represents one item In the drop down So if you see this drop down here Then Then that is one item That is an item That is an item ok So each of those [00:21:05](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m05s) Would basically be represented between the comas The pipe Makes a separation between the value being stored in the database And a value being shown To the person accessing the form Now if that value is the same value So if it If you want to store in the database the same value as the one that Is being [00:21:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m29s) Displayed then you simply drop off the bipe with the Initial values like that So it will say option 1 2 and then that should be 3 right Option 3 Now That is another Allowed way to use it [00:21:50](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m50s) Or you could say I want one option to be viewed as having not selected anything yet so if you wanted to say Say option 1 Ok I wanna add another option You would say Please Select option Comma By [00:22:15](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m15s) By adding leave that please Because it's getting too long here Select an option By adding a pipe without a value Is being treated as a nul So when the form when the dropdown is built Then it will it will be like nothing is selected Basically that option see select an option It's exactly what I did here although this is a custom field this type field [00:22:57](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m57s) I don't have one of those here Sorry But just that you know That will basically Behave the same as that one OK And then the other values would be selecting And I have a you can use it as it is Or is even a total different value like that it doesn't matter just know that it possibly We would make everything lowercase which if you put it that side of the pipe [00:23:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m29s) Now This could be left Out And you can fill in these information based on your requirements So that's how you set up a list field I hope that Shows you what is Possible But as you can see this list field isn't dynamic In the way that a custom field possibly can be [00:23:55](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m55s) You see the list field here you staticly set a few values that is unchanging and which should be selected But with the custom field type which will look at in a later video you can I have another tables values populated the list for you So as it's been created your list gets longer Dynamically and will still look at that and that is obviously available but this is a More static said it once and use it over and over where is there is actually Were there is also a dynamic list option which I will illustrate later Well that is creating a list view Let's [00:24:39](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m39s) Quickly also look at a radio button Just very similar If you do Creating a radio button There is though one point to make here If you create a radio button You see that there are only two values And you can add more than 2 to the list but I always Think of it this way [00:25:04](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m04s) As soon as it becomes a list of values then use a list A radio button should at most have 3 selections or maybe at most 4 and really depends on the Length of the text So if it's yes no and maybe and No thank you oh my Yes No Maybe Not yet decided so that's four options Ok so that could be ok But as soon as it gets a 5th value possibly you should look at a list instead again with a radio button you can just leave it at You know the default storing method [00:25:41](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m41s) And again the field Attributes are Very similar to the text attributes except for this Options array option here Then also liked the list Field type it is separated by comma And the store value and the display value are separated by a pipe Now it is important to note that You cannot use [00:26:06](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m06s) These Exclamation marks inside Sorry not exclamation quotation marks inside of your values If you wanna use Quotations inside you need to look up the html equivalent Of that quotation marks and use that And then it all It will work but if you add a Quotation [00:26:38](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m38s) Inside here it will literally break off The String right there and you have only one value show up so that's just that you know Ok so that is a radio button let's look at another one quickly colour Colour is quite straight forward it has a default value you need to remember to set the label and the name Always the type It must not be changed And if you select colour here And you do change the type You realise that the component builder will simply ignore what you did here And also back to back [00:27:16](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m16s) It will not Because it is a field which When we set up the field type The type itself Was said to be mandatory and unchanging remember And That's why you you cannot override it Everything that you said to mandatory and unchanging Will fall back to the setting that you said there in the field type and it even if you change it here it will not Change [00:27:44](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m44s) Ok then there is the description And if it's required and show on again the show on feature is something that is very nice As we go we will get to see it in action But you can have a field like For example A list field which has an ID 2 which should be selected So did this colourfield should show So you could say Let's say that this Fields name is Access Or [00:28:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m17s) What would be in our ideal Let's say View And then One Would be If in the view field The option with the Value Of 1 is selected then will this field only show up [00:28:39](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m39s) No you can have it if 1 Or 4 is selected Then it will show up And this implementation is your Joomla Default implementation of the show on field Unfortunately It cannot target multiple other Fields yet as far as I know And that's why we have in component builder our own implementation which is far more advanced And which will look at once we get to views [00:29:07](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m07s) Ok so that's just looking at colour And and Let's see Another one that's quite interesting is category I suppose In category You have Extension And this extension if you read it Is the name of the extension for which the category will be retrieved for example To list content categories use the value com content [00:29:42](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m42s) You can add also target 1 View Use the value Com underscore component Dot view What that means is that you can just by adding the category field to a View You Automatically add a category to your component so it will you don't need to map the category at all in fact you cannot map with even if you wanted to [00:30:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m09s) Joomla Already has a category component in place And if you add a category well this category type field to which we are looking at now obviously you can Add your own category View And then use a custom field to link it's values to you to other views But if you are gonna use Joomla's category implementation that integrates with your component Then this is the way you do it and then you don't write anything for the category area Because Joomla do that itself and adds it to your component dynamically and the only thing You need to do is actually an extension [00:30:48](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m48s) Add your components name now we haven't looked at your component name And that In fact I think we possibly come back to category When we have Come to you know that area of Sermon distributor and where we add in categories to certain views But that you know The categories Can also be targeting just a specific view instead of the whole component itself So it can only be related even to just one specific View [00:31:25](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m25s) Which makes it nice that means you can have a category for listviews you can have a category for that you can have a category for this you can have multiple categories in one component This is maybe an overkill but it's none the less possible and the way you do that is Simply your component name and the specific views name And obviously the view must be in singular You you cannot target a list view it must be a editable Single View So it is only saying View Ok so that's looking at category will look at category again later stage where we actually will implement it Editor is also a very Common Field [00:32:11](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m11s) Which were often using And the editor is what is in your Joomla content article manager is that big block in which you articles are placed To here you can add such a block to your component And There are some Important things like the buttons and if you read the description we have here it explains to you how it works And including the Hide option And what kind of editor you want to load Obviously You're preferrable one and the alternative one [00:32:44](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m44s) Desired or alternative And the button option here is really like I said you can read it Hide buttons based on what you selected And then you have a filter option here and required Basically again your normal attributes as with with other field types In Joomla Since most of them are extending your base field in Joomla and then Type in name and label and defaulted These things are also available to all the others So that's quickly the editor [00:33:24](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m24s) let's see Media Just make sure with media that you Select the correct directory If none is set I think it falls back to images but you can target with a specific directory inside of images And I can see there it's mandatory so you need to set it And you can only Target Images itself which is a limitation from Joomla side So that that directory starts at images right so says the attribute should be relative to the top level [00:34:01](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m01s) Images folder So that means let's see you you want to Target a specific folder inside images called foo Then you would add that they're like that And then preview if an image is been selected do you want Image to be able to be previewed By hovering over the side of the field and you just change it to true if you want to Again the show on feature is here in the other default concepts that we've already discussed Another one that's nice Is notes Notes is basically above a field or like here if we said this is a note [00:34:43](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m43s) that you see here And so you can add notes Around your fields And it has very nice Implementation right over there But you can read through And Yeah I think that will be all for us looking at field types Well basically looking at the basic field types or Common Field types [00:35:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m09s) If there is any other feel types with you felt You need help with Please look up the Joomla documentation since the implementation is more or less a straight forward Trying to not Redesign the wheel We simply trying to implement Joomla's way of doing it And if there is a field type you need more information on you can simply Go look at Joomla's documentation on that field type and if they don't have documentation then Can you can go into [00:35:41](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m41s) The field Like I said libraries there are 3 places to look CMS Joomla and Legacy in the libraries folder Is the places where these Fields of found So if you look under the CMS folder you got captcha field type chromestyle content editor so there's the editor So you wanna know if there is more attributes that [00:36:06](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m06s) Can be used in editor You can open the editor and look through the code And see the The attributes that are Being implemented across the board here it set height with $ value author value author field set So It Goes On And if you see that there is a attribute that we are not already targeting You can like I have to explain Go to the field type open it Add the attribute [00:36:37](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m37s) Add the name add the value set with it is mandatory obviously I think if we left it out it's not And whether it's translatable translatable is an important concept Which not all fields are translatable and And when a field is translatable Sermon sorry component builder basically translate it for you So If you look at The It's use this acronym for example You see I added there the label as acronym Then while component builder builds this field into your component it takes that value [00:37:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m17s) And it Converts it into a translatable string which adds it to the language file And it adds that In here so that if somebody updates the language file that updates everywhere in the system Which is basically means that Languages are implemented everywhere in component Builders components All the components it's building it translates label for everything that you said to be translatable So if we If we look at Let's go look at a certain Field type like text [00:37:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m54s) Any property That you said is translatable like here the label is yes And description is yes And that seems to be it Hint is also translatable it's also said to yes Means that Component Builder Will dynamically take hint And translated into a language string added to your language file And replace the XML with the language string like it's done here [00:38:31](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m31s) So That is How you can extend existing field types And create Fields with them I hope that is Good enough for you to get your hands into or to get excited about it in to use it Obviously having Fields might still feel very Primitive And so next up will be looking at [00:38:59](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m59s) Adding those Fields to views And basically making building your view Itself diff --git a/007-Admin-Views.md b/007-Admin-Views.md index f66c895..fab41cd 100644 --- a/007-Admin-Views.md +++ b/007-Admin-Views.md @@ -1 +1 @@ -Hi We are looking at admin views Which is The next thing to be setting up In Developing your car So first we started with Fuel types Looking at How to setup your types of improve on them Then We looked at how to use those field types to build Basic Common fields Now we gonna look at how to take those fields And add them To admin views Admin views Like I explained in our initial General planning Video It is basically from the BedRock The basis of your Components database structure Do admin views is where your Database Structure is being Developed All your admin views which have their own table Nice we explained admin views have a single Name and it has a list record Your name And then there is a sister name And the reason why there they actually have Is that let's say you have Wanna reuse this Specific admin View In another component With the same name but obviously adapting it to that component The idea would be that you would then have to preacher Showing up in your selection list When you added to the component And so that might be difficult to discern Which is which And so You can add the name of that specific component As part of Just differentiating between The same Names That means you can have Admin views with the same name But with different implementation Fact that is how You can do different version control Concepts on Components Using the same admin do Just inside of it Making a few changes and in Saving it So you could do that Open preacher for example And India You could say free virgin This is the free version and then say there's coffee Then you can Change the field that is linked You can change some of the link views You can change some of your CSS will whatever Are there things you have done Regarding this admin review And then go to the free version of that component And Link the That specific one That is if you instead of the other Anyway maybe I'm getting head of myself I usually So let's focus now Great mutton you your busy just kick new I'm gonna run Open Twitter again because this is the one we are using As a restoration And You would See that there should be a name for a single record Again that is where you would edit This records so that is In this case I said preacher And then there is a list of Records And that's preachers Then a short description And a normal Justice scription Depending on What you would like to say Then there is a type now the read write and the read only Changes the components editing Have you If you say read only Then it will basically limit The fields to being not you will not be able to edit them If you remember in the In this area wait Here The modified by field cannot be edited Because it's done automatically and when it was modified is Is also updated us every time you You click save So this area count be edited and that's how all The fields are gonna look If you select Read on If you if you leave it on read write it will look like this I know you will be able to edit it Ok so that is Looking at this Fields now there is a place for an icon Via over the icon It gives you the dimensions that is This basically is the icon Then when you look At The dashboard These icons Are the one selected there Ok so You can see that The icon has two of them one is the add icon And one is there just a normal icon so if I have our year You should see the image of Set in In your In yours Images folder sorry So if you open this It goes to your image father is select the icon When your helper here obviously those images In this And then if you gonna add creatures are you if you gonna add a field Just a field Call category that is of the category type Then you should add a category icon Since then The system will automatically know ok then easily category setup And I'll look for this icon to use For that category And If you select Category field that is a general category for the whole component Which isn't directly linked To this View Then it will take the first view This is the mall look at which view when it processes it Which view is the first one And usually that would be the first one you Created And it will use the icon in that But to be on the safe side if you using 1 category for the mall Just said the same icon on them all But if you are gonna use a category Which is primarily focused on the preachers And you just gonna put preachers and a category Then you need to add a category I can't hear Four categories Download permission on switch It's got to do with your accessing and Updating of data So like you can see here We have View edit View edit State View edit own Views create Admin views delete Induce access at the new edit version Now this edit If it's set if your own this managing group and it set to a loud then you can edit it If you are a guest and it said to Deny I no Matter Where You are in The front or the back of the site You won't be able to edit Formation even if you have a Direct Link It won't allow you to edit it Now in also has view axe So somebody who might be not allowed to Edited May be allowed to View This Disdain Taunting in the backend in the listview Then it will show in the list view and they can see that it is there Now you might Think yourself why would ever wanna do that And you see because of your custom admin Views and the way that you can connect them to your admin views Which will look at later You might want to display the record and Just leavin custom admin link 2 To the data Let me give show an example of a Component that does that You see here There is a button underneath The camp the company name So I just played the record But If I was Like this one whose profile is set to To being locked If I was to click on this You tell me That I do not have the permission to edit it But if I was to click on this icon It actually loads the information that I Looking for And That is the difference The differences sometimes you wanna use a custom see this is a custom Admin View And you might want to Do something That is not Editing view but a custom View And then you would like one too Be able to see the record but not edited So that's really what What that is all about Ok so We are back here And we are looking at the missions So Opening this permission tab You'd see that there is edit a view edit View edit home View edit state and All these have been created usually when you open this it might look like That Look like that So you would set the first one and that you would see there are Two options one is core edit and one is view and it The core edit Means That You want to do a global Switch Now Let me try and explain that by opening Composite Builders options We haven't actually looked at this yet but it You see that it all components in Joomla you have what is called the great edit Delete Edit State edit own Is this list Of options Which means that if you select This ad You know that they can't create something Then It is applicable to Everything in this component Because it's a global setting so Everything that doesn't have a view name behind it Like this is a view name And it says access This is a view name Minutes but use But this is only bad shoes So that's the global for but use and this is only related to this view So you can say I am allowing them to Do a batch function But in this atman view I don't Want to allow Sorry Don't wanna allow them To do a batch from Or you could say You know what I wanna use inheritance So that means I'm gonna do that I want them to be able to do but from since here And in this view Now the reason why you can do it in two places then Is that you have a global switch to stop them from doing it But you can also locally to the view Tweak whether they are able to To edit Do some of these features So coming back to the Way that you would set that up If you don't want to have a separate Control For this View In relation to whether they can edit it or Or whether you could Change it all view it all these Possibilities Then you would you score Amkor with me that you would have only this one switch And if you say deny it will it automatically tonight for that View And any other view that is using Call or Who can be seen as Global When when you are setting it as View Interview It means that the system will generate A specific list of items Specially just for that View So if you look From there to there That's for your admin View They're too bears for your custom Admin View No that means When I sit up This in a component Builder I selected view edit And then I said in relation to each record in relation to the whole View And I selected Both So Then it will implement it for the For both And single record and it will improve minuted For your Global settings Now again it might feel I won't blame you with what I have just tried it Explaining Makes you feel calm Fused But Really The only way for you to make sense of this is if you know how to mulhouse provisional structure works So if you are using and you're my website And you have actually ever Gone to articles And opened options In a look at their permissions Then you'd see that they only have create edit Delete Edit State edit own And then these accessing of the control And this back silly This pic Global settings Now what we are doing as we simply adding More control Then only these default because the way this works In article manager you basically have 1 view That view is Arctic These are the views On S categories is another view but it really has another component It's not really Content The content component An admin features Is just another implementation It's not really a whole new Database It's ok so the point is You only really have to wear the most two views here And so when they look at options They know that if they tweak this permission they want it to be implemented For all the views related to article Well this component Builder you are able to build component Drop are bigger Then the company managing Article manager Ok I'm because of that We felt that your permissions must extend That you can target a specific view and not just all of them at once So if you want to Target a specific View You will select The View edit Actually this view Prefix Must be in your selection If you select Core That means you are saying I don't want to specifically target this view If I change it in the global settings which would be The ones without a view name in Front Everything Farm Here There Does other global settings Global export Global batch Mobile version Edit version Global create Delete Edit edit State not edit state is changing it from publish to unpublish those things Edit own means you might not have edit rights but he has in it own rights So that means whatever you create c can edit again In an egg Raid by is a field So Canada created by field Or Canada to create date field Now You'd see that This basically targets Fields that are sort of the default fields There is a way to Target Custom Fields Fields that were developed Outside of the default fields But that is not done in Here Show you where that is done this is just controlling your default Fields and your default Features with regards to Permissions And So you would first set up these permissions make sure that you set up all of those that you want to implement There is a list here of those I think is most general This might Grow with time But because we've moved The control of a single field Out of this Structure It actually means that we've made it scalable So this Promotional implementation here Is really only Target in your Your default fields All the fields that Already the system put in for you And the default Concepts like accessing This specific View Or deleting an item in the view or creating an item Or editing the created Field or editing the created by field Changing the state Edit own So those are the custom Default features If you wanna do a control on a specific field I'll show you that in a moment But That is the implementation Of permissions If you do not really Understand this I would suggest you make Effort To study up on Gmail as an implementation Sorry Off The promotional structure Then once you've really understood the ways umelala Handles this promotional structure Then you would have better grips on Setting up these poem Emissions Purview What is done in the code if you would like to see that It's basically in the code If your ready have developed a Component You see that it sets up Your blue balls This is the global now when I say Global I mean If you click on options Close this If you click on this button year options in any of the components You're going to the global settings Ok And These permissions here R Zoe's first that I've highlighted So it all goes And they have Links To the specific Views so there is the field View There is the Dynamic get view there is the custom admin View And you can see that they have there Related switches Ok but then there's also For each view their own Section And that causes jumala Do ad in an item a permission or tab With switching to control the permission for this one Individual item And We have tried our very best To implement these permissions actually The way that you want my dick I can in later videos going to the code and show you exactly how This permission structure is being implemented I think it's one of the features that makes component Builder Farm with balanced Then other component Builders out there Is the ability to add permissions structures to your component write inside of component Builder Through This Promotional switch Ok And so we will will definitely be speaking about this permission or structure As we go along The tap structure if you look at these we call them tabs Settings field CSS JavaScript PHP my Published And permissions The Publishing permissions R Pubs that are built Automatically For all Back end Admin views Would admin views Have this permission and while the permission only if if set And Published Will always be there In published we basically bundle your York the fields that are built Dynamically Without you having to set them What what With probably seeing all those Fields that you donate do not need to set Are always placed in Publishing And so everything else this MySQL tab year the PHP JavaScript CSS Fields and settings Are actually make sample of what tabs can be Now in preacher I actually setup Two tabs 1 quart Details And one called sermons Ok so there are two tabs in preachers So that means if you were to open the preacher Back in View First one would be called settings The second one will be called Sermons and then you'd see publishing and permission So that's how I would look Now when you create fields You see that there is a column here called tab And you then will select the number now the tags Are number from one tooth Whatever We don't start at zero or though that might have made more sense for programmers We started with One So first tab second tab And Because we are using A place different From the tabs we don't use the names So you need to remember that this is Dad one this is dad too So when you set up a field You need to tell us in which tab Do you want a place that feel Ok So That is what this tab Number here is All about Now you might say but where is tattoos in formation because they're sermons right Wow Because of the fact that sermons Is it actually A table on its own If we go out here We will see that there is a Apple viewport sermon And it is his own A bakkie in View And it has its own structure So How can I Get The sermons That is only related to this Preacher To be showing in the second tab for sermons What we created the thing called linked views The link views is the place where this is done So basically I selected sermon as the view I said it should Be placed in the second tab And in childcare Is preacher so if I think about sermons Which is the child Sermon is the child Preacher is the parent So you would always think of the parent as this the view in which you are the moment you are setting up the link View So that If you are in preacher The parent is preacher If you are in sermons The parent is sermon So depends on in which view your busy editing And so yeah When we talk about the child key This would be the database field name That that is to be looked at And the parent Field name that should be found inside of this So when we look at preachers Youth let's go back to Sermon Close this Ok we got cinnamon open here and if I open there his fields I don't need you Hair factory Easier to see Let's go to fields You see that there is a field called name Ok wait there's a field called Preacher Space Parodies Sorry Ok so this is the field That we want Connect to to With each other right So do to get The sermons that belongs to that preacher We need to get the ID of this field now that's a custom feel And we said that we are gonna look at custom fields Only after explaining the app Reviews so I'm gonna go into detail now But I'm gonna open that field None the less And I'm gonna show you that it's name is pretty And because that field Will be connected 2 sermon it means that in the database D i d Which is the key field Is gonna be saved in preacher So that means the ID of the preacher Is safe inside of the preacher Column In the database I need to show you that in the database itself Ok so here I am in the database With Suman distributor And I'm opening sermons And you'd see that we would scroll Until we see preacher And it has ID is in it And those are the ideas of the Preacher's themselves So if I was to go to preach sure Basically means that we are linking To this ID here Ok So Going back to our Link via concept That means the child Database table In which the ID of this preacher must be Found Is in preacher Apparent Key Would be this preachers ID And so by doing that The link that you will only show the servants That are related Do this Specific preacher And that is how the link views can be linked If you didn't select these correctly it won't load all of them Ok At work well So there needs to be that tight relationship Between the parent and the child View So Did there's also way To actually link An array from an array So let's say The person is able to select more than one preacher There is a way for you to also Type that but that would all be dealt with in advanced A concepts Since that is Well I could Explain some of it The best B That would be one of the syntax to use But like I said Think I possibly need to deal with this and advanced concepts Because we will know to look for the answer in this video So we'll stay with the basics here So the basic Way of linking a Another view would be to select that View From this dropdown Then say in which tab Then What is the child's Database table in which to look What is the parents value to use Doom 2 Build a relationship And then this add new button or no Is basically done when you look at a Close this When you look at Fields here You see it has a new button So you can in that switch there decide whether it should Show it would not I should tell you that if you say yes And you have In that view created the correct permission of structure 4 Whether somebody can create An item You can control the display of that New button With just setting the permission of that uses specific So if that user is in a group that doesn't have permissions to Create new items for 4 In this example 4 Preachers of sermons Then that new button will also not show up So we have that permission or wrapped Rounded buttons display method Ok That is so The Dubs Just looking at the tabs That's really what we were looking at And then explain to you The how to link Custom view also other views To it To other views So that you can have the data displayed inside if you tell her Basically this feature we have here So the fact that we are busy in preachers and we are able to display the fields That are being used Well As you can imagine These fields Are linked to preachers From this column here So we are using a Repeatable field structure And we are able to Lick Connect The field names To this View Now let me show you how I did that so I'm Looks like I'm gonna show you anyway Ok I'm opening the admin The View Which is the one we looking at I'm going to link two views And you see that I have there and are in the pointer And the world field So if you are Trying to connect A View to a To the From the parent An independent it is stored in at fields That's the database Caller Name so if we go to the database Go to Component Builder Admin views And we Wrong You see there's ad fields And if I open that You see that the way it stores it Is it stores the ID is then it stores the list So there's a way in which your Repeatable fields are stored by Joomla And the value that I need to look up is in field So in the repeatable field called up Feels There is a field called field And it should look for the ID of the Sorry of the Feels So it's looking at fields In the field Array For the ID is That it needs to fetch And the way you were it's not that in the Connect a A link to you As you would say that this is a capital R Four repeatable Fields basically that is the convention to To tell the system it's a repeatable field we looking in And inside of the repeatable field We must look in the Field array For those ideas and they should map to the child's ID So does that make sense I hope so Because that's the way it's done And if that wasn't a repeatable field but an array You would simply say your a And If if the array is just the values themselves you would drop off any pointer to Specific value But if it's an array with And it's actually a So if it's an associative array You would just add tin name Of the Dissociative key That it needs to look If it's just a normal day without Association Leave it So this would just tell the system it isn't her a And it needs to look Inside of those values for these ideas Ok so that's sort of explains the linking of an admin View To another admin View Now I'm getting on with The Setting up of fields Now since we've already created the field Beforehand You will Usually start out this way It all looks like that And the fields that you have created you would scroll down Eduloan list You just start with typing that Fields name Sorry for bringing it up to you Then it tells ask you whether you should Would like to show this field in the admin View The admin list for you And that means If you've closed Your Editing area There is a list of names here And if you want That specific field to show up in this list Then you would select Show If you select it show you could tell us in which order you wanted Must be the first one second one And we fought while you shouldn't do more than 100 look that Ridiculous So you can say I want this one too Now The title and Ali is concept in July Is is quite interesting An obviously It's actually needed Especially if you want to do History control Or Integration with Jamal is infrastructure and comes 2 there is 3 and tagging You need to add A title and a Alias to all your items Sorry to all your views Especially if it's of you that is gonna be used in the front So in this case since we are gonna use preachers in the front to display list of features Most certainly gonna add a title and we gonna use the name as the title Then again back to the backend Do we want to have this water bill so Do we want this thing to be clickable there So you can click on it And it sort the table Alphabetically On the basis of this table Sorry column So if you wanna have it sorta bill Dendi Wanted I have this Field be searchable Do you want someone to type into this box We take warehouse for example Type it in their search Do you want it to Show Only that Specific So if you want them to be able to search for it You say yes Then the filter option is a tricky one You don't wanna set name to filtering because then it will show a list of all the names that already is being shy Town in the table Only one of yous fault there on things that are like a radio box Score a a Other View all You know Fields that actually are not all being displayed one of In the table so for our example I added let's go Go to summon distributor and preacher I added No extra Fields there but it's sermons I added preacher So there is a list of all the preachers here so I could surf and say ok I don't want to see this pictures Sermons and then it shows up only those so that is the filters and the way that you said The filter is simply by clicking yes or no here and it will set up that that filter for you Then this link if you are setting up it custom field and you want to be able to In the display of the list have it clickable so I can click here and actually go Do that preacher and then click close and then I'm back in the Sermons list view I could also click on series and all take me to the series and I can edit the The series immediately click close and take me back to the list of you so if you want that Feature for the specific item then you need to tick yes here now usually were used Is the name as you see here to be the clickable field the title sorry If you select your title here and you click League then you're Actually Telling us that this item this field item here is actually what we should use Use as the clickable option to open that actual sermon So you will have that actual sermon opening up and all it's related field So that is the way for us to know which field should be used as the key If you have a title now This concept is something that you might need to play with and since it's so easy to change it you can just click about Near compile your component install it look at it behaviour change it in the compiler installed it Look at it and by doing that you'd get a good understanding of what What happens if you change the switch Ok now we said that we wanted the preachers name and stuff on the settings And our Tab 4 settings as the first half now we gonna look at the back and setup in Off where you wanna have this Fields display now there are these different Placing options left in tab right in tab full width in tab a Bathtub underneath Dubs left of Dubs right of tabs and then There is the order in which it should go that means if we look at this again This is left in tab this is right in tab I think I have a Another view that goes be on some of those parameters let me go to this one And we do question So that is right off Tab not in tab you see there is an option Write in tab left in tab and then it says left off tabs and right Of tabs now that means that you can put it out Side of the tub area So even if I was to click here it will remain displayed right there on the And that is to put it a right off tab know there's also a left of that area over here Then a bathtub is this one here that's about the tabs so it also shows all the time and And then there's underneath dad so we basically added the option of Placing data At the rear right in tab left in tab and then right Off right after up and left after and about the up and Bonita which is 1 2 3 4 5 6 positions in the backend of your Template and the places are being set simply by these alignment assignments So select the fuel alignment inside the tub or view and you select these and there Then once you've selected them let's say you've selected left in 3rd like this one above tab and you select 1 then this is the order in which you wanted to this play first this one Then that one left in tub this is first right in dub this one is first and then that one And poo it is a description now full with will also this will always display Under the left and right off in tub so you need to Select your left and right and then only your fool with so fool with his always the last Thing to show up in a tab and then here is the switch to add permissions to Is a specific values so if I was to say you know what I want the control Which group can edit the name field you simply need to click this yes and that would Add this field into the promotional structure dynamically and so that is how you You control the permissions of fields that's how you add Fields to a view and those are All the different switches now obviously you can only have one title preview and only have one eye Any is perfume so you should not have more than one selected and then he goes I think the cyst Nor the others but just to be safe let me tell you to set the others to know And then those that are actually the title two years and the one that's actually the earliest do yes And so we will be able to here I'll be sure to use the correct field values And then when you said any of these to show you should set the order of their this Display year and ok so there is the filter the filter then is add a pandemic Le Simply clicking a yes here so if we go to sermons as an example And we click on their Fields they have many more Fields it should help to illustrate some of these And you see that we have sermon series and we have it set up As a a a filter sermons Ceres let's see we said that too yes so that means we can sort this Romans by series that is how you said the filters for the backend remember this is primarily For the backend Although some of that information will relate to the front eventually especially this premier Missional Suites will be payable able to access it from the front if you need to buy But this is simply to add the fields to the actual the You in the backend ok if you have any questions About this please give me a heads up if you feel like haven't done a good enough job explaining this then Let me know and I'll redo this video so that's adding fields To the admin views there are much more things to explain here and I think the only thing I'll still Cover in this tutorial is the actual competitions this is an amazing feature Which goes beyond Geminis control on the show on attribute perf Field remember we looked at the show on attribute and the show on attribute can be control From control which Fields to show when you are clicking on other The fields so for example yeah we have a field called Add JavaScript if I click yes it opens this area Jarvis Script where I can add custom scripting now that behaviour are being is being controlled By this condition structure and the condition structure for sermons Are the following you can see there is a few already being set so what we will As we are first decide which field are we targeting which field do we want to Show or hide that's the behaviour do you wanna show if you or hide a field now most of the Time moves Show show means it'll be hidden unless these criterias are met So show is the one I use the most and I think most will use that mostly now here is the The list of all the fields in your system now you might say why don't you just show the fields that I've selected As part Of this view and unfortunately that feature isn't Place yet so you need to remember Which Fields you selected in the fields area and so far These Fields and you need to remember their names and then Then when you go to the conditions when you type a field like name You need to know how it's this one that's how you would link to them now I Build an option for files in a field and I wanted to show you Now this isolate and chain function is a concept which I believe would The best explained when you think about that not Only one field must start sorry be Be used to show the other one but more than one field so in this case Dropbox Auto note in sermons should not only show when fields Is Dropbox but also when built option is automatic So that both of these should be true before it shows The the Dropbox note and so you would select the field You want to control obviously you can control more than one at a time but the logic behind this Might not always work so you need to try it tested if it doesn't work come and tweak this until you Do you find it working in behaving the way you expect so most of the time You would only link one field to one validate But as soon as you have multiple Fields you use the train option so it's either isolate like This one to build option of files to show when file source is Dropbox that Isolated it isn't connected to any of the other settings here as soon as you claim it Means any other field that has this any other row is a row that has this field select It is well we'll be chained together so that it must be both being valid Dated as true before it actually will show the field so here let's look at it It says file source and you can select any of these if it said if if you know that this far File this sorry file source is a list then you can look at ok this is a list and see the List options so this is only for text and it says that only for text Fields only for text fields If it's only for texts this is only for list and radio and check ba Boxes and dynamic lists this is only for radio checkboxes this is only for list radio checkbox So and then you can say is or is not Sorry if it is Dropbox then it should show if it Is not Dropbox then it should show that is the the logic behind it Now hear this one is when you're dealing with a dynamic list unfortunately with dynamic List it's quite difficult to set these values since they are the namak And so the best way to deal with a dynamic would possibly be to leave this blank So that means that if any of the values are selected show show this We will still look at Dynamic or custom fields Sorry Dynamic list all custom Fields and we will explain Into you how to set up those custom Fields but that is basically what that option is for Most of the time we are using this is and we are when you select that specific Field me show you so if I select file source So you would select let's do that again if it if it is If the field that you've selected is a text field the system will show you that by saying Keywords for length so you can say I want if he has put in a Length of 2 characters then show so then you take you it away so So then that that's how you can use the text field now Change this to Actor that is active and that it has a length of 2 I said that's what that mean you could if you know that what you've selected is a list it was show you the But it will show you all the values and then you can remove the values that you don't want to use And The Oaks the only value that really important is that to the other side just for you so You could even just leave to that will be the same as that we are just showing you in Impact what I do is I explode the string at the pipe and I only use the first value to develop the The JavaScript to Java Script that is being written we are in the sermons Let me show you that so we would go to Brand builder admin components Sermon distributor modules Forms and then you'd see there are two there's a XML which is the fields And then there is a j s which is actually the Java Script so we open that and here is All the JavaScript that component Builder with build now if we look at this It's only these permissions sorry these Conditions ok so these are the conditions it's not even that long of a list But to implement these conditions component builder builds this JavaScript so it starts up here and all of this JavaScript is the Implementation of those things that we said that All the way down to their ok so that means what 500 lines of JavaScript gets written by component builder just by these That you set up here now I'm showing you Where the script is being written so did once you've set up these switches you can come into this Script and if you remember the field name that you are working with So for example let's look at it build option is the field and files So let's look if we can find out here There is sauce ok so it gets the value When the page is ready at 6 4th of June this course or what What is the value in it puts it in here and our first function obviously I'm using A random function name generator as you can see and it's Start with B and the next one would be B&W and so on and so on and Ok so that means you need to now to see how we implement this function hiding and Showing of the source you would search for the Wii function by Bracket air fan search ok so it's the first function And I'm basically saying is it set if it's set Then I I add a source constructor and if it's a In array is this an array checking the value weather is today If it's not an array I put it into another temporary array They we push it into the temporary if it is an array And it isn't set we just create a blank array then We do a validation here and again this you can go check So basically the function is that one Function and all that function does is it sex is it true Is it still returns true if it's not too it returns false CC it's quite simple And the value where the true or false is returned to source we put source in 2F if its true then we close that View Sorry we get the closest class hall Control group and we check is this field required if it's Be quiet and these are some homeworks that we do now if it's false then we hide it And there's also if it's required we do some house cleaning so that is simply Quick looking at the code which is being generated just buy this one switch This is not the only code there is another place and that is in the Love yourself so we can go to view and then preacher out looking at Then template and edit and then from around Here we have JavaScript again and again of a we have on Keyup for sores or on change because I'm not the system doesn't know is this a text field or Or is this a list the other what is it so we have these to check function on it and also So There is another place where source is gonna be used for a Functions just focusing on this one and so it gets the value and it runs That Funky Which is in our JavaScript file so here's the job profile there is the function so it's reusing the same Funk The moment that there is a key up or a change on that specific field so That's what I've done obviously other developers who are more advanced in JavaScript and I am getting Evolved I could show them where in component builder The Script is being generated and we can Improve this time attaclay I am not that good at JavaScript and a fact I I feel like a Probably a little bit resource-intensive here but this is the best I could do Do so far and obviously if we can improve it and if you know how to improve this then you Welcome to get involved and get help and start with a discussion on improving this interest I can tell you that this infrastructure is done in that file Course and I can show you exactly on which line This was developed a built In fact all you need to do is when you compile your component just Africa Go back to components close this Ok here we inside a component all you need to do to know where that is being built it's just stick this to yes And then it will add in the in the comments it will add a line Wine reference of where that specific script is being built ok Let's go back to the admin views we're not really finished so this is Structure that you can use to actually manipulate the conditions upon which field should show And I I really think we have done a very good implementation here Gives you so much of its possibilities of structuring and training and Working with the fields in its relationships if you want to not use this and just Use the on show then that is also gonna work just as well fact I think it will work better the only prob The answer is that it doesn't actually provide the ability to target as A text field like we have here where you can add a keyword and say ok if they if it types in And his program pill then immediately this other field will show up which is have Excellent feature I mean I don't think you can get that kind of into Chrissy with With the show on auction and furthermore It cannot look at multiple other field If they have to certain values and if it developer it's true then only show the other field Those kind of controls are not yet available in the show on implementation as far as I know and Yes I possibly would like to get involved on the get report of July and see If we can add these nice features but for now without them to opponent Builder And in component although you can implement these and we are writing the JavaScript to to manage this For you ok so that is your conditions for fields So we've looked at all of these the next one is basically the list of the fields that you have already Is selected and click save you will show a list of all the field that you've selected again any of those Field if you wanna update them you could just click on the field name in all take you to the field and you can update it The Next Step is a place for you to add custom CSS that is just related to the specific View so you can add CSS here which is for the interview or the Single View and you can add CSS here which is for the listview or the Multiple do you use plural and then it'll be Placed in his prospective places the same goes with a JavaScript accept that you have for me Places to Target instead of just one if remember we when we looked at the way that we are The building the JavaScript there is a file a JavaScript file which just has JavaScript For the view and then there is the footer area which is under the HTML and PHP At the end of the file there is a whole area which is just JavaScript at the footer of the file And so we decided to add the option of adding JavaScript to the file Or JavaScript to the footer after view or the file or Siri the view file or the view Views file or their views footer so it just gives you the option of tar You now listen this script can run is a function and I just wanted to be able to be on the page Then you add it to the file and then if you wanna use the function you can add it to the footer that Ok then there is a PHP area and here you have the option of adding Adding JavaScript to your editing View Primarily so if we look at editing views the moment you click on Add JavaScript it opens at tab and now the way that we implement Jarvis The way that we wanna implement Ajax is Primary Via the controller and method implementation So if I explain that to you the component has a controller called Ajax JS PHP you can open their and there Then it has a model But we just called Ajax ok so you have a controller and you have a model now no prompt roller is Like the gatekeeper he first does a few checks and balances to ensure that the data is Correct that that the token is right that if you have sent this to be Validating whether he is a user then it also checks that there's a user ID If you have said it that it doesn't require them to be a user it basically would drop off this validation I will show you that What's this is you so that you can sorry But you can follow me there is a controller area and then there's some odd model area and the model is Basically a place where you can write a a method Which is queried from the controller so you can see in the controller it basically is getting the Ajax model and then it is querying a method in that model called Dropbox so here We are the Dropbox method and it's getting the view Name there it seems that I'm I'm not even really using it just make sure the moment I'm not in Even using this variable but it's none the less it is here and I possibly will use it later It becomes necessary so I'm basically just activating this method to run And when this method runs it Triggers some Global methods to run and On the return of that value it Triggers another local method so again I'm not Trying to teach you PHP here all I want to show us that this part after The code was custom written so if we go back to our component you'd see that there is that code So when you click on Ajax you add that name Basically writing a method make sure that it's set to public and your right your Two method in here and in the in a tax input you would say ok listen that Task name is check Dropbox this thing than you so I want to pass it is view and Type and both of them are integers and it Needs to run the view needs to run a Dropbox method And it type needs to run an update draw box and both of them should check with it So only users get fire these back and methods and the You can see that you have gone Obviously there Filters are The same as with Any field Did you can select And so into chair here would be fine and if there's no value you said no This task name Is what you be using in your JavaScript So I first wanted to show you the PSP side And then the ties name itself ok so let's just Make sure I The method name Disappear And that should correspond To the method That you set up in your Ajax method Hphs Which is possibly the method in which model did data get the data Structure the data and give it back to the Ajax call So you return the data Inside of this method But in your JavaScript you will be using the task name 2 To get Today System So if we go to the JavaScript JavaScript What it seems I used the JavaScript example which is gonna forget Way ahead of us But Since we started Let me not leave you and Matt there So I like I'll have to close out here And I'm going Quite a head of myself now but I need to otherwise you'll feel very lost In summer distributor Which is the component to which that view belongs There is a place called scripts And I have added a feature Which is called Chronic Global Events So I have added a feature To add Global events Now Global events or the way I Implementing at Is simply an event that should run every time A page Anytime anyplace in the system opens I wanted to run the global event Now the way I talk it it is I say load Dropbox Ajax Ok It's a It's a global event and it Needs to do that And The Drop Box Ajax Is basically Set up in the Helper class So I have a helper class Which is called load Dropbox Ajax and it gets the The takes the job document object adds a script declaration And here is the JavaScript That is adding And you see That in that it is using checkbox listing Asda Task So it's targeting The Ajax Controller And asking 4 check Dropbox listing As the task And it's passing through it A token And the view name So possibly where what like to use that View Idolator Dialogue from which area this automated Feature mostly gets Triggered I'm not doing that as yet So This is just what the script will do So there is something JQuery Which only fired after page has loaded And at the moment it's just adding a dummy 3 in there To just trigger the net And so That is really how this group in South on the page and I'm sorry that I used that as an example I realise it's A little bit Ahead of ourselves But Nonetheless I I want to Not leave it at a loose end So I Redoing it That is where this PHP Script really gonna be used So since I need to add this somewhere I just selected a view and that Advantages And I added the Ajax control the concepts here But the actual JavaScript that fires off all this Is set to the global Event and that means every time a bakkie in Area is opened In drop in this component It loads that JavaScript to the Vue And a JavaScript execute Ajax request which starts updating the Dropbox listing Now I'm not gonna explain all of that Dropbox listening to you now it's a Squat advance concept But it's basically Sermon distributor is able to link two Dropbox sermons Oh sorry Imedia inside of a shared Dropbox folder And this whole method here that be looking at Passes that Dropbox folder every so often To make sure that it's That's what it's all about So that is just looking at adding Ajax You can see that If you know The July API You know that it has a get item Method It has a get items method in the In the model So in the model there's a get item method In the editing model and in the list model there is a get items method Then there's a get list query in the Jay model list And there is a safe method There's a post safe method In the in the controller Is allowed at Edit method There's a batch copy method There's a batch move method there's a script before it it Sorry before delete Method There's a script After delete And these are all PHP places in which you can dump custom scripting So you wanna in the safe method Now Obviously again You need to know where the safe men It is so if I would open Sermon here Scroll down Ok so there's the get item So you can add custom script into the get item Scroll down There's the batch That's coffee Matchmove There is a safe method And so if we go back here and we click on the safe It says here That should run PHP year that should run in the safe method And then You have the data Voeten toere And it's called Data So If you look here It means You're able to Target that Value The gets placed into Save Ok And I am sure that your custom Value Code Will be placed in before the parents saved But if you do not If you do not know in any of those Custom scripts Where that code will be set What you can do Use type It is Loaded Here And in compile save it and compile the component and then go look at the code And you see where it is showing up And then you can add Ok I've got all these values already In the script Because all that component builder is gonna do it's just gonna die Let's say It will just say That's that's all It'll just add to string so when the component itself runs it will treated as code This is a comment but I mean if it was code You just execute So it is the way for you to add custom script Right into your car Almost anywhere really You are able to Target Through these switches The most safe hook Is actually in the controller not in the model So You got the car Troller Sermon Scroll to the bottom And you see there is a post save hook And it basically gives you the model and it gives you the valid data and you can Actually Form exstrophy But in all these things You you should just read Is the description here it's a speech be here that should run in the post safe work method And there's the object model is the data model Object and their Razor validator So if you just read our little note here Then you can start Kodi For it Ok That is so adding custom scripting To the view Basically the list view as well as the Each View And then the MySQL dump area Which we looked at earlier You can do two kinds of dumps now What is this used mostly for Well what I found while I was Busy developing That I would be Busy setting up a component Uninstall it and then add dummy data to it to see if it works And then every time I make a change And I uninstall that component and install the new one Because whatever changes made to the database Won't be You're not added to the database via an update You need to uninstall the component Again To get the database back And so Dude the only way I could do save myself Time Is there actually say listen I'm gonna Re-install this component and the dummy data for sermons I would like to retain And so I would go table Open the tables in all show me a list of all the Tables that are in the database at that moment And then I would scroll to sermon Cement table Tick on it An overload The theatre table and What it should be called In the data set Here is some explanation if you want to do Other tables so let's say you wanna Habit map to multiple tables then this is the explanation on health Do that I would not recommend doing this because possibly You will not get What do you expect And so Just going with the values that it populates for you Possibly your best call Unless those values change And if you aren't making changes adding new fields You must realise that you need to come and reset this by clicking on something else And then clicking on it again And then it loads the new View the new Sorry The new list Are Fields that are related to this table To this Back in view Table And that way When when you compile the components Main component of the we'll actually grabbed it data From the database and build a dump file for you Now that is one way of doing it I might be a little bit complex but it is saved Tons of hours The other way would be to just do a dump file itself So you'd go to Your Your MySQL Udo pinned it specific Use this thing Smaller Fuel types And you click on Export And then you would select A sequel format And click go And this will create a dump file Of all the data in the table And you can basically Paste that dump file in here Now I was looking at Important So you click export Pickwick Then seek world and go And then just save it Then Go to that file Open it And having it open You just replace This Stream Worth Hash Underscore So and then replace all And you will not use the table Structure because that is already in the database You just use This area Basically he would copy Area That Cut Come here Paste And clicksafe And that will mean that you have to dump file And it will always be at it To your new Install If a dump file is way too big You will see it by just after your pic safe come and look At the end And see if it cut it off somewhere So let's say Cut it off there then I know my father Too big for for unused Sure Structure For your dump File I use medium text All the medium Here Prosafe That's Sequel I used medium text So that means It's quite big You can really put a lot of Text inside of it You wanna know exactly how much just Google it Ok so I'm gonna remove this Ivy It's not related 27 all And In fact I'm not even good Ok That is basically setting up an admin View I know I've run around and it seems like A dick And I possibly will redo this video at a certain stage Try to be Structured But I think it is informative enough And View Have any questions please email me Hyundai Try to communicate with you And if I see that a certain question comes up I will add it to the Video Possibly redoing Specific Admin views Squad intense And we will possibly revisit many of the Concepts that we flew Thank you for watching \ No newline at end of file +Hi We are looking at admin views Which is The next thing to be setting up In Developing your component So first we started with [00:00:13](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m13s) Field types Looking at How to setup field types or improve on them Then We looked at how to use those field types to build Basic Common fields Now we gonna look at how to take those fields And add them To admin views [00:00:34](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m34s) Admin views Like I explained in our initial General planning Video It is basically from the BedRock The basis of your Components database structure so your admin views is where your Database Structure is being Developed [00:00:56](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m56s) All your admin views which have their own table Now as we explained admin views have a single Name and and has a list record or a plural name And then there is a system name And the reason why there they actually have 3 Is that let's say you have Wanna reuse this Specific admin View In another component [00:01:21](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m21s) With the same name but obviously adapting it to that component The idea would be that you would then have two preachers Showing up in your selection list When you added to the component And so that might be difficult to discern Which is which And so You can add the name of that specific component As part of Just differentiating between [00:01:47](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m47s) The same Names That means you can have Admin views with the same name But with different implementation Fact that is how You can do different version control Concepts on Components Using the same admin do [00:02:03](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m03s) Just inside of it Making a few changes and in Saving it So you could do that Open preacher for example And in here You could say free version This is the free version and then save as copy And then you can Change the field that is linked You can change some of the linked views [00:02:25](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m25s) You can change some of your CSS will whatever Other things you have done Regarding this admin view And then go to the free version of that component And Link the That specific one That specific view instead of the other Away maybe I'm getting ahead of myself I usually do So let's focus on admin views now to create a admin view you obviously just click new [00:02:54](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m54s) I'm gonna Open preacher again because this is the one we are using As our illustration And You would See that there should be a name for a single record Again that is where you would edit This records so that is In this case I said preacher And then there is a list of Records [00:03:14](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m14s) And that's preachers Then a short description And a normal description Depending on What you would like to say Then there is a type now the read write and the read only Changes the components editing view If you say read only Then it will basically limit [00:03:36](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m36s) The fields to being not you will not be able to edit them If you remember in the In this area Here The modified "By field" cannot be edited Because it's done automatically and when it was modified is Is also updated us every time you You click save So this area can not be edited and that's how all The fields are gonna look [00:04:02](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m02s) If you select Read only If you if you leave it on read write it will look like this and you will be able to edit it Ok so that is Looking at these Fields now there is a place for an icon if you hover over the icon It gives you the dimensions that is needed This basically is the icon Then when you look [00:04:24](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m24s) At The dashboard These icons Are the one selected there Ok so You can see that The icon has two of them one is the add icon And one is there just a normal icon so if you hover here You should see the image if it is Set in [00:04:46](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m46s) In your In yours Images folder sorry So if you open the this It goes to your image folder you select the icon When you hover here obviously those images are not in this image folder so it does not show up And then if you gonna add preachers are you if you gonna add a field Just a field called category that is of the category type [00:05:14](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m14s) Then you should add a category icon Since then The system will automatically know ok there need to be a category setup And it will look for this icon to use For that category And If you select a Category field that is a general category for the whole component Which isn't directly linked To this [00:05:37](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m37s) View Then it will take the first view The system will look at which view when it processes it Which view is the first one And usually that would be the first one you've Created And it will use the icon in that But to be on the safe side if you using 1 category for them all Just set the same icon on them all But if you are gonna use a category [00:06:02](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m02s) Which is primarily focused on the preachers And you just gonna put preachers and a category Then you need to add a category Icon here Four categories now permissional switch It's got to do with your accessing and Updating of data So like you can see here We have [00:06:24](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m24s) View edit View edit State View edit own Views create Admin views delete admin view access admin view edit version Now this edit If it's set if your own this managing group and it set to a aloud then you can edit it If you are a guest and it said to Deny [00:06:49](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m49s) I no Matter Where You are in The front or the back of the site You won't be able to edit this information even if you have a Direct Link It won't allow you to edit it Now it also has view access So somebody who might be not allowed to Edit it May be allowed to View [00:07:08](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m08s) This this content in the back end in the list view Then it will show in the list view and they can see that it is there Now you might Think yourself why would I ever wanna do that And you see because of your custom admin Views and the way that you can connect them to your admin views Which will look at later You might want to display the record and [00:07:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m32s) Just leave an custom admin link to the data Let me give show an example of a Component that does that You see here There is a button underneath The company name So it displays the record But [00:07:53](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m53s) If I was Like this one whose profile is set to To being locked If I was to click on this You tell me That I do not have the permission to edit it But if I was to click on this icon It actually loads the information that I Looking for And [00:08:12](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m12s) That is the difference The differences sometimes you wanna use a custom see this is a custom Admin View And you might want to Do something That is not a Editing view but a custom View And then you would like to see the record but not edited So that's really what [00:08:36](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m36s) What that is all about Ok so We are back here And we are looking at the missions So Opening this permission tab You'd see that there is edit a view edit View edit own View edit state and All these have been created usually when you open this it might look like [00:09:00](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m00s) That Look like that So you would set the first one and that you would see there are Two options one is core edit and one is view edit The core edit Means That You want to do a global Switch Now [00:09:27](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m27s) Let me try and explain that by opening Component Builders options We haven't actually looked at this yet but it is quite important You see that it all components in Joomla you have what is called the create edit Delete Edit State edit own it is this list Of options Which means that if you select This [00:09:56](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m56s) You know that they can't create something Then It is applicable to Everything in this component Because it's a global setting so Everything that doesn't have a view name behind it Like this is a view name And it says access This is a view name and it says batch use [00:10:18](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m18s) But this is only batch use So that's the global for batch use and this is only related to this view So you can say I am allowing them to Do a batch function But in this admin view I don't Want to allow Sorry Don't wanna allow them To do a batch function Or you could say [00:10:39](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m39s) You know what I wanna use inheritance So that means I'm gonna do that I want them to be able to do batch functions here And in this view Now the reason why you can do it in two places then Is that you have a global switch to stop them from doing it But you can also locally to the view Tweak whether they are able to To edit Do some of these features [00:11:08](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m08s) So coming back to the Way that you would set that up If you don't want to have a separate Control For this View In relation to whether it can edit it or Or whether you could Change it all view it all these Possibilities [00:11:31](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m31s) Then you would use core And core would mean that you would have only this one switch And if you say deny it will it automatically deny it for that View And any other view that is using core or core can be seen as Global When when you are setting it as View edit view It means that the system will generate [00:11:55](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m55s) A specific list of items Specially just for that View So if you look From there to there That's for your admin View from there to there is for your custom Admin View Now that means What I set up This in a component Builder [00:12:14](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m14s) I selected view edit And then I said in relation to each record in relation to the whole View And I selected Both So Then it will implement it for the For both And single record and it will implemented For your Global settings Now again it might feel [00:12:34](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m34s) I won't blame you if what I have just tried Explaining Makes you feel confused But Really The only way for you to make sense of this is if you know how Joomla provisional structure works So if you are using a Joomla website And you have actually ever Gone to articles [00:12:58](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m58s) And opened options and then look at their permissions Then you'd see that they only have create edit Delete Edit State edit own And then these accessing of the control And this batchally This big Global settings Now what we are doing as we simply adding [00:13:17](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m17s) More control Then only these default because the way this works In article manager you basically have 1 view That view is articles These are the views Own's as categories is another view but it really has another component It's not really Content The content component [00:13:38](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m38s) An admin features Is just another implementation It's not really a whole new Database It's ok so the point is You only really have two well the most two views here And so when they look at options They know that if they tweak this permission they want it to be implemented For all the views related to articles Right Well with component Builder you are able to build components [00:14:06](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m06s) That are far bigger Then the content managing Article manager Ok I'm because of that We felt that your permissions must extend That you can target a specific view and not just all of them at once So if you want to Target a specific View You will select The View edit [00:14:27](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m27s) Actually this view Prefix Must be in your selection If you select Core That means you are saying I don't want to specifically target this view If I change it in the global settings which would be The ones without a view name in Front [00:14:45](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m45s) Everything From Here to There those are the global settings Global export Global batch global version Edit version Global create Delete [00:14:59](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m59s) Edit edit State now edit state is changing it from publish to unpublish those things Edit own means you might not have edit rights but he has edit own rights So that means whatever you create c can edit again In and created by is a field so can he edit created by field Or Can he edit create date field Now You'd see that This basically targets Fields that are sort of the default fields [00:15:33](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m33s) There is a way to Target Custom Fields Fields that were developed Outside of the default fields But that is not done in Here I'll Show you where that is done this is just controlling your default Fields and your default Features with regards to Permissions And So you would first set up these permissions make sure that you set up all of those that you want to implement [00:16:01](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m01s) There is a list here of those I think is most general This list might Grow with time But because we've moved The control of a single field Out of this Structure It actually means that we've made it scalable So this Permissional implementation here [00:16:22](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m22s) Is really only Targeting your or default fields or the fields that Already the system put in for you And the default Concepts like accessing This specific View Or deleting an item in the view or creating an item Or editing the created Field or editing the created by field [00:16:44](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m44s) Changing the state Edit own So those are the custom Default features If you wanna do a control on a specific field I'll show you that in a moment But That is the implementation Of permissions If you do not really Understand this I would suggest you make [00:17:05](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m05s) Effort To study up on Joomla's own implementation Sorry Off The promotional structure Then once you've really understood the way Joomla Handles this permissional structure Then you would have better grips on Setting up these permissions [00:17:24](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m24s) Per view What is done in the code if you would like to see that It's basically in the code If your ready have developed a Component You see that it sets up Your Globals This is the global now when I say Global I mean If you click on options [00:17:47](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m47s) let me just close this If you click on this button here options in any of the components You're going to the global settings Ok And These permissions here are Those first that I've highlighted So it all those And they have [00:18:09](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m09s) Links To the specific Views so there is the field View There is the Dynamic get view there is the custom admin View And you can see that they have there Related switches Ok but then there's also For each view their own Section And that causes Joomla [00:18:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m32s) to add in an item a permissional tab With switching to control the permission for this one Individual item And We have tried our very best To implement these permissions actually The way that you want might expect I can in later videos going to the code and show you exactly how This permission structure is being implemented and I think it's one of the features that makes component Builder [00:19:02](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m02s) Far more advanced Then other component Builders out there Is the ability to add permissional structures to your component right inside of component Builder Through This Permissional switch Ok And so we will will definitely be speaking about this permissional structure As we go along The tab structure if you look at these we call them tabs [00:19:27](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m27s) Settings Fields CSS JavaScript PHP my SQL Published And permissions The Publishing permissions are tabs that are built Automatically For all Backend Admin views [00:19:43](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m43s) Old admin views Have this permission and well the permission only if if set And Published Will always be there In published we basically bundle your Your the fields that are built Dynamically Without you having to set them I think that is what you could say [00:20:09](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m09s) With publishing all those Fields that you do not need to set Are always placed in Publishing And so everything else this MySQL tab here the PHP JavaScript CSS Fields and settings Are actually an example of what tabs can be Now in preacher I actually setup Two tabs 1 called [00:20:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m32s) Details And one called sermons Ok so there are two tabs in preachers So that means if you were to open the preacher Backend View First one would be called settings The second one will be called Sermons and then you'd see publishing and permission So that's how I would look Now when you create fields [00:20:53](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m53s) You see that there is a column here called tab And you then will select the number now the tags Are number from one to Whatever We don't start at zero or though that might have made more sense for programmers We started with One So first tab second tab And Because we are using [00:21:15](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m15s) A place different From the tabs we don't use the names So you need to remember that this is tab one this is tab two So when you set up a field You need to tell us in which tab Do you want a place that feel Ok So That is what this tab Number here is all about [00:21:35](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m35s) Now you might say but where is tab two's information because their sermons right Well Because of the fact that sermons Is an actually A table on its own If we go out here We will see that there is a Admin view called sermon And it is his own backend View [00:22:02](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m02s) And it has its own structure So How can I Get The sermons That is only related to this Preacher To be showing in the second tab called sermons What we created the thing called linked views now linked views is the place where this is done [00:22:25](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m25s) So basically I selected sermon as the view I said it should Be placed in the second tab And in child key Is preacher so if I think about sermons Which is the child Sermon is the child Preacher is the parent So you would always think of the parent as this the view in which you are the moment you are setting up the linked [00:22:49](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m49s) View So that If you are in preacher The parent is preacher If you are in sermons The parent is sermon So depends on in which view your busy editing And so here When we talk about the child key This would be the database field name [00:23:10](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m10s) That that is to be looked at And the parent Field name that should be found inside of this So when we look at preachers You would let's go back to Sermon let me quickly close this Ok we got sermon open here and if I open there this fields Well I don't need to open it here in fact let me us another place [00:23:38](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m38s) It is Easier to see Let's go to fields You'll see that there is a field called name Ok wait there's a field called Preacher where is it? preacher preacher next page possibly no why am I not seeing it custom there it is Sorry Ok so this is the field That we want [00:24:10](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m10s) Connected to With each other right So do to get The sermons that belongs to that preacher We need to get the ID of this field now that's a custom field And we said that we are gonna look at custom fields Only after explaining the admin views so I'm gonna go into detail now But I'm gonna open that field None the less And I'm gonna show you that it's name is preacher [00:24:35](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m35s) And because that field Will be connected to sermon it means that in the database the ID Which is the key field Is gonna be saved in preacher So that means the ID of the preacher Is saved inside of the preacher Column In the database [00:24:55](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m55s) now let me show you that in the database itself Ok so here I am in the database With Sermon distributor And I'm opening sermons And you'd see that we would scroll Until we see preacher And it has ID's in it And those are the ID of the Preacher's themselves So if I was to go to preacher it basically means that we are linking [00:25:24](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m24s) To this ID here Ok So Going back to our Linked view concept That means the child Database table In which the ID of this preacher must be Found Is in preacher [00:25:43](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m43s) the parent Key Would be this preachers ID And so by doing that The linked view will only show the sermons That are related to this Specific preacher And that is how the linked views can be linked If you didn't select these correctly it won't load all of them [00:26:05](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m05s) Ok well it won't work well So there needs to be that tight relationship Between the parent and the child View So there's also a way To actually link An array from an array So let's say [00:26:23](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m23s) The person is able to select more than one preacher There is a way for you to also Type that but that would all be dealt with in advanced concepts Since that is Well I could Explain some of it here but best be let me show you That would be one of the syntax to use [00:26:48](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m48s) But like I said Think I possibly need to deal with this in advanced concepts Because who will know to look for the answer in this video or tutorial So we'll stay with the basics here So the basic Way of linking a Another view would be to select that View From this dropdown Then say in which tab it should display Then [00:27:12](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m12s) What is the child's Database table in which to look What is the parents value to use to Build a relationship And then this add new button or no Is basically when you look at a let me Close this When you look at Fields here You see it has a new button [00:27:38](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m38s) So you can in that switch there decide whether it should Show it would not I should tell you that if you say yes And you have In that view created the correct permissional of structure for Whether somebody can create An item You can control the display of that New button [00:28:02](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m02s) With just setting the permission of that users specific group So if that user is in a group that doesn't have permissions to Create new items for In this example for Preachers or for sermons Then that new button will also not show up So we have that permissional wrapped Round that button's display methods Ok [00:28:26](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m26s) That is The tabs Just looking at the tabs That's really what we were looking at And then explaining to you The how to link other views To it To other views So that you can have the data displayed inside of each other [00:28:43](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m43s) Basically this feature we have here So the fact that we are busy in preachers and we are able to display the fields That are being used Well As you can imagine These fields Are linked to preachers From this column here So we are using a Repeatable field structure [00:29:05](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m05s) And we are able to Link Connect The field names To this View Now let me show you how I did that so I'm Looks like I'm gonna show you anyway Ok I'm opening the admin The View Which is the one we looking at [00:29:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m32s) I'm going to link two views And you see that I have there and are in the pointer And the world field So if you are Trying to connect A View to a To the From the parent An independent it is stored in at fields That's the database [00:29:54](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m54s) column Name so if we go to the database Go to Component Builder Admin views And we scroll You see there's add fields And if I open that You see that the way it stores it Is it stores the ID is then it stores the list [00:30:21](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m21s) So there's a way in which your Repeatable fields are stored by Joomla And the value that I need to look up is in field So in the repeatable field called Addfields There is a field called field And it should look for the ID of the Sorry of the Fields So it need to look in Addfields [00:30:51](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m51s) In the field Array For the IDs That it needs to fetch And the way you would map that in the Connect a A linked view is you would say that this is a capital R For repeatable Fields basically that is the convention to To tell the system it's a repeatable field we looking in [00:31:14](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m14s) And inside of the repeatable field We must look in the Field array For those ID's and they should map to the child's ID So does that make sense I hope so Because that's the way it's done And if that wasn't a repeatable field but an array You would simply say array [00:31:34](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m34s) And If if the array is just the values themselves you would drop off any pointer to Specific value But if it's an array with And it's actually a So if it's an associative array You would just add the name Of the associative key That it needs to look [00:32:00](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m00s) If it's just a normal array without Association Leave it like that So this would just tell the system it is a array And it needs to look Inside of those values for these IDs Ok so that's sort of explains the linking of an admin View To another admin View Now getting on with The Setting up of fields [00:32:28](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m28s) Now since we've already created the fields Beforehand You will Usually start out this way It will looks like that And the fields that you have created you would scroll down if it is a long list You just start with typing that Fields name and it will sort of bringing it up to you Then it ask you whether you [00:32:56](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m56s) Would like to show this field in the admin View The admin list for you And that means If you've closed Your Editing area There is a list of names here And if you want That specific field to show up in this list Then you would select [00:33:18](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m18s) Show If you have selected show you could tell us in which order you want this Must be the first one second one And we thought while you shouldn't do more than 100, it will look Ridiculous So you can say I want this one to show up first Now The title Alias concept in Joomla Is is quite interesting [00:33:41](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m41s) An obviously It's actually needed Especially if you want to do History control Or Integration with Joomla's infrastructure when it comes to their history and tagging systems You need to add A title and a Alias to all your items [00:33:59](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m59s) Sorry to all your views Especially if it is a view that is gonna be used in the front So in this case since we are gonna use preachers in the front to display list of preachers We most certainly gonna add a title and we gonna use the name as the title Then again back to the backend Do we want to have this sortable so Do we want this thing to be clickable there So you can click on it And it sorts the table Alphabetically [00:34:30](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m30s) On the basis of this table Sorry column So if you wanna have it sortable then do you want to have this Field be searchable Do you want someone to type into this box We take warehouse for example Type it in their search Do you want it to [00:34:51](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m51s) Show Only that Specific field So if you want them to be able to search for it You say yes Then the filter option is a tricky one You don't wanna set name to filtering because then it will show a list of all the names that already is being shown in the table you only want to use filter on things that are like a radio box or a [00:35:19](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m19s) Other View or You know Fields that actually are not all being displayed one after the other In the table so for our example I added let's go Go to sermon distributor and preacher I added No extra Fields there but at sermons I added preacher So there's a list of all the preachers here so I could sift and say ok I don't want to see this pictures Sermons and then it shows up only those so that is the filters and the way that you set up The filter is simply by clicking yes or no here and it will set up that that filter for you Then this link if you are setting up it custom field and you want to be able to [00:36:12](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m12s) In the display of the list have it clickable so I can click here and actually go to that preacher you see and then click close and then I'm back in the Sermons list view I could also click on series and all take me to the series and I can edit the Series immediately click close and take me back to the list view so if you want that Feature for the specific item then you need to tick yes here now usually we used the name as you see here to be the clickable field the title sorry If you select your title here and you click link then your Actually Telling us that this item this field item here is actually what we should use Use as the clickable option to open that actual sermon So here we'll have that actual sermon opening up and all it's related fields [00:37:16](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m16s) So that is the way for us to know which field should be used as the clickable field If you have a title now This concept is something that you might need to play with and since it's so easy to change it you can just click a button Here to compile your component install it look it it's behavior change it a little compile it install it Look at it's behavior by doing that you'd get a good understanding of what What happens if you change these switches here Ok now we said that we wanted the preachers name and stuff on the settings And our Tab for settings as the first have now we gonna look at the backend setup in Off where you wanna have this Fields display now there are these different Placing options left in tab right in tab full width in tab a Above tab underneath tabs left of tabs right of tabs and then [00:38:20](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m20s) There is the order in which it should go that means if we look at this again This is left in tab this is right in tab I think I have Another view that goes beyond some of those parameters let me go to this one And we do question So that is right off Tab not in tab you see there is an option It says Right in tab left in tab and then it says left of tabs and right Of tabs now that means that you can put it out Side of the tab area So even if I was to click here it will remain displayed right there on the side And that is to put it a right of tab know there's also a left of tab area over here [00:39:31](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h39m31s) Then a above tab is this one here that's above the tabs so it also shows all the time and And then there's underneath tab so we basically added the option of Placing data I just show you At the right in tab left in tab and then right Of right of tab and left of tab and above tab and beneath tab which is 1 2 3 4 5 6 positions in the backend of your Template and the places are being set simply by these alignment assignments here So select the field alignment inside the tab or view and you select these and Then once you've selected them let's say you've selected left in like this one above tab and you select 1 then this is the order in which you wanted to display the first this one [00:40:35](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h40m35s) Then that one left in tab this is first right in tab this one is first and then that one And full width it is a description now full width will also this will always display Under the left and right of in tab so you need to Select your left and right and then only your full width so full width his always the last Thing to show up in a tab and then here is the switch to add permissions to Is a specific values so if I was to say you know what I want the control Which group can edit the name field you simply need to click this yes and that would Add this field into the permissional structure dynamically and so that is how you You control the permissions of fields that's how you add Fields to a view and those are All the different switches now obviously you can only have one title per view and only have one [00:41:39](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h41m39s) Allias per view so you should not have more than one selected and then in any case I think the system will ignore the others but just to be safe let me tell you to set the others to know And then those that are actually the title to yes and the one that's actually the allias to yes And so we will be able to you know be sure to use the correct field values And then when you set any of these to show you should set the order of their Display here and ok so there is the filter the filter then is added dynamically by Simply clicking a yes here so if we go to sermons as an example And we click on their Fields they have many more fields which will help to illustrate some of these things And you'd see that we have sermon series and we have it set up As filter so filter is the second last column [00:42:43](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h42m43s) Sermons series let's see we said that to yes so that means we can sort this sermons by series that is how you set the filters for the backend remember this is primarily For the backend Although some of that information will relate to the front eventually especially this Permissional Swiths will be able to access it from the front if you need to But this is simply to add the fields to the actual view in the backend ok if you have any questions About this please give me a heads up if you feel like haven't done a good enough job explaining this then Let me know and I'll redo this video so that's adding fields To the admin views there are much more things to explain here and I think the only thing I'll still Cover in this tutorial is the actual conditions this is an amazing feature [00:43:47](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h43m47s) Which goes beyond Joomla's control on the show on attribute per Field remember we looked at the show on attribute and the show on attribute can be control can control which Fields to show when you are clicking on other fields so for example here we have a field called Add JavaScript if I click yes it opens this area Java Script where I can add custom scripting now that behavior are being is being controlled By this condition structure and the condition structure for sermons Are the following if you can see there is a few already being set so what we will As we are first decide which field are we targeting which field do we want to Show or hide that's the behaviour do you wanna show a field or hide a field now most of the [00:44:51](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h44m51s) Time we'll use show show means it'll be hidden unless these criteria's are met So show is the one I use the most and I think most will use that mostly now here is the The list of all the fields in your system now you might say why don't you just show the fields that I've selected As part Of this view and unfortunately that feature isn't Place yet so you need to remember Which Fields you selected in the fields area and so for our purposes It's these Fields and you need to remember their names and then Then when you go to the conditions when you type a field like name You need to know oh it's this one that's how you would link to them now I've Build on option for files is a field and I wanted to show Now this isolate and chain function is a concept which I believe would [00:45:55](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h45m55s) be best explained when you think about that not Only one field must start sorry be Used to show the other one but more than one field so in this case Dropbox Auto note in sermons should not only show when fields Source is Dropbox but also when built option is automatic So that both of these should be true before it shows The the Dropbox note and so you would select the field You want to control obviously you can control more than one at a time but the logic behind this Might not always work so you need to try it tested if it doesn't work come and tweak this until you you find it working in behaving the way you expect so most of the times [00:46:59](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h46m59s) You would only link one field to one validation But as soon as you have multiple Fields you use the chain option so it's either isolate like This one to build option of files should show when file source is Dropbox than it's Isolated it isn't connected to any of the other settings here as soon as you click chain It means any other field that has this any other row is a row that has this field selected as well we'll be chained together so that it must be both being validated as true before it actually will show the field so here let's look at it It says file source and you can select any of these if it if if you know that this file File this sorry file source is a list then you can look at ok this is a list and see the List options so this is only for text and it says that only for text Fields only for text fields [00:48:03](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h48m03s) If it's only for text fields only for text fields only for text fields this is only for list and radio and check Boxes and dynamic lists this is only for list radio and checkboxes this is only for list radio and checkboxes So and then you can say is or is not Sorry if it is Dropbox then it should show if it Is not Dropbox then it should show that is the the logic behind it Now here this one is when you're dealing with a dynamic list unfortunately with dynamic List it's quite difficult to set these values since they are dynamic And so the best way to deal with a dynamic would possibly be to leave this blank So that means that if any of the values are selected show show this item We will still look at Dynamic or custom fields [00:49:07](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h49m07s) Sorry Dynamic list all custom Fields and we will explain to you how to set up those custom Fields but that is basically what that option is for Most of the time we are using this is and we are when you select that specific Field and show you so if I select file source So you would select let's do that again if it if it is If the field that you've selected he's a text field the system will show you that by saying Keywords or length so you can say I want if he has put in a Length of 2 characters then show so then you take keywords away so So then that that's how you can use the text field now now you would Change this to [00:50:11](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h50m11s) Active that is active and that it has a length of 2 That's how that that's what that would mean you if you know that what you've selected is a list it will show you the list But show you all the values and then you can remove the values that you don't want to use And the only value that's really important is that 2 the other side just for you so You could even just leave 2 that will be the same as that we are just showing you in in fact what I do is I explode the string at the pipe and I only use the first value to develop the The JavaScript in fact the Java Script that is being written we are in the sermons view Let me show you that so we would go to Component Builder admin components Sermon distributor modules [00:51:15](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h51m15s) Forms and then you'd see there are two there's a XML which is the fields And then there is a js which is actually the Java Script so we open that and here's All the JavaScript that component Builder would build now if we look at this let's go there It's only these permissions sorry these A conditions ok so these are the conditions it's not even that long of a list But to implement these conditions component builder builds this JavaScript so it starts up here and all of this JavaScript is the Implementation of those things that we set there All the way down to there ok so that means about 500 lines of JavaScript gets written by component builder just by these switches [00:52:19](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h52m19s) That you set up here now I'm showing you Where the script is being written so did once you've set up these switches you can come into this Script and if you remember the field name that you are working with So for example let's look at it build option is the field and files source So let's look if we can find that here There is source ok so it gets the value When the page is ready it checks the jform on this called source What is the value in it puts it in here and our first function obviously I'm using A random function name generator as you can see and it's Start with V and the next one would be VW and so on and so on and [00:53:23](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h53m23s) Ok so that means you need to now to see how we implement this function hiding and Showing of the source you would search for the V function by just adding a bracket there and search ok so it's the first function And I'm basically saying is it set if it's set Then I I add a source constructor and if it's a In array is this an array checking the value whether it's in array If it's not an array I put it into a temporary array here we go let me see There we push it into the temporal array And if it is an array and it isn't set we just create a blank array then We do a validation here and again this you can go check [00:54:27](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h54m27s) So basically the function is that one So let's check that function and all that function does is it checks is it 2 If it's 2 it returns true if it's not 2 it returns false so you see it's quite simple And the value whether true or false is returned to source we put source into if its true then we close that View Sorry we get the closest class called Control group and we check is this field required if it's required and these are some homeworks that we do now if it's false then we hide it And there's also if it's required we do some house cleaning so that is simply Quick looking at the code which is being generated just by this one switch [00:55:31](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h55m31s) This is not the only code there is another place and that is in the view itself so we can go to view and then preacher no wait we are looking at sermon Then template and edit and then from around Here we have JavaScript again and again of a we have on Keyup for source or on change because I'm not at the system doesn't know is this a text field or Or is this a list field or what is it so we have these two check function on it and also Let me see There is another place where source is gonna be used for another Functions just focusing on this one and so it gets the value and it runs That Function Which is in our JavaScript file so here's the JavaScript file there is the function so it's reusing the same Function [00:56:35](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h56m35s) The moment that there is a key up or a change on that specific field so That's what I've done obviously other developers who are more advanced in JavaScript than I am get's Involved I could show them where in component builder The Script is being generated and we can Improve this dramatically I am not that good at JavaScript and in fact I I feel like a Most probably a little bit resource-intensive here but this is the best I could do so far and obviously if we can improve it and if you know how to improve this then you Welcome to get involved and GitHub and start with a discussion on improving this infrastructure I can tell you that this infrastructure is done in the compiler of course and I can show you exactly on which line This was developed you know built In fact all you need to do is when you compile your component just a if we [00:57:39](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h57m39s) Go back to components close this Ok here we're inside a component all you need to do to know where that is being built it's just tick this to yes And then it will add in the in the comments it will add a line Line reference of where that specific script is being built ok Let's go back to the admin views we're not really finished so this is Structure that you can use to actually manipulate the conditions upon which field should show or not show And I I really think we have done a very good implementation here It gives you so much of its possibilities of structuring and training and Working with fields in its relationships if you want to not use this and just Use the on show then that is also gonna work just as well if fact I think it will work better the only problem on [00:58:43](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h58m43s) Show is that it doesn't actually provide the ability to target as A text field like we have here where you can add a keyword and say OK if they if it types in his for example then immediately this other field will show up which is it Excellent feature I mean I don't think you can get that kind of intricacy with With the show on option and furthermore It cannot look at multiple other fields If they have certain values and if it evaluates true then only show the other field Those kind of controls are not yet available in the show on implementation as far as I know and Yes I possibly would like to get involved on the get repo of Joomla and see If we can add these nice features but for now we have add them to Component Builder And in component builder you can implement these and we are writing the JavaScript to manage this [00:59:47](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h59m47s) For you ok so that is your conditions for fields So we've looked at all of these the next one is basically the list of the fields that you have already selected and click save you will show a list of all the fields that you've selected again any of those Fields if you wanna update them you could just click on the field name in all take you to the field and you can update it The Next tab is a place for you to add custom CSS that is just related to the specific View so you can add CSS here which is for the edit view or the Single View and you can add CSS here which is for the listview or the Multiple views plural and then it will be Placed in his prospective places the same goes with the JavaScript accept that you have four Places to Target instead of just one if remember we when we looked at the way that we are [01:00:51](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h00m51s) The building the JavaScript there is a file a JavaScript file which just has JavaScript For the view and then there is the footer area which is under the HTML and PHP At the end of the file there is a whole area which is just JavaScript at the footer of the file And so we decided to add the option of adding JavaScript to the file Or JavaScript to the footer of the view or the file sorry the view file or the view footer or Views file or the views footer so it just gives you the option of targeting You now listen this script can run is a function and I just wanted to be able to be on the page Then you add it to the file and then if you wanna use the function you can add it to the footer that it's up to you Ok then there is a PHP area and here you have the option of adding Adding JavaScript to your editing View [01:01:55](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h01m55s) Primarily so if we look at editing views the moment you click on Add JavaScript it opens a tab and now the way that we want to implement Ajax is Primarily Via the controller and method implementation So if I explain that to you the component has a controller called Ajax Dot Json PHP you can open there Then it has a model But we just called Ajax ok so you have a controller and you have a model now the controller is Like the gatekeeper he first does a few checks and balances to ensure that the data is Correct that that the token is right that if you have set this to be [01:02:59](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h02m59s) Validating whether he is a user then it also checks that there's a user ID If you have said it that it doesn't require them to be a user it basically would drop off this validation I will show you that in a moment so that you can follow me there is a controller area and then there's some model area and the model is Basically a place where you can write a method Which is queried from the controller so you can see in the controller it basically is getting the Ajax model and then it is querying a method in that model called Dropbox so here We are querying the Dropbox method and it's getting the view Name there it seems that I'm I'm not even really using it just make sure the moment I'm not in [01:04:03](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h04m03s) Even using this variable but it's none the less it is here and I possibly will use it later If it becomes necessary so I'm basically just activating this method to run And when this method runs it Triggers some Global methods to run and On the return of that value it Triggers another local method so again I'm not Trying to teach you PHP here all I want to show us that this part of The code was custom written so if we go back to our component you'd see that there is that code So when you click on Ajax you add that name Basically writing a method make sure that it's set to public and your write your method in here and in the in Ajax input you would say ok listen that the Task name is check Dropbox this thing the values I want to pass it is view and [01:05:07](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h05m07s) Type and both of them are integers and it Needs to run the view needs to run a Dropbox method And the type needs to run an update dropbox and both of them should check wither it is a user so only users can fire This back end methods and the You can see that you have control to tick that Obviously the Filters are The same as with Any field that you can select [01:05:45](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h05m45s) And so integer here would be fine and if there's no value you said nil This task name Is what you be using in your JavaScript So I first wanted to show you the PSP side And then the task name itself ok so let's just Make sure I do not miscommunicate here The method name is set here And that should correspond [01:06:07](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h06m07s) To the method That you set up in your Ajax method PHP Ajax method Which is possibly the method in which model the data, get the data Structure the data and give it back to the Ajax call So you return the data Inside of this method But in your JavaScript you will be using the task name to [01:06:29](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h06m29s) To get to the System So if we go to the JavaScript close out go JavaScript What it seems I used the JavaScript example which is gonna get Way ahead of us But Since we started Let me not leave you and mid air So I like I'll have to close out here [01:07:00](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h07m00s) And I'm going Quite ahead of myself now but I need to otherwise you'll feel very lost In summer distributor Which is the component to which that view belongs There is a place called Scripts And I have added a feature Which is called Chronic Global [01:07:23](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h07m23s) Events So I have added a feature To add Global events Now Global events or the way I am implementing it Is simply an event that should run every time A page opens Anytime any page in the system opens I wanted it to run the global event Now the way I target it is I say load Dropbox Ajax [01:07:50](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h07m50s) Ok It's a global event and it Needs to do that And The Drop Box Ajax Is basically Set up in the Helper class So I have a helper class Which is called load Dropbox Ajax and it gets the document object [01:08:11](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h08m11s) it takes the job document object it adds a script declaration to it And here is the JavaScript That it is adding And you see That in that it is using check Dropbox listing As the Task So it's targeting The Ajax [01:08:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h08m32s) Controller And asking for check Dropbox listing As the task And it's passing to it A token And the view name So possibly we would like to use that View ID later to log from which area this automated [01:08:52](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h08m52s) Feature mostly gets Triggered I'm not doing that as yet So This is just what the script will do So there is j Query Which only fired after page is loaded And at the moment it's just adding a dummy 3 in there to just trigger the method [01:09:10](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h09m10s) And so That is really how this script ends up on the page and I'm sorry that I used that as an example I realise it's A little bit Ahead of ourselves But Nonetheless I I want to Not leave it at a loose end So I Redoing it actually for you [01:09:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h09m32s) That is where this PHP Script really gonna be used So since I need to add this somewhere I just selected a view and that to Advantage it to this sermon view And I added the Ajax control the concepts here But the actual JavaScript that fires off all this Is set to the global Event and that means every time a back end Area is opened In this component [01:10:00](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h10m00s) It loads that JavaScript to the view And a JavaScript execute Ajax request which starts updating the Dropbox listing Now I'm not gonna explain all of that Dropbox listening to you now it's a quite an advance concept But it's basically Sermon distributor is able to link two Dropbox sermons Oh sorry a media inside of a shared Dropbox folder And this whole method here that be looking at [01:10:28](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h10m28s) Parses that Dropbox folder every so often To make sure that it's To date That's what it's all about So that is just looking at adding Ajax You can see that If you know The Joomla API You know that it has a get item [01:10:45](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h10m45s) Method It has a get items method in the In the model So in the model there's a get item method In the editing model and in the list model there is a get items method Then there's a get list query in the Jay model list And there is a safe method There's a post safe method In the in the controller Is allowed at [01:11:10](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h11m10s) Edit method There's a batch copy method There's a batch move method there's a script before edit Sorry before delete Method There's a script After delete And these are all PHP places in which you can dump custom scripting So you wanna in the safe method Now [01:11:32](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h11m32s) Obviously again You need to know where the safe method is It is so if I would open Sermon here Scroll down Ok so there's the get item So you can add custom scripting to the get item method and if I Scroll down There's the batch That's copy [01:12:06](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h12m06s) batchmove There is a safe method And so if we go back here and we click on the safe method It says here That should run PHP year that should run in the safe method And then You have the data it's a array And it's called [01:12:27](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h12m27s) Data So If you look here It means You're able to Target that Value The gets placed into Save Ok And I am sure that your custom [01:12:47](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h12m47s) Value Code Will be placed in before the parents saved But if you do not If you do not know in any of those Custom scripts Where that code will be set What you can do is just type It is [01:13:06](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h13m06s) Loaded Here And then compile save it and compile the component and then go look at the code And you see where it is showing up And then you can add Ok I've got all these values already In the script Because all that component builder is gonna do it's just gonna Let's say It will just say [01:13:37](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h13m37s) That's that's how it will look It'll just add to string so when the component itself runs it will treated as code This is a comment but I mean if it was code You just execute So it is the way for you to add custom scripting Right into your component Almost anywhere really You are able to Target Through these switches The post save hook [01:14:05](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h14m05s) Is actually in the controller not in the model So You go to the controller Sermon Scroll to the bottom And you see there is a post save hook And it basically gives you the model and it gives you the valid data and you can Actually can perform extra features on it [01:14:27](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h14m27s) But in all these things You you should just read the description here it says PHP here that should run in the post Save hook method And there's the object model is the data model Object and the erased validator is the validator So if you just read our little note here Then you can start coding For it Ok That is so adding custom scripting To the view [01:14:55](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h14m55s) Basically the list view as well as the Each View And then the MySQL dump area Which we looked at earlier You can do two kinds of dumps now What is this used mostly for Well what I found while I was Busy developing That I would be Busy setting up a component [01:15:15](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h15m15s) and install it and then add dummy data to it to see if it works And then every time I make a change And I uninstall that component and install the new one Because whatever change it made to the database Won't be You're not added to the database via an update You need to uninstall the component and install it again To get the database back to where you want it And so the only way I could do save myself [01:15:43](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h15m43s) Time Is to actually say listen I'm gonna Re-install this component and the dummy data for sermons I would like to retain And so I would go table and I Open the tables it will show me a list of all the Tables that are in the database at that moment And then I would scroll to sermon the Sermon table click on it [01:16:06](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h16m06s) And it will load The table and What it should be called In the data set Here is some explanation if you want to do Other tables so let's say you wanna have it mapped to multiple tables then this is the explanation on how to Do that I would not recommend doing this because possibly You will not get [01:16:29](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h16m29s) What you expect And so Just going with the values that it populates for you will Possibly your best call Unless those values change And if you are making changes adding new fields You must realise that you need to come and reset this by clicking on something else And then clicking on it again And that it loads the new [01:16:57](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h16m57s) list of Fields that are related to this table To this Back end view Table And that way When you compile the component then component builder will actually grab the data From the database and build a dump file for you Now that is one way of doing it [01:17:18](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h17m18s) I might be a little bit complex but it is saved Tons of hours The other way would be to just do a dump file itself So you'd go to Your Your MySQL you would open the specific let's Use this thing that is Smaller Field types [01:17:40](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h17m40s) And you click on Export And then you would select A sequel format And click go And this will create a dump file Of all the data in the table And you can basically Paste that dump file in here Now [01:18:17](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h18m17s) I was looking at Important So you click export click quick Then SQL and then Go And then just save it Then Go to that file Open it And having it open [01:18:41](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h18m41s) You just replace This String With Hash Underscore So and then replace all And you will not use the table Structure because that is already in component builder You just use [01:19:03](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h19m03s) This area here Basically you would copy this Area like That Cut Come here paste And click save And that will mean that you have to dump file And it will always be added [01:19:36](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h19m36s) To your new Install If a dump file is way too big You will see it by just after your clicked save come and look At the end And see if it cut it off somewhere So let's say it cut it off there that I know my dumb file is To big for the use [01:20:04](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h20m04s) Structure For your dump File I used medium text let's see medium text Here Prosafe There it is Sequel I used medium text [01:20:39](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h20m39s) So that means It's quite big You can really put a lot of Text inside of it You wanna know exactly how much just Google it and you will see I'm gonna remove this obviously because It's not related to sermons at all And [01:20:57](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h20m57s) In fact I'm not even go to use the dump here, save and close Ok That is basically setting up an admin View I know I've run around and it seemed quite hectic And I possibly will redo this video at a certain stage Try to be Structured But I think it is informative enough [01:21:20](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h21m20s) And if you Have any questions please email me and I will Try to communicate with you And if I see that a certain question comes up often enough I will add it to the Video Possibly redoing Specific area [01:21:35](https://www.youtube.com/watch?v=CdSKSCTzmRA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h21m35s) Admin views is quite intense And we will possibly revisit many of the Concepts that we have looked at today Thank you for watching diff --git a/008-Advanced-Fields.md b/008-Advanced-Fields.md index 7ad30bc..ff45e63 100644 --- a/008-Advanced-Fields.md +++ b/008-Advanced-Fields.md @@ -1 +1 @@ -Hi we just finished with admin views and we now would like to start Cooking at advanced fuel types now there are a few advanced fuel types and the one there Is most advanced is the one called custom field type so I'm gonna sort this Here by custom Fields it's that one And you see it in This moment we have quite a few custom fields in place Now let's look at two of those one of the local file this List the other one is let's do a sermon sermon one but let's first look Look at the local finalist you'd see that basically from there All the way down to there is simply PHP So I'm creating a view which is most basically Taking information if you know PHP from the global settings of your component so there Any to be a field with a name local folder in your Global settings will still look at how to set up Global settings when we get to component and if it hasn't got a Setting it falls back onto the image which is in the J bus route For your component this will be replaced with your component name and it puts it into local folder And then I just start the options and I The options are a witches Fortune gonna return and the first thing I said to her there's a Please select a File add files Depot yes if there isn't files It will say please add files to and I'll give the local father's name if they There is files it work we gonna update those then over here so firstly we bringing File system classes from Joomla then we Basically check whether that folder exists and if it doesn't exist we created That's just in the fuel pipe now once it's created and if it Just skips this doesn't go in there and it just starts by grabbing all the files And from that folder and place it into files and then starts up an array Where is Loops the files inputted into options and By doing that we are basically images check you insure You're adding the file name and the file name To our options and then returning the options array so you can add your own custom PHP Scripting in the when you extend a listview so the list sorry list field were Extending list field so it's just gonna be a drop down list of all the files in that specific folder Hi there images or the for that it was set be overly in local folder ok so that's your setting up Although now there is a a a field Called filelist I thank Ya that is the reason why I didn't Use filelist is because finalist has a static directory to where You need to add the files so that you can view them and we wanted To have it be able to rename the file folder sorry for the For the files for the media do anything and then have it update itself automatically so that's why we didn't Custom field where we extended the list and we just refreshed this Detailed back so we chose a custom field and then We just extend the list type and we don't want to to have a at You button because you it won't work you will just break and we don't want them to select Multiple ways we are allowing them to select multiple now since we are using multiple We need to go back and make sure that we are storing it as a data so that Jason is when Multiple or erase any kind of arrays in a value you need to store it it's AJ And the opponent builder itself will check if it is a multiple Selection is true it will automatically store it in a Jason object even if you forgot to select this So we have got some things in place to sort of insure that it's system Behaves as expected Ok let me see that Susie quick view on Doing a local file custom field has a local file now Which I'm sure you all if you've been waiting for is let's look at how How to create a sermon preacher custom field so basically it's a Preacher So what is this field gonna do it's gonna show a list of preachers But is gonna basically display the preachers that are set up in the preacher listview ok so Open that so let's see the convention Is that you would call that type preachers that's the listview name But you'd called the name you would use the same as the editing Name which is preacher without the s so if you go back to your app and views you would Use this name as the name of the field but you would use that name as the type You see because you now creating a custom type and the logic behind it is it it's gonna show A list of preachers but you gonna select just one preacher ok so that's just the logic the labour You can really put whatever you like whatever is descriptive enough for your user to understand And then there's a place for adding a description then here we are set Multiple Tiff files we want them to only be able to select one preacher at a time E-40 all basically left to their default values and Extending list is the most common custom field that we have if you wanna See the list of custom Fields that is available you can go up here to extend and you see that list Radio and chicks check boxes are available I think I should update that too also say you User is also a user option to extend user If you want to see if we are what is available then look at that name J form field and go to component builder go to the Backing of component that would be administrator components component Then go to compiler that's a folder then go to Gmail at 3 Which is the current version we are targeting and then search for that J&J form there is a form so Ones that are available to extend the user J form field user you must it must say to a form field Sojay form field user game for field radio form field list Enjoy form field checkboxes this also means if there is a form field you why Want to extend that doesn't exist already in our advanced Seminar will show you how to add your own form Fields here there sit basically two places Change I wish I could tell you now one of them would be to add the field and update it accordingly And the other one would be too to add it in a few places in the code And also in a Jason file called settings there so does our Some of the things we will deal with an advanced adaptation of component Builder We will still set up that series very soon it's not finished yet though ok Getting back to extending a listview sorry listview you but Simply the Their list ok then there's also a few Conventions one of them being that if you are gonna be targeting like this Example we have Talking targeting the preachers you will be using the preacher Table as the table that is being targeted so the question to ask Is where is the data gonna be found that is the table That needs to be added in which component is it gonna be found and that is what need to be added by Buy component now the reason why we have this hush hush hush component here Because it's a placeholder which component builder will replace with the component score Once it's built it's a It's a Preacher we add it because some We want to rename components and if you had statically added The actual component name there then you have to and every field go and update that name and every Review go and update that name and you know every where were you with actually study the added the component You will need to update it but to explain to you exactly what the system Is doing I can go to components open sermon distributor And then take the name and code like that copy And see that it's on the on this course see if it was an upper Underscore lowercase to uppercase like that it mean It would mean that you have to place this the the component Name as well with an uppercase so you wet just do a scissor lowercase S lowercase so that is actually what the system is doing it actually is Just replacing these these Place holders with the with the actual component name on Fly so using the placeholders basically saves you time in the long run Prompt making changes everywhere if you make her change the components name Which is quite normal to do very often you start with the component in his think of calling it so I'm Realised that name is actually been used in the gym repository and you need to choose another And to do that is gonna affect the whole component and so we added this Placeholder structure which would make a better less painful at least man anyway Wherein all the code custom coding that you're adding and you need to use the components name You can simply use this hashtag format of replacement In some areas you would need to use brackets like that But most of the time it will use either way work either way the best Measure to ensure is to try it with a hash is first and If you go into the code and you see it didn't replace it then you know it's the angle brackets that needs to To be used anywhere so in this case we are using these hash The Hash signs Zimbabwe directors and then the view again that is this Single variable after view so if we were to close this and go to the view Which would be then preacher or lowercase Is what you would be adding here make sure that it's always lowercase And then the listview or the views plural with be there Add value there or lowercase as well and then the value field Is the field that the user will see so that is what is visible Full in the UI user interface the key field is the Value that will be stored in the database now these field relate to this table so in Inside the stable what field do you want the user to see now that would be the name of the And inside the stable What field would you want to store In the other database because we are looking into preacher but we gonna store it Wherever this field is being used right so that would be the ID and The column name in that data base of that view wethersfield will be used will be called Preacher so to show that to you in the database itself can open it there Scroll down to summon distributor open sermons Kickoff structure and here in the back end It's closed this go to Sermons new And will see that there is a place for preacher If I was to look with firebug and it we'll see that it is basically The name is preacher and remember we spoke about this day on this day fall on the score as the ID But it's actually Simply the preacher field which is being stored directly in In the database in the preacher Column of the table and it's stored as integer 11 and that It was set up here right in the chair 11 and we say that it is a key so we can Target So here at the bottom if we looked at in Nexus will see that it Has actually added it is a key and we go ok so that All is done right here in the database structure and then in this area Nog n in the this part which you can add your own custom PHP The fact that I'm using 1918 17 is just sort of creating Line breaks and spacing and tabs for me dynamically I could have placed them All just under PHP one with without this Quotation marks Uno Wrapping around the mall like we just did with the file file folder list View Previously just a note inside of this code you cannot These a quotation marks you need to Use single quotes unfortunately at this stage it is not able to Comedy or if you even if you try to do an Escape it will not behave as it's as you So my apologies for that at this stage you can only do single Quotes between these two quotations and I will quotes Ok so that is adding a custom field which is that made more at bomb If you know PHP your know exactly what's happening here again these Place holders Flat back to these values here so basically a dart ID will be written there Text value the field value is gonna be called a dart Name and then ID and code text this code Is build-up by the view that we are in and the text so this would read Preacher sorry sermon preacher in in in the code and that I can go show you how it looks when it builds it it's quickly look at that So to show you where it starts let's open that Field list to this is what it starts with basically it replaces this place holder With your code ok and it replaces all these features Up here as well And updates that and So every where you see these things It's gonna be updated And obviously everything up here will be replaced with your licensing Ok so that's look at that But then now let's look at the Finished product Sermon Based on the modules field There's pictures Open it You see that it added preacher there And in the input Did add it and it also shows you Where is you have trip that's what's like me Plane to show the line-up It shows you in what file These files I found Under The If you got two components on the compile sorry no Under helpers Compiler We are these files Being used While I'll possibly when we go to the advanced section I'll go much more in-depth Regards to These files Now we just trying to get the cross how to build a component Not to extend Builder itself as yet But at least you're you can see where in the code it is actually building this Piling listen Putting it together And Remember we talked about It is Getting The structure let's Go down I guess this is Used for the button This is to generate a new Batman When you are when you when you Can click on new Basically that is Button there There is generating the button This is what controls whether the button should show up aware that it shouldn't then And even if it is to be set at all Ok so this is basically what generates the button This area here the gate options You see we said that it will show the name And it will show ID And so Go back to our Structure here It basically we dynamically replaces these with those The reason for it is it's actually done a few times And I felt like ok let's let's make it that you need to update these values And then if you get update gets updated all over it Bottom of the code And it makes it just much more easy to To change your custom Fields Sorry Build a field called preacher name Which again it uses Because it Retrieve the object From the database Nsfl objects Cysts Accelerated And builds up Auction list Returned So dynamically generates your list It's a component builder through that infrastructure that it Just explained here Actually compiles all of that code for you And puts it in the right file in the right place and all of that And obviously once you build a component and you know where you have made those changes in Builder You can go look at those files If you know how to build a Joomla website I use the same conventions as decor In regards to implementation Of your files Ok At the moment we are only pulling values that are published This is what that is That is the custom fee I feel like I am Maybe Mumbling on without purpose so let's get out of this one I think we can quickly look At this One which Dropbox This one is much more advanced What we are dealing with here Is a file That actually Is stored if I look here in it What I did is I created a function in my component Global helper function Called get Dropbox links Adele's in that it Once manual links And it bad to say Specific Variable 2 And it would return a bunch of links And those links it will check if it exists Check the array not only that it is an array but it actually has values in it And if it does it actually just back City Options And gives it Over 2 The options are Now This part here Means that you can in your Custom field types You can add a helper Static Method call If you know what those two symbols near me It means it's a static method Being called from a From a class Now this class is something that if you're a No did you lie API and know how to work builder component You know that You can add to any component what is known as a Helper class Now If I was to go to summon distributor The component helper class is always Located In The helper Folder The admin as well as the site View The admin is then in the backend which Administrative components And then There is the component And there is it's helper Folder And the front and you have the same convention Ponant 7 Pewter And there is the helper Structure Ok and here is some of the Scripted Components sorry which cement distributor structure Through it's helper structure There is the Helper file for the front And here View helper file For the back How to add methods Do they already Helper files Have you don't want to know what all the custard helper is is That we ship With all components You can open component Builder You can go to the compiler Sorry Go to gym at 3 And I look for the helper file in the site help If you open it You see alot of helper methods obviously with a lot of Place holders Which we will Customised for each Component Targets that component And you see there's a Jason tostring method here to say get bars Music bar singular This is just to get one variable from the database we don't need to always Reese Books right This whole string To get just one variable You can actually come and Look at how this works and use this To get a variable from the database We also have is published Check if a Specific Object is placed I get actions But again This is way beyond the scope of Just looking at custom Fields We will go into great depth into all the features of a helper structures in That when we deal with advanced concepts But I'm just giving you a heads up so at least you can start looking at it and Possibly get yourself going We are I wrote these Functions check object check array check string I take Jason Shorten Merge arrays Save string And Escape HTML Replace numbers this one I'm using White orphan You know if you basically do Save string We change every number in the string or immediately to Do Text So that you can be sure whatever you get back from safe string Doesn't have numbers in This is sometimes quite necessary in fact All the time Especially if you don't know if there might be a number that the First Character Mike Pienaar This way we are insulin that Always It's actually text Ok so there is just a whole bunch of Custom Methods that we ship With all components that are developed so if you were to Open Like I said Swimming Distributors Custom Sorry Helper Glass You see that these helper classes are now Showing up here Directions Shorten string major a She can come and if you are any of you feel that the methods that I have to use theories arcade or Outdated Please go on the forums that get up and talk with me about it All very gladly look at it C I know I recently tried to improve on this chicks String By doing That So I could actually dump The spot Save on Query But For some strange reason This started Causing problems All over and strings that were strings were being returned does not beings Tightening But what I can tell you is that Hi Obviously Went back to the old School way of doing it This way I don't know That there might be an easier way Obviously we first one to ensure That it's set That actually This value is set And then it is string and then it actually has a link this is something can be a string and yet don't don't have a length I might be wrong on that and yet this is what I found I've only been coding and PSP for 3 years now so I'm definitely You get teach me a few things You been hurt Ok Back to the UI That is where I get these values so showing it to you In here Go up a bit Says get Dropbox links C Now We see that Does this thing of return Which is set to false Now that means if I only was to say That it should return the manual Values Then it will only return the value manual links But since I've said it 2 It will actually return all of those links and not just One of Ok so because you can actually target that it returns One specific sermons So this method is Squat dynamic And that's all that I'm calling In in this Advanced Fuel type Which is called custom field And it gives me a link of all the Sorry an array of all the Which I did just load like her Ok so that is again as you can see quite Advanced implementation of this Custom fields And Obviously As you Hope you would realise Siri can do anything You can with that list conception You could even grab a bunch of website names You can put any PHP in there and build a list which can be used To save to the database Ok let's see that would be the custom Custom Fields there is also one called custom user How to custom user at the moment it doesn't look like I have any The demo There for you So I just click on you And then select Custom user And You see that the custom user basically You don't need to set or changed Change anything From Here to there All days should actually just work Departed you might want to consider removing Would be The BHP The spot Basically what this part does Is it limits the The user list Do only a certain Group That means again you need to set up a global Value in your component Field In your Global About that Basically the options button Clip-on options Open set Place which you said Global these are all Global values this is a Area for Global Values Now You can get hold of those Global values through the component helper Get params with a component Name And get When there you would paste So that's how you can get a value from your Global settings And basically I'm getting a specific Groups value and place again in here And then I am Returning that group that's all this part of doing Impact Does two sections are actually So this one Is what helps you Set Ok I wanna just return a specific group Disbarred Help Sue Set Any users you want to X Now this specific feature here Ensure that only one record per user is set so let's say a user has already been Added to a previous record Then That user should not show up again It should be removed from the list So this is what this PHP is doing It's simply looking to this current View And checking if the If there is users and getting their ID is in And then setting them Up in the correct manner They are unique And then returns them So Those are the users that already have So if you are building something Which are supposed to To have Student ID details for example You don't want a Student to have one than more more than one Entry in that table right You want every student to just have one in And so if a student already is selected You wouldn't want them to be selected again that's what this Exclude feature Act How to show that to you in the code Let's go to Another project that I am Working on for learning manager And they have Field Court student Student uses Now There are two kinds of Ways to To do this One is to a knot Allow more than one user To have an entry And then you would basically The one is saying ok exclude users that already have been used So that means if you use it been selected that whole thing that I've just explained The other one Ashley returns null which means it will always show all users And the way to have it set this to lol Would be simply to remove That part Of your Of the code Then it will automatically set This value to null Now when I gets about the group part it's the same principle If you don't want it to just show a specific group You can actually it will also be set to now That And presumably component builder will do that And all you need to do is simply remove What is part of the code And then it will actually And so That is true Target a specific group And also to Target Or to remove specific users So let's say That You want to remove users that Belongs to other Table or other structure then all that PHP that you need to write You can place on the day Type Php.exe So you could do That Die PHP x 1 = All your PHP can be placed 44 excluding And For the group It's simply Sorry not Directly one You can just Take that And This one will be used For the groups that actually says it there Get exclude method PHP for the gate group And in the code Which is stored under Fields models You see what it will do so you can do things and then come and look What did component builder build How does it Login Then you can actually go to the view Mike we have here And see does it's actually work is the preachers showing up And then you can use firebug That And you can look ok so That one is Index Here is a select list And here you have the values So that's the ID And that is the actual name Eid and then So that is how it should Display the data in Component Builder Set up the XML structure that Joomla uses This is this July Building this whole structure For you So even this nice button and everything Accident handiwork It is doing that For you And This is all done through these XML Input values that So you were changed it type 2 You might say stuff Oh yes there is something to To remember here The type names May not have on the scores Or any spaces in them Fact anything that is not translatable Usually needs to be 0 Not not have any underscores Sorry not have any spaces So you can't do this That would it will just not work So you must Remove the underscore You can do that but that's Sort of Think it will be made lowercase anyway So you could just And then it will work because that is used not only Indiphile Database but it's also used in Everywhere this file type So as you can see In here That file type is called student And even the file is Hope that And here it is Student user and here it is called student user And this one Yes in the file server So you can see that that that specific name type Name Is used everywhere And you cannot have underscores In this class name Neither in this tire type name You know maybe you can but So far my experience is that it doesn't work If you do Have it So for some reason it It doesn't work So that's just a heads up on Naming of this type And so you can update these Fields they are mostly Feels that are Sort of Related Do all the other fields But this one specifically says extends user Ok so it actually Shows you how it's gonna extended So if you removed all the PHP then this field as it is now Which show all users Ok Close out here That is looking at the advanced fuel type called User Custom user Another one we need to look at is the repeatable fields Repeat of fuels is actually not that difficult But you need to understand how it's sort of structure You need to first create the fields that you want to repeat Inside of repeatable The way repeatable field structure looks In July I mean When you look at it Natural application See where Ok here we have one So this from there On the way to there is one repeatable field And If you know a little XML and you worked with her beatable Fields you'll see that Here is the The fields that are being repeated Inside Repeatable So basically repeatable field is a field type that has Other Fields inside of it Now you don't need to write any of this The way you would Structure a repeatable Fields actually Very very SIM You first create the fields that you want to Repeat And do realise you can't use repeatable fields in repeatable But you can use custom advanced fields in repeatable So if you look at that We have your again You see there is a fuel type called calls at risks Now you if you know You know there is no such field type cause and risks So that means this is a custom field so if I were to go to fields You see that there is a field called here cause Cause and risks And it basically Get set information From From this database table This is another component Drive down with And it Is Displaying Load data also making some model changes And adding some Some style to it Breaking space That is that is just dealing with Cause and risks So looking again at our repeatable field You're able to add an advance custard Inside of it But what you need To add it Is let's Open Females Flower example As you need to have the field ID And you need to order it according to Order Rwanda displayed in the Line Where you do repeatable fields So if we If we close Go back to Creating a new admin view and I click on field You see that there is 1 2 3 4 5 6 7 8 9 10 11 12 13 Fields Enviro And if I click next and they all appear again And if I click next they all appear again And that's what repeatable Fields really is about Now just structure these Fields if we Would you look at it how did I develop The specific Pop-up Repeatable Structure well I can show that to you Here is a list of all the repeatable fields that I've already built List three pages of 20 If we were to click on at Files You were looking Feels that Harris Hatfield for views Open that So this is the repeatable field for adding fields for Views And all you see here is I'm saying ok you could add 800 fields But ok And we call him the button Add So if we go back to Review See it says add And then I'm adding an ID in a class to it A description with if we were to hammer over it Here It has a little setup feels for this view Which is the description Same there And the label is fields So Airfields And Then the icon is list Audi icon Is what is shown in the button That is a list All the custom Joomla icons R You can can be used How to know these icons you should go to let me see There is a URL Darkx.com mob.org Forward slash J3 dot x jumla standard icon Farm That is the URL And you'll get to this page And These are all the available icons And you basically use that Apart This part So I wanted to check Mark Circle Check Mark Circle And I would In here Simply The icon Change that to Check Mark Circle Ok So that's how you change the icon And then these are Simply the ID is Of the fields I want Inside of the repeatable Ok And so if I was to Show you where to get the ID It simply would be close close your Repeatable field And you'd see the ID is next to the fields there on the right So you would create it The the Repeatable field statues The fields that you wanna use in the repeatable field And you would get a list of those ID drop it down so maybe somewhere and no pants on Just add them in the In the order that you want them to be Added And then inside of your repeatable field Are you a simply Pasted in the fields Area with a comma separator And then do a component builder will Dynamically Construct this whole structure For you And add it To your Component I think it's really Stunning and I hope you enjoy using Repeatable Structure I know it's little buggy still and there's a lot of talk about it not being as Stable But you're more normal basic Fields like text Fields and radio Buttons and so forth they all work Well not the only thing about the radio buttons that use that you use in Henna In a repeatable fields You need to remove the class Of your radio button So It cannot be a button It must be a dot Unfortunately it still they don't Yet make it She like the button What's the difference Well That is the button Virgin Of a radio button Gate And That is the Dot version Of the radio button And it doesn't look like a button And so in your repeatable Fields you cannot use the button It needs to be this one And what makes it a button is obviously the class That is Being added to the field So you need to remove the class Very Values From your radio button If it's gonna be Repeatable But anyway if you forgot To do that and you compile your car Opponent And now you looking at the repeatable field you'll see that the radio button is You know that it's not working Messed up Until they possibly fix it Unfortunately Ok that is looking at advanced field Corey fields Gold custom Fields custom user fields As well as repeatable fields These are really the advanced field types that there are The other thing that I wanted briefly mentioned to be so how long if we already been At this Ok see this is getting a little long So Let's move What I wanted to share to a later topic Thank you for watching \ No newline at end of file +Hi we've just finished with admin views and we now would like to start looking at advanced field types now there are a few advanced field types and the one there Is most advanced is the one called custom field type so I'm gonna sort this Here by custom Fields it's that one And you see it in This moment we have quite a few custom fields in place [00:00:32](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m32s) Now let's look at two of those one is the local file List the other one is let's do a sermon sermon one but let's first look Look at the local file list you'd see that basically from there All the way down to there is simply PHP So I'm creating a view which is most basically Taking information if you know PHP from the global settings of your component so there need to be a field with a name local folder in your Global settings will still look at how to set up Global settings when we get to component and if it hasn't got a Setting it falls back onto the image which is in the Jpath root For your component this will be replaced with your component name and it puts it into local folder [00:01:36](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m36s) And then I just start the options and The options array which you gonna return and the first thing I add to it is a Please select a File add files oh yes if there isn't files It will say please add files to and it will give the local folder name if There is files we gonna update those then over here so first we bring in the File system classes from Joomla then we Basically check whether that folder exists and if it doesn't exist we create it That's just in the field type now once it's created and if it exists it obviously skips this doesn't go in there and it just starts by grabbing all the files And from that folder and place it into files and then start something array [00:02:40](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m40s) Where it Loops the files and put it into options and By doing that we are basically let me just check here and make sure we're adding the file name and the file name To our options array and then returning the options array so you can add your own custom PHP Scripting in the when you extend a listview so the list sorry list field were Extending list field so it's just gonna be a drop down list of all the files in that specific folder either images or the folder that it was set globally in local folder OK so that's your setting up a folder now there is a field type Called filelist I think Ya there it is the reason why I didn't Use filelist is because finalist has a static directory to where [00:03:44](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m44s) You need to add the files so that you can view them and we wanted To have it be able to rename the file folder sorry the folder For the files for the media do anything and then have it update itself automatically so that's why we then created a Custom field where we extended the list type and let me just refreshed this to get that Detail back so we chose a custom field and then We just extend the list type and we don't want it to have a You button because you it won't work you will just break and we don't want them to select Multiple oh yes we are allowing them to select multiple now since we are using multiple We need to go back and make sure that we are storing it as a Json so the Json is when have Multiple or erase any kind of arrays in a value you need to store it as a Json [00:04:48](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m48s) And the component builder itself will check if it is a multiple Selection is true it will automatically store it in a Json object even if you forgot to select this So we have got some things in place to sort of ensure that it's system Behaves as expected Ok let me see that's just quick view on Doing a local file custom field as a local file now Which I'm sure you all if you've been waiting for is let's look at how How to create a sermon preacher custom field so basically it's a Preacher custom field So what is this field gonna do it's gonna show a list of preachers But is gonna basically display the preachers that are set up in the preacher listview ok so let's Open that so let's see the convention [00:05:52](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m52s) Is that you would call that type preachers that's the listview name But you'd called the name you would use the same as the editing Name which is preacher without the s so if you go back to your admin views you would Use this name as the name of the field but you would use that name as the type You see because you now creating a custom type and the logic behind it is it it's gonna show A list of preachers but you gonna select just one preacher ok so that's just the logic the label You can really put whatever you like whatever is descriptive enough for your user to understand And then there's a place for adding a description then here we are set Multiple to false we want them to only be able to select one preacher at a time default zero these are all basically left to their default values and [00:06:56](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m56s) Extending list is the most common custom field that we have if you wanna Receive a list of custom Fields that is available you can go up here to extend and you see that list Radio and check boxes are available I think I should update that too also say users User is also a user option to extend users If you want to see if we are what is available then look at that name Jform field and go to component builder go to the Back end of component builder so that would be administrator components component builder Then go to compiler that's a folder then go to Joomla 3 Which is the current version we are targeting and then search for that Jform there's it is Jform so [00:08:00](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m00s) Ones that are available to extend let's see it's the user Jform field user you must it must Jform field So JForm field user Jform field radio Jform field list Jform field checkboxes this also means if there is a form field you Want to extend that doesn't exist already in our advanced Seminar will show you how to add your own form Fields here there is basically two places you need to Change I wish I could tell you now one of them would be to add the field and update it accordingly And the other one would be to add it in a few places in the code And also in a Jason file called settings there so those are Some of the things we will deal with in advanced adaptation of component Builder [00:09:04](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m04s) We will still set up that series very soon it's not finished yet though ok Getting back to extending a listview sorry listfield you Simply There list ok then there's also a few conventions one of them being that if you are gonna be targeting like this Example we are targeting the preachers you will be using the preacher Table as the table that is being targeted so the question to ask Is where is the data gonna be found that is the table That needs to be added in which component is it gonna be found and that is what need to be added by component now the reason why we have this hash hash hash component here Because it's a placeholder which component builder will replace with the components code name [00:10:08](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m08s) Once it's built it's a It's a feature we add it because some times We want to rename components and if you had statically added The actual component name there then you have to and every field go and update that name and in every view go and update that name and you know every where were you actually statically the added the component's name You will need to update it but to explain to you exactly what the system Is doing I can go to components open sermon distributor And then take the name a in code like that copy And see that it's under underscore C if it was an uppercase sorry not Underscore lowercase if it was a uppercase like that it mean It would mean that you have to place this the component [00:11:12](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m12s) Name as well with an uppercase so you would do just a s lowercase so that is actually what the system is doing it actually is Just replacing these these Place holders with the with the actual component name on Fly so using the placeholders basically saves you time in the long run Prompt making changes everywhere if you make a change to components name Which is quite normal to do very often you start with the component in his think of calling it something and later Realized that name is actually been used in the Joomla repository and you need to choose another And to do that is gonna affect the whole component and so we added this Placeholder structure which should make a data less painful at least anywhere in all the code custom coding that you're adding and you need to use the components name [00:12:16](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m16s) You can simply use this hash tag format of replacement In some areas you would need to use brackets like that But most of the time it will work either way the best Measure to to ensure is to try it with a hash's is first and If you go into the code and you see it didn't replace it then you know it's the angle brackets that needs to be used anyway so in this case we are using these hash hash signs symbols sorry characters and then the view again that is this Single variable of the view so if we were to close this and go to the view Which would be then preacher or lowercase Is what you would be adding here make sure that it's always lowercase [00:13:20](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m20s) And then the listview or the views plural would be The add value there or lowercase as well and then the value field Is the field that the user will see so that is what is visible in the UI user interface the key field is the Value that will be stored in the database now these field relate to this table so in Inside the table what field do you want the user to see now that would be the name of the preacher And inside the table What field would you want to store In the other database because we are looking into preacher but we gonna store it Wherever this field is being used right so that would be the ID and The column name in that data base of that view where this field will be used will be called [00:14:24](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m24s) Preacher so to show that to you in the database itself can open it there Scroll down to sermon distributor open sermons click on structure and here in the back end let's close this go to Sermons new And we will see that there is a place for preacher If I was to look with firebug for it we'll see that it is basically The name is preacher and remember we spoke about this J4_ as the ID But it's actually Simply the preacher field which is being stored directly in In the database in the preacher [00:15:28](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m28s) Column of the table and it's stored as integer 11 and that It was set up here right integer 11 and we say that it is a key so we can Target it So here at the bottom if we look at in indexes we'll see that it Has actually added it is a key and we go ok so that All is done right here in the database structure and then in this area Now again in this part which you can add your own custom PHP The fact that I'm using 19 18 17 it's just sort of creating Line breaks and spacing and tabs for me dynamically I could have placed them All just under PHP one with without this Quotation marks you know [00:16:32](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m32s) Wrapping around them all like we just did with the file folder list View Just a note inside of this code you cannot These quotation marks you need to Use single quotes unfortunately at this stage it is not able to accommodate you even if you try to do an Escape it will not behave as it's as you might expect So my apologies for that at this stage you can only do single Quotes between these two quotations...double quotes Ok so that is adding a custom field which is a little bit more advanced If you know PHP you will know exactly what's happening here again these Place holders reflect back to these values here so basically A dot ID will be written there [00:17:36](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m36s) and the Text value which is the field value is gonna be called a dot name Name and then ID and code text this code Is build-up by the view that we are in and the text so this would read Preacher sorry sermon preacher in in in the code and in fact I can go show you how it looks when it builds it it's quickly look at that So the show you where it starts let's open that Field list so that is what it starts with basically it replaces this place holder With your code ok and it replaces all these features Up here as well And updates that and [00:18:30](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m30s) So every where you see these things It's gonna be updated through component builder And obviously everything up here will be replaced with your licensing tags . Then now let's look at the Finished product Sermon it's placed on the modules field and there it is preachers Open it [00:18:57](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m57s) You see that it added preacher there And in the input Add it and it also shows you Where if you had trip that switch like we have explained to show the line numbers in your component It shows you in what file These files are found Under The [00:19:15](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m15s) You go to component builder under helper's Compiler there are these files that is Being used to compile your component . I'll possibly when we go to the advanced section I'll go much more in-depth in Regards to These files Now we just trying to get across how to build a component [00:19:40](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m40s) Not to extend Builder itself as yet But at least here you can see where in the code it is actually building this and compiling this and Putting it together And Remember we talked about It's it's Getting The structure let's [00:19:59](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m59s) Go down this is used for the button This is to generate a new button when you Can click on new Basically that is the Button there ....this area from there to There is generating the button This is what controls whether the button should show up or whether it shouldn't then [00:20:21](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m21s) And even if it is to be set at all Ok so this is basically what generates the button...this area This area here the get options You see we said that it will show the name And it will show ID And so Go back to our Structure here It basically we dynamically replaces these with those The reason for it is it's actually done a few times [00:20:48](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m48s) And I felt like ok let's let's make it that you only need to update these values And then if you get update gets updated all over in the Bottom of the code And it makes it just much more easy to To change your custom Fields So it Build a field called preacher name Which again it uses here as a object value Because it [00:21:17](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m17s) Retrieves the object From the database and it looks as if that object exists it actually reiterates And builds up option list Which is returned to use in the drop down So it dynamically generates your list and so component builder through that infrastructure through what I [00:21:37](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m37s) Just explained here Actually compiles all of that code for you And puts it in the right file in the right place and all of that And obviously once you build a component and you know where you have made those changes in Builder You can go look at those files If you know how to build a Joomla website I used the same conventions as decor In regards to implementation Of your files [00:22:07](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m07s) Ok At the moment we are only pulling values that are published This is what it is all about That is the custom fields I feel like I am Maybe just Mumbling on without purpose so let's get out of this one I think we can quickly look At this One which is this manual file list [00:22:36](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m36s) Dropbox This one is much more advanced What we are dealing with here Is a file That actually Is stored if I look here in it What I did is I created a function in my component Global helper function Called get Dropbox links it tells it that it [00:23:02](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m02s) wants manual links And it passes a Specific variable 2 And it would return a bunch of links And those links it will check if it exists Check the array not only that it is an array but it actually has values in it And if it does it actually just backs it into the Options [00:23:24](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m24s) And gives it Over to The options array to the list Now This part here Means that you can in your Custom field types You can add a helper Static Method call [00:23:44](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m44s) If you know what those two symbols there mean It means it's a static method Being called From a class Now this class is something that if you know the Joomla API and know how to work builder component You will know that You can add to any component what is known as a Component Helper class Now [00:24:07](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m07s) If I was to go to summon distributor The component helper class is always Located In The helper Folder of The admin as well as the site View The admin is then in the back end in which Administrative components And then [00:24:28](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m28s) There is the component And there is it's helper Folder And the front end you have the same convention componant sermon distributer And there is the helper Structure Ok and here is some of the [00:24:49](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m49s) Java Script the Components sorry which sermon distributor structures Through it's helper structure There is the Helper file for the front And here helper file For the back How to add methods [00:25:09](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m09s) Do they already Helper files Have you don't want to know what all the custom helpers is That we ship With all components You can open component Builder You can go to the compiler Sorry compiler not controller Go to Joomla 3 And then look for the helper file in the site helper file [00:25:30](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m30s) If you open it You see whole lot of helper methods obviously with a lot of Place holders Which we will Customised for each Component so that it Targets that component And you see there's a Json to string method here that's to get bars there's a get bar singular This is just to get one variable from the database we don't need to always to rewrite . [00:25:55](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m55s) This whole string To get just one variable You can actually come and Look at how this works and use this To get a variable from the database We also have is published to Check if a Specific Object is published I get actions [00:26:14](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m14s) But again This is way beyond the scope of Just looking at custom Fields We will go into great depth into all the features of a helper structures That when we deal with advanced concepts But I'm just giving you a heads up so at least you can start looking at it and Possibly get yourself going We are I wrote these Functions check object check array check string [00:26:40](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m40s) Check Json Shorten Merge arrays Save string And Escape HTML Replace numbers this one I'm using quite often You know if you basically do Save string [00:26:58](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m58s) We change every number in the string immediately to Text So that you can be sure whatever you get back from safe string Doesn't have numbers in it This is sometimes quite necessary in fact All the time Especially if you don't know if there might be a number is that First Character might be a number [00:27:20](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m20s) This way we are insuring that it Always It's actually text Ok so there is just a whole bunch of Custom Methods that we ship With all components that are developed so if you were to Open Like I have said Sermon Distributors [00:27:40](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m40s) Custom Sorry Helper class You see that these helper classes are now all Showing up here get actions Shorten string merge array So you can come and any of you feel that the methods that I have to used here is archaic or Outdated [00:28:00](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m00s) Please go on the forums at Github and talk with me about it All very gladly look at it and see I know I recently tried to improve on this check String By doing That So I could actually dump The part and Save on [00:28:22](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m22s) the Query But For some strange reason This started Causing problems All over and strings that were strings were being returned as not being strings But what I can tell you is that I Obviously [00:28:41](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m41s) Went back to the old School way of doing it which is This way I don't know There might be an easier way Obviously we first one to ensure That it's set That actually This value is set And then it is string and then it actually has a length you see something can be a string and yet don't have a length [00:29:04](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m04s) I might be wrong on that and yet this is what I found I've only been coding and PSP for 3 years now so I'm definitely You get teach me a few things You been at it longer than I am Ok Back to the UI That is where I get these values so showing it to you In here Go up a bit [00:29:29](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m29s) Says get Dropbox links C Now We see that Has this thing of return Which is set to false Now that means if I only was to say That it should return the manual Values Then it will only return the value manual links But since I've said it [00:29:52](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m52s) to 2 It will actually return all of those links and not just One of them Ok so because you can actually target that it returns One specific sermons link So this method is Quite dynamic And that's all that I'm calling In in this Advanced [00:30:15](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m15s) Field type Which is called custom field And it gives me a link of all the Sorry an array of all the links Which I didn't just load like I have explained Ok so that is again as you can see quite Advanced implementation of this Custom fields And Obviously [00:30:37](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m37s) As you As I hope you would realize Is there you can do anything You can with that list conception You could even grab a bunch of website names from somewhere You can put any PHP in there and build a list which can be used To save to the database Ok let's see that would be the custom Custom Fields there's also one called custom user Now the custom user at the moment it doesn't look like I have any [00:31:08](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m08s) in the demo data for you So I just click on new And then select Custom user And You'd see that the custom user basically You don't need to set or changed Change anything From [00:31:25](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m25s) Here to there All those should actually just work the only parted you might want to consider removing Would be The PHP This part here Basically what this part does Is it limits the The user list [00:31:47](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m47s) To only a certain Group That means again you need to set up a global Value in your component Field In your Global remember we talked about that previously Basically the options button If you click on options [00:32:07](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m07s) It Opens a Place which you said Global these are all Global values this is a Area for Global Values Now You can get hold of those Global values through the component helper Getparams with a component Name And get When there you would place the field name [00:32:28](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m28s) So that's how you can get a value from your Global settings And basically I'm getting a specific Groups value and placing it in here And then I am Returning that group that's all this part is doing In fact Those two sections are actually independent So this one Is what helps you Set [00:32:52](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m52s) Ok I wanna just return a specific group This part Helps you Set Any users you want to exclude Now this specific feature here Ensures that only one record per user is set so let's say a user has already been Added to a previous record Then That user should not show up again [00:33:18](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m18s) It should be removed from the list So this is what this PHP is doing It's simply looking to this current View And checking if the If there is users and getting their ID's And then setting them Up in the correct manner They are unique And then returns them [00:33:36](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m36s) So Those are the users that already have So if you are building something Which are supposed to To have Student details for example You don't want a Student to have more than one Entry in that table right You want every student to just have one in [00:33:58](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m58s) And so if a student already is selected You wouldn't want them to be selected again that's what this Exclude feature Actually does How to show that to you in the code Let's go to Another project that I am Working on called learning manager and modules And they have a Field Called student Student users and user [00:34:27](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m27s) Now There are two kinds of Ways to To do this One is to not Allow more than one user To have an entry And then you would basically The one is saying ok exclude users that already have been used So that means if a user have been selected that whole thing that I've just explained [00:34:52](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m52s) The other one Actually returns null which means it will always show all users And the way to have it set this to null Would be simply to remove That part Of your Of the code Then it will automatically set This value to null Now when I gets about the group part it's the same principle [00:35:19](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m19s) If you don't want it to just show a specific group You can actually it will also be set to null like That And component builder will do that And all you need to do is simply remove What is part of the code And then it will actually And so That is true Target a specific group [00:35:48](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m48s) And also to Target Or to remove specific users So let's say That You want to remove users that Belongs to other Table or other structure then all that PHP that you need to write You can place on the Type phpx [00:36:11](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m11s) So you could do like That type phpx1= All your PHP can be placed for excluding And For the group It's simply sorry not Directly one [00:36:33](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m33s) You can just Take that And This one will be used For the groups that actually says it there Getexcluded method PHP for the get group And in the code Which is stored under Fields models You see what it will do so you can do things and then come and look [00:36:59](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m59s) What did component builder build How does it Look Then you can actually go to the view like we have here And see does it's actually work is the preachers showing up And then you can use firebug like That And you can look ok so That one is [00:37:24](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m24s) Index Here is a select list And here you have the values So that's the ID And that is the actual name of the speaker and the ID and the name So that is how it should Display the data in Component Builder Sets up the XML structure that Joomla uses [00:37:53](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m53s) to build this actually Joomla is Building this whole structure For you So even this nice button and everything is Joomla's handiwork It is doing that For you And This is all done through these XML [00:38:08](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m08s) Input values that you are adding here So you would change the type to You might say staff members Oh yes there is something to To remember here The type names May not have under scores Or any spaces in them Fact anything that is not translatable Usually needs to be [00:38:35](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m35s) you know Not not have any underscores Sorry not have any spaces So you can't do this That would it will just not work So you must Remove the underscore You can do that but that's Sort of I Think it will be made lowercase anyway [00:38:57](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m57s) So you could just And then it will work because that is used not only In the file Database but it's also used in the name convention and Everywhere this file type So as you can see In here That file type is called studentusers And even the file is called that [00:39:21](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h39m21s) And here it is called Student user and here it is called student user And this one is with the s that one with a s in the file is also with a s So you can see that that that specific name type Name Is used everywhere And you cannot have underscores In this class name Neither in this type name [00:39:46](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h39m46s) You know maybe you can but So far my experience is that it doesn't work If you do Have it So for some reason it It doesn't work So that's just a heads up on Naming of this type And so you can update these Fields they are mostly Feels that are [00:40:07](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h40m07s) Sort of Related To all the other fields But this one specifically says extends user Ok so it actually Shows you how it's gonna extended So if you removed all the PHP then this field as it is now Whould show all users evertime Ok So let me just [00:40:28](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h40m28s) Close out here That is looking at the advanced field type called User Custom user Another one we need to look at is the repeatable fields Repeatable fields is actually not that difficult But you need to understand how it's sort of structure You need to first create the fields that you want to repeat Inside of repeatable fields The way repeatable field structure looks [00:40:55](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h40m55s) In Joomla I mean When we look at it in the actual application let me See where did I used a repeatable field OK here we have one So this from there all the way to there is one repeatable field And If you know a little XML and you worked with repeatable Fields you'll see that [00:41:23](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h41m23s) Here is the The fields that are being repeated Inside of the Repeatable field So basically repeatable field is a field type that has Other Fields inside of it Now you don't need to write any of this The way you would Structure a repeatable Fields actually Very very simple [00:41:47](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h41m47s) You first create the fields that you want to Repeat And do realize you can't use repeatable fields in repeatable fields But you can use custom advanced fields in repeatable fields So if you look at that We have here again You see there is a field type called cause and risks Now you if know Joomla You know there is no such field type cause and risks So that means this is a custom field so if I were to go to fields [00:42:16](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h42m16s) You see that there is a field called here cause Cause and risks And it basically Get set information From From this database table This is another component That I've done with component builder And it Is [00:42:35](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h42m35s) Displaying those data also making some model changes to the data And adding some Some style to it nonbreaking space and stuff like that Ok so that is that is just dealing with the Cause and risks So looking again at our repeatable field You're able to add an advance custom field Inside of it [00:43:00](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h43m00s) But what you need To add it Is let's Open Females For our example As you need to have the field ID And you need to order it according to the order you want to displayed in the Line [00:43:17](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h43m17s) Where you do repeatable fields So if we If we close here and then we go back to Creating a new admin view and I click on fields You see that there is 1 2 3 4 5 6 7 8 9 10 11 12 13 Fields In one row And if I click next and they all appear again [00:43:43](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h43m43s) And if I click next they all appear again And that's what repeatable Fields really is about Now this structure these Fields if we Would you look at it how did I develop This specific Pop-up Repeatable Structure well I can show that to you Here is a list of all the repeatable fields that I've already built This three pages of 20 [00:44:08](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h44m08s) If we were to click on add Files No wait we were lookingat add Fileds let's see add fields add fields There it is addfields for views Open that So this is the repeatable field for adding fields for Views And all you see here as I'm saying ok you could add 800 fields it way over kill But ok [00:44:37](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h44m37s) And we call him the button Add So if we go back to the view See it says add And then I'm adding an ID in a class to it A description which if we were to hover over it Here It has a little setup fields for this view Which is the description [00:44:59](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h44m59s) Same there see And the label is fields So it says There fields And Then the icon is list Now the icon Is what is shown in the button That is a list All the custom Joomla icons [00:45:17](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h45m17s) are You can can be used How to know these icons you should go to let me see There is a URL Docs.joomla.org / J3.x: Joomla_Standard_Icomoon_ fonds there you go That is the URL And you'll get to this page [00:45:41](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h45m41s) And These are all the available icons And you basically use that that part well this part So if I wanted to checkmark-circle Copy checkmark-circle And I would Sorry in here Simply [00:46:02](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h46m02s) The icon Change that to checkmark-circle Ok So that's how you change the icon And then these are Simply the ID's Of the fields I want Inside of the repeatable field Ok And so if I was to [00:46:22](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h46m22s) Show you where to get the ID It simply would be close close your Repeatable field And you'd see the ID is next to the fields there on the right So you would create The the Repeatable field that you o sorry The fields that you wanna use in the repeatable field And you would get a list of those ID's jotted down so maybe somewhere a Notepad or something Just add them in the [00:46:51](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h46m51s) In the order that you want them to be Added And then inside of your repeatable field You would simply Pasted in the fields Area with a comma separating them And then component builder will Dynamically Construct this whole structure For you [00:47:11](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h47m11s) And add it To your Component I think it's really Stunning and I hope you enjoy using the repeatable fields Structure I know it's little buggy still and there's a lot of talk about it not being as Stable But you're more normal basic Fields like text Fields and radio Buttons and so forth they all work Well now the only thing about the radio buttons that use that you use in [00:47:39](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h47m39s) In the in the in the repeatable fields You need to remove the class Of your radio button So It cannot be a button It must be a dot Unfortunately it still they don't Yet make it possible to actually load the button Now what's the difference [00:47:59](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h47m59s) Well the difference is let me see if I can quickly show you That is the button version Of a radio button Ok And That is the Dot version Of the radio button And it doesn't look like a button [00:48:20](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h48m20s) And so in your repeatable Fields you cannot use the button version It needs to be this one And what makes it a button is obviously the class That is Being added to the field So you need to remove the class uh Values From your radio button If it's gonna be used in the [00:48:38](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h48m38s) Repeatable field But anyway if you forgot To do that and you compile your component And now you looking at the repeatable field you'll see that the radio button is You know that it's not working That it is messed up Until they possibly fix it This is unfortunately the case Ok that is looking at advanced field [00:49:04](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h49m04s) Sorry fields called custom Fields custom user fields As well as repeatable fields These are really the advanced field types that there are The other thing that I wanted briefly mentioned let me see how long if we already been At this Ok see this is getting a little long So Let's move What I wanted to share to a later topic [00:49:27](https://www.youtube.com/watch?v=VpzYbifqv0M&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h49m27s) Thank you for watching diff --git a/009-Adding-Admin-Views-to-a-Component.md b/009-Adding-Admin-Views-to-a-Component.md index e9aeee2..7700368 100644 --- a/009-Adding-Admin-Views-to-a-Component.md +++ b/009-Adding-Admin-Views-to-a-Component.md @@ -1 +1 @@ -Hi Reef Lock that setting up admin views with group that Creating fields for admin views Bluetooth setting up fuel types and how to use fuel types to create fields Now we would like to look at Setting the admin views to the component Obviously the component itself has so much things that you can do I'm gonna try and Deal with it No airtime So I'm first gonna just look at adding The Admin views to a component Ok so You go to components And will go to 7 distributor And you would go to settings Yeah you'd see Admin views To connect admin views to your component you need to go to settings and open this button Usually when you start to look like this So very straight forward Have a drop down here And you make a selection selection And then click next And you do the next one And if you have a lot of admin use Like I Do here You would Type in the name of the admin View And dairy Howick So I'm gonna type in the name here sermon Now these icons here I spoken about them previously They are the icons from Joomla Which is called I Just look Standard Icomoon font Ok so it's this This font here Now If you select a And I can't hear You show you that little icon with only during the selection face So That is the icon That is gonna be used For the view You're in the right I come there As we click through Component Builder It updates that I can't This icon Is what is being said here Now you can select the icons to Reflect Upward view of your choice Now we have a bunch of switches here and I'll look at them one at a time You have the menu Is basically this menu So the question is do you want that View to show up next to your main View I'll be the first Tick box So it's a yes Then Do you want to have an add record Icon For this review Icon if you go to the dashboard Is this This icon here Basically a shortcut to creating an admin View From the dashboard Song Will say yes Then A dashboard list of records icon So maybe you don't want this icon just Add new Then you can take that Again here we would like yes Then a submenu Number submenu if you've opened Your View that has a submenu year that can collapse away I just submenu You can add this view To the sub menu or not Then Water checking Is a Little tweak that I've added to to my Gmail or components and I'm possibly gonna Make a call request to add it to July it's self What How to check indoors Is it Absa feature to your component Since you see I have clients that complaint That some people will open an item And then in the browser click back instead of picking clothes And I will keep the item locked out Do that Individual And so others cannot access it unless they have admin rights to check it back in So we created an altar checking Now to check in check Whether this item has been checked out longer than a set period I never has been it takes it in automatically know that said period Is Something that the administrator sets in the global settings of the component I'll show you that later Just that you know You can add oil to check into a view By the saying yes or no here Been keeping history of a Back and view Now these three component I must tell you is maybe one of them most exciting things that I could integrate You see what it does is it keeps track of every change you make In any article or any item in your application So for example If I was to go to Let's just look at just a moment To a Preacher And I would open up this acapella music You see that it has that version button here the top Bye-bye was gonna make a change here let's say I typed in Infrared medium And I said Some text here And I clicked save And then I clicked on version You see that it's now locked a new version And there are the old ones And I could click on one of the old ones and click result First let me say I could take the one I'm on currently And I get say keep That would sort of lock it in because You can also set how long How long How long amount of History should the system keep The default is 10 then change is so I can click on the previous version and say restore And this will restore it and you see there Email address is gone and this description is gone If I want to go back to the one I turn I could just get three conversion again I think there and also restore And Now We would see wow The details are Back Again That is the feature of history that is actually extension Which You're able as a application to the component developer Integrate into your own Components And it's not that easy in fact it's maybe very Difficult If I was to show you the amount of product let me do that That you need to write First of all you need to add An asset ID to all your Backend view database tables So if we were to go to 7 distributor And check Front entrance go to the back in And we check out it's equal table You see that all of them have asset ideas Now That is Really not as easy as it is Once you've got the acid ID Then in your model When you basically save Sorry not in the model Table When you start your table you should set up observers The check baby The specific Item to add history options 2 Do that Acid ID So this is this is part of the whole Part of the script that is being added this is being added on the right place As well as in the store method There is another Tweakbit I My take too long to look at all of that Will go into more detail in the advanced courses I suppose But just let you know I create an import export method And even in the import and export of data actually Primarily in importing of data You need to again Do a pilot Vance trick to ensure that the history of that I can will still be tracked These kind of features I just added dynamically to your component because of that switch No that's not the only code the code that really throws people out I suppose Is this group code Script that is used When the component installs So if you look at this This is the uninstall error error in the script code Which runs when you uninstall the component and it's looking in many places it's looking in content-type it's Looking in the content Tag map Is looking in the ucm base Looking in the content types again and review I mean This is not just Once off Pittsburg you these checks are done and we are removing any items That might remain there Because when you uninstall a component What you don't realise Is it so integrated into the July system that just removing it's on tables actually doesn't do the job So we added the feature that if you uninstall it actually cleans the July system of that extension from Completely which is ideal because you won't want any traces left you you would like to uninstall something You want it gone And so this uninstall method does exactly that And then with the installing of this component Yeah which is the post Lite install We actually had Many records to Areas inside of Jamila so for example Inside of the letter C Add content type We we need to add this information And we have to do it for every view with your selected Hi the tags or History Will look at the tags in the category consequent Just a little bit Later Just to get a heads up and I realise this and not Take me to say we will look at that The new content types as you see we are adding it for the server Romans we adding it for the series says we're adding it for the sister sticks and for the help documents And that is when we install their component we are needed now You not seeing all picture let me scroll a bit look at that String that needs to be Written and Added to the database Of these specific areas To create that integration where it will track the object change and just do it automatically So all this is generated by component Builder And then when you do an update now you raise the issue When you do an update and you're adding a new Field Do I view This update will make sure that that specific field also will get tracked So what it first does Is it gets the data it tries to see whether it already exists if it exists Minutes here It just updated If it's been for some reason removed It inserts So that is the update method The update method also takes care of the little lot of discrepancies Because as you develop your extension now These two faces to development Do want phrases when you're busy building it and no one else in the world that has it That's very easy face in fact then you don't really use this nice feature You just uninstall it and reinstall it every time until you happy with what you see But then once you put it out in the public you can't just step up your database structure without the The needed scripting for others to do a easy upgrade Because they already got data in the database there can't just uninstall uninstall That's that's ridiculous No component builder has a way for you to actually dress that Well obviously because I have to deal with it and I don't wanna have my clients complain So I added a feature which will look at it inside of component Builders component the area Explain it in detail but just that you know this part of the update feature you making use You're a specific integration to keep track of your Back and view changes Two items isn't Place already Written by component Builders telling you here On which line it was done If you have that switch trip Ok so that is just giving you a quick glimpse into the crowd Of A little switch Sorry Level switch called Keep history So this weeks does all that for you for this specific View Then Depending on whether you gonna use this views information on the front end as your main base for you For your page you might wanna add Metadata The metadata is I know isn't that Use for anymore but you know what Go to Google and others are maybe ignoring it It still plays a role to making a page Very search engine optimised Component Builder If If you do your homework and you do things right In relationship to implementation of your metadata You see that it actually adds tremendous good features to Do your front end of your site So I would suggest that you add Metadata when you are gonna use a specific area to the front and when we start looking at us setting up the site Views You see this Coming up again and The necessity of using it Officially you'll be remodeling the data because you can get relationship from many databases but You need the area in the back in to get the data right Ok then this access switch Might throw you out This simply adds The following feature If you open an article in the open publish It says your access Publix Super registered Which is relating to your user I just close this New user access levels And as you know user actually will scan target multiple groups into one user access level I'm so this again is only a feature that will really be Extremely useful when you look at your front end of your component the back and you can also make use of it Of course You can change the access of a specific item but since we also have such intense permission Switches I hardly ever make use of it but it's there and I mostly use it for front end When I want a certain area in the front of sorry set an item not to be accessible to the front Ok then do you want to add to import export function again this is a Standard area which oven builder dynamically just adds so you don't need to do anything Scripting at this stage You could just click yes or no to import export Feature at the top of the page Of every View So every View Wanna have an import export at the moment it's a direct relationship import export what I mean by that Is You need to follow If you export this then you'd see the the way it should look to doing import And the import is really nice you can map their head is to their specific database tables Obviously there's work needed especially when you're dealing with Information that was encrypted if you export it it will decrypt it if you have the permission Two actions that item was but the problem is because it's decrypting When you imported it doesn't know that it should encrypted so there is a little discrepancy with the advance Storing methods so as long as you are having a data back in database table that at Actually doesn't require these advance storing methods it's just your normal defaults like me explain before the Import export more than works seemingly Without any problems I'm so I'm still working on this area but it's already working well enough that I felt I could leave it in there Ok that is the switch here and obviously if you don't like the future just know Then here is a feature which I think I'm most excited about And that is Every back in View As of course and edit area right if you've selected that Read write option then the edit area you can change the values of that back and listview So The admin create site View Means that the system Is gonna dynamically build The front Area Which you can access To edit the data at the front of the website Now Yahoo this is already whatever that's excellent tool So it takes exactly this if I was to use this and that sample Attacks This editing area and place it on the front Of your website Now obviously You are controlling in the promotional structures who has access to edit this with access to edit this The status was access to edit specific fields We looked at adding the fuels to your admin views and you could tick Whether this field should have conditional structure Now That means that If you have those things set up in the back in the Global professional tab Then it will be implemented in the Front if a certain user is in the in the correct group They won't be able to access this then if they have access but they don't have the right to for example update Maybe the modified date or The state is then in the front there also will not be able to do that so you have Immense control over who can do what But at the same time you have the ability to actually edit items on the front I think that is Excellent To be able to do that and they're all of that just possible by saying yes But Realise this The fact that it creates the The view if I could save her so And places it on the front Doesn't mean that there is a link somewhere to Earth That is something you need to add to your site front custom site As you develop it And this is partly a feature therefore which is you don't know PHP and if you're not that familiar with How to setup your links on the front of the component Impossibly would find this difficult to implement But I will show you What it builds in fact I can show you that now I have a component which I'm using that feature quite a lot And it's cold Cost-benefit projection this is the backend So if we look at the views we have your Ford company And we have One called Scaling factor and intervention Now these are editing views as you can see those other list views those are the editing views Nice I go to the front of them after the website Open that component Nikon View You see that there is company There is intervention and there is scaling factors Day Are basically being extended here So what two component build it as is it adds this view It also adds the module for it And I'm also adds the controller for it So basically I put all the script in place so that all you need to do is inside of for example I have your a An error occurred cpanel now let me show you this component briefly Ok so this is just some dummy data that I In here none of them is real And so here You can open multiple items This is all stuff that I built in component in fact none of this was built outside of component Golden It always done in component daughter And you can click on edit advance profile And it will open the editing area As you can see and now this is the back in editing area of that now let me show you sorry this is the front Editing area And as you can see there are older Tabs Now let me show you the back in Here's the back in the area So it's basically a showing up the same information in the front Is only dumps the permission and Publishing features But that is because of access permissions is done automatically Because that front-end user didn't have permissions to edit things In most of the things in here and f***** You don't have the right to edit any of these Therefore it didn't need to see it and so the system just remove that tab same goes with the permissions And if you didn't have the right to do scaling factors on interventions You also have dumped that it won't show it up In the front And so this is the back end of that same company That I've set up And you can see that it basically Moved it to the front Not only did it make it possible to edit data but also to create new companies So if you click on that You see it opens up in the area for you to start fresh so you can create a company from scratch Now In this specific example you see that you cannot actually add a user So what the system is done through some custom scripting that I've added If you click save without his ID here And he doesn't need to select that Ok so that's just a quick look at That specific button Called edit create site view and add the whole codebase to the front And integrates it to the Way that the front Needs to be able to control the permissions Then the order of of the items are Simply the way in which it will be displayed anywhere So if we think about the order From moment here Of Example component The order of which these I can't solve laid out and even if you opened one of them Order which this is done And also for the sub menu All of that is controlled with this order Number here Ok so That's a quick look at adding Admin views to your component I hope that is insightful enough for you to understand how to do that If you have any questions please you're welcome to send me a mail Thanks for watching \ No newline at end of file +Hi We've looked at setting up admin views we've looked at Creating fields for admin views We've looked at setting up field types and how to use field types to create fields Now we would like to look at Setting the admin views to the component Obviously the component itself has so much things that you can do I'm gonna try and Deal with it [00:00:28](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m28s) Little at a time So I'm first gonna just look at adding The Admin views to a component Ok so We'll go to components And will go to sermon distributor And you would go to settings Here you'd see Admin views [00:00:59](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m59s) So to connect admin views to your component and you need to go to settings and open this button here Usually when you start it will look like this So very straight forward You have a drop down here And you make a selection selection And then click next And you do the next one And if you have a lot of Admin views like I Do here You would Type in the name of the admin View [00:01:33](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m33s) And there you have it So I'm gonna type in the name here sermon Now these icons here I spoken about them previously They are the icons from Joomla Which is called I think I let me just look Standard Icomoon font Ok so it's this This font here Now [00:02:02](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m02s) If you select a an icon here It'll show you that little icon but only during the selection face So That is the icon That is gonna be used For the view Here in the right See this icon there As we click through [00:02:24](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m24s) Component Builder It updates that icon Ok so this icon Is what is being set here Now you can select the icons to Reflect to the admin view of your choice Now we have a bunch of switches here and I'll look at them one at a time Now admin menu Is basically this menu [00:02:49](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m49s) So the question is do you want that View to show up next to your main View I'll be the first Tick box So we would say yes Then Do you want to have an add record Icon For this view Now the add record icon if you go to the dashboard [00:03:10](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m10s) Is this This icon here Basically a shortcut to creating an admin View From the dashboard So Will say yes Then A dashboard list of records icon So maybe you don't want this icon just a Add new Then you can tick that as no [00:03:35](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m35s) But again here we would like yes Then a submenu Now the submenu if you've opened Your View that has a submenu here that can collapse away Now this submenu You can add this view To the sub menu or not Then auto check-in [00:03:59](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m59s) Is a Little tweak that I've added to to my Joomla components and I'm possibly gonna Make a pull request to add it to Joomla itself What auto check-in does Is it Adds a feature to your component Since you see I have clients that complaint That some people will open an item And then in the browser click back instead of clicking clothes And that will keep the item locked out [00:04:28](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m28s) to that Individual And so others cannot access it on less they have admin rights to check it back in So we created an auto check-in Now auto check-in checks Whether this item has been checked out longer than a set period and ever it has been it checks it in automatically know that set period Is Something that the administrative sets in the global settings of the component I'll show you that later Just that you know [00:04:57](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m57s) You can add auto check-in to a view By either saying yes or no here Then keeping history of a Backend view Now the history component I must tell you is maybe one of them most exciting things that I could integrate You see what it does is it keeps track of every change you make In any article or any item in your application So for example If I was to go to Let's just look at just a moment [00:05:33](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m33s) To a Preacher And I would open up this acapella music You'd see that it has that version button here at the top No if I was gonna make a change here let's say I typed in Info@vdm And I set Some text here And I clicked save And then I clicked on version You see that it's now locked a new version [00:06:13](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m13s) And there are the old ones And I could click on one of the old ones and click Well First let me say I could take the one I'm on currently And I get say keep That would sort of lock it in because You can also set how long How long How long amount of History should the system keep The default is 10, 10 changes so I can click on the previous version and say restore And this will restore it and you see there Email address is gone and this description is gone If I want to go back to the one I have done I could just click there on version again [00:06:52](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m52s) I then click there and also restore And Now We would see wow The details are Back Again That is the feature of history now history component is actually a Joomla extension Which You're able as a application to the component developer Integrate into your own Components [00:07:14](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m14s) And it's not that easy in fact it's maybe very Difficult If I was to show you the amount of code let me do that That you need to write First of all you need to add An asset ID to all your Backend view database tables So if we were to go to sermon distributor And check our wait this is the [00:07:42](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m42s) Frontend let's go to the backend And we check out it's sql table so we'll click on that You'd see that all of them have asset_ids Now That is Really not as easy as it is Once you've got the asset_id Then in your model When you basically save Sorry not in the model [00:08:17](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m17s) I think it is in table When you start your table you should set up observers The check The specific Item to add history options to to that Asset_id So this is this is part of the whole Part of the script that is being add this is being added on the right place [00:08:45](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m45s) As well as in the store method There is another Tweak which I might take too long to look at all of that Will go into more detail in the advanced courses I suppose But just let you know I create an import export method And even in the import and export of data actually Primarily in importing of data You need to again [00:09:12](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m12s) Do a quite advanced trick to ensure that the history of that I can will still be tracked and these kind of features I just added dynamically to your component because of that switch No that's not the only code the code that really throws people out I suppose Is this script code and this is if Script that is used When the component installs So if you look at this This is the uninstall area in the script code Which runs when you uninstall the component and it's looking in many places it's looking in content-type it's Looking in the content [00:09:48](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m48s) Tag map Is looking in the ucm base Looking in the content types again and per view I mean This is not just Once off per view these checks are done and we are removing any items That might remain there Because when you uninstall a component What you don't realize Is it so integrated into the Joomla system that just removing it's on tables actually doesn't do the job So we added the feature that if you uninstall it actually cleans the Joomla system of that extension [00:10:22](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m22s) Completely which is ideal because you won't want any traces left you you would like to uninstall something You want it gone And so this uninstall method does exactly that And then with the installing of this component we get here which is the postflight install We actually add Many records to Areas inside of Joomla so for example Inside of the let me see the contents type [00:10:57](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m57s) We we need to add this information And we have to do it for every view which you've selected either tags or History We'll look at the tags in the category concept Just a little bit Later Just to get a heads up and I realize this is not the place for it But let me just say we will look at that OK so let me continue Ok content types as you see we are adding it for the [00:11:27](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m27s) Sermons we adding it for the series's we're adding it for the statistics and for the help documents And that is when we install their component we are needs to add You not seeing the whole picture let me scroll a bit look at that String that needs to be Written and Added to the database Of these specific areas To create that integration where it will track the object change and just do it automatically So all this is generated by component Builder And then when you do an update now here is the issue [00:12:00](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m00s) When you do an update and you're adding a new Field to I view This update will make sure that that specific field also will get tracked So what it first does Is it gets the data it tries to see whether it already exists if it exists It means it's here It just updates it If it's been for some reason removed It then inserts it [00:12:29](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m29s) So that is the update method The update method also takes care of the little lot of discrepancies Because as you develop your extension now These two faces to development The one fase when you're busy building it and no one else in the world that has it That's very easy face in fact then you don't really use this nice feature You just uninstall it and reinstall it every time until you happy with what you see But then once you put it out in the public you can't just step up your database structure without The needed scripting for others to do a easy upgrade Because they already got data in the database there can't just uninstall and install [00:13:13](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m13s) That's that's ridiculous No component builder has a way for you to actually address that Well obviously because I have to deal with it and I don't wanna have my clients complain So I added a feature which will look at it inside of component Builders component area and I'll explain it in detail but just that you know this part of the update feature you making use of You're a specific integration to keep track of your Backend view changes To items is in Place already Written by component Builders telling you here On which line it was done [00:13:55](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m55s) If you have that switch trip Ok so that is just giving you a quick glimpse into the code Of A little switch Sorry a Little switch called Keep history So this weeks does all that for you for this specific View Then Depending on whether you gonna use this views information on the front end as your main base for your [00:14:23](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m23s) For your page you might wanna add Metadata The metadata is I know isn't that Useful anymore but you know what Although Google and others are maybe ignoring it It still plays a role to making a page Very search engine optimised Component Builder If If you do your homework and you do things right [00:14:51](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m51s) In relationship to implementation of your metadata You'd see that it actually adds tremendous good features to Do your front end of your site So I would suggest that you add Metadata when you are gonna use a specific area to the front and when we start looking at us setting up the site Views You'll see this Coming up again and The necessity of using it Obviously you'll be remodeling the data because you can get relationship from many databases but [00:15:26](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m26s) You need the area in the backend to get the data right Ok then this access switch Might throw you out This simply adds The following feature If you open an article in the open publish It says here access Public super registered Which is relating to your user Let me just close this [00:15:52](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m52s) you user access levels And as you know user access levels can target multiple groups into one user access level And so this again is only a feature that will really be Extremely useful when you look at your front end of your component and the backend you can also make use of it Of course You can change the access of a specific item but since we also have such a intense permissional Switches I hardly ever make use of it but it's there and I mostly use it for front end When I want a certain area in the front of sorry set an item not to be accessible to the front Ok then do you want to add to import export function again this is a [00:16:38](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m38s) Extended area which component builder dynamically just adds so you don't need to do anything is to relation to scripting at this stage You could just click yes or no to import export Feature at the top of the page Of every View So every View Will have an import export at the moment it's a direct relationship import export what I mean by that Is You need to follow If you export this then you'd see the the way it should look to do import [00:17:13](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m13s) And the import is really nice you can map the headers to their specific database tables Obviously there's work needed especially when you're dealing with Information that was encrypted if you export it it will decrypt it if you have the permissions To access that item of course but the problem is because it's decrypting yet When you imported it doesn't know that it should encrypted so there is a little discrepancy with the advance Storing methods so as long as you are having a data backend database table that at Actually doesn't require these advance storing methods it's just your normal defaults like me explain before then Import export method will then works seemingly Without any problems I'm so I'm still working on this area but it's already working well enough that I felt I could leave it in there [00:18:07](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m07s) Ok that is the switch here and obviously if you don't like the feature just click no Then here is a feature which I think I'm most excited about And that is Every backend view Has of course and edit area right if you've selected that Read write option then the edit area you can change the values of that backend listview right So The admin create site View Means that the system Is gonna dynamically build [00:18:42](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m42s) The front Area Which you can access To edit the data at the front of the website Now Yahoo this is the hurray whatever that's excellent tool So it takes exactly this if I was to use this and as an example It takes This editing area and place it on the front Of your website Now obviously [00:19:13](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m13s) You are controlling in the permissional structures who has access to edit this who access to edit this The status was access to edit specific fields We looked at adding the fields to your admin views and you could tick Whether this field should have permissional structure Now That means that If you have those things set up in the back in the Global professional tab Then it will be implemented in the Front if a certain user is in the in the correct group [00:19:44](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m44s) They wont be able to access this then if they have access but they don't have the right to for example update Maybe the modified date or The status is then in the front there also will not be able to do that so you have Immense control over who can do what But at the same time you have the ability to actually edit items on the front I think that is Excellent To be able to do that and that all of that just possible by saying yes But Realize this The fact that it creates the [00:20:19](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m19s) The view if I could says so And places it on the front Doesn't mean that there is a link somewhere to it That is something you need to add to your site front custom site As you develop it And this is partly a feature therefore which is you don't know PHP and if you're not that familiar with How to setup your links on the front of the component You would possibly would find this difficult to implement But I will show you What it builds in fact I can show you that now [00:20:54](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m54s) I have a component which I'm using that feature quite a lot And it's called Costbenefitprojection this is the backend So if we look at the views we have here called company And we have One called Scaling factor and intervention Now these are editing views as you can see those other list views those are the editing views If I go to the front of the of the the website [00:21:28](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m28s) and I open that component And I click on View You see that there is company There is intervention and there is scaling factors they Are basically being extended here So what the component build does is as is it adds this view It also adds the module for it And I'm also adds the controller for it So basically it puts all the script in place so that all you need to do is inside of for example [00:22:00](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m00s) I have here a I have here an area called cpanel now let me show you this component briefly Ok so this is just some dummy data that I Placed in here none of them is real And so here You can open multiple items This is all stuff that I built in component in fact none of this was built outside of component builder It all was done in component builder And you can click on edit advance profile And it will open the editing area [00:22:37](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m37s) As you can see and now this is the backend editing area of that now let me show you sorry this is the front end Editing area And as you can see there are all the Tabs Now let me show you the backend Here's the backend area So it's basically a showing up the same information in the front Is only dumps the permission and Publishing features But that is because of access permissions is done automatically [00:23:10](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m10s) Because that front-end user didn't have permissions to edit things In most of the things in here in fact You didn't have the right to edit any of these Therefore it didn't need to see it and so the system just remove that tab same goes with the permissions And if you didn't have the right to do scaling factors on interventions You also have dumped that it won't show it up In the front And so this is the back end of that same dummy company That I've set up And you can see that it basically [00:23:42](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m42s) Moved it to the front Not only did it make it possible to edit data but also to create new companies So if you click on that You see it opens up in the area for you to start fresh so you can create a company from scratch Now In this specific example you see that it cannot actually add a user So what the system is done through some custom scripting that I've added If you click save it adds his ID in here And he doesn't need to select that Ok so that's just a quick look at [00:24:19](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m19s) That specific button Called edit create site view it adds the whole codebase to the front And integrates it to the Way that the front Needs to be able to control the permissions Then the order of of the items are Simply the way in which it will be displayed anywhere So if we think about the order For a moment here Of Example component builder [00:24:48](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m48s) The order of which these icons are laid out and even if you opened one of them The order in which this is done And also for the sub menu All of that is controlled with this order Number here Ok so That's a quick look at adding Admin views to your component I hope that is insightful enough for you to understand how to do that If you have any questions please you're welcome to send me a mail [00:25:22](https://www.youtube.com/watch?v=39vY66X7GGU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m22s) Thanks for watching diff --git a/010-Component-Settings.md b/010-Component-Settings.md index c5f3380..7075e43 100644 --- a/010-Component-Settings.md +++ b/010-Component-Settings.md @@ -1 +1 @@ -Now that we've added the admin views to the component Let's look at some of the features that is still available inside of components As you can see adding your custom admin views is done there And the site views is done here Then there is a custom admin menus now this this don't let this 3 yard Controlling the menu structures for these Custom at land use in the site views are done inside of these This is if you are actually adding Custom backend Views Which hasn't been developed inside of component Builder So for example Opera browser itself has a compiler View Y'all have seen that If I We go there It's this view here Now this whole view is done outside of component Builder I I actually This is just hand go to the script That kicks off a bunch of Events now It needs a model it needs a controller so I wrote that With my you know just manually Hans and Cody And it also needs a view And so basically the view and everything In regards to it If you look at my infrastructure of component Builder You would see That I have Pioneer I have a place called custom C Inside of cross them Is where everything that you want it into you know include inside of your component is added into the Custom folder Any files in folders anything that you want to integrate is in here now you might look there See there are a bunch of things already there And I would encourage you not to remove them because depending on what you do in component builder it will Automatically include those Specially the the food tables And the import View And you like it Not sure I think you would have sound manager as well That is for 7 distributor And in PHP Excel which is the use for the exporting Data to spreadsheet and Importing a promise pets using this This library So all of that is in the custom tab And then he will see about two files as well now the Report builder itself has its Compiler view here So as you can see it's basically just empty folders And then I have the actual files Here is well there's the default compiler file Which is Then if I open it up It's basically the The Script that shows the That little dropdown of items And I have That in there And I also have the controller somewhere Scroll down Obviously Compile a there's two controller Bester model There is the compiler as well The helper File And so I am including that Into my component We look here Let me open Bodybuilder quickly Go to settings In files I'm including A bunch of things ending and that also means I'm including that here it is the compiler And I'm saying take this file I put it in admin views compiler And view And rename it See it's got the wrong name here So if you add the right name at the end of the string Antique Yes it will rename that file to this Just adding custom Files And As well as custom folders So on Grabbing the compiler views and I'm dumping it interviews And I'm also say rename it to compare the sofa by the views becomes compiler Inside of the views folder And then Obviously we first the system will first build the folders And then move your data your files to those folders so you you you will put the files here And then have the system to the folders and then it will move the files Ok so that's adding custom files to any component and this custom admin menu Is basically what I use The map the compiler menu so I would say I wanna call it compiler the code is compiler I'm not using a link because it's not another extension or another website or something like that Which you can also do And then I would select an icon Here is the information On the same kind of switches As you see with adding and custom admin sorry Mbeki interview you can tweak whether it should be an admin menu or below dashboard And be a sub menu So you can tweak that And then also in which order behind it says select before what happened View This one Should be placed Now That we are facing it before component So that means it can Go The very top Ok so that is adding An custom admin menu Because of custom Feel the fear of the files and folders that you have Created by hand and are importing Into your component when you Violet The same is done with the compiler of component builder I'm actually including it as files so There is the compiler Oh you know what I am I took All the compiler Files and I put it in the folder called compiler it is And so it's a folder which moves all the files at once that obviously can also be done Like for example as you see here BHP Excel Which is a folder Has a lot of content in it if we were to open it You see that's all these files and folders and things And so I put everything I wanted To move Inside of this folder And then in in my component I simply target that folder And it pulls it in Ok so that That's simply showing you how I had it a whole lot of folders to Two component Builder And then When I need a backend admin view custom Deep Added this feature here does that for me Now I also want to quickly cover the The area called comfort Is it this area deals with something that is actually Whiter Useful And that is to set up your Back end Global fields Now It let me go out of this one Cause it's definitely not the best in mistration let me go to 7 distributor There we've done some really amazing things 7 distributor The settings and then config And as you can see it is a very long list of things But then if we go to The actual component Set me open it And then I'll click on options You see that has many many tabs Ok all of these switches Are done in the config area All of them except some of these default switch Is that it Buy simple switches For example the global timer remember we spoke about the check-in Yeah you can set it all whether it should be able 5 hours 12 hours 1 today every second day once a week will never Checking in your items automatically the version control buttons are added automatically as well Which means the person can set the version control on the RAF And also said how many You know break or should be set F0 Then all versions will be saved So this is the version control And then The author Areas also added automatically And you can when you click in the component here Disclose this thing You see here is a contributing area you can set whether you want at empty contributing level The fields Here you can add contributor as many as you like Those involved And then the amount of empty ones you want to leave there Is also Tweaker bill And that'll basically Let me show you at this area yet Contributor 1234 And When you use this witch IT controls whether it's been shown in the back or the front of all these kind of features I'm not gonna go into my step now But they also added automatically on also the permission and structure is added automatically And if you have in the component You can actually Set that it includes you I can I said that yes If you do that Aurora matic leads This feature Due to your component And every where where you are kid is used Ok so everything else this Dropbox preacher preacher categories category Series list and series and sermons Is all done through that Comsoc Every here Now to use to add Fields to the config area you need to feel you first need to add that field Two fields So you would you go to fields And whatever field you wanna use there you need to create here So you first create the fields Then obviously you need to remember the system name that you're using Because then when you open up this You would be able to Type in the name And it will be selected And then by Convention that tab name As long as you use the same tab name it will be bundled in the order of which you said it here So this is where the Dropbox Area All there Fields are being set Now the reason why we include these these Demo Component Into the Application with the tutorial Is that you can go and look and see ok well he's using Dropbox update method Year And Then you can go look at this file And then you can go look at And how it looks here The Dropbox update method And the files and the text and even Some of this I mean there is a years a button If I click it It starts an update And it even shows it here Now out to do that it's very tricky it's it's It's not that simple to do that because we not inside of our component as you can see were actually in the conflict Component In the global if you have Global settings So This whole feature that is building to summon distributor is so smart I would tell you For you to be able to do that is just stunning So You can look at how I've done that by Simply going to the To these fields And you would find The answer to how did he do that And you can look at these things in this list View All the Dropbox Information is there And then there is some Global Like local folder download link And then space HR You can see that I have that Space Age are quite often it's a It's a field that it will be included in Paid A version of Some industry of component bar Already has that spaceship space so h r in it And since spaces you can use the same spacer Over and over the system automatically implemented so it doesn't have conflict in name conventions So I'm just using the Same Space so every where is putting spaces which is which is this Little Line Sealine there It's very Marie Very small but it gives a space between these areas That is why I'm doing that Then also he can put default values which will be used with urine Installation of the component Did you have Switches in your config That you want to populate with default values should just have those values here And then during the install Does values will be added to the database and A bulletproof soul that in place for you So this is where you add config Fields And there is another Convention which is maybe Not Is not That It's not that obvious But I added a convention that if you use a tab name Which is exactly the same As a Front-end View Then I will add This field Do that front-end views menu Now If you can see it if you think about component sorry of Zuma last Content Manager manager It does the same thing In the global setting of your article manager you can set features for categories and 4 articles But if you create a new article and a menu item Then you can override those you can say use global or you can override them now this feature Of using the same tab name So let's look at this The features name is Preacher Switch Weather should be a table or a grid Ok we set the default to And we call that preachers plural That's quite important Now Let's look at the front Close this out Do you know I have a bunch of menus I'm gonna go to a menu that I've already created or preachers And then I'm also gonna go to this component backend Old preachers Do you see there is a list of items now all I did in the component Builder Is I simply added The name preacher as a tab name That's all I did And then the feels So there is the list of the fields from there 2 there These are the fields you can see them here These Fields I simply created in the field Area With your type so is Bailey's basically some radio buttons A drop down list Another dropdown list and again some radio button Essay these are the fields And then in the view if you click on 7 distributor You see those exact same Fields and it has the option of using The global Instead so there's use global or you can override it So you can decide ok just receiving admin do I want to use grid and not the global Auction So that whole system Of adding This extra features to every item view of the front end Is integrated simply by a convention If the front end is called preachers which in this case it is She can see there it's called preacher see I just selected a menu item port preaches Now we haven't dealt with setting up your side views and all that so this might be How did you get that item name right in everything But I'm trying to Sketch a picture which we will revisit when we eventually get to this area But this is just 8 you know from where it comes it's simply in the config I added the files and used to convention of the actual Front-end Page that has a name for preachers And So there is as well for preacher which is single So if I closed out as select 7 distributor and then select preacher Which is another View And then I clicked hear you see all these switches They also Map in here From there All the way Do there And they have some default values in there there there are there Feels And in the back in of the component if I click on preacher Here is the same Fields so you can send Global settings And then you can overwrite them sorry in the menu itself Why not using Global So that this whole feature Is possible Through this config Little tab sorry it looks Insignificant I suppose And you might not expect it like I said it's not that obvious that it does this But that is what it is doing And so as you can see all of those certain areas I just mapped it in config And because of the name of the tab let me stress that Because of the name of the tab The system does also this is related to any front and menus as well Therefore it will automatically create this front end Things for you Now to show you how it is done it's quite Simple Not that I want to teach you how The July works but I want you to at least know What is doing so I'm gonna go to the front of this component here it is And I'm gonna open that view preachers And you'd see in template there is a extra file called Default XML And then I'll open that if Alexa now Basically all component builder is doing Easy it is adding The convention to this file So if you're running into troubles and it's not working as you expected This is the file in which you can come and look To see what's happening That is in the front end In views In the specific view that you have to it must be this view must be the The tab name And then In that file called default XML Obviously And this is important Since we haven't dealt with adding site views The site is here I need to quickly touch on it so did you at least know Something that relates to this That is if you didn't click on add as a menu But you said it's to know Then that's far will not exist Ok so that's why I'll only exist if this is set to yes So silly sending it to us Dells component builder to build as default XML file And sitting the Cubs to the same name as this view Dells component builder to add those fields To this Few and make it so that Using kanban Have Unique Implementation obviously And this is important It doesn't thank yous Of This information necessary inside of your site View You need to Make use of this information in your side view If you're a developer you would expect that ride you would know Oh yeah ok so inside of your Component You have A place where you check Barons header Should it show then it shows it and it basically you getting it from the parameters The parameters are set inside of the view HTML dot PHP You see here we set the parameters We get We do on this app get parameters now this actually gets all the parameters in relation to this view The component parameters gets the menu parameters and it automatically If it has the Dustin So If you like I'm Have you going Beyond the scope but if they've used Global It will automatically fall back on what the set here which is excellent So you're using the same name Display And display where is it It's the same name And so if you are using Global basically what parameters does Is it getting this place parameter No display field it's getting that parameter And it first looks at the menus Settings and that one is set to Global it automatically Falls back to the global settings That is done by tumor God self it's not really something I thought it's just the way Joomla works which is excellent And That means that you immediately By using params And then doing a check-up So remember that this value Is inside of this params And if I didn't go to the default View And it's see where am I gonna do some of that Let's go to Hear the preacher display Gay So the field name wasn't used display I'm sorry it was for preachers display That's the The field name In the global Configurations So You're not with me It is What we Used for this field Switch preacher Table grid It's called preacher display If I was to go and open this field fact that we do that so if you see the whole picture Switch preachers table grid please remember that Ok here is the list of the switch preachers Fields as you can see I'm in the fields Tab Open that Specific Field And you'd see that the name Of that The name This field is preachers Underscore display Now You need to make sure that none of the fields have the same name That is quite important What I mean by none of the fields I mean This field must not be the same name is that field Every field in this Global area must be unique It should never overlap So that is why I use the convention of preachers display so that I can also use preacher Without the s display and I can use Category Underscore display in UC so that I have that sort of convention of implementation Is it all around as you develop think about conventions using sort of Logical repetitive scalable concepts And so this is one of them that I've done And then I just added it here It's that specific item And then in the Global area you going to preach is it is basically this view here Sorry field This field here And in the code On Simply saying If pressure equals 1 Then show the table If Preacher display = 2 then show the grid And if it's not selected and show the list Which is the three options if you look at the button The button is Table grid list And So I'm not asking that's the global have this so that none of that I'm just calling the field directly Because the way that you will I get that initial data like I showed you here Is they sort that out for you and that's quite nice And I've obviously placed in make sure that my Explanation is the truth And so goes with the colours you can see here I I again just your promises get colours But this is actually knowledge that you would have If you have developed a component for Joomla You would know about these tricks I suppose And I'm just showing to you how of component Build It makes it easy to implement these kind of things Otherwise would take so much time 2 Write this app and then make sure it's exactly the same inside of the XML for that menu and so forth So component all that does all of that Out of this config file Simply with a Convention that relates to the actual front-end And that is as simple as that Ok so I think we have covered that Thoroughly enough And That will be all for this tutorial I will continue looking at more Concepts of the component And it's features Possibly it might be ideal for us to Stop here With the component And go look at setting up a custom admin View What setting up a site for you And yet I'm thinking you know if we go that route It's gonna take us on a very long Road so Do I deal with me let me sort of Dealt with some of this component features First And finish that And then as soon as we've finished it We'll jump into the custom very Nice area of your front-end development and custom admin development And then we will obviously be relating back to what we have discussed here As we go So I've now looked at the ceiling tab And try to cover as much of this area as I can I didn't talk much about my secret week This is a very advanced feature And You can know that what it really does if we have dummy data You're able to Exclude them Through this area so that if you have different versions You will through this MySQL tweak Be able to exclude certain information Which I realise it's a little bit advance and so for most cases people will just not use this It's only when you start having multiple versions of the same extension And you selling them at different pricing in Want to be able to From Within component daughter just export the different versions Then you start using this feature And I think we possibly deal with it with when we start looking at more advanced implementations Thank you for watching Who starred in the next run with scripts \ No newline at end of file +Now that we've added the admin views to the component Let's look at some of the features that is still available inside of components As you can see adding your custom admin views is done there And the site views is done here Then there is a custom admin menus now this this don't let this trough you out Controlling the menu structures for these are Custom admin views in the site views are done inside of these This is if you are actually adding Custom backend [00:00:40](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m40s) Views Which hasn't been developed inside of component Builder So for example Component builder its self has a compiler View You all have seen that If I quickly go there It's this view here Now this whole view is done outside of component Builder I I actually [00:01:04](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m04s) This is just hand coded little script That kicks off a bunch of Events now It needs a model it needs a controller so I wrote that With my hand know just manually with hand coding And it also needs a view And so basically the view and everything In regards to it If you look at my infrastructure of component Builder [00:01:32](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m32s) You would see That I have let me just look at this compiler I have a place called custom you see Now Inside of custom Is where everything that you want it into you know include inside of your component is added into the Custom folder Any files any folders anything that you want to integrate is in here now you might look there [00:02:02](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m02s) See there are a bunch of things already there And I would encourage you not to remove them because depending on what you do in component builder it will Automatically include those Specially the the footables And the import View And the uikit and I think some Not sure I think you would have sound manager as well That is for sermon distributor And in PHP Excel which is the use for the exporting of data to spreadsheet and [00:02:32](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m32s) Importing a from spreadsheet we using this This library So all of that is in the custom tab And then he will see a bunch of files as well now the Component builder itself has its Compiler view here So as you can see it's basically just empty folders And then I have the actual files Here is well there's the default compiler file Which is [00:02:59](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m59s) Then if I open it up It's basically the The Script that shows the That little dropdown of items And I have That in there And I also have the controller somewhere Let's Scroll down Obviously it should Compiler there's the controller [00:03:23](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m23s) There's the model There is the compiler as well The helper File And so I am including that Into my component If we look here Let me open Component builder quickly Go to settings [00:03:48](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m48s) In files I'm including A bunch of things adding and that also means I'm including that here it is the compiler And I'm saying take this file And put it in admin views compiler And view And rename it See it's got the wrong name here So if you add the right name at the end of the string And click Yes it will rename that file to this so that is adding custom [00:04:16](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m16s) Files And As well as custom folders So on Grabbing the compiler views and I'm dumping it into views And I'm also say rename it to compiler so compiler views becomes compiler Inside of the views folder And then Obviously we first the system will first build the folders And then move your data your files to those folders so you you you will put the files here [00:04:44](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m44s) And then have the system do the folders and then it will move the files Ok so that's adding custom files to any component and this custom admin menu Is basically what I use to the map the compiler menu so I would say I wanna call it compiler the code is compiler I'm not using a link because it's not another extension or another website or something like that Which you can also do And then I would select an icon Here is the information It's the same kind of switches [00:05:17](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m17s) As you see with adding in custom admin sorry A backend admin view you can tweak whether it should be an admin menu or be a dashboard And be a sub menu So you can tweak that And then also in which order behind it says select before what admin View This one Should be placed Now That we are placing it before component So that means it can [00:05:49](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m49s) Go at the very top Ok so that is adding An custom admin menu Because of custom Fields and files and folders that you have Created by hand and are importing Into your component when you compile it The same is done with the compiler of component builder I'm actually including it as files so [00:06:16](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m16s) There is the compiler let me see Oh you know what I am I took All the compiler Files and I put it in the folder called compiler there it is And so it's a folder which moves all the files at once that obviously can also be done Like for example as you see here PHP Excel Which is a folder Has a lot of content in it if we were to open it [00:06:48](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m48s) You'd see all these files and folders and things And so I put everything I wanted To move Inside of this folder And then in in my component I simply target that folder And it pulls it in Ok so that That's simply showing you how I have added a whole lot of folders to To component Builder And then When I need a backend admin view custom [00:07:18](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m18s) Added this feature here does that for me Now I also want to quickly cover the The area called config Is it this area deals with something that is actually quite Useful And that is to set up your Back end Global fields Now [00:07:42](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m42s) It let me go out of this one because it's definitely not the best in demonstration let me go to sermon distributor There we've done some really amazing things sermon distributor Settings and then config And as you can see it is a very long list of things But then if we go to The actual component It me open it And then I'll click on options [00:08:25](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m25s) You see that has many many tabs Ok all of these switches Are done in the config area All of them except some of these default switch Is added by the simple switches For example the global timer remember we spoke about the check-in here you can set it all whether it should be every 5 hours 12 hours once a day every second day once a week or never Checking in your items automatically the version control buttons are added automatically as well Which means the person can set the version control on or off [00:09:07](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m07s) And also said how many You know records should be set if zero Then all versions will be saved So this is the version control And then The author Areas also added automatically And you can when you click in the component here just close this thing [00:09:40](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m40s) You see here is a contributing in area you can set whether you want add empty contributing level The fields Here you can add contributors as many as you like Those involved in developing the component And then the amount of empty ones you want to leave there Is also Tweak able And that'll basically Let me show you add this area here Contributor 1234 [00:10:09](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m09s) And When you use this witch IT controls whether it's been shown in the back or the front of all these kind of features Which I am not gonna go into much depth now But they also added automatically on also the permissional and structure is added automatically And if you have in the component You can actually Set that it includes UiKit you can said to that: yes If you do that [00:10:37](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m37s) it automatically adds This feature to your component And every where where Uikid is used Ok so everything else this Dropbox preachers preacher categories category Series list and series and sermons Is all done through that Config area here Now to use to add Fields to the config area you first need to add that field To fields [00:11:07](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m07s) So you would you go to fields And whatever field you wanna use there you need to create here So you first create the fields Then obviously you need to remember the system name that you're using Because then when you open up this You would be able to Type in the name And it will be selected And then by Convention that tab name As long as you use the same tab name it will be bundled in the order of which you said it here [00:11:40](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m40s) So this is where the Dropbox Area All there Fields are being set Now the reason why we include this Demo Component Into the Application with the tutorial Is that you can go and look and see ok well he's using [00:12:00](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m00s) Dropbox update method Here And Then you can go look at this file And then you can go look at And how it looks here The Dropbox update method And the files and the text and even Some of this I mean here is a button If I click it [00:12:23](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m23s) It starts an update And it even shows it here Now how to do this is very tricky It's not that simple to do that because we not inside of our component as you can see were actually in the config Component In the global if you have Global settings So This whole feature that is building into sermon distributor is so smart I would tell you For you to be able to do that is just stunning So [00:12:56](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m56s) You can look at how I've done that by Simply going to the To these fields And you would find The answer to how did he do that And you can look at these things in this list View All the Dropbox Information is there And then there is some Global Like local folder download link And then space hr [00:13:24](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m24s) You can see that I have that Space HR quite often it's a It's a field that it will be included in the Paid version of of component builder It already has that spacer hr in it And since Spacers you can use the same spacer Over and over the system automatically increment it so it doesn't have conflict in name conventions So I'm just using the Same Spacer so every where is putting spacers which is which is this Little Line [00:14:01](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m01s) you see that line there It's very very Very small but it gives a space between these areas That is why I'm doing that Then also he can put default values which will be used during Installation of the component So if you have Switches in your config That you want to populate with default values should just add those values here [00:14:27](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m27s) And then during the install Those values will be added to the database and Component builder puts all that in place for you So this is where you add the config Fields And there is another Convention which is maybe Not Is not That It's not that obvious [00:14:51](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m51s) But I added a convention that if you use a tab name Which is exactly the same As a Front-end View Then I will add This field to that front-end views menu Now [00:15:13](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m13s) If you can see it if you think about component sorry of Joomla's Content Manager manager It does the same thing In the global setting of your article manager you can set features for categories and for articles But if you create a new article in a menu item Then you can overwrite those you can say use global or you can overwrite them now this feature Of using the same tab name So let's look at this The features name is [00:15:48](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m48s) Preacher Switch Whether should be a table or a grid Ok and we set the default 2 And we called it preachers plural That's quite important Now Let's look at the front Close this out here Do I have a bunch of menus [00:16:09](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m09s) I'm gonna go to a menu that I've already created called preachers And then I'm also gonna go to this components backend called preachers So you see there is a list of items now all I did in the component Builder Is I simply added The name preacher as a tab name That's all I did And then the fields So there is the list of the fields from there to there [00:16:41](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m41s) These are the fields you can see them here These Fields I simply created in the field Area With field type so is basically some radio buttons A drop down list Another dropdown list and again some radio button Ok so these are the fields And then in the view if you click on sermon distributor You see those exact same Fields and it has the option of using The global [00:17:07](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m07s) Instead so there's used global or you can overwrite it So you can decide ok this specific admin view I want to use grid and not the global option So that whole system Of adding This extra features to every item view of the front end Is integrated simply by a convention If the front end is called preachers which this case it is As you can see there it's called preacher see I just selected a menu item called preachers Now we haven't dealt with setting up your site views and all that so this might be [00:17:47](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m47s) How did you get that item name right in everything But I'm trying to Sketch a picture which we will revisit when we eventually get to this area But just that you know from where it comes it's simply in the config I added the files and used to convention of the actual Front-end Page that has a name called preachers And So there is as well for preacher which is single [00:18:15](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m15s) So if I closed out select sermon distributor and then select preacher Which is another View And then I clicked here you see all these switches They also Mapped in here From there All the way to there And they have some default values in there there there are there [00:18:43](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m43s) Fields And in the back end of the component if I click on preacher Here is the same Fields so you can set Global settings And then you can overwrite them sorry in the menu itself Why not using Global So that this whole feature Is possible Through this config Little tab sorry it looks Insignificant I suppose [00:19:08](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m08s) And you might not expect it like I said it's not that obvious that it does this But that is what it is doing And so as you can see all of those certain areas I just mapped it in config And because of the name of the tab let me stress that Because of the name of the tab The system knows oh so this is related to any front end menus as well Therefore it will automatically create those front end Things for you Now to show you how it is done it's quite Simple [00:19:47](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m47s) Not that I want to teach you how The Joomla API works but I want you to at least know What is doing so I'm gonna go to the front of this component here it is And I'm gonna open that view preachers And you'd see in template there is a extra file called Default XML And then I'll open that default XML Basically all component builder is doing it is adding The convention to this file [00:20:18](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m18s) So if you're running into troubles and it's not working as you expected This is the file in which you can come and look To see what's happening That is in the front end In views In the specific view that you have to it must be this view must be the The tab name And then In that file called default XML Obviously [00:20:41](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m41s) This is important Since we haven't dealt with adding site views The site views here I need to quickly touch on it so did you at least know Something that relates to this That is if you didn't click on add as a menu You sets its to no Then that file will not exist Ok so that file only exist if this is set to yes So setting it to yes [00:21:11](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m11s) Tells component builder to build this default XML file And setting the tabs to the same name as this view Tells component builder to add those fields To this Few and make it so that your user can then Have Unique Implementation obviously And this is important [00:21:34](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m34s) It doesn't make use Of This information necessary inside of your site View You need to Make use of this information in your site view Now If you're a developer you would expect that right you would know Oh yeah ok so inside of your Component You have [00:21:56](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m56s) A place where you check params header Should it show then it shows it and it basically you getting it from the parameters The parameters are set inside of the view.html.php You see here we set the parameters We get We do on this app get parameters now this actually gets all the parameters in relation to this view The gets that component parameters it gets the menu parameters and it automatically If it has the custom [00:22:33](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m33s) So I feel like I'm maybe going Beyond the scope but if they've used Global It will automatically fall back on what the set here which is excellent So you're using the same name Display And display where is it It's the same name And so if you are using Global basically what parameters does Is it getting this place parameter [00:23:02](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m02s) The display field it's getting that parameter And it first looks at the menus Settings and that one is set to Global it automatically Falls back to the global settings That is done by Joomla itself it's not really something I build it's just the way Joomla works which is excellent And That means that you immediately By using params And then doing a check-up So remember now this value Is inside of this params [00:23:34](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m34s) And if I didn't go to the default View And let's see where am I implementing some of that Let's go to Here the preacher display Ok So the field name wasn't just display I'm sorry it was called preachers display That's the The field name In the global Configurations [00:24:03](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m03s) So You're not with me It is what we Used for this field Switch preacher Table grid It's called preacher display If I was to go and open this field in fact if you do that so if you see the whole picture Switch preachers table grid let me just remember that Ok here is the list of the switch preachers [00:24:37](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m37s) Fields as you can see I'm in the fields Tab And I'll open that Specific Field And you'd see that the name Of that The name Of this field is preachers Underscore display [00:24:56](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m56s) Now You need to make sure that none of the fields have the same name That is quite important What I mean by none of the fields I mean This field must not be the same name is that field Every field in this Global area must be unique It should never overlap So that is why I use the convention of preachers display so that I can also use preacher Without the s display and I can use Category [00:25:25](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m25s) Underscore display in you see so that I have that site of convention of implementation Is it all around as you develop think about conventions using sort of Logical repetitive scalable concepts And so this is one of them that I've done And then I just added it here It's that specific item And then in the Global area you go to preachers it is basically this view here Sorry field This field here [00:25:59](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m59s) And in the code On I'm simply saying If preacher = 1 Then show the table If Preacher display = 2 then show the grid And if non is selected and show the list Which is the three options if you look at the button The button has Table grid list [00:26:21](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m21s) And So I'm not asking does the global have this or that none of that I'm just calling the field directly Because the way that Joomla gets that initial data like I showed you here Is they sort that out for you and that's quite nice And I've obviously test it and made sure that my My explanation is the truth And so goes with the colours you can see here I I again just do params get colors But this is actually knowledge that you would have [00:26:55](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m55s) If you have developed a component for Joomla You would know about these tricks I suppose And I'm just showing to you how of component Build It makes it easy to implement these kind of things which otherwise would take so much time to Write this up and then make sure it's exactly the same inside of the XML folder menu and so forth So component builder does all of that Out of this config file Simply with a Convention that relates to the actual front-end [00:27:26](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m26s) And that is as simple as that Ok so I think we have covered that Thoroughly enough And That will be all for this tutorial I will continue looking at more Concepts of the component And it's features Possibly it might be ideal for us to [00:27:48](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m48s) Stop here With the component And go look at setting up a custom admin View Or setting up a site view And yet I'm thinking you know if we go that route It's gonna take us on a very long Road so The ideal with me let me sort of Dealt with some of this component features First And finish that [00:28:12](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m12s) And then as soon as we've finished it We'll jump into the custom very Nice area of your front-end development and custom admin development And then we will obviously be relating back to what we have discussed here As we go So I've now looked at the setting tab And try to cover as much of this area as I can I didn't talk much about mySQL tweak This is a very advanced feature And [00:28:44](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m44s) You can know that what it really does if we have dummy data You're able to Exclude them Through this area so that if you have different versions You will through this MySQL tweak Be able to exclude certain information Which I realise it's a little bit advance and so for most cases people will just not use this It's only when you start having multiple versions of the same extension And you selling them at different pricing and Want to be able to [00:29:17](https://www.youtube.com/watch?v=V2WkTjNFjvo&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m17s) From Within component builder just export the different versions Then you start using this feature And I think we possibly deal with it with when we start looking at more advanced implementations Ok thank you for watching We'll start in the next run with scripts diff --git a/011-Component-Scripts.md b/011-Component-Scripts.md index c52ca10..63a3348 100644 --- a/011-Component-Scripts.md +++ b/011-Component-Scripts.md @@ -1 +1 @@ -Hi So we just looked at Settings Of your component And now next we be looking at the scripts tab Here is an area where you most probably Add a lot of custom scripting So this area is focused on giving you Area app you know Interface to add custom Scripting to your component in a global way So obviously you can have custom scripting per Admin Sorry for admin backend View But you can also do that within the global scope with Regards to many Values The the one thing that is Nice to have your ears You can add Create user helper method To the component Another user album method is simply code If you do not know how to write their speed in this method will be of no use to you at all But if you do Then this this method will come in very handy Let me illustrate that to you If you click this yes I have a component in which I've already Implement This feature And it's called The cost-benefit projection tool Now if you click on companies You can actually Click new And then It has an area for you to create a company And I dealer you would connect that company to a user in the system But if you don't add that company to a user Because a user can have multiple companies So that's why If you click on this tab You could select the user But if you haven't selected a user and you've entered an email address and a name Then And also the needed information of course Then I you will Once you click save Close Shave The system will actually create a user for you An automatically email the user details to that And that is because of that specific helper class that I Added So Ticking helper class Now we see it doesn't do it On its own You need to write the code for it So let me show you where I did it In the controller You have an area Open up company You have an area called Post safe K just one here Is the posts April Remember I'm looking at the admin views We could target this area in fact that's exactly what I did So let me show you So I'm in the admin do you for company Unify go to PHP You would see that I have some Ajax there And then I have Area Which is the post safe method I need a post safe method I'm basically checking something some values And then when I realised that this user does not exist Uranus If the user does not exist Basically I'm doing a check here Then I'm using the helper Anyway trust not There it is Create user So again I've spoken about this placeholder Convention before I hear you are using the brackets Convention not the Hash one So three brackets that must be uppercase component And then I get 3 pack your son help her and this will be replaced with the components code Name Ok so That is what that does and then it basically It's the helper class Create user So in the helper class of this component Close this down Can I go to the Alpha Open The helper class you see that is the name Search the components name And then it's called helper And in helper class there is a Feature called Create user So basically it gets an array in it Another Rei has some values Which will be using Like password 1password 2 And we'll set the password so I'm not gonna explain this code basically just showed you where the phone Function is the function that was added to the components helper class and in that I'm super calling that function after having build the the user So I said the erase name and the email is that obviously the function if there is no password Set it will set a random password and again use another method Which also is part of the helper class we explored it with all helper classes as random Random method we can get a random string so That is creating a user and then it sets up the password and then it gets the Erase ready get a model now the model I Got from their get model again we are using a component folder Custom method which gets the specific model from the system And then basically fires the register Method Pontus dataset And then Updates The parameters for the system Regarding this new user Sense in the email And then returns the ID because obviously we were looking Foreign ID That's actually what we want We want to I want to get the Yeah we have the ID If we have the ID If you don't have the idea will send a message To the user And if we have the ID will basically story into that database To connect That item To that user Automatically and then click save Now That is Custom scripting So they're still switch Is this adding that That message to your helper class That's all it does Where is this which adds the uikit library to your media Boulder As well as integrated Dynamically Wherever Are you use The uikit class names So you won't need to write that any in any custom way Automatically adds it The same goes with food table This CSS is global CSS for all the back in views Dial back in So You wanna add CSS that would target the hold back and then you You do it there This is a place for you to add your own custom scripting to the helper class the app and helper class Jazz ucansi I have a whole custom Scripting here Sermon distributor For the admin Area And as well As an event No I spoke about this event concept briefly But what we want to achieve with the event is basically on every page If you look at This sermon distributor Back in part of it It has a file which is the in Main file Wychwood Which July calls first World sermon distributor And in that file It basically triggers that Global admin event And the global admin event is nothing else than a function inside of your helpers Albert function So always Triggers If you add that switch And then it passes at the document object Ok so the document object is being built up here So I'm just passing it over to the global event so we don't need to really clear it there So if I was to open the helper class Which we have here Scroll to the top Then you would see that I have It was the top I was just in the wrong file It's easier Load Dropbox Ajax Now This again it's just another function right so I wrote that funky So you can basically add whatever functions you want to run globally Every time a page open Now that's what I say 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 really targeted at doing that So Here we are loading the Dilla The Drop Box Ajax So if we go back to the component You see that I am Just adding That script first I just ticked Global admin event yes And I added that script that's all they added And that's group was taken and placed inside of the global event The the trigger This trigger is set by Component builder itself you don't need to write that It will insert this trigger itself If you just pick what you clicked yes You need to then just Add the script that must run inside of the global event Wish 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 I added that function here So I basically just used That name And called itself because we inside of that class right so that's why you call Static class Method And a past the same information because In my method I'm adding JavaScript to the dorm right So do the document object so I want that document and then I said add script declaration And simply that means on every page of this component in the backing it adds this little script which then calls Bye-bye Ajax Which I explained previously And it starts checking the Dropbox listing automatically So that's just an automatic feature I wanted to add to my component And this is way that I did it And then I felt that I wanna add it that you can do this and other components and that's why I added this event switch Ok This evening Ok and then this same goes for the site area I also added that same class You might ask why I have different helper classes for the front and the back Well it's about Pretty belt security I suppose and permissions There are things that I wanted to in the back in which I'm not asking that much questions Where on the front I might be more Protective I would suppose And So for that reason and implementation also is often different in the front then in the back so that's why we have to Different files help this site class Under Helper app in class And you can add custom scripting as you can see I added that same script to the front And I also add it A site Event Which also triggers that same script Now you might say well if everybody Triggers The Script Then it's gonna be running multiple times Well That's exactly part of what I did I actually added A feature In the Ajax call That logs weather it's already Active And if it's Active it just ignores that call So Basically it has a controller over Whether it should run or not Meaning that if it needs to run Because it even has a timer you see you can sit For the Sermon distributor reconsider orphan you want robots links to be updated Every day every 2 days And so this Script If it's X4 United wants to update and it's not time it just dies Doesn't do anything so it's very light since it's Ajax you don't use herself don't Even notice a delay in his page so the page opens as fast as you always do and then why is that Ajax call to the server Which start this whole process on the server So that's primarily what this is all about obviously you need to know programming and you need to know how to secure And I'm not gonna try and explain that to you now I'm just saying that this is all possum Simply through these custom areas you can also add 6 Instead of adding it to the actual views you can export all the views and add them I'm here and it will be actually added to the same file And so don't do it twice but this is another area to add A sequel dump file And Then We have this nice feature called dashboard methods You see Let me show you what I've done with it Again just that you know all this data that I'm showing use dummy Not related Just me testing it So I wanted to add this Usage statistics to the component so you could see Which country has done what When in what area So So I needed to take a lot of different database tables and calculate used by My certain ways in and I wanted to have that on the dashboard The dashboard really had always icons and so I didn't want it Add another custom view wish I could have done custom map I wanted it simple right there at the moment of the page load And so we added that feature Component builder and we called it We call that dashboard methods Now let me go to one where I actually implementing it so I could Spend more time in explaining unless I'm typing Ok so here we go Basically I created a Method called get usage data it's a public function Public method And inside it I added my script And honestly inside of this group I'm calling other methods which I made it made protected so the script that Must be called from The dashboard tab I'll show you that at the moment You said that up here So here is the tab and it's HTML so we called the tab Sadistic Sunday hello we made Table And here is the HTML Ok which we are using and in the HTML You see that I have PHP and the way we do that is with with that convention Open bracket We should my PHP and Echo and then closing it again they're so basic I'm checking whether the usage data is there Now how do I know that I should target usage this usage data and then items Well this is a convention this area there And the way that that Convention works Is Buy that one there So usage data Relates to Usage data So the moment you add to word get This word get in front of a function it will be Added 28 Global the result of that gear will be added to this And without the gate Name so that the convention The convention is you could've called that Get get down Get the man on the moon Then this would be Man on the Moon This and obviously all lowercase Man on the Moon So That will be dropped And this is gonna be used Lowercase as diverse So That's the convention I know it might not be that obvious but it works So your other functions If they are protected Shouldn't have the word get in it At the moment it's said to Set that up on set And then this one is Visit check This one is set companies Set countries So you can see I could add a lot of PHP in here And all these PHP together Basically gets the data That won't want on the page And when I get the date I placed it In what is seen as the item Ok Oh you know what Ok so I'm returning a field here or a method value And this method value is being populated in this sub functions And in one of them It is adding Are we here The name items as a Pointer So she becomes an object What is an object Think I said it is object up here And Then I look through the companies and as I look through them I'm busy totalling and adding and going on I guess so Explain the code itself But basically this is getting returned And because he's an object If I look here I'm able to Target items as an object And then if it's exist And if it's said I start looping through items and certain places I'm using totals and Different values so that is just adding some of that data to the page And this area here No I could have made this much simpler right so maybe not look that intend to you but this could have been us Class a fact you could have let this out completely and just put a Comment so you could have done this Because it's gonna scream at you for you know this isn't she does compulsory do can sit Not needed and then in here you could just do HTML so if you just wanna give them for me To the user about who made the component maybe your cell A-10 new RSS feed you could have done it right here Ok I'm just showing you that you can reach into PHP here and that the PHP that Let your reach in has the convention Of dropping the gate and then using that front area usage data To place information in which you can pass in your HTML here that you would do and any other component View Ok so that is just quickly looking at the script area of a component I realise there's so much more to say but I really can't Elaborate too much on this it since it requires skill in in PHP It's something that I think will only become very useful if you are a developer as Develop a few components And can then see how you can easily add custom scripting to his component through this Methods ok well next up will look at the ReadMe And maybe their FTP server concepts \ No newline at end of file + Hi So we just looked at Settings Of your component [00:00:05](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m05s) And now next we be looking at the scripts tab Here is an area where you most probably Add a lot of custom scripting So this area is focused on giving you Area you know Interface to add custom Scripting to your component in a global way So obviously you can have custom scripting per per Admin Sorry per admin backend view [00:00:28](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m28s) But you can also do that within the global scope with Regards to many certain values The the one thing that is Nice to have here is You can add Create user helper method To the component Now the user helper method is simply code If you do not know how to write php this method will be of no use to you at all [00:00:54](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m54s) But if you do Then this this method will come in very handy Let me illustrate that to you If you click this yes I have a component in which I've already Implemented This feature And it's called The cost-benefit projection tool Now if you click on companies You can actually Click new [00:01:19](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m19s) And then It has an area for you to create a company And ideally you would connect that company to a user in the system But if you don't add that company to a user Because a user can have multiple companies So that's why If you click on this tab You could select the user But if you haven't selected a user and you've entered an email address and a name Then [00:01:49](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m49s) And also the needed information of course Then you will Once you click save Close or save The system will actually create a user for you An automatically email the user details to that user And that is because of that specific helper class that I Added So Ticking helper class [00:02:14](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m14s) Now obviously it doesn't do it On its own You need to write the code for it So let me show you where I did it In the controller You have an area if we open up company You have an area called Post safe OK it's this one here Is the postsaveHook [00:02:38](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m38s) Remember When we'd looking at the admin views We could target this area in fact that's exactly what I did So let me show you So I'm in the admin view for company And if I go to PHP You would see that I have some Ajax there And then I have Area Which is the post safe method [00:03:03](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m03s) I need a post safe method I'm basically checking something some values And then when I realized that this user does not exist let me just check here company Here it is If the user does not exist Basically I'm doing a check here Then I'm using the helper No wait that is not the feature There it is Create user [00:03:41](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m41s) So again I've spoken about this placeholder Convention before I here you are using the brackets Convention not the Hash one So three brackets that must be uppercase component And then I get 3 brackets and helper and this will be replaced with the components code Name Ok so That is what that does and then it basically Gets the helper class Create user So in the helper class of this component [00:04:13](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m13s) If I close this down Can I go to the helper And I open The helper class you see that is the name So it is the components name And then it's called helper And in helper class there is a Feature called Create user there it is [00:04:39](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m39s) So basically it gets an array in it And that array has some values Which will be using Like password 1password 2 And it will set the password so I'm not gonna explain this code basically just showed you where the function is So the function was added to the components helper class and in that script I'm simply calling that function after having build the the user So I said the erase name and the email is that obviously the function if there is no password Set it will set a random password and again use another method Which also is part of the helper class we explored it with all helper classes is random [00:05:28](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m28s) Random method we can get a random string so That is creating a user and then it sets up the password and then it gets the Array ready get a model now the model I Got from there get model again we are using a component builder Custom method which gets the specific model from the system And then basically 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 in the email And then returns the ID because obviously we were looking Foreign ID That's actually what we want We want to I want to get the there we have the ID If we have the ID [00:06:41](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m41s) If you don't have the ID will send a message To the user And if we have the ID will basically store it into that database To connect That item To that user Automatically and then click save Now That is Custom scripting [00:06:59](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m59s) So this little switch Is this 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 Are you use [00:07:19](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m19s) The uikit class names So you won't need to write that any in any custom way Automatically adds it The same goes with food table This CSS is global CSS for all the backend views entire backend So if You wanna add CSS that would target the whole back end and then you do it there This is a place for you to add your own custom scripting to the helper class the admin helper class [00:07:47](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m47s) so as you can see I have a whole custom Scripting here for Sermon distributor For the admin Area And as well As an event Now 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 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 And the global admin event is nothing else than a function inside of your helpers function So it always Triggers [00:08:40](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m40s) If you add that switch And then it passes at the document object Ok so the document object is being built up here So I'm just passing it over to the global event so we don't need to really clear it there So if I was to open the helper class Which we have here and Scroll to the top Then you would see that I have It was the top I was just in the wrong file It says here [00:09:08](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m08s) Load Dropbox Ajax Now This again it's just another function right so I wrote that function So you can basically add whatever functions you want to run globally Every time a page opens Now 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 really targeted at doing that So [00:09:35](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m35s) Here we are loading the Drop Box Ajax So if we go back to the component You see that I am Just adding That script first I just ticked 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 This trigger 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 trigger itself just because you clicked yes You need to then just Add the script that must run inside of the global event Wich 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 name And called it "self" because we inside of that class right so that's how you call Static class Method And a past the same information because In my method I'm adding JavaScript to the dorm right So to the document object so I want that document and then I said add script declaration [00:10:59](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m59s) And simply 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 wanna add it that you can do this in other components and that's why I added this event switch Ok This event switch here Ok and then this same goes for the site area [00:11:37](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m37s) I also added that same class You might ask why I have different helper classes for the front and the back Well it's about Pretty belt security I suppose and permissions There are things that I wanted to in the back end which I'm not asking that much questions Where on the front I might be more Protective I would suppose And So for that reason and implementation also is often different in the front then in the back so that's why we have to Different files helpers site class [00:12:09](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m09s) And the Helper admin class And you can add custom scripting as you can see I added that same script to the front And I also add it A site Event Which also trigger is that same script Now you might say well if everybody Triggers The Script Then it's gonna be running multiple times Well [00:12:32](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m32s) That's exactly part of what I did I actually added A feature In the Ajax call That logs weather it's already Active And if it's Active it just ignores that call So Basically it has a controller over Whether it should run or not Meaning that if it needs to run Because it even has a timer you see you can set [00:12:56](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m56s) For the Sermon distributor you can set how often you want Dropbox links to be updated Every day every 2 days And so this Script If it checks wants to update and it's not time it just dies Doesn't do anything so it's very light since it's Ajax you don't the user himself don't Even notice a delay in his page so the page opens as fast as it always do and then fire that Ajax call to the server Which starts this whole process on the server So that's primarily what this is all about obviously you need to know programming and you need to know how to secure all that And I'm not gonna try and explain that to you now I'm just saying that this is all possible inside of component builder Simply through these custom areas you can also add a SQL dump [00:13:50](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m50s) Instead of adding it to the actual views you can export all the views and add them here and it will be actually added to the same file And so don't do it twice but this is another area to add A SQL dump file And Then We have this nice feature called dashboard methods You see Let me show you what I've done with it Again just that you know all this data that I'm showing you is dummy [00:14:23](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m23s) Not related Just me testing it So I wanted to add this Usage statistics to the component so you could see Which country has done what When in what area So So I needed to take a lot of different database tables and calculate used by certain ways in and I wanted to have that on the dashboard The dashboard really had always icons and so I didn't want it [00:14:53](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m53s) Add another custom view wish I could have done custom admin view I wanted it simply right there at the moment of the page load And so we added that feature Component builder and we called it We call that dashboard methods Now let me go to one where I actually implementing it so I could Spend more time in explaining unless on typing Ok so here we go Basically I created a [00:15:26](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m26s) Method called get usage data it's a public function Public method And inside it I added my script And obviously inside of this script I'm calling other methods which I made it made protected so the script that Must be called from The dashboard tab I'll show you that at the moment You said that up here So here is the tab and it's HTML so we called the tab usage statistics and a header we made Table [00:16:01](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m01s) And here is the HTML Ok which we are using and in the HTML You see that I have PHP and the way we do that is with that convention of Open bracket ? PHP and Echo and then closing it again there so basically I'm checking whether the usage data is there Now how do I know that I should target usage this usage data and then items Well this is a convention this area there And the way that that Convention works Is [00:16:46](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m46s) By that one there So usage data Relates to Usage data So the moment you add to word get This word get in front of a function it will be Added to a Global the result of that Get will be added to this And without the Get Name so that the convention [00:17:15](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m15s) The convention is you could've called that Get the man on the moon Then this would be Man on the Moon This and obviously all lowercase Man on the Moon So That will be dropped And this is gonna be used Lowercase as the this So [00:17:37](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m37s) That's the convention I know it might not be that obvious but it works So your other functions If they are protected Shouldn't have the word get in it At the moment it's set to Set that as that one is set And then this one is Visit check This one is set companies and set countries [00:18:03](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m03s) So you can see I could add a lot of PHP in here And all these PHP together Basically gets the data That we want on the page And when I get the data I placed it In what is seen as the item Ok Oh you know what let me see set statistics return this statistics Ok so I'm returning a field here or a a method value [00:18:43](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m43s) And this method value is being populated in this sub functions And in one of them It is adding Over here The name items as a a Pointer So it becomes an object Well it is an object in fact I Think I set it is an object up here there we go And [00:19:09](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m09s) There I look through the companies and as I look through them I'm busy totalling and adding and going on I guess so I'm not going explain the code itself But basically this is getting returned And because he's an object If I look here I'm able to Target items as an object And then if it's exist And if it's set I start looping through items and certain places I'm using totals and Different values so that is just adding some of that data to the page [00:19:45](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m45s) And this area here Now I could have made this much simpler right so maybe not look that intense to you but this could have been a simple Class in fact you could have let this out completely and just put a Comment so you could have done this Because it's gonna scream at you for you know this is if you see is not compulsory so you can set is Not needed and then in here you could just do HTML so if you just wanna give information To the user about who made the component maybe or some would like to run a rss feed here you could have done it right here Ok I'm just showing you that you can reach into PHP here and that the PHP that you reach in has the convention [00:20:34](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m34s) Of dropping the get and then using that front area usage data To place information in which you can parse in your HTML here that you would do and any other component View Ok so that is just quickly looking at the script area of a component I realize there's so much more to say but I really can't Elaborate too much on this it since it requires skill in in PHP It's something that I think will only become very useful if you are a developer as Developed a few components And can then see how you can easily add custom scripting to his component through this Methods ok well next up will look at the ReadMe [00:21:27](https://www.youtube.com/watch?v=xY9TWQrF8AQ&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m27s) And maybe their FTP server concepts. Thanks for watching diff --git a/012-Component-FTP-and-more.md b/012-Component-FTP-and-more.md index 4575dc4..bf9a9f5 100644 --- a/012-Component-FTP-and-more.md +++ b/012-Component-FTP-and-more.md @@ -1 +1 @@ -Next in the component view we are gonna add the ReadMe script to a component The reaper script is commonly used as the components Homepage sort of so if you were to go to get out for That's open we're on the demo components page Get up and you'll see that it has this nice image here and it Details and some layout This one is done with the ReadMe file so it's with this file here we can open That had a look at the Roar And here you can see the It's basically the same text this we looking at previously So inside of component Builder you can add this ReadMe and repeat text and This is basically placeholders Now I know that that is part of the markup for a header so You need to Know no better Mark Sorry not more Cup knockout Do you know what is placeholders and what is not That is why I added The Script so you can sort of get an idea of everything that are placeholders And the space holders are Automatically updated from the details that are in these Fields here so So you can see The the actual placeholders Names it's nice so if you change the version here You are updated there Automatically So that is just read me file Video a place for you to give a lot of information to those who are using Your Application Maybe you can add some links to it or you could Some links to help menus ribbon instructions on installing it Error anything else that you'd like to share through the ReadMe file I would ask if it's if it's not too much for you you know for you to leave this area this commenting More people using component builder the more in valve with an accumulator Others getting Restraining set Help us to sustain this project So That and it will certainly be helpful Compulsory If you want to And then if you wanna know more about market mark Down Then you can open this link here And it shows you the Set of a cheat sheet of everything that you can do Ok so that is looking at the ReadMe area Is admin View area And the site View area Should be seen as a place where you can create new admin Have used you realise that if you create a new admin view it's not necessarily linked to this You need to still link it in hearing settings there happened you This is more a place to create admin user Or to edit existing at the news that are linked to this component Same goes with the side views so it's simply a way for you to to gain access to editing Views that already linked to this application easily And then the third one 4 actually 24 You want to look at is the FTP server that has basically been added to Give you a hand in moving this application this component Do your server and also add the feature of that automated updating that is inside So the update server Is actually a Gmail icon set And if you open a component So I'll open Salmon distributor France And we look at the XML file of this component Component builder obviously built this whole file for you But at the very bottom You see that there is a App updates server That is being added Now this is not add it if you Have not Set the service was set to know It will not be adding an update server if you add this Then you can set the link To where the update server is Uno gonna be hosted And it will automatically take that link An added into your XML file like And Bat file itself Component Builder Can also build that file for you The way does it Is that This obviously Suit look like that host = hostname And port = port Enter enter And Auction bracket type = FTP binary FTP binary You're usually is 15 That is the the default value FTP binary Where is that would usually be 21 and that would usually be 5th Steam then add username and ID and a password Now this FTP details should actually login directly To this folder that you have a beer this updates folder Ok So that basically all component does is it logged into your server move this file in there And this information is what will make it possible for him to do that Same goes with the sale server the sails server usually Would be Very much the same concept You're Simply be adding the same kind of string here except usually the The update server and the sails server is not the same place The update server let's the user know that there is an update where is the sales service actually wear this component Zip file will be stored on your server so you have something like whmcs Or Another Component through which you are selling your extensions are you can Use the folder in on your server which it's looking for the files You can use that folder in a great an FTP Account to that folder and then sent that beat In this field here And then Component Builder on the moment that you could compile It has a An option here it says add backup folder and save it sales server Yes and if you compile it now It will move The zip file to yourself server as well as creating a backup now the backup and the gift for Folder is actually set up in your components Global options so we We haven't really spoken much about the global options let us open now here We saw in this area here That it says that this field is encrypted now in component builder if you go to Global Settings it says Encryption settings in in here You would add a your own key I wish it will improve once you've added this key You shouldn't change it because it will obviously not be able to decrypt Because it's used to encrypt and as well to decrypt The data so if you well that just means everything that's been improved it is now needs to To be redone which in this case is is gonna be these these login Information is FTP login information That's this is the basic encryption bits we spoke of on talk about storing types you got basic and clips This is the basic encryption way Basically having such a All day basically Then you have files here folder paths These two words for the passport compile a folder and customer for their II would leave them So now they do buggy I haven't fully managed to achieve them being Flexible remove them at this stage is difficult Phone number of reasons for now I would suggest you just leave them blank But here you would add a backup folder And this obviously should be related to the root of your server So As well as a git folder And get Fallout with me where component builder create a folder with all the compound Files without zipping them And then you can go to that father and create a kit Create a git repository there And from that folder you can push to get up Or any other git server Respectively So basically it's able to create a folder from which you can do get up or any other kind of Repository work Which are separate from your backup folder and also separate from the temple for that in which Compounds the component so you can move it out of your Joomla install basically And that's what these for the price of 4 So when you do in the compiling of the component it does that get repository it won't delete If the Dot get files we folder it will just replace all the data files in it Basically first remove the old ones then add the new ones and get obviously we'll see that Only the files that is been changed it will notice and those who you need to do a recruitment To get it into your repository obviously if you don't get it then possibly this this There's some great courses as well about get on lynda.com as well as you do So you can just go look at those ok so that's a backup folder And the sales over the same goes here this FTP Today in chills superheater direct folder in which these are zip files should be stored Unfortunately component builder cannot Storing and subfolders at this point so the FTP details he will just log into that FTP And in that vary for the which year is which she has the access to put the file there So no subfolders or Other folders the FTP details should be going directly to the folder now In the component builder I was thinking just for your own Peace of mind if you look in component builder so AB in the backend components component builder and then Help is there is a file called compiler if you open that file You would see that we have a function year built me and here's all the place holders But you can use in the book me file and will be replaced with the relative information And then there is a function here called move file to FTP server This move file to FTP server calls another function called Where is it get FTP now get FTP is this function here And basically it takes the signature checks whether we are ready made such a connection before And then loads that object But here basically I'm using this parse string function Deposit the string into the variables so all the Variables in that string is converted to erase all variables respectively And that then is used to actually make use of To malazi own client FTP class so if you wanna know where that is you can NetBeans you take control spacebar and it shows you it's in libraries you were like lions DB PHP that's where the file is you click there open at 12 Basically using built-in FTP client and we passing the host the party of Username password and making a connection and then we sending that off To do this move file which then basically takes the file com To the server So that's just We own piece of Being licked It's All handled right here Follow it's Relations Server as well Sales server The other thing that I know is quite in Important Is this update server Is an XML file And this XML file Basically build Virgins And download link So Like I explained to you in a previous video There is this reality that while you are developing Your users Scuze me wouldn't need Any Change Updates when The moment you put your Immediately uni YouTube Consider When you make it change How will you use To have changed And the biggest changes you can Is adding new For adding me Fields To the component And so that makes it a little hard Remind explain previously With the history compare We've done scripting to That prob But You also need to think about So we created this Virgin Which Gives you the ability To actually add sequels Scripting Which needs to be executed Now the way for you to think about this If you have a new version that's a 1 Point Then and now you know that there needs to be a table alteration Obviously you need to know see if MySQL commands To do that I'm not gonna teach you that you just Need to put that MySQL command in here according to the gym like conventions which me The table name must have that hash underscore underscore in front of it and do my wall Begin the prefix so you might just simply what do a mice Sequel script here but if you are making a change and the new releases 1.2.9 And 1.0 Didn't have that Specific field of view Then you must realise that You're updating this one and The update must be placed Diversion we Needs So if you make it change don't put it here Because it won't Update correctly You need to put the update Urgent And then over here You would put the link To the respective Downloads Ok so Mike here we had Virgin 2 point 9 And then we had virgin 0 And We are at the 1 Point Using GitHub as my Platform of the You could use any URL And these your owls is what will be used In your updates Server So the update server If I was to open that for us Link You see that it has this You are out here for And as we move on it 3 And so it's getting these DSD Details It is getting them From This version State area And so the last version in this List 2 Must be the same Is the one that you That is So that it will know ok now we are at the current version And it Ok so that is Basically All the concepts that would be The necessary code To cover Regarding the Component Area We've looked at We will again look at site views and Well as your custom And we will possibly Going to mod It's about this Briefly spoke about Butter Most bought that Steel Component Area And all it's nice Features Obviously it all stacks upon Bonnie Tyler from Fields than the app Views And if you have come this far Set your component Added some You are now ready to Start building Siberia Which You wouldn't be able to To really do effective It is really nice First to the And then Thank you for watching \ No newline at end of file +Next in the component view we are gonna add the ReadMe script to a component The reapme script is commonly used as the components Homepage sort of so if you were to go to gethub for That's open we are on the demo components page for example Let's open GetHub and you'll see that it has this nice image here and it has some Details and some layout Now this all is done with the ReadMe file so it's with this file here we can open That and then look at the Raw And here you can see the It's basically the same text this we looking at previously [00:00:53](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m53s) So inside of component Builder you can add this read me and read me text and This is basically placeholders Now I know that that is part of the markup for a header so You need to Know a little bit about Markdown Sorry not markup markdown to you know what is placeholders and what is not That is why I added The Script so you can sort of get an idea of everything that are placeholders [00:01:27](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m27s) And these place holders are Automatically updated from the details that are in these Fields here so So you can see The the actual placeholders Names it's nice so if you change the version here It'll updated there Automatically So that is just read me file Really a place for you to give a lot of information to those who are using Your [00:02:01](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m01s) Application so Maybe you can add some links to it or you could has Some links to help menus or even instructions on installing it or anything else that you'd like to share through the ReadMe file I would ask if it's if it's not too much for you you know for you to leave this area this commenting The more people using component builder the more involve within a community Others getting This training set Help us to sustain this project So if [00:02:36](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m36s) you leave that in it will certainly be helpful you not Compulsory I mean it's only if you want to And then if you wanna know more about markup markdown markdown not markup Then you can open this link here And it shows you the this little bit of a cheat sheet of everything that you can do Ok so that is looking at the ReadMe area This admin View area [00:03:06](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m06s) And the site View area Should be seen as a place where you can create new admin views Do realize that if you create a new admin view it's not necessarily linked to this component You need to still link it in here in settings under admin view This is more a place to create admin view so if you click on new Or to edit existing admin views that are linked to this component Same goes with the site views so it's simply a way for you to to gain access to editing those site views that already linked to this application easily And then the third one forth actually [00:03:51](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m51s) one two three four we wanna look at is the FTP server that FTP server basically been added to Give you a hand in moving this application this component to your server and also add the feature of that automated updating that is inside of Joomla. So the update server Is actually a Joomla concept And if you open a component So I'll open Summon distributor wait over there This is the front I need to look at the backend And we look at the [00:04:39](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m39s) XML file of this component Component builder obviously built this whole file for you But at the very bottom You see that there is a App updates server That is being added Now this is not added if you Have not Set the service it will set to no It will not be adding an update server if you add this [00:05:03](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m03s) Then you can set the link To where the update server is you know gonna be hosted And it will automatically take that link in added into your XML file like it's done here And That file itself Component Builder Can also build that file for you The way does it Is that This obviously [00:05:31](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m31s) Should look like that host = hostname And port = port Int& And option bracket type = FTP BINARY Now this FTP binary usually is 15 sorry That is the the default value FTP binary Where is that would usually be 21 and that would usually be 15 And then username and a password [00:06:04](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m04s) Now this FTP details should actually login directly To this folder that you have up here this updates folder Ok that one So that basically all component builder does is it loggs into your server move this file in there and then this disconnects And this information is what will make it possible for him to do that Same goes with the sales server the sales server usually Would be Very much the same concept You'de Simply be adding the same kind of string here except usually the The update server and the sales server is not the same place [00:06:47](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m47s) The update server let's the user know that there is an update where is the sales service actually where this component Zip file will be stored on your server so you have something like whmcs Or Another Component through which you are selling your extensions you can Use the folder in on your server which it's looking for the files You can use that folder you know great in FTP Account to that folder and then set that details In this field here And then Component Builder on the moment that you could compile It has a [00:07:30](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m30s) An option here it says add backup folder and save sales server you click that to Yes and if you compile it now It will move The zip file to sales server as well as creating a backup now the backup and the Git Folder is actually set up in your components Global options so we We haven't really spoken much about the global options let us open it now here We saw in this area here That it says that this field is encrypted now in component builder if you go to Global Settings it says Encryption settings in in here [00:08:18](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m18s) You would add a your own key By which it will encrypt once you've added this key You shouldn't change it because it will obviously not be able to decrypt Because it's used to encrypt and as well to decrypt The data so if you well that just means everything that's been encrypted it is now needs to To be redone which in this case is is gonna be these these login Information is FTP login information That's this is the basic encryption which we spoke of on talk about storing types you got basic encryption and advanced encryption now this is Basic encryption way basically having such a [00:09:01](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m01s) Is also called basic key Then you have files here or folder paths These two first folder paths called compiler folder and custom folder I would leave them For now they are a little buggy I haven't fully managed to achieve them being Flexible so to move them at this stage is difficult For a number of reasons for now I would suggest you just leave them blank But here you would add a backup folder And this obviously should be related to the root of your server So As well as a Git folder [00:09:41](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m41s) And Git folder would be where component builder creates a folder with all the compounds Files without zipping them And then you can go to that folder and create a git create a git repository there And from that folder you can push to Github Or any other git server Respectively So basically it's able to create a folder from which you can do Github or any other kind of Repository work Which are separate from your backup folder and also separate from the temporary folder in which [00:10:17](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m17s) compiles the component so you can move it out of your Joomla install basically And that's what these folder paths are for So when you do the compiling of the component it does that git repository it won't delete the Dot git file sorry folder it will just replace all the files in it Basically first remove the old ones then add the new ones and git obviously we'll see that Only the files that is been changed it will notice and those who you need to do a recommit well just obviously a normal commit To get it into your repository obviously if you don't know Git then possibly this then possibly doesn't make sense to you There's some great courses as well about Git on lynda.com as well as Udome So you can just go look at those ok so that's a backup folder And the sales server the same goes here this FTP [00:11:18](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m18s) credentials should be that direct folder in which these zip files should be stored Unfortunately component builder cannot Storing and subfolders at this point so the FTP details he will just login to that FTP account And in that very folder which here is which he has the access to you'll put the file there So no subfolders or Other folders the FTP details should be going directly to the folder now In the component builder I was thinking just for your own Peace of mind if you look in component builder so That will be in the backend components component builder and then Helpers there is a file called compiler if you open that file [00:12:14](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m14s) You would see that we have a function here built me and here's all the place holders That you can use in the built me file and will be replaced with the relative information And then there is a function here called move file to FTP server This move file to FTP server calls another function called Where is it getFTP now getFTP is this function here And basically it takes the signature checks whether we are ready made such a connection before And then loads that object But here basically I'm using this parse string function To convert the string into the variables so all the Variables in that string is converted to erase all variables respectively [00:13:12](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m12s) And that then is used to actually make use of Joomlas own client FTP class so if you wanna know where that is you can NetBeans you'd click control spacebar and it shows you it's in library JclientsFTP .PHP that's where the file is you click there open it So we basically using Joomlas built-in FTP client and we passing the host the port the option the Username the password and making a connection and then we sending that off To do this move file which then basically takes the file content and moves it To the server So that's just for your own piece of mind that the data itself is not Being leaked or compromised [00:14:04](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m04s) It's So all handled right here and you can Follow its events in component builder from Relations to the update Server as well as to the Sales server The other thing that I know is quite in Important Is this update server Is an XML file [00:14:25](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m25s) And this XML file is basically build up of versions And download links to those versions So Like I explain to you in a previous video There is this reality that while you are developing your component Your users Excuse me wouldn't need Any [00:14:47](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m47s) change Updates or anything are there The moment you put your component out there on the web Immediately You need to Consider When you make a change in the application How will you user to be able adapt to that change And the biggest changes you can make [00:15:03](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m03s) Is adding new views or adding new Fields To the component And so that makes it a little hard But like I explain previously With the history component We've done scripting to take you know take control of That problem But [00:15:21](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m21s) You also need to think about the database So we created this thing called Version Updates Which Gives you the ability To actually add sql Scripting Which needs to be executed upon the updating Now the way for you to think about this If you have a new version that's a 1.2.9 [00:15:43](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m43s) Then and now you know that there needs to be a table alteration Obviously you need to know see if MySQL commands To do that I'm not gonna teach you that you just Need to put that MySQL command in here according to the Joomla conventions which means The table name must have that hash underscore underscore in front of it and Joomla will dynamicaly put in the prefix so you might just simply will do a MySQL script here but if you are making a change and the new releases 1.2.9 And 1.0 Didn't have that [00:16:23](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m23s) Specific field of view Then you must realize that You're updating this one and so the sql must come next to that specific version The update must be placed at the version Which Needs the update So if you make it change don't put it here Because it won't Update correctly You need to put the update next [00:16:44](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m44s) to the Version that needs to be updated And then over here You would put the link To the respective Downloads Ok so Like here we had Version 2. 9 And then we had version 1.3. [00:16:59](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m59s) 0 And We added the 1.3.0 link here Obviously I'm using GitHub as my distributing Platform of the application You could use any URL And these URLs is what will be used In your updates Server So the update server [00:17:18](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m18s) If I was to open that for us first let me close this and we will go to the update server Link copy that You'd see that it has this URLs here for the download And as we move on it 3, 3.1, 3.2 And so it's getting these these Details It is getting them [00:17:48](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m48s) From This version update area And so the last version in this List being 1.3. 2 Must be the same Is the one that you set here That is important So that it will know ok now we are at the current version [00:18:07](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m07s) And it will do the necessary you know the adjustments to that Ok so that is Basically All the concepts that would be Necessary To cover Regarding the Component Area We've looked at adding admin views [00:18:26](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m26s) We will again look at site views and adding them as well as your custom admin views And we will possibly Going to more depths about this MySQL tweak What we briefly spoke about But the For most part that's or the at Component Area [00:18:48](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m48s) And all it's nice Features Obviously it all stacks upon each other from the Fields then the admin Views and then the components themselves And if you have come this far you Set out your component You have added some admin views You are now ready to [00:19:06](https://www.youtube.com/watch?v=hzbZlLl-xlA&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m06s) Start building the front and the site area Which You wouldn't be able to To really do effectively until now It is really necessary to First do the admin views And then only do the site views Well Thank you for watching diff --git a/013-dynamicGet.md b/013-dynamicGet.md index f6c63df..7d70aa6 100644 --- a/013-dynamicGet.md +++ b/013-dynamicGet.md @@ -1 +1 @@ -Hi We still working with Summon distributor So I'm gonna use this preacher Which is a Get diary have set up here Are use that Ministration So you can see that I have This Back end View selected So It Intellect nothing This is usually how it will look When you start So YouTube Select This Depending on which Area of the Back into wanna get the data from Youth select Backend View Which is the Best way to do it I would say Then there is the Joomla Database Auction Which basically gives you the access to draw data from any other component installed that no Website So you select your Miller Database You can select any Database That Is actually at that stage On your Database Installed And that means you can reach out to other components Through this dynamic I'm gonna not do that In fact that's also an area which I haven't tested so well I You possibly might try to implement that And ran into some bugs At this stage I can't make any apologies for that since Really thing you should do is instead using Back end View Now My favourite why is the other option there Well it's because that's a future we certainly want in the application right And so I'm busy working in that direction And busy Programming so did that feature will work without any But for the most part if you don't do very complex Mapping If you just do a simple Direct database fetch like that Are you be able to use this it won't give you an issue What it really is about these other Linked Joint database structures That really would make it complex So And that my Cause problems I'm not 100% sure Obviously it did work But I haven't tested it well enough as well as I have tested the other part and that is this back in There is also the custom option Where you can just dump the whole Option of Using component builder to sort of write your Your your BHP for you And here you can add custom PHP It with The method stayed up for you So this is a custom get option where you write the code Basically by hand Where is this option Write the code for you So You select the back in view that you want to use Get that back and view Will be the the view that you could next to your component right So you need to type that you name in here and then select That package And it will load All the field names As a dot i d in a data asset ID a dog named Ali is an icon and So these are all the fields inside of this view An overloaded it will put this as Asset ID Now again I would suggest you don't change that What you can do is you can take Out Arrow You feel ok I don't need that Road Then you can Remove a row Like that And you can say I don't need the Arrow I don't need these Waited there Basically that's all the data you might want And then you will know That this would be the variable name Of the data on When do When these get is used So that's the The basic part of setting up again I need to mention that you have get types as well now the gate types have 4 of them There is the get item Which will get one item so that means from this feature table You will get one item Then you got the gate list query Where to get Multiple Items Ok so depending on how many items you want to get from the database you would select either get item or get list Did you got cast get custom And then you got Get customs that Floral And The difference between these two Is the get item Is what you will use only once per Purview So if you are building a custom at The View You will select a main get Either of a get item or either of a get list But you can add multiple custom get item Or trust and get items So You can see these as Other Methods that you're adding to the page but it's not the main method CF main methods which are these a get item and get list where we Which by the way is the exact naming of the methods that will be used And then you get got this custom get custom and get customs Which is really Is the same as these two it's just that they are not Main There will only be another method in the A model Which will bring data to the view So you can add as many custom Get custom and get customs Methods To your view as you like but you could only add one get item and you pay only That one guid list query Usually the way we were The sign on this That we would Say what is the main objective of The View What is the main dataset that we want to use in the view And that is what we will use the gate list query and get item for Respective Save the main purpose of The View It's a show preachers and a list of preachers I would use the guid list query as domain Selection here Now you see that you have when you do a list query you have the option of adding fake Nation So Basically that would mean whether the data should only return a certain number Mel July has a global number there Which you set in the system administrative area Hundred w Global settings I'm sure you that So you go to system Then Global configuration And then you see there is a default list them it Just one here And That is what will be used as the amount That limits the data being returned to the page Total owner return at this stage 20 item If I said that Big Nation to yes And if I said it to know it will load all the data So yes would just load some of it And no will load all of the data so depends on what you wanna do if you wanna do an Ajax Well you wanna be sure that all the data is being loaded every time and you rather use JavaScript Set up Nation for yourself for your for your view Then that is why you would use No switch most of the time you're just say yes And July world Sorry component builder will automatically add the pic Nation code to the page Also numatic the ad Tech Nation Go to the model And at the bottom of the page it will show a Want to see big Nation out possibly depending on The temperature using And the styles that on the page Bootstrap is not on the page that I want to 3 my possibly not look right and you need to meet you will need to add styling to it Component Build It doesn't No what style is on your page so they cannot make provision for all of that But it actually can load the but Nation itself And it doesn't Do that Ok Now hear you have data and You can join this data to other database tables And how you getting here like with the main source You're able to select Joint Views From a table A view Table which is basically the views of the component Or just any database table And to one of the database tables are often Connect to this category Z because Jim component the holder Integrates It's application If you add a category field To any View It dynamically set up a category for your component And integrates the category concept into your component so it writes all that code for you and basically the way July stone Applications like Article manager does it says using the same convention So you know I'll do my article manager is bringing categories into the articles Then that is the way your component is gonna do it as well And Here You can also lick categories You can say so The switch is off Deal with Mummy come and look More detail like this area And then you can model the date up there Model I mean decide what you want to return you don't want to return everything for But the one I want to look at first is actually this joint view Table will come back to the DB The joint view Table let you again select from any of the other views that is Part of your component And again you can select whether Richard return a single row Or a List of rose Now when you say single row it means it's gonna literally join it To this other data set that you have as your main data or your main source It will just be another Item in the array And so that's why you can't use the name Name For example here It needs to have that TUT series underscore in front of it So that it doesn't clash with the other day they said that possibly also has a value called name So then here if you say list if you selected You just select Anything you Series You see that it will get it will populate this area with all the fields that ask that is in that View Then this as Button here Basically You can't use the same Alphabetic number Why's in the hole In the whole query So No get function can only use a once and then be once and then see once D So You need to make sure that the That these are set up that you can Would make provision up to z z How many tables you can I have Only in this area So Basically you would First decide whether this row Type what type of return it will be If you said it to multiple you see that these names automatically update Because now The way that the get method will Work Is it will create a new Method Which will get this data An added into your item list Via this relationship so I'm adding the on field Is the Dot a series that's where the ID is for the series And the joint field I'm using the CID which is that one So that means in the main Database That is the a database There must be a field called series And it has the ID of the series I need corresponds to the ID in this list And if I wanted to return a multiple it means that The main database which is in that Kaizer sermon Can be linked to multiple serieses But in the system we are working with here That is not possible you can only Connect a sermon 21 series So that means it's only a single return Then it will immediately add this Series on the score in front of everything Do in Surat doesn't clash with your a table That's What It's basically doing Again you can remove the fields you don't want but Please do not edit The string It possibly would make it break I wanted to be possible that you can change this name to anything you like And we are gonna try and do that eventually but for now it's still doesn't really like you doing that And it it in fact you can be changing it all still I write it this way in the code that's That's part of why I'm saying you shouldn't change it now because it will break something but because it will be ignored and you might be Spect something else Then what it is actually doing So it still is gonna use this The implementation even if you change it But it will drop the fields you don't selected you say I don't want these That Then it won't get those Fields and you will only have this data returned And Begin here you can have equal Not equal Equal or not And Do we also have the in function That means This joint value Sorry If this on field Is an array Then you can use the end function To meet make sure that it Actually looks weather the ideas in this That's the in function And again Remember when we started out I told you that you need to be willing to get your hands dirty Now This code If we go to the compound and it's self I'll show you where it writes this code So Let me scroll down to the bottom here And let's see we're looking into sermon Picture ID Now we'll still get to why it says preacher ID When we look at the photos and the where Must go to the club No you can actually see I'm gonna refresh this page and then go to the code Ok so since this get is used in the front Of the component we will go to the front end and not to the admin area So we go to the front end Of 7 distributor And then we are Looking at the model right there get it Dynamic gate is used in the model to get the And we are looking at sermons You just make sure that Yes it's sermons Getting a list query and it's using big Nation Getting all this So Looking at sermons Sermons on the Under the preacher I researcher be this model Also you the way that I know all that But just that I could get you the code You can see Domain Method Which actually has this dot ID Domain Data set value method It is It is written here Siri can see it as it ID name ideas link types or description If you look at that You are it says the same thing Icon preacher series category ID So this is where it writes it And it shows you where in the papaya lyrics Number Then it sets up the Second 1 Series CC And Then You can also see it says series Equals CID So series There is series Equals The sea This table series ID And then it also tells you what it wants from see it once the name and the ugliest and then it wants a series Changes at the series Since this is in the select Query this is one There And So that a Rey And Transposase to disarray That is the way that you make use of Joomla Database PPI So it has a thing called quad name Which you can pass to erase And the first array being the actual Name of the Value which in this case is name and alias And the second array What you wanted to be once the query is for So that links this into the the query One-by-one See all the rows even the category 1 is linked in here And then It doesn't check whether there's an ID And if it exists it takes whether it's a string It was a string it answer quote And if it isn't if it's a number It just answer directly That is where Where is done And URI basic return false if there is no ID And so will look at this area in a moment this is done To the filtering Underwear Ok So I just wanted to show how it adds this Preacher as well as series To the query Look at the back Open up here You see that series And preacher And statistics but sisters sticks You see we select Multiple statistics Because for one 17 There can be multiple downloads right So there's multiple statistics Oh sorry not multiple downloads multiple files And per file there will be a a a number So if we look at how we does that It is first does the query and hearing get item It actually Adds a new function Called Get ID sermon statistics and with a With a random Key To ensure that it doesn't conflict with any other method We had to add this random key And it puts it into this variable and that something that you need to Come and look at And Possibly when we look at the the site Layout area as well as the tablets I'll be talking about this transition here again And the fact that you need to know That is in this variable And I'm trying inside of your layout and your side Use these things I'm trying to give you the correct name But it is not Water type correctly Possibly you need to come check this if it doesn't just work Begin all explain that when we get there Listen to No We're adding the sticks into this variable through a method which is also on the page and we passing the ID Of of the sermon So if you look at the car there you are This exactly what you're saying here We saying Ok gets a district multiple Went to the left Can you can select any of these And then Use the main table table sort a ID Must be equal to is sermon And then this is the only values I want to return From the east sermon So the Easter - is this value here Gay Samsung 8 ID must equal is sermon And then if you look at the code It basically if we go to this function we should be just here Thanks that ID And Places that next to his sermon Wizard into its place Basically also here's the two arrays what it What it is in the bass and what it And Ajax weather in execute checks whether it's got any erase or any values And then returns that is an object List And that the gets placed inside of this Space and sign here Now you would see this area here Is actually custom scripting So if we go back to the dilemma get you see that there is a custom script area If you click on that You see that there is Different switches You can select Get list query Or before getting the items After getting the item If you select after getting the items And you place any code there Then data gets dumped right after The initial items with Received It will it will add that Code in there and then only week The item So that is why you can model the data Right there in the dynamic get You gonna write the code For the data After it's been get And you can check If I remove this Cody Ritzy IT tells you that there is an array of items Where all values are And then I'm just saying I want to be sure that those items are set and that they are there Before I start doing your 4 it's on then And so get here I'm using Some double You know the street bracket component helper functions The Strain is there So you can dump some nice PHP Even before getting the item you can add some filters or get list query Before the if you if this is model list If this is item You see that Then there's a different set of Switch is available And so it Adjusts to To the type of Query type Ok Coming back to this area Let's again look at the database table option Basically you see I selected category and it's a single row that Sue turned I called it be You wanted left and I said hey Cat ID must be equal to be ID Which is the ID of the category The only one The title And the Elias So that is Are we set that up I need a title in the Elias And it returns that for us Then It links it in there and that's part of what you saw here You looked at the query Basically the sex section Now let's look at the filters You see where I'm a filter And where ordering and setting of Globals Number setting of Globals Easy we have a value in this query That you possibly want to use in a custom query which isn't even Setup yet but you want you know I'm gonna need this value in the model Then you can through this Global Action Gear You can set a global Again here you should maybe taste it There is an option of using this and State When is the different type of Set types You can set the value to state or you can set the value to this And Yeah you need to know Wiki so So let's I wanna do the name Obviously and this case is not gonna work ideal Because you got more than one name So you see this Global function only functions well When your house is returning a single Item so when you only do get I did not get list query But you do get Item Then this make sense and then you can give it a name And Due to the global Scope of the method The models are there Which you can enter actually access through other Model Methods Which are custom Methods Ok so that is setting the global The filtering You have a a list of possible filtering So Depending on what you wanna do You might select ID or user or access level or group or category Tags date Some of these are not really well formulated yet like date doesn't work that well yet But can't recruiters user group access level user and I need as well You know this function value of variable works well as with Array Array value repeatable value another All those already work very well And you can already use them and Implement them Now the only way for you to really Know exactly how it works you need to know little PHP and then you need to Violet and go look in the code what it has done and where it's placed what And that Is Why I showed you that this is all set in the model Ok So currently We are saying we wanted to 8 to do a request Get input your by ID So this is the The gate area that I added The code it says State the key Here SI unit we said it is a function bearable So it doesn't a change or adapt this at all And then says it must be equal to preacher So what we are doing a system component that doesn't know where the this variable is gonna be a string or integer That's why we have this function which first checks whether it's a string And then checks whether it's a number And related and built-up the query respectively You might feel that is too much and Possibly right But that is the only way I am And 3 more developers involved My possibly improve this Then you see there get Early Access Now we have a bunch of values that fire every time in a custom Dynamic get And it is the these values An orphan x you you might need these dull use So instead of you Having to do custom scripting to get these values on the page We had his values dynamically every time So the user ID the group The authorised group the access level The app and then the input values Which by other URL post He's on the page And it tells you that it's been initiated This is true so that if you have custom Methods Like this one Preacher It takes Weathered it's been set And if it has been said it doesn't say that again it can just use it But if it hasn't been set it sets it and also get in Sesotho So DC meat Necessary variables Global variables Can then be used inside of the coaches like the global variable we spoke of earlier Ok so Out of that Global variable We are Actually accessing This levels I'm sorry it's just one here Which basically has the gate use offer get authorised you levels Of the specific user That is now Uno accessed Model or the view that this model belongs to And if he is in these access levels So you remember that public is another access level And so if the user is inside any is a public it will this will validate true in the query Ok so We said that up simply by adding access level In A access So you must check in the Main Source table For a 6 a access And whether this user is in that So that means you don't need to add a state to you because The code is done for you Ok That's That is some of the filters Venda wear Is so you can add any table p Equals to a certain value Value could be another table Rugby field We could even be a global variable like we said we could set up So you can also be an idea user ID now you use the ideas already On the table so it could be Just user ID And or it could be like we've done it this case just an integer which is 1 So we wanna make sure that all the Sermons returned Is published And if you haven't I'm probably so many shouldn't even Return it all Ok so That's what we doing with that I am Dad is setting up a get list query With passion Through this Ordering method we just saying use the a ordering Anna send now you can order all the items Just as many as you like Be sure that the table that you Audrey You could even use a name right So could be a name As an ordering Table key Then it comes to it a descending listening Then it would be added to the query Ok That is also added ordering To the data set From Your Dynamic get method I'm so here with the joint view tables you can do very nice Dependency Calls From other tables in the backend And bring the data together into one items array That's basically what Dynamic get is for That you saw We have A The normal what I call main source on the table On the 3 in the model And then we have this other one called get preacher So That is another Dynamic get function which way Looked at Scored this one Get preacher Open it We see it so it's It's a custom Get custom And we gave it a cluster name called get preacher It's relationships So it is basically having No Relationship there Neither here so it's It's not linking to other tables It's simply getting the preachers details Right there Simple as that But it has a filter which is basically using the same entity And I access levels as the filters It's also using a where I suppose yes published and it doesn't need ordering Because it's just one picture but I know the less added the ordering I could actually delete this And it doesn't have any globally settings issue that is baguette preacher and so from the This settings here I don't think there's custom scripting nope prob this settings here Opponent builder right right solders code You see that we have this function everywhere called you like it cold and And then we using a global method a static method get you Do I get calm it's a method write build if you know you like it if you don't know it go to get UI kit It's a It's a JavaScript Library CSS JavaScript library which really makes modelling of your views very nice And it has components that you can use So like her tooltip and modal All these kind of models but Gordian is another component And we don't load all of it's components every time so what we've done is we've Written in PHP a method that looks at Fields that are text area fields And normal text Fields no mostly ok it's not Not looking at every field is only looking at the exterior Fields and editor Fields so in in this Component we know that this description field is a Editor field and so we are sending it to this method then you can go look at this Method Method In your helper class so there Because they use the method so So it has the classes that already has been identified which is what this Initial this component area sorry Field name field value model field null value is actually holding it Holding any component names that already has been identified this gets Fast also here with the content then we check in the car and whether there is a class UI UK on the score and if it's not false we we start looping to check what What what are all the components that are in there and here is the list of the components that are available So on the fly we are determining whether these components should be loaded just by Looking at the content that was placed in the description field and then we added back to the Array so it updates this eventually you have an array of All those items and in the view we go to the view Which in this case is gonna be preacher We open the view dot HTML We get to a place which basically everything is gonna be happening so These are of the components that go in component builder compiled that Ocation it looks inside of the content of your site view as well as your custom admin View Anita dentify that these components must be loaded for you and you like it and so it plays Places it here dynamically but since you could've added some components inside of the script that Restore in the description area it now has this get you I could component which piece base Ridgebacks back into the model and in the model gets this Variables value through a method which is here at the bottom of the page there Get UI kit component basically through this method it is reaching in Into getting that array and once it has that array we basically check whether it is set Whether it is an array and it it is under a we we said it To The Raid at is already on this page then over here we loop through that array And we load in those components CSS and JavaScript as required You always can be sure that the UI kits needed components will be loaded on the A user adding some of that components to its description as style Because the way you like it works as you just like Bootstrap you just Add the class name To the specific div or tag html tag and then it you know Activates the needed scripting a rounded which is a nice library but it's Quite heavy and you don't want it on the page everytime I know you could have done this through JavaScript You know it is fact they have a way for you to do this through the JavaScript but to me I fell Let me do the work in the html so I'll believe the load on the on the server And that the browser already has much more Leverage Freedom so that's why we This feature this is maybe Beyond the scope of the kid the dynamic But since we ran into the right spot you can mention it here ok so it is all Also placed in the query that is developed by the name again that's by Park you wear Fits so once you've got your Dynamic get set up you now add these don't have Gets to either side views or to admin custom admin use so these Dynamic gets his what What gets did they die for you and this where you model the data that you want to work with and you can then Use them inside fuse in custom at The Mews now next up we will look at adding \ No newline at end of file +Hi [00:00:04](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m04s) We still working with Sermon distributor So I'm gonna use this preacher Which is a Get that I already have set up here I'll use that In our illustration So here we can see that I have This Back end [00:00:25](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m25s) View selected So It's been select nothing This is usually how it will look When you start So You'd look Select This Depending on which [00:00:39](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m39s) Area of the Backend you wanna get the data from You'd select Backend View Which is the Best way to do it I would say Then there is the Joomla Database option Would basically gives you the access to draw data from any other component installed that moment in the Joomla Website [00:01:01](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m01s) So if you select your Joomla Database You can select any Database That Is actually at that stage On your Database Installed And that means you can reach out to other components Through this dynamic get I'm gonna not do that [00:01:21](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m21s) In fact that's also an area which I haven't tested so well I You possibly might try to implement that And ran into some bugs And this stage I can't make any apologies for that since Really thing you should do is instead using Back end View Option Now [00:01:42](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m42s) You might say but why is the other option there Well it's because that's a feature we certainly want in the application right And so I'm busy working in that direction And busy Programming so did that feature will work without any problems In fact for the most part if you don't do very complex Mapping If you just do a simple Direct database fetch like that Are you be able to use this it won't give you an issue [00:02:09](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m09s) What it really is about these other Linked or Joint database structures That really would make it complex So And that might Cause problems I'm not 100% sure Obviously it did work But I haven't tested it well enough as well as I have tested the other part and that is this back-end view [00:02:32](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m32s) There is also the custom option Where you can just dump the whole Option of Using component builder to sort of write your Your your PHP for you And here you can add custom PHP it will add The methods data for you So this is a custom get option where you write the code [00:02:55](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m55s) Basically by hand Where is this option Write the code for you So You select the back-end view that you want to use again that back-end view Will be the the view that you connected to your component right So you need to type that you name in here and then select That package And it will load [00:03:20](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m20s) All the field names As a.id and a.asset id and a.name and allias and icon So these are all the fields inside of this view And I will load it and I'll put this as Asset ID Now again I would suggest you don't change that What you can do is you can take Out a row You feel ok I don't need that row [00:03:50](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m50s) Then you can Remove a row Like that And you can say I don't need the row I don't need these Way to there Basically that's all the data you might want And then you will know That this would be the variable name Of the data on When do When these get is used [00:04:13](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m13s) So that's the The basic part of setting up a Get I need to mention that you have get types as well now the get types have 4 of them There is the get item Which will get one item so that means from this preacher table It will get one item Then you got the get listQuery Which will get Multiple Items [00:04:41](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m41s) Ok so depending on how many items you want to get from the database you would select either get item or get list Then you get custom And then you got Get customs that plural And The difference between these two or four Is the get item Is what you will use only once per [00:05:04](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m04s) Per view So if you are building a custom admin view You will select a main get Either of a get item or either of get list But you can add multiple custom get item Or custom get items So You can see these as Other Methods that you're adding to the page but it's not the main method [00:05:30](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m30s) so you have main methods which are these a get item and get listquery Which by the way is the exact naming of the methods that will be used And then you got this custom get custom and get customs Which is really almost same as these two it's just that they are not Main There will only be another method in the model Which will bring data to the view So you can add as many custom Get custom and get customs [00:06:00](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m00s) Methods To your view as you like but you could only add one get item and you only add one get listquery Usually the way we would decide on this is that we would Say what is the main objective of The View What is the main dataset that we want to use in the view And that is what we will use the get list query and get item for Respectively [00:06:27](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m27s) So if the main purpose of The View It's a show preachers, a list of preachers I would use the get list query as the main Selection here Now you see that you have when you do a list query you have the option of adding pagination So Basically that would mean whether the data should only return a certain number Now Joomla has a global number there Which you set in the system administrative area under your Global settings [00:07:00](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m00s) let me show you that So you go to system Then Global configuration And then you see there is a default list limit This one here And That is what will be used as the amount That limits the data being returned to the page so it will only return at this stage 20 item [00:07:26](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m26s) If I set that pagination to yes And if I set it to no it will load all the data So yes would just load some of it And no will load all of the data so depends on what you wanna do if you wanna do an Ajax Well you wanna be sure that all the data is being loaded every time and you rather use JavaScript Set up pagination for yourself for your view Then that is why you would use the no switch most of the time you're just say yes And [00:08:00](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m00s) Joomla world Sorry component builder will automatically add the pagination code to the page It will also automatically add pagination code to the model And at the bottom of the page it will show a one two three pagination now possibly depending on The template you are using And the styles that are on the page Bootstrap is not on the page that one two three might possibly not look right and you will need to add styling to it [00:08:31](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m31s) component Builder doesn't know what style is on your page so they cannot make provision for all of that But it actually can load the pagination itself And it does Do that Ok Now here you have data and You can join this data to other database tables And now again here like with the main source You're able to select [00:08:57](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m57s) Joint Views From a table A view Table which is basically the views of the component Or just any database table And to one of the database tables I often Connect to these categories you see because component builder Integrates It's application If you add a category field To any View [00:09:22](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m22s) It dynamically set up a category for your component And integrates the category concept into your component so it writes all that code for you and basically the way that Joomla's own Applications like Article manager does it so it's using the same conventions So if you know how Joomla article manager is bringing categories into the articles Then that is the way your component is gonna do it as well And Here You can now select categories [00:09:54](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m54s) You can say These switches I'll Deal with When we come and look in More detail at this area And then you can model the data there And model I mean decide what you want to return you don't want to return everything from categories But the one I want to look at first is actually this joint view Table we'll come back to the DB option The joint view Table let you again select from any of the other views that is Part of your component [00:10:25](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m25s) And again you can select whether it should return a single row Or a List of rows Now when you say single row it means it's gonna literally join it To this other data set that you have as your main data or your main source It will just be another Item in the array And so that's why you can't use the name Name For example here [00:10:51](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m51s) It needs to have that That series underscore in front of it So that it doesn't clash with the other data set that possibly also has a value called name So again here if you selected you know let me just select Anything here Series You see that it will populate this area with all the fields that is in that View Then this as Button here [00:11:21](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m21s) Basically You can't use the same Alphabetic number twice in the whole In the whole query So So the whole get function can only use a once and then b once and then c once and then D So You need to make sure that the [00:11:40](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m40s) That these are set up that you can we'd made provision up to z z How many tables you can have Only in this area here and So Basically you would First decide whether this row Type what type of return it will be If you set it to multiple you see that these names automatically update [00:12:02](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m02s) Because now The way that the get method will Work Is it will create a new Method Which will get this data And add it into your item list Via this relationship so I'm adding the on field as the Dot a series that's where the ID is for the series [00:12:24](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m24s) And the joint field I'm using the C ID which is that one So that means in the main Database That is the a database There must be a field called series And it has the ID of the series And it corresponds to the ID in this list And if I wanted to return a multiple it means that The main database which is in that case a sermon Can be linked to multiple serieses But in the system we are working with here [00:12:56](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m56s) That is not possible you can only Connect a sermon to one series So that means it's certainly a single return Then it will immediately add this Series underscore in front of everything to insure doesn't clash with your a table That's What It's basically doing Again you can remove the fields you don't want but Please do not edit [00:13:18](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m18s) The string It possibly would make it break I wanted to be possible that you can change this name to anything you like And we are gonna try and do that eventually but for now it's still doesn't really like you doing that And it it in fact you can be changing it it will still write it this way in the code that's That's part of why I'm saying you shouldn't change it not because it will break something but because it will be ignored and you might expect something else than what it is actually doing So it still is gonna use this Implementation even if you change it [00:13:54](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m54s) But it will drop the fields you don't select so if you say I don't want these That Then it won't get those Fields and you will only have this data returned And again here you can have equal Not equal Equal or not And we also have in function That means [00:14:22](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m22s) if This joint value Sorry If this on field Is an array Then you can use the in function To make sure that it Actually looks whether the id in this That's the in function And again Remember when we started out I told you that you need to be willing to get your hands dirty [00:14:45](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m45s) Now This code If we go to the component itself I'll show you where it writes this code So Let me scroll down to the bottom here And let's see we're looking into sermon Preacher ID Now we'll still get to why it says preacher ID When we look at the filters and the where [00:15:06](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m06s) but let us go to the code Now you can actually see I'm gonna refresh this page and then go to the code Ok so since this get is used in the front Of the component we will go to the front end and not to the admin area So we go to the front end Of sermon distributor And then we are Looking at the model right the get Dynamic get is used in the model to get the data [00:15:33](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m33s) And we are looking at sermons let me just make sure of that Yes it's sermons Getting a list query and it's using pagination Getting all this So we're Looking at sermons Sermons on the Under the preacher ID so it should be this model I'll still show you the way that I know all that [00:16:02](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m02s) But just that I could get you into the code here You can see the main Method Which actually has this dot ID or the main Data set sorry not method data set It is written here So here you can see ID, acid ID name alias link types short description [00:16:26](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m26s) If you look at the UI it says the same things, alias, link type short description Icon preacher series category ID So this is where it writes it And it shows you where in the complier it's done that Then it sets up the Second one Series you see And Then You can also see it says series [00:16:50](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m50s) Equals c ID So series There is series Equals The c This table series ID And then it also tells you what it wants from c it wants the name and the alias and then it wants a series name that Changes it to series [00:17:12](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m12s) Since this is in the select Query this is one function there And So that array And Transposes to this array That is the way that you make use of Joomla's Database PPI So it has a thing called quote name [00:17:35](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m35s) Which you can pass to arrays And the first array being the actual Name of the Value which in this case is name and alias And the second array What you wanted to be once the query is completed So it links this into the the query One-by-one See all of those even the category one is linked in here And then [00:17:59](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m59s) It does a check whether there's an ID And if it exists it checks whether it's a string If it's a string it adds a quote And if it isn't if it's a number It just adds it directly and That is where Where the query is done And here basically return false if there is no ID And so we'll look at this area in a moment this is done [00:18:23](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m23s) To the filtering and the wear Ok So I just wanted to show how it adds this Preacher as well as series To the query if we Look at the back Open up here You see that series And preacher [00:18:41](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m41s) And statistics but statistics You see we select Multiple statistics Because for one sermon There can be multiple downloads right So there's multiple statistics Oh sorry not multiple downloads multiple files And per file there will be a a a number So if we look at how he does that [00:19:02](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m02s) It is first does the query and hearing get item It actually Adds a new function Called Get ID sermon statistics and with a With a random Key To ensure that it doesn't conflict with any other method on the page We had to add this random key here And it puts it into this variable and that something that you need to [00:19:27](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m27s) Come and look at And Possibly when we look at the the site Layout area as well as the tablets I'll be talking about this transition here again And the fact that you need to know That it is in this variable And I'm trying inside of your layouts and your site views and these things I'm trying to give you the correct name But it is not [00:19:51](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m51s) Water tight correctly Possibly you need to come and check this if it doesn't just work But again I'll explain that when we get there just that you know We're adding statistics into this variable through a method which is also on the page and we passing the ID Of of the sermon So if you look at UI This exactly what we're saying here We're saying Okay get statistics multiple [00:20:19](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m19s) so we Went to the left Can you can select any of these And then Use the main table dot ID Must be equal to e.sermon And then this is the only values I want to return From the e.sermon So the e.sermon is this value here okay o I'm saying a ID must equal is e.sermon [00:20:48](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m48s) And then if you look at the code It basically if we go to this function which should be just here there it is. It takes that ID And Places that next to e.sermon and puts into its place Basically also here's the two arrays what it What it is in the database and what it should be now And it checks whether executes, checks whether it's got any arrays or any values [00:21:17](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m17s) And then returns that is an object List And that then gets placed inside of this Space inside here Now you would see this area here Is actually custom scripting So if we go back to the dynamic get you see that there is a custom script area here If you click on that You'd see that there is Different switches [00:21:54](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m54s) You can select Get list query Or before getting the items After getting the items If you select after getting the items And you place any code there Then data gets dumped right after The initial items we've Received It will it will add that [00:22:14](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m14s) Code in there and then only return The items So that is why you can model the data Right there in the dynamic get You gonna write the code For the data After it's been get And you can check If I remove this Code here you'd see tells you that there is an array of items [00:22:33](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m33s) Where all values are And then I'm just saying I want to be sure that those items are set and that they are there Before I start doing it on each of them And so again here I'm using Some double You know the street bracket component helper functions to check whether the String is there So you can dump some nice PHP Even before getting the item you can add some filters or get list query [00:23:02](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m02s) Before the if you if this is model list If this is item You'd see that Then there's a different set of Switches is available And so it Adjusts to To the type of Query type up here Ok [00:23:19](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m19s) Coming back to this area Let's again look at the database table option Basically you see I selected category and it's a single row that's returned I called it b I joined it left and I said a Cat ID must be equal to b ID Which is the ID of the category And I only want The title And the alias So that is [00:23:44](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m44s) how we set that up I need a title in the alias And it returns that for us Then It links it in there and that's part of what you saw here when You looked at the query option here Basically the sixth section here Now let's look at the filters You see where we've a filter And a where and an ordering and setting of Globals [00:24:12](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m12s) now the setting of Globals if you have a value in this query That you possibly want to use in a custom query which isn't even Setup yet but you want you know I'm gonna need this value in the model Then you can through this Global option here You can set a global area now Again here you should maybe test it There is an option of using this and State [00:24:38](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m38s) there is the different type of Set types You can set the value to state or you can set the value to this And here you need to know key so So let's I wanna do the name Obviously in this case is not gonna work ideal Because you got more than one name So usually this Global function only functions well [00:25:01](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m01s) When you are returning a single Item so when you only do get item not get list query But you do get Item Then this make sense and then you can give it a name And it will add it to the global Scope of the method or the model rather Which you can access through other [00:25:24](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m24s) Model Methods Which are custom Methods Ok so that is setting the global The filtering You have a a list of possible filtering So Depending on what you wanna do You might select ID or user or access level or group or category [00:25:45](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m45s) or Tags or date Some of these are not really well formulated yet like date doesn't work that well yet But categories does user group access level user and ID does well You know this function variable works well and Array Array value repeatable value and other All those already work very well And you can already use them and Implement them Now the only way for you to really [00:26:15](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m15s) Know exactly how it works you need to know a little PHP and then you need to compile and go look in the code what it has done and where it's placed what And that Is Why I showed you that this is all set in the model Ok So currently We are saying we wanted to do a J request Get into here by ID [00:26:39](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m39s) So this is the get area that I added I look in The code it says State the key and it's this Here you see and we set it is a function variable So it doesn't change or adapt this at all And then says it must be equal to preacher So what we are doing since component builder doesn't know where the this variable is gonna be a string or integer That's why we have this function which first checks were that is string [00:27:08](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m08s) And then checks whether it's a number And related and builds up the query respectively You might feel that is too much and you're Possibly right But that is the only way I am implement it at this stage And getting more developers involved May possibly improve this long run Then you see there the Access Now we have a bunch of values that fire every time in a custom [00:27:39](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m39s) Dynamic get model And it is the these values And often times you you might need these values So instead of you Having to do custom scripting to get these values on the page We add these values dynamically every time So the user ID the group The authorised group the access level The app and then the input values Which by other URL or post is on the page [00:28:08](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m08s) And it tells you that it's been initiated so This is set to true so that if you have custom Methods Like this one get Preacher It's checks whether it's been set And if it has been set it doesn't set that again it can just use it But if it hasn't been set it sets it and also again sets it to true So [00:28:32](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m32s) variables Global variables Can then be used inside of the coaches like the global variable we spoke of earlier Ok so Out of that Global variable We are Actually accessing This levels And so it's this one here Which basically has the get authorized view levels Of the specific user [00:29:00](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m00s) That is now you know accessed this Model or the view that this model belongs to And if he is in these access levels So you remember that public is another access level And so if the user isn't signed in he's a public it will this will validate true in the query Ok so We set that up simply by adding access level In A access [00:29:28](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m28s) So you must check in the Main Source table For access And whether this user is in that So that means you don't need to add a state key because The code is done for you Ok That is some of the filters then the where [00:29:48](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m48s) Is you can add any table key Equals to a certain value now that Value could be another table like b field or it could even be a global variable like we said we could set up So it can also be in ID, a user ID now the user ID is already On the table so it could be Just user ID And or it could be like we've done it this case just an integer which is one So we wanna make sure that all the [00:30:18](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m18s) Sermons returned Is published And if you have an unpublished sermon it shouldn't even Return it at all Ok so That's what we doing with that That is setting up a get list query With pagination Through this Ordering method we just saying use the a ordering [00:30:39](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m39s) and a send now you can order all the items Just add many as you like Be sure that the table that you ordering You could even use a name right So could be a name As an ordering Table key Then it you could do it a descending or ascending Then it would be added to the query [00:31:03](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m03s) Ok That is also added ordering To the data set From Your Dynamic get method and so here with the joint view tables you can do very nice Dependency Calls From other tables in the backend And bring the data together into one items array [00:31:25](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m25s) That's basically what Dynamic get is for and as you saw We have A The normal what I call main source on the table sorry in the model And then we have this other one called get preacher So That is another Dynamic get function which we [00:31:45](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m45s) Looked at it's called this one Get preacher if we Open it We see it's a It's a custom Get custom And we gave it a cluster name called get preacher and this is It's relationships So it is basically having No [00:32:04](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m04s) Relationship there Neither here so it's It's not linking to other tables It's simply getting the preachers details Right there Simple as that But it has a filter which is basically using the same integer And access levels as the filters It's also using a where I suppose yes published and it doesn't need ordering Because it's just one preacher but I none the less added the ordering I could actually delete this [00:32:41](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m41s) And it doesn't have any globally settings okay so that is get preacher and so from the This settings here I don't think there's custom scripting nope from this settings here component builder writes all this code You'd see that we have this function everywhere called UI kit comp And then we using a global method a static method get ui comp it's a method that I built if you know uikit if you don't know it go to get UI kit or just google it It's a It's a JavaScript Library CSS JavaScript library which really makes modeling of your views very nice and easy And it has components that you can use So like tool tip and model [00:33:45](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m45s) All these kind of models but Gordian is another component And we don't load all of it's components every time so what we've done is we've Written in PHP a method that looks at Fields that are text area fields And normal text Fields no mostly okay it's Not looking at every field is only looking at the text Fields and editor Fields so in in this Component we know that this description field is a Editor field and so we are sending it to this method now you can go look at this Method Method In your helper class it's over there Here's the method so So it has the classes that already has been identified which is what this [00:34:56](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m56s) Initial this component area sorry Field name field value model field value is actually holding it's Holding any component names that already has been identified this gets past also here with the content then we check in the content whether there is a class UI UK underscore and if it's not false we start looping to check what What what are all the components that are in there and here is the list of the components that are available and so On-the-fly we are determining whether these components should be loaded just by Looking at the content that was placed in the description field and then we added back to this Array so it updates this eventually you have an array of All those items and in the view we go to the view [00:36:00](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m00s) Which in this case is gonna be preacher We open the view dot HTML We get to a place which basically everything is gonna be happening so These are of the components that go in component builder compiled the application it looks inside of the content of your site view as well as your custom admin View and it identify that these components must be loaded for uikit and so it Places it here dynamically but since you could've added some components inside of the script that that is stored in the description area it now has this get uikit component which basically reach back into the model and in the model gets this Variables value through a method which is here at the bottom of the page there it is [00:37:04](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m04s) Get UI kit component basically through this method it is reaching in Into getting that array and once it has that array we basically check whether it is set Whether it is an array and if it is an array we set To the array that is already on this page then over here we loop through that array And we load in those components CSS and JavaScript as required so that You always can be sure that the UI kits needed components will be loaded on the page simply by user adding some of that components to its description as style Because the way uikit works is you just like Bootstrap you just Add the class name To the specific div or tag html tag and then it activates the needed scripting around it which is a nice library but it's [00:38:08](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m08s) Quite heavy and you don't want it on the page every time now I know you could have done this through JavaScript You know it is fact they have a way for you to do this through the JavaScript but to me I felt Let me do the most work in the html so relieve the load on the on the server And that the browser already has much more Leverage and Freedom so that's why we This feature this is maybe Beyond the scope of the get the dynamic get But since we ran into I quickly mentioned it here okay so it is all Also placed in the query that is developed by Dynamic get that's partly why it Fits so once you've got your Dynamic get set up you now will add these dynamic Gets to either site views or to admin custom admin views so these Dynamic gets is what What gets the data for you and it's where you model the data that you want to work with and you can then [00:39:12](https://www.youtube.com/watch?v=OPuCoxPW35s&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h39m12s) Use them in site views and custom admin views. Now next stop we will look at adding it to a site view and how all of that works. Thank you for watching. diff --git a/014-Adding-dynamicGet-to-a-Site-View.md b/014-Adding-dynamicGet-to-a-Site-View.md index 8534e0e..4c5ff0e 100644 --- a/014-Adding-dynamicGet-to-a-Site-View.md +++ b/014-Adding-dynamicGet-to-a-Site-View.md @@ -1 +1 @@ -Hi now did we have to learn him and get him Place let's attitude Side view and look at the initial implementation who go to side view And then click on new but since we already have That you created we just gonna open it or preacher You see the deer on the right-hand of 3 Fields that you can Populate with your Dynamic get methods the first one is where you would add All the custom Dynamic gets and there you can add multiple custom done in me gets The second one is where you add your main Dynamic get as we explained in that Tutorial you can add 1 Main get method per View a site view since it's gonna be billed in the model Either as a get item or a get items it is all depending on them Main gate weather it's gonna be a list or just an An individual item Yet you can include Dynamic Gates Custom Dynamic get as many as you like You also have this data available in your view So these two first fields are used to load The Dynamic get to love you The third one Is used to display the possible way that you might want to implement The code of a specific Dynamic get option You see that This one only displays Possible main Gates this one only this place customer gets Where is this is this place both The custom and the main kind of Gates Now If you select a Hey ya My girl let's go to One of these Main Gets Sermon This one here You see that it shows us A list Print out of the possible ways that you might Use the result set Obviously each of these are properly you can copy by clicking in it and then clicking on I do right click And Copy or you could click on ctrl V Pokemon The Sorry ctrl C in command C How to copy respectively the accounting Sometimes you might only one of use part of it and not the echo statement included Then you can pick from the area where you want to copy and then before letting go Click on control C or command centre Mac 2 Ensure you only graph that section of the text Once you let it go it will select the whole block and then Obviously if you copy it you will copy everything As you can see We then use that This code in our default View To to display the data In a PHP Fashion You can also get the the customer get here let me show you that one picture Like you see it says that that Values gonna be in this preacher And if we look here at the top that is what we check for checking for here Make sure that you have a Preacher And then this block Basically deals with displaying the data related to that Information This one here Checks whether the main items are on the on the page and now the main items as you can see Is sermons preacher ID get list So if I go down to that 732 I get List You see that again it shows me that the values are in items And it's in array So I can look through it and target the the object values And that's what's being done here We first checking whether it's On the page the values Then If we see that it is here We use make use of templates Do Do display the various Layouts And I will explain in an equatorial how to use templates in layouts inside Of your site View But this is just quickly showing you how to connect A dynamic gait Structure Methods to your view And then how to make use of the data that are being passed through to the view So this data structures here on the right in grade Is basically the the data structure that you can expect From each one of these so if I was to take number sermons As the deer Method that I want to see Then it shows me that That's possibly the way that it will be packed into the data set So it'll be found in this number sermons is how Now that could change Depending on your customer Limitation In your components custom clothing areas you might move this data from that Position to something else But the reality is this at least gives you how it would have looked without you You know I'm leaving the The normal Pass So this is just Proposing the dataset structure Which ideally would be that you would take this value here And Maybe do do this in the code Do a bar down And then exit And then Basically do a build and go look at this view to see exactly the structure If if you are finding that this the structure that we've shown isn't working exactly as a Often this helps us To sort a map the array and see where What value is found same goes with any of the other You can just grab that area That you want to take him to Put it in the Vaal Dam Do a bolt go look at this page In the in the front of your site And you can see exactly the structure of this The subject here Whether it's an array and array with objects or what Is placed inside of this value set through the dynamic get method Now I just want to quickly Pick up the Way that these methods are actually becoming available in your view My going to the code And you looking at Some of the implementations that we've done Ok As you can see we've gone to the front of the site Salmon distributor Models And we've opened The preacher model Use the printer model And As you scroll down you see that there's a get list query This get list query gets sermon as the a Table And then Series a Stacey table preacher is the D Categories is the Sorry CDP Is the B table And then it looks for a value An ID And then Set it equal to preacher And in sure that it The prison has access level 2 the item That's published And then returns it So that is the Get List query in the model Have you go back to our The face you see that we have Cement pizza ID get list as the main And I've opened that Dynamic get here Honey where is it Uranus And you can see that Sermon that is a the main the main table Then if you open here you see that series a sitter see they only looking for those values Preacher said is d only those values Sadistic E But it's a list Multiple These that are single are part of the list we re where is the multiple of it will have its own object sorry it's Method Look at that booty And then We see in the DB table That we have category a single SB Only does values So going back to the code This is the get list query in the get item After we have received the items We look through them And then in this function here get Sermon statistics and then a A generated string Randomly generated string to ensure No conflicting with other methods on the page Puts the values in I ID sermons statistics e So that's where the values of place And then basically we have a custom Method here like be shown in the dynamic gate you can add custom methods And then returns the items to the page And in the page You have a A file That is called View Dot PHP Sorry dude HTML dot.dot PHP If you open this way File you see that there is a get items Method being used to place the items in items And so At the moment we are actually interview at this stage And that means you can access This set of values Inside of that Class field And so if we go back to our Component Builder You would see if we were to select That message There there is the items Corresponding to our code And so we know that the ID in the acid ID in all these are in there if you scroll down You see that there is it sermons is too sticky see it there So that means In the array there is a P value Which has another set of array values in it So you can target these data sets Buy Cars Responding Waiting Values So that is just looking at the main gate Now if we were to look at The other custom get That is been added We'll see that here's preacher Witches and price them get No custom method That is been added And It also has it said of Values and it's database structure and member we said that we wanted to be Link to the preachers ID So get checked for the ID And then Set it to ID And returns the result Same goes with the number of downloads It's also custom method That said To this view because of the custom get that was added And here is the number sermons And we go back to our view dot HTML dot php file We see that those values are respectively being added To preacher Number downloads and number sermons And you can actually use these values in the view by by targeting with this number Sermons Now the view itself is As you should know inside of Two template folder Under the fuse preacher And this Main View as we call it all the default view is where that code that we on the page that we looking at right Being placed All these others are the templates that are extending the site View And they possibly are extended through layouts that are all available in the layouts folder So We are we are now just looking at adding The custom get methods to the page in our next to tauriel Locate depth about adding templates to your Custom Camp Site View And making use of these data sets So That is how you link them your first create the customer get then you come here you link these So these are the linking Fields and these are just so that you can see the code snippets on making use of these fields Respectively And That is custom Gets added to side view Thank you for watching \ No newline at end of file +Hi now that we have the dynamic Get in place let's add that to a Site view and look at the initial implementation we will go to site view And then click on new but since we already have That you created we just gonna open it called preacher You would see there on the right-hand there are 3 Fields that you can Populate with your Dynamic get methods the first one is where you would add All the custom Dynamic gets and there you can add multiple custom dynamic gets The second one is where you add your main Dynamic get as we explained in the dynamic get Tutorial you can add 1 Main get method per [00:00:57](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m57s) View or site view since it's going to be build in the model Either as a get item or a get items it is all depending on the Main get weather it's gonna be a list or just an An individual item Yet you can include Dynamic Gets Custom Dynamic gets as many as you like You also have this data available in your view So these two first fields are used to load The Dynamic get to the view The third one [00:01:37](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m37s) Is used to display the possible way that you might want to implement The code of a specific Dynamic get option You'll see that This one only displays Possible main Gets this one only this place customer gets Where is this displays both The custom and the main kind of Gets Now If you select a [00:02:04](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m04s) let's go to One of these Main Gets Sermon This one here You see that it shows us A list Print out of the possible ways that you might Use the result set [00:02:32](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m32s) Obviously each of these you can copy by clicking in it and then clicking on either right click And Copy or you could click on ctrl V ctrl C and command C to copy respectively the content Sometimes you might only want to use part of it and not the echo statement included Then you can pick from the area where you want to copy and then before letting go [00:03:05](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m05s) Click on control C or command C in a Mac to insure you only grab that section of the text Once you let it go it will select the whole block and then Obviously if you copy it you will copy everything As you can see We then use This code in our default View To display the data In a PHP [00:03:36](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m36s) Fashion You can also get the the customer get here let me show you that one preacher Like you see it says that that Value is gonna be in this preacher And if we look here at the top that is what we are checking for here Make sure that you have a Preacher And then this block Basically deals with displaying the data related to that Information This one here [00:04:08](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m08s) Checks whether the main items are on the on the page and now the main items as you can see Is sermons preacher ID get list So if I go down to that sermon preacher I get List You see that again it shows me that the values are in items And it's in array So I can loop through it and target the the object values And that's what's being done here We first checking whether it's [00:04:38](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m38s) On the page the values Then If we see that it is here We use make use of templates to to display the various Layouts And I will explain in a next tutorial how to use templates in layouts inside Of your site View [00:05:01](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m01s) But this is just quickly showing you how to connect A dynamic get Structure or Methods to your view And then how to make use of the data that are being passed through to the view So this data structures here on the right in red Is basically the the data structure that you can expect From each one of these so if I was to take number sermons As the Method that I want to see [00:05:36](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m36s) Then it shows me that That's possibly the way that it will be packed into the data set So it'll be found in this number sermons is how Now that could change Depending on your custome implementation In your components custom coding areas you might move this data from that Position to something else But the reality is this at least gives you how it would have looked without you You know I'm leaving the [00:06:10](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m10s) The normal Path So this is just Proposing the dataset structure Which ideally would be that you would take this value here And Maybe do this in the code Do a var_dump And then exit And then Basically do a build and go look at this view to see exactly the structure [00:06:45](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m45s) If you are finding that this structure that we've shown isn't working exactly as we expected Often this helps us To sort a map the array and see where What value is found same goes with any of the others You can just grab that area That you want to peek into Put it in var_dump Do a build go look at this page In the in the front of your site And you can see exactly the structure of this This object here [00:07:20](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m20s) Whether it is an array with objects or whatever Is placed inside of this value set through the dynamic get method Now I just want to quickly Peek at the Way that these methods are actually becoming available in your view by going to the code And just looking at Some of the implementations that we've done Ok As you can see we've gone to the front of the site [00:07:55](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m55s) sermon distributor Models And we've opened The preacher model Use the preacher model And As you scroll down you see that there's a get list query This get list query gets sermon as the a Table And then [00:08:18](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m18s) Series as the C table preacher is the D and Categories is the Sorry C D B Is the B table And then it looks for a value in ID And then Sets it equal to preacher And in sure that it [00:08:41](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m41s) The person has access level to the item That's published And then returns it So that is the Get List query in the model Have you go back to our interface you see that we have sermon preacher ID get list as the main [00:09:06](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m06s) And I've opened that Dynamic get here let me just see where is it And you can see that Sermon is set as A the main table And if you open here you see that series is set as C the only looking for those values Preacher said is d only those values Statistics E But it's a list [00:09:36](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m36s) it is Multiple These that are single are part of the list query where is the multiple of it will have its own object sorry it's Method we will Look at that quickly And then We see in the DB table That we have category a single as B Only those values So going back to the code [00:10:01](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m01s) This is the get list query in the get item After we have received the items We look through them And then in this function here get Sermon statistics and then a A generated string Randomly generated string to ensure No conflicting with other methods on the page Puts the values in ID sermons statistics e [00:10:30](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m30s) So that's where the values of place And then basically we have a custom Method here like be shown in the dynamic get you can add custom methods And then returns the items to the page And in the page You have a A file That is called View [00:10:55](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m55s) Sorry view HTML dot. PHP If you open this File you see that there is a get items Method being used to place the items in items And so At the moment we are actually in the view at this stage And that means you can access This set of values Inside of that Class field [00:11:26](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m26s) And so if we go back to our Component Builder You would see if we were to select That method There is the items Corresponding to our code And so we know that the ID in the asset ID in all these are in there if you scroll down You see that there is it sermons is too sticky see it there So that means In the array there is a [00:12:03](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m03s) key value Which has another set of array values in it So you can target these data sets By corresponding pointing Values So that is just looking at the main get Now if we were to look at The other custom get [00:12:28](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m28s) That is been added We'll see that here's preacher Which is a custom get or custom method That is been added And It also has its set of Values and it's database structure and remember we said that we want it to be Link to the preachers ID So can I check for the ID [00:12:53](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m53s) And then Set it to ID And returns the result Same goes with the number of downloads It's also custom method That said To this view because of the custom get that was added And here is the number sermons And we go back to our view dot HTML dot php file We see that those values are respectively being added [00:13:21](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m21s) To preacher Number downloads and number sermons And you can actually use these values in the view by targeting with this number Sermons Now the view itself is As you should know inside of the template folder Under the views preacher And this Main View as we call it all the default view is where that code that we on the page that we looking at right now [00:13:50](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m50s) Being placed All these others are the templates that are extending the site View And they possibly are extended through layouts that are available in the layouts folder So We are we are now just looking at adding The custom get methods to the page in our next to tutorial we are going in depth about adding templates to your Custom Site View And making use of these data sets [00:14:24](https://www.youtube.com/watch?v=vEJZe6XqHJE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m24s) So That is how you link them your first create the custom get then you come here you link these So these are the linking Fields and these are just so that you can see the code snippets are making use of these fields Respectively And That is custom Gets added to site view Thank you for watching diff --git a/015-Adding-Templates-and-Layouts-to-a-Site-View.md b/015-Adding-Templates-and-Layouts-to-a-Site-View.md index 6fbaa5e..9ad565b 100644 --- a/015-Adding-Templates-and-Layouts-to-a-Site-View.md +++ b/015-Adding-Templates-and-Layouts-to-a-Site-View.md @@ -1 +1 @@ -Hi Now that we've added a dynamic get 2 A side view And we have looked at how to access the data sets Through the Examples snippet We need to understand How layouts and templates Link into site views Is it good to know What is the site doing the code And what is the templates What is the layout In the code itself And how This to mulalo distance Well If we go to our example Phone and Sermon Review te And then View And preacher Template Tmpl You see that there is a Default File Mac PHP And there is a default on the score Retail Box Feature panel Richest Mall the PSP files A list of them Now those are all pamphlets The reason why we call them templates It's because of the method by which they are included into the default File Default file is the main file And That's what we call the site View So everything inside of this file Is actually build In the side view so let's open the site View So all this code here in before View From here to there Is added To that default File So you see it says default View And the way it adds to templates It's with this snippet or that says this load Template Preacher panel And you can get these nuts At the bottom of the Site View So if you were to scroll down You first with see the layout Snippets and then after them that template snippet And scroll down to the one you have Maid Looking at these names And then here Is a Preacher grid List Table Panel box Small So That is the snippet that you will use You might sometimes Change the way Boss please stay in the PHP instead of going out HTML So by the way that is what is happening up here If you look at the code From time to time I go out of the BHP I go into the PSP with that tag And I go out of the PHP with that Then I go in again may go out again And then I stay out that I'm Basically in HTML So here is Your HTML And Then Ok this part here is obviously Uikit Class and the implementation And then I go back into PHP And I go out again and ears HTML again So that is a way that you can work with H2O with PHP Interview I'm sorry forgot look at this in the code And be open that default file I see that exactly what is placed there So basically End with PHP there Then we go into PHP again And here is the same text that we just looked at in that Editor So that takes gets placed here and then it through these Snippets it includes the template so basically I'm using a global setting here And I'm checking now this Global setting is set in the components Global settings And I'm checking what type of this play has been set And then on the basis of that I either show this template That one All but one Template view you have access to the same Global Fields or Class Fields and public class methods As you have in the default View So in the default view we have access to this preacher but the same is true of Pamphlet design templates that I've just opened And you see I'm using the same this params Here This preacher website so I am using the same Global Class Fields values in Zone how you wanna pull it And that that is true of your templates So if we go back to our Interface the way that component bargain knows that it needs to add this template to To this site View Is simply because of this code snippet Cheap places code snippet in there and ill go look in the template List Tampered with this name Enable simply add it To that site View now when I'm in AD I mean Added to this Template with the In the right folder So You can you can by doing that At your Templates to the site View And will look at setting up templates we also look at setting up Layouts layouts work a little different Let me see do I have a layout here in this site View It seems I'm mostly using templates you can use templates and layouts in the site View I have just used Templates mostly it seems And that means that possibly the layouts I've used in the templates View But if I wanted to add a template sorry a layout to this view Without doing it inside a template which doesn't matter it's just a way of bundling yours Scripts in a more concise manner so that he doesn't be overwhelming When you look at the code but that you have it Broken up in pieces The layout structure is mostly used When you are dealing with a part of the display area That is used Cross Other Display areas So if I usually used the layout structure The moment I'm using a piece of code In more than one View Or in more than one template The reality is you could You could use Templates inside of pamphlets You cannot use templates inside of layout But you can use templates in soap Amplats And you can use layouts inside of layouts But you cannot use templates in layouts I know but these are all conventions that are set forth because of the way to Miller implements the structure These are not limitations because of component Builder This is just how to analyse it it will allow you to add pamphlets 2 The default Side view But It will not Allow you to add Cite a templates to a layout if you just scream at you And why Well the biggest The easiest way to put this Templates Have access to the global values All the class values Where is layouts done You need to pass lay out the value that you wanna give it Now that's important Point because if you look at these Snippets You see that we're just passing it this item But you can even pass it just this Or you could pass it A specific value You have your custom classes And you can pass it that specific value From your custom Class It all depends and when you setup the layout You have an area just like this what do you select The The Dynamic get that you were using in the layout Now that is not gonna add that I never get to your side view What is a model It just helps you to see the Snippets And it helps us to set up The snip it for you So if you've selected the wrong Code here In your layout we'll talk about that again when I get to layout It will actually just changed the way it looks here But you can always be override it you can copy this Snip it like that Put it in your code where you wanna use it And then you can just change that Area that Is passing the information to the layout because the layout has As it got access to the to this And so you need to pass it through it The values that you want to use in it It will still look at how how exactly that is done and possibly Spineless again but just script Basically renders a layout And this is also how component builder knows it should add a layout to the component layout folder And Eduze it looks for a layout with that name in your layouts list So you need to have these layouts set up before hand Before you can include them In 2 other Views and Tablets And do note that the layout concept and implementation Together with the template is the same in the custom admin View It works exactly the same And just by adding the snippet to the default View Component Golden Arrows it leads to add that layout to the component and knows at least Add that layer template to that site View Ok so that is adding Site views Sorry templates and layouts to a site View And Looking at the code seeing ok so Component builder builds these site views because We look at the default View They are actually Loaded here you see Creaturebox and there is Beauty box This preacher panel There's a panel There is Brits Mall And there is pretty small and there is Table grid list and there's Table Bread and So that is how you can Add your code into Smaller chunks And next up will look at setting up a template And Making use of this implementation Understanding the difference So That is adding \ No newline at end of file +Hi [00:00:02](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m02s) Now that we've added a dynamic get to A site view And we have looked at how to access the data sets Through the Examples snippets We need to understand How layouts and templates Link into site views basically to know [00:00:21](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m21s) What is the site view in the code And what is the templates What is the layout In the code itself And how Joomla load those things Well If we go to our example component Sermon [00:00:39](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m39s) distributer And then View And preacher Template or Tmpl You see that there is a Default File PHP [00:00:58](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m58s) And there is a default underscore preacher Box preacher panel preacher small dot PHP files A whole list of them Now those are all templates The reason why we call them templates It's because of the method by which they are included into the default File The Default file is the main file [00:01:20](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m20s) And That's what we call the site View So everything inside of this file Is actually build In the side view so let's open the site View So all this code here in default View From here to there Is added To that default File So you see it says default View [00:01:50](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m50s) And the way it adds to templates It's with this snippet that says this load Template Preacher panel And you can get these snippets At the bottom of the Site View So if you were to scroll down You first with see the layout Snippets and then after them that template snippet And scroll down to the one you have [00:02:19](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m19s) Made by Looking at these names And then here Is a Preacher grid List Table Panel box Small So That is the snippet that you will use [00:02:37](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m37s) You might sometimes Change the way possibly stay in the PHP instead of going out into the HTML So by the way that is what is happening up here If you look at the code From time to time I go out of the PHP I go into the PHP with that tag And I go out of the PHP with that Then I go in again may go out again [00:03:04](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m04s) And then I stay out that I'm Basically in HTML So here is pure HTML And Then Ok this part here is obviously Uikit Class and the implementation And then I go back into [00:03:20](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m20s) PHP And I go out again and here is HTML again So that is a way that you can work with with PHP In the view so if we are going to look at this in the code And we open that default file you see that exactly what is placed there cimit So basically we End with PHP there [00:03:45](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m45s) Then we go into PHP again And here is the same text that we just looked at in that Editor So that text gets placed here and then it through these Snippets it includes the template so basically I'm using a global setting here And I'm checking now this Global setting is set in the components Global settings And I'm checking what type of display has been set And then on the basis of that I either show this template or That one or that one [00:04:22](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m22s) in your Template view you have access to the same Global Fields or Class Fields and public class methods As you have in the default View So in the default view we have access to this preacher but the same is true of templates these are the templates that I've just opened And you see I'm using the same this params Here This preacher website so I am using the same Global Class Fields or values depends on how you wanna call it And that is true of your templates [00:05:07](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m07s) So if we go back to our Interface the way that component builder knows that it needs to add this template to To this site View Is simply because of this code snippet so you place code snippet in there and you'll go look in the template List For a template with this name and it will simply add it To that site View now so what I mean I mean add it to this [00:05:35](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m35s) Template with the In the right folder So You can you can by doing that Add your Templates to the site View And will look at setting up templates we also look at setting up Layouts, layouts work a little different Let me see do I have a layout here in this site View It seems I'm mostly using templates you can use templates and layouts in the site View [00:06:06](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m06s) I have just used Templates mostly it seems And that means that possibly the layouts I've used in the templates View But if I wanted to add a template sorry a layout to this view Without doing it inside a template which doesn't matter it's just a way of bundling your Scripts in a more concise manner so that he doesn't be overwhelming When you look at the code but that you have it Broken up in pieces The layout structure is mostly used When you are dealing with a part of the display area [00:06:53](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m53s) That is used across Other Display areas So I usually used the layout structure The moment I'm using a piece of code In more than one View Or in more than one template The reality is you could [00:07:12](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m12s) You could use Template inside of templates You cannot use templates inside of layout But you can use templates inside of templates And you can use layouts inside of layouts But you cannot use templates in layouts and so but these are all conventions that are set forth because of the way Joomla implements the structure These are not limitations because of component Builder This is just how Joomla does it it will allow you to add templates to [00:07:44](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m44s) The default Site view But It will not Allow you to add templates to a layout it will just scream at you And why Well the easiest way to put this Templates [00:08:02](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m02s) Have access to the global values All the class values Where is layouts do not You need to pass layout the value that you wanna give it Now that's important Point because if you look at these Snippets You see that we're just passing it this items But you can even pass it just this Or you could pass it A specific value [00:08:29](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m29s) You have your custom classes And you can pass it that specific value From your custom Class It all depends and when you setup the layout You have an area just like this where you select The The Dynamic get that you were using in the layout Now that is not gonna add that dynamic get to your side view or to the model [00:08:53](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m53s) It just helps you to see the Snippets And it helps us to set up The snippet for you So if you've selected the wrong Code here In your layout we'll talk about that again when we get to layouts It will actually just changed the way it looks here But you can obviously override it you can copy this Snippet like that Put it in your code where you wanna use it [00:09:18](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m18s) And then you can just change that Area that Is passing the information to the layout because the layout has not got access to this And so you need to pass it through it The values that you want to use in it It will still look at how exactly that is done and possibly I will explain it again but just script Basically renders a layout And this is also how component builder knows it should add a layout to the components layout folder [00:09:51](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m51s) And it looks for a layout with that name in your layouts list So you need to have these layouts set up before hand Before you can include them Into other Views and Tablets And do note that the layout concept and implementation Together with the template is the same in the custom admin View It works exactly the same [00:10:19](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m19s) And just by adding the snippet to the default View Component builder know it needs to add that layout to the component and knows at least Add that layout template to that site View Ok so that is adding Site views Sorry templates and layouts to a site View And Looking at the code seeing ok so Component builder builds these site views because when We look at the default View [00:10:50](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m50s) They are actually Loaded here you see Preacherbox and there is preacherbox This preacher panel preacher panel There is Preacher small And there is preacher small and there is Table grid list there is Table [00:11:10](https://www.youtube.com/watch?v=6VBbi3Rl2eY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m10s) grid and list So that is how you can Add your code into Smaller chunks And next up will look at setting up a template And Making use of this implementation Understanding the difference So That is adding templates and layouts to site views diff --git a/016-Template-Setup.md b/016-Template-Setup.md index 48e5c68..44852d9 100644 --- a/016-Template-Setup.md +++ b/016-Template-Setup.md @@ -1 +1 @@ -In a previous tutorial where's your dad setting up Of Templates and Layout to a site View Now inside of the side view we see that we are loading preacher panel Pictures small Betamox Song Let's go look at how to create those templates I'll go to templates And here they are already created You can click on new to start with a new tablet You could also copy an old one By selecting The temperature Chicken mash And then there is a copy feature here And process And it'll copy it for you Ok so Yeah I have Peter panel open Improve panel it's the same concept it's an HTML area so if I wanna use PHP and Into the PHP And then I can go out again And I can also add this text placeholders Which helps us to insure The text itself Is translatable You can just do your normal English text like that sermon count Sermon total downloads And Important Bola what these things to the language file for you And You don't need to be concerned though at this stage only does Your British English language file And If you need to add more languages You need to look up the documentation of adding languages to a third-party extension And To that same implementation K so here we see that you can add layouts To this template by using any of the Snippets I saw this tablet to this Wealth course to this tempted And you can add other templates to it So you can use templates inside of templates And you could have use layouts as well so more or less the same behaviour as and site for you You also have your snippet box here Which you can make use of adding Script quickly To your page Like that would Fresh We see that that script that I just looked at here In the preacher panel If we go to the code feature and all Is exactly the same script that you seeing here Ok now There are a few Sorry point here missy One of them is a side note is that in your details tab In the template area You're at the bottom You can add JavaScript With your normal script tags So you can just add your JavaScript in there And It will work And be loaded into the page Through the snow snippet That's That's a nice Thing to know As wellness You are still have access as I said before Do all the global This field values Like to see there You can access those What is Lea And that is basically how to set up a template Is the same kind of conventions as setting up a site View Except that this is not the main view it is a tablet used Somewhere in a name and you through Adding this code snippet With Joomla class get Pamphlet Method And Then Basically this Load template Is the method That is being used with that name And then it adds it Do your component site you as well as Ask the code to it So that is a template next up let's look at a layout And really get excited there \ No newline at end of file +In the previous tutorial we where looking at setting up Of Templates and Layout to a site View Now inside of the side view we see that we are loading preacher panel Preachersmall Preacherbox So Let's go look at how to create those templates I'll go to templates [00:00:27](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m27s) And here they are already created You can click on new to start with a new template You could also copy an old one By selecting The template you would like to copy click on batch And then there is a copy feature here And click process And it'll copy it for you Ok so [00:00:49](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m49s) here I have Preacher panel open In Preacher panel it's the same concept it's an HTML area so if I wanna use PHP I need to go Into the PHP And then I can go out again And I can also add this text placeholders Which helps us to ensure The text itself Is translatable You can just do your normal English text like that sermon count [00:01:16](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m16s) Sermon total downloads And Component Builder will add these strings to the language file for you And You don't need to be concerned though at this stage only does Your British English language file And If you need to add more languages You need to look up the documentation of adding languages to a third-party extension [00:01:44](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m44s) And do that same implementation Ok so here we see that you can add layouts To this template by using any of the Snippets to this template And you can add other templates to it So you can use templates inside of templates And you could have use layouts as well so more or less the same behaviour as in site view You also have your snippet box here [00:02:15](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m15s) Which you can make use of adding Script quickly To your page Like that Refresh We see that that script that I just looked at here In the preacher panel If we go to the code preacher panel it Is exactly the same script that you seeing here Ok now [00:02:46](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m46s) There are a few exciting points here One of them is a side note is that in your details tab In the template area You're at the bottom You can add JavaScript With your normal script tags So you can just add your JavaScript in there And [00:03:13](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m13s) It will work And be loaded into the page Through the small snippet That's That's a nice Thing to know As well as You are still have access as I said before to all the global This field values Like you can see there [00:03:35](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m35s) You can access those quite easily And that is basically how to set up a template Is the same kind of conventions as setting up a site View Except that this is not the main view it is a template used Somewhere in a main view through Adding this code snippet With Joomla class get template Method [00:04:02](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m02s) And Then Basically this Load template Is the method That is being used with that name And then it adds it Do your component site view as well as Adds the code to it and everything else So that is a template next up let's look at a layout [00:04:29](https://www.youtube.com/watch?v=khxKeeubhiY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m29s) And it really get excited there diff --git a/017-Layout-Setup.md b/017-Layout-Setup.md index 351d961..01dfbaa 100644 --- a/017-Layout-Setup.md +++ b/017-Layout-Setup.md @@ -1 +1 @@ -Ok we gonna look at setting up layouts now And we'll setting up layouts you have Some nice ways to reuse code across multiple Surf templates for or site views What are the things that I found is that I would like to know which tablet or Not Not really which tampered rather which side view Is actually calling the layout So that all the bases of that I could use Global settings That are related that specific site View So what I've done is I've just in the dynamic get I've added little string Since it's Dynamic at Target only a specific site View So if I was to open Sermon preacher ID Which is primarily gonna be used in Preacher side view If I look at the custom script You see that I added a view key called preacher And by doing that I know ok since this Dynamic get Is only used in the preacher of you That when the layout is called and I'm in my component I'm only passing The item So not the whole list of items but just one item To the layout That helps me to know ok this this specific item is calling from preacher And I can on that Basis You know do certain implementation To ensure that the layout displays in the way I expected So that's just a little heads up on making your layouts even more Dynamic Then going to the template We will open Your The layout Sorry the template that calls the layout so we wanna see that initial setup I'm one of the templates that really Illustrates this very well Is this sermon list So I'm gonna open 7 list Can someone list you see that I'm looping through the items And then I am I think so Some parameters to the item Object One of them is the Proms the other is there I'm taking the description And making sure that it's you notice Cape and no longer than 19 karat 90 characters And then I'm adding that back to the description with Out And I'm done adding that item To the layout Study class renda Layout help J layout helper Render Website list item As the layout name Sorry sermon List item Ok and that basically is gonna populate The Script window List items That is gonna be placed in an unordered list on the Sermon list page Ok so now let's go look at this specific layout Layout helper Sermon list item So In layouts Look for sermon List item there Rio I didn't summon list item You see that I'm using that Global The item that is being passed is placed inside of displayed data I'm so now display data is basically The item object That's inside price Place the parameters in it so I can use different Get method With the specific Global Field name Who said in the components Global settings And since I'm Targeting a specific layout Sorry View I'm using the Vue key Adding it to the string and shaking what is the value for this specific view in the global of the component And On the basis of this I'm actually able to make this view very dynamic And can use it through multiple layouts Based on that View key Now I know if others want to use the layout in their components extending this one it possibly You might work that well But since we are using it for our own component And really far only implementation I don't think that's too big a deal And At the same Token unable to check Simply what is the view key is it preacher series of category in on a basis of that I asked if Questions that have different in Menlyn implementation of of certain Values like series name preacher name And there is another Convention that I think is very worthwhile mentioning here And that is the convention of actually In the template We go back here And we go to custom scripting There is the S View placeholder Su placeholder Will be replaced With the actual views name Necessary using a template here So you see this is a template But this sermon list That one I'm adding that template To multiple site Muse So I'm not just adding it to one side view I'm adding it to multiple site views But since I want this template again to be Dynamic so wherever I add it I I want it to dynamically Add That side views name here And then is as you can see I'm actually asking The global parameters For that site view sermon list style So That means Is grits gonna add For example preacher there or it's gonna add series there or is gonna add category there it's only the Category sermons the style or it's a and let me show you that in the car So now I have category open I've got preacher open as well as series And you can see That I'm adding sermon grade sermon list sermon table to the mall SIM Android sermon list surman table Simon Britz sermon lemon table But if I was to open Summer list in series You see that that name Strange 2 Series If I was gonna open Sermon list in preacher You see it was changed Preacher If I open it in category You see that it actually added category And that means that our Little Place holder Was dynamically updated by component folder on the build And then It behaves as you expect now That you would know How how is it how where is it getting these values If we If we go to the component in the backend And We open it's config File Double scroll down We get you an area called preacher custom config Which is again this is a tub And taps name is preacher I need a time We have these value preacher display Witcher Box can't raise Peter list style And we scroll down we see pictures sermon count Peter email Peter website Temperature sermon display And preach a sermon list display No I would take that sermon Lister spray And then search for it Frosty The file save make it Cap sensitive Reseda that has 6 matches So that means there is 6 places Actually 3 Because one of Each other 6 are in the comments What is category What is series And one is Preacher So those are the different the three different views Let make use of that Siri list style Now the Siri list style Is there an being implemented On the basis of That Dynamic updating of the string here And so it's simply getting the style Then doing a switch statement and setting it accordingly And that is Another nice To have tool To again make a template More Dynamic so you can build a time flirt And you can reuse it in multiple side views Simply with this place holders Which is called site you should have mentioned that hinder templates Explanation But since we only came across it now I mentioning it here Going back to the layouts Your layout Concept is more or less the same as tablets It has a layout area and would you put your script and you can see We using that Placing You can see that if you select certain Dynamic gets wee-wee take the Liberty of showing you that we are starting with this play data But this this Snippets hair Might not correspond what you're doing because you can really pass anything to a layout And we are just assuming that if you are using that then Ima get you possibly passing it in this This way that way So you can't just copy paste this necessarily But at least you can know when you look at a specific Dynamic get here What are the values in it And you know how you can sort of try figure out Which wants to use you This again will be only really Something you need to use If or can use if you are actually aware of our PHP and Everything will Do the implementations here And if you do not if you're not that familiar You don't need loads I mean you can you can build your whole front and writing your side view It might be a long laying free scrap but it still work All the only reason we added layouts and templates is simply for our for Empangeni ANZ And if it's still confusing to you you can even if you skip this whole area For the meantime Beginning layout you have the same concept of adding custom scripting Which will be placed in the head of the file And remember that your Global data store in a data being passed is in Display data And then here again you have your pets HTML area But you can jump into PHP and Check the sum values and then on the basis of that to your certain implementations And That is really setting up a layout Just another note you can actually use a layout in a layout And you can pass it values Has any value you like I realised that this year is maybe not that appropriate So you need to keep a heads up that This doesn't exist on the layout page You need to use the Display data as the global Where's the main Object from which to start your your Your imitation Ok that is layouts thank you for watching \ No newline at end of file +Ok we gonna look at setting up layouts now And we setting up layouts you have Some nice ways to reuse code across multiple templates or or site views and one of the things that I found is that I would like to know which template or Not Not really which tampered rather which side view Is actually calling the layout So that all the bases of that I could use Global settings That are related that specific site View [00:00:31](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m31s) So what I've done is I've just in the dynamic get I've added little string Since each Dynamic get Targets only a specific site View So if I was to open Sermon preacher ID Which is primarily gonna be used in Preacher side view If I look at the custom script You see that I added a view key called preacher And by doing that I know ok since this Dynamic get [00:00:59](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m59s) Is only used in the preacher view That when the layout is called and I'm in my component I'm only passing The item So not the whole list of items but just one item To the layout That helps me to know ok this this specific item is calling from preacher And I can on that Basis You know do certain implementation [00:01:24](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m24s) To ensure that the layout displays in the way I expected So that's just a little heads up on making your layouts even more Dynamic Then going to the template We will open Your The layout Sorry the template that calls the layout so we wanna see that initial setup and one of the templates that really Illustrates this very well [00:01:54](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m54s) Is this sermon list So I'm gonna open sermon list in sermon list you see that I'm looping through the items And then I am adding Some parameters to the item Object One of them is the Params the other is , I'm taking the description And making sure that it's escaped and no longer than 19 characters [00:02:26](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m26s) And then I'm adding that back to the description without the full name And then adding that item To the layout Study class render Layout help J layout helper study class Render [00:02:46](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m46s) sermon List item as the layout name Ok and that basically is gonna populate The Script between List items That is gonna be placed in an unordered list on the Sermon list page Ok so now let's go look at this specific layout Layout helper Sermon list item [00:03:15](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m15s) So In layouts Look for sermon List item there we go and in sermon list item You see that I'm using that Global The item that is being passed is placed inside of displayed data I'm so now display data is basically The item object [00:03:43](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m43s) And since I Placed the parameters in it so I can use different Get method With the specific Global Field name Which is set in the components Global settings And since I'm Targeting a specific layout Sorry View [00:04:02](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m02s) I'm using the view key Adding it to the string and checking what is the value for this specific view in the globals of the component And On the basis of this I'm actually able to make this view very dynamic And can use it through multiple layouts Based on that View key Now I know if others want to use the layout in their components extending this one it possibly will not work that well [00:04:31](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m31s) But since we are using it for our own component And really for only implementation I don't think that's too big a deal And At the same Token I am able to check Simply what is the view key is it preacher series or category and on a basis of that I ask different Questions that have different implementation of certain Values like series name preacher name and category And there is another Convention that I think is very worthwhile mentioning here And that is the convention of actually [00:05:11](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m11s) In the template We go back here And we go to custom scripting There is the S View placeholder S view placeholder Will be replaced With the actual views name Now since we using a template here So you see this is a template [00:05:32](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m32s) But this sermon list That one I'm adding that template To multiple site views So I'm not just adding it to one site view I'm adding it to multiple site views But since I want this template again to be Dynamic so wherever I add it I I want it to dynamically Add That site views name here [00:05:57](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m57s) And then is as you can see I'm actually asking The global parameters For that site view sermon list style So That means Is is going to add For example preacher there or it's gonna add series there or is gonna add category there so it will say category sermons list style let me show you that in the code So now I have category open I've got preacher open as well as series [00:06:30](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m30s) And you can see That I'm adding sermon grit sermon list sermon table to them all sermon grid sermon list sermon table Sermon grit sermon list sermon table But if I was to open Sermon list in series You see that that name was changed to Series If I was gonna open Sermon list in preacher [00:06:53](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m53s) You see it was changed Preacher If I open it in category You see that it actually added category And that means that our Little Place holder Was dynamically updated by component Builder on the build And then It behaves as you expect now That you would know where is it getting these values [00:07:20](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m20s) If we If we go to the component in the backend And We open it's config File Scroll down We get you an area called preacher custom config Which is again this is a tab And tab's name is preacher and in this tab We have these value preacher display [00:07:48](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m48s) preacherbox contrast preacher list style And we scroll down we see preachers sermon count preacher email Preacher website and then preacher sermon display And preacher a sermon list display Now if we take that sermon List display And then search for it across The file say make it [00:08:13](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m13s) Cap sensitive we see that it has 6 matches So that means there is 6 places Actually 3 Because one of Each other 6 are in the comments one is category one is series And one is Preacher [00:08:33](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m33s) So those are the different the three different views Let make use of that series list style Now the Series list style Is then being implemented On the basis of That Dynamic updating of the string here And so it's simply getting the style Then doing a switch that when setting it accordingly And that is Another nice [00:08:57](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m57s) To have tool To again make a template More Dynamic so you can build a template And you can reuse it in multiple site views Simply with this place holders Which is called site view ,I should have mentioned that in the templates Explanation But since we only came across it now I mentioning it here Going back to the layouts Your layout [00:09:27](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m27s) Concept is more or less the same as templates It has a layout area in which you put your script and here you can see We are using that key replacing You can see that if you select certain Dynamic gets we are taking Liberty of showing you that we are starting with display data But this this Snippets here Might not correspond what you're doing because you can really pass anything to a layout And we are just assuming that if you're using that dynamic get you possibly passing it in this [00:10:06](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m06s) This way or that way So you can't just copy paste this necessarily But at least you can know when you look at a specific Dynamic get here What are the values in it And you know how you can sort of try figure out Which ones to use here This again will be only really Something you need to use If or can use if you are actually aware of our PHP and Everything will [00:10:34](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m34s) Do the implementations here And if you do not if you're not that familiar You don't need layouts I mean you can you can build your whole front-end right in your site view It might be a long lengthy script but it still work All the only reason we added layouts and templates is simply for our own convenience And if it's little confusing to you can even if you skip this whole area For the meantime Beginning layouts you have the same concept of adding custom scripting Which will be placed in the head of the file And remember that your Global data or in the data being passed is in [00:11:14](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m14s) Display data And then here again you have your HTML area But you can jump into PHP and Check the sum values and then on the basis of that to your certain implementations And That is really setting up a layout Just another note you can actually use a layout in a layout And you can pass it values as any value you like [00:11:42](https://www.youtube.com/watch?v=52OLSZio0F8&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m42s) I realized that this here is maybe not that appropriate So you need to keep a heads up that This doesn't exist on the layout page You need to use the Display data as the global or as the main Object from which to start Your implementation OK that is layouts thank you for watching diff --git a/018-Custom-Admin-Views.md b/018-Custom-Admin-Views.md index 0910c5a..b029ef2 100644 --- a/018-Custom-Admin-Views.md +++ b/018-Custom-Admin-Views.md @@ -1 +1 @@ -I need to have a quick look at custom admin views They do have some nice ways of doing things Very similar to sight views But some Aspects and adding a two component builder is different And so in the next video We will look at adding site fuses well as component Custom admin Views To the component The reason I didn't speak much about the custom admin user simply because Summon distributor is not Using Custom admin views yet Where is I have another component here I can use as a example Called component It's cold Waited Sia Cost-benefit projection It's a It's a tool that is used to show companies the cost benefits Of intervening on certain diseases and causes in the company Anyway In it we have what we call a company results And combined results Respectively used To display custom data In the back in of the component 2 to the 7 different The people who has permissions to view those data Now in the component itself If we clicked on companies You see there is an icon on the knees each of these Names of the Companies And there is a new button here the top called combine Results Now This button as well as those buttons Are dynamically added by component Builder And in the next week tomorrow I'll show you exactly how that is done What I want to show you here Simply how a custom admin view will look So I'm gonna click on one of these these out this is all dumb information so So you'll see me Let's open this one Now basically you have this big area where you could put a lot of HTML and PHP And you have some custom buttons that you can add on show you that And then So all of this in this white area is simply done in the custom View So if I was to click around I've got a menu here at the side All of this is done inside of the custom Area Of the component Which is the other Custom admin View And That is basically how it will look Different Value sets And you can from here and an edit button Since we've linked it to a specific client Our company or one item in that list We can actually click on edit From here we are riding to the company's data And edit it And What is nice if we were to click close the year You actually take us back to that Exact result page And you can then go and look at The implementation What you've done Is it that is just simply showing you how a custom at nephew could look Let's go back to the company's list or we could go back to dashboard Download component Builder And we looked at discomfort company results we open at 1 And here is older PHP and HTML On my page Doing all the work Adolf course As you might expect I'm loading in a lot of templates here So I'm loading in templates Directly From here And Then I have a custom button area Where I can I can say yes I want to add custom buttons Then I click on Custom buttons here and you see I have Icons I can select Cornet The name of the button And a controller method Which I would like to use to actually make the button work so in this one I'm saying go to company This one is edit company And So I should say Is is this gonna What What kind of Target are we think looking at Is this a A single a list or both And you said that respectively And Then you click save this only saves it to the form not to the database We should have made that done But this is the tumor last way up in committing it And now you have to add In the PHP controller method Add scripting 2 respectively implement the buttons click Method You can also do the model So in the controller You can add script and then in the model Add scripting which is called from the controller if you want to separate your code a bit In the in the and if you're not gonna be adding Any script to the model Just add 9 Movies to Spaces in front of a wise it might scream at you that you Script there And as you can see the go to companies as simply Taking me back to the company's View Where is the Edit company Implements the German horse convention of opening an item to edit it By the correct channels so this is just At work here And we are checking a token and all that So do Miller Bodybuilders sets of all the tokens and everything So you The snippet you can reuse for your purposes if you want And obviously we have an area for Preston scripting and as you can expect There's a lot of practice custom scripting Going on In in that View And it has its respective places again if you wanna know where what's happening at some snippet here Compiler components search for that snippet and you'll see where this comes up If you not certain by the naming conventions refused And that is really how you setup a Hey admin custom admin View To look at the other one Let's close out here That is the combined results View Now the combined results is this one up here if you click it now I will tell you this we need to have some item selector And then you select the items and click There again And it will do a combined resolve Taking both companies And Adding it's data together And giving you a nice layout structure Of office that assets Ok That is really the combined concept If we go back To the limitation of it It looks very similar is the other Again just a lot of HTML PHP here And then Also some Preston button is again just going back to companies And it's really just same implementation B card companies go back single And then some custom scripting And that's how I set up both of those custom views What simply Adding that the data here And then making use of the templates as well as layout implementation in both of these So you can set up layouts and templates and Only use them and side views But you can also use them in at the views Now In our next tutorial We look at how to add side views and admin views to your component Since there are some differences And you need to be aware of them \ No newline at end of file +We need to have a quick look at custom admin views [00:00:04](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m04s) They do have some nice ways of doing things Very similar to sight views But some Aspects and adding it to component builder is different And so in the next video We will look at adding site views as well as component Custom admin Views To the component The reason I didn't speak much about the custom admin views is simply because Summon distributor is not [00:00:33](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m33s) Using Custom admin views yet Where is I have another component here I can use as a example Called component Is called Cost-benefit projection It's a It's a tool that is used to show companies the cost benefits Of intervening on certain diseases and causes in the company Anyway [00:01:04](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m04s) In it we have what we call a company results And combined results Respectively used To display custom data In the back end of the component to the certain different people who has permission to view those data Now in the component itself If we clicked on companies You would see there is an icon underneath each of these [00:01:36](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m36s) Names of the Companies And there is a new button here the top called combine Results Now This button as well as those buttons Are dynamically added by component Builder And in the next tutorial I'll show you exactly how that is done What I want to show you here is Simply how a custom admin view will look So I'm gonna click on one of these, this is all dumb information so [00:02:07](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m07s) So you'll see me Let's open this one Now basically you have this big area where you could put a lot of HTML and PHP And you have some custom buttons that you can add on show you that And then So all of this in this white area is simply done in the custom View So if I was to click around I've got a menu here at the side All of this is done inside of the custom Area [00:02:44](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m44s) Of the component Which is now the Custom admin View And That is basically how it will look It has Different Value sets And you can from here add an edit button Since we've linked it to a specific client Or company or one item in that list [00:03:10](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m10s) We can actually click on edit From here we go right into the company's data And edit it And What is nice if we were to click close here You actually take us back to that Exact result page And you can then go and look at The implementation What you've done [00:03:35](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m35s) Is it that is just simply showing you how a custom admin view could look Let's go back to the company's list or we could go back to dashboard now look at component Builder And we looked at this company results we open that one And here is all PHP and HTML On my page Doing all the work And of course As you might expect I'm loading in a lot of templates here [00:04:05](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m05s) So I'm loading in templates Directly From here And Then I have a custom button area Where I can I can say yes I want to add custom buttons Then I click on Custom buttons here and you see I have Icons I can select Call it [00:04:25](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m25s) The name of the button And a controller method Which I would like to use to actually make the button work so in this one I'm saying go to company This one is edit company And here I should say Is this gonna What kind of Target are we think looking at Is this a A single a list or both [00:04:52](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m52s) And you said that respectively And Then you click save this only saves it to the form not to the database We should have made that done But this is the Joomla's way of implementing it And now you have to add In the PHP controller method Add scripting to respectively implement the buttons click Method [00:05:16](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m16s) You can also to the model So in the controller You can add script and then in the model Add scripting which is called from the controller if you want to separate your code a bit In the in the and if you're not gonna be adding Any script to the model Just add none with this two Spaces in front otherwise it might scream at you that you did not add Script there And as you can see the go to companies is simply [00:05:47](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m47s) Take me back to the company's View Where as the Edit company Implements the Joomla's convention of opening an item to edit it By the correct channels so this is just Joomla knowledge At work here And we are checking a token and all that So do Component Builders sets of all the tokens and everything So you [00:06:13](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m13s) The snippet you can reuse for your purposes if you want And obviously we have an area for custom scripting and as you can expect There's a lot of custom scripting Going on In in that View And it has its respective places again if you wanna know where what's happening at some snippet here Compiler components search for that snippet and you'll see where this comes up If you're not certain by the naming conventions we have used And that is really how you setup a admin custom admin View [00:06:51](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m51s) To look at the other one Let's close out here That is the combined results View Now the combined results is this one up here if you click it now I will tell you this in we need to have some item selected And then you select the items and click There again And it will do a combined resolve Taking both companies And Adding it's data together [00:07:16](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m16s) And giving you a nice layout structure Of it's data sets Ok That is really the combined concept If we go back To the implementation of it It looks very similar as the other Again just a lot of HTML PHP here And then Also some custom button is again just going back to companies [00:07:41](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m41s) And it's really just same implementation V card companies go back single And then some custom scripting And that's how I set up both of those custom views quite simply Adding that the data here And then making use of the templates as well as layout implementation in both of these So you can set up layouts and templates and Only use them and site views But you can also use them in admin views Now [00:08:11](https://www.youtube.com/watch?v=gtdQ1lwB9ds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m11s) In our next tutorial We look at how to add site views and admin views to your component Since there are some differences And you need to be aware of them diff --git a/019-Adding-Site-Views-to-a-Component.md b/019-Adding-Site-Views-to-a-Component.md index 850cdd0..6c1ea74 100644 --- a/019-Adding-Site-Views-to-a-Component.md +++ b/019-Adding-Site-Views-to-a-Component.md @@ -1 +1 @@ -Hi Now let's look at adding admin views and side views to component Builders component And looking at all the different switches and the nice features that we have there So first login here They may have component builder open on the component burger And then we will go to Finance And we will open Some industry Tributo And then go to settings And then settings you see there is a place for admin views we're ready illustrated adding the admin views Then there's custom admin views and there are side views I do wanna look at those now so I'll just click on add custom admin View There isn't any added to this component because Sorry 7 distributor does not have Customer reviews But I'll illustrate it in another component for you Land site views It has quite a few You might sometimes open it and see That some of the buttons are not selected Although you know you selected it previously and saved You know now doesn't show This is a glitch and In the July Zone JavaScript for whatever That is causing this and so the only way I have found to solve it as yet is to send Open Like for now you see the app and do the same So if you close it and open it again It has it all selected This is a heads up keep a look out for this because if you make changes and save it with those Your build will Not include those values Since it will be stored is now And Yeah you might get unexpected results So voice make sure that your old pics are Place that just a heads up Something I can change the state Laughing Repeatable fields Ok so if we go to side view And we just Closer again Open it again You see everything is selected You see that it has 123 Four options here Obviously here you select the side views Just add as many as you like Then add menu means that this side view will be added to the admin you Aspect of Joomla Erase you go to create menu And then you go to admin you Item Then there is a select Type and when you click on select type then there is this list Articles and whatever I do say yes there you'll create a XML file Which allows Similar to notice that your component needs to be in the list And the XML file will look at in the moment But that's just do know that's what this Switch here admin you does Add metadata means that Page Is gonna actually make use of the Net the metadata That is being passed to it Usually that means that in your model you've set up your data So that there is a Metadata in the items array or in the Yeah in the item array or in diverse array Either Bye-bye The global setting or Why are the actual item So this is meta implementation You even if you said yes yeah And you did not Set up the data in the in the model Correctly it won't work and the way for you to look at that is obviously clicky is here try it The best setting up the data the model then compile and go look in the view Data SIM Albert php file to see how it grabs the metadata because it will still add The Script that is needed to load the metadata into the You the document But if it doesn't Grab it correctly Then you'd see that as well Ok then Whether you can only have one default View So don't like more than one too yes What to do if your view effectively is is that sometimes when You make a change and the system doesn't know where you wanna go It actually throws you back to the default View Now that before view could I maybe your sites default view being home page Or it can be if your in this component it could be for example on this one it's preachers So Let's say some of these views you you said that they don't let us use her Public user don't have access for example 2 sermon then if they try to access that The system will throw them back to the default view and give him a message saying you don't have access Answer that's what the default View Primarily used for at the moment But I can see it being coming even more useful as we continue to improve in component Builder Then add access It's basically making sure that a Sydney user has the specific access rights You see in a in an item you can set the access rights As well as the view rights So it's multiple implementations Different department Asians one has access groups the other one is just groups And so you can tweak whether you want access on this specific View to be monitored And If you take that N Component building will ensure that the access Table is there Ok So that is adding a side view 2 Do your component Obviously after having created the side view Then this is how you can add it to check it See how it works Ok now next up we gonna look at Custom admin views being added Thank you for watching \ No newline at end of file +Hi Now let's look at adding admin views and site views to component Builders component And looking at all the different switches and the nice features that we have there installed for you So we first login here Then we have component builder open on the component builder And then we will go to [00:00:25](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m25s) Let's see components And we will open Sermon Distributor And then go to settings And in settings you see there is a place for admin views we're ready illustrated adding the admin views Then there's custom admin views and their site views And we wanna look at those now so I'll just click on add custom admin View There isn't any added to this component because component builder Sorry [00:01:01](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m01s) sermon distributor does not have a Custom admin views But I'll illustrate it in another component for you Then site views It has quite a few You might sometimes open it and see That some of the buttons are not selected Although you know you selected it previously and saved You know now doesn't show This is a glitch and [00:01:25](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m25s) In the Joomla's own JavaScript or whatever That is causing this and so the only way I have found to solve it as yet is to simply re-open Like for now you see the admin view that's same issue So if you close it and open it again It has it all selected This is a heads up keep a look out for this because if you make changes and save it with those buttons unticked Your build will [00:01:56](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m56s) Not include those values Since it will be stored as null And Yeah you might get unexpected results So always make sure that your old ticks are All in place that just a heads up Not really something I can change at this stage it is a Joomla thing of the repeatable fields Ok so if we go to site view [00:02:21](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m21s) And we just Close it again and Open it again You see everything is selected You see that it has 123 4 options here Obviously here you select the site views Just add as many as you like Then add menu means that this site view will be added to the add menu Aspect of Joomla [00:02:46](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m46s) You know If you go to create menu And then you go to add menu Item Then there is a select Type and when you click on select type then there is this list Articles and whatever Now if you say yes there you'll create a XML file Which allows Joomla to notice that your component needs to be in the list And the XML file we will look at in the moment [00:03:12](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m12s) But that's just you know that's what this Switch here add menu does Add metadata means that this page Is gonna actually make use of the Net the metadata That is being passed to it Usually that means that in your model you've set up your data So that there is a Metadata in the items array or in the In the item array or in the this array [00:03:47](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m47s) Either By by The global setting or By the the actual item So this is meta implementation You even if you set yes here And you did not Set up the data in the in the model Correctly it won't work and the way for you to look at that is obviously click yes here try your best setting up the data the model then compile and go look in the view .HTML.PHP file to see how it grabs the meta data because it will still add [00:04:22](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m22s) The Script that is needed to load the metadata into the the document But if it doesn't Grab it correctly Then you'd see that as well Ok then Whether you can only have one default View So don't click more than one to yes but what the default view effectively is is that sometimes when You make a change and the system doesn't know where you wanna go [00:04:53](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m53s) It actually throws you back to the default View Know that default view could either be your sights default view being home page Or it can be if your in this component it could be for example on this one it's preachers So Let's say some of these views you set that they don't user a Public user don't have access for example to sermon then if they try to access that page The system will throw them back to the default view and give him a message saying you don't have access And so that's what the default View Primarily used for at the moment But I can see it being coming even more useful as we continue to improve in component Builder [00:05:37](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m37s) Then add access It's basically making sure that a Sydney user has the specific access rights You see in a in an item you can set the access rights As well as the view rights So it's multiple implementations Different implementations one's access groups the other one is just groups And so you can tweak whether you want access on this specific View to be monitored And If you tick that Then [00:06:10](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m10s) Component building will ensure that the access Table is there Ok So that is adding a site view to to your component Obviously after having created the site view Then this is how you can add it to check it See how it works Ok now next up we gonna look at [00:06:32](https://www.youtube.com/watch?v=zZ_HJeYL8ps&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m32s) Custom admin views being added Thank you for watching diff --git a/020-Adding-Custom-Admin-Views-to-a-Component.md b/020-Adding-Custom-Admin-Views-to-a-Component.md index 447b61d..747a7d7 100644 --- a/020-Adding-Custom-Admin-Views-to-a-Component.md +++ b/020-Adding-Custom-Admin-Views-to-a-Component.md @@ -1 +1 @@ -Hi Now we'll look at adding custom attribute to a component You make use of cost-benefit projection As our component And then Go to settings And then we'll go to custom admin views And we'll see Close that The game I will see you there has to custom admin views at it Now It is more switches than the site view because of its implementation being more than I make You can choose an icon Because in the backend You possibly I want to have an icon when your on that page The right Page Then you can decide with this should show in the main menu Negative you should show in the main menu the main menu Is a menu that drops down out of Zuma last menu item list Right And then the dashboard Which is that Dashboard we go to every time when we start with a component that All the icons are shown up Then the submenu is the one on the on the left Which you see when you are in a view So these are all placements where you can possibly have This Custom View Now if you remember The company Results we didn't add 2 Any of the Views individually we added 2 items so that's why all of these are set to know And That means we are at with targeting an item In a view Answer all we need to do a select the view which we are dieting Which is company And we say ok Does metadata yes or no And it has access yes or no And That's basically it To ensure that Targets the correct view is simply by selecting company here If I close this from Ormonde And then open that component So you what is happened with the settings Do you have a component open If I was to open Companies You see that has a button here 4 company result Now If you remember when we set up this custom admin View We we ensure that We are targeting an item ID And by selecting company we are saying we are talking to this company's item ID And that is what makes it work And then we said we want to see a chart I'm so if we look at these this little charts The icon itself We take on it We see the custom view shows up and that icon shows up next to it And all works well We also see that there is a combined results Button showing up here in the toolbar And that is because combined results Which selected we want carts To be the icon And we said List of records is set to yes And has metadata Hyundai success and also company And so D selections before Is only really necessary when you select main menu and submenu Because anyone to say before what Item you want this Menu to be created Now we selected dashboard list of Records And because of that Places that in here And you need to select the records that you want to look at And then you can complete on the combined results I'll grab those ID and Since we are modelling a data in the controller and the model It gives back to the view these results Through the custom implementation be done So Just a quick refresher If we go to component Builder And customer reviews Open company results We see that in the custom button We added the PHP You also added the button Explain two Two component builder what we what kind of buttons we want So we said we are struggling a single item is see those Edit company go to company logos does buttons R Actually related to Going inside of the And Then if you come out of this We saw that even and combined results We also added buttons But again those buttons the card companies go to companies Which corresponds to this controller And if we go to the view itself And we see that that's not responding to this button but actually To the buttons inside called companies and edit Those that's the buttons you were building in the custom View Where is the buttons we are looking at in here Is related to opening the custom view itself So That is too quick Refresher Same goes with the combined results Combined results is the button that you are setting up here Where is the other buttons are once you have combined them And you've take combined results You see that it adds two buttons dashboard and companies and those two buttons with setup in the view it Self So that you can know and sort of Understand what Area controls what set of buttons This area controls the buttons before open Bring the view where is interview the buttons your setting up there is 4 when you have opened the view Ok so that is setting up a custom admin View Do your component And some of the switches obviously again If anything is unclear or you not exactly sure You can all this Lee come on on and do anything So simply go change it to what you would think should work and compile a component and go look in the car And see what has been done and look and the Uno car Interface See what is being displayed And play around with it until you get that what you expected Just a quick heads up this Or ordering before is only compulsory when Actually selecting at main menu or at sub menu And if you're even use those It means That If If you got your component You have the icons area and here in the top you have your your Your Main menu items And once you've opened A When you're here on the right you have set menu So this is main menu this is dash list Robust list is that one which goes to the top Of the Of the components Toolbar Submenu is the one here on the So if if this Custom admin view is simply needs to be placed in the submenu in his lips on it's own it's not related to any Dataset Then you can use the submenu method if you only 18 Featured in the main menu these are all the features Where is the dashboard List record Feature Helps you to sort of Link to a specific set Of Data data structures like Like this one does So you can select these ideas and when when you click On this combined results the ideas of the selected items guess get passed 2 to the controller And if I go back to do that Show you that how we use it Combined results Custom button You basically see that Go to companies Is not in here So we see while using the main get called company's data get list query So let's go look at that data query I think that's we will find The use of the implementation of those ideas So we see we are basically reaching into the Input error Erase object here We getting CID Selected ideas And we saying It can be a CMD And Then we are exploding it and We are making sure that intervals And we placing it in our teas And so this actually gets the value From the post Object And Places that into ideas and here we do some validation To ensure that the person who's trying to access 2 Day Diet To do it And once we faster We basically use those ideas 2 2 to get The data so in in the filter We use ID is And check weather All the ID is Are in a ID and that in the code Basically if you look at the code So on the models combine results We see that it uses our checking method here Later You're down here It takes the ID is Spitz in array check service in array then implodes it And text where the roots You know only gets those ID That's how we we filtered the dataset With the results After selection And So That's just a little bit looking into the back end On how to make use of those Features and again as you can see it's some custom scripting we added to the dynamic get method To take those ideas and to use them In the way we intend Are you you can ignore them But here is the way that I implemented it If you wanna drop that down pause the video A copy of this area here Think would be the only part at Useful to your purpose And then you can use the ID is in your code As you please And know that this PHP as you saw In the code It runs before the get methods So it basically is a filtering option So then this query starts Then that code we wrote Is entered in here and then the rest of the code which Spell by component Builder Is being done and you can use a filter option with whatever you Collected up here Ok so that Looking into adding custom admin views to component Builder And just showing you again the tremendous Leverage and Design choices you can make In ensuring that your component is dynamic And Get sort of breaks out of the mould So that you can achieve Nice Complex components Write inside component Builder Thank you for watching \ No newline at end of file +Hi Now we'll look at adding custom admin view to a component We'll make use of cost-benefit projection As our component And then we Go to settings And then we'll go to custom admin views And we'll see oh let's just [00:00:20](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m20s) Close that open again Now will see you there has to custom admin views added Now It has more switches than the site view because of its implementation being more dynamic You can choose an icon Because in the backend You possibly want to have an icon when your on that page on the right [00:00:45](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m45s) of the page Then you can decide where this should show in the main menu Selective if you should show in the main menu the main menu Is a menu that drops down out of Joomla's menu item list Right And then the dashboard Which is that Dashboard we go to every time when we start with a component that All the icons are showing up Then the submenu is the one on the on the left [00:01:14](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m14s) Which you see when you are in a view So these are all placements where you can possibly add This Custom View Now if you remember The company Results we didn't add to Any of the Views individually we added to items so that's why all of these are set to no [00:01:41](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m41s) And That means we are targeting an item In a view And so all we need to do a select the view which we are targeting Which is company And we say ok It has metadata yes or no And it has access yes or no And That's basically it [00:02:02](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m02s) To ensure that Targets the correct view is simply by selecting company here If I close this for a moment And then open that component Show you what is happened with the settings So here we have that component open If I was to open Companies over here You see that has a button here for company result [00:02:27](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m27s) Now If you remember when we set up this custom admin View We we ensured that We are targeting an item ID And by selecting company we are saying we are targeting this company's item ID And that is what makes it work And then we said we want to see a chart I'm so if we look at these this little charts what shows up in [00:02:55](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m55s) The icon itself We click on it We see the custom view shows up and that icon shows up next to it And all works well We also see that there is a combined results Button showing up here in the toolbar And that is because combined results Which selected we want cogs To be the icon And we set [00:03:25](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m25s) List of records is set to yes And has metadata And has access and also company And so These selections before Is only really necessary when you select main menu and submenu Because then you want to say before what Item you want this Menu to be created Now we selected dashboard list of Records [00:03:55](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m55s) And because of that It places that in here And you need to select the records that you want to look at And then you can click on the combined results And they'll grab those IDs and Since we are modelling a data in the controller and the model It gives back to the view these results Through the custom implementation we've done So Just a quick refresher [00:04:25](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m25s) If we go to component Builder And custom admin views and we open company results We see that in the custom button We added the PHP We also added the button We explain to To component builder what we what kind of buttons we want So we set we are targeting a single item you see those Edit company go to company now those buttons [00:04:55](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m55s) are Actually related to Going inside of the view And Then if you come out of this We saw that even and combined results We also added buttons But again those buttons Vcard companies gotocompanies corresponds to this controller And if we go to the view itself [00:05:27](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m27s) And we'll see that that's not responding to this button but actually To the buttons inside called companies and edit Those that's the buttons you were building in the custom View Where is the buttons we are looking at in here Is related to opening the custom view itself So That is just a quick Refresher Same goes with the combined results The combined results is the button that you are setting up here [00:06:02](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m02s) Where is the other buttons are once you have combined them And you've click combined results You see that it adds two buttons dashboard and companies and those two buttons was set up in the view it Self So that you can know and sort of Understand what Area controls what set of buttons This area controls the buttons before opening the view where is in the view the buttons your setting up there is for when you have opened the view Ok so that is setting up a custom admin View [00:06:38](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m38s) To your component And some of the switches obviously again If anything is unclear or you not exactly sure You can obviously come on and do anything So simply go change it to what you would think should work and compile a component and go look in the code And see what has been done and look and the Joomla if the face See what is being displayed And play around with it until you get that what you expected [00:07:10](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m10s) Just a quick heads up this ordering before is only compulsory when Actually selecting add to main menu or add sub menu And if you use those It means That If If you go to your component You have the icons area and here in the top you have your your Your [00:07:34](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m34s) Main menu items And once you've opened A Then you're here on the right you have sub menu So this is main menu this is dash list Now dash list is that one which goes to the top Of the Of the components Toolbar and then submenu is the one here on the side [00:07:58](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m58s) So if if this Custom admin view is simply needs to be placed in the submenu and its lives on its own it's not related to any other Dataset Then you can use the submenu method if you only wanna Featured in the main menu these are all the features that you could set Where is the dashboard List record Feature Helps you to sort of Link it to a specific set [00:08:25](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m25s) Of Data data structures like Like this one does So you can select these ids and when when you click On this combined results the ids of the selected items gets passed to the controller And if I go back to that quickly Show you that how we use it Combined results Custom button [00:08:54](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m54s) You basically see that Go to companies Is not in here So we see we're using the main get called companies data get list query So let's go look at that data query I think that's we will find The use of the implementation of those ids So we see we are basically reaching into the Input array Array sorry object here We getting CID [00:09:35](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m35s) Selected ids And we saying It can be SMD And Then we are exploding it and We are making sure it is intervals And we placing it in ids And so this actually gets the value From the post Object [00:09:59](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m59s) And Places that into ids and here we do some validation To ensure that the person who's trying to access the data has actualy the right To do it And once we past that We basically use those ids to to get The data so in in the filter [00:10:20](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m20s) We use ids And check whether All the IDs Are in a ID and that in the code Basically if you look at the code It's on the models combine results We see that it uses our checking method here Later down here It checks the IDs [00:10:45](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m45s) Puts it array check if it's in array then implodes it And checks whether it is You know only gets those IDs That's how we we filtered the dataset With the results of the selection And So That's just a little bit looking into the backend On how to make use of those [00:11:07](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m07s) Features and again as you can see it's some custom scripting we added to the dynamic get method To take those ids and to use them In the way we intend now you you can ignore them But here is the way that I implemented it If you wanna drop that down pause the video And copy some of this area here Think would be the only part that will be Useful to your purpose And then you can use the IDs in your code [00:11:39](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m39s) As you please And know that this PHP as you saw In the code It runs before the get methods So it basically is a filtering option as you see there So then this query starts Then that code be wrote Is entered in here and then the rest of the code which is build by component Builder Is being done and you can use a filter option with whatever you [00:12:07](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m07s) Collected up here Ok so that's Looking into adding custom admin views to component Builder And just showing you again the tremendous Leverage and Design choices you can make In ensuring that your component is dynamic And Get sort of breaks out of the mould So that you can achieve [00:12:32](https://www.youtube.com/watch?v=sPEkbuNXwds&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m32s) Nice Complex components Write inside component Builder Thank you for watching diff --git a/021-Tweaking-MySQL-Demo-Data.md b/021-Tweaking-MySQL-Demo-Data.md index 64cf5c3..9716b4f 100644 --- a/021-Tweaking-MySQL-Demo-Data.md +++ b/021-Tweaking-MySQL-Demo-Data.md @@ -1 +1 @@ -Hi You wanna look at MySQL tweaking In the component area It's open a component go to settings And then there is MySQL tweak What is this able to do is if you have multiple versions of a component And Barclay you have demo that relates to a certain version of it but and Implementation of Items And In another version you don't want those items included We have this MySQL tweak area Where you can actually First yield select that specific View That you Want to tweak And do note that you can only make use of this feature If you're actually using the This Area Where we actually add Database Connection between The View Dummy data And view itself So let me quickly show you what I mean So you're I have opened fuel types which is one of component Builders own views And I have a connected To my Database Through this MySQL I added yes I selected table And then I selected The field types In my Database And basically Just let it all be taken into the build file And Now Since you know that some of the versions that we distribute with component Builder Don't have all the field types in it And it's a limited To only a certain few field types So to show you how that was done I will go back to That tweaking Feature So here I have component builder open And if I go to settings And I go to District feature It's you that I have Added Values here Uncertain of thems like custom admin I said no don't Include non no Add MySQL to view Table if set in the view So if the if the interview if you have the MySQL select ID Are you come through this feature Control which items actual ID is Should be Included like in the admin review I'm only including these two ideas From my Database And so it's the ideas in the admin table admin view Table And I'm also saying that it's ID based You have the future of Just including all And then you have it based Saota A way to say what you want here You can also if you are using ID is between that's a 1 and 50 Then you can use this arrow Notation with an equals Open open bracket there Do you know data between 1 and like here 500 You want to add And You can actually Do it quite simply with one two three and then Comma Ok here I'm explaining it nicely it says 1234 or 124 And then you can put a comma and then 20 And then and then 40 to 90 so you can in the same comma Delimited list You can add this notation To show that we need to include 1 to 4 And is immediately after it Add 20 and we will Grab all that IBS and Impact in limonade any other ideas and only use the ones that you have Actually notated So here is another Good example Using 14 2399 So goes on in here We going from 597 to 604 82 - 680 4 And it's in the same comma delimited list And we saying is it based and we say include these So that is That is partly what I'm having why why this is hear what it can be used for So you not including dummy data or example data in your component build structure Then this area is really redundant and you don't need to even use it You can just ignore it system ignores it as if it doesn't exist If there isn't any Data selected Well that is some tweaking feature In component Builders component area That helps you Manage your Dummy data between Versions in In your applications \ No newline at end of file +Hi We wanna look at MySQL tweaking In the component area It's open a component go to settings And then there is MySQL tweak What is this able to do is if you have multiple versions of a component [00:00:18](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m18s) And Partly you have demo that relates to a certain version of it and Implementation of Items And In another version you don't want those items that you know included We have this MySQL tweak area Where you can actually First you've select that specific View That you [00:00:43](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m43s) Want to tweak And do note that you can only make use of this feature If you're actually using the This Area Where we actually add Database Connection between The View Dummy data And view itself So let me quickly show you what I mean [00:01:07](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m07s) So here I have opened field types which is one of component Builders own views And I have it connected To my Database Through this MySQL I added yes I selected table And then I selected The field types In my Database And basically Just let it all be taken into the build file And [00:01:33](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m33s) Now Since you know that some of the versions that we distribute with component Builder Doesn't have all the field types in it And it's a limited To only a certain few field types So to show you how that was done I will go back to That tweaking Feature So here I have component builder open And if I go to settings [00:01:57](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m57s) And I go to this tweak feature It's see that I have Added Values here and certain of them like custom admin I said no don't Include non no Add MySQL to view Table if set in the view [00:02:19](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m19s) So if the if the in the view if you have the MySQL selected you can through this feature Control which items actual IDs Should be Included like in the admin view I'm only including these two ids From my Database And so it's the ids in the admin table admin view Table And I'm also saying that it's ID based You have the feature of [00:02:46](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m46s) Just including all And then you have id based So it's a A way to say what you want here You can also if you are using ids between let say 1 and 50 Then you can use this arrow Notation with an equals Open open bracket there to know take between 1 and like here 500 You want to add [00:03:15](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m15s) And You can actually Do it quite simply with one two three and then Comma Ok here I'm explaining it nicely it says 1234 or 124 And then you can put a comma and then 20 And then another comma and then 40 to 90 so you can in the same comma Delimited list You can add this notation [00:03:41](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m41s) To show that we need to include 1 to 4 And is immediately after it Add 20 and we will Grab all that Ids and In fact it illuminate any other ids and only use the ones that you have Actually notated So here is another Good example of Using 1 4 2399 [00:04:08](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m08s) So goes on in here We going from 597 to 604 682 - 68 4 And it's in the same comma delimited list And we saying is it's id based and we say include these So that is That is partly what I'm having why why this is here what it can be used for So you not including dummy data or example data in your component build structure Then this area is really redundant and you don't need to even use it all [00:04:46](https://www.youtube.com/watch?v=wkSLZUEN-RE&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m46s) You can just ignore it system ignores it as if it doesn't exist If there isn't any Data selected Well that is some tweaking feature In component Builders component area That helps you Manage your Dummy data between Versions in In your applications Thank you for watching. diff --git a/022-Global-Settings-of-Component-Builder.md b/022-Global-Settings-of-Component-Builder.md index 1a09e22..de08406 100644 --- a/022-Global-Settings-of-Component-Builder.md +++ b/022-Global-Settings-of-Component-Builder.md @@ -1 +1 @@ -Hi They would like to look At Component builders Options Or what we would call Global settings Night possibly through the Tutorials have From time to time touched on certain areas Now we would like to give them all Precise look at The options area of Builder It's accessible through the options button And if you have to Permissions you will see this button Open it Permissions By that I mean certain users may not see this button if they are in it A different group than that Global admin Straighter And You can change those promotional structure is as needed So you click on options All open The component builder configurations or global settings as it's often referred to Your options or settings And there are number of switches here that is worth knowing about These areas here you could add your own details if you would like to Ever displayed In the components front-end Then there is a switch here checking timer We build into component dollar the option to check in the items Every so often And here you can check If it has been locked out for 5 hours it brings it back in 12 hours 24 hours Every second day once a week or never So the check-in timer is set here And you can change it to whatever is best suited to your system Done in Egypt enable in virgin Version control Is what this area is all about You can disable it by simply saying no Or enable it by yes And then you can say how many Virgins should be kept of the item If 0 all all versions will be saved so 0 means Everything And so you can Limited To sort of prevent your system from Are being overloaded with data Then You have many fights as Feature Basically all the JSE that is being built In a component Builder Can be Changed to be minified So Why urine production You can export your components Without minifying with j s In the files and in the photos of the of the documents But the moment you feel that you've reached The place where medication is necessary and you want to use it Then you'd simply trip the switch here And that would mean if I the Joyous which is your JavaScript In the component While it's being Ok And then just some details my wife Being very involved Discussing Osisa Java Developer And Helping me look at some of the implementations As well as my own details And like I said you can add more contribute is here and they will show up And the dashboard underneath contrib Then the you Kit Uikit settings This is primarily for the bakkie that the moment being implemented in certain areas But this is only really need it most of the time and the front-end framework Of your proponent So I've added it to component builder simply soda There If I At some point decide to start adding I found in shop for the components that's being developed That's part of 40 possibly would design eventually is a front end Distributing Software That was built by component Builder So you could install this and Then run it from your Factory with a front end basically And that is still in planning We still looking at some of the security risk since so far we've been carrying people to use the Important offline and not online So we not even sure how this will work possibly we might end up with two core Components ok then the encryption settings component builder has a few places where it is Some of the data in the database And we are using a basic encryption which means we are using this key that you enter here Once you've entered this key I think because it ships without a key and that So it looks like that So once you've entered the key Please ensure that you don't change it Because Diski is what Locks the data and it's the only key that can unlock it So if you remove this key you cannot unlock it so you could remove it if you wanted to Prevent people from knowing the data in those fields But then you need to save it somewhere else because if you don't have it Then you can't retrieve the data And decrypt it Ok The next up his folder paths Before the pass There are two for the fans that you're ready can make use of the backup folder in the get folder path Please read related Notation here Where is the custom folder path in the compiler for the path I would suggested the states that you don't make any changes to them I added this fuse because I envisioned the possibility that we want to move these folders Out of our Web Area of developing Since these are part of the security Concerns we have That these files and his folders might be targeted But I haven't fully implemented this all cross the compiler infrastructure So currently it's best to leave that That folders the way they are by not adding any data in here Sorry I clicked on the back button there anyway Said by just leaving this field blank We ensure that The Next time we can look at the missions Not a permission of structure and component Builder Is not that intense But as you can see there are a lot of commission switches What's the latest Joomla release of Joomla 3.5 This promotional structure updating construct is made much easier In the past We had a problem Weird that I said of your permissions is so big That when you save it it just freezes up your browser and even the server doesn't wanna receive Now they have added Ajax per field Which makes this so much easier That means that currently Without clicking save and close You can make changes to the promotional structure and that him Immediately will be stored to the ladder base That's from version 3.5 jumilla Now How would that be a see we still have these areas that we also want to store So What what what I have fought might work Possibly my implementation isn't that accurate Bye You have your configurations only as a permission so I would say take a Certain group Give them that configuration only Access And then Log out Of this user login to a user that is in that group Then this permission or tab won't show No only see the settings And a witches are in these tabs right And so they can make changes to these and save them without any Browser latency world Overload Where is you can come in and you can just tweak the permissions when you are in the global or super administrate So you can come in here and you can tweak the permissions accordingly So as you so previously What I was hearing the manager area I could just changed Change this and it doesn't Ajax storing of the value in the database Which is really smart I am very grateful that there done that Search for the main reason that this this set of the Remissions Became so use That I did some places had to do server adjustments on some of my components To to ensure that the user could still save and change the permissions Now So you have your You're a global create delete edit edit State edit own Edit created by and edit created date And then you get The Earth View Commission structure So here is the admin view then the custom admin view the dynamic get And they all have their own Different areas that you can change permissions Four groups to be able to do this or that The same permission implementation Options and Structures Are available to all components built by component Builder As you strip the switches for the fields as well as For your Certain Views Let me just go out of this to show you Components Then first be look at Bonus Salmon distributor Yeah In the oven views You have you and This access control But this is not the only place of implementation So close If you go to the admin views And let's say we open Preacher You have the permission of structure year Edit Navy select view is gonna use the view name if you select core Look for back on the core edit And Delete Features corresponding Sorry if you use the word View View data Use in the permission of structure and edit Switch with this views name preacher dot edit Where is you use the word Core data that you would only see Edit or delete or create whatever Select And this in relation to its record means that it will be added To the record itself you can tweak the edit structure This is only the global setting or this is for both And so that is party how you control some of the commissioner switches we just looked at The other area is in field itself You have your a promotional structure Where you can say ok this specific field let's say the preacher name I wanna control that permission who can edit it Is what you would add Edit button Currently we are not yet implementing who can View Since we were having problems with Tremendous overload of Switch is being added to the promotional structure What is Zuma's now made the strange we might possibly add that in Then you can't even have a View who can view that That field Where is this is currently just who can edit Ok So this is the house you get a Fields promotional switch Now Let me give you this is an example Let's make that one for now Name Say that it must be permission Save and close Save and close Here I have some in this to be to open so open it's options Go to his permission or tab Then scroll down And I see first years the help documents And here's preacher And preacher has side access and an access to preach itself And batch create Dashboard add dashboard list delete edit Any created by educated date Edit own edit State edit version Export import submenu and then it starts with series So as you can see it doesn't show name here yet So what we'll do is now will go back to component builder go to compiler And we will select somin distributor And compile it Wanted completed I'll just click on the install button here To do a quick install No that's completed let's go back to the configuration and just refresh The page I'll just click on the refresh rate It Off Now if we scroll down again it we'll get here we said See it got a new field here called preacher edit name and how I can decide Can this group edit that name or is it denied or should it be inherited So the promotion or structure perfume can be added in this way I'm gonna go back and revert that Because I actually don't want I don't want that area to be monitored So go back Open preacher Back to the Fields Say no Close compiler Select similar compiling it Then installing it Going back refresh And we see that the fuel is gone So it's no longer being controlled by this permission Infrastructure And so that is how you can Tell which Group is able to access which fields And even a witch Views are accessible Through the permission of structures This is an amazing advantage of component builder in its ability to integrate the Permissions not only per View But also Per Field in a view And your normal control also related to a specific view and I'll only that it Also adds these permissions to every item So you could override an item And say ok this item I don't want that group to actually access this field And this is one of the advantages that component Builder Has above other Similar applications out there It's it's ability to implement some of the most advanced concepts that are currently access Bowling Ok so that's a quick look at the Global configuration options 4 component Builder Thank you for watching \ No newline at end of file +Hi Today we would like to look At Component builders Options Or what we would call Global settings Now I possibly through the Tutorials have From time to time touched on certain areas Now we would like to give a more [00:00:19](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m19s) Precise look at The options area of Component Builder It's accessible through the options button And if you have the Permissions you'll see this button and I can open it The Permissions By that I mean certain users may not see this button if they are in it Different group than that Global [00:00:41](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m41s) administrator And You can change those permissional structures is as needed So you click on options And this will open The component builder configurations or global settings as it's often referred to or options or settings And there are number of switches here that is worth knowing about These areas here you could add your own details if you would like to have it displayed [00:01:13](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m13s) In the components front-end Then there is a switch here at check-in timer We build into component builder the option to check in the items Every so often And here you can check If an item have been locked out for 5 hours it brings it back in 12 hours 24 hours Every second day once a week or never So the check-in timer is set here And you can change it to whatever is best suited to your system [00:01:47](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m47s) And then enabling version Version control Is what this area is all about You can disable it by simply saying no Or enable it by yes And then you can say how many Versions should be kept of the item If 0 all all versions will be saved so 0 means Everything And so you can Limit it [00:02:17](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m17s) To sort of prevent your system from of being overloaded with data in the database Then You have minify JS Feature Basically all the JS that is being built In a component Builder Can be Changed to be minified So [00:02:40](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m40s) Why you are in production You can export your components Without minifying the j s In the files and in the footers of the of the documents But the moment you feel that you've reached The place where minification is necessary and you want to use it Then you'd simply trip the switch here And that would minify JS which is your JavaScript In the component [00:03:07](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m07s) While it's being complied Ok And then just some details my wife Being very involved in Discussing She is a Java Developer And Helping me look at some of the implementations As well as my own details And like I said you can add more contributors here and they will show up [00:03:32](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m32s) in the dashboard underneath contributors Then the UiKit settings This is primarily for the backend at the moment being implemented in certain areas But this is only really needed most of the time and the front-end framework Of your component So I've added it to component builder simply so that There If I [00:04:00](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m00s) At some point decide to start adding a front end shop for the components that's being developed That's part of what we possibly would design eventually is a front end Distributing Software That was built by component Builder So you could install this and Then run it from your It's Like factory with a front end basically That is still in planning We still looking at some of the security risks since so far we've been encouraging people to use the [00:04:35](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m35s) Component builder offline and not online So we not even sure how this will work possibly we might end up with two Components ok then the encryption settings component builder has a few places where it encrypts Some of the data in the database And we are using a basic encryption which means we are using this key that you enter here Once you've entered this key I think because it shifts without a key in it So look like that So once you've entered the key Please ensure that you don't change it [00:05:13](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m13s) Because This key is what Locks the data and it's the only key that can unlock it So if you remove this key you cannot unlock it so you could remove it if you wanted to Prevent people from knowing the data in those fields But then you need to save it somewhere else because if you don't have it Then you can't retrieve the data And decrypt it Ok The next up his folder paths [00:05:42](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m42s) . There are two folder paths that you already can make use of the backup folder and the get folder path Please read related Notation here Where is the custom folder path in the compiler folder path I would suggest at this stage that you don't make any changes to them I added these fields because I envisioned the possibility that we want to move these folders Out of our Web Area of developing [00:06:14](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m14s) Since these are part of the security Concerns we have That these files and his folders might be targeted But I haven't fully implemented this all cross the compiler infrastructure So currently it's best to leave that folders the way they are by not adding any data in here Sorry I clicked on the back button there anyway Said by just leaving this fields blank We ensure that The [00:06:50](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m50s) Next type we can look at the permissions Now the permisional structure in component Builder Is not that intense But as you can see there are a lot of permission switches With the latest Joomla release of Joomla 3.5 This permissional structure updating construct is made much easier In the past We had a problem Were the data set of your permissions is so big That when you save it it just freezes up your browser and even the server doesn't wanna receive the data set it's to big [00:07:26](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m26s) Now they have added Ajax per field Which makes this so much easier That means that currently Without clicking save and close You can make changes to the permissional structure and that Immediately will be stored to the data base That's from version 3.5 Joomla Now How would that be a see we still have these areas that we also want to store So What I have thought might work [00:07:58](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m58s) Possibly my implementation isn't that accurate But You have here configurations only as a permission so I would say take a Certain group Give them that configuration only Access And then Log out Of this user login to a user that is in that group Then this permissional or tab won't show [00:08:26](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m26s) they will only see the settings And which are in these tabs right And so they can make changes to these and save them without any Browser latency or Overload Where is you can come in and you can just tweak the permissions when you are in the global or super administrate So you can come in here and you can tweak the permissions accordingly So as you saw previously What I was here the manager area I could just changed Change this and it does a Ajax storing of the value in the database [00:09:02](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m02s) Which is really smart I am very grateful that they've done that Search for the main reason that this this set of the Remissions Became so huge That I had in some places had to do server adjustments on some of my components To to ensure that the user could still save and change the permissions Now So you have your You're a global create delete edit edit State edit own Edit created by and edit created date [00:09:39](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m39s) And then you get The per View permission structure So here is the admin view then the custom admin view the dynamic get And they all have their own Different areas that you can change permissions Four groups to be able to do this or that The same permission implementation Options and [00:10:05](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m05s) Structures Are available to all components built by component Builder As you trip the switches for the fields as well as For your Certain Views Let me just go out of this to show you Components Then first be look at components [00:10:30](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m30s) Sermon distributor here In the admin views You have here This access control But this is not the only place of implementation save and close If you go to the admin views And let's say we open Preacher [00:11:28](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m28s) You have the permissional structure here Edit Now if select view is gonna use the view name if you select core you will fall back on the core edit And Delete Features corresponding So if you use the word View View dot edit you will see in the permissional structure and edit [00:11:51](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m51s) Switch with this views name preacher dot edit Where as you use the word Core dot edit that you would only see Edit or delete or create whatever Select And this in relation to its record means that it will be added To the record itself you can tweak the edit structure This is only the global setting or this is for both And so that is party how you control some of the permissional switches we just looked at The other area is in fields itself [00:12:25](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m25s) You have your a permissional structure Where you can say ok this specific field let say the preacher name I wanna control that permission who can edit it Is what you would add who Edit button Currently we are not yet implementing who can View Since we were having problems with Tremendous overload of Switches being added to the permissional structure Joomla now made this change we might possibly add that in [00:12:58](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m58s) Then you can't even have a View who can view that That field Where is this is currently just who can edit it Ok So this is how you get a Fields permissional switch Now Let me give you this is an example Let's make that one for now Name [00:13:23](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m23s) Say that it must be permission Save and close Save and close Here I have sermon distributer open so I will open it's options Go to his permissional tab Then scroll down And I see first here is the help documents And here's preacher And preacher has side access and an access to preacher itself And batch create [00:13:49](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m49s) Dashboard add dashboard list delete edit edit created by edit created date Edit own edit State edit version Export import submenu and then it starts with series So as you can see it doesn't show name here yet So what we'll do is now will go back to component builder go to compiler And we will select sermon distributor And compile it Wanted completed I'll just click on the install button here To do a quick install [00:14:27](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m27s) Now that that is completed let's go back to the configuration and just refresh The page I'll just click on the refresh here at the top Now if we scroll down again it we'll get here we said See it got a new field here called preacher edit name and how I can decide Can this group edit that name or is it denied or should it be inherited So the permission or structure per field can be added in this way I'm gonna go back and revert that Because I actually don't want I don't want that area to be monitored So go back [00:15:07](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m07s) Open preacher Back to the Fields Say no Close compiler Select sermon distributer compiling it Then installing it Going back refresh And we see that the field is gone So it's no longer being controlled by this permission [00:15:41](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m41s) Infrastructure And so that is how you can Tell which Group is able to access which fields And even a which Views are accessible Through the permissional of structures This is an amazing advantage of component builder in its ability to integrate the Permissions not only per view But also [00:16:07](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m07s) Per Field in a view And your normal control also related to a specific view and not only that it Also adds these permissions to every item So you could override an item And say ok this item I don't want that group to actually access this field And this is one of the advantages that component Builder Has above other Similar applications out there It's it's ability to implement some of the most advanced concepts that are currently accessed [00:16:50](https://www.youtube.com/watch?v=LA2WDi8G79E&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m50s) Ok so that's a quick look at the Global configuration options for component Builder Thank you for watching diff --git a/023-Adding-a-custom-time-field.md b/023-Adding-a-custom-time-field.md index 44e7930..c44e300 100644 --- a/023-Adding-a-custom-time-field.md +++ b/023-Adding-a-custom-time-field.md @@ -1 +1 @@ -Hi Ok I would like to quickly demonstrate how to set up a time Beeld Now you know that In programing of his liat time must always be linked to a date Because time is stored as an integer And 4 If you only want A Field Way only 8 times said let's say 5:15 or something Then I would suggest to use a normal text field And you Create a regex Method This could be done via a I just close this This could be done via a Custom form Filter The way to setup a custom filter USA This component If you go to Marshalls and then dude see rules And in here you can create a rule And then you would use that as the filter name So you would Important Builder you create a file And you place it in your custom folder Any any name Put it in here So let me illustrate that let me Well I'm gonna illustrate that I'll just use one of these files to illustrate how to include it But you would basically create a Rule How to create to create a rule I think let me see if I can get you some documentation on that between I think the easiest would be to basically go to your Scroll up here O2 Your in component You're in Germany right So you go to libraries Jamala Then form Rules Can You can open any of these rules And you can look And what they've done And you would follow the same convention She basically extend J form rule You give it a new nickname Make sure it isn't one of these Take form rules And then We are ready component Builder Already when it when it constructs the The XML document That is used In your Construction of your form Computer modules Form If I open any of them that say this one The ready includes the rule path Andrew pass is This rule So if it if you if you using a a filter So how you would apply it is this you would simply add the word filter People's now in component builder is there is actually a way This But basically That would be the same name As That I suppose T e l Ruby the filter Ok And then in here you have your Test Basically test song Whether this is Acceptable And in here you could do regex and all kinds of nice Means to to validate whether the input field On the server side is actually acceptable So this is a server side Verification of the input And so you you you'd see in component builder if I'm just go there New And I would select text Just a normal text field You see that it has year Filter As well as validate No I think the rule gets placed here invalidate That's right Validate is where you place your room name so your custom rule name might be time Example And then that would ensure On the server side that only time was submitted Now The Next Step 2 Ensure that you The user only types in Letters Three numbers and a colon Instead of anything else I would be able to do some JavaScript here in the view footer You could add JavaScript here that targets This field Vampire adding a A class a unique class name here Or Going to the form where the field Free sample this is a field right Seduce firebug And you would select That field I'm in fire by Coetzee the ID So with JavaScript You can You can target the input of that ID And if that ID has input that is not what you would expect from time Then you could Hi there scream at the user shout or just Emptied the box with a dollar note under it But that would be a JavaScript implementation on top of your your text Field Now That is maybe a long explanation But that is how you do a a a field if only you want time If you want time and you don't mind that there is a date in volved I actually have Build a a a field like that already That I'm using You see because in In your AP table Fields you can't use the other calendar Field So I created a field That's sort of Allows me to store Do that let me let me show you There is a component I'm working on Stration component So if we go to events Open an event Then you would see that ok Yeah I can set dates But these dates If I click in the box You see it has it time Adjuster And I can select a date And adjust a time and click done And it updates the field With that selection If that is the kind of field That you're looking for then implementation is quite different I can I can do to show you that So I'll open it you can see it it the type is a text type So basically I've just added it added in Hunt It's just a normal text type you could pause the video And you can look at the the field XML Now since I'm using this field in a repeatable Field PHP editor JavaScript Is quite different right because you You have a working with a repeatable field that you can add as many Fields as you like But you want this date field to be active on everyone of those And you can't really Target A repeatable field Simply by adding some JavaScript in in in in in this area year Unless you know that feels ID and so instead of doing it in here I actually added to Javascript that is needed to make this field work Into the repeatable fields structure so let me close this and show you that Case I think it's just one event dates So one of those Values there is obviously the ID Of that date field I did I just showed you and so in scripts Again here I can maybe zoom in a little You can you can pause the video And looking sucked liat what I did there Basically in cluding Some Styles as well as some JavaScript And then I have a loop Which Loops 50 times Because I'm only allowing in developer tab repeatable field I'm only allowing 50 Fields to be added So I don't need to look at times And then In the loop I'm actually targeting through the dynamic PHP I'm targeting each of those fields At the moment there's a row at it I'm checking with it at Rhodes just if it does I'm still using the jQuery Date Time picker which is actually Brought to The Page by this The Script here And then it has some options which is 3 cable And that's it That's how I add That kind of date selecting Beaker method In a repeatable field Again I will hold it a bit there you could pause the video Shuttle that down if you want Scroll down again This is this is actually the end of the code Start Ok that's all that it takes To to add That guy yes another thing because I have multiple data Fields so if you open that again You see that Yeah I have a starting and ending date And here in cost adjustment I also have A Target date And so if you look at my my script You'd see that I have a field type array Which basically is used to Target Does different fields in there different my pop-ups ok So You would if you only targeting one field You wouldn't need this extra iterating Method Variable which I'm using here Instead of having to retype it for every field I just added her A loop In the PHP it's just code Ok that's I think that should do it About further documentation I I realised that that might be necessary And Honestly I just don't have time at the moment Because their component isn't earning me A great deal of income Besides the fact that I myself I'm using it and developing components and I have developed quite Got a lot of reading I I realised that that that might be a community project And something I would Actually encourage So Everywhere in component builder in in any of its list to use We have an help menu Already Which actually opens up A Website Which has a wiki Option Actually a redmine website Here is the URL you could see it And if if anyone wants to get involved in the community We help improve the documentation A listview as well as per function as you can see how Freddy down quite a bit and Documentation for every list View Explaining these buttons And Even So on so this help button here you could you could add your own Help by going to the help Annotation And here is the list of the ready set up help If you open one of these You would see that here is the URL that were using And Obviously As we develop this component further We would eventually add more help documentation ride in the component But it will in actual fact map to this This website Because that way or everybody can benefit from any improvements So the website URL For those of you Might wanna go there It's a project start VDM Again projects Joomla component Builder Wiki And yes you could Supposed to go there and from there navigate If you want to get involved in editing the The tutorial or the documentation And you say to me I would help you setup Documentation Give me a great a discount on accessing the tutorials We could strike a deal Because to me I I really I have a time Constrained Manto this point As a community project I hope you understand Thanks so much \ No newline at end of file +Hi Ok I would like to quickly demonstrate how to set up a time field Now you know that In programing obviously a time must always be linked to a date Because time is stored as an integer [00:00:21](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m21s) And therefore If you only want A Field Where only a time is set let's say 5:15 or something Then I would suggest to use a normal text field And you Create a regex Method This could be done via a [00:00:51](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m51s) I just close this This could be done via a Custom form Filter The way to setup a custom filter let me use This component you go to modules and then you would see rules And in here you can create a rule And then you would use that as the filter name [00:01:23](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m23s) So you would component Builder you would create a file And you would place it in your custom folder Any any name Put it in here So let me illustrate that let me Well I'm gonna illustrate that I'll just use one of these files to illustrate how to include it But you would basically create a Rule [00:01:54](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m54s) How to create to create a rule I think let me see if I can get you some documentation on that quickly I think the easiest would be to basically go to your Scroll up here go to Your in component You're in Joomla right So you go to libraries Joomla Then form and then Rules [00:02:21](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m21s) Can You can open any of these rules And you can look And what they've done And you would follow the same convention you basically extend J form rule You give it a unique name Make sure it isn't one of these Jform rule And then [00:02:43](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m43s) We are already component Builder Already when it when it constructs the The XML document That is used In your Construction of your form Sermon Distibuter modules your Form If I open any of them let say this one it already includes the rule path [00:03:17](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m17s) you see and that rule path is This rule So if you are using a filter So how you would apply it is this you would simply add the word filter equals now in component builder there is actually a way to add This But basically That would be the same name As That I suppose that Tel [00:03:48](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m48s) would be the filter name Ok And then in here you have your Test which Basically tests Whether this is Acceptable And in here you could do regex and all kinds of nice Means to to validate whether the input field On the server side is actually acceptable [00:04:10](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m10s) So this is a server side Verification of the input And so you'd see in component builder if I'm just go there It's a new And I would select text Just a normal text field You would see that it has here Filter As well as validate Now I think the rule gets placed here in validate [00:04:44](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m44s) That's right Validate is where you place your rule name so your custom rule name might be time for example And then that would ensure On the server side that only time was submitted Now The Next Step to Ensure that The user only types in . numbers and a colon [00:05:13](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m13s) Instead of anything else would be able to do some JavaScript here in the View footer You could add JavaScript here that targets This field Via adding a A class a unique class name here Or Going to the form where the field for example this is a field right [00:05:37](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m37s) it use firebug And you would select That field so in firebug you will see the ID So with JavaScript You can target the input of that ID And if that ID has input that is not what you would expect from time Then you could [00:06:02](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m02s) either scream at the user or shout or just Emptied the box with a little note under it But that would be a JavaScript implementation on top of your text Field Now That is maybe a long explanation But that is how you do a field if only you want time If you want time and you don't mind that there is a date in volved I actually have Build a field like that already [00:06:36](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m36s) That I'm using You see because in In the repeatable Fields you can't use the calendar Field So I created a field That's sort of Allows me to still do that let me show you There is a component I'm working on registration component [00:06:58](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m58s) So if we go events Open an event Then you would see that ok Yeah I can set dates But these dates If I click in the box You see it has it time Adjuster And I can select a date And adjust the time and click done [00:07:26](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m26s) And it updates the field With that selection If that is the kind of field That you're looking for then implementation is quite different I can I can do to show you that Ok so I'll open it you can see it it the type is a text type So basically I've just added it added it hint It's just a normal text type you could pause the video And you can look at the field XML Now since I'm using this field in a repeatable [00:08:08](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m08s) Field the JavaScript Is quite different right because you You have a working with a repeatable field that you can add as many Fields as you like But you want this date field to be active on everyone of those And you can't really Target A repeatable field Simply by adding some JavaScript in this area here Unless you know that feels ID and so instead of doing it in here [00:08:41](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m41s) I actually added to Javascript that is needed to make this field work Into the repeatable fields structure so let me close this and show you that Case I think it's event dates So one of those Values there is obviously the ID Of that date field that I did I just showed you and so in scripts Again here I can maybe zoom in a little You can you can pause the video and exactly look what I did there [00:09:24](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m24s) Basically including Some Styles as well as some JavaScript And then I have a loop Which Loops 50 times Because I'm only allowing ,if you are looking at the repeatable field I'm only allowing 50 Fields to be added So I only need to loop 50 times And then In the loop I'm actually targeting through the dynamic [00:09:52](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m52s) PHP I'm targeting each of those fields At the moment there's a row added I'm checking whether that row exists if it does I'm simply using the jQuery Date Time picker which is actually Brought to The Page by this The Script here And then it has some options which is tweakable And that's it [00:10:19](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m19s) That's how I add That kind of date selecting picker method In a repeatable field Again I will hold it a bit there you could pause the video jottle that down if you want and Scroll down again This is this is actually the end of the code that is the start Ok that's all that it takes [00:10:43](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m43s) To to add O, yes another thing because I have multiple data Fields so if you open that again You see that here I have a start and an ending date And here in cost adjustment I also have A Target date And so if you look at my script You'd see that I have a field type array [00:11:14](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m14s) Which basically is used to Target those different fields in there different pop-ups So You would if you only targeting one field You wouldn't need this extra iterating Method or Variable which I'm using here Instead of having to retype it for every field I just added A loop In the PHP it's just code Ok that's [00:11:44](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m44s) I think that should do it About further documentation I realized that that might be necessary And Honestly I just don't have time at the moment Because their component isn't earning me A great deal of income Besides the fact that I myself I'm using it and developing components and I have developed quite a lot already [00:12:14](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m14s) I realize that that might be a community project And something I would Actually encourage So Everywhere in component builder in any of it's list view We have an help menu Already Which actually opens up A Website [00:12:39](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m39s) Which has a wiki Option it's Actually a redmine website Here is the URL you could see it And if if anyone wants to get involved in in the community We help improve the documentation per list view as well as per function as you can see I've already done quite a bit in writing Documentation for every list View Explaining these buttons And [00:13:11](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m11s) Even So on so this help button here you could add your own Help by going to the help Documentation And here is the list of the already set up help If you open one of these You would see that here is the URL that we're using And Obviously As we develop this component further We would eventually add more help documentation right in the component But it will in actual fact map to this [00:13:46](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m46s) This website Because that way or everybody can benefit from any improvements So the website URL For those of you Might wanna go there It's projects. VDM Again projects and Joomla component Builder Wiki And yes you could I [00:14:10](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m10s) Suppose just go there and from there navigate If you want to get involved in editing the The tutorial or the documentation And you say to me, OK Llewellyn I would help you setup Documentation Give me a greater discount on accessing the tutorials We could strike a deal Because to me I really I have a time Constrained [00:14:40](https://www.youtube.com/watch?v=epA9zv4yWu0&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m40s) and so at this point As a community project I hope you understand Thanks so much diff --git a/024-How-to-integrate-the-Create-User-Helper-Method-in-your-Components.md b/024-How-to-integrate-the-Create-User-Helper-Method-in-your-Components.md index 3ca6579..cadec5f 100644 --- a/024-How-to-integrate-the-Create-User-Helper-Method-in-your-Components.md +++ b/024-How-to-integrate-the-Create-User-Helper-Method-in-your-Components.md @@ -1,2 +1 @@ -Hi I would like to give you a quick tutorial on illustration on how to use Asian method In your component What is the user Creation function It is basically a part of code helper function actually The gets added to the helper class How does if you don't know where the helper classes that we could to show you To your Pasta tree Find basically your Gmail install Happiness traitor Now there is a helper class for the front end of every component as well as for the back end Looking in a backend We go to component Extra Database Helpers And it's basically that file there What is the helper Class to open it See that it's the abstract extra database helper Now that help with class gets included Into your component on every page so if you to open the main back in file with that one It's loaded by July 1st you'll see that it actually in A profile in every page So that means everything inside of that Class is available to you everywhere in your component When we cook when we actually then go back to the hour Interface Are we go to components Extra Database You see that there is a lips or actually stand for library and helpers and We have to switch Tech yes ad create user helper method Set to yes That is the The switch that you need to trap So that component build and knows that you actually want the help of class Create users Added to the helper class of your front and backend of your Aishwarya Rai I'm gonna close out here Back to the code And then Simple search 4 I want Goku uses That there is Create user See this is a public static function So you would basically call it Then colon colon Under the name of the function right Create user And you see that it said to new Now New has in it A few variables is basically an array So you can go through this class and you'd see that it has a password one or just password the password to The name Gmail And Create the user That's what this class does so it calls in the Joomla Component uses Schools in its registration And then it basically uses that model to create a user so that's what that switch does it have Fastest class to your component you can then use it in your component it doesn't Set everything else in place you still required to do as a developer to add to correct code And I'm using it View Court experts Option for someone to create a user now let me first demonstrate how it works Go to extra data base and click on experts Let's click on new There is a Expert Which you can select Users within a specific group I will also explain some of that more later There is this button create user Click on it it basically has a pop-up wearing you enter a user name Who's gonna say Testing 123 What is the username The password There we go So everything is testing And you guys click create it basically has this nice effect Busy creating at Setting it up sending out the email doing all of that for you And once it's done It lets you know who's it was created successfully The login details was emailed to the user And then it's here ready to select You can select testing 123 that you just created from the user list In the above field simply click on the blue user icon Click here Type in that testing Search And there is the user created - You see that it basically used a very strange conversion here Basically converting the username away from the numbers now you can you can fix that By clicking edit And then changing it to 123 and say save the update Ronaldo My new application doesn't wanna allow you to use Wendy's We have this integrated user now that is connected to an expert And if you were to click there again You can still selected ok but once you select it once you can't create a new expert And select that user again So it's basically want profile connecting to one user To set up the next 4 So that's the feature I am using it for there is different ways that I have implemented this let me show you another one Obviously you realise I'm using a lot of JavaScript on this page I will show you some of that JavaScript but About yourself Ok let me just get out of here Example of be here I wrote this job tracking extension And let's say we want to create a new job order Can say whether it's a new client If it's an existing Simply selected from this list If it's new I click here I can enter all the details of the user and when I click save Create the user Stores the data in the user table not in the job or the table delete all these these So did the job on a table that never stores any user values And so that's another way that I have implemented so if we were to close this out And where to open a client The new one Beauty basically it's the same values And Everything is the same So that's another way that we integrated Integration Different ways to The way I have done it I've just listen to my clients expectation What I really would like to see and how they would like it to work And then simply Make It Happen that way My person I prefer the Ajax Way much more It's it's just seems to me So let me illustrate some of leopard show you some of the code that I used Ok so we back in The Experts View As I've done before I previously another tutorials explained how to make use of the 8 Ajax Within Component Builder Love you that like to understand what's going on let me give you a quick At the code level Within every component that makes use of Ajax A model and a controller is created Controlling is named Ajax Jason dot PHP and the module is name Find Ajax Ok let me open the model And also let me open The controller As you can see the controller basic fire is off The register tasks within the construct And then it adds the tasks Into a switch And tries to run the task basically Also an ink The model Get the module Ajax And then runs the method that basically corresponds to the task And so It runs Uses the Gmail as default Filtering If it's in the way that it gets values that are being posted And then value dates that does values actually are there Then send the values over to the model Now that's looking at it from a code side so if you look at the model Simply shows you Various Some of them are protected And some of them are public and those are usually the ones That I get calls from the controller once the Ajax gets the Verification level tennis Verified Toyota create user class Basically We first check Whether this user now this is custom script I am in this I wrote a custom component build it does not brightness Simply when you go back to the user interface You see that Scroll down here A user fields And then there's great user Just right here And that basically gets placed So that's the Ajax method I simply in that Ajax input I annotate the specific tasks The task name And specific variables And again did the method name Different method names from task names What should be validated whether it's a integer float or whatever And if there's no value What is the value by Default So this is where you set up there basically the controllers information And then hear your customised is write your script so basically Grade user gets data since from what view is it Invalidates with this Information Two actually The Experts area Then it Convert the data because it's a Jason said of datasets that I'm sending across X-ray So you can see I'm still here I'm using that Mobile helper Class and methods Your number of customers it's obviously that That is available in that class to go through it we just added in there as freebies and Always see the Need of them but I'm using them often And even if you have with Improvements on those efforts please make a pull request and we'll make those changes Then you over here Sure that we've got enough data on the right data We basically get that same method and we need to create user Get result And if it's not Bridge Resort we deal with it Morning Lee And if it is the correct result we create Add the user to the user group That's something that the user does not Does you grade user does not do So we Then have a user group setup And Basically in the component And we Set into the correct User Group This is a return message If it's an error Always hits Success So done here is the error message So if it's if it's successful this is what we do if it's unsuccessful this is what we do And so that's just a quick look I mean obviously we can pause this video and Look at her Done And then here is to get the user when the page loads initially The ID get the data Accident to some And send it off So This is the PHP side I'll be asleep We we do this create user and then there is a a Siderite So Script when page loads Would you get user with the user ID We get the user ID from the field And then it loads that data that you saw If you if you looked Basically shows you that is the data and loads And that data can be edited Except over here Cannot add numbers in the username but you can Goodwill updated I will say that is updated Obviously if there is a Mirror with the email already used or something it also give you an error This is all part of how we basically have setup JavaScript The Weeknd scroll down to I've just added to Javascript to the new file And here is get user the server side and there is the the function I have two functions usually one that sort of deals with Waiting and then eventually setting up the data into the The View And here's one making the call so this is how you call structure with usually look Index HP Question mark option = your components name And the task which Must go to the Ajax controller And then this is the task And you then here can stipulate what format you would like the result set returned them View What is the result set returned the role which in sometime sometimes is the case There is if you look here There is a roar Variable You can just set the rule variable to Then it will give you the results set Like that without Braces around them Or a call back You see when you make calls from JavaScript Did you slee Monsters call back to be added If you make calls from other JavaScript libraries who might just want the braces around it But if you want it raw which also is often the case Add the variable draw to the URL = true End up passing it back to you with this Arsenal heads up on Ajax function Format must a Jason Important Always use a token Have the token on the page this token is necessary To prevent cross site scripting of course I usually add the dog into the page Through the JavaScript PHP The place down here I just remembered remembered Every working in a backend The back in the admin area Capitec and it's gets added to the page dynamically Since we Basically passed the JavaScript Areas And we see token we actually know token is to be there and we had to tell him for you Where is the front and you must actually literally at the poker There was just too many Not to do the Automation in the front end Games to the variable name as well Do something of your choice Where is now it's just joking it's back in it's more secure You need to always add a token To the request Check whether token is there if it's not that it wouldn't make a request that all Ok so I was looking at another function there Ok so that's simply how we create a user And integrate the use of concept within this component I hope that was helpful I realise if you not that fluent in programming in JavaScript Orange on a date with jQuery As well as in PHP Is my not fully resolved your questions Like I said where the beginning of these tutorials I wasn't planning on making a component Very easy to use Component that is very powerful to use I'm leaving it up to you to decide how to implement This user integration The most powerful way of doing it At least we are adding the the class with which you can create the user And again even there you can go look at that class If you feel my implementation is too little Provement Can I shoot me a mail or you could For this component Builder on GitHub Pull down to yarn repository Make the changes push it back And Inside Of component builder where this class is constructed Obviously Within Compiler is files that the compiler Has View files and you need to do to a search Go to component Builder The helper Use the compiler And here is always files Research in here 4 Ocean Create user you could How to search for that I'm sure you're fine it In that area where you need to make the station and it changes because it's daytime It is not Can be edited like right Script to be added in the function where we had it Just go search those functions Thank you for watching That's how you create users and connect them to your components Much more to say but I'm afraid this will get way too long like most of my tutorials get to I want to keep it this this way and trying to make it shorter hope you enjoyed that \ No newline at end of file +Hi I would like to give you a quick tutorial or demonstration on how to use user creation method or function In your component What is the user Creation function [00:00:18](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m18s) It is basically a part of code's helper function actually That gets added to the helper class If you don't know where the helper class is let me quickly show you now if you go to your repository where you Find basically your Joomla install you would go to administrator Now there is a helper class for the front end of every component as well as for the back end so looking in a backend We go to component [00:00:55](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m55s) Expert Database Helpers And it's basically that file there that is the helper Class if we open it we See that it's the abstract expert database helper Now that helper class gets included Into your component on every page so if you to open the main backend file with that one Which get loaded by Joomla first you'll see that it actually includes that helper file in every page [00:01:28](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m28s) So that means everything inside of that Class is available to you everywhere in your component When we actually go back to our Interface And we go to components and the Expert Database You would see that there is a libs or actually stand for library and helpers and you see We have to switch Ticked yes add create user helper method Set to yes That is the [00:02:11](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m11s) The switch that you need to trip So that component builder and knows that you actually want the helper class that Creates users to be Added to the helper class of your front and backend of your component I'm gonna close out here I am going to go back to the code And then I am going to do a Simple search for user [00:02:44](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m44s) . Here is quite a few users there it is Create user As you can see this is a public static function So you would basically call it with that class name Then colon colon and the name of the function, right which is create user And you see that it is set to new [00:03:26](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m26s) Now New has in it A few variables is basically an array So you can go through this class and you'd see that it has a password one or is just password or password two, it has a user name it has a name aswell as a e-mail And it then creates the user That's what this class does so it calls in the Joomla Component users [00:04:00](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m00s) It calles in it's registration model And then it basically uses that model to create a user so that's what that switch does it adds this class to your component you can then use it in your component it doesn't automatically just sets everything else in place you still required to do as a developer to add to correct code I'll show you what I have done and how I am using it There is a admin View called experts it's in this view that I would actually like Option for someone to create a user now let me first demonstrate how it works So I would go to expert data base and click on experts Let's click on new So you would see there is a [00:04:55](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m55s) field called Expert With which you can select Users within a specific group I will also explain some of that more later But underneath there is this button create user If you Click on it it basically has a pop-up where in you enter a user name I am just gonna say Testing 123 Use that as the username [00:05:26](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m26s) And as the password There we go, got the user name So everything is testing 123 And if I click create it basically has this nice effect where it is busy creating it Setting it up, sending out the email doing all of that for you And once it's done It lets you know that user was created successfully and the login details was e-mailed to the user And then it says here ready to select [00:06:05](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m05s) You can now select testing 123 that you just created from the user list In the above field simply click on the blue user icon Click here and you can type in that testing 123 click Search And there is the user created and we click enter You see that it basically used a very strange conversion here Basically converting the username away from the numbers now you can you can fix that By clicking edit [00:06:40](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m40s) And then changing it to 123 and say save the update Does not want to allow that. So clearly my little application doesn't wanna allow you to use actually any numbers in the user name,.That's not the point The point is that we have this integrated user now that is connected to an expert And if you were to click there again You can still selected ok but once you select it once you can't create a new expert And select that user again So it's basically one profile connecting to one user To set up a expert [00:07:24](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m24s) So that's the feature I'm using it for there is different ways that I have implemented this let me show you another one Obviously you realise I'm using a lot of JavaScript on this page I will show you some of that JavaScript but That yourself Ok let me just get out of here for Example over here I wrote this job tracking Extension And let's say we want to create a new job order then I can say whether it's a new client or a existing if it is an existing I Simply select from this list [00:08:04](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m04s) If it's new I click here I can enter all the details of the user and when I click save It Creates the user Stores the data in the user table not in the job order table deletes all these values So did the job order table never stores any user values in the relation of this job order of course And so that's another way that I have implemented so if we were to close this out And where to open a client A new one You would see it's basically it's the same values And [00:08:44](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m44s) Everything is the same So that's another way that we integrated this whole User integration So there are really many different ways to this The way I have done it I've just listen to my clients expectation What I really would like to see and how they would like it to work And then simply Make It Happen that way I personally I prefer the Ajax Way much more It's it's just seems to me easier So let me illustrate some of or let me show you some of the code that I used to do that [00:09:26](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m26s) Ok so we back in The Experts View As I've done before I previously in other tutorials explained how to make use of the Ajax concept Within Component Builder Now for those of you that like to understand what's going on let me give you a quick runover At the code level Within every component that makes use of Ajax A model and a controller is created The controller is named Ajax.json.php and the model is named [00:10:04](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m04s) Ajax Ok let me open the model And also let me open The controller As you can see the controller basic fires off The register tasks within the construct method And then it adds the tasks Into a switch And tries to run the task basically Also in [00:10:31](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m31s) The model it It Gets the model Ajax And then runs the method that basically corresponds to the task And so that is how It runs It uses the Joomlas default Filtering Method in the way that it gets values that are being posted And then value dates that those values actually are there Then sends the values over to the model [00:11:05](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m05s) Now that's looking at it from a code side so if you look at the model It simply shows you Various methods Some of them are protected And some of them are public and those are usually the ones That gets called from the controller once the Ajax gets the Verification level and it's Verified So here is the create user class [00:11:31](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m31s) Basically We first check Whether this user now this is custom script I mean this I wrote custom component build does not write this so Basically when you go back to the user interface You see that If I scroll down here create user fields And then there's great user You see that I wrote this right here And that basically gets placed into the model [00:12:07](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m07s) So that's the Ajax method here I simply in that Ajax input I annotate the specific tasks The task name And specific variables And again the method name You could have different method names from task names and What should be validated whether it's integer, float or whatever And if there's no value What is the value by Default So this is where you set up there basically the controllers information [00:12:39](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m39s) And then here your customised these write your script so basically create user gets data and seems from what view is it then validates with this current login user has the permission To actually The Experts area Then it Converts the data because it's a json set of datasets that I'm sending across So that we can see if it's an array does some other checks So you can see I'm still here I'm using that [00:13:17](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m17s) Global helper Class and methods Here are number of custom methods obviously that That is available in that class to go through it we just added in there as freebies and And you wanna always see the Need of them but I'm using them often And even if you have with Improvements on those methods please make a pull request and we'll make those changes Then you over here once we've Become very sure that we've got enough data on the right data We basically get that same method and we need to create user [00:13:55](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m55s) Get result And if it's not the correct result we deal with it accordingly And if it is the correct result we create Add the user to the user group That's something that the user does not that you create user does not do So we Then have a user group setup [00:14:17](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m17s) And Basically in the component And we get that user group Set into the correct User Group This is a return message If it's an error or whether it's a Success So down here is the error message So if it's if it's successful this is what we do if it's unsuccessful this is what we do [00:14:45](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m45s) And so that's just a quick look I mean obviously we can pause this video and Look at What I have done And then here is getUser when the page loads initially we get the id get the data packs it into some html And sends it off So This is the PHP side obviously We we do this create user and then there is a ajax [00:15:16](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m16s) Site right in Javascript So In the JavaScript when the page loads Would you get user with the user ID We get the user ID from the field And then it loads that data that you saw If you if you looked no this is the wrong place Basically shows you that is the data it loads And that data can be edited Except over here [00:15:51](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m51s) You cannot add numbers in the username but you can do that and it will update it as you see and will say that is updated it Obviously if there is a Error with the email already used or something it will also give you an error And this is all part of how we basically have setup the JavaScript Ok we can scroll down to So I've just added to Javascript to the view file And here is get user the server side and there is the the function [00:16:24](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m24s) I have two functions usually one that sort of deals with Waiting and then eventually setting up the data into the The View And here's one making the call so this is how you call structure would usually look In index. php ?option = your components name And the task which Must go to the Ajax controller And then this is the task [00:16:54](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m54s) And you then here can stipulate what format you would like the result set returned in if you Want the result set returned the raw which in sometime sometimes is the case There is if you look here There is a raw Variable You can just set the raw variable to true Then it will give you the results set just Like that without Braces around them [00:17:23](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m23s) Or a call back or anything You see when you make calls from JavaScript It usually Wants this call back to be added If you make calls from other JavaScript libraries you might just want the braces around it But if you want it raw which also is often the case you just add the variable raw to the URL = true and then end up passing it back to you with this So that's a little heads up on Ajax function so [00:17:56](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m56s) the format must json that's Important Ok and always use a token Have the token on the page this token is necessary To prevent cross site scripting of course I usually add the token to the page Through the Java oh sorry php So there is a place down here if you scroll down where is it I just remembered remembered [00:18:28](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m28s) If you are working in a backend The backend the backend and the admin area you don't need to have the token its get added to the page dynamically Since we Basically parsed the JavaScript Areas And if we see token we actually know oh token is to be there and we add the token for you Where is the front end you must actually literally add the token There was just too many reasons for us Not to do the Automation in the front end so but you could literally change to the variable name as well [00:19:03](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m03s) To something of your choice Where is now it's just token it's backend it's more secure ok so You need to always add a token To the request and check whether the token is there if it's not that it wouldn't make a request at all Ok so I was looking at another function there Ok so that's simply how we create a user And integrate the user concept within this component I hope that was helpful I realize if you not that fluent in programming in JavaScript Or in jQuery [00:19:41](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m41s) As well as in PHP This might not fully resolved your questions Like I said where the beginning of these tutorials I wasn't planning on making a component that is Very easy to use but rather a Component that is very powerful to use And leaving it up to you to decide how to implement This user integration Is really the most powerful way of doing it At least we are adding the the class with which you can create the user And again even there you can go look at that class [00:20:20](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m20s) If you feel my implementation is a little you know needs some Inprovement You can either shoot me a mail or you could Take For this component Builder on GitHub Pull down to your own repository Make the changes push it back And The place inside Of component builder where this class is constructed [00:20:47](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m47s) is obviously Within The compilers files. Now the compiler Has Has quite a few files and you need to do do a search So you basically go to component Builder go to helper and then Use the compiler And here is all its files So do a search in here [00:21:09](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m09s) For the function Create user you could you know just search for that and I'm sure you're fine it and it is in that area where you need to make the adaptation and the changes because it's dynamically added It is not it can't be edited like right in the script it needs to be edit in the function where we add it Just go search those functions [00:21:38](https://www.youtube.com/watch?v=ckFakaQ90JY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m38s) Thank you for watching That's how you create users and connect them to your components Obviously there is much more to say but I'm afraid this will get way too long like most of my tutorials get to long I want to keep it this this way and trying to make it shorter hope you enjoyed that diff --git a/025-How-to-use-email-helper-in-your-components.md b/025-How-to-use-email-helper-in-your-components.md index 3ba151e..f450f5b 100644 --- a/025-How-to-use-email-helper-in-your-components.md +++ b/025-How-to-use-email-helper-in-your-components.md @@ -1 +1 @@ -Hi I want to show you how to use the emailing helper class in your component Email helper class is a class that gets added to your components helper area And therefore available on every page And with which you can then send emails We could look at the helper Class by going to a component that has Included And then into helpers and The filename is usually the component name Email Opened it already here As you can see it's in just the basic abstract class That Thanks Jim Ellis emailer Which is this Gmail And it gets an instance of it And add to mail and then loads in Did the variables that's required Now We'll come back to this in a moment If you look at a component What you need to do first If you are gonna use this feature in any of your components That is open this Learning manager And then go to libraries and helpers And you'll see that there add email helpers been set to on Places the helper class in your component that's all it does It doesn't implemented anywhere else So At the moment that means that if you click yes here You need to still create fields That you are gonna load to your comp Fake area Now if you don't know about the config yet means you've skipped some tutorials But it's basically this area here Which gives you the option to the ability to add Configuration options to your components option area So if we click here I scroll down you'll see that there is Mail configuration and a whole lot of fields there Now these Fields correspond to the gym last default Fields if you didn't know So if you would like to create these Fields and you need some info on what there should be in what should be their names and Everything Then go look at the Joomla Global configuration XML And you'll see all the settings in that fire file For our purposes I'm simply gonna show you how the fields look like We also have the dkm Yeah implementation available And even those Fields you will need to look at the code to know what their names should be So there's a difference of course between name and label and description When we refer to named and that is the The value that will be used in the code Ok I'll show you what I mean I just close out here Go back to the code So for example that work mailer Actually means That the name of the field is called Maile The name of the field is called that and that So goes on So these are all the fears that needs to be said If if if your component If we go back to the component Close this Utilities options area so I'm gonna open that Wanted to open your see there is a mail configuration and a dkm area Dkim So let's open a mail You see that it has the mailer status So it's over set to off then no emails will go out Auto on If it said 2 on you can decide whether you want to override the global function Adiglobal Variables Other global variables are set in your Gmail as components Global area So you would go to Global configurations And then You'd go to System No sorry It's server And then there's this mail settings here Ok These are the main or the the global settings that will be used in the in any component that does Does not add These settings in their config So if you didn't create Those Fields and added it to your component but you text the the button to sort of add the helper Cars to your component Then That means that it will basically fall back to these settings in your Joomla default Area So Just that you know And these are the values that you need to override if you want your Component in two in some way to use other PHP mail or other send mail or Other What's the other one SMTP Values than that of the global you need to set it here And That is basically what this error can do So you use Global it falls back to the Joomla Global Otherwise you can override it on this level And send it out In a way that is What you would like Idk IM area Is there more advanced area which basically allows you to override Sorry not override to encrypt And secure email sent out from you do a centre Cape that it was really you that send it This is very helpful to sort of show your the people that receive these emails that it's not Sam and it's really comes from you it's more advanced I would encourage you to read up on it these are the values Usually would be required to be added private key a public key And obviously stop periods here If this is said to know obviously it will not be used if it said to yes please ensure to add the values Otherwise it still will not be used Ok So that's basically the values that you need to still create Component does not do this for you You need to do it I could possibly foresee that In the future we might add this If you take the helper class it adds these values for you But even then if you have done it manually We'll make sure that it doesn't add in twice So as long as These values obviously be the same Names we will know actually a Somehow identify that And then not Add them dynamically So to avoid clashes But for the meantime it's not automatically being at it and so you need to do that manually if you want it To be there if you don't like I've said before Before back to the gym allow Global So explain that you on the code level Basically it gets from the configuration The major function And then it checks whether it's global If it is global Then It Implements to Millers Values If it's not Global it implements your components values And That is basically what it will do Now you can read through the code But the most important area really is this area You know what is all the various Options that you have in the signature To send out Mail So it's able to really send out a lot of mail but Nonetheless You're also need to consider You know Your servers own limitations Since we obviously don't want you to spam people We do not Override those values when we are simply using the Joomla default Helper to Malawi an emailer And it is been extended from another class And so there are a lot of features and here And if you wanna know more about them Are you can read up on on obviously the J in mailer Class from Joomla Read through this code here and see how we implemented These are the dkm values that you would need And in your In your component To be able to use the dkim encryption But you could also read up on this and check out this function here There Anyway that it's implementing these features It obviously is adding it to the mailer and most of the work is done in the major So it's basically adding the data to the mailer and the mail and takes care of the rest Ok and so here it sends it off And if there is an error So let's say for some reason it didn't No work out well Then it shakes weather Your Component Helper class So your component has a helper class it's just this phone here Even has a storm message Variable A method So if we were to go check this You see that there is this storm message method In the helper class this is a custom method that I wrote now you can write it anywhere you like But this signature should be the same Ok so Yeah Is the same signature you'll see it So basically this area that And that is dynamically updated to your component Seduces your component name here and your component name there But this store message Is basically No You cannot change that but it takes to send email the recipient the subject the body to text only in the mode and it's That it's email So you can have different types so if you look at the the method The type can be anything We are obviously wanting to do different things on different types so if we send an SMS and we didn't Fail You wanna store the message if we did this or that So this this kind of feature Is it only used when something didn't work But also if it worked If it was sent It's gonna store it So it's a way to store the message So did you can Maybe let you use her go If they login They can see messages sent to them in this kind of stuff So this is what the store message does and as you see it's a huge cross them Method that I Road And it does different things for different You can update it in change it cause the video copy it down don't really matter This is you realise this is actually something you ride up yourself you just need to make sure that that part is the same The rest is up to you Now you deal with it ok so that is really implementing the learning manager email In your component Maybe I should show you where I implemented at least In one area Ok so I have this component called job tracking system open it up You'll see that it actually has that function Adding the helper email it's got it selected you see there at help On Then the view in which we are using the email method is the job or the view Basically we want to email the client I did job order When when it's created So let me show you how I can fermented it there So here is the job order And I would basically then Click on This area email now I can update that Do whatever email I like Testing At Something Just send it in to Nothing And Then once the email has been sent It actually let's me know See there in the it says email was sent successfully So That's basically what the email does it use this button it sends this Document To my Client And also if I want to send it to my store The people that does the job I could also do that here I'm not gonna explain to you The reality of taking this content adding it to the email and sending it That I would suspect you need to know and you need to learn or study to do that yourself I'm I'm simply explaining to you how to use the email helper class So we will go to the code and I'll show you how I do it and Mostly Maybe I'll give you some pointers but I won't go into detail About how that is done Ok so let's go to the to the code So here we are in the job order So first thing here is obviously some JavaScript So there's this send email function Get a set of values And then it basically gives it over to the scent Email server function which sends it as a JC object Sorry I Jason request to the server The scent Email is the Task And when I get a response that's when you get the notification Ok so that's Simply the JavaScript of it So now if we go to PHP Previous Tutorials me explain how to use the Ajax class I'm great just touched on it briefly You basically have your input here This is where you put set up your controller Let me show you that So you'll see in your controller There is this send email Class that's what basically was defined And this field here And you see that there is Basically three variables And they are Should be filtered in this way and they are fast over to these methods And you should be logged in user So if you look at the code again it basically this is the task down here it 2 years to ties Check for those values and then passes it over to the This method which is in the Model is a model So we go to models Ajax So here is the the model let's just scroll down to the send email So here is the send email this again Is a custom Script So if I was to go back here Close this You see there's the Indus Ajax method is a lot I mean look at that you can see it. Scroll down way down is a lot of other customers But this is another cross the method I've written Call send mail get the mail the HTML to type It it doesn't necessary Cleansing and whatever And then Eat Basically Aware Yeah We're calling the email helper We using the send method Passing the valuables and we Set the result in here And if the results is obviously true We will let the user know otherwise we give him the error You're so that That is the The short end of it I'm also using this email body to help me build the the email because I want to Make sure that it's got all the necessary HTML and stuff so you can Pause this video and typed it out if you like But this is the email body that I usually use and you can see you passing the HTML on the subject to it And it simply adds the the subject to the Email The necessary places as well as the body In the necessary place Right there So that it gets sent in a way that's more appropriate And then That's all happening right here Ok and that is what I'm passing in here So a custom method which gets the data from Victor Jacks And then sends it off So that's a quick tutorial on how to implement sending emails through your component Using the email helper class Obviously the email helper class Is Available on GitHub in in the component Builder And if you feel that our implementation lacks some professional Help then please do make a commit to Quest or send me an email And we'll gladly update an improved this class So I think we are followed All the necessary standard requirements to make it useful to everyone Ok thanks for watching Until next time \ No newline at end of file +Hi I want to show you how to use the emailing helper class in your component The email helper class is a class that gets added to your components helper area And therefore available on every page And with which you can then send emails We could look at the helper Class by going to a component that has it [00:00:25](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m25s) Included And then into helpers and The filename is usually the component name Email If've opened it already here As you can see it's in just the basic abstract class That That takes Joomlas emailer Which is this Jmail And it gets an instance of it [00:00:48](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m48s) And adds it to mail and then loads in the variables that's required Now We'll come back to this in a moment If you look at a component What you need to do first If you are gonna use this feature in any of your components Let us open this Learning manager And then go to libraries and helpers [00:01:22](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m22s) And you'll see that there add email helpers been set to on and that only Places the helper class in your component that's all it does It doesn't implemented anywhere else So At the moment that means that if you click yes here You need to still create fields That you are gonna load to your config area Now if you don't know about the config yet it means you've skipped some tutorials But it's basically this area here [00:01:55](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m55s) Which gives you the option to the ability to add Configuration options to your components option area So if we click here I scroll down you'll see that there is Mail configuration and a whole lot of fields there Now these Fields correspond to the Joomlas default Fields if you didn't know So if you would like to create these Fields and you need some info on what there should be in what should be their names and Everything Then go look at the Joomla Global configuration XML And you'll see all the settings in that file For our purposes I'm simply gonna show you how the fields look like [00:02:39](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m39s) We also have the dkim implementation available And even those Fields you will need to look at the code to know what their names should be So there's a difference of course between name and label and description When we refer to named and that is the The value that will be used in the code Ok I'll show you what I mean I just close out here Go back to the code So for example that word mailer [00:03:13](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m13s) Actually means That the name of the field is called Mailer The name of the field is called that and that and so it goes on So these are all the fields that needs to be set If if if your component If we go back to the component let me just Close this You would see there is a options area so I'm gonna open that once it open your see there is a mail configuration and a dkim area [00:03:45](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m45s) Dkim So let's open a mail You see that it has the mailer status So it's either set to off then no emails will go out or to on If it set to on you can decide whether you want to override the global function The global Variables now the global variables are set in your Joomlas components Global area [00:04:10](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m10s) So you would go to Global configurations And then You'd go to System No sorry It's server And then there's this mail settings here Ok Now these are the main or the the global settings that will be used in the in any component that Does not add [00:04:40](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m40s) These settings in their config So if you didn't create Those Fields and added it to your component but you ticked the the button to sort of add the helper Class to your component Then That means that it will basically fall back to these settings in your Joomla default Area So Just that you know And these are the values that you need to overwrite if you want your [00:05:08](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m08s) Component into some way to use other PHP mail or other send mail or Other What's the other one SMTP Values than that of the global you need to set it here And That is basically what this area can do So you use Global it falls back to the Joomla Global Otherwise you can overwrite it on this level And send it out In a way that is [00:05:38](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m38s) What you would like The DKIM area Is there more advanced area which basically allows you to overwrite Overwrite sorry not overwrite to encrypt And secure email sent out from you to authenticate that it was really you that send it This is very helpful to sort of show your the people that receive these emails that it's not Spam and it's really comes from you it's more advanced I would encourage you to read up on it these are the values Usually would be required to be added private key a public key And obviously these type of areas here If this is set to no obviously it will not be used if it set to yes please ensure to add the values [00:06:25](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m25s) Otherwise it still will not be used Ok So that's basically the values that you needs to still create Component does not do this for you You need to do it I could possibly foresee that In the future we might add this If you tick the helper class it adds these values for you But even then if you have done it manually We'll make sure that it doesn't add in twice [00:06:51](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m51s) So as long as These values obviously be the same Names we will know actually a Somehow identify that And then not Add them dynamically So to avoid clashes But for the meantime it's not automatically being added and so you need to do that manually if you want it To be there if you don't like I've said before It will fall back to the Joomla Global [00:07:15](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m15s) So to explain that you on the code level Basically it gets from the configuration The mailer function And then it checks whether it's global If it is global Then It Implements Joomlas Values If it's not Global it implements your components values [00:07:38](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m38s) And That is basically what it will do Now you can read through the code But the most important area really is this area To know what is all the various Options that you have in the signature To send out Mail So it's able to really send out a lot of mail but Nonetheless You're also need to consider [00:08:04](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m04s) You know Your servers own limitations Since we obviously don't want you to spam people We do not Overwrite those values. We are simply using the Joomla default Helper Joomla sorry jmailer And it is been extended from another class And so there are a lot of features and here And if you wanna know more about them you can read up on on obviously the jmailer [00:08:35](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m35s) Class from Joomla As well as read through this code here and see how we implemented These are the dkim values that you would need And in your In your component To be able to use the dkim encryption But you could also read up on this and check out this function here up till there In its way that it's implementing these features It obviously is adding it to the mailer and most of the work is done in the mailer [00:09:05](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m05s) So it's basically adding the data to the mailer and the mailer takes care of the rest Ok and so here it sends it off And if there is an error So let's say for some reason it didn't you know work out well Then it shakes whether Your Component Helper class So your component has a helper class it's just this file here [00:09:31](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m31s) Even has a storemessage Variable or method So if we were to go check this You see that there is the storemessage method In the helper class this is a custom method that I wrote now you can write it anywhere you like But this signature should be the same Ok so here Is the same signature you'll see it [00:10:00](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m00s) So basically this area that And that is dynamically updated to your component So it uses your component name here and your component name there But this store message Is basically Not You cannot change that but it takes to send email the recipient the subject the body to text only in the mode and it's says That it's email So you can have different types so if you look at the the method The type can be anything [00:10:30](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m30s) We are obviously wanting to do different things on different type so if we send an SMS and we didn't Fail You wanna store the message if we did this or that So this this kind of feature Is it only used when something didn't work But also if it worked If it was sent It's gonna store it So it's a way to store the message So that you can [00:10:57](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m57s) Maybe let your user go If they login They can see messages sent to them and this kind of stuff So this is what the store message does and as you see it's whole huge custom Method that I wrote And it does different things for different You can update it in change it pause the video copy it down don't really matter Just if you realize this is actually something you write up yourself you just need to make sure that that part is the same The rest is up to you Now you deal with it ok so that is really implementing the learning manager emailer [00:11:35](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m35s) In your component Maybe I should show you where I implemented at least In one area ok let me do that Ok so I have this component called job tracking system if I open it up You'll see that it actually has that function Adding the helper email it's got it selected you see there add helper Set it to on Then the view in which we are using the email method is the job or the view Basically we want to email the client I did job order [00:12:21](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m21s) When when it's created So let me show you how I implemented it there So here is the job order And I would basically then Click on This area here email now I can update that to whatever email I like Testing @ [00:12:45](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m45s) vdm.io or something Just send it in to Nothing And Then once the email has been sent It actually let's me know See there in the it says email was sent successfully So That's basically what the emailer does it just this button it sends this Document [00:13:11](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m11s) To my Client And also if I want to send it to my store The people that does the job I could also do that here I'm not gonna explain to you The reality of taking this content adding it to the email and sending it That I would suspect you need to know and you need to learn or study to do that yourself I'm I'm simply explaining to you how to use the email helper class So we will go to the code and I'll show you how I do it and [00:13:45](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m45s) Mostly Maybe I'll give you some pointers but I won't go into detail About how that is done Ok so let's go to the to the code So here we are in the job order So first thing here is obviously some JavaScript So there's the send email function and Gets a set of values And then it basically gives it over to the send Email server function which sends it as a J object [00:14:20](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m20s) Sorry a json request to the server The send Email is the Task And when it gets a response that's when you get the notification Ok so that's Simply the JavaScript of it So now if we go to PHP Previous Tutorials we explain how to use the Ajax class I'm gonna just touched on it briefly [00:14:47](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m47s) You basically have your input here This is where you put set up your controller Let me show you that So you'll see in your controller There is this send email Class that's what basically was defined And this field here And you see that there is Basically three variables And they are [00:15:12](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m12s) Should be filtered in this way and they are fast over to these methods And you should be logged in user So if you look at the code again it basically this is the task down here it triggers the task It checks for those values and then passes it over to This method which is in the Model is a model So we go to models Ajax So here is the the model let's just scroll down to the send email So here is the send email and this again [00:15:47](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m47s) Is a custom Script So if I was to go back here I Close this You'd see there's the in this Ajax method is a lot I mean look at that you can see that scroll down way down is a lot of other custom methods here But this is another custom method I've written Call send mail gets the mail the HTML to type It it does the necessary Cleansing and whatever [00:16:14](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m14s) And then It Basically Over Here We're calling the email helper We using the send method we Passing the valuables and we Set the result in here And if the results is obviously true [00:16:38](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m38s) We will let the user know otherwise we give him the error ok so that That is the The short end of it I'm also using this email body to help me build the the email because I want to Make sure that it's got all the necessary HTML and stuff so you can Pause this video and type that out if you like But this is the email body that I usually use and you can see you passing the HTML on the subject to it And it simply adds the the subject to the Email [00:17:15](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m15s) The necessary places as well as the body In the necessary place Right there So that it gets send in a way that's more appropriate And then That's all happening right here Ok and that is what I'm passing in here So a custom method which gets the data from the Ajax And then sends it off [00:17:43](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m43s) So that's a quick tutorial on how to implement sending emails through your component Using the email helper class Obviously the email helper class Is Available on GitHub in in the component Builder And if you feel that our implementation lacks some professional Help then please do make a commit to Quest or send me an email And we'll gladly update an improved this class Although I think we are followed All the necessary standard and requirements to make it useful to everyone [00:18:26](https://www.youtube.com/watch?v=tp6mMUTOF2Y&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m26s) Ok thanks for watching Until next time diff --git a/026-How-to-setup-a-store-message-method-along-side-the-email-helper-class.md b/026-How-to-setup-a-store-message-method-along-side-the-email-helper-class.md index 6bbcc5d..f4cef94 100644 --- a/026-How-to-setup-a-store-message-method-along-side-the-email-helper-class.md +++ b/026-How-to-setup-a-store-message-method-along-side-the-email-helper-class.md @@ -1 +1 @@ -Hi I've already done a tutorial how to use the email helper in your components And that it or I'll actually do touch upon The storing of messages Or emails for that matter Once it's been sent Now I would like to just look at that again For those of you that may just be wanting to know that So Obviously at this stage you should know That the email helper class Basically added to the helper folder Of your components backend So and it's usually called your components name and then email That's that's the email help class so to use it In the custom script you could use the three basic brackets Is that ok and then component like that And then just email And send And That is how you would basically construct Your Your script I show that as well in the tutorial We we going to more depth How to use the email helper But At the very bottom of this class in the sent Method There is a little snippet What is significant as it may seem Actually gives you a very great Affinity Because The result Of the email that was sent Is placed in sent email This result is passed to the method as well The first it looks in your helper class Which is usually a component name Helper That's the helper class And whether this method exists in the class And this method will not exist unless you Write it So The area where you would have to write this method Is in the component there is an area Called Admin helper Let's look at that Open a component We go to libraries and helpers Scroll down And we see there is Email helper And then underneath it help her at mint class And it's in this area that you need to add that method Now I realised I've chosen the wrong components is this component actually does not use that storage But there is another one that does let's open that one instead then So again we are in Helper admin class And we have a function called Star message and this is in the components There where you edit your component So this store message has what we call a signature Values that it is passing to the method And in the The Email helper class You see that it Also has A signature But wherever it gives this = with a value That means that that's the default value so if you do not add A value for this position there is one two three four 50 Then it will default 20 if we do not add this it will default to now So From there all the way to the end all of those values halves that basically than all No value So In reality you only need to add you know these values the first for But Those values are all used in this method So do you wanna understand exactly how these value should look look inside of the method Read through the method And you will see So Making a long story short We end up here at this Lil script Basically ask whether you created the method or not If you didn't it's simply skip said and returns the value of sent mail if it That you have created it It'll pass these variables that correspond to the signature And then inside her that method that is in your helper class That is now of this method You need to do the necessary checks and balances And discovering For example since you've got the email address You can Search Navigate bar In the user class It must equal Email Recipient = email And then returns to us the ID So That is basically how the get War works And Then when we have the user ID We can obviously make sure it's so The number and we said it to her message as user And we said it as the email and now we can store The message in whatever table or do whatever we wanna do Beyond The normal So even if you wanna do other things except Storing the message This is the method inside of which you can do it so store message Is the method inside which you can do some more custom scripting On top of your email integration Ok so that's just quickly giving a little bit more depth on that specific aspect Abusing The email class in your component Thank you for watching \ No newline at end of file +Hi I've already done a tutorial how to use the email helper in your components And in that tutorial I actually do touch upon The storing of messages Or emails for that matter Once it's been sent Now I would like to just look at that again For those of you that may just be wanting to know that [00:00:24](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m24s) So Obviously at this stage you should know That the email helper class it basically added to the helper folder Of your components backend So and it's usually called your components name and then email That's that's the email helper class so to use it In the custom script you could use the 3 braces brackets Is that ok and then component like that And then just email [00:00:59](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m59s) And sent And That is how you would basically construct Your Your script I show that as well in the tutorial We we going to more depths of how to use the email helper But At the very bottom of this class in the send Method [00:01:21](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m21s) There is a little snippet quite its significant as it may seem Actually gives you a very great Ability Because The result Of the email that was sent Is placed in send email This result is passed to the method as well The first it looks in your helper class [00:01:47](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m47s) Which is usually a component name Helper That's the helper class And whether this method exists in that class And this method will not exist unless you Write it So The area where you would have to write this method Is in the component there is an area Called [00:02:13](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m13s) Admin helper Let's look at that So we open a component We go to libraries and helpers we scroll down And we see there is Email helper And then underneath it helper admin class And it's in this area that you need to add that method Now I realized I've chosen the wrong components so this component actually does not use that storage concept [00:02:47](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m47s) But there is another one that does let's open that one instead then So again we are in Helper admin class And we have a function called Store message and this is in the components That where you edit your component So this store message has what we call a signature Values that it is passing to the method And in the The [00:03:19](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m19s) Email helper class You see that it Also has A signature But wherever it gives this = with a value That means that that's the default value so if you do not add A value for this position there is one two three four fifth position Then it will default to 0 if we do not add this it will default to null So From there all the way to the end all of those values haves basically the [00:03:51](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m51s) Null value So In reality you only need to add you know these values the first four But Those values are all used in this method So if you wanna understand exactly how these value should look look inside of the method Read through the method And you will see So Making a long story short [00:04:17](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m17s) We end up here at this little script Basically ask whether you created the method or not If you didn't it simple skips it and returns the value of send mail if it sees That you have created it It'll pass these variables that correspond to the signature And then inside of that method that is in your helper class That is now this method You need to do the necessary checks and balances And discovering For example since you've got the email address [00:04:52](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m52s) You can Search with the getVar In the user class It must equal Email Recipient = email And then returns to us the ID So [00:05:09](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m09s) That is basically how the getVar works And Then when we have the user ID We can obviously make sure it's The number and we set it to our message as user And we set it as the email and now we can store The message in whatever table or do whatever we wanna do Beyond The normal So even if you wanna do other things except [00:05:38](https://www.youtube.com/watch?v=peVNLsAncGY&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m38s) Storing the message This is the method inside of which you can do it so store message Is the method inside which you can do some more custom scripting On top of your email integration Ok so that's just quickly giving a little bit more depth on that specific aspect Of using The email class in your component Thank you for watching