You are here

README.txt in Javascript Timer 8

Same filename and directory in other branches
  1. 6 README.txt
  2. 7 README.txt
-------------- OVERVIEW -------------------------------------------
The Javascript Timer module provides a timer api that can hook html elements to
javascript widget objects. This is useful if you want a moving timer/clock or a
widget that updates every second. It comes with widgets for a countdown timer, a
countup timer, and a clock.


-------------- INSTALLING -----------------------------------------
Simply by activating the module and a widget.
There are no module dependencies.
There are no table components.


-------------- GENERAL USAGE -----------------------------------------
You can either build-up your own nested <span tags within
a full html (or filtered with <spans allowed) input format, or
use php directly.  There are now theme functions to help with
the php formatted strings.

NOTE: the date format is an ISO8601 subset, so use the
      formats as you see them below.


-------------- Inline HTML Examples --------------

Countdown timer (with DateTime specified):
<span class="jst_timer">
 <span style="display:none" class="datetime">2015-05-02T08:11:00-08:00</span>
</span>

Countdown timer (with interval specified in seconds):
<span class="jst_timer">
 <span style="display:none" class="interval">22</span>
</span>

Countdown timer with output format number setting:
<span class="jst_timer">
<span class="datetime" style="display: none;">2015-11-27T10:15:00-07:00</span>
<span class="format_num" style="display:none;">2</span>
</span>

Count up timer:
<span class="jst_timer">
  <span style="display:none" class="datetime">2010-09-20T08:11:00Z</span>
  <span style="display:none" class="dir">up</span>
</span>

NASA style down/up timer:
<span class="jst_timer">
  <span class="datetime" style="display: none;">2012-10-26T10:28:00-07:00</span>
  <span class="dir" style="display: none;">up</span>
  <span class="format_txt" style="display:none;">%sign%%hours%::%mins%::%secs%</span>
</span>

SVG Clock:
<span class="jst_clock">
 <span style="display:none" class="clock_type">3</span>
 <span style="display:none" class="size">400</span>
</span>

HTML Canvas Clock:
<span class="jst_clock">
 <span style="display:none" class="clock_type">2</span>
 <span style="display:none" class="size">200</span>
</span>



-------------- PHP Input Format Examples --------------

Countdown timer:
<?php
print theme('jstimer', array(
  'widget_name' => 'jst_timer',
  'widget_args' => array(
    'datetime' => '2015-05-02T08:11:00-08:00'
  )
));
?>

Countdown timer with output format number setting:
<?php
print theme('jstimer', array(
  'widget_name' => 'jst_timer',
  'widget_args' => array(
  'datetime' => '2015-05-02T08:11:00-08:00',
    'format_num' => 2,
  )
));
?>


Count up timer:
<?php
print theme('jstimer', array(
  'widget_name' => 'jst_timer',
  'widget_args' => array(
    'datetime' => '2010-05-02T08:11:00+02:00',
    'dir'=>'up'
  )
));
?>

NASA style down/up timer:
<?php
print theme('jstimer', array(
  'widget_name' => 'jst_timer',
  'widget_args' => array(
    'datetime' => '2015-05-02T08:11:00+02:00',
    'dir'=>'up',
    'format_txt' => '%sign%%hours%::%mins%::%secs%'
  )
));
?>

Clock Widget:
<?php
print theme('jstimer', array(
  'widget_name' => 'jst_clock',
  'widget_args' => array(
    'clock_type' => 2,
    'size' => 200
  )
));
?>



-------------- Timer widget OUTPUT FORMAT ---------------------------------------
The display of the actual timer is configurable in the Site configuration
admin menu: countdowntimer.

IMPORTANT: If you have a format_num and a format_txt in a timer, the format_txt
value will trump the format_num value.

Currently supported replacement values are:

Target date replacements:
%day%   - Day number of target date (0-31)
%month% - Month number of target date (1-12)
%year%  - Year number of target date (2013)
%dow%   - Day-Of-Week (Mon-Sun)
%moy%   - Month-Of-Year (Jan-Dec)

Duration/Interval replacements:
%years% - Years from set date (ex:2013, integer number)
%ydays% - (Days - Years) from set date(integer number)
%days%  - Total Days from set date (integer number)
%hours% - (Hours - Days) from set date (integer number, zero padded)
%hours_nopad% - (Hours - Days) from set date (integer number, no padding)
%mins%  - (Minutes - Hours) from set date (intger number, zero padded)
%mins_nopad%  - (Minutes - Hours) from set date (intger number, no padding)
%secs%  - (Seconds - Minutes) from set date (integer number, zero padded)
%secs_nopad%   - (Seconds - Minutes) from set date (integer number, no padding)
%months%       - (Months - Years) from set date, will be 11 or less (integer number)
%tot_months%   - Total months from set date, can be larger than 11 (integer number)
%tot_hours%    - Total hours from set date, can be larger than 23 (integer number)
%tot_minutes%  - Total minutes from set date, can be larger than 59 (integer number)
%tot_seconds%  - Total seconds from set date, can be larger than 59 (integer number)
%sign%         - Is used for NASA style countdown, will be '-' before set date and '' after set date (blank or '-')



-------------- CAVEATS ---------------------------------------------
If a daylight saving time shift should occur in either the client's tz or
the target's tz between the current date/time and your target datetime,
you could be off by one hour until you pass the point of conversion.

