This is a clone from https://www.smore.com/clippy.js with some small changes ;-)
- you can enter coordinates on show function as two new parameters: top, left
agent.show(false, 100, 100);
- on double-click either a random joke from https://github.com/amoudgl/short-jokes-dataset is shown if short-jokes.js is available or a random animation is played if not
Add Clippy or his friends to any website for instant nostalgia.
Read more about the project on our homepage.
Add this code to you to your page to enable Clippy.js. See example.html in Dist folder.
<!-- Add the stylesheet to the head -->
<link rel="stylesheet" type="text/css" href="clippy.css" media="all">
...
<!-- Add these scripts to the bottom of the page -->
<!-- jQuery 1.7+ -->
<script src="jquery.1.7.min.js"></script>
<!-- Clippy.js -->
<script src="clippy.min.js"></script>
<!-- Init script -->
<script type="text/javascript">
clippy.load('Merlin', function(agent){
// do anything with the loaded agent
agent.show();
});
</script>
All the agent actions are queued and executed by order, so you could stack them.
// play a given animation
agent.play('Searching');
// play a random animation
agent.animate();
// get a list of all the animations
agent.animations();
// => ["MoveLeft", "Congratulate", "Hide", "Pleased", "Acknowledge", ...]
// Show text balloon
agent.speak('When all else fails, bind some paper together. My name is Clippy.');
// move to the given point, use animation if available
agent.moveTo(100,100);
// gesture at a given point (if gesture animation is available)
agent.gestureAt(200,200);
// stop the current action in the queue
agent.stopCurrent();
// stop all actions in the queue and go back to idle mode
agent.stop();
- The awesome Cinnamon Software for developing Double Agent the program we used to unpack Clippy and his friends!
- Microsoft, for creating clippy :)
- Thanks to https://www.smore.com/ for doing the package
- Thanks to https://github.com/amoudgl/short-jokes-dataset for nice jokes