Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Timezone List Added #27

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open

Timezone List Added #27

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
bc3b79c
Timezone List Added
didzruwiem Dec 3, 2014
ad9574e
Add more codes in ui.js
didzruwiem Dec 7, 2014
94f3345
Adding a gettime function
didzruwiem Dec 7, 2014
ec07f38
Remove and Update some div #London_link
didzruwiem Dec 7, 2014
893b707
Remove digital_display.
didzruwiem Dec 7, 2014
22f197b
Lastest Code of ui.js
didzruwiem Dec 11, 2014
4a99a44
Latest Code for Timer.js
didzruwiem Dec 11, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 5 additions & 4 deletions application/templates/timer_box.mustache
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
<div id="{{guid}}" class="col-lg-4 timer_box">
<div id="{{guid}}" class="col-lg-4 timer_box" style="display: none;">
<button type="button" class="close" data-dismiss="alert">
<span aria-hidden="true">&times;</span>
<span class="sr-only">Close</span>
</button>
<a id="{{guid}}_link" href="#" class="thumbnail">
<a id="{{guid}}" href="#" class="thumbnail">
<div class="svg_placeholder"></div>
<div class="laptime_display"></div>
<div class="digital_display">12:12 AM</div>
<!-- <div class="digital_display"></div> -->
<div class="{{guid}}"></div>
<div class="btns"></div>
<div class="title">{{title}}</div>
</a>
</div>
</div>
38 changes: 33 additions & 5 deletions application/views/home.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,17 @@
<div id="left_col" class="col-md-3" style="background-color:#f5f5f5; padding-top: 1em; height:100%;">

<input id="title" type="text" class="form-control" placeholder="Title">
<input id="size" type="text" class="form-control" placeholder="Size" value="120">
<input id="size" type="text" class="form-control" value="" placeholder="Size (Maximum '130')">

<input id="timezone" type="text" class="form-control" placeholder="Timezone" style="display:none;">
<select id="timezone" class="form-control" style="display:none;">
<option value="0">Please, select timezone</option>
<?php foreach(tz_list() as $t) { ?>
<option value="<?php print $t['offset'] ?>">
<?php print $t['diff_from_GMT'] . ' - ' . $t['timezone_name'] ?>
</option>
<?php } ?>
</select>

<input id="countdown_time" type="text" class="form-control" placeholder="Time to countdown" style="display:none;">
<input id="alarm_time" type="text" data-time-format="H:i:s" class="form-control" placeholder="Wake Up Time" style="display:none;">

Expand Down Expand Up @@ -54,7 +62,9 @@
<div id="timer_holder"></div>

<!-- scrap, needs to be trashed, leaving for now for testing -->
<div id="London" class="col-lg-4 timer_box">


<!--<div id="London" class="col-lg-4 timer_box">
<button type="button" class="close" data-dismiss="alert">
<span aria-hidden="true">&times;</span>
<span class="sr-only">Close</span>
Expand All @@ -65,7 +75,7 @@
<div class="digital_display">11:11 AM</div>
<div class="title">Photo Title</div>
</a>
</div>
</div>-->
<!-- scrap, needs to be trashed, leaving for now for testing -->


Expand All @@ -79,4 +89,22 @@
</div>
<!-- >>> RIGHT COLUMN >>> -->
</div> <!-- /.row -->
</div><!-- /.container -->
</div><!-- /.container -->
<?php
function tz_list() {
$timezone_array = array();

$timestamp = time();

foreach(timezone_identifiers_list() as $key => $timezone) {

date_default_timezone_set($timezone);

$timezone_array[$key]['timezone_name'] = $timezone;
$timezone_array[$key]['diff_from_GMT'] = 'UTC/GMT ' . date('P', $timestamp);
$timezone_array[$key]['offset'] = date('P', $timestamp);
}
return $timezone_array;
}

?>
89 changes: 70 additions & 19 deletions js/timer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -135,13 +135,18 @@ var clock = {
ui.set_type(clocks[guid].type, true)
});



//updateData(offset); //draw them in the correct starting position

setInterval(function(){
updateData(offset);
moveHands(guid);
}, 1000);




