<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8" />
<title>SAPUI5 Template</title>
<script data-sap-ui-compatversion="edge" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m" src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap"></script>
<script>
jQuery.sap.registerModulePath("demo", "");
jQuery.sap.require("sap.ui.core.util.MockServer");
var oMockServer;
sap.ui.getCore().attachInit(function() {
oMockServer = new sap.ui.core.util.MockServer({rootUri: "/odata/"});
oMockServer.simulate("./data/metadata.xml", {sMockdataBaseUrl: "./data"});
sap.ui.core.util.MockServer.config({
autoRespond: true,
autoRespondAfter: 1000
});
oMockServer.start();
new sap.m.Shell({
app: new sap.ui.core.ComponentContainer({
height: "100%",
name: "demo"
})
}).placeAt("content");
});
</script>
</head>
<body class="sapUiBody" id="content"></body>
</html>
<mvc:View xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" >
<App id="app" />
</mvc:View>
sap.ui.define([
"jquery.sap.global",
"sap/ui/core/UIComponent"
], function(jQuery, UIComponent) {
"use strict";
var Component = UIComponent.extend("demo.Component", {
metadata: {
manifest: "json"
},
init: function() {
UIComponent.prototype.init.apply(this, arguments);
this.getRouter().initialize();
}
});
return Component;
});
sap.ui.define([
"sap/ui/core/mvc/Controller",
"jquery.sap.global"
], function(Controller, jQuery) {
var SLICE_SIZE = 5;
var INTERVAL = 5000;
return Controller.extend("demo.controller.Main", {
count: undefined,
onInit: function() {
var oRouter = this.getOwnerComponent().getRouter();
oRouter.getRoute("default").attachPatternMatched(this.onDefault, this);
oRouter.getRoute("withStart").attachPatternMatched(this.onWithStart, this);
},
onDefault: function() {
this.updateView(0);
},
onWithStart: function(oEvent) {
var start = parseInt(oEvent.getParameter("arguments").start, 10);
this.updateView(start);
},
onTick: function(start) {
this.updateCountIfPossible();
start += SLICE_SIZE;
if (this.count && start >= this.count) {
start = 0;
}
this.getOwnerComponent().getRouter().navTo("withStart", {start: start});
},
updateCountIfPossible: function() {
if (!this.count) {
var oBinding = this.byId("list").getBinding("items");
if (oBinding.isLengthFinal()) {
this.count = oBinding.getLength();
}
}
},
updateView: function(start) {
this.byId("list").bindItems({
path: "/Meetups",
template: this.byId("template"),
templateShareable: true,
startIndex: start,
length: SLICE_SIZE
});
jQuery.sap.delayedCall(INTERVAL, this, this.onTick, [start]);
}
});
});
<mvc:View xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" controllerName="demo.controller.Main" >
<List id="list">
<dependents>
<StandardListItem id="template" title="{Title}"
description="{Description}" counter="{MeetupID}" />
</dependents>
</List>
</mvc:View>
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<edmx:Edmx Version="1.0"
xmlns:edmx="http://schemas.microsoft.com/ado/2007/06/edmx">
<edmx:DataServices
xmlns:m="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata" m:DataServiceVersion="1.0">
<Schema Namespace="NerdMeetup.Models"
xmlns:d="http://schemas.microsoft.com/ado/2007/08/dataservices"
xmlns:m="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata"
xmlns="http://schemas.microsoft.com/ado/2006/04/edm">
<EntityType Name="Meetup">
<Key>
<PropertyRef Name="MeetupID" />
</Key>
<Property Name="MeetupID" Type="Edm.Int32" Nullable="false" />
<Property Name="Title" Type="Edm.String" Nullable="true" />
<Property Name="Description" Type="Edm.String" Nullable="true" />
</EntityType>
<EntityContainer Name="NerdMeetups" m:IsDefaultEntityContainer="true">
<EntitySet Name="Meetups" EntityType="NerdMeetup.Models.Meetup" />
</EntityContainer>
</Schema>
</edmx:DataServices>
</edmx:Edmx>
[{
"MeetupID": 1,
"Title": "cubilia curae mauris",
"Description": "Innovative neutral intranet"
}, {
"MeetupID": 2,
"Title": "fermentum donec",
"Description": "Cross-group uniform time-frame"
}, {
"MeetupID": 3,
"Title": "nulla integer pede justo",
"Description": "Decentralized leading edge software"
}, {
"MeetupID": 4,
"Title": "dui nec",
"Description": "Customer-focused bottom-line implementation"
}, {
"MeetupID": 5,
"Title": "natoque penatibus et magnis",
"Description": "Quality-focused local time-frame"
}, {
"MeetupID": 6,
"Title": "ipsum dolor sit",
"Description": "Customer-focused 6th generation process improvement"
}, {
"MeetupID": 7,
"Title": "vehicula condimentum curabitur",
"Description": "Organized content-based throughput"
}, {
"MeetupID": 8,
"Title": "sapien cursus vestibulum",
"Description": "Down-sized full-range infrastructure"
}, {
"MeetupID": 9,
"Title": "orci luctus",
"Description": "Optional user-facing matrix"
}, {
"MeetupID": 10,
"Title": "laoreet ut rhoncus",
"Description": "Diverse even-keeled open architecture"
}, {
"MeetupID": 11,
"Title": "primis in faucibus",
"Description": "Profit-focused exuding frame"
}, {
"MeetupID": 12,
"Title": "mauris ullamcorper",
"Description": "Up-sized bandwidth-monitored time-frame"
}, {
"MeetupID": 13,
"Title": "quisque arcu libero",
"Description": "Optional value-added throughput"
}, {
"MeetupID": 14,
"Title": "in congue etiam",
"Description": "Implemented executive intranet"
}, {
"MeetupID": 15,
"Title": "nunc vestibulum ante",
"Description": "Fundamental directional complexity"
}, {
"MeetupID": 16,
"Title": "vel pede",
"Description": "Ameliorated encompassing pricing structure"
}, {
"MeetupID": 17,
"Title": "magnis dis parturient",
"Description": "Assimilated zero defect pricing structure"
}, {
"MeetupID": 18,
"Title": "lorem vitae mattis",
"Description": "Up-sized 4th generation website"
}, {
"MeetupID": 19,
"Title": "lectus pellentesque eget",
"Description": "Decentralized interactive throughput"
}, {
"MeetupID": 20,
"Title": "nullam molestie",
"Description": "Centralized fresh-thinking interface"
}, {
"MeetupID": 21,
"Title": "eu interdum eu tincidunt",
"Description": "Automated modular workforce"
}, {
"MeetupID": 22,
"Title": "lobortis ligula sit amet",
"Description": "Decentralized national algorithm"
}, {
"MeetupID": 23,
"Title": "eget vulputate",
"Description": "Centralized bottom-line Graphic Interface"
}, {
"MeetupID": 24,
"Title": "aenean auctor gravida",
"Description": "Profound scalable focus group"
}, {
"MeetupID": 25,
"Title": "justo eu",
"Description": "Monitored exuding support"
}, {
"MeetupID": 26,
"Title": "etiam vel augue vestibulum",
"Description": "Re-contextualized value-added knowledge base"
}, {
"MeetupID": 27,
"Title": "semper sapien a libero",
"Description": "Quality-focused content-based utilisation"
}, {
"MeetupID": 28,
"Title": "et tempus semper",
"Description": "Configurable even-keeled internet solution"
}, {
"MeetupID": 29,
"Title": "interdum venenatis turpis",
"Description": "Synchronised coherent process improvement"
}, {
"MeetupID": 30,
"Title": "in porttitor",
"Description": "Assimilated composite time-frame"
}, {
"MeetupID": 31,
"Title": "nullam varius",
"Description": "Up-sized high-level matrix"
}, {
"MeetupID": 32,
"Title": "a nibh",
"Description": "Open-architected 24 hour workforce"
}, {
"MeetupID": 33,
"Title": "amet diam in",
"Description": "Down-sized bi-directional open architecture"
}, {
"MeetupID": 34,
"Title": "dapibus dolor",
"Description": "Function-based high-level website"
}, {
"MeetupID": 35,
"Title": "nonummy integer",
"Description": "Extended user-facing productivity"
}, {
"MeetupID": 36,
"Title": "risus dapibus",
"Description": "Polarised dynamic workforce"
}, {
"MeetupID": 37,
"Title": "nisl venenatis lacinia",
"Description": "Mandatory maximized support"
}, {
"MeetupID": 38,
"Title": "est donec odio",
"Description": "Innovative tertiary knowledge user"
}, {
"MeetupID": 39,
"Title": "erat nulla",
"Description": "User-centric zero administration frame"
}, {
"MeetupID": 40,
"Title": "id consequat in consequat",
"Description": "Cross-platform fresh-thinking hub"
}, {
"MeetupID": 41,
"Title": "adipiscing molestie hendrerit at",
"Description": "Configurable bottom-line matrix"
}, {
"MeetupID": 42,
"Title": "nisl duis",
"Description": "Cross-platform content-based leverage"
}, {
"MeetupID": 43,
"Title": "sapien cum sociis natoque",
"Description": "Monitored disintermediate concept"
}, {
"MeetupID": 44,
"Title": "in sagittis",
"Description": "Cross-group background initiative"
}, {
"MeetupID": 45,
"Title": "convallis duis consequat",
"Description": "Quality-focused maximized parallelism"
}, {
"MeetupID": 46,
"Title": "felis sed interdum venenatis",
"Description": "Integrated content-based portal"
}, {
"MeetupID": 47,
"Title": "quisque porta",
"Description": "Virtual attitude-oriented open architecture"
}, {
"MeetupID": 48,
"Title": "ut rhoncus",
"Description": "Extended 6th generation collaboration"
}, {
"MeetupID": 49,
"Title": "cursus vestibulum proin",
"Description": "Multi-channelled impactful conglomeration"
}, {
"MeetupID": 50,
"Title": "turpis sed ante vivamus",
"Description": "Innovative zero defect knowledge base"
}, {
"MeetupID": 51,
"Title": "vulputate vitae nisl",
"Description": "Multi-channelled executive emulation"
}, {
"MeetupID": 52,
"Title": "ut volutpat sapien",
"Description": "Optional object-oriented hub"
}, {
"MeetupID": 53,
"Title": "tortor eu",
"Description": "Implemented well-modulated productivity"
}, {
"MeetupID": 54,
"Title": "lacinia eget tincidunt eget",
"Description": "Phased 6th generation functionalities"
}, {
"MeetupID": 55,
"Title": "luctus et ultrices",
"Description": "Centralized 24/7 service-desk"
}, {
"MeetupID": 56,
"Title": "velit id pretium",
"Description": "Balanced foreground core"
}, {
"MeetupID": 57,
"Title": "venenatis lacinia aenean sit",
"Description": "Cross-platform contextually-based middleware"
}, {
"MeetupID": 58,
"Title": "nunc viverra dapibus nulla",
"Description": "Open-source solution-oriented productivity"
}, {
"MeetupID": 59,
"Title": "donec dapibus duis",
"Description": "Open-architected homogeneous matrix"
}, {
"MeetupID": 60,
"Title": "at diam nam tristique",
"Description": "Polarised transitional portal"
}, {
"MeetupID": 61,
"Title": "diam id ornare",
"Description": "Optimized 6th generation website"
}, {
"MeetupID": 62,
"Title": "ipsum ac tellus semper",
"Description": "Balanced didactic extranet"
}, {
"MeetupID": 63,
"Title": "metus sapien ut",
"Description": "Total motivating knowledge base"
}, {
"MeetupID": 64,
"Title": "turpis elementum",
"Description": "Focused bifurcated archive"
}, {
"MeetupID": 65,
"Title": "tincidunt eu felis",
"Description": "Digitized maximized flexibility"
}, {
"MeetupID": 66,
"Title": "id luctus nec",
"Description": "Intuitive grid-enabled local area network"
}, {
"MeetupID": 67,
"Title": "sit amet justo morbi",
"Description": "Organized real-time pricing structure"
}, {
"MeetupID": 68,
"Title": "praesent blandit nam",
"Description": "Decentralized intangible customer loyalty"
}, {
"MeetupID": 69,
"Title": "in lacus",
"Description": "Automated well-modulated infrastructure"
}, {
"MeetupID": 70,
"Title": "morbi non quam nec",
"Description": "Ameliorated background process improvement"
}, {
"MeetupID": 71,
"Title": "pede morbi porttitor lorem",
"Description": "Fully-configurable composite info-mediaries"
}, {
"MeetupID": 72,
"Title": "nisl duis ac",
"Description": "Grass-roots analyzing benchmark"
}, {
"MeetupID": 73,
"Title": "in felis donec",
"Description": "Secured high-level focus group"
}, {
"MeetupID": 74,
"Title": "quis orci",
"Description": "Cross-group grid-enabled capacity"
}, {
"MeetupID": 75,
"Title": "nunc purus",
"Description": "Cross-platform scalable artificial intelligence"
}, {
"MeetupID": 76,
"Title": "sit amet consectetuer",
"Description": "Configurable coherent knowledge user"
}, {
"MeetupID": 77,
"Title": "convallis nulla",
"Description": "Horizontal high-level Graphical User Interface"
}, {
"MeetupID": 78,
"Title": "consequat metus",
"Description": "Inverse zero tolerance challenge"
}, {
"MeetupID": 79,
"Title": "curabitur in libero",
"Description": "Compatible high-level solution"
}, {
"MeetupID": 80,
"Title": "amet nunc",
"Description": "Implemented attitude-oriented help-desk"
}, {
"MeetupID": 81,
"Title": "odio consequat",
"Description": "Triple-buffered 6th generation process improvement"
}, {
"MeetupID": 82,
"Title": "turpis adipiscing",
"Description": "Face to face scalable conglomeration"
}, {
"MeetupID": 83,
"Title": "curabitur gravida",
"Description": "De-engineered bi-directional info-mediaries"
}, {
"MeetupID": 84,
"Title": "velit donec diam neque",
"Description": "Reverse-engineered national time-frame"
}, {
"MeetupID": 85,
"Title": "eget rutrum at",
"Description": "Managed modular utilisation"
}, {
"MeetupID": 86,
"Title": "in leo maecenas pulvinar",
"Description": "Organic client-driven emulation"
}, {
"MeetupID": 87,
"Title": "in felis eu",
"Description": "Exclusive high-level model"
}, {
"MeetupID": 88,
"Title": "orci luctus et ultrices",
"Description": "Persevering reciprocal task-force"
}, {
"MeetupID": 89,
"Title": "pede justo lacinia eget",
"Description": "Exclusive reciprocal groupware"
}, {
"MeetupID": 90,
"Title": "quam a odio in",
"Description": "Integrated local definition"
}, {
"MeetupID": 91,
"Title": "magna vulputate luctus cum",
"Description": "Compatible multi-tasking policy"
}, {
"MeetupID": 92,
"Title": "ipsum primis in",
"Description": "Enhanced fresh-thinking utilisation"
}, {
"MeetupID": 93,
"Title": "lectus in est",
"Description": "Compatible national leverage"
}, {
"MeetupID": 94,
"Title": "quisque porta volutpat erat",
"Description": "Optional incremental conglomeration"
}, {
"MeetupID": 95,
"Title": "fusce posuere felis sed",
"Description": "Pre-emptive motivating throughput"
}, {
"MeetupID": 96,
"Title": "varius integer",
"Description": "Synergized full-range budgetary management"
}, {
"MeetupID": 97,
"Title": "cubilia curae",
"Description": "Expanded tertiary productivity"
}, {
"MeetupID": 98,
"Title": "interdum venenatis turpis",
"Description": "Open-source national parallelism"
}, {
"MeetupID": 99,
"Title": "justo sit amet sapien",
"Description": "Implemented full-range intranet"
}, {
"MeetupID": 100,
"Title": "venenatis lacinia",
"Description": "Total bifurcated internet solution"
}]
{
"_version": "1.1.0",
"sap.app": {
"_version": "1.1.0",
"id": "demo",
"type": "application",
"title": "Demo",
"description": "Demo",
"applicationVersion": {
"version": "1.0.0"
},
"dataSources": {
"meetups": {
"uri": "/odata",
"type": "OData",
"settings": {
"odataVersion": "2.0"
}
}
}
},
"sap.ui": {
"_version": "1.1.0",
"technology": "UI5",
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
},
"supportedThemes": [
"sap_bluecrystal"
]
},
"sap.ui5": {
"_version": "1.1.0",
"rootView": "demo.view.App",
"routing": {
"config": {
"routerClass": "sap.m.routing.Router",
"viewType": "XML",
"viewPath": "demo.view",
"controlId": "app",
"controlAggregation": "pages"
},
"routes": [{
"pattern": "",
"name": "default",
"target": "main"
}, {
"pattern": "/{start}",
"name": "withStart",
"target": "main"
}],
"targets": {
"main": {
"viewName": "Main",
"viewLevel": 1
}
}
},
"dependencies": {
"minUI5Version": "1.30",
"libs": {
"sap.m": {}
}
},
"models": {
"": {
"dataSource": "meetups"
}
}
}
}