Merge branch 'integration'

zendesk · Sep 30, 2015 · f53089d · f53089d
2 parents 6944f86 + 7e37014
commit f53089d
Show file tree

Hide file tree

Showing 40 changed files with 1,161 additions and 541 deletions.
diff --git a/.jshintrc b/.jshintrc
@@ -55,7 +55,7 @@
     "boss"          : false,    // Tolerate assignments inside if, for & while. Usually conditions & loops are for comparison, not assignments.
     "debug"         : false,    // Allow debugger statements e.g. browser breakpoints.
     "eqnull"        : true,    // Tolerate use of `== null`.
-    "es5"           : false,    // Allow EcmaScript 5 syntax.
+    "es5"           : true,    // Allow EcmaScript 5 syntax.
     "esnext"        : false,    // Allow ES.next specific features such as `const` and `let`.
     "evil"          : false,    // Tolerate use of `eval`.
     "expr"          : true,    // Tolerate `ExpressionStatement` as Programs.
@@ -134,7 +134,8 @@
         "eventFire",
         "alert",
         "module",
-        "jQuery"
+        "Promise",
+        "global"
     ],
     "maxparams"     : 30,
     "maxdepth"      : 5,

diff --git a/README.md b/README.md
@@ -13,11 +13,6 @@ Add the following code towards the end of the `body` section on your page. Placi
 <script src="https://cdn.supportkit.io/supportkit.min.js"></script>
 ```
 
-Note that SupportKit requires jQuery to work. If you aren't using jQuery yet, then add the following code before the previous code snippet. This step is only needed if you are using the CDN version.<br>
-
-```
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
-```
 
 Initialize the plugin using this code snippet
 
@@ -107,14 +102,30 @@ Closes the conversation widget
 SupportKit.close();
 ```
 
+#### login(userId [, jwt])
+Logs a user in the widget, retrieving the conversation that user already had on other browsers and/or devices. This will destroy and reinitialize the widget with the user's data. Note that you don't need to call this after `init`, it's already done internally. This returns a promise that resolves when the widget is ready again.
+```
+SupportKit.login('some-id');
+
+// in case you are using the jwt authentication
+SupportKit.login('some-id', 'some-jwt');
+
+```
+
 #### logout()
-Removes deviceId cookie from the browser, effectively logging out the user.
-Destroys the widget completely. Can be initiated again manually with `SupportKit.init(...)`
+Logs out the current user and reinitialize the widget with an anonymous user.This returns a promise that resolves when the widget is ready again.
 
 ```
 SupportKit.logout();
 ```
 
+#### destroy()
+Destroys the widget and makes it disappear. The widget has to be reinitialized with `init`  to be working again because it also clears up the app token from the widget.
+
+```
+SupportKit.destroy();
+```
+
 #### sendMessage(text)
 Sends a message on the user's behalf
 

diff --git a/example/template/demo.html b/example/template/demo.html
@@ -9,7 +9,7 @@
     <script>
         /* global SupportKit: false */
 
-        SupportKit.init({
+        window.SupportKitOptions = {
             appToken: 'APP_TOKEN',
             givenName: 'GIVEN_NAME',
             surname: 'SURNAME',
@@ -20,11 +20,215 @@
               'TEST': true
             },
             emailCaptureEnabled: true
-        });
+        };
+
+        SupportKit.init(SupportKitOptions);
     </script>
+
+    <style type="text/css">
+        body {
+            padding-top: 100px;
+        }
+    </style>
+
+    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
 </head>
   <body>