If you use the PHP input format beware.  If you have a syntax or other PHP error
and you've put your code in a block visible on all pages your entire site
may go down and you'll need to edit your database directly to delete that block!

File

README.txt
View source
  1. -------------- OVERVIEW -------------------------------------------
  2. The Javascript Timer module provides a timer api that can hook html elements to
  3. javascript widget objects. This is useful if you want a moving timer/clock or a
  4. widget that updates every second. It comes with widgets for a countdown timer, a
  5. countup timer, and a clock.
  6. -------------- INSTALLING -----------------------------------------
  7. Simply by activating the module and a widget.
  8. There are no module dependencies.
  9. There are no table components.
  10. -------------- GENERAL USAGE -----------------------------------------
  11. You can either build-up your own nested
  12. a full html (or filtered with
  13. use php directly. There are now theme functions to help with
  14. the php formatted strings.
  15. NOTE: the date format is an ISO8601 subset, so use the
  16. formats as you see them below.
  17. -------------- Inline HTML Examples --------------
  18. Countdown timer (with DateTime specified):
  19. Countdown timer (with interval specified in seconds):
  20. Countdown timer with output format number setting:
  21. Count up timer:
  22. NASA style down/up timer:
  23. SVG Clock:
  24. HTML Canvas Clock:
  25. -------------- PHP Input Format Examples --------------
  26. Countdown timer:
  27. print theme('jstimer', array(
  28. 'widget_name' => 'jst_timer',
  29. 'widget_args' => array(
  30. 'datetime' => '2015-05-02T08:11:00-08:00'
  31. )
  32. ));
  33. ?>
  34. Countdown timer with output format number setting:
  35. print theme('jstimer', array(
  36. 'widget_name' => 'jst_timer',
  37. 'widget_args' => array(
  38. 'datetime' => '2015-05-02T08:11:00-08:00',
  39. 'format_num' => 2,
  40. )
  41. ));
  42. ?>
  43. Count up timer:
  44. print theme('jstimer', array(
  45. 'widget_name' => 'jst_timer',
  46. 'widget_args' => array(
  47. 'datetime' => '2010-05-02T08:11:00+02:00',
  48. 'dir'=>'up'
  49. )
  50. ));
  51. ?>
  52. NASA style down/up timer:
  53. print theme('jstimer', array(
  54. 'widget_name' => 'jst_timer',
  55. 'widget_args' => array(
  56. 'datetime' => '2015-05-02T08:11:00+02:00',
  57. 'dir'=>'up',
  58. 'format_txt' => '%sign%%hours%::%mins%::%secs%'
  59. )
  60. ));
  61. ?>
  62. Clock Widget:
  63. print theme('jstimer', array(
  64. 'widget_name' => 'jst_clock',
  65. 'widget_args' => array(
  66. 'clock_type' => 2,
  67. 'size' => 200
  68. )
  69. ));
  70. ?>
  71. -------------- Timer widget OUTPUT FORMAT ---------------------------------------
  72. The display of the actual timer is configurable in the Site configuration
  73. admin menu: countdowntimer.
  74. IMPORTANT: If you have a format_num and a format_txt in a timer, the format_txt
  75. value will trump the format_num value.
  76. Currently supported replacement values are:
  77. Target date replacements:
  78. %day% - Day number of target date (0-31)
  79. %month% - Month number of target date (1-12)
  80. %year% - Year number of target date (2013)
  81. %dow% - Day-Of-Week (Mon-Sun)
  82. %moy% - Month-Of-Year (Jan-Dec)
  83. Duration/Interval replacements:
  84. %years% - Years from set date (ex:2013, integer number)
  85. %ydays% - (Days - Years) from set date(integer number)
  86. %days% - Total Days from set date (integer number)
  87. %hours% - (Hours - Days) from set date (integer number, zero padded)
  88. %hours_nopad% - (Hours - Days) from set date (integer number, no padding)
  89. %mins% - (Minutes - Hours) from set date (intger number, zero padded)
  90. %mins_nopad% - (Minutes - Hours) from set date (intger number, no padding)
  91. %secs% - (Seconds - Minutes) from set date (integer number, zero padded)
  92. %secs_nopad% - (Seconds - Minutes) from set date (integer number, no padding)
  93. %months% - (Months - Years) from set date, will be 11 or less (integer number)
  94. %tot_months% - Total months from set date, can be larger than 11 (integer number)
  95. %tot_hours% - Total hours from set date, can be larger than 23 (integer number)
  96. %tot_minutes% - Total minutes from set date, can be larger than 59 (integer number)
  97. %tot_seconds% - Total seconds from set date, can be larger than 59 (integer number)
  98. %sign% - Is used for NASA style countdown, will be '-' before set date and '' after set date (blank or '-')
  99. -------------- CAVEATS ---------------------------------------------
  100. If a daylight saving time shift should occur in either the client's tz or
  101. the target's tz between the current date/time and your target datetime,
  102. you could be off by one hour until you pass the point of conversion.
  103. If you use the PHP input format beware. If you have a syntax or other PHP error
  104. and you've put your code in a block visible on all pages your entire site
  105. may go down and you'll need to edit your database directly to delete that block!