timepiece 0.2.1 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: f5ff771e5b9f2f3590f432accfda73b7218e9306
4
- data.tar.gz: 2fdb9d4ae94cd98cb0a85d82bd1fd77615fcb18a
3
+ metadata.gz: 6c284c38dfc4fe85d07c377331bf1ea408ad94e4
4
+ data.tar.gz: dd2a1147e6282d3d33a37b935ffbad905e05103d
5
5
  SHA512:
6
- metadata.gz: 66f10ab82cbdfa9fa60df227804df65495fe9617134da0c9e77d209f7407e99ef1f9d7bea0db4c3f1b4b5ecc9133a1f6b5f58ad7a8594bc0c79f5c2a2bae2fe6
7
- data.tar.gz: d4ada3cf9a63d0087f5a5727af39636439e7d7dbba4163378e0d8b6440bb6aee87d08052f50bd575db797fc030d91eeae1b988cd18a265b3305320c96a64ad1b
6
+ metadata.gz: 1d56c89c9d07baa6ae0d766474b4b3d1219340ea9cc521087262b6ce9a990000757bc5958f40e67a0c9416853753a983cf59a547f3483acced6f1dd1c6865dce
7
+ data.tar.gz: 154f1bf10371014913e8f77af520307a5687361c2181cfce72d05687576f73e196369619b5f7795abe3b7eefb3204bfba3d5c5c33c3d89cd94316c8be6449f3f
data/README.rdoc CHANGED
@@ -14,6 +14,14 @@ Timepiece is a Rails plugin providing a simple digital clock, accurate to your s
14
14
 
15
15
  //= require timepiece
16
16
 
17
+ 3. If you want to use the new analog clock, you also need to require timepiece in your css
18
+
19
+ *= require 'timepiece'
20
+
21
+ or if you're using SCSS
22
+
23
+ @import 'timepiece';
24
+
17
25
  Note: If you're using Turbolinks with your Rails project, you should also install jquery-turbolinks to ensure functionality is maintained between page loads.
18
26
 
19
27
  == Usage
@@ -56,6 +64,21 @@ You can apply your own styles to any part of the Timepiece clock. For instance,
56
64
 
57
65
  <%= timepiece('London', type: '12', abbr_sep: '.') %>
58
66
 
67
+
68
+ == Analog
69
+
70
+ New to version 0.2.0+, you can now include analog clocks in your projects.
71
+
72
+ * The helper takes the same timezone parameter as the digital version (defaults to 'UTC'):
73
+
74
+ <%= analog('London') %>
75
+
76
+ * To specify a certain size for the clock, use the `size` parameter (defaults to 10em):
77
+
78
+ <%= analog('London', :size => '100px') %>
79
+
80
+ Note that if you pass a percentage, the size will be set as a percentage of the containing div.
81
+
59
82
  == Timer
60
83
 
61
84
  It is now also possible to make use of a basic timer. To start a count from `Time.now`, simply include `timer` in your Rails projects.
@@ -39,6 +39,13 @@ function show_analog(){
39
39
  }
40
40
  }
41
41
  $(".timepiece-analog").each(function(i, e){
42
+ if(analog_hours[i] >= 6 && analog_hours[i] < 18){
43
+ $(e).addClass('timepiece-analog-day')
44
+ $(e).removeClass('timepiece-analog-night')
45
+ }else{
46
+ $(e).addClass('timepiece-analog-night')
47
+ $(e).removeClass('timepiece-analog-day')
48
+ }
42
49
  $(e).html(function(){
43
50
  if(analog_hours[i] > 12){
44
51
  $(e).data('analog_hours', analog_hours[i] - 12)
@@ -52,15 +59,9 @@ function show_analog(){
52
59
  $(e).data('hours_angle', ($(e).data('analog_hours') * 30) + (analog_minutes[i] / 2));
53
60
  $(e).data('minutes_angle', analog_minutes[i] * 6);
54
61
  $(e).data('seconds_angle', analog_seconds[i] * 6);
55
- $('.timepiece-hours-container', $(e)).css('-ms-transform','rotateZ(' + $(e).data('hours_angle') + 'deg)'); // angle set on each
56
- $('.timepiece-hours-container', $(e)).css('-webkit-transform','rotateZ(' + $(e).data('hours_angle') + 'deg)');
57
- $('.timepiece-hours-container', $(e)).css('transform','rotateZ(' + $(e).data('hours_angle') + 'deg)');
58
- $('.timepiece-minutes-container', $(e)).css('-ms-transform','rotateZ(' + $(e).data('minutes_angle') + 'deg)');
59
- $('.timepiece-minutes-container', $(e)).css('-webkit-transform','rotateZ(' + $(e).data('minutes_angle') + 'deg)');
60
- $('.timepiece-minutes-container', $(e)).css('transform','rotateZ(' + $(e).data('minutes_angle') + 'deg)');
61
- $('.timepiece-seconds-container', $(e)).css('-ms-transform','rotateZ(' + $(e).data('seconds_angle') + 'deg)');
62
- $('.timepiece-seconds-container', $(e)).css('-webkit-transform','rotateZ(' + $(e).data('seconds_angle') + 'deg)');
63
- $('.timepiece-seconds-container', $(e)).css('transform','rotateZ(' + $(e).data('seconds_angle') + 'deg)');
62
+ $('.timepiece-hours-container', $(e)).css({'-ms-transform':'rotateZ(' + $(e).data('hours_angle') + 'deg)','-webkit-transform':'rotateZ(' + $(e).data('hours_angle') + 'deg)','transform':'rotateZ(' + $(e).data('hours_angle') + 'deg)'}); // angle set on each
63
+ $('.timepiece-minutes-container', $(e)).css({'-ms-transform':'rotateZ(' + $(e).data('minutes_angle') + 'deg)','-webkit-transform':'rotateZ(' + $(e).data('minutes_angle') + 'deg)','transform':'rotateZ(' + $(e).data('minutes_angle') + 'deg)'});
64
+ $('.timepiece-seconds-container', $(e)).css({'-ms-transform':'rotateZ(' + $(e).data('seconds_angle') + 'deg)','-webkit-transform':'rotateZ(' + $(e).data('seconds_angle') + 'deg)','transform':'rotateZ(' + $(e).data('seconds_angle') + 'deg)'});
64
65
  })
65
66
  })
66
67
  }, 1000)
