ricma/exampleWebSocket.html

## exampleWebSocket.html
<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

    <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
        id="sap-ui-bootstrap"
        data-sap-ui-libs="sap.ui.commons,sap.ui.table"
        data-sap-ui-theme="sap_bluecrystal"
        type="text/javascript">
    </script>
    <script type="text/javascript"
            src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js">
    </script>

    <script type="text/javascript">

      "use strict";

      var oModel = new sap.ui.model.json.JSONModel({
        some: [
          { key: "1", value: "Berlin" },
          { key: "2", value: "Hamburg" } ]});

      // mock a web socket locally
      var mockWs;

      function mockWSock() {
        var self = this,
        count = oModel.getProperty("/some").length + 1;

        console.log("message: " + count);
        mockWs.dispatchEvent(
          new MessageEvent(
            "message", {
              data: JSON.stringify({
                key: count,
                value: count})}));

        // call the next time after 3000ms
        if (count < 14) {
          _.delay( mockWSock, 3000 );
        }
      }

      // unfortunately only works in Chrome
      mockWs = new WebSocket("ws://mockWs");

      mockWs.onmessage = function(event) {
        // retrieve the message and put it into a JSONModel
        var jsonData = JSON.parse(event.data);
        oModel.setProperty("/some",
          jQuery.merge([jsonData], oModel.getProperty("/some")));
        oModel.refresh(/* force */ true);
      };

      var oComboBox = new sap.ui.commons.ComboBox({
        items: {
          path: "r>some",
          template: new sap.ui.core.ListItem({
            key: "{r>key}",
            text: "{r>value}"})}}).
      setModel(oModel, "r").
      bindElement("r>/").
      placeAt("content");

      $(function() {
        // start the mocking
        mockWSock();
      });

    </script>
  </head>

  <body class="sapUiBody">
    <div id="content"></div>
  </body>
</html>
	<!DOCTYPE HTML>
	<html>
	<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

	<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
	id="sap-ui-bootstrap"
	data-sap-ui-libs="sap.ui.commons,sap.ui.table"
	data-sap-ui-theme="sap_bluecrystal"
	type="text/javascript">
	</script>
	<script type="text/javascript"
	src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js">
	</script>

	<script type="text/javascript">

	"use strict";

	var oModel = new sap.ui.model.json.JSONModel({
	some: [
	{ key: "1", value: "Berlin" },
	{ key: "2", value: "Hamburg" } ]});

	// mock a web socket locally
	var mockWs;

	function mockWSock() {
	var self = this,
	count = oModel.getProperty("/some").length + 1;

	console.log("message: " + count);
	mockWs.dispatchEvent(
	new MessageEvent(
	"message", {
	data: JSON.stringify({
	key: count,
	value: count})}));

	// call the next time after 3000ms
	if (count < 14) {
	_.delay( mockWSock, 3000 );
	}
	}

	// unfortunately only works in Chrome
	mockWs = new WebSocket("ws://mockWs");

	mockWs.onmessage = function(event) {
	// retrieve the message and put it into a JSONModel
	var jsonData = JSON.parse(event.data);
	oModel.setProperty("/some",
	jQuery.merge([jsonData], oModel.getProperty("/some")));
	oModel.refresh(/* force */ true);
	};

	var oComboBox = new sap.ui.commons.ComboBox({
	items: {
	path: "r>some",
	template: new sap.ui.core.ListItem({
	key: "{r>key}",
	text: "{r>value}"})}}).
	setModel(oModel, "r").
	bindElement("r>/").
	placeAt("content");

	$(function() {
	// start the mocking
	mockWSock();
	});

	</script>
	</head>

	<body class="sapUiBody">
	<div id="content"></div>
	</body>
	</html>