[Kimchi-devel] [PATCH][Wok 1/2] Use javascript libraries from rpms

[Ramon Medeiros]

On 08/22/2016 01:35 PM, Aline Manera wrote:
>
>
> On 08/12/2016 01:55 PM, Ramon Medeiros wrote:
>> Some javascript libraries didn't need to be hardcoded. So, add them to
>> packages dependency and import them at frontend files
>>
>> Signed-off-by: Ramon Medeiros <ramonn at linux.vnet.ibm.com>
>> ---
>>   docs/fedora-deps.md              |   4 +-
>>   docs/ubuntu-deps.md              |   3 +-
>>   src/wok/config.py.in             |  22 +++
>
>>   ui/pages/login.html.tmpl.fedora  | 332 
>> +++++++++++++++++++++++++++++++++++++++
>>   ui/pages/login.html.tmpl.ubuntu  | 332 
>> +++++++++++++++++++++++++++++++++++++++
>>   ui/pages/wok-ui.html.tmpl.fedora | 231 +++++++++++++++++++++++++++
>>   ui/pages/wok-ui.html.tmpl.ubuntu | 231 +++++++++++++++++++++++++++
>
> You don't need to create a specific file for each distro to get the 
> right file path placed there.
>
> All the files *.html.tmpl are processed in the backend. Look at 
> default() function in root.py
> The render() function in template.py does the magic. The 'data' 
> parameter is a dict of data. In the *.html.tmpl file you just need to 
> add a variable, for example:
>
> <script src="$jquery-ui-file-path"></script>
>
> Then you need to proper add 'jquery-ui-file-path' to the data dict and 
> the Template will be set as desired.
>
> Does that make sense?
>
yes. Can i have the distro from this dict? if true, i can import the 
logic from the makefiles and skip the problem
> Please, let me know if you need help to do that.
>
>>   7 files changed, 1153 insertions(+), 2 deletions(-)
>>   create mode 100644 ui/pages/login.html.tmpl.fedora
>>   create mode 100644 ui/pages/login.html.tmpl.ubuntu
>>   create mode 100644 ui/pages/wok-ui.html.tmpl.fedora
>>   create mode 100644 ui/pages/wok-ui.html.tmpl.ubuntu
>>
>> diff --git a/docs/fedora-deps.md b/docs/fedora-deps.md
>> index e665cdb..337f75a 100644
>> --- a/docs/fedora-deps.md
>> +++ b/docs/fedora-deps.md
>> @@ -28,7 +28,9 @@ Runtime Dependencies
>>       $ sudo yum install python-cherrypy python-cheetah PyPAM m2crypto \
>>                           python-jsonschema python-psutil python-ldap \
>>                           python-lxml nginx openssl open-sans-fonts \
>> -                        fontawesome-fonts logrotate
>> +                        fontawesome-fonts logrotate js-jquery \
>> +                        js-moment js-typeahead.js 
>> nodejs-lodash.noarch \
>> +                        nodejs-es5-shim
>>         # For RHEL systems, install the additional packages:
>>       $ sudo yum install python-ordereddict
>> diff --git a/docs/ubuntu-deps.md b/docs/ubuntu-deps.md
>> index 3a0f75c..0fe0038 100644
>> --- a/docs/ubuntu-deps.md
>> +++ b/docs/ubuntu-deps.md
>> @@ -18,7 +18,8 @@ Runtime Dependencies
>>       $ sudo apt-get install python-cherrypy3 python-cheetah 
>> python-pam \
>>                               python-m2crypto python-jsonschema \
>>                               python-psutil python-ldap python-lxml 
>> nginx \
>> -                            openssl fonts-font-awesome 
>> texlive-fonts-extra
>> +                            openssl fonts-font-awesome 
>> texlive-fonts-extra \
>> +                            libjs-jquery libjs-lodash jquery-ui 
>> libjs-bootstrap
>>     Packages required for UI development
>>   ------------------------------------
>> diff --git a/src/wok/config.py.in b/src/wok/config.py.in
>> index cbe585c..c007935 100644
>> --- a/src/wok/config.py.in
>> +++ b/src/wok/config.py.in
>> @@ -57,6 +57,15 @@ FONTS_PATH = {
>>       ]
>>   }
>
>>   +JS_LIBS = {
>> +    "jquery" : "/usr/share/javascript/jquery/2.1.3/jquery.min.js",
>
> Having the version number as part of the file path is really dangerous 
> for us.
> That means the UI will not work as expected when some newer or older 
> version is installed.
>
> Said that, I recommend to use the glob module to find the file path.
> For example.
>
> import glob
>
> filepaths = glob.glob('/usr/share/javascript/jquery/*/jquery.min.js')
>
> That will return a list of files found. So you sort the result and get 
> the newer version.
>
> Does that make sense?
>
>> +    "lodash" : "/usr/lib/node_modules/lodash/lodash.js",
>> +    "moment" : 
>> "/usr/share/javascript/moment/min/moment-with-locales.min.js",
>> +    "typeahead" : 
>> "/usr/share/javascript/typeahead.js/dist/typeahead.bundle.min.js",
>> +    "es5-shim" : "/usr/lib/node_modules/es5-shim/es5-shim.min.js"
>> +}
>> +
>> +
>>     def get_log_download_path():
>>       return os.path.join(paths.state_dir, 'logs')
>> @@ -103,6 +112,11 @@ class Paths(object):
>>                   if os.path.exists(font_file):
>>                       setattr(self, '%s_dir' % font, path)
>>   +        for js in JS_LIBS.keys():
>> +            path = JS_LIBS[js]
>> +            if os.path.exists(path):
>> +                setattr(self, '%s_dir' % js, path)
>> +
>>       def get_prefix(self):
>>           if __file__.startswith("/"):
>>               base = os.path.dirname(__file__)
>> @@ -172,6 +186,14 @@ class UIConfig(dict):
>>                           'tools.wokauth.on': False,
>>                           'tools.nocache.on': False}
>>   +        for js, file in JS_LIBS.iteritems():
>> +            if os.path.exists(file):
>> +                ui_configs['/js/%s' % os.path.basename(file) ] = {
>> +                    'tools.staticfile.on': True,
>> +                    'tools.staticfile.filename': file,
>> +                    'tools.wokauth.on': False,
>> +                    'tools.nocache.on': False}
>> +
>>           self.update(ui_configs)
>>
>

-- 

Ramon Nunes Medeiros
Kimchi Developer
Linux Technology Center Brazil
IBM Systems & Technology Group
Phone : +55 19 2132 7878
ramonn at br.ibm.com