Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -24,7 +24,7 @@
<ObjectListItem
title="{invoice>Quantity} x {invoice>ProductName}"
number="{
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
parts: [{path: 'invoice>ExTendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
Expand Down
Expand Up @@ -11,7 +11,6 @@ sap.ui.define(['sap/ui/core/UIComponent'],
stretch: true,
files: [
"webapp/controller/App.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand All @@ -21,9 +20,11 @@ sap.ui.define(['sap/ui/core/UIComponent'],
"webapp/localService/mockserver.js",
"webapp/model/formatter.js",
"webapp/view/App.view.xml",
"webapp/view/Detail.view.xml",
"webapp/view/HelloDialog.fragment.xml",
"webapp/view/HelloPanel.view.xml",
"webapp/view/InvoiceList.view.xml",
"webapp/view/Overview.view.xml",
"webapp/Component.js",
"webapp/index.html",
"webapp/manifest.json",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,9 +1,7 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog",
"sap/base/Log"
], function (UIComponent, JSONModel, HelloDialog, Log) {
"sap/ui/model/json/JSONModel"
], function (UIComponent, JSONModel) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand All @@ -25,35 +23,9 @@ sap.ui.define([
};
var oModel = new JSONModel(oData);
this.setModel(oModel);

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// open support window (only for demonstration purpose)
if (sap.ui.Device.system.desktop) {
setTimeout(function () {
Log.info("opening support window");
sap.ui.require(["sap/ui/core/support/Support"], function (Support) {
var oSupport = Support.getStub("APPLICATION");
oSupport.openSupportTool();
});
}, 3000);
}
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
// create the views based on the url/hash
this.getRouter().initialize();
}

});

});
Expand Up @@ -5,9 +5,6 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}
});

});

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -30,6 +30,11 @@ sap.ui.define([
var oList = this.byId("invoiceList");
var oBinding = oList.getBinding("items");
oBinding.filter(aFilter);
},

onPress: function (oEvent) {
var oRouter = this.getOwnerComponent().getRouter();
oRouter.navTo("detail");
}
});

Expand Down
Expand Up @@ -15,3 +15,6 @@ invoiceListTitle=Invoices
invoiceStatusA=New
invoiceStatusB=In Progress
invoiceStatusC=Done

