Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[INTERNAL] Create ResourceBundle asynchronously #251

Merged
merged 2 commits into from
Oct 18, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
98 changes: 59 additions & 39 deletions webapp/controller/App.controller.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@ sap.ui.define([
"sap/ui/core/mvc/Controller",
"sap/ui/model/Filter",
"sap/ui/model/FilterOperator",
"sap/ui/model/json/JSONModel"
], (Device, Controller, Filter, FilterOperator, JSONModel) => {
"sap/ui/model/json/JSONModel",
"sap/base/strings/formatMessage"
], (Device, Controller, Filter, FilterOperator, JSONModel, formatMessage) => {
"use strict";

return Controller.extend("sap.ui.demo.todo.controller.App", {
Expand All @@ -14,17 +15,25 @@ sap.ui.define([
this.aTabFilters = [];

this.getView().setModel(new JSONModel({
isMobile: Device.browser.mobile,
filterText: undefined
isMobile: Device.browser.mobile
}), "view");
},

/**
* Get the default model from the view
*
* @returns {sap.ui.model.json.JSONModel} The model containing the todo list, etc.
*/
getModel() {
return this.getView().getModel();
},

/**
* Adds a new todo item to the bottom of the list.
*/
addTodo() {
const oModel = this.getView().getModel();
const aTodos = oModel.getProperty("/todos").map((oTodo) => Object.assign({}, oTodo));
const oModel = this.getModel();
const aTodos = this.getTodos().map((oTodo) => Object.assign({}, oTodo));

aTodos.push({
title: oModel.getProperty("/newTodo"),
Expand All @@ -36,41 +45,53 @@ sap.ui.define([
},

/**
* Removes all completed items from the todo list.
* Trigger removal of all completed items from the todo list.
*/
clearCompleted() {
const oModel = this.getView().getModel();
const aTodos = oModel.getProperty("/todos").map((oTodo) => Object.assign({}, oTodo));
onClearCompleted() {
const aTodos = this.getTodos().map((oTodo) => Object.assign({}, oTodo));
this.removeCompletedTodos(aTodos);
this.getModel().setProperty("/todos", aTodos);
},

/**
* Removes all completed items from the given todos.
*
* @param {object[]} aTodos
*/
removeCompletedTodos(aTodos) {
let i = aTodos.length;
while (i--) {
const oTodo = aTodos[i];
if (oTodo.completed) {
aTodos.splice(i, 1);
}
}
},

oModel.setProperty("/todos", aTodos);
/**
* Determines the todo list
*
* @returns {object[]} The todo list
*/
getTodos(){
const oModel = this.getModel();
return oModel && oModel.getProperty("/todos") || [];
},

/**
* Updates the number of items not yet completed
*/
updateItemsLeftCount() {
const oModel = this.getView().getModel();
const aTodos = oModel.getProperty("/todos") || [];

const iItemsLeft = aTodos.filter((oTodo) => oTodo.completed !== true).length;

oModel.setProperty("/itemsLeftCount", iItemsLeft);
onUpdateItemsLeftCount() {
const iItemsLeft = this.getTodos().filter((oTodo) => oTodo.completed !== true).length;
this.getModel().setProperty("/itemsLeftCount", iItemsLeft);
},

/**
* Trigger search for specific items. The removal of items is disable as long as the search is used.
* @param {sap.ui.base.Event} oEvent Input changed event
*/
onSearch(oEvent) {
const oModel = this.getView().getModel();
const oModel = this.getModel();

// First reset current filters
this.aSearchFilters = [];
Expand Down Expand Up @@ -104,7 +125,7 @@ sap.ui.define([
break;
case "all":
default:
// Don't use any filter
// Don't use any filter
}

this._applyListFilters();
Expand All @@ -116,30 +137,29 @@ sap.ui.define([

oBinding.filter(this.aSearchFilters.concat(this.aTabFilters), "todos");

let sI18nKey;
if (this.sFilterKey && this.sFilterKey !== "all") {
if (this.sFilterKey === "active") {
sI18nKey = "ACTIVE_ITEMS";
} else {
// completed items: sFilterKey = "completed"
sI18nKey = "COMPLETED_ITEMS";
}
if (this.sSearchQuery) {
sI18nKey += "_CONTAINING";
}
} else if (this.sSearchQuery) {
sI18nKey = "ITEMS_CONTAINING";
}
const sI18nKey = this.getI18NKey(this.sFilterKey, this.sSearchQuery);

let sFilterText;
this.byId("filterToolbar").setVisible(!!sI18nKey);
if (sI18nKey) {
const oResourceBundle = this.getView().getModel("i18n").getResourceBundle();
sFilterText = oResourceBundle.getText(sI18nKey, [this.sSearchQuery]);
this.byId("filterLabel").bindProperty("text", {
path: sI18nKey,
model: "i18n",
formatter: (textWithPlaceholder) => {
return formatMessage(textWithPlaceholder, [this.sSearchQuery]);
}
});
}

this.getView().getModel("view").setProperty("/filterText", sFilterText);
},

getI18NKey(sFilterKey, sSearchQuery) {
if (!sFilterKey || sFilterKey === "all") {
return sSearchQuery ? "ITEMS_CONTAINING" : undefined;
} else if (sFilterKey === "active") {
return "ACTIVE_ITEMS" + (sSearchQuery ? "_CONTAINING" : "");
} else {
return "COMPLETED_ITEMS" + (sSearchQuery ? "_CONTAINING" : "");
}
}
});

});
3 changes: 2 additions & 1 deletion webapp/manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,8 @@
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "sap.ui.demo.todo.i18n.i18n"
"bundleName": "sap.ui.demo.todo.i18n.i18n",
"async": true
}
},
"": {
Expand Down
Loading