From c19dba079f2b09d013c2b6d978a63582c525e84c Mon Sep 17 00:00:00 2001 From: Amigo <49749100+aamigo@users.noreply.github.com> Date: Mon, 30 Sep 2019 15:47:41 +0200 Subject: [PATCH] Updated 068 Library Manager Anticipated Functionality (markdown) --- 068-Library-Manager-Anticipated-Functionality.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/068-Library-Manager-Anticipated-Functionality.md b/068-Library-Manager-Anticipated-Functionality.md index d0c40d0..2e1a45e 100644 --- a/068-Library-Manager-Anticipated-Functionality.md +++ b/068-Library-Manager-Anticipated-Functionality.md @@ -23,5 +23,4 @@ The other one is a conditional option. The conditional option is the better opti [00:05:40](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m40s) -???? -We'll see in Option Field drop down that that field comes up here. If we select it that fields have two options, yes or no. So if this '(Url) bootstrap.min.css - link' library and '(url) bootstrap.min.js - link' library File we wanna include it When add Bootstrap button is set to [00:05:57](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m57s) Yes So here is a selection option Now so that's the conditional way of doing So basically at this stage we will have 3 to 4 ways of Actually adding the the fields onto the page The reason why this conditional one Is not being shipped This way the moment [00:06:18](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m18s) Because I'm not shipping these fields And The whole idea of You know creating a field on all of those who In all the systems of those who used JCB I'm still pondering whether I should write a script To do that So it's that's really the issue if If we shipped this as the The standard way of including the Bootstrap libraries [00:06:43](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m43s) Then I will need to create this add Bootstrap version 4 field On every system And then link it in here with correct IDs ans stuff And So I haven't I haven't actually done that Like I said We are now looking at how can we do this We wanna make this dynamic Because now let's say someone Has a specific [00:07:05](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m05s) File The day so let me just save this that specific file Which If if someone is using Bootstrap and they wanna add a specific extra feature and I need more More JavaScript on the page You know they could create that file Click here By going to add new files I know let's say it's a local file they could click here [00:07:31](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m31s) And they can collect Any file of just gonna make it Any file And just like with a component include When you add custom files to your component You have that same feature really here except you can also use URLs So it's the same custom adding of files or folders So now you want to have this Bootstrap Min.js In the media [00:07:58](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m58s) Boot Strap Bootstrap 4 there we go You wanted in that folder js That's really where you want to put this file And you don't want the file itself to be updated that filename you wanna keep And you want to have it available to the library So now you click save and close [00:08:23](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m23s) So now if we look here we'll see now there is a file called Bootstrap min.js But you don't want to always be included You wanted to be included only if there is a specific Switch Tripped On on this Use of this file The idea is now that you would go to the config library And you create a new field And [00:08:51](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m51s) Let's say that this new field is Let's say I'm just gonna use a Add more And Obviously it should be more related to Bootstrap but just for explanation Then you would say that specific field which it Is this cases It's this one Should When add more is set yes [00:09:15](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m15s) Then it should be Added Now That is as far as I've come to Sort of Think about Implementing These kind of features Dynamically You see previously I wrote all this hard coded right into the compiler [00:09:33](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m33s) And based on its own automated Observation of the you know UIkit version 2 If it founds specific classes it dynamically added files or didn't add files Now I'm thinking that If you wanna be so Customised and dynamic then you won't use the conditional option you'll rather use the custom script option You still have these two buttons That you can then use The global [00:10:02](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m02s) Values of You can still get those values In the scripture And act upon it and load in the libraries with custom scripting now I I did some Prep on that kind of approached here in FooTable It's actually Says here This FooTable Style So [00:10:25](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m25s) You need to now Actually line up a field value With FooTable Style And then it will dynamically add the specific CSS classes To the to the table to the page For both this prepared document And for Set document So you have [00:10:46](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m46s) Add always then you have add conditions Or custom script Let me just say another thing about the condition option The condition option I'm pondering Whether this condition option should have a global value And also a page value You see if it have a page value Then you can overwrite the global value with the page value So it's almost like if we detect [00:11:13](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m13s) That let's say bootstrap 4 Is being used in a specific View And that view has a menu Then dynamically will add to that menu The function of these buttons As well as having it added up into the global options of the component itself So it'll be Global options And the page will fall back on to the global options Unless someone with manually overwrite that in the because when when is that usually the case If they have another library or another component [00:11:47](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m47s) That already loads the files and they wanna excluded from the page because it's already there And that's why I'm thinking about You know having it on the page as well as globally And if you feel well I don't want to use it to really decide whether these You know Libraries Should Ever Be on the page well then in that case add always And then these files will Including this one Will always be added to the page [00:12:15](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m15s) And we will take care of the script The code to achieve that And now I was also thinking if we Wanna have some files only be added always then Then it is the files that you do not actually You know If you want For example if you want These two files to be always added Then within conditions you will only create a condition [00:12:43](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m43s) For the files you want to have a condition for So that the files that is not being targeted by conditions Will automatically always be added Anyway That is at this stage some of the thoughts I have I'm thinking I'm gonna Say that if any of you wanna give more ideas Then grab out your screen recorder Open this page [00:13:09](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m09s) And talk through and explain some things In a little tutorial Post it on YouTube as a response to this tutorial Or go to our GitHub discussion area You know we are busy with this Discussion here On GitHub it's issue 92 [00:13:29](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m29s) Bootstrap or UIkit Version 3 or Bootstrap option It's in this issue that this long discussion is going on And where this whole library idea is actually Forming and Expanding you'll see already typed a little response here what I wanna post With this tutorial that I'm making as a URL So Really what I would like to say is I'm busy [00:13:57](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m57s) Trying to Answer this new functionality And This is the way I've gone about doing it at this stage And I I know that these Libraries that are already in our a component Bootstrap UI kit and fooTable I'm gonna end up Adding enough information for these libraries So did they all just work out of the box [00:14:22](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m22s) That's gonna be my responsibility to To put all the necessary Code and scripting and everything in place So that this option will just work All of them And just when someone wants to expand on them Will they need to do so But it is obviously a once off situation Once I've implemented this new feature and set these functions and Properties in place [00:14:48](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m48s) And people make adaptations to it I cannot update it again And so having enough input to think about all possible angles And to approach this in a way that really makes it dynamic and really doesn't overcomplicate things Is really what I'm trying to achieve although that seems difficult Anyway This is just a heads up tutorial Looking at how to Use the new libraries area And obviously if you want a specific functionality in Bootstrap 4 [00:15:21](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m21s) You cannot now create a new Bootstrap 4 library With new files you need to expand on the existing one And that's the whole point We wanna make it that the existing library can be adapted and changed An improved At this stage that adaptation in those improvements will only be relevant to the one who's doing it And so that might be something we were gonna think about We gonna you should talk about would we want everybody to share their adaptations Or will we just set the stage with your regional adaptation and then whatever changes they make is up to them [00:16:04](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m04s) Anyway this is a Again a tutorial I just made In the outset of this new functionality Looking in asking please give me feedback And let me know what you think Thank you +We'll see in Option Field drop down that that field comes up here. If we select it that fields have two options, yes or no. So if this '(Url) bootstrap.min.css - link' library and '(url) bootstrap.min.js - link' library file we want to include it when the Add Bootstrap button is set to [00:05:57](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m57s) Yes. So here is a selection option Now so that's the conditional way of doing So basically at this stage we will have 3 to 4 ways of Actually adding the the fields onto the page The reason why this conditional one Is not being shipped This way the moment [00:06:18](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m18s) Because I'm not shipping these fields And The whole idea of You know creating a field on all of those who In all the systems of those who used JCB I'm still pondering whether I should write a script To do that So it's that's really the issue if If we shipped this as the The standard way of including the Bootstrap libraries [00:06:43](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h06m43s) Then I will need to create this add Bootstrap version 4 field On every system And then link it in here with correct IDs ans stuff And So I haven't I haven't actually done that Like I said We are now looking at how can we do this We wanna make this dynamic Because now let's say someone Has a specific [00:07:05](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m05s) File The day so let me just save this that specific file Which If if someone is using Bootstrap and they wanna add a specific extra feature and I need more More JavaScript on the page You know they could create that file Click here By going to add new files I know let's say it's a local file they could click here [00:07:31](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m31s) And they can collect Any file of just gonna make it Any file And just like with a component include When you add custom files to your component You have that same feature really here except you can also use URLs So it's the same custom adding of files or folders So now you want to have this Bootstrap Min.js In the media [00:07:58](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h07m58s) Boot Strap Bootstrap 4 there we go You wanted in that folder js That's really where you want to put this file And you don't want the file itself to be updated that filename you wanna keep And you want to have it available to the library So now you click save and close [00:08:23](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m23s) So now if we look here we'll see now there is a file called Bootstrap min.js But you don't want to always be included You wanted to be included only if there is a specific Switch Tripped On on this Use of this file The idea is now that you would go to the config library And you create a new field And [00:08:51](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h08m51s) Let's say that this new field is Let's say I'm just gonna use a Add more And Obviously it should be more related to Bootstrap but just for explanation Then you would say that specific field which it Is this cases It's this one Should When add more is set yes [00:09:15](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m15s) Then it should be Added Now That is as far as I've come to Sort of Think about Implementing These kind of features Dynamically You see previously I wrote all this hard coded right into the compiler [00:09:33](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h09m33s) And based on its own automated Observation of the you know UIkit version 2 If it founds specific classes it dynamically added files or didn't add files Now I'm thinking that If you wanna be so Customised and dynamic then you won't use the conditional option you'll rather use the custom script option You still have these two buttons That you can then use The global [00:10:02](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m02s) Values of You can still get those values In the scripture And act upon it and load in the libraries with custom scripting now I I did some Prep on that kind of approached here in FooTable It's actually Says here This FooTable Style So [00:10:25](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m25s) You need to now Actually line up a field value With FooTable Style And then it will dynamically add the specific CSS classes To the to the table to the page For both this prepared document And for Set document So you have [00:10:46](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h10m46s) Add always then you have add conditions Or custom script Let me just say another thing about the condition option The condition option I'm pondering Whether this condition option should have a global value And also a page value You see if it have a page value Then you can overwrite the global value with the page value So it's almost like if we detect [00:11:13](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m13s) That let's say bootstrap 4 Is being used in a specific View And that view has a menu Then dynamically will add to that menu The function of these buttons As well as having it added up into the global options of the component itself So it'll be Global options And the page will fall back on to the global options Unless someone with manually overwrite that in the because when when is that usually the case If they have another library or another component [00:11:47](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h11m47s) That already loads the files and they wanna excluded from the page because it's already there And that's why I'm thinking about You know having it on the page as well as globally And if you feel well I don't want to use it to really decide whether these You know Libraries Should Ever Be on the page well then in that case add always And then these files will Including this one Will always be added to the page [00:12:15](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m15s) And we will take care of the script The code to achieve that And now I was also thinking if we Wanna have some files only be added always then Then it is the files that you do not actually You know If you want For example if you want These two files to be always added Then within conditions you will only create a condition [00:12:43](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h12m43s) For the files you want to have a condition for So that the files that is not being targeted by conditions Will automatically always be added Anyway That is at this stage some of the thoughts I have I'm thinking I'm gonna Say that if any of you wanna give more ideas Then grab out your screen recorder Open this page [00:13:09](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m09s) And talk through and explain some things In a little tutorial Post it on YouTube as a response to this tutorial Or go to our GitHub discussion area You know we are busy with this Discussion here On GitHub it's issue 92 [00:13:29](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m29s) Bootstrap or UIkit Version 3 or Bootstrap option It's in this issue that this long discussion is going on And where this whole library idea is actually Forming and Expanding you'll see already typed a little response here what I wanna post With this tutorial that I'm making as a URL So Really what I would like to say is I'm busy [00:13:57](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h13m57s) Trying to Answer this new functionality And This is the way I've gone about doing it at this stage And I I know that these Libraries that are already in our a component Bootstrap UI kit and fooTable I'm gonna end up Adding enough information for these libraries So did they all just work out of the box [00:14:22](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m22s) That's gonna be my responsibility to To put all the necessary Code and scripting and everything in place So that this option will just work All of them And just when someone wants to expand on them Will they need to do so But it is obviously a once off situation Once I've implemented this new feature and set these functions and Properties in place [00:14:48](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m48s) And people make adaptations to it I cannot update it again And so having enough input to think about all possible angles And to approach this in a way that really makes it dynamic and really doesn't overcomplicate things Is really what I'm trying to achieve although that seems difficult Anyway This is just a heads up tutorial Looking at how to Use the new libraries area And obviously if you want a specific functionality in Bootstrap 4 [00:15:21](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m21s) You cannot now create a new Bootstrap 4 library With new files you need to expand on the existing one And that's the whole point We wanna make it that the existing library can be adapted and changed An improved At this stage that adaptation in those improvements will only be relevant to the one who's doing it And so that might be something we were gonna think about We gonna you should talk about would we want everybody to share their adaptations Or will we just set the stage with your regional adaptation and then whatever changes they make is up to them [00:16:04](https://www.youtube.com/watch?v=joT8weuPcwU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m04s) Anyway this is a Again a tutorial I just made In the outset of this new functionality Looking in asking please give me feedback And let me know what you think Thank you