# Detail Page
detailPageTitle=SAPUI5 Walkthrough - Details
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand All @@ -66,6 +67,37 @@
"uri": "css/style.css"
}
]
},
"routing": {
"config": {
"routerClass": "sap.m.routing.Router",
"viewType": "XML",
"viewPath": "sap.ui.demo.walkthrough.view",
"controlId": "app",
"controlAggregation": "pages"
},
"routes": [
{
"pattern": "",
"name": "overview",
"target": "overview"
},
{
"pattern": "detail",
"name": "detail",
"target": "detail"
}
],
"targets": {
"overview": {
"viewId": "overview",
"viewName": "Overview"
},
"detail": {
"viewId": "detail",
"viewName": "Detail"
}
}
}
}
}
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -4,20 +4,6 @@
xmlns:mvc="sap.ui.core.mvc"
displayBlock="true">
<Shell>
<App class="myAppDemoWT">
<pages>
<Page title="{i18n>homePageTitle}">
<headerContent>
<Button
icon="sap-icon://hello-world"
press=".onOpenDialog"/>
</headerContent>
<content>
<mvc:XMLView viewName="sap.ui.demo.walkthrough.view.HelloPanel" />
<mvc:XMLView viewName="sap.ui.demo.walkthrough.view.InvoiceList" />
</content>
</Page>
</pages>
</App>
<App class="myAppDemoWT" id="app"/>
</Shell>
</mvc:View>
@@ -0,0 +1,9 @@
<mvc:View
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Page
title="{i18n>detailPageTitle}">
<ObjectHeader
title="Invoice"/>
</Page>
</mvc:View>
Expand Up @@ -24,14 +24,16 @@
<ObjectListItem
title="{invoice>Quantity} x {invoice>ProductName}"
number="{
parts: [{path: 'invoice>ExTendedPrice'}, {path: 'view>/currency'}],
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
}"
numberUnit="{view>/currency}"
numberState="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }">
numberState="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }"
type="Navigation"
press=".onPress">
<firstStatus>
<ObjectStatus text="{
path: 'invoice>Status',
Expand Down
Expand Up @@ -3,15 +3,6 @@
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Page title="{i18n>homePageTitle}">
<landmarkInfo>
<PageAccessibleLandmarkInfo
rootRole="Region"
rootLabel="{i18n>Overview_rootLabel}"
contentRole="Main"
contentLabel="{i18n>Overview_contentLabel}"
headerRole="Banner"
headerLabel="{i18n>Overview_headerLabel}"/>
</landmarkInfo>
<headerContent>
<Button
icon="sap-icon://hello-world"
Expand Down
Expand Up @@ -11,7 +11,7 @@ sap.ui.define(['sap/ui/core/UIComponent'],
stretch: true,
files: [
"webapp/controller/App.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,8 +1,7 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog"
], function (UIComponent, JSONModel, HelloDialog) {
"sap/ui/model/json/JSONModel"
], function (UIComponent, JSONModel) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand All @@ -25,26 +24,9 @@ sap.ui.define([
var oModel = new JSONModel(oData);
this.setModel(oModel);

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// create the views based on the url/hash
this.getRouter().initialize();
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
}

});

});
Expand Up @@ -5,9 +5,6 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}
});

});
@@ -0,0 +1,20 @@
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (Controller) {
"use strict";

return Controller.extend("sap.ui.demo.walkthrough.controller.Detail", {

onInit: function () {
var oRouter = this.getOwnerComponent().getRouter();
oRouter.getRoute("detail").attachPatternMatched(this._onObjectMatched, this);
},

_onObjectMatched: function (oEvent) {
this.getView().bindElement({
path: "/" + window.decodeURIComponent(oEvent.getParameter("arguments").invoicePath),
model: "invoice"
});
}
});
});

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -33,8 +33,11 @@ sap.ui.define([
},

onPress: function (oEvent) {
var oItem = oEvent.getSource();
var oRouter = this.getOwnerComponent().getRouter();
oRouter.navTo("detail");
oRouter.navTo("detail", {
invoicePath: window.encodeURIComponent(oItem.getBindingContext("invoice").getPath().substr(1))
});
}
});

Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down Expand Up @@ -82,7 +83,7 @@
"target": "overview"
},
{
"pattern": "detail",
"pattern": "detail/{invoicePath}",
"name": "detail",
"target": "detail"
}
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
@@ -1,9 +1,11 @@
<mvc:View
controllerName="sap.ui.demo.walkthrough.controller.Detail"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Page
title="{i18n>detailPageTitle}">
<ObjectHeader
title="Invoice"/>
intro="{invoice>ShipperName}"
title="{invoice>ProductName}"/>
</Page>
</mvc:View>
Expand Up @@ -12,7 +12,6 @@ sap.ui.define(['sap/ui/core/UIComponent'],
files: [
"webapp/controller/App.controller.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,8 +1,7 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog"
], function (UIComponent, JSONModel, HelloDialog) {
"sap/ui/model/json/JSONModel"
], function (UIComponent, JSONModel) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand All @@ -24,27 +23,9 @@ sap.ui.define([
};
var oModel = new JSONModel(oData);
this.setModel(oModel);

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// create the views based on the url/hash
this.getRouter().initialize();
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
}

});

});
Expand Up @@ -5,9 +5,6 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}
});

});
@@ -1,6 +1,7 @@
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (Controller) {
"sap/ui/core/mvc/Controller",
"sap/ui/core/routing/History"
], function (Controller, History) {
"use strict";

return Controller.extend("sap.ui.demo.walkthrough.controller.Detail", {
Expand All @@ -15,6 +16,18 @@ sap.ui.define([
path: "/" + window.decodeURIComponent(oEvent.getParameter("arguments").invoicePath),
model: "invoice"
});
},

onNavBack: function () {
var oHistory = History.getInstance();
var sPreviousHash = oHistory.getPreviousHash();

if (sPreviousHash !== undefined) {
window.history.go(-1);
} else {
var oRouter = this.getOwnerComponent().getRouter();
oRouter.navTo("overview", {}, true);
}
}
});
});

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -3,7 +3,9 @@
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Page
title="{i18n>detailPageTitle}">
title="{i18n>detailPageTitle}"
showNavButton="true"
navButtonPress=".onNavBack">
<ObjectHeader
intro="{invoice>ShipperName}"
title="{invoice>ProductName}"/>
Expand Down
Expand Up @@ -10,9 +10,9 @@ sap.ui.define(['sap/ui/core/UIComponent'],
iframe: "webapp/test/mockServer.html",
stretch: true,
files: [
"webapp/control/ProductRating.js",
"webapp/controller/App.controller.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,8 +1,7 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog"
], function (UIComponent, JSONModel, HelloDialog) {
"sap/ui/model/json/JSONModel"
], function (UIComponent, JSONModel) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand All @@ -24,27 +23,9 @@ sap.ui.define([
};
var oModel = new JSONModel(oData);
this.setModel(oModel);

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// create the views based on the url/hash
this.getRouter().initialize();
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
}

});

});
Expand Up @@ -2,9 +2,8 @@ sap.ui.define([
"sap/ui/core/Control",
"sap/m/RatingIndicator",
"sap/m/Label",
"sap/m/Button",
"sap/ui/core/InvisibleText"
], function (Control, RatingIndicator, Label, Button, InvisibleText) {
"sap/m/Button"
], function (Control, RatingIndicator, Label, Button) {
"use strict";

return Control.extend("sap.ui.demo.walkthrough.control.ProductRating", {
Expand All @@ -16,11 +15,7 @@ sap.ui.define([
aggregations: {
_rating: {type: "sap.m.RatingIndicator", multiple: false, visibility: "hidden"},
_label: {type: "sap.m.Label", multiple: false, visibility: "hidden"},
_button: {type: "sap.m.Button", multiple: false, visibility: "hidden"},
_invText1: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"},
_invText2: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"},
_invText3: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"},
_invText4: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"}
_button: {type: "sap.m.Button", multiple: false, visibility: "hidden"}
},
events: {
change: {
Expand All @@ -32,31 +27,18 @@ sap.ui.define([
},

init: function () {
var invText1 = new InvisibleText({text:"{i18n>ratingIndicatorLabel}"});
var invText2 = new InvisibleText({text:"{i18n>ratingIndicatorDescription}"});
var invText3 = new InvisibleText({text:"{i18n>rateButtonLabel}"});
var invText4 = new InvisibleText({text:"{i18n>rateButtonDescription}"});
this.setAggregation("_invText1", invText1);
this.setAggregation("_invText2", invText2);
this.setAggregation("_invText3", invText3);
this.setAggregation("_invText4", invText4);

this.setAggregation("_rating", new RatingIndicator({
value: this.getValue(),
iconSize: "2rem",
visualMode: "Half",
liveChange: this._onRate.bind(this),
ariaLabelledBy: invText1,
ariaDescribedBy: invText2
liveChange: this._onRate.bind(this)
}));
this.setAggregation("_label", new Label({
text: "{i18n>productRatingLabelInitial}"
}).addStyleClass("sapUiSmallMargin"));
this.setAggregation("_button", new Button({
text: "{i18n>productRatingButton}",
press: this._onSubmit.bind(this),
ariaLabelledBy: invText3,
ariaDescribedBy: invText4
press: this._onSubmit.bind(this)
}).addStyleClass("sapUiTinyMarginTopBottom"));
},

Expand Down Expand Up @@ -105,10 +87,6 @@ sap.ui.define([
oRM.renderControl(oControl.getAggregation("_rating"));
oRM.renderControl(oControl.getAggregation("_label"));
oRM.renderControl(oControl.getAggregation("_button"));
oRM.renderControl(oControl.getAggregation("_invText1"));
oRM.renderControl(oControl.getAggregation("_invText2"));
oRM.renderControl(oControl.getAggregation("_invText3"));
oRM.renderControl(oControl.getAggregation("_invText4"));
oRM.write("</div>");
}
});
Expand Down
Expand Up @@ -5,9 +5,6 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}
});

});
@@ -1,7 +1,8 @@
sap.ui.define([
"sap/ui/core/mvc/Controller",
"sap/ui/core/routing/History"
], function (Controller, History) {
"sap/ui/core/routing/History",
"sap/m/MessageToast"
], function (Controller, History, MessageToast) {
"use strict";

return Controller.extend("sap.ui.demo.walkthrough.controller.Detail", {
Expand All @@ -12,6 +13,7 @@ sap.ui.define([
},

_onObjectMatched: function (oEvent) {
this.byId("rating").reset();
this.getView().bindElement({
path: "/" + window.decodeURIComponent(oEvent.getParameter("arguments").invoicePath),
model: "invoice"
Expand All @@ -28,6 +30,13 @@ sap.ui.define([
var oRouter = this.getOwnerComponent().getRouter();
oRouter.navTo("overview", {}, true);
}
},

onRatingChange: function (oEvent) {
var fValue = oEvent.getParameter("value");
var oResourceBundle = this.getView().getModel("i18n").getResourceBundle();

MessageToast.show(oResourceBundle.getText("ratingConfirmation", [fValue]));
}
});
});

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -10,3 +10,12 @@ html[dir="rtl"] .myAppDemoWT .myCustomButton.sapMBtn {
display: inline-block;
font-weight: bold;
}

/* ProductRating */
.myAppDemoWTProductRating {
padding: 0.75rem;
}

.myAppDemoWTProductRating .sapMRI {
vertical-align: initial;
}
Expand Up @@ -18,3 +18,10 @@ invoiceStatusC=Done

# Detail Page
detailPageTitle=SAPUI5 Walkthrough - Details
ratingConfirmation=You have rated this product with {0} stars

# Product Rating
productRatingLabelInitial=Please rate this product
productRatingLabelIndicator=Your rating: {0} out of {1}
productRatingLabelFinal=Thank you for your rating!
productRatingButton=Rate
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
@@ -1,13 +1,15 @@
<mvc:View
controllerName="sap.ui.demo.walkthrough.controller.Detail"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
xmlns:mvc="sap.ui.core.mvc"
xmlns:wt="sap.ui.demo.walkthrough.control">
<Page
title="{i18n>detailPageTitle}"
showNavButton="true"
navButtonPress=".onNavBack">
<ObjectHeader
intro="{invoice>ShipperName}"
title="{invoice>ProductName}"/>
<wt:ProductRating id="rating" class="sapUiSmallMarginBeginEnd" change=".onRatingChange"/>
</Page>
</mvc:View>
Expand Up @@ -13,7 +13,6 @@ sap.ui.define(['sap/ui/core/UIComponent'],
"webapp/control/ProductRating.js",
"webapp/controller/App.controller.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,8 +1,7 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog"
], function (UIComponent, JSONModel, HelloDialog) {
"sap/ui/model/json/JSONModel"
], function (UIComponent, JSONModel) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand All @@ -24,27 +23,9 @@ sap.ui.define([
};
var oModel = new JSONModel(oData);
this.setModel(oModel);

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// create the views based on the url/hash
this.getRouter().initialize();
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
}

});

});
Expand Up @@ -5,9 +5,6 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}
});

});

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -15,6 +15,11 @@ invoiceListTitle=Invoices
invoiceStatusA=New
invoiceStatusB=In Progress
invoiceStatusC=Done
columnQuantity=Quantity
columnName=Name
columnSupplier=Supplier
columnStatus=Status
columnPrice=Price