-    <h1>Test</h1>
-    <button onclick="SupportKit.logout(); document.location.reload(true);">Log Out</button>
+
+    <div class="container">
+
+      <div class="row">
+          <div class="col-sm-6">
+                <form class="form-horizontal" id="formMain">
+                    <legend>Login</legend>
+                    <div class="form-group">
+                        <label for="userId" class="col-sm-3 control-label">User ID</label>
+                        <div class="col-sm-6">
+                            <input type="text" class="form-control" id="userId">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="jwt" class="col-sm-3 control-label">JWT</label>
+                        <div class="col-sm-6">
+                            <input type="text" class="form-control" id="jwt">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-6">
+                            <button type="submit" class="btn btn-primary">Sign in</button>
+                            <button type="button" class="btn btn-danger" id="signOut">Sign out</button>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-6">
+                            <button type="button" class="btn btn-default" id="reset">Reset device id</button>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-6">
+                            <button type="button" class="btn btn-default" id="init">Init</button>
+                            <button type="button" class="btn btn-default" id="destroy">Destroy</button>
+                        </div>
+                    </div>
+                </form>
+          </div>
+          <div class="col-sm-6">
+                <form class="form-horizontal" id="formTrack">
+                    <legend>Track</legend>
+                    <div class="form-group">
+                        <label for="track" class="col-sm-3 control-label">Event name</label>
+                        <div class="col-sm-6">
+                            <input type="text" class="form-control" id="trackEvent">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-10">
+                            <button type="submit" class="btn btn-default" id="track">Track</button>
+                        </div>
+                    </div>
+                </form>
+          </div>
+          <div class="col-sm-6">
+              <form class="form-horizontal" id="formUser">
+                    <legend>Update user</legend>
+                    <div class="form-group">
+                        <label for="updateUser" class="col-sm-3 control-label">JSON</label>
+                        <div class="col-sm-6">
+                            <textarea class="form-control" id="updateUser"></textarea>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-6">
+                            <button type="submit" class="btn btn-default" id="update">Update</button>
+                        </div>
+                    </div>
+              </form>
+          </div>
+          <div class="col-sm-6">
+                <form class="form-horizontal">
+                    <legend>General API</legend>
+
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-6">
+                            <button type="button" class="btn btn-default" id="open">Open</button>
+                            <button type="button" class="btn btn-default" id="close">Close</button>
+                        </div>
+                    </div>
+                </form>
+          </div>
+          <div class="col-sm-6">
+                <form class="form-horizontal" id="formMessage">
+                    <legend>Send Message</legend>
+                    <div class="form-group">
+                        <label for="track" class="col-sm-3 control-label">Text</label>
+                        <div class="col-sm-6">
+                            <input type="text" class="form-control" id="message">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <div class="col-sm-offset-2 col-sm-10">
+                            <button type="submit" class="btn btn-default" id="sendMessage">Send</button>
+                        </div>
+                    </div>
+                </form>
+          </div>
+      </div>
+
+    </div>
+    <script>
+        window.addEventListener('load', function() {
+            var formMain = document.getElementById('formMain');
+            var formTrack = document.getElementById('formTrack');
+            var formUser = document.getElementById('formUser');
+            var formMessage = document.getElementById('formMessage');
+
+            var userIdInput = document.getElementById('userId');
+            var jwtInput = document.getElementById('jwt');
+            var trackEventInput = document.getElementById('trackEvent');
+            var updateUserInput = document.getElementById('updateUser');
+            var messageInput = document.getElementById('message');
+
+            var signOutButton = document.getElementById('signOut');
+            var resetButton = document.getElementById('reset');
+            var initButton = document.getElementById('init');
+            var destroyButton = document.getElementById('destroy');
+            var openButton = document.getElementById('open');
+            var closeButton = document.getElementById('close');
+
+            if(window.SupportKitOptions.userId) {
+                userIdInput.value = window.SupportKitOptions.userId;
+            }
+
+            if(window.SupportKitOptions.jwt) {
+                jwtInput.value = window.SupportKitOptions.jwt;
+            }
+
+
+
+            formMain.addEventListener('submit', function(e) {
+                e.preventDefault();
+                SupportKit.login(userIdInput.value, jwtInput.value);
+            });
+
+            formTrack.addEventListener('submit', function(e) {
+                e.preventDefault();
+                if(trackEventInput.value) {
+                    SupportKit.track(trackEventInput.value);
+                }
+            });
+
+            formUser.addEventListener('submit', function(e) {
+                e.preventDefault();
+                if(updateUserInput.value) {
+                    try {
+                        var value = JSON.parse(updateUserInput.value);
+                        SupportKit.updateUser(value);
+                    } catch(err) {
+                        alert('Bad json')
+                    }
+                }
+            });
+
+            formMessage.addEventListener('submit', function(e) {
+                e.preventDefault();
+                if(messageInput.value) {
+                    SupportKit.sendMessage(messageInput.value);
+                    messageInput.value = '';
+                }
+            });
+
+            signOutButton.addEventListener('click', function() {
+                SupportKit.logout();
+            });
+
+            resetButton.addEventListener('click', function() {
+                localStorage.removeItem('sk_deviceid');
+                SupportKit.logout();
+            });
+
+            initButton.addEventListener('click', function() {
+                if (!SupportKit.ready) {
+                    SupportKit.init(window.SupportKitOptions);
+                }
+            });
+
+            destroyButton.addEventListener('click', function() {
+                SupportKit.destroy();
+            });
+
+            openButton.addEventListener('click', function() {
+                if (SupportKit.ready) {
+                    SupportKit.open();
+                }
+            });
+
+            closeButton.addEventListener('click', function() {
+                if (SupportKit.ready) {
+                    SupportKit.close();
+                }
+            });
+
+        }, false);
+    </script>
   </body>
 </html>