var width = (clockRadius+margin)*2,// replace global definition in function scope.
height = (clockRadius+margin)*2,
secondTickStart = clockRadius,
Expand Down Expand Up @@ -169,6 +174,7 @@ var clock = {
.attr('y2',secondTickStart + secondTickLength)
.attr('transform',function(d){
return 'rotate(' + secondScale(d) + ')';
$(".digital_display").text(d);
});
//and labels

Expand Down Expand Up @@ -254,15 +260,15 @@ var timerClock = {
postRender : function(guid){
//alert('yo');
$('#btns').append(' \
<p><button onclick="startTimerOnClick(guid);">Start</button> \
<button onclick="stopTimerOnClick(guid);">Stop</button></p>');
<p><button onclick="startTimerOnClick(\' + guid + \');">Start</button> \
<button onclick="stopTimerOnClick(\' + guid + \');">Stop</button></p>');
}
};
var countDownClock = {
postRender : function(guid){
$('#btns').append(' \
<p><button onclick="startCountDownOnClick(guid);">Start</button> \
<button onclick="stopCountDownOnClick(guid);">Stop</button></p>');
<p><button onclick="startCountDownOnClick(\' + guid + \');">Start</button> \
<button onclick="stopCountDownOnClick(\' + guid + \');">Stop</button></p>');

updateCountDown(guid);
moveCountDownHands(guid, guid);
Expand All @@ -271,20 +277,10 @@ var countDownClock = {

var lapTimerClock = {
postRender : function(guid){

//var start = document.createElement("button");
//start.setAttribute('type', 'button');
//start.setAttribute('class', 'btn btn-danger');
//start.setAttribute('onclick', 'startLapTimerOnClick(guid);');
//start.innerHTML = '<span class="glyphicon glyphicon-ok"></span> Start';
//
//var btn = document.getElementById('buttons_lap_timer');
//btn.appendChild(start);

$('#buttons_lap_timer').append(' \
<button onclick="startLapTimerOnClick(guid);" type="button" class="btn btn-primary"><span class="glyphicon glyphicon-ok"></span> Start</button> \
<button onclick="stopLapTimerOnClick(guid);"type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Stop</button> \
<button onclick="splitTimerOnClick(guid);"type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Lap / Split</button>');
<button onclick="startLapTimerOnClick(\' + guid + \');" type="button" class="btn btn-primary"><span class="glyphicon glyphicon-ok"></span> Start</button> \
<button onclick="stopLapTimerOnClick(\' + guid + \');"type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Stop</button> \
<button onclick="splitTimerOnClick(\' + guid + \');"type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Lap / Split</button>');
}
};

Expand Down Expand Up @@ -316,9 +312,10 @@ var playSound = {
};

var digitalTimer = {
render : function() {
render : function(view) {
digitalTimer.preRender();
var dd = document.getElementsByClassName('digital_display')[0],

start = document.getElementById('start'),
stop = document.getElementById('stop'),
clear = document.getElementById('clear'),
Expand Down Expand Up @@ -380,6 +377,7 @@ function moveHands(area){
.attr('transform',function(d){
return 'rotate('+ d.scale(d.value) +')';
});
$('.current_time.').text(area);
}

function moveTimerHands(guid, area){
Expand Down Expand Up @@ -423,8 +421,61 @@ function updateData(offset){
handData[0].value = (nd.getHours() % 12) + nd.getMinutes()/60;
handData[1].value = nd.getMinutes();
handData[2].value = nd.getSeconds();

}


var times = [];
function gettime(view){

var guid = view['guid'];
times[guid] = view;
var offset = parseInt(times[guid].timezone);
d = new Date();
utc = d.getTime() + (d.getTimezoneOffset() * 60000);
nd = new Date(utc + (3600000*offset));

if (nd.getHours() >= 12){
var hour = nd.getHours() - 12;

var amPm = "PM";

} else {
var hour = nd.getHours();

var amPm = "AM";
}

if (nd.getSeconds() < 10){

var seconds = "0" + nd.getSeconds();

} else {

var seconds = nd.getSeconds();
}

if (nd.getMinutes() < 10){

var minutes = "0" + nd.getMinutes();

} else {

var minutes = nd.getMinutes();
}

if(hour == 0){
hour = 1;
}


$('.'+guid).text(hour + ":" + minutes + ":" + seconds + " " + amPm);
setTimeout(function(){gettime(view)}, 1000);
}




function updateTimer(guid, counter) {

if(typeof window[guid] === 'undefined') {
Expand Down Expand Up @@ -727,4 +778,4 @@ function initCountDownTimer(guid, time) {
}
}

d3.select(self.frameElement).style("height", height + "px");
d3.select(self.frameElement).style("height", height + "px");
29 changes: 21 additions & 8 deletions js/ui.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
var timer_count=1; // eventually need to load from storage so not to override current timers
var timer_type = '1';


var ui = {
nav: function(){
$('#sign_up a').on('click', function(){
Expand Down Expand Up @@ -120,11 +121,22 @@ var ui = {
var size = $('#size').val();
var timezone = $('#timezone').val();
var time = parseInt($('#countdown_time').val());
//console.log(title, size, timezone, time);
if(title !== '' && size !== ''/* && timezone !== ''*/) {
var view = {'guid' : 'timer'+timer_count, 'timezone': timezone, 'title': title, 'clockSize': size, 'type' : timer_type, 'time': time};
timer_count++;
preDraw(view);

if(title !== '' && size !== '' && timezone != 0/* && timezone !== ''*/) {
if($.isNumeric(size)){
if(size <= 130){
var view = {'guid' : 'timer'+timer_count, 'timezone': timezone, 'title': title, 'clockSize': size, 'type' : timer_type, 'time': time};
timer_count++;
preDraw(view);
$('.timer_box').show();
} else {
alert('Please Set a size of clock a maximum 130');
}

} else {
alert('Please Input Number on size');

}
}
else{
alert('Please enter a valid value.');
Expand All @@ -140,12 +152,14 @@ var ui = {
}

function preDraw(view){
switch(timer_type) {
switch(view['type']) {
case '1':
clock.render(view);
gettime(view);
break;
case '2':
timerClock.render(view);
digitalTimer.render(view);
break;
case '3':
countDownClock.render(view);
Expand All @@ -159,5 +173,4 @@ function preDraw(view){
alert('error, unknown type');
break;
}

}
}