[Kimchi-devel] [PATCH 1/3] create a new login page
Sheldon
shaohef at linux.vnet.ibm.com
Tue Jun 3 15:23:06 UTC 2014
On 06/03/2014 04:15 PM, Yu Xin Huo wrote:
> On 6/3/2014 11:30 AM, Yu Xin Huo wrote:
>> tested, see issues below:
>>
>> 1. I always see the kimchi UI tabs before login page, as it is server
>> side re-direct, why kimchi tabs appear?
>>
>> 2. when username or password is wrong, it is directed to an error
>> page with content below, it should be back to login page with an
>> error message.
>>
>>
>> /ERROR CODE/
>>
>> //
>> //
>> /500 Internal Server Error/
>> //
>>
>>
>> /REASON/
>>
>> //
>> /The server encountered an unexpected condition which prevented it
>> from fulfilling the request./
>> //
>>
>>
>> /STACK/
>>
>> //
>> //
>> /Traceback (most recent call last):
>> File "/usr/lib/python2.6/site-packages/cherrypy/_cprequest.py", line 656, in respond
>> response.body = self.handler()
>> File "/usr/lib/python2.6/site-packages/cherrypy/lib/encoding.py", line 188, in __call__
>> self.body = self.oldhandler(*args, **kwargs)
>> File "/usr/lib/python2.6/site-packages/cherrypy/_cpdispatch.py", line 34, in __call__
>> return self.callable(*self.args, **self.kwargs)
>> File "/root/kimchi-repo/test/kimchi/src/kimchi/root.py", line 129, in login
>> auth.login(username, password)
>> File "/root/kimchi-repo/test/kimchi/src/kimchi/auth.py", line 198, in login
>> if not authenticate(username, password):
>> File "/root/kimchi-repo/test/kimchi/src/kimchi/auth.py", line 135, in authenticate
>> raise OperationFailed("KCHAUTH0001E", msg_args)
>> OperationFailed: KCHAUTH0001E: Authentication failed for user 'root'. [Error code: 7]/
> /3. there need to be message about "login fail" and "session timeout",
> need backend API available on html page to get the message./
seems it is hard to distinguish /session timeout //from longout.
/
>>
>>
>> On 5/31/2014 1:16 AM, shaohef at linux.vnet.ibm.com wrote:
>>> From: ShaoHe Feng<shaohef at linux.vnet.ibm.com>
>>>
>>> this page is used for the session timeout or first login.
>>>
>>> Signed-off-by: ShaoHe Feng<shaohef at linux.vnet.ibm.com>
>>> Signed-off-by: Yu Xin Huo<huoyuxin at linux.vnet.ibm.com>
>>> ---
>>> ui/images/progressing.gif | Bin 0 -> 1152 bytes
>>> ui/pages/login.html.tmpl | 247 ++++++++++++++++++++++++++++++++++++++++++++++
>>> 2 files changed, 247 insertions(+)
>>> create mode 100644 ui/images/progressing.gif
>>> create mode 100644 ui/pages/login.html.tmpl
>>>
>>> diff --git a/ui/images/progressing.gif b/ui/images/progressing.gif
>>> new file mode 100644
>>> index 0000000000000000000000000000000000000000..6552d41d9d4c874091bb51931c6adf64a95e8bd0
>>> GIT binary patch
>>> literal 1152
>>> zcmZ?wbhEHb6k!ly*v!E2|NsBHckiA#b7s?~O&uK_IXO9 at p`oUxrgCy}4A_9;e{Mh5
>>> zkYH!W09PYD17=2`8pWS1oFWVy3_2k7AY&O=+5}E^`WY^hIhD at I;2`qkhUamCHs#2?
>>> zD{Sl5ddqAu;o;E8n07H&VTOd$9w+z3Od8dz)1OOlg at hfQ?6P6gg)Nhut~h8s_iHy|
>>> zTx?f<DfNuF4qs+in1T70o7P)P87f1<g5(0~t-`bz%`;<c7;R*Hby&0+Cd*D$nyx)7
>>> zxH>hoEs9-2GEYbl<TO?^r*$AZO&~F#<dR{_!xK!0-EtLPZ*p|yWoF`%>SmZA?aQ<9
>>> zUT3kA$h=8X2{%vLaEeZ2FfFvxHCy+@)2xTXXx&nW19L8~I4mhFCLSR*N5YUN_g8RC
>>> zxvG$d3rC2Yoni>Hr8Z+mk+UtMt&Fyriq3S|nYyz*lh|s_)v7fmBnyPWjzbSOeSwpn
>>> ztM^*GK3gr at WX{W=;H4 at s$Eix`o#&Z+UC|vq;?Mm$*qz>q{MpOLKD$V>lW^GM at gRp<
>>> zTfqAxmTMW#NQtz1Ow(GUENaLTnG@~OSSl%)a-~@^*=_L^Wu6LazRZG$dI^iu%U-z%
>>> zg<00g*_8=1ySk){v9Pk(*~<9qvQD2qQDdsojG1{NY_a__TQemj7eK-u-Fqm>f>utm
>>> zWMS=L&jJU059 at Suul#8<RCK0juuU^pO9X~|9`=wYHdzoCYCehQmh?GGSt;IO&EY61
>>> z^|cU^WKC}pQa3GC)^bS)J5HFrADAqr$@=Tg_KIeUMR6Q at nr+9QW_y9zNsLj!T)@YO
>>> zmFW>EN`0IXPrZ>S5M3ptD%hrTMQhc8T>+_g4tF#}E)IMpc<k8J3C>bEce!tTI4V-^
>>> zEEL|{;B8wW%<SUK!k*>CY&#hksVX{CWv466RGb|aXRcN%49rjY*aHrnWY;d4a(eT<
>>> sn9_<U58lHODbH9KGQC;#6 at s@G?AG7t-SQycLr1Fr#FC=U9tH+$0KoWQ9smFU
>>>
>>> literal 0
>>> HcmV?d00001
>>>
>>> diff --git a/ui/pages/login.html.tmpl b/ui/pages/login.html.tmpl
>>> new file mode 100644
>>> index 0000000..e7afbb3
>>> --- /dev/null
>>> +++ b/ui/pages/login.html.tmpl
>>> @@ -0,0 +1,247 @@
>>> +#*
>>> + * Project Kimchi
>>> + *
>>> + * Copyright IBM, Corp. 2014
>>> + *
>>> + * 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 kimchi.cachebust import href
>>> +#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang)
>>> +#silent _ = t.gettext
>>> +#silent _t = t.gettext
>>> +#from kimchi.config import get_version
>>> +<!DOCTYPE html>
>>> +<html lang="$lang.lang[0]">
>>> +<head>
>>> +<meta charset="UTF-8">
>>> +<title>Kimchi</title>
>>> +<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
>>> +<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
>>> +
>>> +<style type="text/css">
>>> +.login {
>>> + font-family: Arial;
>>> + margin: 0px;
>>> +}
>>> +
>>> +.login input.invalid-field {
>>> + border-color: #C85305 !important;
>>> +}
>>> +
>>> +.login .header {
>>> + background: none repeat scroll 0 0 #353D40;
>>> + border-bottom: 3px solid #008ABF;
>>> + border-top: 0 none;
>>> + box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
>>> + height: 50px;
>>> + color: #F8F8F8;
>>> + font-size: 13px;
>>> + font-weight: 700;
>>> + font-family: Helvetica;
>>> + overflow: hidden;
>>> +}
>>> +
>>> +.login .header .lang {
>>> + float: right;
>>> + margin-right: 20px;
>>> + margin-top: 14px;
>>> +}
>>> +
>>> +.login .header .lang select {
>>> + vertical-align: middle;
>>> +}
>>> +
>>> +.login .content-pane {
>>> + margin-left: auto;
>>> + margin-right: auto;
>>> + margin-top: 200px;
>>> + width: 260px;
>>> +}
>>> +
>>> +.login .content-pane .trademark {
>>> + margin-bottom: 30px;
>>> +}
>>> +
>>> +.login .content-pane .trademark .logo {
>>> + background: url("../images/logo.ico") no-repeat scroll center center transparent;
>>> + display: inline-block;
>>> + height: 25px;
>>> + width: 25px;
>>> + margin-left: -4px;
>>> + margin-right: 5px;
>>> + vertical-align: middle;
>>> +}
>>> +
>>> +.login .content-pane .trademark .name {
>>> + vertical-align: middle;
>>> + padding-top: 2px;
>>> + font-weight: bold;
>>> + font-size: 18px;
>>> +}
>>> +
>>> +.login .content-pane .trademark .version {
>>> + vertical-align: middle;
>>> + padding-top: 6px;
>>> + font-size: 13px;
>>> + padding-left: 6px;
>>> +}
>>> +
>>> +.login .content-pane .message-area .item {
>>> + font-size: 12px;
>>> + margin-bottom: 30px;
>>> + margin-top: 30px;
>>> + height: 20px;
>>> +}
>>> +
>>> +.login .content-pane .message-area .text {
>>> + color: #C85305;
>>> +}
>>> +
>>> +.login .progress-indicator .progress-icon {
>>> + margin-right: 3px;
>>> + vertical-align: middle;
>>> + width: 15px;
>>> + height: 15px;
>>> +}
>>> +
>>> +.login .progress-indicator .progress-text {
>>> + vertical-align: middle;
>>> + padding-top: 2px;
>>> +}
>>> +
>>> +.login .content-pane .hint {
>>> + margin-bottom: 10px;
>>> + font-size: 14px;
>>> +}
>>> +
>>> +.login .content-pane .field-area {
>>> + overflow: hidden;
>>> +}
>>> +
>>> +.login .content-pane .field-area .text-field {
>>> + width: 240px;
>>> + padding: 5px 7px;
>>> + margin-bottom: 5px;
>>> + border: 1px solid #BABABA;
>>> + border-radius: 1px;
>>> +}
>>> +
>>> +.login .button {
>>> + margin-top: 20px;
>>> + background: -moz-linear-gradient(center top , #1783BF 0%, #0C4C88 100%) repeat scroll 0 0 transparent;
>>> + border-color: #666666 #666666 #555555;
>>> + border-image: none;
>>> + border-radius: 5px 5px 5px 5px;
>>> + border-style: solid;
>>> + border-width: 1px;
>>> + color: #DDDDDD;
>>> + cursor: pointer;
>>> + font-weight: bolder;
>>> + padding: 5px 10px;
>>> + float: right;
>>> +}
>>> +</style>
>>> +
>>> +<script>
>>> +
>>> +function validateForm() {
>>> + var user = document.forms["login"]["username"];
>>> + var pass = document.forms["login"]["password"];
>>> + var validateField = function(field){
>>> + field.className = "text-field";
>>> + var isValid = field.value && field.value.trim()!="" ? true : false;
>>> + if(!isValid) field.className += " invalid-field";
>>> + return isValid;
>>> + };
>>> + var isValid = validateField(user);
>>> + isValid = validateField(pass) && isValid;
>>> + if(isValid)
>>> + document.getElementById("messWait").style.display = "";
>>> + return isValid;
>>> +}
>>> +
>>> +function getCookie(cname) {
>>> + var name = cname + "=";
>>> + var ca = document.cookie.split(';');
>>> + for(var i=0; i<ca.length; i++) {
>>> + var c = ca[i].trim();
>>> + if (c.indexOf(name)==0) return c.substring(name.length,c.length);
>>> + }
>>> + return null;
>>> +}
>>> +
>>> +function setCookie(cname,cvalue,exdays) {
>>> + var d = new Date();
>>> + d.setTime(d.getTime()+(exdays*24*60*60*1000));
>>> + var expires = "expires="+d.toGMTString();
>>> + document.cookie = cname + "=" + cvalue + "; " + expires;
>>> +}
>>> +
>>> +function init() {
>>> + var defaultLang = 'en_US';
>>> + var clientLang = document.getElementById('userLang').value;
>>> + var persistLang = getCookie('kimchiLang');
>>> + document.getElementById("userLang").value = persistLang || clientLang || defaultLang;
>>> +/*
>>> + var url = window.location.href;
>>> + if(url.indexOf("wrongUserPass")!=-1)
>>> + document.getElementById("messUserPass").style.display = "";
>>> + if(url.indexOf("sessionTimeout")!=-1)
>>> + document.getElementById("messSession").style.display = "";
>>> +*/
>>> +}
>>> +
>>> +function changeLang() {
>>> + var lang = document.getElementById('userLang').value;
>>> + setCookie('kimchiLang', lang, 365);
>>> + window.location.reload();
>>> +}
>>> +
>>> +</script>
>>> +</head>
>>> +<body class="login" onload="init()">
>>> +
>>> +<div class="header">
>>> + <div class="lang">
>>> + <label>$_("Language"):</label>
>>> + <select id="userLang" onchange="changeLang()">
>>> + <option value="en_US">English (US)</option>
>>> + <option value="zh_CN">??(??)</option>
>>> + <option value="pt_BR">Português (Brasil)</option>
>>> + </select>
>>> + </div>
>>> +</div>
>>> +<div class="content-pane">
>>> + <div class="trademark"><span class="logo"></span><span class="name">Kimchi</span><span class="version">1.2</span></div>
>>> + <div class="message-area">
>>> + <div id="messUserPass" class="item text" style="display: none;">$_("User Name or password is incorrect.")</div>
>>> + <div id="messSession" class="item text" style="display: none;">$_("Session timeout, please re-login.")</div>
>>> + <div id="messWait" class="item progress-indicator" style="display: none;">
>>> + <img src="images/progressing.gif" class="progress-icon"><span class="progress-text">$_("Processing")...</span>
>>> + </div>
>>> + </div>
>>> + <div class="hint">$_("Sign in with your linux account")</div>
>>> + <div class="field-area">
>>> + <form name="login" action="/login?next=$getVar('data.next', '/')" method="POST" onsubmit="return validateForm()">
>>> + <input type="hidden" name="next" value="$getVar('data.next', '/')">
>>> + <input type="text" name="username" placeholder="$_("User Name")" class="text-field" autofocus>
>>> + <input type="password" name="password" placeholder="$_("Password")" class="text-field">
>>> + <input type="submit" value="$_("Sign In")" class="button">
>>> + </form>
>>> + </div>
>>> +</div>
>>> +
>>> +</body>
>>> +</html>
>>
>>
>>
>> _______________________________________________
>> Kimchi-devel mailing list
>> Kimchi-devel at ovirt.org
>> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
>
>
>
> _______________________________________________
> Kimchi-devel mailing list
> Kimchi-devel at ovirt.org
> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
--
Thanks and best regards!
Sheldon Feng(???)<shaohef at linux.vnet.ibm.com>
IBM Linux Technology Center
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.ovirt.org/pipermail/kimchi-devel/attachments/20140603/24b03e28/attachment.html>
More information about the Kimchi-devel
mailing list