These files show an example of an html/css/javascript interaction between the Chalkable API and a web app. The chlk-post-message-api.js file is a necessary component for your web app to interact with Chalkable
Your app should include a link to our hosted version of this file (as it is subject to updates):
<script type="text/javascript" src="http://chalkable.com/Scripts/api/chlk-post-message-api.js"></script>
Feel free to check it out here to see exactly what we're doing behind the scenes.
Your JavaScript code should register a callback that will be called when the teacher clicks ATTACH. This will let Chalkable know which function of yours to call when the teacher clicks ATTACH.
This is handled by the showPlus method
function saveAndClose(){ //Saving, finalizing and anything else your app might need to do before closing. //return true if your app is ready for the iframe to be closed and the app to be attached. return true; } CHLK_MESSENGER.addYourself(saveAndClose);
When the teacher has prepared your app for being attached your code should call the showplus function. showplus tells Chalkable to make the ATTACH button active.
Note: Your app should
return false
CHLK_MESSENGER.showPlus();
After the teacher clicks ATTACH, Chalkable calls the callback you registered and your app has the ability to, for example, finish saving before your app returns true or false.
Return true
Return false
The other interaction occurs with our URL Modes. They are appended to the url of your app as the user interacts with it in Chalkable.
- view: example -
http://www.EdTechApp.com/mode=view
- edit example -
http://www.EdTechApp.com/mode=edit
- myView example -
http://www.EdTechApp.com/mode=myview
- gradingView example -
http://www.EdTechApp.com/mode=gradingview
For advanced integration, you must prepare your app to handle this interaction. There are simple Javascript methods you can add to take care of this (check out the files)