<%@page import="java.util.ArrayList"%>
<%@page import="org.json.JSONObject"%>
<%@page import="java.util.List"%>
<%@page import="java.util.Locale"%>
<%@page import="org.exoplatform.web.application.RequestContext"%>
<%@page import="org.json.JSONArray"%>
<%@page import="java.util.Set"%>
<%@page
  import="org.exoplatform.portal.localization.LocaleContextInfoUtils"%>
<%
  Locale userLocale = RequestContext.getCurrentInstance().getLocale();
	Set<Locale> locales = LocaleContextInfoUtils.getSupportedLocales();
	List<Locale> localesList = new ArrayList(locales);
	JSONArray localesJSON = new JSONArray();
  for (Locale locale : localesList) {
    if (locale != null) {
      JSONObject object = new JSONObject();
      if (locale.toString().equals("ma")) {
        continue;
      } else {
        object.put("value", locale.toLanguageTag());
        object.put("text", userLocale.equals(locale) ?
          locale.getDisplayName(locale) :
          locale.getDisplayName(userLocale) + " / " + locale.getDisplayName(locale));
      }
      localesJSON.put(object);
    }
  }
%>
<div class="VuetifyApp">
  <div data-app="true"
    class="v-application v-application--is-ltr theme--light"
    id="UserSettingLanguage">
    <v-cacheable-dom-app cache-id="UserSettingLanguage"></v-cacheable-dom-app>
    <textarea id="userLanguagesValue" class="hidden"><%=localesJSON.toString()%></textarea>
    <script type="text/javascript">
      require(['PORTLET/social/UserSettingLanguage'], app => app.init(JSON.parse(document.getElementById('userLanguagesValue').value)));
    </script>
  </div>
</div>
