meta4-state.html

<link rel="import" href="/bower_components/polymer/polymer.html">

<dom-module id="meta4-state">
	<script>
		(function() {
			var instances = [];
			var vars = Object.create(Polymer.Base);

			Polymer({
				is: 'meta4-state',
				
				properties: {
					data: {
						type: Object,
						value: '',
						notify: true,
						readonly: false,
						observer: '_data_changed'
					},
					key: String
				},

				created: function() {
					key = this.getAttribute('key');
					if (!key) {
						console.log(this);
						throw('app-data element requires key');
					}
					instances.push({key:key, instance:this});
				},

				detached: function() {
					key = this.getAttribute('key');
					var i = instances.indexOf({key:key, instance:this});
					if (i >= 0) {
						instances.splice(i, 1);
					}
				},

				_data_changed: function(newvalue, oldvalue) {
					key = this.getAttribute('key');
					if (!key) {
						throw('_data_changed: app-data element requires key');
					}
					vars.set(key, newvalue);

					// notify the instances with the correct key
					for (var i = 0; i < instances.length; i++) {
						if (instances[i].key == key) {
							instances[i].instance.notifyPath('data', newvalue);
						}
					}
				}
			});
		}());
	</script>
</dom-module>