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

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(a)linux.vnet.ibm.com&gt; --- 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 +++++++++++++++++++++++++++ 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", + "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) diff --git a/ui/pages/login.html.tmpl.fedora b/ui/pages/login.html.tmpl.fedora new file mode 100644 index 0000000..22aa8f1 --- /dev/null +++ b/ui/pages/login.html.tmpl.fedora @@ -0,0 +1,332 @@ +#* + * Project Wok + * + * Copyright IBM Corp, 2014-2016 + * + * Code derived from Project Kimchi + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + *# +#unicode UTF-8 +#import gettext +#from wok.cachebust import href +#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True) +#silent _ = t.gettext +#silent _t = t.gettext +#silent next = "?next=%s" % $getVar('data.next', '') if $getVar('data.next', '') else "" +#from wok.config import get_version +<!DOCTYPE html> +<html lang="$lang.lang[0]"> +<head> + <meta charset="UTF-8"> + <title>Wok</title> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta name="apple-mobile-web-app-title" content="Wok"> + <link href="$href('images/apple-touch-icon-57x57.png')" sizes="57x57" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-72x72.png')" sizes="72x72" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-76x76.png')" sizes="76x76" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-114x114.png')" sizes="114x114" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-144x144.png')" sizes="144x144" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-152x152.png')" sizes="152x152" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-180x180.png')" sizes="120x120" rel="apple-touch-icon-precomposed"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-36x36.png')" sizes="36x36"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-48x48.png')" sizes="48x48"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-72x72.png')" sizes="72x72"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-144x144.png')" sizes="144x144"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-192x192.png')" sizes="192x192"> + <link rel="icon" type="image/png" href="$href('images/favicon-16x16.png')" sizes="16x16"> + <link rel="icon" type="image/png" href="$href('images/favicon-32x32.png')" sizes="32x32"> + <link rel="icon" type="image/png" href="$href('images/favicon-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/favicon-194x194.png')" sizes="194x194"> + <link rel="mask-icon" href="$href('images/safari-pinned-tab.svg')" color="#5bbad5"> + <meta name="application-name" content="Wok"> + <meta name="msapplication-config" content="none" /> + <meta name="msapplication-TileColor" content="#f73434" /> + <meta name="msapplication-square70x70logo" content="$href('images/mstile-70x70.png')" /> + <meta name="msapplication-square150x150logo" content="$href('images/mstile-150x150.png')" /> + <meta name="msapplication-wide310x150logo" content="$href('images/mstile-310x310.png')" /> + <meta name="msapplication-square310x310logo" content="$href('images/mstile-310x150.png')" /> + <link rel="stylesheet" href="$href('libs/jquery-ui/themes/base/jquery-ui.min.css')"> + <link rel="stylesheet" href="$href('css/jquery-ui.custom.css')"> + <link rel="stylesheet" href="$href('css/bootstrap.custom.css')"> + <link rel="stylesheet" href="$href('libs/bootstrap-select/dist/css/bootstrap-select.min.css')"> + <link rel="stylesheet" href="$href('libs/datatables/css/datatables.min.css')"> + <link rel="stylesheet" href="$href('css/fontawesome/fontawesome.css')"> + <link rel="stylesheet" href="$href('css/opensans/opensans.css')"> + <link rel="stylesheet" href="$href('css/bootstrap-select.custom.css')"> + <link rel="stylesheet" href="$href('css/datatables.bootstrap.css')"> + <link rel="stylesheet" href="$href('css/wok.css')"> + <script src="js/es5-shim.min.js"></script> + <script src="js/jquery.min.js"></script> + <script src="$href('libs/jquery-ui/jquery-ui.min.js')"></script> + <script src="$href('libs/jquery-ui/jquery-ui-i18n.min.js')"></script> + <script src="$href('libs/jquery-i18n/jquery.i18n.min.js')"></script> + <script src="$href('libs/bootstrap/bootstrap.min.js')"></script> + <script src="$href('libs/bootstrap-select/dist/js/bootstrap-select.min.js')"></script> + <script src="js/lodash.js"></script> + <script src="js/moment-with-locales.min.js"></script> + <script src="$href('libs/datatables/js/datatables.min.js')"></script> + <script src="$href('js/wok.min.js')"></script> +</head> +<body class="login" onload="wok.login_main()"> + <div class="topbar"> + <nav class="navbar navbar-inverse"> + <div class="container"> + <div class="navbar-header"> + <a class="navbar-brand" href="#">Wok</a> + </div> + </div> + </nav> + <nav class="navbar navbar-default"> + <div class="container"> + <div class="navbar-header"> + </div> + <ul class="nav navbar-nav"> + <li class="hostname"><span class="host-location"></span></li> + </ul> + </div> + </nav> + </div> + <div class="content"> + <div class="container"> + <div id="login-window" class="login-area row"> + <div class="err-area"> + <div id="messUserPass" class="alert alert-danger" style="display: none;">$_("The username or password you entered is incorrect. Please try again.")</div> + <div id="messSession" class="alert alert-danger" style="display: none;">$_("Session timeout, please re-login.")</div> + <div id="missServer" class="alert alert-danger" style="display: none;">$_("Server unreachable.")</div> + </div> + <form id="form-login" class="form-horizontal" method="post"> + <div class="form-group"> + <label for="username" class="sr-only">$_("User Name")</label> + <input type="text" class="form-control" id="username" name="username" required="required" placeholder="$_(" User Name ")" autofocus autocomplete="off" /> + <div id="username-msg" class="msg-required"></div> + </div> + <div class="form-group"> + <label for="password" class="sr-only">$_("Password")</label> + <input type="password" class="form-control" id="password" name="password" required="required" placeholder="$_(" Password ")" autocomplete="off" /> + <div id="password-msg" class="msg-required"></div> + </div> + <div class="form-group"> + <button id="btn-login" class="btn btn-login col-md-12 col-lg-12"> + <span id="login">$_("Log in")</span> + <span id="logging" style="display: none;">$_("Logging in...")</span> + </button> + </div> + <div class="form-group"> + <label for="userLang">$_("Language")</label> + <select id="userLang" class="selectpicker col-md-12 col-lg-12"> + <option value="en_US">English (US)</option> + <option value="zh_CN">中文（简体）</option> + <option value="pt_BR">Português (Brasil)</option> + <option value="de_DE">Deutsch (Deutschland)</option> + <option value="es_ES">Español (España)</option> + <option value="fr_FR">Français (France)</option> + <option value="it_IT">Italiano (Italia)</option> + <option value="ja_JP">日本語 (日本)</option> + <option value="ko_KR">한국어 (대한민국)</option> + <option value="ru_RU">Русский (Россия)</option> + <option value="zh_TW">中文（繁體）</option> + </select> + </div> + <div class="form-group"> + <label for="userLocale">$_("Locale")</label> + <select id="userLocale" class="selectpicker col-md-12 col-lg-12"> + <option value="af-ZA">Afrikaans (South Africa)</option> + <option value="sq-AL">Albanian (Albania)</option> + <option value="am-ET">Amharic (Ethiopia)</option> + <option value="ar-DZ">Arabic (Algeria)</option> + <option value="ar-BH">Arabic (Bahrain)</option> + <option value="ar-EG">Arabic (Egypt)</option> + <option value="ar-IQ">Arabic (Iraq)</option> + <option value="ar-JO">Arabic (Jordan)</option> + <option value="ar-KW">Arabic (Kuwait)</option> + <option value="ar-LB">Arabic (Lebanon)</option> + <option value="ar-LY">Arabic (Libya)</option> + <option value="ar-MR">Arabic (Mauritania)</option> + <option value="ar-MA">Arabic (Morocco)</option> + <option value="ar-OM">Arabic (Oman)</option> + <option value="ar-QA">Arabic (Qatar)</option> + <option value="ar-SA">Arabic (Saudi Arabia)</option> + <option value="ar-SY">Arabic (Syria)</option> + <option value="ar-TN">Arabic (Tunisia)</option> + <option value="ar-AE">Arabic (United Arab Emirates)</option> + <option value="ar-YE">Arabic (Yemen)</option> + <option value="hy-AM">Armenian (Armenia)</option> + <option value="as-IN">Assamese (India)</option> + <option value="az-AZ">Azerbaijani (Azerbaijan)</option> + <option value="eu-ES">Basque (Spain)</option> + <option value="be-BY">Belarusian (Belarus)</option> + <option value="bn-BD">Bengali (Bangladesh)</option> + <option value="bn-IN">Bengali (India)</option> + <option value="bs-BA">Bosnian (Bosnia)</option> + <option value="bg-BG">Bulgarian (Bulgaria)</option> + <option value="my-MM">Burmese (Myanmar)</option> + <option value="ca-ES">Catalan (Spain)</option> + <option value="zh-CN">Chinese-simplified (China)</option> + <option value="zh-SG">Chinese-simplified (Singapore)</option> + <option value="zh-HK">Chinese-traditional (Hong Kong S.A.R. of China)</option> + <option value="zh-MO">Chinese-traditional (Macao)</option> + <option value="zh-TW">Chinese-traditional (Taiwan)</option> + <option value="hr-HR">Croatian (Croatia)</option> + <option value="cs-CZ">Czech (Czech Republic)</option> + <option value="da-DK">Danish (Denmark)</option> + <option value="nl-BE">Dutch (Belgium)</option> + <option value="nl-NL">Dutch (The Netherlands)</option> + <option value="en-AU">English (Australia)</option> + <option value="en-BE">English (Belgium)</option> + <option value="en-CM">English (Cameroon)</option> + <option value="en-CA">English (Canada)</option> + <option value="en-GH">English (Ghana)</option> + <option value="en-HK">English (Hong Kong S.A.R. of China)</option> + <option value="en-IN">English (India)</option> + <option value="en-IE">English (Ireland)</option> + <option value="en-KE">English (Kenya)</option> + <option value="en-MU">English (Mauritius)</option> + <option value="en-NZ">English (New Zealand)</option> + <option value="en-NG">English (Nigeria)</option> + <option value="en-PH">English (Philippines)</option> + <option value="en-SG">English (Singapore)</option> + <option value="en-ZA">English (South Africa)</option> + <option value="en-TZ">English (Tanzania)</option> + <option value="en-GB">English (United Kingdom)</option> + <option value="en-US">English (United States)</option> + <option value="en-ZM">English (Zambia)</option> + <option value="et-EE">Estonian (Estonia)</option> + <option value="tl-PH">Filipino (Philippines)</option> + <option value="fi-FI">Finnish (Finland)</option> + <option value="fr-DZ">French (Algeria)</option> + <option value="fr-CM">French (Cameroon)</option> + <option value="fr-CD">French (Democratic Republic of the Congo)</option> + <option value="fr-BE">French (Belgium)</option> + <option value="fr-CA">French (Canada)</option> + <option value="fr-FR">French (France)</option> + <option value="fr-CI">French (Ivory Coast [Côte d’Ivoire])</option> + <option value="fr-LU">French (Luxembourg)</option> + <option value="fr-MR">French (Mauritania)</option> + <option value="fr-MU">French (Mauritius)</option> + <option value="fr-MA">French (Morocco)</option> + <option value="fr-SN">French (Senegal)</option> + <option value="fr-CH">French (Switzerland)</option> + <option value="fr-TN">French (Tunisia)</option> + <option value="gl-ES">Galician (Spain)</option> + <option value="lg-UG">Ganda (Uganda)</option> + <option value="ka-GE">Georgian (Georgia)</option> + <option value="de-AT">German (Austria)</option> + <option value="de-DE">German (Germany)</option> + <option value="de-LU">German (Luxembourg)</option> + <option value="de-CH">German (Switzerland)</option> + <option value="el-GR">Greek (Greece)</option> + <option value="gu-IN">Gujarati (India)</option> + <option value="ha-NG">Hausa (Nigeria)</option> + <option value="he-IL">Hebrew (Israel)</option> + <option value="hi-IN">Hindi (India)</option> + <option value="hu-HU">Hungarian (Hungary)</option> + <option value="is-IS">Icelandic (Iceland)</option> + <option value="ig-NG">Igbo (Nigeria)</option> + <option value="id-ID">Indonesian (Indonesia)</option> + <option value="it-IT">Italian (Italy)</option> + <option value="it-CH">Italian (Switzerland)</option> + <option value="ja-JP">Japanese (Japan)</option> + <option value="kn-IN">Kannada (India)</option> + <option value="kk-KZ">Kazakh (Kazakhstan)</option> + <option value="km-KH">Khmer (Cambodia)</option> + <option value="rw-RW">Kinyarwanda (Rwanda)</option> + <option value="kok-IN">Konkani (India)</option> + <option value="ko-KR">Korean (Korea, South)</option> + <option value="lo-LA">Lao (Laos)</option> + <option value="lv-LV">Latvian (Latvia)</option> + <option value="lt-LT">Lithuanian (Lithuania)</option> + <option value="mk-MK">Macedonian (Macedonia)</option> + <option value="ms-MY">Malay-Latin (Malaysia)</option> + <option value="ml-IN">Malayalam (India)</option> + <option value="mt-MT">Maltese (Malta)</option> + <option value="mr-IN">Marathi (India)</option> + <option value="mn-Cyrl-MN">Mongolian-Cyrillic (Mongolia)</option> + <option value="ne-IN">Nepali (India)</option> + <option value="ne-NP">Nepali (Nepal)</option> + <option value="nb-NO">Norwegian Bokmål (Norway)</option> + <option value="nn-NO">Norwegian Nynorsk (Norway)</option> + <option value="or-IN">Oriya [aka, Odia] (India)</option> + <option value="om-ET">Oromo (Ethiopia)</option> + <option value="pl-PL">Polish (Poland)</option> + <option value="pt-AO">Portuguese (Angola)</option> + <option value="pt-BR">Portuguese (Brazil)</option> + <option value="pt-MO">Portuguese (Macao)</option> + <option value="pt-MZ">Portuguese (Mozambique)</option> + <option value="pt-PT">Portuguese (Portugal)</option> + <option value="pa-IN">Punjabi (India)</option> + <option value="ro-RO">Romanian (Romania)</option> + <option value="ru-RU">Russian (Russia)</option> + <option value="sr-RS">Serbian-Cyrillic (Serbia)</option> + <option value="sr-ME">Serbian-Latin (Montenegro)</option> + <option value="sr-Latn-RS">Serbian-Latin (Serbia)</option> + <option value="si-LK">Sinhala (Sri Lanka)</option> + <option value="sk-SK">Slovak (Slovakia)</option> + <option value="sl-SI">Slovenian (Slovenia)</option> + <option value="es-AR">Spanish (Argentina)</option> + <option value="es-BO">Spanish (Bolivia)</option> + <option value="es-CL">Spanish (Chile)</option> + <option value="es-CO">Spanish (Colombia)</option> + <option value="es-CR">Spanish (Costa Rica)</option> + <option value="es-DO">Spanish (Dominican Republic)</option> + <option value="es-EC">Spanish (Ecuador)</option> + <option value="es-SV">Spanish (El Salvador)</option> + <option value="es-GT">Spanish (Guatemala)</option> + <option value="es-HN">Spanish (Honduras)</option> + <option value="es-MX">Spanish (Mexico)</option> + <option value="es-NI">Spanish (Nicaragua)</option> + <option value="es-PA">Spanish (Panama)</option> + <option value="es-PY">Spanish (Paraguay)</option> + <option value="es-PE">Spanish (Peru)</option> + <option value="es-PR">Spanish (Puerto Rico)</option> + <option value="es-ES">Spanish (Spain)</option> + <option value="es-US">Spanish (United States)</option> + <option value="es-UY">Spanish (Uruguay)</option> + <option value="es-VE">Spanish (Venezuela)</option> + <option value="sw-KE">Swahili (Kenya)</option> + <option value="sw-TZ">Swahili (Tanzania)</option> + <option value="sv-SE">Swedish (Sweden)</option> + <option value="ta-IN">Tamil (India)</option> + <option value="te-IN">Telugu (India)</option> + <option value="th-TH">Thai (Thailand)</option> + <option value="tr-TR">Turkish (Turkey)</option> + <option value="uk-UA">Ukrainian (Ukraine)</option> + <option value="ur-IN">Urdu (India)</option> + <option value="ur-PK">Urdu (Pakistan)</option> + <option value="uz-Cyrl-UZ">Uzbek-Cyrillic (Uzbekistan)</option> + <option value="uz-Latn-UZ">Uzbek-Latin (Uzbekistan)</option> + <option value="vi-VN">Vietnamese (Vietnam)</option> + <option value="cy-GB">Welsh (United Kingdom)</option> + <option value="yo-NG">Yoruba (Nigeria)</option> + <option value="zu-ZA">Zulu (South Africa)</option> + <option value="az-AZ">Azerbaijani-Latin (Azerbaijan)</option> + <option value="sr-CS">Serbian-Cyrillic ()</option> + <option value="sr-Cyrl-CS">Serbian-Cyrillic (Serbia and Montenegro)</option> + <option value="sr-Latn-CS">Serbian-Latin (Serbia and Montenegro)</option> + </select> + </div> + </form> + </div> + <div class="row"> + <div class="col-lg-4 delayed-fadein"> + <p class="text-muted powered hidden">Powered by:</p> + <ul id="wok-logos" class="list-inline"></ul> + </div> + </div> + </div> + </div> +</body> +</html> diff --git a/ui/pages/login.html.tmpl.ubuntu b/ui/pages/login.html.tmpl.ubuntu new file mode 100644 index 0000000..3d8ddcc --- /dev/null +++ b/ui/pages/login.html.tmpl.ubuntu @@ -0,0 +1,332 @@ +#* + * Project Wok + * + * Copyright IBM Corp, 2014-2016 + * + * Code derived from Project Kimchi + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + *# +#unicode UTF-8 +#import gettext +#from wok.cachebust import href +#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True) +#silent _ = t.gettext +#silent _t = t.gettext +#silent next = "?next=%s" % $getVar('data.next', '') if $getVar('data.next', '') else "" +#from wok.config import get_version +<!DOCTYPE html> +<html lang="$lang.lang[0]"> +<head> + <meta charset="UTF-8"> + <title>Wok</title> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta name="apple-mobile-web-app-title" content="Wok"> + <link href="$href('images/apple-touch-icon-57x57.png')" sizes="57x57" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-72x72.png')" sizes="72x72" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-76x76.png')" sizes="76x76" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-114x114.png')" sizes="114x114" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-144x144.png')" sizes="144x144" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-152x152.png')" sizes="152x152" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-180x180.png')" sizes="120x120" rel="apple-touch-icon-precomposed"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-36x36.png')" sizes="36x36"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-48x48.png')" sizes="48x48"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-72x72.png')" sizes="72x72"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-144x144.png')" sizes="144x144"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-192x192.png')" sizes="192x192"> + <link rel="icon" type="image/png" href="$href('images/favicon-16x16.png')" sizes="16x16"> + <link rel="icon" type="image/png" href="$href('images/favicon-32x32.png')" sizes="32x32"> + <link rel="icon" type="image/png" href="$href('images/favicon-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/favicon-194x194.png')" sizes="194x194"> + <link rel="mask-icon" href="$href('images/safari-pinned-tab.svg')" color="#5bbad5"> + <meta name="application-name" content="Wok"> + <meta name="msapplication-config" content="none" /> + <meta name="msapplication-TileColor" content="#f73434" /> + <meta name="msapplication-square70x70logo" content="$href('images/mstile-70x70.png')" /> + <meta name="msapplication-square150x150logo" content="$href('images/mstile-150x150.png')" /> + <meta name="msapplication-wide310x150logo" content="$href('images/mstile-310x310.png')" /> + <meta name="msapplication-square310x310logo" content="$href('images/mstile-310x150.png')" /> + <link rel="stylesheet" href="/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui.min.css"> + <link rel="stylesheet" href="/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui.css"> + <link rel="stylesheet" href="/usr/share/javascript/bootstrap/css/bootstrap.css"> + <link rel="stylesheet" href="$href('libs/bootstrap-select/dist/css/bootstrap-select.min.css')"> + <link rel="stylesheet" href="$href('libs/datatables/css/datatables.min.css')"> + <link rel="stylesheet" href="$href('css/fontawesome/fontawesome.css')"> + <link rel="stylesheet" href="$href('css/opensans/opensans.css')"> + <link rel="stylesheet" href="$href('css/bootstrap-select.custom.css')"> + <link rel="stylesheet" href="$href('css/datatables.bootstrap.css')"> + <link rel="stylesheet" href="$href('css/wok.css')"> + <script src="$href('libs/es5-shim/es5-shim.min.js')"></script> + <script src="/usr/share/javascript/jquery/jquery.min.js"></script> + <script src="/usr/share/javascript/jquery-ui/jquery-ui.min.js"></script> + <script src="/usr/share/javascript/jquery-ui/ui/i18n/jquery-ui-i18n.js"></script> + <script src="$href('libs/jquery-i18n/jquery.i18n.min.js')"></script> + <script src="/usr/share/javascript/bootstrap/js/bootstrap.min.js"></script> + <script src="$href('libs/bootstrap-select/dist/js/bootstrap-select.min.js')"></script> + <script src="/usr/share/javascript/lodash.js"></script> + <script src="$href('libs/moment/moment-with-locales.min.js')"></script> + <script src="$href('libs/datatables/js/datatables.min.js')"></script> + <script src="$href('js/wok.min.js')"></script> +</head> +<body class="login" onload="wok.login_main()"> + <div class="topbar"> + <nav class="navbar navbar-inverse"> + <div class="container"> + <div class="navbar-header"> + <a class="navbar-brand" href="#">Wok</a> + </div> + </div> + </nav> + <nav class="navbar navbar-default"> + <div class="container"> + <div class="navbar-header"> + </div> + <ul class="nav navbar-nav"> + <li class="hostname"><span class="host-location"></span></li> + </ul> + </div> + </nav> + </div> + <div class="content"> + <div class="container"> + <div id="login-window" class="login-area row"> + <div class="err-area"> + <div id="messUserPass" class="alert alert-danger" style="display: none;">$_("The username or password you entered is incorrect. Please try again.")</div> + <div id="messSession" class="alert alert-danger" style="display: none;">$_("Session timeout, please re-login.")</div> + <div id="missServer" class="alert alert-danger" style="display: none;">$_("Server unreachable.")</div> + </div> + <form id="form-login" class="form-horizontal" method="post"> + <div class="form-group"> + <label for="username" class="sr-only">$_("User Name")</label> + <input type="text" class="form-control" id="username" name="username" required="required" placeholder="$_(" User Name ")" autofocus autocomplete="off" /> + <div id="username-msg" class="msg-required"></div> + </div> + <div class="form-group"> + <label for="password" class="sr-only">$_("Password")</label> + <input type="password" class="form-control" id="password" name="password" required="required" placeholder="$_(" Password ")" autocomplete="off" /> + <div id="password-msg" class="msg-required"></div> + </div> + <div class="form-group"> + <button id="btn-login" class="btn btn-login col-md-12 col-lg-12"> + <span id="login">$_("Log in")</span> + <span id="logging" style="display: none;">$_("Logging in...")</span> + </button> + </div> + <div class="form-group"> + <label for="userLang">$_("Language")</label> + <select id="userLang" class="selectpicker col-md-12 col-lg-12"> + <option value="en_US">English (US)</option> + <option value="zh_CN">中文（简体）</option> + <option value="pt_BR">Português (Brasil)</option> + <option value="de_DE">Deutsch (Deutschland)</option> + <option value="es_ES">Español (España)</option> + <option value="fr_FR">Français (France)</option> + <option value="it_IT">Italiano (Italia)</option> + <option value="ja_JP">日本語 (日本)</option> + <option value="ko_KR">한국어 (대한민국)</option> + <option value="ru_RU">Русский (Россия)</option> + <option value="zh_TW">中文（繁體）</option> + </select> + </div> + <div class="form-group"> + <label for="userLocale">$_("Locale")</label> + <select id="userLocale" class="selectpicker col-md-12 col-lg-12"> + <option value="af-ZA">Afrikaans (South Africa)</option> + <option value="sq-AL">Albanian (Albania)</option> + <option value="am-ET">Amharic (Ethiopia)</option> + <option value="ar-DZ">Arabic (Algeria)</option> + <option value="ar-BH">Arabic (Bahrain)</option> + <option value="ar-EG">Arabic (Egypt)</option> + <option value="ar-IQ">Arabic (Iraq)</option> + <option value="ar-JO">Arabic (Jordan)</option> + <option value="ar-KW">Arabic (Kuwait)</option> + <option value="ar-LB">Arabic (Lebanon)</option> + <option value="ar-LY">Arabic (Libya)</option> + <option value="ar-MR">Arabic (Mauritania)</option> + <option value="ar-MA">Arabic (Morocco)</option> + <option value="ar-OM">Arabic (Oman)</option> + <option value="ar-QA">Arabic (Qatar)</option> + <option value="ar-SA">Arabic (Saudi Arabia)</option> + <option value="ar-SY">Arabic (Syria)</option> + <option value="ar-TN">Arabic (Tunisia)</option> + <option value="ar-AE">Arabic (United Arab Emirates)</option> + <option value="ar-YE">Arabic (Yemen)</option> + <option value="hy-AM">Armenian (Armenia)</option> + <option value="as-IN">Assamese (India)</option> + <option value="az-AZ">Azerbaijani (Azerbaijan)</option> + <option value="eu-ES">Basque (Spain)</option> + <option value="be-BY">Belarusian (Belarus)</option> + <option value="bn-BD">Bengali (Bangladesh)</option> + <option value="bn-IN">Bengali (India)</option> + <option value="bs-BA">Bosnian (Bosnia)</option> + <option value="bg-BG">Bulgarian (Bulgaria)</option> + <option value="my-MM">Burmese (Myanmar)</option> + <option value="ca-ES">Catalan (Spain)</option> + <option value="zh-CN">Chinese-simplified (China)</option> + <option value="zh-SG">Chinese-simplified (Singapore)</option> + <option value="zh-HK">Chinese-traditional (Hong Kong S.A.R. of China)</option> + <option value="zh-MO">Chinese-traditional (Macao)</option> + <option value="zh-TW">Chinese-traditional (Taiwan)</option> + <option value="hr-HR">Croatian (Croatia)</option> + <option value="cs-CZ">Czech (Czech Republic)</option> + <option value="da-DK">Danish (Denmark)</option> + <option value="nl-BE">Dutch (Belgium)</option> + <option value="nl-NL">Dutch (The Netherlands)</option> + <option value="en-AU">English (Australia)</option> + <option value="en-BE">English (Belgium)</option> + <option value="en-CM">English (Cameroon)</option> + <option value="en-CA">English (Canada)</option> + <option value="en-GH">English (Ghana)</option> + <option value="en-HK">English (Hong Kong S.A.R. of China)</option> + <option value="en-IN">English (India)</option> + <option value="en-IE">English (Ireland)</option> + <option value="en-KE">English (Kenya)</option> + <option value="en-MU">English (Mauritius)</option> + <option value="en-NZ">English (New Zealand)</option> + <option value="en-NG">English (Nigeria)</option> + <option value="en-PH">English (Philippines)</option> + <option value="en-SG">English (Singapore)</option> + <option value="en-ZA">English (South Africa)</option> + <option value="en-TZ">English (Tanzania)</option> + <option value="en-GB">English (United Kingdom)</option> + <option value="en-US">English (United States)</option> + <option value="en-ZM">English (Zambia)</option> + <option value="et-EE">Estonian (Estonia)</option> + <option value="tl-PH">Filipino (Philippines)</option> + <option value="fi-FI">Finnish (Finland)</option> + <option value="fr-DZ">French (Algeria)</option> + <option value="fr-CM">French (Cameroon)</option> + <option value="fr-CD">French (Democratic Republic of the Congo)</option> + <option value="fr-BE">French (Belgium)</option> + <option value="fr-CA">French (Canada)</option> + <option value="fr-FR">French (France)</option> + <option value="fr-CI">French (Ivory Coast [Côte d’Ivoire])</option> + <option value="fr-LU">French (Luxembourg)</option> + <option value="fr-MR">French (Mauritania)</option> + <option value="fr-MU">French (Mauritius)</option> + <option value="fr-MA">French (Morocco)</option> + <option value="fr-SN">French (Senegal)</option> + <option value="fr-CH">French (Switzerland)</option> + <option value="fr-TN">French (Tunisia)</option> + <option value="gl-ES">Galician (Spain)</option> + <option value="lg-UG">Ganda (Uganda)</option> + <option value="ka-GE">Georgian (Georgia)</option> + <option value="de-AT">German (Austria)</option> + <option value="de-DE">German (Germany)</option> + <option value="de-LU">German (Luxembourg)</option> + <option value="de-CH">German (Switzerland)</option> + <option value="el-GR">Greek (Greece)</option> + <option value="gu-IN">Gujarati (India)</option> + <option value="ha-NG">Hausa (Nigeria)</option> + <option value="he-IL">Hebrew (Israel)</option> + <option value="hi-IN">Hindi (India)</option> + <option value="hu-HU">Hungarian (Hungary)</option> + <option value="is-IS">Icelandic (Iceland)</option> + <option value="ig-NG">Igbo (Nigeria)</option> + <option value="id-ID">Indonesian (Indonesia)</option> + <option value="it-IT">Italian (Italy)</option> + <option value="it-CH">Italian (Switzerland)</option> + <option value="ja-JP">Japanese (Japan)</option> + <option value="kn-IN">Kannada (India)</option> + <option value="kk-KZ">Kazakh (Kazakhstan)</option> + <option value="km-KH">Khmer (Cambodia)</option> + <option value="rw-RW">Kinyarwanda (Rwanda)</option> + <option value="kok-IN">Konkani (India)</option> + <option value="ko-KR">Korean (Korea, South)</option> + <option value="lo-LA">Lao (Laos)</option> + <option value="lv-LV">Latvian (Latvia)</option> + <option value="lt-LT">Lithuanian (Lithuania)</option> + <option value="mk-MK">Macedonian (Macedonia)</option> + <option value="ms-MY">Malay-Latin (Malaysia)</option> + <option value="ml-IN">Malayalam (India)</option> + <option value="mt-MT">Maltese (Malta)</option> + <option value="mr-IN">Marathi (India)</option> + <option value="mn-Cyrl-MN">Mongolian-Cyrillic (Mongolia)</option> + <option value="ne-IN">Nepali (India)</option> + <option value="ne-NP">Nepali (Nepal)</option> + <option value="nb-NO">Norwegian Bokmål (Norway)</option> + <option value="nn-NO">Norwegian Nynorsk (Norway)</option> + <option value="or-IN">Oriya [aka, Odia] (India)</option> + <option value="om-ET">Oromo (Ethiopia)</option> + <option value="pl-PL">Polish (Poland)</option> + <option value="pt-AO">Portuguese (Angola)</option> + <option value="pt-BR">Portuguese (Brazil)</option> + <option value="pt-MO">Portuguese (Macao)</option> + <option value="pt-MZ">Portuguese (Mozambique)</option> + <option value="pt-PT">Portuguese (Portugal)</option> + <option value="pa-IN">Punjabi (India)</option> + <option value="ro-RO">Romanian (Romania)</option> + <option value="ru-RU">Russian (Russia)</option> + <option value="sr-RS">Serbian-Cyrillic (Serbia)</option> + <option value="sr-ME">Serbian-Latin (Montenegro)</option> + <option value="sr-Latn-RS">Serbian-Latin (Serbia)</option> + <option value="si-LK">Sinhala (Sri Lanka)</option> + <option value="sk-SK">Slovak (Slovakia)</option> + <option value="sl-SI">Slovenian (Slovenia)</option> + <option value="es-AR">Spanish (Argentina)</option> + <option value="es-BO">Spanish (Bolivia)</option> + <option value="es-CL">Spanish (Chile)</option> + <option value="es-CO">Spanish (Colombia)</option> + <option value="es-CR">Spanish (Costa Rica)</option> + <option value="es-DO">Spanish (Dominican Republic)</option> + <option value="es-EC">Spanish (Ecuador)</option> + <option value="es-SV">Spanish (El Salvador)</option> + <option value="es-GT">Spanish (Guatemala)</option> + <option value="es-HN">Spanish (Honduras)</option> + <option value="es-MX">Spanish (Mexico)</option> + <option value="es-NI">Spanish (Nicaragua)</option> + <option value="es-PA">Spanish (Panama)</option> + <option value="es-PY">Spanish (Paraguay)</option> + <option value="es-PE">Spanish (Peru)</option> + <option value="es-PR">Spanish (Puerto Rico)</option> + <option value="es-ES">Spanish (Spain)</option> + <option value="es-US">Spanish (United States)</option> + <option value="es-UY">Spanish (Uruguay)</option> + <option value="es-VE">Spanish (Venezuela)</option> + <option value="sw-KE">Swahili (Kenya)</option> + <option value="sw-TZ">Swahili (Tanzania)</option> + <option value="sv-SE">Swedish (Sweden)</option> + <option value="ta-IN">Tamil (India)</option> + <option value="te-IN">Telugu (India)</option> + <option value="th-TH">Thai (Thailand)</option> + <option value="tr-TR">Turkish (Turkey)</option> + <option value="uk-UA">Ukrainian (Ukraine)</option> + <option value="ur-IN">Urdu (India)</option> + <option value="ur-PK">Urdu (Pakistan)</option> + <option value="uz-Cyrl-UZ">Uzbek-Cyrillic (Uzbekistan)</option> + <option value="uz-Latn-UZ">Uzbek-Latin (Uzbekistan)</option> + <option value="vi-VN">Vietnamese (Vietnam)</option> + <option value="cy-GB">Welsh (United Kingdom)</option> + <option value="yo-NG">Yoruba (Nigeria)</option> + <option value="zu-ZA">Zulu (South Africa)</option> + <option value="az-AZ">Azerbaijani-Latin (Azerbaijan)</option> + <option value="sr-CS">Serbian-Cyrillic ()</option> + <option value="sr-Cyrl-CS">Serbian-Cyrillic (Serbia and Montenegro)</option> + <option value="sr-Latn-CS">Serbian-Latin (Serbia and Montenegro)</option> + </select> + </div> + </form> + </div> + <div class="row"> + <div class="col-lg-4 delayed-fadein"> + <p class="text-muted powered hidden">Powered by:</p> + <ul id="wok-logos" class="list-inline"></ul> + </div> + </div> + </div> + </div> +</body> +</html> diff --git a/ui/pages/wok-ui.html.tmpl.fedora b/ui/pages/wok-ui.html.tmpl.fedora new file mode 100644 index 0000000..1dcf0df --- /dev/null +++ b/ui/pages/wok-ui.html.tmpl.fedora @@ -0,0 +1,231 @@ +#* + * Project Wok + * + * Copyright IBM Corp, 2015-2016 + * + * Code derived from Project Kimchi + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + *# +#unicode UTF-8 +#import gettext +#from wok.cachebust import href +#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True) +#silent _ = t.gettext +#silent _t = t.gettext +#from wok.config import get_version +<!DOCTYPE html> +<html lang="$lang.lang[0]"> +<head> + <meta charset="UTF-8"> + <title>Wok</title> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta name="apple-mobile-web-app-title" content="Wok"> + <link href="$href('images/apple-touch-icon-57x57.png')" sizes="57x57" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-72x72.png')" sizes="72x72" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-76x76.png')" sizes="76x76" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-114x114.png')" sizes="114x114" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-144x144.png')" sizes="144x144" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-152x152.png')" sizes="152x152" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-180x180.png')" sizes="120x120" rel="apple-touch-icon-precomposed"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-36x36.png')" sizes="36x36"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-48x48.png')" sizes="48x48"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-72x72.png')" sizes="72x72"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-144x144.png')" sizes="144x144"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-192x192.png')" sizes="192x192"> + <link rel="icon" type="image/png" href="$href('images/favicon-16x16.png')" sizes="16x16"> + <link rel="icon" type="image/png" href="$href('images/favicon-32x32.png')" sizes="32x32"> + <link rel="icon" type="image/png" href="$href('images/favicon-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/favicon-194x194.png')" sizes="194x194"> + <link rel="mask-icon" href="$href('images/safari-pinned-tab.svg')" color="#5bbad5"> + <meta name="application-name" content="Wok"> + <meta name="msapplication-config" content="none" /> + <meta name="msapplication-TileColor" content="#f73434" /> + <meta name="msapplication-square70x70logo" content="$href('images/mstile-70x70.png')" /> + <meta name="msapplication-square150x150logo" content="$href('images/mstile-150x150.png')" /> + <meta name="msapplication-wide310x150logo" content="$href('images/mstile-310x310.png')" /> + <meta name="msapplication-square310x310logo" content="$href('images/mstile-310x150.png')" /> + <link rel="stylesheet" href="$href('libs/jquery-ui/themes/base/jquery-ui.min.css')"> + <link rel="stylesheet" href="$href('css/jquery-ui.custom.css')"> + <link rel="stylesheet" href="$href('css/bootstrap.custom.css')"> + <link rel="stylesheet" href="$href('libs/bootstrap-select/dist/css/bootstrap-select.min.css')"> + <link rel="stylesheet" href="$href('libs/jquery-bootgrid/dist/css/jquery.bootgrid.min.css')"> + <link rel="stylesheet" href="$href('libs/bootstrap-switch/dist/css/bootstrap-switch.min.css')"> + <link rel="stylesheet" href="$href('libs/bootstrap-editable/dist/css/bootstrap-editable.css')"> + <link rel="stylesheet" href="$href('libs/datatables/css/datatables.min.css')"> + <link rel="stylesheet" href="$href('css/fontawesome/fontawesome.css')"> + <link rel="stylesheet" href="$href('css/opensans/opensans.css')"> + <link rel="stylesheet" href="$href('css/bootstrap-select.custom.css')"> + <link rel="stylesheet" href="$href('css/datatables.bootstrap.css')"> + <link rel="stylesheet" href="$href('css/wok.css')"> + <script src="js/es5-shim.min.js"></script> + <script src="js/jquery.min.js"></script> + <script src="$href('libs/jquery-containsNC/jquery.containsNC.js')"></script> + <script src="$href('libs/jquery-ui/jquery-ui.min.js')"></script> + <script src="$href('libs/jquery-ui/jquery-ui-i18n.min.js')"></script> + <script src="$href('libs/jquery-i18n/jquery.i18n.min.js')"></script> + <script src="$href('libs/list-js/list.min.js')"></script> + <script src="$href('libs/bootstrap/bootstrap.min.js')"></script> + <script src="$href('libs/bootstrap-select/dist/js/bootstrap-select.min.js')"></script> + <script src="$href('libs/jquery-bootgrid/dist/js/jquery.bootgrid.min.js')"></script> + <script src="$href('libs/bootstrap-switch/dist/js/bootstrap-switch.min.js')"></script> + <script src="$href('libs/bootstrap-editable/dist/js/bootstrap-editable.min.js')"></script> + <script src="js/typeahead.bundle.min.js"></script> + <script src="js/lodash.js"></script> + <script src="js/moment-with-locales.min.js"></script> + <script src="$href('libs/datatables/js/datatables.min.js')"></script> + <script src="$href('base64/jquery.base64.js')"></script> + <script src="$href('js/wok.min.js')"></script> + <!-- This is used for detecting if the UI needs to be built --> + <style type="text/css"> + #buildme { + position: fixed; + background: rgba(0, 0, 0, 0.5); + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 10000; + } + #buildme div { + background-color: #FFB2C0; + border-style: solid; + border-color: #FF0000; + padding: 30px; + width: 75%; + margin-left: auto; + margin-right: auto; + margin-top: 50px; + -moz-border-radius: 15px; + border-radius: 15px; + } + </style> + </head> +<body onload="wok.main()"> + <div class="topbar"> + <nav class="navbar navbar-inverse"> + <div class="container"> + <div class="navbar-header"> + <a id="logo" class="navbar-brand" href="#" title="Wok">Wok</a> + </div> + <ul class="nav navbar-nav navbar-right"> + <li class="dropdown hide-content peers" id="peers"> + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span class="topbar-text">$_("Peers")</span><span class="caret"></span></a> + <ul class="dropdown-menu"> + <li id="search-peers"><span>$_("Searching")...</span></li> + <li id="no-peers" class="hide-content">$_("No peers found.")</li> + </ul> + </li> + <li class="dropdown" id="user-login"> + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> + <i class="fa fa-user" id="user-icon"></i><span class="topbar-text empty-when-logged-off" id="user-name"></span><span class="caret"></span> + </a> + <ul class="dropdown-menu"> + <li class="critical"><a id="btn-logout" href="javascript: void(0);"><i class="fa fa-ban"></i><span>$_("Log out")</span></a></li> + </ul> + </li> + <li class="dropdown"> + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-question-circle"></i><span class="topbar-text">$_("Help")</span><span class="caret"></span></a> + <ul class="dropdown-menu"> + <li><a id="btn-help" href="javascript: void(0);">$_("Help")</a></li> + <li><a id="btn-about" href="#" data-toggle="modal" data-target="#aboutModal">$_("About")</a></li> + </ul> + </li> + </ul> + </div> + </nav> + <nav class="navbar navbar-default"> + <div class="container" id="navigation-bar"> + <div class="navbar-header"> + <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-menu" aria-expanded="false"> + <span class="sr-only">$_("Toggle navigation")</span> + <span class="icon-bar"><!-- Hamburguer button here --></span> + </button> + </div> + <div id="functionalTabPanel" class="collapse navbar-collapse"> + <ul class="nav navbar-nav"> + <li class="hostname"><span class="host-location"></span></li> + </ul> + </div> + <div id="tabPanel" class="collapse navbar-collapse"> + <ul class="nav navbar-nav"> + </ul> + </div> + </div> + </nav> + </div> + <div class="content"> + <div id="main"> + </div> + </div> + </div> + + <div id="buildme" style="display:none"> + <div><p>Oops! It looks like I am running from a source tree and you forgot to build! + Please run the following command from the wok and plugins directories and reload this page:</p> + <p><code>make</code></p> + </div> + </div> + + <div class="modal fade host-modal" id="aboutModal" tabindex="-1" role="dialog" labelledby="aboutModalLabel" aria-hidden="true"> + </div> + + + <div class="fade in session-expiring" id="session-expiring-alert" hidden> + <button type="button" class="close">&times;</button> + <div class="well"> + <p>$_("Your session will expire on: 30s. Do you want to renew it?")</p> + <div class="form-group"> + <button class="btn btn-primary btn-xs" id="renew-session-button" onclick="wok.session.renewSession();">Renew</button> + <button class="btn btn-primary btn-xs" id="dismiss-session-button" onclick="wok.session.hideExpiringAlert();">Dismiss</button> + </div> + </div> + </div> + + + <script id="about-tmpl" type="wok/template"> + <div class="modal-dialog" role="document"> + <div class="modal-content" > + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> + <h4 class="modal-title">$_("About")</h4> + </div> + <div class="modal-body"> + <div class="content"> + <div class="col-md-10"> + <ul id="wok-about" class="list-inline"> + <li> + <img src="$href('images/wok.svg')" alt="Wok $get_version()" title="Wok"> + <span class="plugin-title">Wok</span> + <span class="plugin-version">$get_version()</span> + </li> + </ul> + </div> + </div> + </div> + </div> + </div> + </script> + <footer class="footer"> + <div class="container"> + <p class="text-muted powered hidden">$_("Powered by"):</p> + <ul id="plugins"> + </ul> + <span class="wok-version">Wok Version: $get_version()</span> + </div> + </footer> +</body> +</html> diff --git a/ui/pages/wok-ui.html.tmpl.ubuntu b/ui/pages/wok-ui.html.tmpl.ubuntu new file mode 100644 index 0000000..b458a6c --- /dev/null +++ b/ui/pages/wok-ui.html.tmpl.ubuntu @@ -0,0 +1,231 @@ +#* + * Project Wok + * + * Copyright IBM Corp, 2015-2016 + * + * Code derived from Project Kimchi + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + *# +#unicode UTF-8 +#import gettext +#from wok.cachebust import href +#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang, fallback=True) +#silent _ = t.gettext +#silent _t = t.gettext +#from wok.config import get_version +<!DOCTYPE html> +<html lang="$lang.lang[0]"> +<head> + <meta charset="UTF-8"> + <title>Wok</title> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta name="apple-mobile-web-app-title" content="Wok"> + <link href="$href('images/apple-touch-icon-57x57.png')" sizes="57x57" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-72x72.png')" sizes="72x72" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-76x76.png')" sizes="76x76" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-114x114.png')" sizes="114x114" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-144x144.png')" sizes="144x144" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-152x152.png')" sizes="152x152" rel="apple-touch-icon-precomposed"> + <link href="$href('images/apple-touch-icon-180x180.png')" sizes="120x120" rel="apple-touch-icon-precomposed"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-36x36.png')" sizes="36x36"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-48x48.png')" sizes="48x48"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-72x72.png')" sizes="72x72"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-144x144.png')" sizes="144x144"> + <link rel="icon" type="image/png" href="$href('images/android-chrome-192x192.png')" sizes="192x192"> + <link rel="icon" type="image/png" href="$href('images/favicon-16x16.png')" sizes="16x16"> + <link rel="icon" type="image/png" href="$href('images/favicon-32x32.png')" sizes="32x32"> + <link rel="icon" type="image/png" href="$href('images/favicon-96x96.png')" sizes="96x96"> + <link rel="icon" type="image/png" href="$href('images/favicon-194x194.png')" sizes="194x194"> + <link rel="mask-icon" href="$href('images/safari-pinned-tab.svg')" color="#5bbad5"> + <meta name="application-name" content="Wok"> + <meta name="msapplication-config" content="none" /> + <meta name="msapplication-TileColor" content="#f73434" /> + <meta name="msapplication-square70x70logo" content="$href('images/mstile-70x70.png')" /> + <meta name="msapplication-square150x150logo" content="$href('images/mstile-150x150.png')" /> + <meta name="msapplication-wide310x150logo" content="$href('images/mstile-310x310.png')" /> + <meta name="msapplication-square310x310logo" content="$href('images/mstile-310x150.png')" /> + <link rel="stylesheet" href="/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui.min.css"> + <link rel="stylesheet" href="/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui.css"> + <link rel="stylesheet" href="/usr/share/javascript/bootstrap/css/bootstrap.css"> + <link rel="stylesheet" href="$href('libs/bootstrap-select/dist/css/bootstrap-select.min.css')"> + <link rel="stylesheet" href="$href('libs/jquery-bootgrid/dist/css/jquery.bootgrid.min.css')"> + <link rel="stylesheet" href="$href('libs/bootstrap-switch/dist/css/bootstrap-switch.min.css')"> + <link rel="stylesheet" href="$href('libs/bootstrap-editable/dist/css/bootstrap-editable.css')"> + <link rel="stylesheet" href="$href('libs/datatables/css/datatables.min.css')"> + <link rel="stylesheet" href="$href('css/fontawesome/fontawesome.css')"> + <link rel="stylesheet" href="$href('css/opensans/opensans.css')"> + <link rel="stylesheet" href="$href('css/bootstrap-select.custom.css')"> + <link rel="stylesheet" href="$href('css/datatables.bootstrap.css')"> + <link rel="stylesheet" href="$href('css/wok.css')"> + <script src="$href('libs/es5-shim/es5-shim.min.js')"></script> + <script src="/usr/share/javascript/jquery/jquery.min.js""></script> + <script src="$href('libs/jquery-containsNC/jquery.containsNC.js')"></script> + <script src="/usr/share/javascript/jquery-ui/jquery-ui.min.js"></script> + <script src="/usr/share/javascript/jquery-ui/ui/i18n/jquery-ui-i18n.js"></script> + <script src="$href('libs/jquery-i18n/jquery.i18n.min.js')"></script> + <script src="$href('libs/list-js/list.min.js')"></script> + <script src="/usr/share/javascript/bootstrap/js/bootstrap.min.js"></script> + <script src="$href('libs/bootstrap-select/dist/js/bootstrap-select.min.js')"></script> + <script src="$href('libs/jquery-bootgrid/dist/js/jquery.bootgrid.min.js')"></script> + <script src="$href('libs/bootstrap-switch/dist/js/bootstrap-switch.min.js')"></script> + <script src="$href('libs/bootstrap-editable/dist/js/bootstrap-editable.min.js')"></script> + <script src="$href('libs/typeahead/typeahead.bundle.min.js')"></script> + <script src="/usr/share/javascript/lodash.js"></script> + <script src="$href('libs/moment/moment-with-locales.min.js')"></script> + <script src="$href('libs/datatables/js/datatables.min.js')"></script> + <script src="$href('base64/jquery.base64.js')"></script> + <script src="$href('js/wok.min.js')"></script> + <!-- This is used for detecting if the UI needs to be built --> + <style type="text/css"> + #buildme { + position: fixed; + background: rgba(0, 0, 0, 0.5); + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 10000; + } + #buildme div { + background-color: #FFB2C0; + border-style: solid; + border-color: #FF0000; + padding: 30px; + width: 75%; + margin-left: auto; + margin-right: auto; + margin-top: 50px; + -moz-border-radius: 15px; + border-radius: 15px; + } + </style> + </head> +<body onload="wok.main()"> + <div class="topbar"> + <nav class="navbar navbar-inverse"> + <div class="container"> + <div class="navbar-header"> + <a id="logo" class="navbar-brand" href="#" title="Wok">Wok</a> + </div> + <ul class="nav navbar-nav navbar-right"> + <li class="dropdown hide-content peers" id="peers"> + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span class="topbar-text">$_("Peers")</span><span class="caret"></span></a> + <ul class="dropdown-menu"> + <li id="search-peers"><span>$_("Searching")...</span></li> + <li id="no-peers" class="hide-content">$_("No peers found.")</li> + </ul> + </li> + <li class="dropdown" id="user-login"> + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> + <i class="fa fa-user" id="user-icon"></i><span class="topbar-text empty-when-logged-off" id="user-name"></span><span class="caret"></span> + </a> + <ul class="dropdown-menu"> + <li class="critical"><a id="btn-logout" href="javascript: void(0);"><i class="fa fa-ban"></i><span>$_("Log out")</span></a></li> + </ul> + </li> + <li class="dropdown"> + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-question-circle"></i><span class="topbar-text">$_("Help")</span><span class="caret"></span></a> + <ul class="dropdown-menu"> + <li><a id="btn-help" href="javascript: void(0);">$_("Help")</a></li> + <li><a id="btn-about" href="#" data-toggle="modal" data-target="#aboutModal">$_("About")</a></li> + </ul> + </li> + </ul> + </div> + </nav> + <nav class="navbar navbar-default"> + <div class="container" id="navigation-bar"> + <div class="navbar-header"> + <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-menu" aria-expanded="false"> + <span class="sr-only">$_("Toggle navigation")</span> + <span class="icon-bar"><!-- Hamburguer button here --></span> + </button> + </div> + <div id="functionalTabPanel" class="collapse navbar-collapse"> + <ul class="nav navbar-nav"> + <li class="hostname"><span class="host-location"></span></li> + </ul> + </div> + <div id="tabPanel" class="collapse navbar-collapse"> + <ul class="nav navbar-nav"> + </ul> + </div> + </div> + </nav> + </div> + <div class="content"> + <div id="main"> + </div> + </div> + </div> + + <div id="buildme" style="display:none"> + <div><p>Oops! It looks like I am running from a source tree and you forgot to build! + Please run the following command from the wok and plugins directories and reload this page:</p> + <p><code>make</code></p> + </div> + </div> + + <div class="modal fade host-modal" id="aboutModal" tabindex="-1" role="dialog" labelledby="aboutModalLabel" aria-hidden="true"> + </div> + + + <div class="fade in session-expiring" id="session-expiring-alert" hidden> + <button type="button" class="close">&times;</button> + <div class="well"> + <p>$_("Your session will expire on: 30s. Do you want to renew it?")</p> + <div class="form-group"> + <button class="btn btn-primary btn-xs" id="renew-session-button" onclick="wok.session.renewSession();">Renew</button> + <button class="btn btn-primary btn-xs" id="dismiss-session-button" onclick="wok.session.hideExpiringAlert();">Dismiss</button> + </div> + </div> + </div> + + + <script id="about-tmpl" type="wok/template"> + <div class="modal-dialog" role="document"> + <div class="modal-content" > + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> + <h4 class="modal-title">$_("About")</h4> + </div> + <div class="modal-body"> + <div class="content"> + <div class="col-md-10"> + <ul id="wok-about" class="list-inline"> + <li> + <img src="$href('images/wok.svg')" alt="Wok $get_version()" title="Wok"> + <span class="plugin-title">Wok</span> + <span class="plugin-version">$get_version()</span> + </li> + </ul> + </div> + </div> + </div> + </div> + </div> + </script> + <footer class="footer"> + <div class="container"> + <p class="text-muted powered hidden">$_("Powered by"):</p> + <ul id="plugins"> + </ul> + <span class="wok-version">Wok Version: $get_version()</span> + </div> + </footer> +</body> +</html> -- 2.5.5