From 37c4bfbaffae6b71e62b61e783ec2c4f8554d136 Mon Sep 17 00:00:00 2001 From: Dan Turkenkopf Date: Wed, 17 Sep 2014 16:39:20 -0400 Subject: [PATCH 1/3] Write all item fields as data-? attributes on element If the dataAttributes config option = 'all' then write every field as data-? attributes on the element. --- lib/timeline/component/item/Item.js | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/lib/timeline/component/item/Item.js b/lib/timeline/component/item/Item.js index dfb9abb3..598d19d4 100644 --- a/lib/timeline/component/item/Item.js +++ b/lib/timeline/component/item/Item.js @@ -201,8 +201,20 @@ Item.prototype._updateTitle = function (element) { */ Item.prototype._updateDataAttributes = function(element) { if (this.options.dataAttributes && this.options.dataAttributes.length > 0) { - for (var i = 0; i < this.options.dataAttributes.length; i++) { - var name = this.options.dataAttributes[i]; + var attributes = []; + + if (Array.isArray(this.options.dataAttributes)) { + attributes = this.options.dataAttributes; + } + else if (this.options.dataAttributes == 'all') { + attributes = Object.keys(this.data); + } + else { + return; + } + + for (var i = 0; i < attributes.length; i++) { + var name = attributes[i]; var value = this.data[name]; if (value != null) { From 99ad76972d7d86d057fc21ccadc73f7493e887b7 Mon Sep 17 00:00:00 2001 From: Dan Turkenkopf Date: Wed, 17 Sep 2014 16:39:39 -0400 Subject: [PATCH 2/3] Update examples to include all_data_attributes --- examples/timeline/24_all_data_attributes.html | 43 +++++++++++++++++++ ...nd_areas.html => 25_background_areas.html} | 0 .../{25_templates.html => 27_templates.html} | 0 examples/timeline/index.html | 7 +-- 4 files changed, 47 insertions(+), 3 deletions(-) create mode 100644 examples/timeline/24_all_data_attributes.html rename examples/timeline/{24_background_areas.html => 25_background_areas.html} (100%) rename examples/timeline/{25_templates.html => 27_templates.html} (100%) diff --git a/examples/timeline/24_all_data_attributes.html b/examples/timeline/24_all_data_attributes.html new file mode 100644 index 00000000..dc077aa3 --- /dev/null +++ b/examples/timeline/24_all_data_attributes.html @@ -0,0 +1,43 @@ + + + + Timeline | Basic demo + + + + + + + +

+ In this example all items get HTML attributes attached: each item gets data-? attributes for each field defined on the JS object. +

+ +
+ + + + \ No newline at end of file diff --git a/examples/timeline/24_background_areas.html b/examples/timeline/25_background_areas.html similarity index 100% rename from examples/timeline/24_background_areas.html rename to examples/timeline/25_background_areas.html diff --git a/examples/timeline/25_templates.html b/examples/timeline/27_templates.html similarity index 100% rename from examples/timeline/25_templates.html rename to examples/timeline/27_templates.html diff --git a/examples/timeline/index.html b/examples/timeline/index.html index 89389e96..9d2d8946 100644 --- a/examples/timeline/index.html +++ b/examples/timeline/index.html @@ -35,9 +35,10 @@

21_set_selection.html

22_window_adjustment.html

23_data_attributes.html

-

24_background_areas.html

-

25_templates.html

-

26_external_data.html

+

24_all_data_attributes.html

+

25_background_areas.html

+

26_templates.html

+

27_external_data.html

requirejs_example.html

From 858b2307607743d2f586d51c7880cacd9ab39d4e Mon Sep 17 00:00:00 2001 From: Dan Turkenkopf Date: Wed, 17 Sep 2014 16:45:21 -0400 Subject: [PATCH 3/3] Updated dataAttributes documentation for 'all' option --- docs/timeline.html | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/timeline.html b/docs/timeline.html index fb02ad90..46eea6c7 100644 --- a/docs/timeline.html +++ b/docs/timeline.html @@ -381,9 +381,10 @@ var options = { dataAttributes - Array[String] + Array[String] | 'all' false - An array of fields optionally defined on the timeline items that will be appended as data- attributes to the DOM element of the items. + An array of fields optionally defined on the timeline items that will be appended as data- attributes to the DOM element of the items.
+ If value is 'all' then each field defined on the timeline item will become a data- attribute.