Giter Club home page Giter Club logo

angular-knowtify's Introduction

Angular support for Knowtify InBox (http://www.knowtify.io/)

Note: For Node users, you should also use https://www.npmjs.com/package/knowtify-node for Knowtify Emails support.

How do I use it?

Follow these steps:

  1. Install via Bower (http://bower.io/)

Run bower install angular-knowtify in a terminal

  1. Add the Knowtify script to your app HTML page. Be sure to add your public API token here.
<script type="text/javascript">
    var _knowtify = _knowtify || [];
    var _knowtifyInbox = _knowtifyInbox || [];
    _knowtify.public_token = "YOUR_PUBLIC_TOKEN_HERE";
 
    (function(d,s,t,u){var j = d.createElement(s);var p = d.getElementsByTagName(s)[0];
        j.type = t;j.async = true;j.src = u;p.parentNode.insertBefore(j, p);})(document,'script','text/javascript', 'https://s3.amazonaws.com/js.knowtify.io/knowtify.js');
</script>
  1. Add the bower module to your app:
<script src="/bower_components/angular-knowtify/dist/angular-knowtify.min.js"></script>
  1. Add the service to your Angular app module:
var app = angular.module('myapp', ['knowtify']) {
    ...
});
  1. Inject the Knowtify service into your controller:
function myCtrl($rootScope, $scope, $http, knowtify) {
    ...
};
  1. Add the CSS ID of the Inbox element as YOUR_BUTTON_ID (no # prefix) in your controller, along with the email and unique ID of the user, and push it to Knowtify. This initializes the button that your user will interact with. Review http://api.knowtify.io/docs/get-started-with-inbox for more information.
knowtify.push(['load_inbox', 'YOUR_BUTTON_ID', {email: "REQUIRED", id: "REQUIRED" }]);
  1. Call knowtify.push or knowtify.inbox.push to send notifications using events, behavioral data, scheduled announcements, or manual updates:
knowtify.push(['event', 'testing', {
    id: 123,
    email: "[email protected]"
}])

or

knowtify.inbox.push(['message', {
    id: "123",
    heading: "Message heading",
    description: "Message description...",
    image: "https://s3.amazonaws.com/knowtify_web/_img/inbox_profile.png",
    url: "http://google.com",
    created_at: timestamp
}])

Note that if you are creating users via Node using 'upsert', then the 'id' must be under "data", not next to 'email' like in the JS API. See https://knowtify.readme.io/discuss/56018ae68fcf8d230053c8d8

Want to help with this package?

  1. Install dependencies via npm: npm install(in the project folder)

  2. Install dependencies via bower: bower install(in the project folder)

  3. Run grunt: grunt or grunt uglify

  4. The build result is in the dist directory

Props go to Dave Kuhn (https://github.com/kuhnza) for his angular-mixpanel repo on which this was based.

angular-knowtify's People

Contributors

arnaudbreton avatar busterbeans avatar jteneycke avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.