You are here

README.txt in Views TimelineJS integration 7

INSTALLATION
============

1. Download & Enable this module:
http://drupal.org/project/views_timelinejs

2. Download & Enable Libraries API module:
http://drupal.org/project/libraries

3. Download Timeline JS libraries from Github:
https://github.com/NUKnightLab/TimelineJS/releases/tag/2.26.3

or clone the library with Git using the command:
git clone --branch 2.26.3 https://github.com/NUKnightLab/TimelineJS.git timeline

Warning: Later versions of the TimelineJS library do not include the build
directory and compiled versions of the JS files.  2.26.3 is the last tag that
will work with this module's 7.x-1.x branch.

4. Place Timeline JS library into sites/all/libraries/timeline. The timeline.js and storyjs-embed.js
files should be located in the sites/all/libraries/timeline/build/js directory.



USAGE
=====

Timeline JS Fields
------------------
 * Headline (required) - Title of the timeline item. Can use any field from the view.

 * Body text - Provides additional detail for the item. Can use any field from the view.

 * Start and End Date - Required start and optional end of an event; can be a
   date field or timestamp.

 * Media URL - Drupal core image fields and link fields are supported; must
   contain a raw URL to an image or video.

 * Media Credit - Byline naming the author or attributing the source. Can use any field from
   the view.

 * Media Caption - Brief explanation of the media content. Can use any field from the view.

 * Tag - Content tagging; maximum of 6 tags. Can be a term reference, text, or long text field
   from the view.


1. Create a view

Create a new view and choose the change the display format to "TimelineJS".

2. Configure the view

a. Click "Add" in the fields section of the Views interface to add all the desired
fields to the view. Once the fields have been added to the view,they will be available for
field mappings.

b. Format the fields used for the timeline as desired. For example, if you wish the headline to link
to the entity it represents use the "Link this field to the original piece of content" option in
the field settings for the view. Likewise if you wish to strip tags from the body text, use the
"Rewrite results" -> "Strip HTML tags" option in the field settings.

c. Click the TimelineJS "settings" in format section. Edit the general
configuration of the timeline display and then edit the field mappings and
make sure each timeline element has a corresponding content field selected.
If you do not select a field mapping for all the required elements, you will
get errors on the view.

d. Click "Save" for the view to complete the configuration. The preview display
on the Views edit interface shows the data used by TimelineJS.
To see the TimelineJS display, access the view just created.


MAINTAINERS
===========
* Juha Niemi (juhaniemi)
* Olli Erinko (operinko)
* Jon Peck (fluxsauce)
* WorldFallz

File

README.txt
View source
  1. INSTALLATION
  2. ============
  3. 1. Download & Enable this module:
  4. http://drupal.org/project/views_timelinejs
  5. 2. Download & Enable Libraries API module:
  6. http://drupal.org/project/libraries
  7. 3. Download Timeline JS libraries from Github:
  8. https://github.com/NUKnightLab/TimelineJS/releases/tag/2.26.3
  9. or clone the library with Git using the command:
  10. git clone --branch 2.26.3 https://github.com/NUKnightLab/TimelineJS.git timeline
  11. Warning: Later versions of the TimelineJS library do not include the build
  12. directory and compiled versions of the JS files. 2.26.3 is the last tag that
  13. will work with this module's 7.x-1.x branch.
  14. 4. Place Timeline JS library into sites/all/libraries/timeline. The timeline.js and storyjs-embed.js
  15. files should be located in the sites/all/libraries/timeline/build/js directory.
  16. USAGE
  17. =====
  18. Timeline JS Fields
  19. ------------------
  20. * Headline (required) - Title of the timeline item. Can use any field from the view.
  21. * Body text - Provides additional detail for the item. Can use any field from the view.
  22. * Start and End Date - Required start and optional end of an event; can be a
  23. date field or timestamp.
  24. * Media URL - Drupal core image fields and link fields are supported; must
  25. contain a raw URL to an image or video.
  26. * Media Credit - Byline naming the author or attributing the source. Can use any field from
  27. the view.
  28. * Media Caption - Brief explanation of the media content. Can use any field from the view.
  29. * Tag - Content tagging; maximum of 6 tags. Can be a term reference, text, or long text field
  30. from the view.
  31. 1. Create a view
  32. Create a new view and choose the change the display format to "TimelineJS".
  33. 2. Configure the view
  34. a. Click "Add" in the fields section of the Views interface to add all the desired
  35. fields to the view. Once the fields have been added to the view,they will be available for
  36. field mappings.
  37. b. Format the fields used for the timeline as desired. For example, if you wish the headline to link
  38. to the entity it represents use the "Link this field to the original piece of content" option in
  39. the field settings for the view. Likewise if you wish to strip tags from the body text, use the
  40. "Rewrite results" -> "Strip HTML tags" option in the field settings.
  41. c. Click the TimelineJS "settings" in format section. Edit the general
  42. configuration of the timeline display and then edit the field mappings and
  43. make sure each timeline element has a corresponding content field selected.
  44. If you do not select a field mapping for all the required elements, you will
  45. get errors on the view.
  46. d. Click "Save" for the view to complete the configuration. The preview display
  47. on the Views edit interface shows the data used by TimelineJS.
  48. To see the TimelineJS display, access the view just created.
  49. MAINTAINERS
  50. ===========
  51. * Juha Niemi (juhaniemi)
  52. * Olli Erinko (operinko)
  53. * Jon Peck (fluxsauce)
  54. * WorldFallz