Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Showing
with
37 additions
and 15 deletions.
- +33 −15 template/app.js
- BIN template/framer-logo.png
- +4 −0 template/index.html
@@ -1,20 +1,38 @@ | ||
view = new View({ | ||
x:100, y:100, | ||
width:200, height:200 | ||
}); | ||
// Welcome to Framer | ||
|
||
// This is just demo code. Feel free to delete it all. | ||
|
||
view.style = { | ||
textAlign: "center", | ||
lineHeight: view.height + "px", | ||
backgroundColor: "rgba(255,0,0,0.5)" | ||
}; | ||
|
||
view.html = "Hello"; | ||
// Create the logo view | ||
logoView = new ImageView({ | ||
width:251, height:302, | ||
image: "framer-logo.png" | ||
}); | ||
|
||
// Place it center screen | ||
logoView.midX = window.innerWidth / 2 | ||
logoView.midY = window.innerHeight / 2 - 100 | ||
|
||
view.on("click", function() { | ||
view.scale = 0.8; | ||
view.animate({ | ||
// Bounce on a click | ||
logoView.on("click", function() { | ||
logoView.scale = 0.8; | ||
logoView.animate({ | ||
properties: {scale:1}, | ||
curve: "spring(100,15,1000)" | ||
curve: "spring(1000,15,1000)" | ||
}); | ||
}); | ||
}); | ||
|
||
// Create the logo view | ||
instructionsView = new View({ | ||
x: logoView.x, y: logoView.maxY + 30, | ||
width:logoView.width, height:100, | ||
}); | ||
|
||
// Add some handy links | ||
instructionsView.html = "To start editing, open the app.js file in your text editor.<br><br>"; | ||
instructionsView.html += "<a href='http://www.framerjs.com/documentation?origin=project' target='new'>Documentation</a> "; | ||
instructionsView.html += "<a href='http://www.framerjs.com/examples?origin=project' target='new'>Examples</a>"; | ||
instructionsView.style = { | ||
font: "15px/1.4em Helvetica", | ||
textAlign: "center" | ||
} |
Binary file not shown.