From ad87dfb68fe6b354613bb919637db0dbda3fde0c Mon Sep 17 00:00:00 2001 From: Christian Garbin Date: Fri, 10 May 2019 18:09:54 -0400 Subject: [PATCH 01/13] Fix typos --- rest.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/rest.html b/rest.html index bb0a565..943b465 100644 --- a/rest.html +++ b/rest.html @@ -30,9 +30,9 @@

REST API

-

In terms of authentication, the REST API supports OAuth2 and Basic Authentication. Webhooks are also supported for asynchroneous events. WebRTC is not supported with the REST API, use the JS SDK for WebRTC.

- API Documenation - Swagger definition +

In terms of authentication, the REST API supports OAuth2 and Basic Authentication. Webhooks are also supported for asynchronous events. WebRTC is not supported with the REST API, use the JS SDK for WebRTC.

+ API Documentation + Swagger Definition

See OAuth 2.0 for information on how to register an app.

@@ -70,7 +70,7 @@
node.js web app w/ OAuth
OAuth, REST & Webhooks
-

This is an example bot that uses RESTful API calls to monitor a conversation on circuit. The bot will log the most recent items in the conversation, post a new item once it is listening, and then log any new items posted in the conversation.

+

This is an example bot that uses RESTful API calls to monitor a conversation on Circuit. The bot will log the most recent items in the conversation, post a new item once it is listening, and then log any new items posted in the conversation.