@@ -85,4 +85,27 @@
85
85
  .timepiece-seconds-container {
86
86
  -webkit-animation: rotate 60s infinite steps(60);
87
87
  }
88
- */
88
+ */
89
+
90
+ .timepiece-analog-day{
91
+ //border-color:#222;
92
+ background-color:#eee;
93
+ }
94
+ .timepiece-analog-day:after, .timepiece-analog-day .timepiece-analog-seconds {
95
+ background: #d00;
96
+ }
97
+ .timepiece-analog-day .timepiece-analog-hours, .timepiece-analog-day .timepiece-analog-minutes {
98
+ background: #333;
99
+ }
100
+
101
+
102
+ .timepiece-analog-night{
103
+ //border-color:#222;
104
+ background-color:#333;
105
+ }
106
+ .timepiece-analog-night:after, .timepiece-analog-night .timepiece-analog-seconds {
107
+ background: #d00;
108
+ }
109
+ .timepiece-analog-night .timepiece-analog-hours, .timepiece-analog-night .timepiece-analog-minutes {
110
+ background: #eee;
111
+ }
@@ -42,16 +42,21 @@ module TimepieceHelper
42
42
 
43
43
  def analog(location = 'UTC', id: '', size: '10em')
44
44
  Time.zone = location
45
- hours = Time.now.in_time_zone.strftime('%I')
45
+ hours = Time.now.in_time_zone.strftime('%H')
46
46
  minutes = Time.now.in_time_zone.strftime('%M')
47
47
  seconds = Time.now.in_time_zone.strftime('%S')
48
+ if hours.to_i >= 6 && hours.to_i < 18
49
+ time_of_day_class = 'timepiece-analog-day'
50
+ else
51
+ time_of_day_class = 'timepiece-analog-night'
52
+ end
48
53
  hours_angle = (hours.to_i * 30) + (minutes.to_i / 2)
49
54
  minutes_angle = minutes.to_i * 6
50
55
  seconds_angle = seconds.to_i * 6
51
56
  time = "<div class='timepiece-hours-container' style='-ms-transform:rotateZ(#{hours_angle}deg);-webkit-transform:rotateZ(#{hours_angle}deg);transform:rotateZ(#{hours_angle}deg);'><div class='timepiece-analog-hours'></div></div>"\
52
57
  "<div class='timepiece-minutes-container' style='-ms-transform:rotateZ(#{minutes_angle}deg);-webkit-transform:rotateZ(#{minutes_angle}deg);transform:rotateZ(#{minutes_angle}deg);'><div class='timepiece-analog-minutes'></div></div>"\
53
58
  "<div class='timepiece-seconds-container' style='-ms-transform:rotateZ(#{seconds_angle}deg);-webkit-transform:rotateZ(#{seconds_angle}deg);transform:rotateZ(#{seconds_angle}deg);'><div class='timepiece-analog-seconds'></div></div>"
54
- content_tag(:div, time.html_safe, class: 'timepiece-analog', 'data-timezone' => location, 'id' => (id unless id.blank?), 'style' => 'width:' + size + ';padding-bottom:' + size + ';')
59
+ content_tag(:div, time.html_safe, class: 'timepiece-analog ' + time_of_day_class, 'data-timezone' => location, 'id' => (id unless id.blank?), 'style' => 'width:' + size + ';padding-bottom:' + size + ';')
55
60
  end
56
61
 
57
62
  def timer(time_since = Time.now, id: '')
@@ -1,3 +1,3 @@
1
1
  module Timepiece
2
- VERSION = "0.2.1"
2
+ VERSION = "0.2.2"
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: timepiece
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.2.1
4
+ version: 0.2.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Thom Bruce
@@ -36,7 +36,7 @@ files:
36
36
  - README.rdoc
37
37
  - Rakefile
38
38
  - app/assets/javascripts/timepiece.js
39
- - app/assets/stylesheets/timepiece.css.scss
39
+ - app/assets/stylesheets/timepiece.css
40
40
  - app/controllers/timepiece_controller.rb
41
41
  - app/helpers/timepiece_helper.rb
42
42
  - config/routes.rb