search

USEPA / useeio-widgets

Creative Commons Zero v1.0 Universal
3 stars 17 forks source link

7. Auto update on hash change - Settings/Config page sample #27

Open TheTisiboth opened 3 years ago

TheTisiboth commented 3 years ago
  1. When the hiddenhash object changes, widgets should auto-update as if the hash had changed. (To simplify, the string/array version of the hiddenhash can be eliminated.)
localsite commented 3 years ago

Storing the hiddenhash object in a hidden div with id="hiddenhash" may be the most efficient way to watch for changes.

localsite commented 3 years ago

Samples are being set up for further testing.

Michael has implemented an other ConfigTransmitter: an HTMLConfigTransmitter, where the config is stored in a div, as suggested. Example:

https://thetisiboth.github.io/useeio-widget-builds/iotables_config_attr.html https://github.com/USEPA/useeio-widgets/blob/wod3/src/html/iotables_config_attr.html#L56

So now, if we use this transmitter, the url would never change, because the config would be updated in that div.

Both options, the URL hash configuration or the HTML attribute option can be used (it is up to the user of the widget API; the widgets are independent from the config-sharing). The HTML attribute configuration is just another option to the URL hash configuration. It works in the same way but the configuration is serialized into an attribute of an HTML element instead of the URL hash part:

https://github.com/USEPA/useeio-widgets/blob/wod3/src/html/iotables_config_attr.html#L56

It can be created with the useeio.htmlAttributeConfig function that takes the element selector and the attribute as input:

https://github.com/USEPA/useeio-widgets/blob/wod3/src/html/iotables_config_attr.html#L63

The joined widgets can be then updated by simply calling setAttribute with the updated values:

https://github.com/USEPA/useeio-widgets/blob/wod3/src/html/iotables_config_attr.html#L131

All configuration options share the same API and functionality.

LorenHeyns commented 3 years ago

When we have multiple regions and years, "US" and the most recently available years should load in the dropdowns without populating the URL. If US or the most recent year is selected in the dropdown, avoid updating the URL.

For the following, the Year and Location menus should auto-populate:

https://thetisiboth.github.io/useeio-widget-builds/settings.html#location=US&year=2012

https://thetisiboth.github.io/useeio-widget-builds/iotables_config_attr.html#location=US&year=2012