There is no automated graded for this assignment.
-
Create a web component named
number-selector
. The final product should look like this: -
The objective is simple: clicking the add button will increment the number and clicking minus button will decrement the number. If a maximum or minimum is set then the number cannot be incremented or decremented beyond those specified points.
-
An initial value can be set on the components
value
attribute. Defaults to0
. -
A maximum value can be set on the
maximum
attribute. Defaults toNaN
. -
A minimum value can be set on the
minimum
attribute. Defaults toNaN
.
-
Make sure that you have NodeJS, bower, and the polymer-cli installed on your computer.
-
Create a Github project for the assignment.
-
Clone the remote repository to your local computer.
-
Use
bower init
to initialize your bower dependencies. -
Add the polymer paper-icon-button dependencies:
bower install --save PolymerElements/paper-icon-button PolymerElements/iron-icons
-
Add the index.html and number-selector.html files to your project.
-
Edit the
number-selector.html
file until you fulfill all of the objectives.- Add paper-icon-buttons with + and - to increment or decement the value when clicked.
-
Use the polymer-cli or http-server to run your server locally while you develop.