Giphy Keyboard for Ionic

What?

If you want to let your users directly use Giphy amazing gifs, this plugin is what you need. Simply connect your app with the Giphy database by automatically show the gifs referring to what your users are looking for!

With the Giphy keyboard you can:

• show trending gifs by default;
• show gifs matching the user's search;
• easily change a display limit for gifs;
• easily integrate a cool keyboard for your users (for a chat, tinder-style!);
• keep control of your workflow: edit callbacks when gif is tapped, when the keyboard is closed, ...

If you run into any issues, feel free to get in touch with me, I'll give you help asap! :)

(and the most important thing: enjoy coding with both ionic and giphy!)

Try using ionic View, app ID: E9E3119F.

Installation

1 - If you're not using angular-resource for your project already, insert it after importing ionic.bundle.js file:

```

```

NB: We need angular-resource as it is a giphy-keyboard's dependency.

2 - Copy the giphy-keyboard directory inside /www/lib/. You'll now have access to /www/lib/giphy-keyboard/giphy-keyboard.css and /www/lib/giphy-keyboard/giphy-keyboard.js files.

3 - Insert giphy-keyboard.js before loading your app.js file.

```

```

4 - Insert giphy-keyboard.css (and eventually edit it), inside the head tag. I'd personnaly recommend this configuration:

<link href="lib/ionic/css/ionic.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <link href="lib/giphy-keyboard/giphy-keyboard.css" rel="stylesheet">

5 - Inject giphyKeyboard dependency inside your application module:

angular.module('myApplication', ['ionic', 'giphyKeyboard'])

You're now ready to use the giphy-keyboard magic!

giphy-keyboard brings you now one ready-to-use <giphy-keyboard> tag, and a Giphy service inside your controllers to interact with the plugin!

For an application example, simply refer to this archive /demo directory (js/app.js and index.html are the only files you'll need to give a look at). The minimum JavaScript code necessary to run this can be found inside the HomeCtrl.

If you want to make it live, copy/paste the /demo/www directory and replace your www directory inside your project with these files (or execute $ ionic start giphy-keyboard-test then do the same replacing operation with the new www directory just created).