Et2SelectCountry: Use CSS for flag images

This commit is contained in:
nathan 2022-06-22 15:47:28 -06:00
parent e54fbaffb1
commit 9b3de5db95
5 changed files with 1382 additions and 1088 deletions

View File

@ -495,30 +495,6 @@ export class Et2SelectBool extends Et2Select
customElements.define("et2-select-bool", Et2SelectBool);
export class Et2SelectCountry extends Et2Select
{
constructor()
{
super();
this.search = true;
so.country(this, {}, true).then(options => options.map((country) => {
if (country.value[0] !== '-')
{
country.icon = egw.image('flags');
country.class = 'flag-'+country.value.toLowerCase();
}
return country;
})).then(options => {
this.select_options = options
});
}
}
// @ts-ignore TypeScript is not recognizing that this widget is a LitElement
customElements.define("et2-select-country", Et2SelectCountry);
export class Et2SelectDay extends Et2Select
{
constructor()

View File

@ -0,0 +1,52 @@
/**
* EGroupware eTemplate2 - Select Country WebComponent
*
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @package api
* @link https://www.egroupware.org
* @author Nathan Gray
*/
import {Et2Select} from "./Et2Select";
import {StaticOptions} from "./StaticOptions";
import {SelectOption} from "./FindSelectOptions";
import {egw} from "../../jsapi/egw_global";
/**
* Customised Select widget for countries
* This widget uses CSS from api/templates/default/css/flags.css to set flags
*/
egw(window).includeCSS("/egroupware/api/templates/default/css/flags.css")
export class Et2SelectCountry extends Et2Select
{
static get properties()
{
return {
...super.properties,
/* Reflect the value so we can use CSS selectors */
value: {type: String, reflect: true}
}
}
constructor()
{
super();
this.search = true;
(<Promise<SelectOption[]>>so.country(this, {}, true)).then(options =>
{
this.select_options = options
});
}
}
/**
* Use a single StaticOptions, since it should have no state
* @type {StaticOptions}
*/
const so = new StaticOptions();
customElements.define("et2-select-country", Et2SelectCountry);

View File

@ -1139,7 +1139,7 @@ const Et2WidgetMixin = <T extends Constructor>(superClass : T) =>
// perspective for this node
if(typeof this._mgrs[key] != "undefined" && mgr.perspectiveData.owner == this)
{
mgr = mgr.parentMgr;
mgr = mgr.getParentMgr();
}
// Check whether the manager has a namespace for the id of this object

View File

@ -52,6 +52,7 @@ import './Et2Link/Et2LinkTo';
import './Et2Select/Et2Select';
import './Et2Select/Et2SelectAccount';
import './Et2Select/Et2SelectCategory';
import './Et2Select/Et2SelectCountry';
import './Et2Select/Et2SelectEmail';
import './Et2Select/Et2SelectReadonly';
import './Et2Select/Et2SelectThumbnail'

File diff suppressed because it is too large Load Diff