Skip to content
Snippets Groups Projects
Commit 977ae2c0 authored by Jared Hancock's avatar Jared Hancock
Browse files

i18n: Make the translate widget show a flag

to indicate the primary language expected for translatable content
parent 188345ff
No related branches found
No related tags found
No related merge requests found
......@@ -24,6 +24,7 @@ class ConfigAjaxAPI extends AjaxController {
global $cfg;
$lang = Internationalization::getCurrentLanguage();
$info = Internationalization::getLanguageInfo($lang);
list($sl, $locale) = explode('_', $lang);
$rtl = false;
......@@ -32,6 +33,10 @@ class ConfigAjaxAPI extends AjaxController {
$rtl = true;
}
$primary = $cfg->getPrimaryLanguage();
$primary_info = Internationalization::getLanguageInfo($primary);
list($primary_sl, $primary_locale) = explode('_', $primary);
$config=array(
'lock_time' => ($cfg->getLockTime()*3600),
'html_thread' => (bool) $cfg->isHtmlThreadEnabled(),
......@@ -39,7 +44,9 @@ class ConfigAjaxAPI extends AjaxController {
'lang' => $lang,
'short_lang' => $sl,
'has_rtl' => $rtl,
'primary_language' => $cfg->getPrimaryLanguage(),
'lang_flag' => $info['flag'] ?: strtolower($locale) ?: $sl,
'primary_lang_flag' => $primary_info['flag'] ?: strtolower($primary_locale) ?: $primary_sl,
'primary_language' => $primary,
'secondary_languages' => $cfg->getSecondaryLanguages(),
);
return $this->json_encode($config);
......
......@@ -807,7 +807,7 @@ class OsticketConfig extends Config {
$langs = $this->get('secondary_langs');
$langs = (is_string($langs)) ? explode(',', $langs) : array();
}
return $langs;
return array_filter($langs);
}
/* Needed by upgrader on 1.6 and older releases upgrade - not not remove */
......
......@@ -34,7 +34,6 @@ if (($lang = Internationalization::getCurrentLanguage())
<link rel="stylesheet" href="./css/scp.css" media="all">
<link rel="stylesheet" href="<?php echo ROOT_PATH; ?>css/redactor.css" media="screen">
<link rel="stylesheet" href="./css/typeahead.css" media="screen">
<link rel="stylesheet" href="./css/jquery.translatable.css" media="screen">
<link type="text/css" href="<?php echo ROOT_PATH; ?>css/ui-lightness/jquery-ui-1.10.3.custom.min.css"
rel="stylesheet" media="screen" />
<link type="text/css" rel="stylesheet" href="<?php echo ROOT_PATH; ?>css/font-awesome.min.css">
......@@ -43,7 +42,9 @@ if (($lang = Internationalization::getCurrentLanguage())
<![endif]-->
<link type="text/css" rel="stylesheet" href="./css/dropdown.css">
<link type="text/css" rel="stylesheet" href="<?php echo ROOT_PATH; ?>css/loadingbar.css"/>
<link type="text/css" rel="stylesheet" href="<?php echo ROOT_PATH; ?>css/flags.css">
<link type="text/css" rel="stylesheet" href="<?php echo ROOT_PATH; ?>css/rtl.css"/>
<link type="text/css" rel="stylesheet" href="./css/translatable.css"/>
<script type="text/javascript" src="./js/jquery.dropdown.js"></script>
<?php
......
......@@ -45,6 +45,7 @@ $info=Format::htmlchars(($errors && $_POST)?$_POST:$info);
</td>
<td>
<input type="text" size="30" name="topic" value="<?php echo $info['topic']; ?>"
data-primary-lang="<?php echo $cfg->getPrimaryLanguage(); ?>"
data-translate-tag="<?php echo $trans['name']; ?>"/>
&nbsp;<span class="error">*&nbsp;<?php echo $errors['topic']; ?></span> <i class="help-tip icon-question-sign" href="#topic"></i>
</td>
......
button.translatable {
background-color: #ccc;
border: none;
border-radius: 0 4px 4px 0;
}
div.add-translation {
margin-top: 5px;
padding: 5px;
border-top: 1px solid rgba(0, 0, 0, 0.3);
}
div.translations {
min-height: 20px;
}
ul.translations {
padding-left: 0;
min-width: 300px;
max-height: 150px;
overflow-y: auto;
}
ul.translations li {
list-style: none;
padding: 0 10px;
box-sizing: border-box;
display: block;
}
ul.translations li + li {
margin-top: 10px;
}
ul.translations li label.language {
color: #888;
}
ul.translations li input {
width: 100%;
box-sizing: border-box;
}
.language-commit {
text-align: right;
padding: 5px 10px;
background-color: cyan;
}
......@@ -9,22 +9,11 @@
if (!this.$element.data('translateTag'))
return;
this.$translations = $('<ul class="translations"></ul>');
this.$status = $('<li class="status"><i class="icon-spinner icon-spin"></i> Loading ...</li>')
.appendTo(this.$translations);
this.$footer = $('<div class="add-translation"></div>');
this.$select = $('<select name="locale"></select>');
this.$menu = $(this.options.menu).appendTo('body');
this.$element.wrap(
$('<span></span>').css({display:'inline-block', 'white-space':'nowrap'})
)
this.$button = $(this.options.button).insertAfter(this.$element);
//this.$menu.append('<a class="close pull-right" href=""><i class="icon-remove-circle"></i></a>')
// .on('click', $.proxy(this.hide, this));
this.$menu.append(this.$translations).append(this.$footer);
this.shown = false;
this.populated = false;
this.decorate();
var self = this;
this.fetch('ajax.php/i18n/langs').then(function(json) {
self.langs = json;
if (Object.keys(self.langs).length) self.decorate();
});
},
// Class-static variables
urlcache = {};
......@@ -44,9 +33,33 @@
},
decorate: function() {
this.$translations = $('<ul class="translations"></ul>');
this.$status = $('<li class="status"><i class="icon-spinner icon-spin"></i> Loading ...</li>')
.appendTo(this.$translations);
this.$footer = $('<div class="add-translation"></div>');
this.$select = $('<select name="locale"></select>');
this.$menu = $(this.options.menu).appendTo('body');
this.$container = $('<div class="translatable"></div>')
.prependTo(this.$element.parent())
.append(this.$element);
this.$button = $(this.options.button).insertAfter(this.$container);
//this.$menu.append('<a class="close pull-right" href=""><i class="icon-remove-circle"></i></a>')
// .on('click', $.proxy(this.hide, this));
this.$menu.append(this.$translations).append(this.$footer);
this.shown = false;
this.populated = false;
this.$button.on('click', $.proxy(this.toggle, this));
var self = this;
this.fetch('ajax.php/i18n/langs').then(function(json) { self.langs = json; });
this.$element
.addClass('translatable')
.focus($.proxy(function() { this.addClass('focus'); }, this.$container))
.blur($.proxy(function() { this.removeClass('focus'); }, this.$container));
getConfig().then($.proxy(function(c) {
$('<span class="flag"></span>')
.addClass('flag-' + c.primary_lang_flag)
.insertAfter(this);
}, this.$element));
},
buildAdd: function() {
......@@ -143,8 +156,8 @@
if (this.shown)
return this;
var pos = $.extend({}, this.$element.offset(), {
height: this.$element[0].offsetHeight
var pos = $.extend({}, this.$container.offset(), {
height: this.$container[0].offsetHeight
})
this.$menu.css({
......@@ -184,7 +197,7 @@
};
$.fn.translatable.defaults = {
menu: '<div class="translatable dropdown-menu"></div>',
menu: '<div class="translations dropdown-menu"></div>',
button: '<button class="translatable"><i class="fa fa-globe icon-globe"></i></button>'
};
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment