[Wok][PATCH v2 0/7] Multi-Culture Support
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected. Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-) -- 2.1.0
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> v2: Changed '_' to '-' in locale code list v1: This patch adds another drop down list for user locale selection. The list includes the 11 languages supported in UI plus a few extra languages for now (This will be extended later). By default, the locale will be the UI language selected. Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) diff --git a/ui/pages/login.html.tmpl b/ui/pages/login.html.tmpl index 411874b..0d49588 100644 --- a/ui/pages/login.html.tmpl +++ b/ui/pages/login.html.tmpl @@ -119,6 +119,9 @@ <span id="logging" style="display: none;">$_("Logging in...")</span> </button> </div> + <div id=""> + <dl> + <dt> <select id="userLang" class="selectpicker col-md-12 col-lg-12"> <option value="en_US">English (US)</option> <option value="zh_CN">中文（简体）</option> @@ -132,6 +135,37 @@ <option value="ru_RU">Русский (Россия)</option> <option value="zh_TW">中文（繁體）</option> </select> + </dt> + <dd><h3 style="margin-top:7px; margin-bottom:40px; color:grey">Language</h3></dd> + <dt> + <select id="userLocale" class="selectpicker col-md-12 col-lg-12"> + <option value="af-NA">Afrikaans (Namibia)</option> + <option value="ar-DZ">Arabic (Algeria)</option> + <option value="az-AZ">Azerbaijani (Azerbaijan)</option> + <option value="en-US">English (US)</option> + <option value="hy-AM">Armenian (Armenia)</option> + <option value="hi-IN">Hindi (India)</option> + <option value="nl-BE">Dutch (Belgium)</option> + <option value="ms-MY">Malay (Malaysia)</option> + <option value="no-NO">Norwegian (Norway)</option> + <option value="sq-AL">Albanian (Albania)</option> + <option value="sv-SE">Swedish (Sweden)</option> + <option value="uz-UZ">Uzbek (Uzbekistan)</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> + </dt> + <dd><h3 style="margin-top:7px; color:grey">Locale</dd> + </dl> + </div> </form> </div> <div class="row"> -- 2.1.0
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Changed '_' to '-' in locale code list
v1: This patch adds another drop down list for user locale selection. The list includes the 11 languages supported in UI plus a few extra languages for now (This will be extended later). By default, the locale will be the UI language selected.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+)
diff --git a/ui/pages/login.html.tmpl b/ui/pages/login.html.tmpl index 411874b..0d49588 100644 --- a/ui/pages/login.html.tmpl +++ b/ui/pages/login.html.tmpl @@ -119,6 +119,9 @@ <span id="logging" style="display: none;">$_("Logging in...")</span> </button> </div> + <div id="">
Please, add an unique "id" for this <div> It is useful when doing Selenium tests.
+ <dl> + <dt> <select id="userLang" class="selectpicker col-md-12 col-lg-12"> <option value="en_US">English (US)</option> <option value="zh_CN">中文（简体）</option> @@ -132,6 +135,37 @@ <option value="ru_RU">Русский (Россия)</option> <option value="zh_TW">中文（繁體）</option> </select> + </dt> + <dd><h3 style="margin-top:7px; margin-bottom:40px; color:grey">Language</h3></dd> + <dt>
Add translation support to "Language" label
+ <select id="userLocale" class="selectpicker col-md-12 col-lg-12"> + <option value="af-NA">Afrikaans (Namibia)</option> + <option value="ar-DZ">Arabic (Algeria)</option> + <option value="az-AZ">Azerbaijani (Azerbaijan)</option> + <option value="en-US">English (US)</option> + <option value="hy-AM">Armenian (Armenia)</option> + <option value="hi-IN">Hindi (India)</option> + <option value="nl-BE">Dutch (Belgium)</option> + <option value="ms-MY">Malay (Malaysia)</option> + <option value="no-NO">Norwegian (Norway)</option> + <option value="sq-AL">Albanian (Albania)</option> + <option value="sv-SE">Swedish (Sweden)</option> + <option value="uz-UZ">Uzbek (Uzbekistan)</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> + </dt>
+ <dd><h3 style="margin-top:7px; color:grey">Locale</dd> + </dl>
Same here.
+ </div> </form> </div> <div class="row">
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> v2: Changed method names from get_loc to get_locale and set_loc to set_locale. v1: This patch adds separate methods to get the locale from cookies (if set) and to set the locale. Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.lang.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/ui/js/src/wok.lang.js b/ui/js/src/wok.lang.js index b3791e7..e9d4eb8 100644 --- a/ui/js/src/wok.lang.js +++ b/ui/js/src/wok.lang.js @@ -46,6 +46,14 @@ wok.lang = { 'en_US'; }, + get_locale: function() { + return wok.cookie.get('wokLocale') || 'en-US'; + }, + + set_locale: function(locale) { + wok.cookie.set('wokLocale', locale, 365); + }, + set: function(lang) { wok.cookie.set('wokLang', lang, 365); } -- 2.1.0
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Changed method names from get_loc to get_locale and set_loc to set_locale.
v1: This patch adds separate methods to get the locale from cookies (if set) and to set the locale.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.lang.js | 8 ++++++++ 1 file changed, 8 insertions(+)
diff --git a/ui/js/src/wok.lang.js b/ui/js/src/wok.lang.js index b3791e7..e9d4eb8 100644 --- a/ui/js/src/wok.lang.js +++ b/ui/js/src/wok.lang.js @@ -46,6 +46,14 @@ wok.lang = { 'en_US'; },
+ get_locale: function() { + return wok.cookie.get('wokLocale') || 'en-US'; + }, +
Shouldn't we try get the locale from browser before falling back to en-US ?
+ set_locale: function(locale) { + wok.cookie.set('wokLocale', locale, 365); + }, + set: function(lang) { wok.cookie.set('wokLang', lang, 365); }
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> This patch includes the locale in format setting for line-chart widget. Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.line-chart.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui/js/src/wok.line-chart.js b/ui/js/src/wok.line-chart.js index e0113f3..12744af 100644 --- a/ui/js/src/wok.line-chart.js +++ b/ui/js/src/wok.line-chart.js @@ -79,7 +79,8 @@ wok.widget.LineChart = function(params) { formatSettings = { base: series['base'], unit: series['unit'], - fixed: series['fixed'] + fixed: series['fixed'], + locale: series['locale'] }; } }); -- 2.1.0
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> v2: Modified call to fetch locale v1: This patch formats the datetime fields as per locale in wok-list widget. Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row); + if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) + } if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})(); -- 2.1.0
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 5/10/2016 12:13 PM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
In this way we will make this common and consistent across plugins also. What do you think?
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 5/10/16 12:13 PM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
Instead of field value, type of the field might be right choice...
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 05/10/2016 03:43 AM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
The conversion must be done outside the widget. The widget should only receive a bunch of data to display in a visual way.
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 05/10/2016 10:43 AM, Aline Manera wrote:
On 05/10/2016 03:43 AM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
The conversion must be done outside the widget. The widget should only receive a bunch of data to display in a visual way.
Yeah, generic widget must be generic. We can't assume that a said field will have any specific format. Remember that anyone can use WoK to do anything. I am aware that the data of locale comes from the client (UI) side, either by user input or browser config, the backend isn't aware of any of that. So, in my opinion, the proper usage here is, and I know it would require (again) to resend the patches in all plug-ins, each plug-in UI do this conversion by themselves and then use the widget to display it. To avoid code repetition makes sense to put this conversion code in a wok util function in wok.utils.js then each plug-in can call it from its own UI. Aline, let me know if you agree with this approach. Daniel
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 05/10/2016 11:56 AM, Daniel Henrique Barboza wrote:
On 05/10/2016 10:43 AM, Aline Manera wrote:
On 05/10/2016 03:43 AM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
The conversion must be done outside the widget. The widget should only receive a bunch of data to display in a visual way.
Yeah, generic widget must be generic. We can't assume that a said field will have any specific format. Remember that anyone can use WoK to do anything.
I am aware that the data of locale comes from the client (UI) side, either by user input or browser config, the backend isn't aware of any of that. So, in my opinion, the proper usage here is, and I know it would require (again) to resend the patches in all plug-ins, each plug-in UI do this conversion by themselves and then use the widget to display it.
To avoid code repetition makes sense to put this conversion code in a wok util function in wok.utils.js then each plug-in can call it from its own UI.
Aline, let me know if you agree with this approach.
+1 =)
Daniel
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 5/10/2016 7:13 PM, Aline Manera wrote:
On 05/10/2016 03:43 AM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
The conversion must be done outside the widget. The widget should only receive a bunch of data to display in a visual way.
I have tried adding converters define for list widget as below: And then use it as below in ui/js/src/gingerbase.host-dashboard.js ya the function used here for format can be moved to util.js. So you think this is better approach?
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 05/10/2016 12:07 PM, Archana Singh wrote:
On 5/10/2016 7:13 PM, Aline Manera wrote:
On 05/10/2016 03:43 AM, Archana Singh wrote:
On 5/9/2016 6:51 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields as per locale in wok-list widget.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.list.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/ui/js/src/wok.list.js b/ui/js/src/wok.list.js index f40b2e2..8f02fde 100644 --- a/ui/js/src/wok.list.js +++ b/ui/js/src/wok.list.js @@ -123,6 +123,10 @@ wok.widget.List.prototype = (function() { var checkboxName = $('ul', container).parent().parent().parent().attr('id') + '-check' || $(container).parent().parent().parent().attr('id') + '-check'; $.each(fields, function(fi, field) { var value = getValue(field.name, row);
+ if (field.name === 'time') { + var dte = new Date(value.substr(0,10)+'T'+value.substr(11)) + value = dte.toLocaleString(wok.lang.get_locale()) +
wok.list.js is a generic widget, ie, it will only display the data in a given visual format. Any data logic should be done prior to it. wok.list.js will not be aware about which data to do the conversion. Assuming the field will have a 'name' as 'time' is dangerous IMO. We can have different fields for datetime which does not have a name=time on it.
I will propose to have check for type(type=='datetime') instead of name(name=='time'). what do you think? And in debug report have the field type as datetime which has datetime in it?
The conversion must be done outside the widget. The widget should only receive a bunch of data to display in a visual way.
I have tried adding converters define for list widget as below:
And then use it as below in ui/js/src/gingerbase.host-dashboard.js
ya the function used here for format can be moved to util.js.
So you think this is better approach?
yeap! i think we can go on that way and do similar for bootgrid.
} if (field.type === 'status' && field.name === 'enabled') { styleClass = (value === true ? '' : ' disabled'); state = [ @@ -299,4 +303,4 @@ wok.widget.List.prototype = (function() { reload: reload, showMessage: showMessage }; -})(); \ No newline at end of file +})();
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> v2: Modified call to fetch and set locales v1: This patch implements the new drop down list for locale selection in wok.login.js Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.login.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/ui/js/src/wok.login.js b/ui/js/src/wok.login.js index f8eed3a..437e97d 100644 --- a/ui/js/src/wok.login.js +++ b/ui/js/src/wok.login.js @@ -25,11 +25,20 @@ wok.login_main = function() { $('.filter-option').parent().attr('title',$('#userLang option[value="'+selectedLanguage+'"]').text()); $('.filter-option').text($('#userLang option[value="'+selectedLanguage+'"]').text()); + var selectedLocale = wok.lang.get_locale(); + $('#userLocale').val(selectedLocale); + $('#userLocale option[value="'+selectedLocale+'"]').attr("selected", "selected"); + $('.filter-option').attr('title',$('#userLocale option[value="'+selectedLocale+'"]').text()); + $('#userLang').on('change', function() { wok.lang.set($(this).val()); location.reload(); }); + $('#userLocale').on('change', function() { + wok.lang.set_locale($(this).val()); + }); + var query = window.location.search; var error = /.*error=(.*?)(&|$)/g.exec(query); if (error && error[1] === "sessionTimeout") { -- 2.1.0
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> This patch modifies the wok.formatMeasurement util to include formatting based on locale passed, in wok.utils.js Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.utils.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/ui/js/src/wok.utils.js b/ui/js/src/wok.utils.js index 214749a..d198c37 100644 --- a/ui/js/src/wok.utils.js +++ b/ui/js/src/wok.utils.js @@ -140,6 +140,8 @@ wok.changetoProperUnit = function(numOrg, digits, base) { return new Formatted(number, unit); } + var n_locale = settings['locale'] || null; + var fixed = settings['fixed']; var unitMapping = unitBaseMapping[base]; @@ -153,11 +155,13 @@ wok.changetoProperUnit = function(numOrg, digits, base) { var formatted = number / startingValue; formatted = fixed ? formatted.toFixed(fixed) : formatted; - + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() return new Formatted(formatted, suffix + unit); } - - return new Formatted(fixed ? number.toFixed(fixed) : number, unit); + var formatted = 0; + formatted = fixed ? formatted.toFixed(fixed) : formatted; + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() + return new Formatted(formatted, unit); }; wok.formatMeasurement = format; -- 2.1.0
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
This patch modifies the wok.formatMeasurement util to include formatting based on locale passed, in wok.utils.js
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.utils.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-)
diff --git a/ui/js/src/wok.utils.js b/ui/js/src/wok.utils.js index 214749a..d198c37 100644 --- a/ui/js/src/wok.utils.js +++ b/ui/js/src/wok.utils.js @@ -140,6 +140,8 @@ wok.changetoProperUnit = function(numOrg, digits, base) { return new Formatted(number, unit); }
+ var n_locale = settings['locale'] || null; + var fixed = settings['fixed'];
var unitMapping = unitBaseMapping[base]; @@ -153,11 +155,13 @@ wok.changetoProperUnit = function(numOrg, digits, base) {
var formatted = number / startingValue; formatted = fixed ? formatted.toFixed(fixed) : formatted; - + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() return new Formatted(formatted, suffix + unit); } - - return new Formatted(fixed ? number.toFixed(fixed) : number, unit); + var formatted = 0; + formatted = fixed ? formatted.toFixed(fixed) : formatted; + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() + return new Formatted(formatted, unit);
It is confusing to me with too many variables named 'formatted'
};
wok.formatMeasurement = format;
On 5/9/2016 6:53 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
This patch modifies the wok.formatMeasurement util to include formatting based on locale passed, in wok.utils.js
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.utils.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-)
diff --git a/ui/js/src/wok.utils.js b/ui/js/src/wok.utils.js index 214749a..d198c37 100644 --- a/ui/js/src/wok.utils.js +++ b/ui/js/src/wok.utils.js @@ -140,6 +140,8 @@ wok.changetoProperUnit = function(numOrg, digits, base) { return new Formatted(number, unit); }
+ var n_locale = settings['locale'] || null; + var fixed = settings['fixed'];
var unitMapping = unitBaseMapping[base]; @@ -153,11 +155,13 @@ wok.changetoProperUnit = function(numOrg, digits, base) {
var formatted = number / startingValue; formatted = fixed ? formatted.toFixed(fixed) : formatted; - + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() return new Formatted(formatted, suffix + unit); } - - return new Formatted(fixed ? number.toFixed(fixed) : number, unit); + var formatted = 0; + formatted = fixed ? formatted.toFixed(fixed) : formatted; + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() + return new Formatted(formatted, unit);
It is confusing to me with too many variables named 'formatted'
+ formatted = fixed ? number.toFixed(fixed) : number; + /* this will format the number as per locale. */ + formatted_locale = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() + return new Formatted(formatted_locale, unit); Do it make sense now?
};
wok.formatMeasurement = format;
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 05/10/2016 04:05 AM, Archana Singh wrote:
On 5/9/2016 6:53 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
This patch modifies the wok.formatMeasurement util to include formatting based on locale passed, in wok.utils.js
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/src/wok.utils.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-)
diff --git a/ui/js/src/wok.utils.js b/ui/js/src/wok.utils.js index 214749a..d198c37 100644 --- a/ui/js/src/wok.utils.js +++ b/ui/js/src/wok.utils.js @@ -140,6 +140,8 @@ wok.changetoProperUnit = function(numOrg, digits, base) { return new Formatted(number, unit); }
+ var n_locale = settings['locale'] || null; + var fixed = settings['fixed'];
var unitMapping = unitBaseMapping[base]; @@ -153,11 +155,13 @@ wok.changetoProperUnit = function(numOrg, digits, base) {
var formatted = number / startingValue; formatted = fixed ? formatted.toFixed(fixed) : formatted; - + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() return new Formatted(formatted, suffix + unit); } - - return new Formatted(fixed ? number.toFixed(fixed) : number, unit); + var formatted = 0; + formatted = fixed ? formatted.toFixed(fixed) : formatted; + formatted = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() + return new Formatted(formatted, unit);
It is confusing to me with too many variables named 'formatted'
+ formatted = fixed ? number.toFixed(fixed) : number; + /* this will format the number as per locale. */ + formatted_locale = n_locale ? Number(formatted).toLocaleString(n_locale) : Number(formatted).toLocaleString() + return new Formatted(formatted_locale, unit);
Do it make sense now?
Yeap! =) Thanks for that!
};
wok.formatMeasurement = format;
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> co-authored by: Archana Singh <archus@linux.vnet.ibm.com> v2: Modified call to fetch locale v1: This patch formats the datetime fields in user activity log as per locale by using suitable formatters. Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/ui/js/wok.bootgrid.js b/ui/js/wok.bootgrid.js index 1312fe5..e3b0b16 100644 --- a/ui/js/wok.bootgrid.js +++ b/ui/js/wok.bootgrid.js @@ -72,6 +72,14 @@ wok.createBootgrid = function(opts) { }, "settings-user-log-message": function(column, row) { return '<span class="trim" data-toggle="tooltip" data-placement="auto bottom" title="'+row.message+'">' +row.message+ '</span> '; + }, + "settings-user-log-date": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleDateString(wok.lang.get_locale()); + }, + "settings-user-log-time": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleTimeString(wok.lang.get_locale()); } }, css: { @@ -138,4 +146,4 @@ wok.showBootgridData = function(opts) { wok.hideBootgridData = function(opts) { $("#" + opts['gridId'] + " tbody").hide(); -}; \ No newline at end of file +}; diff --git a/ui/js/wok.user-log.js b/ui/js/wok.user-log.js index 8c2b4a7..1bdbd31 100644 --- a/ui/js/wok.user-log.js +++ b/ui/js/wok.user-log.js @@ -94,6 +94,7 @@ wok.listUserLogConfig = function() { "title": i18n['WOKSETT0004M'] }, { "column-id": 'time', + "formatter": "settings-user-log-time", "converter": 'string', "order": 'desc', "title": i18n['WOKSETT0005M'] @@ -243,4 +244,4 @@ wok.initUserLogWindow = function() { }); $('#form-advanced-search').submit(); }); -}; \ No newline at end of file +}; -- 2.1.0
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields in user activity log as per locale by using suitable formatters.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/ui/js/wok.bootgrid.js b/ui/js/wok.bootgrid.js index 1312fe5..e3b0b16 100644 --- a/ui/js/wok.bootgrid.js +++ b/ui/js/wok.bootgrid.js @@ -72,6 +72,14 @@ wok.createBootgrid = function(opts) { }, "settings-user-log-message": function(column, row) { return '<span class="trim" data-toggle="tooltip" data-placement="auto bottom" title="'+row.message+'">' +row.message+ '</span> '; + }, + "settings-user-log-date": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleDateString(wok.lang.get_locale()); + }, + "settings-user-log-time": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleTimeString(wok.lang.get_locale()); }
The same I commented about wok.list.js. wok.bootgrid.js is a generic widget which only display data in a visual format. It should not deal with data formatting, instead of that it should only receive the data to be displayed.
}, css: { @@ -138,4 +146,4 @@ wok.showBootgridData = function(opts) {
wok.hideBootgridData = function(opts) { $("#" + opts['gridId'] + " tbody").hide(); -}; \ No newline at end of file +}; diff --git a/ui/js/wok.user-log.js b/ui/js/wok.user-log.js index 8c2b4a7..1bdbd31 100644 --- a/ui/js/wok.user-log.js +++ b/ui/js/wok.user-log.js @@ -94,6 +94,7 @@ wok.listUserLogConfig = function() { "title": i18n['WOKSETT0004M'] }, { "column-id": 'time',
+ "formatter": "settings-user-log-time", "converter": 'string',
The data conversion should be done here and only pass the right data to the displayed on UI to wok.bootgrid.js
"order": 'desc', "title": i18n['WOKSETT0005M'] @@ -243,4 +244,4 @@ wok.initUserLogWindow = function() { }); $('#form-advanced-search').submit(); }); -}; \ No newline at end of file +};
On 5/9/2016 6:55 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields in user activity log as per locale by using suitable formatters.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/ui/js/wok.bootgrid.js b/ui/js/wok.bootgrid.js index 1312fe5..e3b0b16 100644 --- a/ui/js/wok.bootgrid.js +++ b/ui/js/wok.bootgrid.js @@ -72,6 +72,14 @@ wok.createBootgrid = function(opts) { }, "settings-user-log-message": function(column, row) { return '<span class="trim" data-toggle="tooltip" data-placement="auto bottom" title="'+row.message+'">' +row.message+ '</span> '; + }, + "settings-user-log-date": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleDateString(wok.lang.get_locale()); + }, + "settings-user-log-time": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleTimeString(wok.lang.get_locale()); }
The same I commented about wok.list.js. wok.bootgrid.js is a generic widget which only display data in a visual format. It should not deal with data formatting, instead of that it should only receive the data to be displayed.
The data from backend if return and should be shown in UI depending upon the locale selected in UI by user while login. I agree that this is common widget and hence the format has to be done at common place to ensure that data & time are formatted as per locale selected by user in common way(thinking of plugin using this widget). So I think having common formatter will help us keeping the format consistent across plugins also.
}, css: { @@ -138,4 +146,4 @@ wok.showBootgridData = function(opts) {
wok.hideBootgridData = function(opts) { $("#" + opts['gridId'] + " tbody").hide(); -}; \ No newline at end of file +}; diff --git a/ui/js/wok.user-log.js b/ui/js/wok.user-log.js index 8c2b4a7..1bdbd31 100644 --- a/ui/js/wok.user-log.js +++ b/ui/js/wok.user-log.js @@ -94,6 +94,7 @@ wok.listUserLogConfig = function() { "title": i18n['WOKSETT0004M'] }, { "column-id": 'time',
+ "formatter": "settings-user-log-time", "converter": 'string',
The data conversion should be done here and only pass the right data to the displayed on UI to wok.bootgrid.js
Same as above, I think using common formatter define above keep formatting consistent across.
"order": 'desc', "title": i18n['WOKSETT0005M'] @@ -243,4 +244,4 @@ wok.initUserLogWindow = function() { }); $('#form-advanced-search').submit(); }); -}; \ No newline at end of file +};
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 5/10/2016 11:06 AM, Archana Singh wrote:
On 5/9/2016 6:55 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields in user activity log as per locale by using suitable formatters.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/ui/js/wok.bootgrid.js b/ui/js/wok.bootgrid.js index 1312fe5..e3b0b16 100644 --- a/ui/js/wok.bootgrid.js +++ b/ui/js/wok.bootgrid.js @@ -72,6 +72,14 @@ wok.createBootgrid = function(opts) { }, "settings-user-log-message": function(column, row) { return '<span class="trim" data-toggle="tooltip" data-placement="auto bottom" title="'+row.message+'">' +row.message+ '</span> '; + }, + "settings-user-log-date": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleDateString(wok.lang.get_locale()); + }, + "settings-user-log-time": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleTimeString(wok.lang.get_locale()); }
The same I commented about wok.list.js. wok.bootgrid.js is a generic widget which only display data in a visual format. It should not deal with data formatting, instead of that it should only receive the data to be displayed.
The data from backend if return and should be shown in UI depending upon the locale selected in UI by user while login. I agree that this is common widget and hence the format has to be done at common place to ensure that data & time are formatted as per locale selected by user in common way(thinking of plugin using this widget). So I think having common formatter will help us keeping the format consistent across plugins also.
So I mean here that having formatter define at one place and using same across (where ever required), which makes it consistent. Also there is no way to define formatter after bootgrid creation, it has to be define at time of bootgrid creation.
}, css: { @@ -138,4 +146,4 @@ wok.showBootgridData = function(opts) {
wok.hideBootgridData = function(opts) { $("#" + opts['gridId'] + " tbody").hide(); -}; \ No newline at end of file +}; diff --git a/ui/js/wok.user-log.js b/ui/js/wok.user-log.js index 8c2b4a7..1bdbd31 100644 --- a/ui/js/wok.user-log.js +++ b/ui/js/wok.user-log.js @@ -94,6 +94,7 @@ wok.listUserLogConfig = function() { "title": i18n['WOKSETT0004M'] }, { "column-id": 'time',
+ "formatter": "settings-user-log-time", "converter": 'string',
The data conversion should be done here and only pass the right data to the displayed on UI to wok.bootgrid.js
Same as above, I think using common formatter define above keep formatting consistent across.
"order": 'desc', "title": i18n['WOKSETT0005M'] @@ -243,4 +244,4 @@ wok.initUserLogWindow = function() { }); $('#form-advanced-search').submit(); }); -}; \ No newline at end of file +};
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 5/10/16 11:06 AM, Archana Singh wrote:
On 5/9/2016 6:55 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields in user activity log as per locale by using suitable formatters.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/ui/js/wok.bootgrid.js b/ui/js/wok.bootgrid.js index 1312fe5..e3b0b16 100644 --- a/ui/js/wok.bootgrid.js +++ b/ui/js/wok.bootgrid.js @@ -72,6 +72,14 @@ wok.createBootgrid = function(opts) { }, "settings-user-log-message": function(column, row) { return '<span class="trim" data-toggle="tooltip" data-placement="auto bottom" title="'+row.message+'">' +row.message+ '</span> '; + }, + "settings-user-log-date": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleDateString(wok.lang.get_locale()); + }, + "settings-user-log-time": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleTimeString(wok.lang.get_locale()); }
The same I commented about wok.list.js. wok.bootgrid.js is a generic widget which only display data in a visual format. It should not deal with data formatting, instead of that it should only receive the data to be displayed.
The data from backend if return and should be shown in UI depending upon the locale selected in UI by user while login. I agree that this is common widget and hence the format has to be done at common place to ensure that data & time are formatted as per locale selected by user in common way(thinking of plugin using this widget). So I think having common formatter will help us keeping the format consistent across plugins also.
I will not agree with your opinion that bootgrid should display only the data in a visual form as it is. Bootgrid documentation clearly says " Formatters are perfect to manipulate the visualization of data cells." http://www.jquery-bootgrid.com/documentation And in any means this is kind of not enforcement to all the fields. Field which has some formatting requirements can use the right formatter defined in the generic implementation.
}, css: { @@ -138,4 +146,4 @@ wok.showBootgridData = function(opts) {
wok.hideBootgridData = function(opts) { $("#" + opts['gridId'] + " tbody").hide(); -}; \ No newline at end of file +}; diff --git a/ui/js/wok.user-log.js b/ui/js/wok.user-log.js index 8c2b4a7..1bdbd31 100644 --- a/ui/js/wok.user-log.js +++ b/ui/js/wok.user-log.js @@ -94,6 +94,7 @@ wok.listUserLogConfig = function() { "title": i18n['WOKSETT0004M'] }, { "column-id": 'time',
+ "formatter": "settings-user-log-time", "converter": 'string',
The data conversion should be done here and only pass the right data to the displayed on UI to wok.bootgrid.js
Same as above, I think using common formatter define above keep formatting consistent across.
"order": 'desc', "title": i18n['WOKSETT0005M'] @@ -243,4 +244,4 @@ wok.initUserLogWindow = function() { }); $('#form-advanced-search').submit(); }); -}; \ No newline at end of file +};
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
On 05/10/2016 04:01 AM, Chandra Shekhar Reddy Potula wrote:
On 5/10/16 11:06 AM, Archana Singh wrote:
On 5/9/2016 6:55 PM, Aline Manera wrote:
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
co-authored by: Archana Singh <archus@linux.vnet.ibm.com>
v2: Modified call to fetch locale
v1: This patch formats the datetime fields in user activity log as per locale by using suitable formatters.
Signed-off-by: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> --- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/ui/js/wok.bootgrid.js b/ui/js/wok.bootgrid.js index 1312fe5..e3b0b16 100644 --- a/ui/js/wok.bootgrid.js +++ b/ui/js/wok.bootgrid.js @@ -72,6 +72,14 @@ wok.createBootgrid = function(opts) { }, "settings-user-log-message": function(column, row) { return '<span class="trim" data-toggle="tooltip" data-placement="auto bottom" title="'+row.message+'">' +row.message+ '</span> '; + },
+ "settings-user-log-date": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleDateString(wok.lang.get_locale()); + }, + "settings-user-log-time": function(column, row) { + var dte = new Date(row.date); + return dte.toLocaleTimeString(wok.lang.get_locale()); }
Look at this code! You are adding specific configuration from a Wok page into a common widget! It will not be accepted! Any conversion must be done prior to call the widget creation. The widget does not know which data to convert, it only displays the data into a visual format.
The same I commented about wok.list.js. wok.bootgrid.js is a generic widget which only display data in a visual format. It should not deal with data formatting, instead of that it should only receive the data to be displayed.
The data from backend if return and should be shown in UI depending upon the locale selected in UI by user while login. I agree that this is common widget and hence the format has to be done at common place to ensure that data & time are formatted as per locale selected by user in common way(thinking of plugin using this widget). So I think having common formatter will help us keeping the format consistent across plugins also.
I will not agree with your opinion that bootgrid should display only the data in a visual form as it is. Bootgrid documentation clearly says " Formatters are perfect to manipulate the visualization of data cells."
http://www.jquery-bootgrid.com/documentation
And in any means this is kind of not enforcement to all the fields. Field which has some formatting requirements can use the right formatter defined in the generic implementation.
}, css: { @@ -138,4 +146,4 @@ wok.showBootgridData = function(opts) {
wok.hideBootgridData = function(opts) { $("#" + opts['gridId'] + " tbody").hide(); -}; \ No newline at end of file +}; diff --git a/ui/js/wok.user-log.js b/ui/js/wok.user-log.js index 8c2b4a7..1bdbd31 100644 --- a/ui/js/wok.user-log.js +++ b/ui/js/wok.user-log.js @@ -94,6 +94,7 @@ wok.listUserLogConfig = function() { "title": i18n['WOKSETT0004M'] }, { "column-id": 'time',
+ "formatter": "settings-user-log-time", "converter": 'string',
The data conversion should be done here and only pass the right data to the displayed on UI to wok.bootgrid.js
Same as above, I think using common formatter define above keep formatting consistent across.
"order": 'desc', "title": i18n['WOKSETT0005M'] @@ -243,4 +244,4 @@ wok.initUserLogWindow = function() { }); $('#form-advanced-search').submit(); }); -}; \ No newline at end of file +};
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
Reviewed-by: Chandra Shekhar Reddy Potula <chandra@linux.vnet.ibm.com> On 5/5/16 12:32 PM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected.
Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale
ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-)
Hi all, I'd like suggest changes on UI layout. I am not sure about the best practices to display language and locale to users but I will suggest to put: <label> <drop down menu> in a single line, instead of having the label under the drop down menu. Samuel, any suggestion on that area? Regards, Aline Manera On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com>
This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected.
Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale
ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-)
In my opinion, I feel overall look and feel of login page might be lost if we do that way. On 5/9/16 7:09 PM, Aline Manera wrote:
Hi all,
I'd like suggest changes on UI layout.
I am not sure about the best practices to display language and locale to users but I will suggest to put:
<label> <drop down menu> in a single line, instead of having the label under the drop down menu.
Samuel, any suggestion on that area?
Regards, Aline Manera
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com wrote:
From: Pooja Kulkarni<pkulkark@linux.vnet.ibm.com>
This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected.
Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale
ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-)
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
Hi, I don't think the new login.html is good for accessibility with screen reader software. I don't have the tools to test it, but the form fields were added to a <dl> element (Definition list) when just the <form>, <label> and <input> elements should be enough for accessibility, usability and styling.
From my experience with screen readers, the output from a screen reader would be something like this: -Definition List -Definition term: Username. -Definition description: input type text Username. -Definition term: Password. -Definition description: input type password Password. -Definition term: Language. -Definition description: Select. -Selected option: English (US).
If we move the Locale and display it under the <select> element, it should be done with CSS only. Personally, I think it doesn't look good. Instead I think we could align it in the middle, just like we do with the Log In button. I don't think displaying the label and the select in a single line is good for mobile usability with the login page and it doesn't make sense to create a different login page for mobile and desktop just to move a label: http://baymard.com/blog/mobile-form-usability-label-position Thanks, Samuel From: kimchi-devel-bounces@ovirt.org [mailto:kimchi-devel-bounces@ovirt.org] On Behalf Of Aline Manera Sent: segunda-feira, 9 de maio de 2016 10:39 To: pkulkark@linux.vnet.ibm.com; Kimchi Devel <kimchi-devel@ovirt.org> Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support Hi all, I'd like suggest changes on UI layout. [cid:image001.jpg@01D1AA0F.DEB41430] I am not sure about the best practices to display language and locale to users but I will suggest to put: <label> <drop down menu> in a single line, instead of having the label under the drop down menu. Samuel, any suggestion on that area? Regards, Aline Manera On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com<mailto:pkulkark@linux.vnet.ibm.com> wrote: From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com><mailto:pkulkark@linux.vnet.ibm.com> This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected. Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-)
On 05/09/2016 04:44 PM, Samuel Henrique De Oliveira Guimaraes wrote:
Hi,
I don’t think the new login.html is good for accessibility with screen reader software. I don’t have the tools to test it, but the form fields were added to a <dl> element (Definition list) when just the <form>, <label> and <input> elements should be enough for accessibility, usability and styling.
From my experience with screen readers, the output from a screen reader would be something like this:
-Definition List
-Definition term: Username.
-Definition description: input type text Username.
-Definition term: Password.
-Definition description: input type password Password.
-Definition term: Language.
-Definition description: Select.
-Selected option: English (US).
If we move the Locale and display it under the <select> element, it should be done with CSS only. Personally, I think it doesn’t look good. Instead I think we could align it in the middle, just like we do with the Log In button.
I don’t think displaying the label and the select in a single line is good for mobile usability with the login page and it doesn’t make sense to create a different login page for mobile and desktop just to move a label: http://baymard.com/blog/mobile-form-usability-label-position
I am no UI expert but we need to be sure that we do not add any HTML5 code that will gives us trouble when dealing with Accessibility.
Thanks,
Samuel
*From:*kimchi-devel-bounces@ovirt.org [mailto:kimchi-devel-bounces@ovirt.org] *On Behalf Of *Aline Manera *Sent:* segunda-feira, 9 de maio de 2016 10:39 *To:* pkulkark@linux.vnet.ibm.com; Kimchi Devel <kimchi-devel@ovirt.org> *Subject:* Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support
Hi all,
I'd like suggest changes on UI layout.
imap://dhbarboza82%40gmail%2Ecom@imap.googlemail.com:993/fetch%3EUID%3E/%5BGmail%5D/kimchi-dev%3E5592?header=quotebody&part=1.1.2&filename=image001.jpg I am not sure about the best practices to display language and locale to users but I will suggest to put:
<label> <drop down menu> in a single line, instead of having the label under the drop down menu.
Samuel, any suggestion on that area?
Regards, Aline Manera
On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com <mailto:pkulkark@linux.vnet.ibm.com>wrote:
From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com> <mailto:pkulkark@linux.vnet.ibm.com>
This patch set provides multi-culture
support by adding another drop down
list during login for user locale
selection. The numeric data and datetime
fields are formatted based on the locale
selected.
Pooja Kulkarni (7):
Multi-Culture Support - Add a separate drop down list for locale
Multi-Culture support - Add methods to get and set locales in
wok.lang.js
Multi-Culture support - Add locale in format settings in
wok.line-chart.js
Multi-Culture support : Format datetime as per locale in wok.list.js
Multi-Culture support : Implement new drop down list for locale in
wok.login.js
Multi-Culture support : Modify wok.formatMeasurement util to include
formatting based on locale
Multi-Culture support : Format datetime in user activity log as per
locale
ui/js/src/wok.lang.js | 8 ++++++++
ui/js/src/wok.line-chart.js | 3 ++-
ui/js/src/wok.list.js | 6 +++++-
ui/js/src/wok.login.js | 9 +++++++++
ui/js/src/wok.utils.js | 10 +++++++---
ui/js/wok.bootgrid.js | 10 +++++++++-
ui/js/wok.user-log.js | 3 ++-
ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++
8 files changed, 76 insertions(+), 7 deletions(-)
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
Exactly. If you inspect the current code for username and password, they both have the placeholder attribute (html5) and hidden labels. Please note that elements with CSS property "display: none" are always ignored by screen reader software. The bootstrap class "sr-only" hides the content in the negative space of the element keeping the element display property unchanged. Samuel From: kimchi-devel-bounces@ovirt.org [mailto:kimchi-devel-bounces@ovirt.org] On Behalf Of Daniel Henrique Barboza Sent: terça-feira, 10 de maio de 2016 11:12 To: kimchi-devel@ovirt.org Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support On 05/09/2016 04:44 PM, Samuel Henrique De Oliveira Guimaraes wrote: Hi, I don't think the new login.html is good for accessibility with screen reader software. I don't have the tools to test it, but the form fields were added to a <dl> element (Definition list) when just the <form>, <label> and <input> elements should be enough for accessibility, usability and styling.
From my experience with screen readers, the output from a screen reader would be something like this: -Definition List -Definition term: Username. -Definition description: input type text Username. -Definition term: Password. -Definition description: input type password Password. -Definition term: Language. -Definition description: Select. -Selected option: English (US).
If we move the Locale and display it under the <select> element, it should be done with CSS only. Personally, I think it doesn't look good. Instead I think we could align it in the middle, just like we do with the Log In button. I don't think displaying the label and the select in a single line is good for mobile usability with the login page and it doesn't make sense to create a different login page for mobile and desktop just to move a label: http://baymard.com/blog/mobile-form-usability-label-position I am no UI expert but we need to be sure that we do not add any HTML5 code that will gives us trouble when dealing with Accessibility. Thanks, Samuel From: kimchi-devel-bounces@ovirt.org<mailto:kimchi-devel-bounces@ovirt.org> [mailto:kimchi-devel-bounces@ovirt.org] On Behalf Of Aline Manera Sent: segunda-feira, 9 de maio de 2016 10:39 To: pkulkark@linux.vnet.ibm.com<mailto:pkulkark@linux.vnet.ibm.com>; Kimchi Devel <kimchi-devel@ovirt.org><mailto:kimchi-devel@ovirt.org> Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support Hi all, I'd like suggest changes on UI layout. [imap://dhbarboza82%40gmail%2Ecom@imap.googlemail.com:993/fetch%3EUID%3E/%5BGmail%5D/kimchi-dev%3E5592?header=quotebody&part=1.1.2&filename=image001.jpg] I am not sure about the best practices to display language and locale to users but I will suggest to put: <label> <drop down menu> in a single line, instead of having the label under the drop down menu. Samuel, any suggestion on that area? Regards, Aline Manera On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com<mailto:pkulkark@linux.vnet.ibm.com> wrote: From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com><mailto:pkulkark@linux.vnet.ibm.com> This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected. Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-) _______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org<mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
By the way, if we need to change any element width in a different language, feel free to create a new SCSS module called "_locale.scss" or something like this and import into wok.scss or kimchi.scss. You can change the width based on locale using the "lang" attribute. In SCSS: [lang="pt-br"] { span.column-longfield { width: 350px; } } [lang="en-us"] { span.column-longfield { width: 120px; } } CSS output: [lang="pt-br"] span.column-longfield { width: 350px; } [lang="en-us"] span.column-longfield { width: 120px; } From: kimchi-devel-bounces@ovirt.org [mailto:kimchi-devel-bounces@ovirt.org] On Behalf Of Samuel Henrique De Oliveira Guimaraes Sent: terça-feira, 10 de maio de 2016 12:08 To: Daniel Henrique Barboza <dhbarboza82@gmail.com>; kimchi-devel@ovirt.org Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support Exactly. If you inspect the current code for username and password, they both have the placeholder attribute (html5) and hidden labels. Please note that elements with CSS property "display: none" are always ignored by screen reader software. The bootstrap class "sr-only" hides the content in the negative space of the element keeping the element display property unchanged. Samuel From: kimchi-devel-bounces@ovirt.org<mailto:kimchi-devel-bounces@ovirt.org> [mailto:kimchi-devel-bounces@ovirt.org] On Behalf Of Daniel Henrique Barboza Sent: terça-feira, 10 de maio de 2016 11:12 To: kimchi-devel@ovirt.org<mailto:kimchi-devel@ovirt.org> Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support On 05/09/2016 04:44 PM, Samuel Henrique De Oliveira Guimaraes wrote: Hi, I don't think the new login.html is good for accessibility with screen reader software. I don't have the tools to test it, but the form fields were added to a <dl> element (Definition list) when just the <form>, <label> and <input> elements should be enough for accessibility, usability and styling.
From my experience with screen readers, the output from a screen reader would be something like this: -Definition List -Definition term: Username. -Definition description: input type text Username. -Definition term: Password. -Definition description: input type password Password. -Definition term: Language. -Definition description: Select. -Selected option: English (US).
If we move the Locale and display it under the <select> element, it should be done with CSS only. Personally, I think it doesn't look good. Instead I think we could align it in the middle, just like we do with the Log In button. I don't think displaying the label and the select in a single line is good for mobile usability with the login page and it doesn't make sense to create a different login page for mobile and desktop just to move a label: http://baymard.com/blog/mobile-form-usability-label-position I am no UI expert but we need to be sure that we do not add any HTML5 code that will gives us trouble when dealing with Accessibility. Thanks, Samuel From: kimchi-devel-bounces@ovirt.org<mailto:kimchi-devel-bounces@ovirt.org> [mailto:kimchi-devel-bounces@ovirt.org] On Behalf Of Aline Manera Sent: segunda-feira, 9 de maio de 2016 10:39 To: pkulkark@linux.vnet.ibm.com<mailto:pkulkark@linux.vnet.ibm.com>; Kimchi Devel <kimchi-devel@ovirt.org><mailto:kimchi-devel@ovirt.org> Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support Hi all, I'd like suggest changes on UI layout. [imap://dhbarboza82%40gmail%2Ecom@imap.googlemail.com:993/fetch%3EUID%3E/%5BGmail%5D/kimchi-dev%3E5592?header=quotebody&part=1.1.2&filename=image001.jpg] I am not sure about the best practices to display language and locale to users but I will suggest to put: <label> <drop down menu> in a single line, instead of having the label under the drop down menu. Samuel, any suggestion on that area? Regards, Aline Manera On 05/05/2016 04:02 AM, pkulkark@linux.vnet.ibm.com<mailto:pkulkark@linux.vnet.ibm.com> wrote: From: Pooja Kulkarni <pkulkark@linux.vnet.ibm.com><mailto:pkulkark@linux.vnet.ibm.com> This patch set provides multi-culture support by adding another drop down list during login for user locale selection. The numeric data and datetime fields are formatted based on the locale selected. Pooja Kulkarni (7): Multi-Culture Support - Add a separate drop down list for locale Multi-Culture support - Add methods to get and set locales in wok.lang.js Multi-Culture support - Add locale in format settings in wok.line-chart.js Multi-Culture support : Format datetime as per locale in wok.list.js Multi-Culture support : Implement new drop down list for locale in wok.login.js Multi-Culture support : Modify wok.formatMeasurement util to include formatting based on locale Multi-Culture support : Format datetime in user activity log as per locale ui/js/src/wok.lang.js | 8 ++++++++ ui/js/src/wok.line-chart.js | 3 ++- ui/js/src/wok.list.js | 6 +++++- ui/js/src/wok.login.js | 9 +++++++++ ui/js/src/wok.utils.js | 10 +++++++--- ui/js/wok.bootgrid.js | 10 +++++++++- ui/js/wok.user-log.js | 3 ++- ui/pages/login.html.tmpl | 34 ++++++++++++++++++++++++++++++++++ 8 files changed, 76 insertions(+), 7 deletions(-) _______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org<mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
participants (6)
-
Aline Manera -
Archana Singh -
Chandra Shekhar Reddy Potula -
Daniel Henrique Barboza -
pkulkark＠linux.vnet.ibm.com -
Samuel Henrique De Oliveira Guimaraes