npm - @flashphoner/websdk - Versions diffs - 2.0.202 → 2.0.207 - Mend

@flashphoner/websdk 2.0.202 → 2.0.207

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (51) hide show

package/examples/demo/streaming/media_devices_manager/manager.js CHANGED Viewed

@@ -5,6 +5,7 @@ var STREAM_EVENT_TYPE = Flashphoner.constants.STREAM_EVENT_TYPE;
 var CONNECTION_QUALITY = Flashphoner.constants.CONNECTION_QUALITY;
 var MEDIA_DEVICE_KIND = Flashphoner.constants.MEDIA_DEVICE_KIND;
 var TRANSPORT_TYPE = Flashphoner.constants.TRANSPORT_TYPE;
+var CONTENT_HINT_TYPE = Flashphoner.constants.CONTENT_HINT_TYPE;
 var CONNECTION_QUALITY_UPDATE_TIMEOUT_MS = 10000;
 var preloaderUrl = "../../dependencies/media/preloader.mp4";
 var Browser = Flashphoner.Browser;
@@ -412,6 +413,7 @@ function publish() {
     var mediaConnectionConstraints;
     var session = Flashphoner.getSessions()[0];
     var transportInput = $('#transportInput').val();
+    var contentHint = $('#contentHintInput').val();
     var cvo = $("#cvo").is(':checked');
     var strippedCodecs = $("#stripPublishCodecs").val();
@@ -434,7 +436,8 @@ function publish() {
         sdpHook: rewriteSdp,
         transport: transportInput,
         cvoExtension: cvo,
-        stripCodecs: strippedCodecs
+        stripCodecs: strippedCodecs,
+        videoContentHint: contentHint
     }).on(STREAM_STATUS.PUBLISHING, function (stream) {
         $("#testBtn").prop('disabled', true);
         var video = document.getElementById(stream.id());
@@ -862,6 +865,29 @@ function readyControls() {
         option.value = transportType;
         transportOutput.appendChild(option);
     }
+    //init content hint form
+    var contentType;
+    var contentTypeValue;
+    var option;
+    var contentHintInput = document.getElementById("contentHintInput");
+    for (contentType in CONTENT_HINT_TYPE) {
+        option = document.createElement("option");
+        switch(contentType) {
+            case 'MOTION':
+                contentTypeValue = CONTENT_HINT_TYPE.MOTION;
+            break;
+            case 'DETAIL':
+                contentTypeValue = CONTENT_HINT_TYPE.DETAIL;
+            break;
+            case 'TEXT':
+                contentTypeValue = CONTENT_HINT_TYPE.TEXT;
+            break;
+        }
+        option.text = contentTypeValue;
+        option.value = contentTypeValue;
+        contentHintInput.appendChild(option);
+    }
 }
 // Stat

package/examples/demo/streaming/media_devices_manager/media_device_manager.html CHANGED Viewed

@@ -245,6 +245,13 @@
                             <input type="checkbox" class="checkbox" id="cvo" value="false">
                         </div>
                     </div>
+                    <div class="form-group" id="contentHintInputForm">
+                        <label style="text-align: left" class="col-sm-4 control-label">Content Hint</label>
+                        <div class="col-sm-6">
+                            <select class="form-control" id="contentHintInput">
+                            </select>
+                        </div>
+                    </div>
                     <div class="form-group">
                         <label style="text-align: left" class="col-sm-4 control-label">Mute</label>
                         <div class="col-sm-6">

package/examples/demo/streaming/stream-auto-restore/stream-auto-restore.css ADDED Viewed

@@ -0,0 +1,23 @@
+.fp-Video {
+    border: 1px double black;
+    width: 322px;
+    height: 242px;
+    text-align: center;
+    background: #c0c0c0;
+    margin: 0 auto 0 auto;
+}
+.display {
+    width: 100%;
+    height: 100%;
+    display: inline-block;
+}
+.display > video, object {
+    width: 100%;
+    height: 100%;
+}
+video:-webkit-full-screen {
+    border-radius: 1px;
+}

package/examples/demo/streaming/stream-auto-restore/stream-auto-restore.html ADDED Viewed

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="../../dependencies/bootstrap/css/bootstrap.css">
+    <link rel="stylesheet" href="../../dependencies/bootstrap/font-awesome/css/font-awesome.min.css">
+    <link rel="stylesheet" href="stream-auto-restore.css">
+    <title>Two-way Streaming</title>
+    <script type="text/javascript" src="../../../../flashphoner.js"></script>
+    <script type="text/javascript" src="../../dependencies/jquery/jquery-1.12.0.js"></script>
+    <script type="text/javascript" src="../../dependencies/js/utils.js"></script>
+    <script type="text/javascript" src="stream-auto-restore.js"></script>
+</head>
+<body onload="init_page()">
+<div class="container">
+    <div class="row">
+        <h2 id="notifyFlash" class="text-danger"></h2>
+        <div class="col-sm-9 text-center">
+            <h2 class="text-center">Streaming Auto Restore</h2>
+            <div class="col-sm-6">
+                <div class="text-center text-muted">Local</div>
+                <div class="fp-Video">
+                    <div id="localVideo" class="display"></div>
+                </div>
+                <div id="streamerForm" class="input-group col-sm-10" style="margin: 10px auto 0 auto;">
+                    <input class="form-control" type="text" id="publishStream" placeholder="Stream Name">
+                    <div class="input-group-btn">
+                        <button id="publishBtn" type="button" class="btn btn-default">Publish</button>
+                    </div>
+                </div>
+                <div class="text-center" style="margin-top: 20px">
+                    <div id="publishStatus"></div>
+                    <div id="publishInfo"></div>
+                </div>
+            </div>
+            <div class="col-sm-6">
+                <div class="text-center text-muted">Player</div>
+                <div class="fp-Video">
+                    <div id="remoteVideo" class="display"></div>
+                </div>
+                <div id="playerForm" class="input-group col-sm-10" style="margin: 10px auto 0 auto;">
+                    <input class="form-control" type="text" id="playStream" placeholder="Stream Name">
+                    <div class="input-group-btn">
+                        <button id="playBtn" type="button" class="btn btn-default">Play</button>
+                    </div>
+                </div>
+                <div class="text-center" style="margin-top: 20px">
+                    <div id="playStatus"></div>
+                    <div id="playInfo"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="row row-space">
+        <div class="col-sm-5 col-sm-offset-2">
+            <div id="connectionForm" class="input-group">
+                <input class="form-control" id="urlServer" type="text">
+                <div class="input-group-btn">
+                    <button id="connectBtn" type="button" class="btn btn-default">Connect</button>
+                </div>
+            </div>
+            <div class="text-center">
+                <div id="connectStatus"></div>
+            </div>
+        </div>
+    </div>
+</div>
+</body>
+</html>

package/examples/demo/streaming/stream-auto-restore/stream-auto-restore.js ADDED Viewed

@@ -0,0 +1,356 @@
+var SESSION_STATUS = Flashphoner.constants.SESSION_STATUS;
+var STREAM_STATUS = Flashphoner.constants.STREAM_STATUS;
+var STREAM_EVENT = Flashphoner.constants.STREAM_EVENT;
+var STREAM_EVENT_TYPE = Flashphoner.constants.STREAM_EVENT_TYPE;
+var STREAM_STATUS_INFO = Flashphoner.constants.STREAM_STATUS_INFO;
+var ERROR_INFO = Flashphoner.constants.ERROR_INFO;
+var PRELOADER_URL = "../../dependencies/media/preloader.mp4";
+var PUBLISH_FAILURE_DETECTOR_MAX_TRIES = 3;
+var PUBLISH_FAILURE_DETECTOR_INTERVAL = 500;
+var Browser = Flashphoner.Browser;
+var localVideo;
+var remoteVideo;
+var publishFailureIntervalID;
+// H264 publishing failure detection parameters using outgoing video stats in Chrome #WCS-3382
+var statPublishFailureDetector = {
+    failed: false,
+    codec: "",
+    lastBytesSent: 0,
+    counter: {
+        value: 0,
+        threshold: PUBLISH_FAILURE_DETECTOR_MAX_TRIES
+    }
+};
+//////////////////////////////////
+/////////////// Init /////////////
+function init_page() {
+    //init api
+    try {
+        Flashphoner.init();
+    } catch (e) {
+        $("#notifyFlash").text("Your browser doesn't support WebRTC technology needed for this example");
+        return;
+    }
+    //local and remote displays
+    localVideo = document.getElementById("localVideo");
+    remoteVideo = document.getElementById("remoteVideo");
+    $("#urlServer").val(setURL());
+    var streamName = createUUID(4);
+    $("#publishStream").val(streamName);
+    $("#playStream").val(streamName);
+    onDisconnected();
+    onUnpublished();
+    onStopped();
+}
+function connect() {
+    var url = $('#urlServer').val();
+    //create session
+    console.log("Create new session with url " + url);
+    Flashphoner.createSession({urlServer: url}).on(SESSION_STATUS.ESTABLISHED, function (session) {
+        setStatus("#connectStatus", session.status());
+        onConnected(session);
+    }).on(SESSION_STATUS.DISCONNECTED, function () {
+        setStatus("#connectStatus", SESSION_STATUS.DISCONNECTED);
+        onDisconnected();
+    }).on(SESSION_STATUS.FAILED, function () {
+        setStatus("#connectStatus", SESSION_STATUS.FAILED);
+        onDisconnected();
+    });
+}
+function onConnected(session) {
+    $("#connectBtn").text("Disconnect").off('click').click(function () {
+        $(this).prop('disabled', true);
+        session.disconnect();
+    }).prop('disabled', false);
+    onUnpublished();
+    onStopped();
+}
+function onDisconnected() {
+    $("#connectBtn").text("Connect").off('click').click(function () {
+        if (validateForm("connectionForm")) {
+            $('#urlServer').prop('disabled', true);
+            $(this).prop('disabled', true);
+            connect();
+        }
+    }).prop('disabled', false);
+    $('#urlServer').prop('disabled', false);
+    onUnpublished();
+    onStopped();
+}
+function onPublishing(stream) {
+    $("#publishBtn").text("Stop").off('click').click(function () {
+        $(this).prop('disabled', true);
+        stream.stop();
+    }).prop('disabled', false);
+    $("#publishInfo").text("");
+    // Start publish failure detector in Chrome browser #WCS-3382
+    if(Browser.isChrome()) {
+        detectPublishFailure(stream, PUBLISH_FAILURE_DETECTOR_INTERVAL, PUBLISH_FAILURE_DETECTOR_MAX_TRIES);
+    }
+}
+function onUnpublished() {
+    $("#publishBtn").text("Publish").off('click').click(publishBtnClick);
+    if (Flashphoner.getSessions()[0] && Flashphoner.getSessions()[0].status() == SESSION_STATUS.ESTABLISHED) {
+        $("#publishBtn").prop('disabled', false);
+        $('#publishStream').prop('disabled', false);
+    } else {
+        $("#publishBtn").prop('disabled', true);
+        $('#publishStream').prop('disabled', true);
+    }
+    if (publishFailureIntervalID) {
+        clearInterval(publishFailureIntervalID);
+        publishFailureIntervalID = null;
+    }
+    checkPublishFailureConditions();
+}
+function publishBtnClick(stripCodecs) {
+    if (validateForm("streamerForm")) {
+        $('#publishStream').prop('disabled', true);
+        $(this).prop('disabled', true);
+        if (Browser.isSafariWebRTC()) {
+            Flashphoner.playFirstVideo(localVideo, true, PRELOADER_URL).then(function() {
+                publishStream(stripCodecs);
+            });
+            return;
+        }
+        publishStream(stripCodecs);
+    }
+}
+function onPlaying(stream) {
+    $("#playBtn").text("Stop").off('click').click(function () {
+        $(this).prop('disabled', true);
+        stream.stop();
+    }).prop('disabled', false);
+    $("#playInfo").text("");
+}
+function onStopped() {
+    $("#playBtn").text("Play").off('click').click(playBtnClick);
+    if (Flashphoner.getSessions()[0] && Flashphoner.getSessions()[0].status() == SESSION_STATUS.ESTABLISHED) {
+        $("#playBtn").prop('disabled', false);
+        $('#playStream').prop('disabled', false);
+    } else {
+        $("#playBtn").prop('disabled', true);
+        $('#playStream').prop('disabled', true);
+    }
+}
+function playBtnClick() {
+    if (validateForm("playerForm")) {
+        $('#playStream').prop('disabled', true);
+        $(this).prop('disabled', true);
+        if (Flashphoner.getMediaProviders()[0] === "WSPlayer") {
+            Flashphoner.playFirstSound();
+        } else if (Browser.isSafariWebRTC() || Flashphoner.getMediaProviders()[0] === "MSE") {
+            Flashphoner.playFirstVideo(remoteVideo, false, PRELOADER_URL).then(function () {
+                playStream();
+            });
+            return;
+        }
+        playStream();
+    }
+}
+function publishStream(stripCodecs) {
+    var session = Flashphoner.getSessions()[0];
+    var streamName = $('#publishStream').val();
+    session.createStream({
+        name: streamName,
+        display: localVideo,
+        cacheLocalResources: true,
+        receiveVideo: false,
+        receiveAudio: false,
+        stripCodecs: stripCodecs
+    }).on(STREAM_STATUS.PUBLISHING, function (stream) {
+        setStatus("#publishStatus", STREAM_STATUS.PUBLISHING);
+        onPublishing(stream);
+    }).on(STREAM_STATUS.UNPUBLISHED, function () {
+        setStatus("#publishStatus", STREAM_STATUS.UNPUBLISHED);
+        onUnpublished();
+    }).on(STREAM_STATUS.FAILED, function (stream) {
+        setStatus("#publishStatus", STREAM_STATUS.FAILED, stream);
+        onUnpublished();
+    }).publish();
+}
+function playStream() {
+    var session = Flashphoner.getSessions()[0];
+    var streamName = $('#playStream').val();
+    session.createStream({
+        name: streamName,
+        display: remoteVideo
+    }).on(STREAM_STATUS.PENDING, function (stream) {
+        var video = document.getElementById(stream.id());
+        if (!video.hasListeners) {
+            video.hasListeners = true;
+            video.addEventListener('resize', function (event) {
+                resizeVideo(event.target);
+            });
+        }
+    }).on(STREAM_STATUS.PLAYING, function (stream) {
+        setStatus("#playStatus", stream.status());
+        onPlaying(stream);
+    }).on(STREAM_STATUS.STOPPED, function () {
+        setStatus("#playStatus", STREAM_STATUS.STOPPED);
+        onStopped();
+    }).on(STREAM_STATUS.FAILED, function (stream) {
+        setStatus("#playStatus", STREAM_STATUS.FAILED, stream);
+        onStopped();
+    }).on(STREAM_EVENT, function(streamEvent) {
+        switch (streamEvent.type) {
+            case STREAM_EVENT_TYPE.DATA:
+                addPayload(streamEvent.payload);
+                break;
+        }
+        console.log("Received streamEvent ", streamEvent.type);
+    }).play();
+}
+//show connection, or local, or remote stream status
+function setStatus(selector, status, stream) {
+    var statusField = $(selector);
+    statusField.text(status).removeClass();
+    if (status == "PLAYING" || status == "ESTABLISHED" || status == "PUBLISHING") {
+        statusField.attr("class", "text-success");
+    } else if (status == "DISCONNECTED" || status == "UNPUBLISHED" || status == "STOPPED") {
+        statusField.attr("class", "text-muted");
+    } else if (status == "FAILED") {
+        if (stream) {
+            if (stream.published()) {
+                switch(stream.getInfo()){
+                    case STREAM_STATUS_INFO.STREAM_NAME_ALREADY_IN_USE:
+                        $("#publishInfo").text("Server already has a publish stream with the same name, try using different one").attr("class", "text-muted");
+                        break;
+                    case ERROR_INFO.LOCAL_ERROR:
+                        $("#publishInfo").text("Browser error detected: " + stream.getErrorInfo()).attr("class", "text-muted");
+                        break;
+                    default:
+                        $("#publishInfo").text("Other: "+stream.getInfo()).attr("class", "text-muted");
+                        break;
+                }
+            } else {
+                switch(stream.getInfo()){
+                    case STREAM_STATUS_INFO.SESSION_DOES_NOT_EXIST:
+                        $("#playInfo").text("Actual session does not exist").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.STOPPED_BY_PUBLISHER_STOP:
+                        $("#playInfo").text("Related publisher stopped its stream or lost connection").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.SESSION_NOT_READY:
+                        $("#playInfo").text("Session is not initialized or terminated on play ordinary stream").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.RTSP_STREAM_NOT_FOUND:
+                        $("#playInfo").text("Rtsp stream not found where agent received '404-Not Found'").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.FAILED_TO_CONNECT_TO_RTSP_STREAM:
+                        $("#playInfo").text("Failed to connect to rtsp stream").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.FILE_NOT_FOUND:
+                        $("#playInfo").text("File does not exist, check filename").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.FILE_HAS_WRONG_FORMAT:
+                        $("#playInfo").text("File has wrong format on play vod, this format is not supported").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.TRANSCODING_REQUIRED_BUT_DISABLED:
+                        $("#playInfo").text("Transcoding required, but disabled in settings").attr("class", "text-muted");
+                        break;
+                    case STREAM_STATUS_INFO.NO_AVAILABLE_TRANSCODERS:
+                        $("#playInfo").text("No available transcoders for stream").attr("class", "text-muted");
+                        break;
+                    default:
+                        $("#playInfo").text("Other: "+stream.getInfo()).attr("class", "text-muted");
+                        break;
+                }
+            }
+        }
+        statusField.attr("class", "text-danger");
+    }
+}
+// Detect publishing failure in Chrome using outgoing streaming stats #WCS-3382
+function detectPublishFailure(stream, failureCheckInterval, maxBitrateDropsCount) {
+    statPublishFailureDetector = {
+        failed: false,
+        codec: "",
+        lastBytesSent: 0,
+        counter: {
+            value: 0,
+            threshold: maxBitrateDropsCount
+        }
+    }
+    publishFailureIntervalID = setInterval(function() {
+        stream.getStats(function(stat) {
+            let videoStats = stat.outboundStream.video;
+            if(!videoStats) {
+                return;
+            }
+            let codec = videoStats.codec;
+            let bytesSent = videoStats.bytesSent;
+            let bitrate = (bytesSent - statPublishFailureDetector.lastBytesSent) * 8;
+            if (bitrate == 0) {
+                statPublishFailureDetector.counter.value++;
+                console.log("Bitrate is 0 (" + statPublishFailureDetector.counter.value + ")");
+                if (statPublishFailureDetector.counter.value >= statPublishFailureDetector.counter.threshold) {
+                    statPublishFailureDetector.failed = true;
+                    console.log("Publishing seems to be failed, stop the stream");
+                    stream.stop();
+                }
+            } else {
+                statPublishFailureDetector.counter.value = 0;
+            }
+            statPublishFailureDetector.lastBytesSent = bytesSent;
+            statPublishFailureDetector.codec = codec;
+            $("#publishInfo").text(statPublishFailureDetector.codec);
+        });
+    }, failureCheckInterval);
+}
+// Check if H264 publishing is failed in Chrome and restart as VP8 #WCS-3382
+function checkPublishFailureConditions() {
+    if (statPublishFailureDetector.failed) {
+        $("#publishInfo").text("Failed to publish " + statPublishFailureDetector.codec);
+        if (statPublishFailureDetector.codec == "H264") {
+            console.log("H264 publishing seems to be failed, trying VP8 by stripping H264");
+            let stripCodecs = "H264";
+            publishBtnClick(stripCodecs);
+        } else if (statPublishFailureDetector.codec == "VP8") {
+            console.log("VP8 publishing seems to be failed, giving up");
+        }
+    }
+}
+function validateForm(formId) {
+    var valid = true;
+    $('#' + formId + ' :text').each(function () {
+        if (!$(this).val()) {
+            highlightInput($(this));
+            valid = false;
+        } else {
+            removeHighlight($(this));
+        }
+    });
+    return valid;
+    function highlightInput(input) {
+        input.closest('.input-group').addClass("has-error");
+    }
+    function removeHighlight(input) {
+        input.closest('.input-group').removeClass("has-error");
+    }
+}

package/examples/typescript/two-way-streaming-ts/.gitignore ADDED Viewed

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+# testing
+/coverage
+# production
+/build
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

package/examples/typescript/two-way-streaming-ts/README.md ADDED Viewed

@@ -0,0 +1,36 @@
+# Two Way Streaming React example application written in Typescript
+This example shows how to integrate Flashphoner [WebCallServer](https://flashphoner.com) Javascript API ([WebSDK](https://www.npmjs.com/package/@flashphoner/websdk)) with Typescript typings to to React application
+## How to build
+In the project directory, you can run:
+### `npm install`
+Installs all the dependencies needed.
+### `npm start`
+Runs the app in the development mode.\
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+### `npm run build`
+Builds the app for production to the `build` folder.\
+It correctly bundles React and WebSDK in production mode and optimizes the build for the best performance.
+The build is minified and the filenames include the hashes.\
+Your app is ready to be deployed!
+## How to deploy
+Copy build folder content to a web server, for example
+```
+mkdir -p /var/www/html/two-way-streaming-ts
+cp -r build/* /var/www/html/two-way-streaming-ts
+```
+Then you can open example page in browser `https://yourhost/two-way-streaming-ts/index.html`
+Please note that you should open page via secure connection in browser for WebRTC to work, except localhost.

package/examples/typescript/two-way-streaming-ts/package.json ADDED Viewed

@@ -0,0 +1,45 @@
+{
+  "name": "two-way-streaming-ts",
+  "description": "Two Way Streaming React appliction example written in Typescript using Flashphoner Web SDK",
+  "author": "Flashphoner",
+  "license": "MIT",
+  "version": "1.0.0",
+  "homepage": ".",
+  "private": true,
+  "dependencies": {
+    "@flashphoner/websdk": "^2.0.202",
+    "@types/jest": "^27.0.2",
+    "@types/node": "^16.10.3",
+    "@types/react": "^17.0.27",
+    "@types/react-dom": "^17.0.9",
+    "bootstrap": "^5.1.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-scripts": "4.0.3",
+    "typescript": "^4.4.3"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

package/examples/typescript/two-way-streaming-ts/public/favicon.ico ADDED Viewed

Binary file

package/examples/typescript/two-way-streaming-ts/public/index.html ADDED Viewed

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Two Way Streaming example created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>TwoWay Streaming React App</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

package/examples/typescript/two-way-streaming-ts/public/logo192.png ADDED Viewed

Binary file

package/examples/typescript/two-way-streaming-ts/public/logo512.png ADDED Viewed

Binary file