Visual Calculator
About This Space
A fun example of how NodeRun widget appearances can be totally customized, with transition animations giving visual feedback.
Last updated on October 26, 2021
Public Permissions: View Open/Fork Run Comment
Visual Calculator
A fun example of how Profound UI widgets can be totally customized.
This calculator is based off of the stateless rich display file template, and illustrates several interesting things that can be done with Profound.js Spaces:
- Setting widget properties in the Designer
- Setting other widget properties in a CSS file
- Using CSS transition animations with Profound.js Spaces widgets
- Making key presses perform the same actions as mouse clicks
The way it works is each button (a styled label, actually) employs onmousedown
and onmouseup
events to call functions in the main JavaScript code. As numbers are typed, they are concatenated together until an operator button (+, -, etc.) is pressed, whereupon the concatenated number is stored and later used after a second number and operator are entered.
CSS transition animations are used to visually indicate which buttons are being pressed.
More Spaces By Jeff Berman (@jeff)
- 1
- 2
This is just the hello world template for me to test various NodeRun things with. Nothing to see here, move along... :-)
4348
0
0
A demonstration of some of the client-side grid functions that could be used in an offline mobile environment.
1692
0
0
Simple space to demonstrate what appears to be a rendering bug in mobile Safari. Run this space on an iPhone running 12.2 or higher, rotate the phone to landscape, then rotate back to portrait. If the issue occurs, there will be an unusable white space at the bottom of the screen.
4897
0
0
Stateless demo app, where the mobile client or the browser would control the flow of the application
3722
0
0
Stateless demo app, where the mobile client or the browser would control the flow of the application
3755
0
0
Stateless demo app, where the mobile client or the browser would control the flow of the application
4325
0
0
- 1
- 2
Comments
Alex
6 years ago
Love it!