Source
From 8743a4641cbe3fd41510a4db4c9f5c53e616f1d1 Mon Sep 17 00:00:00 2001 From: Christian Garbin Date: Sat, 11 May 2019 15:31:36 -0400 Subject: [PATCH 02/13] Fix HTML validation errors Validate files with https://validator.w3.org/ and https://www.freeformatter.com/html-validator.html. Some of the findings: - Using obsolete tag. This is the larger change. - <script tag not closed - Missing mandatory alt= for image - Duplicate id= in files --- jssdk.html | 17 ++++++++--------- nodejs.html | 2 +- rest.html | 2 +- webcomponents.html | 44 +++++++++++++++++++------------------------- 4 files changed, 29 insertions(+), 36 deletions(-) diff --git a/jssdk.html b/jssdk.html index 033ceb6..930c0b3 100755 --- a/jssdk.html +++ b/jssdk.html @@ -32,7 +32,7 @@ <h1>JavaScript SDK</h1> <p>When running the examples you will be asked to sign in with a Circuit sandbox account.</p> <a href="https://circuitsandbox.net/sdk" target="_blank" class="btn btn-default">API Documentation</a> - <a href="https://github.com/circuit/circuit-sdk" target="_blank" class="btn btn-default">Github</a><br><br> + <a href="https://github.com/circuit/circuit-sdk" target="_blank" class="btn btn-default">GitHub</a><br><br> <p>Example to logon and fetch conversations:</p> <pre class="prettyprint"> // Create the client with the client_id (aka app key), scope and optionally a redirect_uri @@ -61,7 +61,7 @@ <h2 class="page-header">Examples</h2> <div class="row" id="plunker"> <div class="col-lg-12"> - <h3 id="jsbin">Plunker examples</h3> + <h3>Plunker examples</h3> <p>Short examples demonstrating one or more particular APIs. You can view the source, or fork your own plunker. A sandbox account is required to run the live examples. JS Bin examples use OAuth 2.0.</p> <table class="table table-condensed"> @@ -98,9 +98,9 @@ <h3 id="jsbin">Plunker examples</h3> </div> - <div class="row" id="jsbin"> + <div class="row"> <div class="col-lg-12"> - <h3 id="jsbin">JS Bin examples</h3> + <h3>JS Bin examples</h3> <p>Short examples demonstrating one or more particular APIs. You can view the source, or clone your own JS Bin using the link at the top right of the live example. A sandbox account is required to run the live examples. JS Bin examples use OAuth 2.0.</p> <table class="table table-condensed"> @@ -209,12 +209,11 @@ <h3 id="jsbin">JS Bin examples</h3> </div> - <div class="row" id="github"> - + <div class="row"> <div class="col-lg-12"> - <h3 id="github">Github examples</h3> - <p>The source code of the examples below are on <a href="https://github.com/circuit/circuit-sdk/tree/master/examples/js/" target="_blank">github</a> and are hosted on <a href="https://rawgit.com/circuit/circuit-sdk/master/examples/js/index.html" target="_blank">rawgit</a>.</p> + <h3>GitHub examples</h3> + <p>The source code of the examples below are on <a href="https://github.com/circuit/circuit-sdk/tree/master/examples/js/" target="_blank">GitHub</a> and are hosted on <a href="https://rawgit.com/circuit/circuit-sdk/master/examples/js/index.html" target="_blank">rawgit</a>.</p> <br> </div> <div class="col-md-4"> @@ -340,7 +339,7 @@ <h5><i class="fa fa-fw fa-check"></i>Add participant to call</h5> <div class="panel-body"> <h5><i class="fa fa-fw fa-check"></i>Share HTML5 Canvas</h5> <p>This example shows a schematic in a HTML5 canvas and allows drawing on top of it and shares the combined image in the call. - The application can use the new <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/captureStream" tagert="_blank">HTMLCanvasElement.captureStream</a> API available in Chrome and Firefox to capture a stream from a canvas. + The application can use the new <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/captureStream" target="_blank">HTMLCanvasElement.captureStream</a> API available in Chrome and Firefox to capture a stream from a canvas. Note that Chrome has an issue with compression which causes WebRTC to reduce the resolution, or not even show the drawing. Use <a href="https://www.mozilla.org/en-US/firefox/new/">FireFox</a> in the meantime.</p> <a href="https://rawgit.com/circuit/circuit-sdk/master/examples/js/canvas.html" target="_blank" class="btn btn-default">Live example</a> diff --git a/nodejs.html b/nodejs.html index 8508865..2a0297e 100644 --- a/nodejs.html +++ b/nodejs.html @@ -14,7 +14,7 @@ if (window.location.host == 'circuit.github.io' && window.location.protocol != 'https:') { window.location.protocol = 'https:'; } - </script + </script> </head> <body> diff --git a/rest.html b/rest.html index bb0a565..9fd7456 100644 --- a/rest.html +++ b/rest.html @@ -14,7 +14,7 @@ if (window.location.host == 'circuit.github.io' && window.location.protocol != 'https:') { window.location.protocol = 'https:'; } - </script + </script> </head> <body> diff --git a/webcomponents.html b/webcomponents.html index d786c4d..382f7d2 100644 --- a/webcomponents.html +++ b/webcomponents.html @@ -16,11 +16,6 @@ window.location.protocol = 'https:'; } </script> - <style> - xmp { - margin: -32px 0px; - } - </style> </head> <body> @@ -40,7 +35,7 @@ <h1>Circuit Web Components</h1> <p>Enhance your website with Circuit features such as making video calls without any code. Just include the desired web component module and the Circuit JS SDK and use the element.</p> - <a href="https://github.com/circuit/circuit-web-components/" target="_blank" rel="nofollow"><img src="https://img.shields.io/badge/github-beta-brightgreen.svg?style=flat" style="max-width:100%;"></a> + <a href="https://github.com/circuit/circuit-web-components/" target="_blank" rel="nofollow"><img src="https://img.shields.io/badge/github-beta-brightgreen.svg?style=flat" alt="beta" style="max-width:100%;"></a> <a href="https://www.npmjs.com/package/@unify/circuit-web-components" target="_blank" rel="nofollow"><img src="https://camo.githubusercontent.com/9e9e962e3dd15ea5ab11b5f1a15a4c15f0b15c49/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f40756e6966792f636972637569742d7765622d636f6d706f6e656e74732e7376673f7374796c653d666c6174" alt="NPM Version" data-canonical-src="https://img.shields.io/npm/v/@unify/circuit-web-components.svg?style=flat" style="max-width:100%;"></a> <br><br> <a href="https://github.com/circuit/circuit-web-components/tree/master/docs" target="_blank" class="btn btn-default">Documentation</a> @@ -48,27 +43,26 @@ <h1>Circuit Web Components</h1> <p>Example <code>circuit-call-button</code>:</p> <pre class="prettyprint"> - <xmp> -<html> - <head> - <script type="module" src="//unpkg.com/@unify/circuit-web-components/circuit-call-button.js" defer></script> - <script src="//unpkg.com/circuit-sdk" async></script> - <style> - /* Hide button until defined to prevent flash rendering */ - circuit-call-button:not(:defined) { +&lt;html&gt; +&lt;head&gt; + &lt;script type="module" src="//unpkg.com/@unify/circuit-web-components/circuit-call-button.js" defer&gt;&lt;/script&gt; + &lt;script src="//unpkg.com/circuit-sdk" async&gt;&lt;/script&gt; + &lt;style&gt; + /* Hide button until defined to prevent flash rendering */ + circuit-call-button:not(:defined) { opacity: 0; - } - circuit-call-button[inprogress] { + } + circuit-call-button[inprogress] { background: firebrick; - } - </style> - </head> - <body> - <circuit-call-button - clientId="f76ea1b2789946c9b88b008c682c132a" - target="helpdesk@company.com">Call Helpdesk</circuit-call-button> - </body> -</html> + } + </style> +</head> +<body> + <circuit-call-button + clientId="f76ea1b2789946c9b88b008c682c132a" + target="helpdesk@company.com">Call Helpdesk</circuit-call-button> +</body> +</html> From ba5a563c3f3b0d9c7b4e3fbb41deda1807a1dceb Mon Sep 17 00:00:00 2001 From: Christian Garbin Date: Sat, 11 May 2019 15:37:37 -0400 Subject: [PATCH 03/13] Fix spelling of GitHub --- ios.html | 4 ++-- sidebar.html | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ios.html b/ios.html index 1871908..d8f0bc0 100644 --- a/ios.html +++ b/ios.html @@ -31,8 +31,8 @@

