Challenge solutions

webapp/controller/App.controller.js

@@ -0,0 +1,12 @@
+sap.ui.define([
+    "ui5/challenge/controller/BaseController"
+], function (
+    Controller
+) {
+    "use strict";
+
+    return Controller.extend("ui5.challenge.controller.App", {
+        onInit: function () {
+        }
+    });
+});

webapp/controller/BaseController.js

@@ -1,9 +1,26 @@
 sap.ui.define([
-    "sap/ui/core/mvc/Controller"
-], function (Controller) {
+    "sap/ui/core/mvc/Controller",
+    "sap/ui/core/UIComponent"
+], function (Controller, UIComponent) {
     "use strict";
 
     return Controller.extend("ui5.challenge.controller.BaseController", {
+        /**
+         * @override
+         */
+        onInit: function () {
+            console.log("Base init");
+        },
+
+        /**
+         * Convenience method for getting the resource bundle.
+         * @public
+         * @returns {sap.ui.model.resource.ResourceModel} the resourceModel of the component
+         */
+        getResourceBundle: function () {
+            return this.getOwnerComponent().getModel("i18n").getResourceBundle();
+        },
+
         navTo: function (psTarget, pmParameters, pbReplace) {
             this.getRouter().navTo(psTarget, pmParameters, pbReplace);
         },

webapp/controller/Detail.controller.js

@@ -0,0 +1,54 @@
+sap.ui.define([
+    "ui5/challenge/controller/BaseController",
+    "sap/ui/core/routing/History",
+    "sap/m/MessageBox",
+    "sap/ui/model/json/JSONModel"
+], function (
+    BaseController,
+    History,
+    MessageBox,
+    JSONModel
+) {
+    "use strict";
+
+    return BaseController.extend("ui5.challenge.controller.Detail", {
+        /**
+         * @override
+         */
+        onInit: function () {
+            this.getRouter().getRoute("RouteProductDetail").attachPatternMatched(this._onPatternMatched, this);
+        },
+
+        _onPatternMatched: function (oEvent) {
+            var sProductId = window.decodeURIComponent(oEvent.getParameter("arguments").ProductID);
+            var oProductData = this.getOwnerComponent().getModel().getProperty("/ProductCollection").find(function (oProduct) {
+                return oProduct.ProductId == sProductId;
+            });
+            var oDetailModel = new JSONModel(oProductData);
+            this.getView().setModel(oDetailModel, "detailModel");
+        },
+
+        onNavButtonPress: function (oEvent) {
+            var oHistory = History.getInstance();
+            var sPreviousHash = oHistory.getPreviousHash();
+
+            if (sPreviousHash !== undefined) {
+                window.history.go(-1);
+            } else {
+                this.getRouter().navTo("RouteMain");
+            }
+        },
+
+        onDialogButtonPress: function () {
+            var oModel = this.getView().getModel("detailModel");
+            var sPrice = "NA";
+            if (oModel) {
+                var sPrice = oModel.getProperty("/Price") + " " + oModel.getProperty("/CurrencyCode");
+            }
+
+            MessageBox.information(sPrice, {
+                id: "myDialog"
+            });
+        }
+    });
+});

webapp/controller/Main.controller.js

@@ -0,0 +1,33 @@
+sap.ui.define([
+    "ui5/challenge/controller/BaseController",
+    "sap/ui/model/json/JSONModel"
+], function (
+    Controller,
+    JSONModel
+) {
+    "use strict";
+
+    return Controller.extend("ui5.challenge.controller.Main", {
+        /**
+         * @override
+         */
+        onInit: function () {
+            // var oModel = new JSONModel(sap.ui.require.toUrl("ui5/challenge/mockdata/products.json"));
+            // this.getView().setModel(oModel);
+        },
+
+        onButtonPress: function (oEvent) {
+            alert("Will be implemented soon ...");
+        },
+
+        onMyControlPress: function (oEvent) {
+            var oList = this.getView().byId("productsList");
+            var oSelectedItem = oList.getSelectedItem();
+            if (!oSelectedItem) {
+                this.getRouter().navTo("RouteDetail");
+            } else {
+                this.getRouter().navTo("RouteProductDetail", { "ProductID": oSelectedItem.getBindingContext().getProperty("ProductId") });
+            }
+        }
+    });
+});

webapp/i18n/i18n.properties

@@ -0,0 +1,8 @@
+appTitle=ui5-challenge
+appDescription=My fulfillment of ui5-challenge tests.
+
+myControl=Show details
+mainTitleText=wdi5 rocks
+
+Detail.dialogButton.text=How much?
+Detail.messageBox.text=Maybe next week :)

webapp/index.html

@@ -1,28 +1,19 @@
 <!DOCTYPE html>
 <html>
+
 <head>
-    <title>title</title>
+    <title>ui5-challenge</title>
 
-    <script
-        id="sap-ui-bootstrap"
-        src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
-        data-sap-ui-theme="sap_horizon"
-        data-sap-ui-resourceroots='{
+    <script id="sap-ui-bootstrap" src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
+        data-sap-ui-theme="sap_horizon" data-sap-ui-resourceroots='{
             "ui5.challenge": "./"
-        }'
-        data-sap-ui-oninit="module:sap/ui/core/ComponentSupport"
-        data-sap-ui-compatVersion="edge"
-        data-sap-ui-async="true"
-        data-sap-ui-frameOptions="trusted"
-    ></script>
+        }' data-sap-ui-oninit="module:sap/ui/core/ComponentSupport" data-sap-ui-compatVersion="edge"
+        data-sap-ui-async="true" data-sap-ui-frameOptions="trusted"></script>
 </head>
+
 <body class="sapUiBody sapUiSizeCompact" id="content">
-    <div
-        data-sap-ui-component
-        data-name="ui5.challenge"
-        data-id="container"
-        data-settings='{"id" : "ui5.challenge"}'
-        data-handle-validation="true"
-    ></div>
+    <div data-sap-ui-component data-name="ui5.challenge" data-id="container" data-settings='{"id" : "ui5.challenge"}'
+        data-handle-validation="true"></div>
 </body>
+
 </html>

webapp/manifest.json

@@ -3,11 +3,18 @@
   "sap.app": {
     "id": "ui5.challenge",
     "type": "application",
+    "i18n": "i18n/i18n.properties",
     "applicationVersion": {
       "version": "0.0.1"
     },
     "title": "{{appTitle}}",
-    "description": "{{appDescription}}"
+    "description": "{{appDescription}}",
+    "dataSources": {
+      "mainDataSource": {
+        "type": "JSON",
+        "uri": "mockdata/products.json"
+      }
+    }
   },
   "sap.ui": {
     "technology": "UI5",
@@ -47,8 +54,45 @@
         "controlId": "app",
         "clearControlAggregation": false
       },
-      "routes": [],
-      "targets": {}
+      "routes": [
+        {
+          "pattern": "",
+          "name": "RouteMain",
+          "target": [
+            "TargetMain"
+          ]
+        },
+        {
+          "pattern": "RouteDetail",
+          "name": "RouteDetail",
+          "target": [
+            "TargetDetail"
+          ]
+        },
+        {
+          "pattern": "RouteDetail/{ProductID}",
+          "name": "RouteProductDetail",
+          "target": [
+            "TargetDetail"
+          ]
+        }
+      ],
+      "targets": {
+        "TargetMain": {
+          "viewType": "XML",
+          "transition": "slide",
+          "clearControlAggregation": false,
+          "viewName": "Main",
+          "viewId": "main"
+        },
+        "TargetDetail": {
+          "viewType": "XML",
+          "transition": "slide",
+          "clearControlAggregation": false,
+          "viewName": "Detail",
+          "viewId": "Detail"
+        }
+      }
     },
     "rootView": {
       "viewName": "ui5.challenge.view.App",
@@ -62,6 +106,10 @@
         "settings": {
           "bundleName": "ui5.challenge.i18n.i18n"
         }
+      },
+      "": {
+        "dataSource": "mainDataSource",
+        "type": "sap.ui.model.json.JSONModel"
       }
     }
   }