-
Notifications
You must be signed in to change notification settings - Fork 200
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
04b2ad0
commit ae681b1
Showing
55 changed files
with
530 additions
and
66 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| --- | ||
| title: Push Button Card | ||
| sidebar_label: Push Button (Pro) | ||
| sidebar_position: 5 | ||
| --- | ||
|
|
||
| <div className="pro-label"> | ||
| <i> | ||
| <h4 style={{ fontWeight: '500', marginBottom: 5 }}> | ||
| This feature is available in <a target="_blank" style={{ color: "red" }} href="https://espdash.pro">DASH Pro</a> only. | ||
| </h4> | ||
| </i> | ||
| </div> | ||
|
|
||
| #### Preview: | ||
|
|
||
| <img className="card-preview" src="/img/v4/push-button.png" width="280px" alt="Push Button Card Preview" /> | ||
|
|
||
| <br/> | ||
| <br/> | ||
|
|
||
| Push button card adds a static button on your dashboard which has no state. Whenever a user clicks this button, it triggers a callback. | ||
|
|
||
| <br/> | ||
|
|
||
| #### Type: | ||
| `PUSH_BUTTON_CARD` | ||
|
|
||
| <br/> | ||
|
|
||
| #### Initializer: | ||
| ```cpp | ||
| /* | ||
| Button Card | ||
| Valid Arguments: (ESPDash dashboard, Card Type, const char* name) | ||
| */ | ||
| Card card1(&dashboard, PUSH_BUTTON_CARD, "Push Button"); | ||
| ``` | ||
| <br/> | ||
| #### Callback: | ||
| Push button card will trigger a callback on every click by user, there is no need to update or `sendUpdates` to dashboard because there is no state. | ||
| ```cpp | ||
| /* | ||
| We provide our attachCallback with a lambda function to handle trigger | ||
| */ | ||
| card1.attachCallback([&](){ | ||
| Serial.println("[Card1] Push Button Triggered"); | ||
| }); | ||
| ``` | ||
| <br/> | ||
| <br/> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,79 @@ | ||
| --- | ||
| title: Week Selector Card | ||
| sidebar_label: Week Selector (Pro) | ||
| sidebar_position: 10 | ||
| --- | ||
|
|
||
| <div className="pro-label"> | ||
| <i> | ||
| <h4 style={{ fontWeight: '500', marginBottom: 5 }}> | ||
| This feature is available in <a target="_blank" style={{ color: "red" }} href="https://espdash.pro">DASH Pro</a> only. | ||
| </h4> | ||
| </i> | ||
| </div> | ||
|
|
||
| #### Preview: | ||
|
|
||
| <img className="card-preview" src="/img/v4/week-selector.png" width="280px" alt="Week Selector Card Preview" /> | ||
|
|
||
| <br/> | ||
| <br/> | ||
|
|
||
| Week selector card gives you a nice card in which days are selectable by users. This type of card is very useful in many scenarios. The output of the card is comma `,` separated string on days which were selected by the user. | ||
|
|
||
| <br/> | ||
|
|
||
| #### Type: | ||
| `WEEK_SELECTOR_CARD` | ||
|
|
||
| <br/> | ||
|
|
||
| #### Valid Data Types: | ||
| - `String` | ||
| - `char` | ||
|
|
||
| <br/> | ||
|
|
||
| #### Initializer: | ||
| ```cpp | ||
| /* | ||
| Energy Card | ||
| Valid Arguments: (ESPDash dashboard, Card Type, const char* name) | ||
| */ | ||
| Card card1(&dashboard, WEEK_SELECTOR_CARD, "Select Days"); | ||
| ``` | ||
| <br/> | ||
| #### Callback: | ||
| Week selector card requires a callback function which will be called when we receive a input from our dashboard. In our setup block, we will be calling our `attachCallback` function and provide a lambda (callback) function with a `const char*` (character array) argument. Whenever a user selects a day, this callback will be triggered with a comma `,` separated list of days which indicate what was selected by user. | ||
| **Note:** You need to call the `update` function and `sendUpdates` immediately once you receive the value in callback. Otherwise user input will not be registered on dashboard and it will keep the card stuck in 'waiting' phase. | ||
| ```cpp | ||
| /* | ||
| We provide our attachCallback with a lambda function to handle incomming data | ||
| Example Value: mon,tue,wed,thu,fri,sat,sun | ||
| */ | ||
| card1.attachCallback([&](const char* days){ | ||
| Serial.println("[Card1] Week Selector Triggered: "+String(days)); | ||
| card1.update(value); | ||
| dashboard.sendUpdates(); | ||
| }); | ||
| ``` | ||
|
|
||
| <br/> | ||
|
|
||
| #### Updaters: | ||
| You can also select or deselect values depending on your logic. You just need to supply the updater with a comma `,` separated list of days. Order of days in this string doesn't matter. Example: Supplying `tue,mon,thu` will show `Monday, Tuesday & Thursday` as selected on Week Selector Card. | ||
|
|
||
| ```cpp | ||
| card1.update(const char* value); | ||
| ``` | ||
|
|
||
| ```cpp | ||
| card1.update(String value); | ||
| ``` | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.