diff --git a/karma.conf.js b/karma.conf.js
@@ -15,7 +15,7 @@ module.exports = function(config) {
         frameworks: ['mocha', 'browserify', 'sinon-chai', 'phantomjs-shim', 'source-map-support'],
 
         // list of files / patterns to load in the browser
-        files: ['node_modules/jquery/dist/jquery.min.js', 'test/bootstrap.js', './src/js/bootstrap.js', 'test/specs/**/*.spec.js'],
+        files: ['test/bootstrap.js', './src/js/bootstrap.js', 'test/specs/**/*.spec.js'],
 
 
         // list of files to exclude

diff --git a/package.json b/package.json
@@ -20,12 +20,12 @@
   "dependencies": {
     "backbone": "1.2.1",
     "backbone-associations": "^0.6.2",
-    "backbone-computedfields": "0.0.10",
     "backbone.marionette": "^2.4.2",
     "backbone.stickit": "^0.9.2",
     "cookie": "^0.1.2",
+    "es6-promise": "^3.0.2",
     "faye": "^1.1.1",
-    "jquery": "~1.11.0",
+    "jquery": "^1.11.3",
     "jstify": "^0.7.0",
     "lodash.bindall": "^3.1.0",
     "marionette.behaviors": "0.0.13",
@@ -34,7 +34,8 @@
     "url-join": "0.0.1",
     "urljoin": "^0.1.5",
     "uuid": "^2.0.1",
-    "view-controller": "1.0.4"
+    "view-controller": "1.0.4",
+    "whatwg-fetch": "^0.9.0"
   },
   "engines": {
     "node": ">=0.10",

diff --git a/release_notes/v1.0.0.md b/release_notes/v1.0.0.md
@@ -0,0 +1,28 @@
+# Web SDK is now 1.0!
+
+We cooked up a big release for this milestone. We already had cool features like the actions buttons on our mobile SDKs, but now, you can also have them! We also packed this release with a lot of fixes and new things that will surely be useful to a lot of you guys.
+
+# Web SDK is seeing some action!
+![SupportKit Web Action Buttons](http://docs.supportkit.io/images/action_button_web.png)
+
+The Web SDK now features Actions!
+You can now send Actions along with messages to your users. This makes it easier to direct your users to some part of your website and help them find exactly what they need.
+
+See our [docs](http://docs.supportkit.io/javascript#sending-action-buttons) for all the details.
+
+# Login, Logout, JWT and your conversation everywhere
+
+You can now specify a `userId` and (optionally) a JSON Web Token (JWT) to securely log users in and out of your application. Every user session will hold its own conversation and properties. That same user is now able to log in into their iOS device, Android device, or on your website and retain their conversation!
+
+As usual, see our [docs](http://docs.supportkit.io/javascript#users-on-multiple-devices) for the details.
+
+# Fixes and improvements
+
+- We rewrote the whole communication layer to not rely on `jQuery.ajax`. This means no more problems with Authorization headers when you are using the JWT in your own app.
+- You can now send links in your messages. We added a link detection feature that will render them correctly. It's currently pretty basic and will detect anything under the following format: `procotol://uri` so you could send a normal url or even some link to iTunes or the Play store if you wanted to. We are not detecting emails for now, but you could achieve that with action buttons!
+- We worked hard on building a better experience on mobile. The widget should now use the whole screen when opened.
+- A lot of CSS fixes
+
+# API Additions
+
+1. SupportKit global now has `login` and `logout`. Check out our [README](https://github.com/supportkit/supportkit-js) for a more complete API description.
diff --git a/src/js/bootstrap.js b/src/js/bootstrap.js
@@ -1,8 +1,10 @@
 'use strict';
+require('es6-promise').polyfill();
 
+// polyfill for window.fetch
+require('whatwg-fetch');
+require('./utils/backbone.ajax');
 var $ = require('jquery');
-// Enable CORS for IE8
-$.support.cors = true;
 
 require('./utils/jquery.support.cssproperty');
 

diff --git a/src/js/collections/baseCollection.js b/src/js/collections/baseCollection.js
diff --git a/src/js/collections/conversations.js b/src/js/collections/conversations.js
@@ -1,7 +1,9 @@
-var BaseCollection = require('./baseCollection');
+'use strict';
+
+var Backbone = require('backbone');
 var Conversation = require('../models/conversation');
 
-module.exports = BaseCollection.extend({
+module.exports = Backbone.Collection.extend({
     model: Conversation,
     url: 'conversations/'
 });