iOS SDK

CircuitSDK is available through CocoaPods.

-

Github

-

The source on github contains an example app.

+

GitHub

+

The source on GitHub contains an example app.

diff --git a/sidebar.html b/sidebar.html index 1eeefae..ec61a74 100644 --- a/sidebar.html +++ b/sidebar.html @@ -40,7 +40,7 @@

Build

More

  • - Circuit on Github + Circuit on GitHub
  • Ask a question From 277ff1e532ba0046856fd65e01a09245f3e5c0ff Mon Sep 17 00:00:00 2001 From: Christian Garbin Date: Sat, 11 May 2019 17:55:52 -0400 Subject: [PATCH 04/13] Change HTML description and title to help with search engine discovery and presentation - Use 'Circuit Developer Community' and '...SDK' in description for discoverability and presentation in results pages. - Use 'Circuit API ' as title for consistency across pages, while at the same time exposing more terms for search engines. And in case users have more than one such tab open, the title is now unique. --- ios.html | 4 ++-- jssdk.html | 4 ++-- nodejs.html | 4 ++-- oauth.html | 4 ++-- polymer.html | 4 ++-- rest.html | 4 ++-- webcomponents.html | 4 ++-- 7 files changed, 14 insertions(+), 14 deletions(-) diff --git a/ios.html b/ios.html index 1871908..31fb95d 100644 --- a/ios.html +++ b/ios.html @@ -4,10 +4,10 @@ - + - Circuit API Examples + Circuit API iOS SDK Examples + + + + + +
    + + + + + +
    +
    +
    +
    +

    Circuit Webhooks

    +

    Circuit Incoming Webhooks enable you to easily post content to a given Circuit conversation.

    +

    + A webhook is a specific unique URL generated by Circuit for a given user (or bot user) to post to a given conversation.
    +
    + In effect, the URL encapsulates the ID of the conversation, the ID of the user posting and the ID of the webhook itself. Posting to this URL does not require authentication. As a result, the URL is meant to keep secret. If it was to shared or revealed, other users could publish on behalf of the webhook owner. In case the URL may have been comprimised, it can be re-generated.
    +
    + This design is one of the strength of webhooks as they enable simple (friction less) integrations between applications +

    + +

    + Pre-requisites
    + Incoming Webhooks are available to all users if the Circuit tenant admin enabled the feature for the tenant in the Circuit administration console. +

    + +

    + Creating a webhook
    +

      +
    1. Open the sidebar and click on add an app or the + button
      2. +
    2. Name your incoming webhook and click on Create
      3. +
    3. >You will get the incoming webhook URL, copy it to clipboard
      4. +
    4. You can post to Circuit using this URL
      curl --insecure -X POST https://yourcircuit.com/rest/v2/webhooks/incoming/1234392e25a0c-c88f-4eab-a27e-f88ccd657d17 -d '{"text": "*bold* `code` _italic_ ~strike~"}'
      5. +
    +

    + +

    + Example
    + circuit-call-me-button
    + In this example, a page presents a form where users can enter their name and contact details. Upon submitting, a message is posted to a Circuit conversation so that Circuit participants can see incoming requests and get back to end users.
    +
    + +
    +

    + 
    +                            