# Detail Page
detailPageTitle=SAPUI5 Walkthrough - Details
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -2,7 +2,7 @@
controllerName="sap.ui.demo.walkthrough.controller.InvoiceList"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<List
<Table
id="invoiceList"
class="sapUiResponsiveMargin"
width="auto"
Expand All @@ -20,27 +20,56 @@
<SearchField width="50%" search=".onFilterInvoices"/>
</Toolbar>
</headerToolbar>
<columns>
<Column
hAlign="End"
minScreenWidth="Small"
demandPopin="true"
width="5em">
<Text text="{i18n>columnQuantity}"/>
</Column>
<Column>
<Text text="{i18n>columnName}"/>
</Column>
<Column
minScreenWidth="Small"
demandPopin="true">
<Text text="{i18n>columnStatus}"/>
</Column>
<Column
minScreenWidth="Tablet"
demandPopin="false">
<Text text="{i18n>columnSupplier}"/>
</Column>
<Column
hAlign="End">
<Text text="{i18n>columnPrice}"/>
</Column>
</columns>
<items>
<ObjectListItem
title="{invoice>Quantity} x {invoice>ProductName}"
number="{
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
}"
numberUnit="{view>/currency}"
numberState="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }"
<ColumnListItem
type="Navigation"
press=".onPress">
<firstStatus>
<ObjectStatus text="{
<cells>
<ObjectNumber number="{invoice>Quantity}" emphasized="false"/>
<ObjectIdentifier title="{invoice>ProductName}"/>
<Text text="{
path: 'invoice>Status',
formatter: '.formatter.statusText'
}"/>
</firstStatus>
</ObjectListItem>
<Text text="{invoice>ShipperName}"/>
<ObjectNumber
number="{
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
}"
unit="{view>/currency}"
state="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }"/>
</cells>
</ColumnListItem>
</items>
</List>
</mvc:View>
</Table>
</mvc:View>
Expand Up @@ -13,7 +13,6 @@ sap.ui.define(['sap/ui/core/UIComponent'],
"webapp/control/ProductRating.js",
"webapp/controller/App.controller.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,8 +1,8 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog"
], function (UIComponent, JSONModel, HelloDialog) {
"sap/ui/Device"
], function (UIComponent, JSONModel, Device) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand All @@ -25,26 +25,13 @@ sap.ui.define([
var oModel = new JSONModel(oData);
this.setModel(oModel);

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// set device model
var oDeviceModel = new JSONModel(Device);
oDeviceModel.setDefaultBindingMode("OneWay");
this.setModel(oDeviceModel, "device");
// create the views based on the url/hash
this.getRouter().initialize();
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
}

});

});
Expand Up @@ -5,9 +5,6 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}
});

});
@@ -1,13 +1,19 @@
sap.ui.define([
"sap/ui/core/mvc/Controller",
"sap/ui/core/routing/History",
"sap/m/MessageToast"
], function (Controller, History, MessageToast) {
"sap/m/MessageToast",
"sap/ui/model/json/JSONModel"
], function (Controller, History, MessageToast, JSONModel) {
"use strict";

return Controller.extend("sap.ui.demo.walkthrough.controller.Detail", {

onInit: function () {
var oViewModel = new JSONModel({
currency: "EUR"
});
this.getView().setModel(oViewModel, "view");

var oRouter = this.getOwnerComponent().getRouter();
oRouter.getRoute("detail").attachPatternMatched(this._onObjectMatched, this);
},
Expand Down

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -6,7 +6,6 @@ html[dir="rtl"] .myAppDemoWT .myCustomButton.sapMBtn {
margin-left: 0.125rem
}


.myAppDemoWT .myCustomText {
display: inline-block;
font-weight: bold;
Expand Down
Expand Up @@ -24,6 +24,8 @@ columnPrice=Price
# Detail Page
detailPageTitle=SAPUI5 Walkthrough - Details
ratingConfirmation=You have rated this product with {0} stars
dateTitle=Order date
quantityTitle=Quantity

# Product Rating
productRatingLabelInitial=Please rate this product
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -8,8 +8,33 @@
showNavButton="true"
navButtonPress=".onNavBack">
<ObjectHeader
responsive="true"
fullScreenOptimized="true"
number="{
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
}"
numberUnit="{view>/currency}"
intro="{invoice>ShipperName}"
title="{invoice>ProductName}"/>
title="{invoice>ProductName}">
<attributes>
<ObjectAttribute title="{i18n>quantityTitle}" text="{invoice>Quantity}"></ObjectAttribute>
<ObjectAttribute title="{i18n>dateTitle}" text="{
path: 'invoice>ShippedDate',
type: 'sap.ui.model.type.Date',
formatOptions: {
style: 'long',
source: {
pattern: 'yyyy-MM-ddTHH:mm:ss'
}
}
}"/>
</attributes>
</ObjectHeader>
<wt:ProductRating id="rating" class="sapUiSmallMarginBeginEnd" change=".onRatingChange"/>
</Page>
</mvc:View>

Expand Up @@ -5,14 +5,16 @@
<Panel
headerText="{i18n>helloPanelTitle}"
class="sapUiResponsiveMargin"
width="auto">
width="auto"
expandable="{device>/system/phone}"
expanded="{= !${device>/system/phone} }">
<content>
<Button
id="helloDialogButton"
icon="sap-icon://world"
text="{i18n>openDialogButtonText}"
press=".onOpenDialog"
class="sapUiSmallMarginEnd"/>
class="sapUiSmallMarginEnd sapUiVisibleOnlyOnDesktop"/>
<Button
text="{i18n>showHelloButtonText}"
press=".onShowHello"
Expand Down
Expand Up @@ -25,7 +25,7 @@
hAlign="End"
minScreenWidth="Small"
demandPopin="true"
width="4em">
width="5em">
<Text text="{i18n>columnQuantity}"/>
</Column>
<Column>
Expand Down
Expand Up @@ -13,7 +13,6 @@ sap.ui.define(['sap/ui/core/UIComponent'],
"webapp/control/ProductRating.js",
"webapp/controller/App.controller.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand Down
Expand Up @@ -4,9 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,9 +1,8 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog",
"sap/ui/Device"
], function (UIComponent, JSONModel, HelloDialog, Device) {
], function (UIComponent, JSONModel, Device) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand Down Expand Up @@ -31,24 +30,19 @@ sap.ui.define([
oDeviceModel.setDefaultBindingMode("OneWay");
this.setModel(oDeviceModel, "device");

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// create the views based on the url/hash
this.getRouter().initialize();
},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
getContentDensityClass : function () {
if (!this._sContentDensityClass) {
if (!Device.support.touch) {
this._sContentDensityClass = "sapUiSizeCompact";
} else {
this._sContentDensityClass = "sapUiSizeCozy";
}
}
},

openHelloDialog : function () {
this._helloDialog.open();
return this._sContentDensityClass;
}

});
Expand Down
Expand Up @@ -5,9 +5,10 @@ sap.ui.define([

return Controller.extend("sap.ui.demo.walkthrough.controller.App", {

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
onInit: function () {
this.getView().addStyleClass(this.getOwnerComponent().getContentDensityClass());
}

});

});

This file was deleted.

Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,11 +40,16 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
"contentDensities": {
"compact": true,
"cozy": true
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,10 +16,10 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -25,7 +25,7 @@
hAlign="End"
minScreenWidth="Small"
demandPopin="true"
width="4em">
width="5em">
<Text text="{i18n>columnQuantity}"/>
</Column>
<Column>
Expand Down
Expand Up @@ -13,7 +13,6 @@ sap.ui.define(['sap/ui/core/UIComponent'],
"webapp/control/ProductRating.js",
"webapp/controller/App.controller.js",
"webapp/controller/Detail.controller.js",
"webapp/controller/HelloDialog.js",
"webapp/controller/HelloPanel.controller.js",
"webapp/controller/InvoiceList.controller.js",
"webapp/css/style.css",
Expand All @@ -37,7 +36,9 @@ sap.ui.define(['sap/ui/core/UIComponent'],
"webapp/test/integration/NavigationJourney.js",
"webapp/test/integration/opaTests.qunit.html",
"webapp/test/unit/model/formatter.js",
"webapp/test/unit/unitTests.qunit.html"
"webapp/test/unit/unitTests.qunit.html",
"ui5.yaml",
"package.json"
]
}
}
Expand Down
Expand Up @@ -4,10 +4,11 @@
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"dependencies": {
"@openui5/sap.m": "^1",
"@openui5/sap.ui.core": "^1",
"@openui5/sap.ui.layout": "^1",
"@openui5/themelib_sap_fiori_3": "^1"
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^2.0.0"
}
}
}
@@ -1,4 +1,11 @@
specVersion: '0.1'
specVersion: '2.5'
metadata:
name: WalkthroughTutorial
type: application
framework:
name: OpenUI5
version: 1.93.0
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_fiori_3
@@ -1,9 +1,8 @@
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel",
"./controller/HelloDialog",
"sap/ui/Device"
], function (UIComponent, JSONModel, HelloDialog, Device) {
], function (UIComponent, JSONModel, Device) {
"use strict";

return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
Expand Down Expand Up @@ -31,25 +30,8 @@ sap.ui.define([
oDeviceModel.setDefaultBindingMode("OneWay");
this.setModel(oDeviceModel, "device");

// set dialog
this.rootControlLoaded().then(function() {
this._helloDialog = new HelloDialog(this.getRootControl());
}.bind(this));

// create the views based on the url/hash
this.getRouter().initialize();

},

exit : function () {
if (this._helloDialog) {
this._helloDialog.destroy();
delete this._helloDialog;
}
},

openHelloDialog : function () {
this._helloDialog.open();
},

getContentDensityClass : function () {
Expand Down
Expand Up @@ -2,8 +2,9 @@ sap.ui.define([
"sap/ui/core/Control",
"sap/m/RatingIndicator",
"sap/m/Label",
"sap/m/Button"
], function (Control, RatingIndicator, Label, Button) {
"sap/m/Button",
"sap/ui/core/InvisibleText"
], function (Control, RatingIndicator, Label, Button, InvisibleText) {
"use strict";

return Control.extend("sap.ui.demo.walkthrough.control.ProductRating", {
Expand All @@ -15,7 +16,11 @@ sap.ui.define([
aggregations: {
_rating: {type: "sap.m.RatingIndicator", multiple: false, visibility: "hidden"},
_label: {type: "sap.m.Label", multiple: false, visibility: "hidden"},
_button: {type: "sap.m.Button", multiple: false, visibility: "hidden"}
_button: {type: "sap.m.Button", multiple: false, visibility: "hidden"},
_invText1: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"},
_invText2: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"},
_invText3: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"},
_invText4: {type: "sap.ui.core.InvisibleText", multiple: false, visibility: "hidden"}
},
events: {
change: {
Expand All @@ -27,18 +32,31 @@ sap.ui.define([
},

init: function () {
var invText1 = new InvisibleText({text:"{i18n>ratingIndicatorLabel}"});
var invText2 = new InvisibleText({text:"{i18n>ratingIndicatorDescription}"});
var invText3 = new InvisibleText({text:"{i18n>rateButtonLabel}"});
var invText4 = new InvisibleText({text:"{i18n>rateButtonDescription}"});
this.setAggregation("_invText1", invText1);
this.setAggregation("_invText2", invText2);
this.setAggregation("_invText3", invText3);
this.setAggregation("_invText4", invText4);

this.setAggregation("_rating", new RatingIndicator({
value: this.getValue(),
iconSize: "2rem",
visualMode: "Half",
liveChange: this._onRate.bind(this)
liveChange: this._onRate.bind(this),
ariaLabelledBy: invText1,
ariaDescribedBy: invText2
}));
this.setAggregation("_label", new Label({
text: "{i18n>productRatingLabelInitial}"
}).addStyleClass("sapUiSmallMargin"));
this.setAggregation("_button", new Button({
text: "{i18n>productRatingButton}",
press: this._onSubmit.bind(this)
press: this._onSubmit.bind(this),
ariaLabelledBy: invText3,
ariaDescribedBy: invText4
}).addStyleClass("sapUiTinyMarginTopBottom"));
},

Expand Down Expand Up @@ -87,6 +105,10 @@ sap.ui.define([
oRM.renderControl(oControl.getAggregation("_rating"));
oRM.renderControl(oControl.getAggregation("_label"));
oRM.renderControl(oControl.getAggregation("_button"));
oRM.renderControl(oControl.getAggregation("_invText1"));
oRM.renderControl(oControl.getAggregation("_invText2"));
oRM.renderControl(oControl.getAggregation("_invText3"));
oRM.renderControl(oControl.getAggregation("_invText4"));
oRM.write("</div>");
}
});
Expand Down
Expand Up @@ -7,11 +7,8 @@ sap.ui.define([

onInit: function () {
this.getView().addStyleClass(this.getOwnerComponent().getContentDensityClass());
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
}

});

});
Expand Up @@ -17,7 +17,22 @@ sap.ui.define([
},

onOpenDialog : function () {
this.getOwnerComponent().openHelloDialog();
// create dialog lazily
if (!this.pDialog) {
this.pDialog = this.loadFragment({
name: "sap.ui.demo.walkthrough.view.HelloDialog"
});
}

this.pDialog.then(function(oDialog) {
oDialog.open();
});
},

onCloseDialog : function () {
// note: We don't need to chain to the pDialog promise, since this event-handler
// is only called from within the loaded dialog itself.
this.byId("helloDialog").close();
}
});

Expand Down
Expand Up @@ -26,9 +26,27 @@ detailPageTitle=SAPUI5 Walkthrough - Details
ratingConfirmation=You have rated this product with {0} stars
dateTitle=Order date
quantityTitle=Quantity
Detail_rootLabel=Detail Page
Detail_headerLabel=Header
Detail_contentLabel=Page Content
ratingTitle=Rate the Product

# Product Rating
ratingIndicatorLabel=Rating indicator
ratingIndicatorDescription=Rate this product
rateButtonLabel=Button
rateButtonDescription=Submit your rating
productRatingLabelInitial=Please rate this product
productRatingLabelIndicator=Your rating: {0} out of {1}
productRatingLabelFinal=Thank you for your rating!
productRatingButton=Rate

#Overview Page
Overview_rootLabel=Overview Page
Overview_headerLabel=Header
Overview_contentLabel=Page Content
Detail_rootLabel=Detail Page
Detail_headerLabel=Header
Detail_contentLabel=Page Content
ratingTitle=Rate the Product

Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
Expand Down
Expand Up @@ -40,8 +40,9 @@
"id": "app"
},
"dependencies": {
"minUI5Version": "1.90",
"minUI5Version": "1.93",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
Expand Down
Expand Up @@ -6,7 +6,7 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
Expand All @@ -16,15 +16,15 @@
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>

<script src="opaTests.qunit.js"></script>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</body>
</html>
</html>
Expand Up @@ -6,7 +6,7 @@
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../"
Expand Down
Expand Up @@ -6,20 +6,20 @@

<script
id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
src="/resources/sap-ui-core.js"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "../../"
}'
data-sap-ui-async="true">
</script>

<link rel="stylesheet" type="text/css" href="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.css">
<link rel="stylesheet" type="text/css" href="/resources/sap/ui/thirdparty/qunit-2.css">

<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="https://openui5.hana.ondemand.com/resources/sap/ui/thirdparty/sinon-qunit.js"></script>
<script src="/resources/sap/ui/thirdparty/qunit-2.js"></script>
<script src="/resources/sap/ui/qunit/qunit-junit.js"></script>
<script src="/resources/sap/ui/qunit/qunit-coverage.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon.js"></script>
<script src="/resources/sap/ui/thirdparty/sinon-qunit.js"></script>

<script src="unitTests.qunit.js"></script>
</head>
Expand Down
Expand Up @@ -7,6 +7,15 @@
title="{i18n>detailPageTitle}"
showNavButton="true"
navButtonPress=".onNavBack">
<landmarkInfo>
<PageAccessibleLandmarkInfo
rootRole="Region"
rootLabel="{i18n>Detail_rootLabel}"
contentRole="Main"
contentLabel="{i18n>Detail_contentLabel}"
headerRole="Banner"
headerLabel="{i18n>Detail_headerLabel}"/>
</landmarkInfo>
<ObjectHeader
responsive="true"
fullScreenOptimized="true"
Expand Down Expand Up @@ -34,7 +43,10 @@
}"/>
</attributes>
</ObjectHeader>
<wt:ProductRating id="rating" class="sapUiSmallMarginBeginEnd" change=".onRatingChange"/>
<Panel
headerText="{i18n>ratingTitle}"
accessibleRole="Region">
<wt:ProductRating id="rating" class="sapUiSmallMarginBeginEnd" change=".onRatingChange"/>
</Panel>
</Page>
</mvc:View>

Expand Up @@ -5,10 +5,12 @@
id="helloDialog"
title="Hello {/recipient/name}">
<content>
<core:Icon
src="sap-icon://hello-world"
size="8rem"
class="sapUiMediumMargin"/>
<Panel>
<core:Icon
src="sap-icon://hello-world"
size="8rem"
class="sapUiMediumMargin"/>
</Panel>
</content>
<beginButton>
<Button
Expand Down
@@ -1,13 +1,15 @@
<mvc:View
controllerName="sap.ui.demo.walkthrough.controller.HelloPanel"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
xmlns:mvc="sap.ui.core.mvc"
xmlns:core="sap.ui.core">
<Panel
headerText="{i18n>helloPanelTitle}"
class="sapUiResponsiveMargin"
width="auto"
expandable="{device>/system/phone}"
expanded="{= !${device>/system/phone} }">
expanded="{= !${device>/system/phone} }"
accessibleRole="Region">
<content>
<Button
id="helloDialogButton"
Expand Down
@@ -1,75 +1,80 @@
<mvc:View
controllerName="sap.ui.demo.walkthrough.controller.InvoiceList"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Table
id="invoiceList"
class="sapUiResponsiveMargin"
width="auto"
items="{
path : 'invoice>/Invoices',
sorter : {
path : 'ShipperName',
group : true
}
}">
xmlns:mvc="sap.ui.core.mvc"
xmlns:core="sap.ui.core">
<Panel accessibleRole="Region">
<headerToolbar>
<Toolbar>
<Title text="{i18n>invoiceListTitle}"/>
<ToolbarSpacer/>
<SearchField width="50%" search=".onFilterInvoices"/>
<SearchField
width="50%"
search=".onFilterInvoices"/>
</Toolbar>
</headerToolbar>
<columns>
<Column
hAlign="End"
minScreenWidth="Small"
demandPopin="true"
width="4em">
<Text text="{i18n>columnQuantity}"/>
</Column>
<Column>
<Text text="{i18n>columnName}"/>
</Column>
<Column
minScreenWidth="Small"
demandPopin="true">
<Text text="{i18n>columnStatus}"/>
</Column>
<Column
minScreenWidth="Tablet"
demandPopin="false">
<Text text="{i18n>columnSupplier}"/>
</Column>
<Column
hAlign="End">
<Text text="{i18n>columnPrice}"/>
</Column>
</columns>
<items>
<ColumnListItem
type="Navigation"
press=".onPress">
<cells>
<ObjectNumber number="{invoice>Quantity}" emphasized="false"/>
<ObjectIdentifier title="{invoice>ProductName}"/>
<Text text="{
path: 'invoice>Status',
formatter: '.formatter.statusText'
}"/>
<Text text="{invoice>ShipperName}"/>
<ObjectNumber
number="{
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
}"
unit="{view>/currency}"
state="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }"/>
</cells>
</ColumnListItem>
</items>
</Table>
</mvc:View>
<Table
id="invoiceList"
class="sapUiResponsiveMargin"
width="auto"
items="{
path : 'invoice>/Invoices',
sorter : {
path : 'ShipperName',
group : true
}
}">
<columns>
<Column
hAlign="End"
minScreenWidth="Small"
demandPopin="true"
width="5em">
<Text text="{i18n>columnQuantity}"/>
</Column>
<Column>
<Text text="{i18n>columnName}"/>
</Column>
<Column
minScreenWidth="Small"
demandPopin="true">
<Text text="{i18n>columnStatus}"/>
</Column>
<Column
minScreenWidth="Tablet"
demandPopin="false">
<Text text="{i18n>columnSupplier}"/>
</Column>
<Column
hAlign="End">
<Text text="{i18n>columnPrice}"/>
</Column>
</columns>
<items>
<ColumnListItem
type="Navigation"
press=".onPress">
<cells>
<ObjectNumber number="{invoice>Quantity}" emphasized="false"/>
<ObjectIdentifier title="{invoice>ProductName}"/>
<Text text="{
path: 'invoice>Status',
formatter: '.formatter.statusText'
}"/>
<Text text="{invoice>ShipperName}"/>
<ObjectNumber
number="{
parts: [{path: 'invoice>ExtendedPrice'}, {path: 'view>/currency'}],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
}"
unit="{view>/currency}"
state="{= ${invoice>ExtendedPrice} > 50 ? 'Error' : 'Success' }"/>
</cells>
</ColumnListItem>
</items>
</Table>
</Panel>
</mvc:View>
Expand Up @@ -3,6 +3,15 @@
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Page title="{i18n>homePageTitle}">
<landmarkInfo>
<PageAccessibleLandmarkInfo
rootRole="Region"
rootLabel="{i18n>Overview_rootLabel}"
contentRole="Main"
contentLabel="{i18n>Overview_contentLabel}"
headerRole="Banner"
headerLabel="{i18n>Overview_headerLabel}"/>
</landmarkInfo>
<headerContent>
<Button
icon="sap-icon://hello-world"
Expand Down