Compatibility with Framer Modules

README.md

@@ -26,7 +26,11 @@ These examples include access to a public demo database for the purpose of demon
 
 ## Getting started in under 5 minutes
 
-I'd also like to recommend reading [*Supercharge your Framer prototype with Firebase, pt.1*](https://medium.com/@marc_krenn/framerfirebase1-e7d13a939cf4) on Medium, if you haven't already.
+<a href='https://open.framermodules.com/Firebase'>
+    <img alt='Install with Framer Modules'
+    src='https://www.framermodules.com/assets/[email protected]' width='160' height='40' /></a>
+
+<strong>OR</strong>
 
 | Step    | Instruction                                                                                                                                                                                                            |
 | :---:   | :---                                                                                                                                                                                                                   |
@@ -39,6 +43,7 @@ I'd also like to recommend reading [*Supercharge your Framer prototype with Fire
 | **6**   | Back in Framer, add `firebase = new Firebase` and set the required [Class Properties](https://github.com/marckrenn/framer-Firebase#1-properties)                                                                       |
 | **7**   | Save, load and sync data using the available [Class Methods](https://github.com/marckrenn/framer-Firebase#2-methods). Also, check out the [Demo Projects](https://github.com/marckrenn/framer-Firebase#demo-projects). |
 
+I'd also like to recommend reading [*Supercharge your Framer prototype with Firebase, pt.1*](https://medium.com/@marc_krenn/framerfirebase1-e7d13a939cf4) on Medium, if you haven't already.
 
 ### Tips
 

example.coffee

@@ -0,0 +1,35 @@
+
+
+# Please deactivate Auto Refresh and reload manually using CMD+R!
+
+
+# The required information is located at https://firebase.google.com → Console → YourProject → ...
+demoDB = new Firebase
+	projectID: "framer-demo" # ... Database → first part of URL
+	secret: "K2ZJjo4RXG5nlHEWgjgwBzNkeVJCz9YZAQF8dk9g" # ... Project Settings → Service Accounts → Database Secrets → Show (mouse-over)
+
+
+
+# Layers
+
+new BackgroundLayer
+
+slider = new SliderComponent
+slider.center()
+
+slider.knob.backgroundColor = "grey"
+slider.knob.draggable.momentum = false
+
+
+
+# Events + Firebase
+
+slider.knob.onDragEnd ->
+	demoDB.put("/sliderValue",slider.value) # `put´ writes data to Firebase,
+											 # see http://bit.ly/firebasePut
+
+demoDB.onChange "/sliderValue", (value) -> # Retreives data onLoad and when it was changed
+											# see http://bit.ly/firebaseOnChange
+	slider.animateToValue(value) unless slider.knob.isDragging
+
+

module.json

@@ -0,0 +1,11 @@
+{
+    "name": "Firebase",
+    "description": "Allows to load, save and sync data effortlessly between multiple sessions and devices.",
+    "author": "Marc Krenn",
+
+    "require": "{Firebase} = require 'firebase''",
+    "install": "firebase.coffee",
+    "example": "example.coffee",
+
+    "thumb": "firebase.png"
+}