+                                <html lang="en">
+                                    <head>
+                                        <meta charset="UTF-8">
+                                        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+                                        <meta http-equiv="X-UA-Compatible" content="ie=edge">
+                                        <title>Circuit - Incoming Webhooks</title>
+                                        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css">
+                                        <style>
+                                            body {
+                                                background: #f7f7f7;
+                                            }
+                                    
+                                            .form-box {
+                                                max-width: 500px;
+                                                margin: auto;
+                                                padding: 50px;
+                                                background: #ffffff;
+                                                border: 10px solid #f2f2f2;
+                                            }
+                                    
+                                            .logo {
+                                                text-align: center;
+                                                max-width: 40%;
+                                                display: block;
+                                                margin: 0 auto 20px auto;
+                                            }
+                                    
+                                            h1, p {
+                                                text-align: center;
+                                            }
+                                    
+                                            input, textarea {
+                                                width: 100%;
+                                            }
+                                    
+                                            input[type=submit] {
+                                                background-color: #82bd3f !important; 
+                                                border: solid 1px #82bd3f !important;
+                                            }
+                                        </style>
+                                    </head>
+                                    <body>
+                                        <div class="form-box">
+                                            <img src="https://d3bql97l1ytoxn.cloudfront.net/app_resources/194960/myAppIcon/img6311084438843840511-2x.png" alt="Circuit Logo" class="logo">
+                                            <h1>Let Us Call You Back</h1>
+                                            <p>
+                                                We'd hate to make you wait.<br>
+                                                Leave us your name and phone number and we will call you right back.
+                                            </p>
+                                            <form id="callbackForm" action="" method="post">
+                                                <label for="name">Name</label>
+                                                <input id="name" type="text" name="Name">
+                                                
+                                                <label for="phone">Phone</label>
+                                                <input id="phone" type="tel" name="Phone">
+                                                
+                                                <label for="message">Message</label>
+                                                <textarea id="message" name="Message"></textarea>
+                                                <input class="button-primary" type="submit" value="Submit" />
+                                            </form>
+                                            </div>
+                                    
+                                            <script>
+                                            var webhookUrl = 'https://beta.circuit.com/rest/v2/webhooks/incoming/d6b78c30-3f6c-4f2e-b0f5-a704e7f5e7c7';
+                                            document.querySelector("#callbackForm").addEventListener("submit", function(e) {
+                                                e.preventDefault();
+                                                var xhr = new XMLHttpRequest();
+                                                xhr.open("POST", webhookUrl, true);
+                                                xhr.setRequestHeader('Content-Type', 'application/json');
+                                                xhr.send(JSON.stringify({
+                                                    text: "New callback request <br>Name : " + document.getElementById('name').value + "<br>Phone Number : " + document.getElementById('phone').value + " <br>Message : " + document.getElementById('message').value
+                                                }));
+                                            });
+                                        </script>
+                                    </body>
+                                </html>          
+                            
+
    +
    +
    +
    +
    +
    + + + + + + + + + + + \ No newline at end of file From cf814928e5c1eaa087802c766294369ab837f4fa Mon Sep 17 00:00:00 2001 From: Samantha Halfon Faw Date: Thu, 5 Sep 2019 13:39:34 +0200 Subject: [PATCH 09/13] updating documentation to remove any mention of markdown formatting --- webhooks.html | 26 +++++++++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/webhooks.html b/webhooks.html index d3a3d1d..8a0fb54 100644 --- a/webhooks.html +++ b/webhooks.html @@ -56,10 +56,34 @@

    Circuit Webhooks

  • Open the sidebar and click on add an app or the + button
  • Name your incoming webhook and click on Create
  • >You will get the incoming webhook URL, copy it to clipboard
    • -
  • You can post to Circuit using this URL
    curl --insecure -X POST https://yourcircuit.com/rest/v2/webhooks/incoming/1234392e25a0c-c88f-4eab-a27e-f88ccd657d17 -d '{"text": "*bold* `code` _italic_ ~strike~"}'
    • +
  • You can post to Circuit using this URL
    curl --insecure -X POST https://yourcircuit.com/rest/v2/webhooks/incoming/1234392e25a0c-c88f-4eab-a27e-f88ccd657d17 -d '{"text": "This is the content of my post"}'

    • +

    + Formatting + +

    + json + { + "text": "<b>bold</b> <i>italic</i>" + } + + +
    + Circuit supports bold, italic and highlited texts. It supports line breaks and ordered and lists with bullet points and numbered items. See the code below for examples : + + + + json + { + "text" : "Circuit supports <span class='rich-text-highlight'>highlighted text</span> and <br> line breaks. + It also supports bullet lists and numbered lists with <ul><li>item1</li><li>item2</li></ul> and ><ol><li>item1</li><li>item2</li></ol>." + } + + +

    +

    Example
    circuit-call-me-button
    From 0cf8f8eaaca24390c3076c32887ca5ecef2de72d Mon Sep 17 00:00:00 2001 From: Roger Urscheler Date: Mon, 4 Nov 2019 10:18:53 -0500 Subject: [PATCH 10/13] Add new oauth properties 'login_hint' and 'prompt' for implicit and authorization code --- oauth.html | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/oauth.html b/oauth.html index 868ed8e..3109ae5 100644 --- a/oauth.html +++ b/oauth.html @@ -116,6 +116,22 @@

    Step 1: Application Requests Authorization Code
    Any string Provides any state that might be useful to your application upon receipt of the response. The Circuit Server roundtrips this parameter, so your application receives the same value it sent. To mitigate against cross-site request forgery (CSRF), it is strongly recommended to include an anti-forgery token in the state, and confirm it in the response. This parameter is not required but strongly recommended for above mentioned security reasons. + + login_hint + email + Optional. If your application knows which user is trying to authenticate, it can use this parameter to provide a hint to the Circuit Authentication Server. The server uses the hint to simplify the login flow by prefilling the email field in the sign-in form. + + + prompt + comma delimited string + Optional. A comma-delimited (no spaces), case-sensitive list of options for the oauth window. +
      +
    • disable_email: Disable email field (only applicable if login_hint is provided)
      • +
    • disable_switch: Disable ability to switch the account from to Oauth popup
      • +
    • disable_caching: Hide the "private computer" checkbox.
      • +
    + + @@ -270,6 +286,22 @@
    Step 1: Application Requests Authorization Code
    Any string Provides any state that might be useful to your application upon receipt of the response. The Circuit Server roundtrips this parameter, so your application receives the same value it sent. To mitigate against cross-site request forgery (CSRF), it is strongly recommended to include an anti-forgery token in the state, and confirm it in the response. + + login_hint + email + Optional. If your application knows which user is trying to authenticate, it can use this parameter to provide a hint to the Circuit Authentication Server. The server uses the hint to simplify the login flow by prefilling the email field in the sign-in form. + + + prompt + comma delimited string + Optional. A comma-delimited (no spaces), case-sensitive list of options for the oauth window. +
      +
    • disable_email: Disable email field (only applicable if login_hint is provided)
      • +
    • disable_switch: Disable ability to switch the account from to Oauth popup
      • +
    • disable_caching: Hide the "private computer" checkbox.
      • +
    + + From 13e21589dd6958ecaf178a3b5e32c584a81e61bc Mon Sep 17 00:00:00 2001 From: Roger Urscheler Date: Wed, 27 Nov 2019 11:13:53 -0500 Subject: [PATCH 11/13] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 7c152e8..c678c7d 100755 --- a/index.html +++ b/index.html @@ -134,7 +134,7 @@
    node.js JavaScript library

    REST API

    RESTful API
    -

    Best suited for bots or server-side web application. No WebRTC support. Webhooks for events coming soon.

    +

    Best suited for bots or server-side web application. No WebRTC support.

    From 12f23f75131464abf1e4b6c040bb370b9748e3b5 Mon Sep 17 00:00:00 2001 From: Roger Urscheler Date: Mon, 13 Jul 2020 09:28:10 -0400 Subject: [PATCH 12/13] Update jssdk.html --- jssdk.html | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/jssdk.html b/jssdk.html index d18d60d..9ecc2cd 100755 --- a/jssdk.html +++ b/jssdk.html @@ -96,6 +96,28 @@

    Plunker examples

    + +
    +
    +

    Stackblitz examples

    +

    Short examples demonstrating one or more particular APIs. You can view the source, or fork your own stackblitz. A sandbox account is required to run the live examples.

    + + + + + + + + + + + + + + +
    Live ExampleDescription
    Export conversations to filevuejs app to export all conversation messages to a file.
    +
    +
    From 4c7871649c67492abae80e6e48b8d143f703833c Mon Sep 17 00:00:00 2001 From: Falk Date: Mon, 14 Dec 2020 11:44:08 +0100 Subject: [PATCH 13/13] Update jssdk.html As the sdk-documentation is currently not available on sandbox please update the link to https://eu.yourcircuit.com/sdk --- jssdk.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jssdk.html b/jssdk.html index 9ecc2cd..0d95cdd 100755 --- a/jssdk.html +++ b/jssdk.html @@ -31,7 +31,7 @@

    JavaScript SDK

    When running the examples you will be asked to sign in with a Circuit sandbox account.

    - API Documentation + API Documentation GitHub

    Example to logon and fetch conversations: