JavaScript - Time Zone Conversion Not Using Current Time
I'm not really a Java writer, so I don't know how to do this myself, though I imagine it would be pretty simple.
I am looking to add a script to a webpage that allows users to input a time manually, and have it converted to GMT/Zulu time and display the converted time. I have seen a lot of time zone conversion scripts online, but they all just convert whatever the current system time is to another time zone. I am looking for a script that allows users to convert a time and show the zulu time, for times other than the current time. The time zone the inputed local time would be in is +4:30 (Kabul). I don't really care about style or aestehtics, just a simple script I can insert into a web page to have a time input field. The converted output time can appear in another field, a popup bubble, etc, again style isn't really an issue. It's really just to help people in my job who need to know what the GMT/Zulu time was for certain local times after the fact. One would think it shouldn't be that hard to just subtract 4:30 in your head, but apparently it is. Sorry if just asking for code outright like this is frowned upon. Similar TutorialsHi there! Well, I recently found the Image clock code, and I am loving it! But, I would like it to only display pacific time, not retrieve the time from a users browser. Here's my code: Code: <script type="text/javascript"> /*********************************************** * JavaScript Image Clock- by JavaScript Kit (www.javascriptkit.com) * This notice must stay intact for usage * Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and 100s more ***********************************************/ var imageclock=new Object() //Enter path to clock digit images here, in order of 0-9, then "am/pm", then colon image: imageclock.digits=["/users/1712/49/18/66/album/c012.png", "/users/1712/49/18/66/album/c112.png", "/users/1712/49/18/66/album/c211.png", "/users/1712/49/18/66/album/c311.png", "/users/1712/49/18/66/album/c411.png", "/users/1712/49/18/66/album/c511.png", "/users/1712/49/18/66/album/c611.png", "/users/1712/49/18/66/album/c711.png", "/users/1712/49/18/66/album/c811.png", "/users/1712/49/18/66/album/c911.png", "/users/1712/49/18/66/album/cam11.png", "/users/1712/49/18/66/album/cpm13.png", "/users/1712/49/18/66/album/ccolon11.png"] imageclock.instances=0 var preloadimages=[] for (var i=0; i<imageclock.digits.length; i++){ //preload images preloadimages[i]=new Image() preloadimages[i].src=imageclock.digits[i] } imageclock.imageHTML=function(timestring){ //return timestring (ie: 1:56:38) into string of images instead var sections=timestring.split(":") if (sections[0]=="0") //If hour field is 0 (aka 12 AM) sections[0]="12" else if (sections[0]>=13) sections[0]=sections[0]-12+"" for (var i=0; i<sections.length; i++){ if (sections[i].length==1) sections[i]='<img src="'+imageclock.digits[0]+'" />'+'<img src="'+imageclock.digits[parseInt(sections[i])]+'" />' else sections[i]='<img src="'+imageclock.digits[parseInt(sections[i].charAt(0))]+'" />'+'<img src="'+imageclock.digits[parseInt(sections[i].charAt(1))]+'" />' } return sections[0]+'<img src="'+imageclock.digits[12]+'" />'+sections[1]+'<img src="'+imageclock.digits[12]+'" />'+sections[2] } imageclock.display=function(){ var clockinstance=this this.spanid="clockspan"+(imageclock.instances++) document.write('<span id="'+this.spanid+'"></span>') this.update() setInterval(function(){clockinstance.update()}, 1000) } imageclock.display.prototype.update=function(){ var dateobj=new Date() var currenttime=dateobj.getHours()+":"+dateobj.getMinutes()+":"+dateobj.getSeconds() //create time string var currenttimeHTML=imageclock.imageHTML(currenttime)+'<img src="'+((dateobj.getHours()>=12)? imageclock.digits[11] : imageclock.digits[10])+'" />' document.getElementById(this.spanid).innerHTML=currenttimeHTML } </script> <DIV STYLE="position:absolute; top:260px; left:215px; width:109px; height:28px"> <FONT SIZE="+2" COLOR="black"> <TABLE BORDER="0" cellpadding="10" CELLSPACING="0" TOP MARGIN="0"> <TR> <TD WIDTH="109" HEIGHT="28" BACKGROUND="/users/1712/49/18/66/album/clock210.png" VALIGN="top"> <script type="text/javascript"> new imageclock.display() </script> </TD> </TR> </TABLE> </DIV> Much appreciated! This is my first time doing JavaScript I don't what I did wrong here, but the problem its not showing up the current date and time. Code: <script language = "JavaScript" type="text/javascript"> now = new Date(); localtime = now.toString(); utctime = now.GMTString(); document.wite("<b>localtime</b>" + localtime + "</br>"); document.write("<b>utctime</b>" + utctime); </script> This is what supposed to look like I have tried using different browser chrome,IE9,Maxtor, and Opera my OS is Win7 Can someone help me modify this script be set to a specific Time Zone rather than picking up the time from the local machine? I want it to countdown to 6:00 am EST. http://javascript.internet.com/time-...countdown.html Can anyone tell me what to add where if it is possible? Thank you in advance. Hi Script Experts I am facing issue in below code for Brisilia time zone.(GMT-3). Issue comes in October month only. It is going tobig loop. I am not getting how Date object is behaving here. Thanks in advance Pranav Sharma *********************************** <script type="text/javascript"> var nDate; var nCurrentYear = 2011; var nCurrentMonth = 10; nYear=2011; nMonth=10; var date = new Date(nYear, nMonth-1, 1); document.write('Month:'+date.getMonth() +':CurrentMonth:'+nCurrentMonth); while (date.getMonth() == nCurrentMonth-1) { nDate = date.getDate(); document.write(date.toDateString()); date = new Date(nCurrentYear, date.getMonth(), date.getDate()+1); } </script> ********************************** I have this code which converts Fahrenheit to Celsius. Now, I have to have a counter that displays the amount of times I have made a conversion. I have no clue how to do this. This is the initial code:
Code: <html> <head> <script type="text/javascript"> /* Converts given centigrade in one text box to farenheit in another */ function convert1 () { document.getElementById("output").value = document.getElementById("input").value*1.8+32; } </script> </head> <body> <p>Then enter the input and view the output</p> <input type="text" size="15" id="input"> <input type="button" value=" ==> " onclick="convert1()"> <input type="text" size="15" id="output"> </body> </html> I don't know how to approach this so I tried different things.... Code: tml> <head> <script type="text/javascript"> /* Converts given centigrade in one text box to farenheit in another */ function convert1 () { document.getElementById("output").value = document.getElementById("input").value*1.8+32; } function counter() { if (function convert1().onclick==true) {count++;} } </script> </head> <body> <p>Then enter the input and view the output</p> <input type="text" size="15" id="input"> <input type="button" value=" ==> " onclick="convert1()"> <input type="text" size="15" id="output"> </body> </html> but then I did some research and it said I couldn't do that.... so I tried this: Code: <html> <head> <script type="text/javascript"> /* Converts given centigrade in one text box to farenheit in another */ var count=0; function documentClick() { document.getElementById('clicked').value = ++clickCount } document.onclick = documentClick; function convert1 () { document.getElementById("output").value = document.getElementById("input").value*1.8+32; } </script> </head> <body> <p>Then enter the input and view the output</p> <input type="text" size="15" id="input"> <input type="button" value=" ==> " onclick="convert1()"> <input type="text" size="15" id="output"> </body> </html> I think this last code is correct, the problem I have now is that I don't know how to call it to just display as text under the buttons and conversions. I'm looking for some way to display it like ("you have made"+ count+ "conversions");. No boxes or buttons, just text and I don't know how to call for this after the </script>, inside the body. I am new at all this and would appreciate any help. Thanks. It should look like this. Hi guys. I'm trying to make a small bit of scripting that will show the current time, updating once every second. What I need is the following: 1. Multiple timezones or GMT offsets (just put me on the right path, I can code them in, 2. Daylight savings time taken into consideration (only for Australia), adding the 1 hour during the times it is needed, 3. Text to show "Open" and "Closed" during different times (open during 8am to 5pm and closed if not 8am to 5pm.) I have the following code as a start, but I am completely stuck with how to get the rest of what I need! Any help would be appreciated. <h4>Victoria <script type="text/javascript"> <!-- var currentTime = new Date() var hours = currentTime.getHours() var minutes = currentTime.getMinutes() if (minutes < 10){ minutes = "0" + minutes } document.write(hours + ":" + minutes + " ") if(hours > 11){ document.write("PM") } else { document.write("AM") } //--> </script> <script type="text/javascript"> <!-- var currentTime = new Date() var hours = currentTime.getHours() var minutes = currentTime.getMinutes() if (minutes < 10){ minutes = "0" + minutes } if(hours > 11){ document.write("True") } else { document.write("False") } //--> </script> </h4> Cheers in advance. Dale. Hi everyone. New to javascript here.... I have a problem here. I know how to store a cookie and check a cookie... but i don't know how to calculate the time between current visit and previous visit... Example. I logged in @ 1pm and logged in again @ 3pm... It should a msg like "your last visit was 2 hours ago" Can any one enlighten me ? Thank you! hi im using dhtml xgrid where i need to do validation for time ,(from-time and to-time i.e ind==1 and ind==2 ) to-time must be greater than from-time else i need to alert a message to-time must be greater than from-time. can any one send me the code for it time format is[05:00]. Code: var err_str=""; function validate_grid(value,id,ind) { $("#result").html(" ").show(); if(ind==1 || ind==2) { var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/; if(!patt.test(value)) { mygrid.setCellTextStyle(id,ind,"background-color:yellow;"); if(err_str!="") err_str+="\n"+(ind+1)+".Enter numbers and : only.."; else err_str=(ind+1)+".Enter numbers and : only"; return false; } else { mygrid.setCellTextStyle(id,ind,"background-color:white;"); return true; } } } Hi Code: var err_str=""; function validate_grid(value,id,ind) { $("#result").html(" ").show(); if(ind==1 || ind==2) { var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/; if(!patt.test(value)) { mygrid.setCellTextStyle(id,ind,"background-color:yellow;"); if(err_str!="") err_str+="\n"+(ind+1)+".Enter numbers and : only.."; else err_str=(ind+1)+".Enter numbers and : only"; return false; } else { mygrid.setCellTextStyle(id,ind,"background-color:white;"); return true; } } } alert(err-str); here ind==1 is from_time and ind==2 is to_time,i need to validate time as to_time must be always greater than from-time,if condition fails an alert msg should populate.time format is[05:00]as it is in string format im unable to do the validation for it.(ex:from-time=08:00 to-time=07:59 condition fails) thank you. Hello im using dhtmlx grid in this cells i have from time and to time (i.e ind==1 and ind==2) i need to validate time where to-time must be greater than from-time else it should alert an message,i have writeen a normal Regular expression for the time validation.as the time is i string format i.e[05:00],please can any one send me code for that. Code: var err_str=""; function validate_grid(value,id,ind) { if(ind==1 || ind==2) { var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/; if(!patt.test(value)) { mygrid.setCellTextStyle(id,ind,"background-color:yellow;"); if(err_str!="") err_str+="\n"+(ind+1)+".Enter numbers and : only.."; else err_str=(ind+1)+".Enter numbers and : only"; return false; } else { mygrid.setCellTextStyle(id,ind,"background-color:white;"); return true; } } } 1 down vote favorite I do have the countdown script (see link below) to display the time between current time and the date given in real-time. However, I want to achieve to display the time difference between a given start and end time. Right now, it calculates from the current server time to the end time. I want to be able to set up my own start time and end time. Here is what I have: http://jsfiddle.net/BgEtE/ thank you for help hi, can some one help me how to get the time and date difference? given two time and date with the following format like in textbox A: 2011-05-03 17:35:47.0 and textbox B: 2011-05-03 16:35:47.0 then the output would be: 0 days, 1 hour, 0 minutes, 0 seconds regards, verve Hi - I have a date in my javascript like this: Mon Dec 12 00:00:00 UTC+0430 2011 I need to convert it to a date without the offset (the +0430). I actually changed my computer's timezone to generate this offset - we have uses placing orders on our site who don't use UTC and it's throwing our orders out as they need to select a delivery date but it's passing the date with the offset. How do I convert a date to UTC time? Thanks Hi brothers and sisters, My first post here. I am trying to do a self-test system for my small company, everything is going smoothly so far however, I am facing some problem with setting a cut off time for doing the test. For example, my staff could not go in to the system after 8pm. Anyone had any idea on how to do it?? I have only some basic knowledge of php which I learn in school thus setting time limit might be too advance for me thus need you guys help. Thank alot Hi, I have very little JS knowledge, on a scale of 1 - 10 I would give me a 1, so apologies if I have this completely backwards. AIM: I have a form that takes in times a person was doing an activity, and you can enter multiple times & activities in one go. e.g. Person A | Lunch | 12:00 - 13:00 | Meeting | 13:30 - 14:00 I need the JS to validate that Activity B (Meeting in the above example) does not overlap with Activity A (Lunch in the above example). It also needs to check this for all activity's so that none overlap with each other else output error. I have managed to do this server side in PHP and will include the code as it may help show what I am trying to do better than Im explaining. PHP Code Code: $Code = $_POST['code']; $NumberofCodes = count($Code); $Start = array(); $_POST['starthr'] = array_values($_POST['starthr']); $_POST['startmin'] = array_values($_POST['startmin']); $i = 0; foreach($_POST['starthr'] as $key1 => $value1) { $Start[(int)$i] = $_POST['starthr'][$key1] .":". $_POST['startmin'][$key1]; $i++; } $Stop = array(); $_POST['stophr'] = array_values($_POST['stophr']); $_POST['stopmin'] = array_values($_POST['stopmin']); $i = 0; foreach($_POST['stophr'] as $key1 => $value1) { $Stop[(int)$i] = $_POST['stophr'][$key1] .":". $_POST['stopmin'][$key1]; $i++; } $i = 0; $j = 1; while ($i < $NumberofCodes){ while(($j-1) < $NumberofCodes){ if (($Start[$j] > $Start[$i] && $Start[$j] < $Stop[$i]) || ($Stop[$j] > $Start[$i] && $Stop[$j] <= $Stop[$i])) { //Stop form executing and provide error information. } $j++; } $i++; } JS Code (What I could manage) Code: var i = 0; var j = 1; var Start = new Array(); var Stop = new Array(); var aa = new Array(); var bb = new Array(); while (i < counter){ while((j-1) < counter){ Start[i] = document.myform.elements('starthr['+i+']').value + ":" + document.myform.elements('startmin['+i+']').value; Stop[i] = document.myform.elements('stophr['+i+']').value + ":" + document.myform.elements('stopmin['+i+']').value; var a = toDate(Start[i],"h:m") var b = toDate(Stop[i],"h:m") aa[i] = a; bb[i] = b; function toDate(dStr,format) { var now = new Date(); now.setHours(dStr.substr(0,dStr.indexOf(":"))); now.setMinutes(dStr.substr(dStr.indexOf(":")+1)); now.setSeconds(0); return now; } if ((aa[j] > aa[i] && aa[j] < bb[i]) || (bb[j] > aa[i] && bb[j] <= bb[i])) { //Fail validation } else { //Pass Validation } j++; } i++; } Any help on this would great. Thanks Barry Hello everyone... I have Javascript code here which gives the time (hours, minutes, seconds) and date (year, month, day), and it updates every second. What I want to do is redirect to a certain page every 10 minutes, on the 10th, 20th, 30th, 40th, 50th and 60th minutes. The time displays and updates every second, but no redirect happens. Please fix my code! Thanks in advance. Code: <tr><td align="center"> <SPAN ID="clock"><?php echo date('d/m/Y <\b\r> H:i:s', time()); ?></SPAN> </td></tr> <SCRIPT type="text/javascript"> var year2 = <?php echo date('Y', time()); ?>; var month2 = <?php echo date('m', time()); ?>; var day2 = <?php echo date('d', time()); ?>; var hour2 = <?php echo date('H', time()); ?>; var minute2 = <?php echo date('i', time()); ?>; var second2 = <?php echo date('s', time()); ?>; var daysInMonth = <?php echo date('t', time()); ?>; function updateClock() { second2+=1; if(second2>=60){second2=0;minute2+=1;} if(minute2>=60){minute2=0;hour2+=1;} if(hour2>=24){hour2=0;day2+=1;} if(day2>daysInMonth){day2=0;month2+=1;} if(month2>12){month2=0;year2+=1;} byt(nollor(day2)+"/"+nollor(month2)+"/"+year2+"<br />"+nollor(hour2)+":"+nollor(minute2)+":"+nollor(second2),"clock"); updateUtlogg(); redirect(minute2,second2); } var utloggUtloggad = false; function updateUtlogg() { if(utloggUtloggad) { return true; } return(true); } function nollor(nummer) { if(nummer<10) { tmp="0"+nummer; } else { tmp=nummer; } return tmp; } function byt(txt,lager) { if(document.getElementById(lager)) { document.getElementById(lager).innerHTML=txt; } } function redirect(x,y) { if(nollor(x)==0 && nollor(y)==0 || nollor(x)==10 && nollor(y)==0 || nollor(x)==20 && nollor(y)==0 || nollor(x)==30 && nollor(y)==0 || nollor(x)==40 && nollor(y)==0 || nollor(x)==50 && nollor(y)==0) { setTimeout("location.href = updateInterval.php;",0); } } var oInterval = window.setInterval("updateClock()",1000); </SCRIPT> Hello, I am currently working on a site where I need to display the date. The portion I'm working on looks something like this: Yesterday Entries for Today's Date Tomorrow If the user clicks the yesterday link, then that date needs to show. The same goes for the tomorrow link. Otherwise, the current date will show. I have most of the function setup. The problem is I don't know how to check whether or not a link has been clicked. I also need to know how to setup the function within the link. Here's what I have: <a href="#" onclick="javascript: previous(yd);return false">Yesterday</a> The onclick event is supposed to refer back to the function I created to determine what date to display based on which link the user clicks. So my questions a 1) Is my link setup properly to allow the function to run? 2) How can I check to see whether or not a link has been clicked in my function? Any help/suggestions are greatly appreciated!! Thanks in Advance I want to make a javascript clock (using Server time and not user computer time). After searching I have found the code on http://www.elated.com/articles/creat...ascript-clock/ The Code is: PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <style type="text/css"> #clock { font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; color: white; background-color: black; border: 2px solid purple; padding: 4px; } </style> <script type="text/javascript"> <!-- function init ( ) { timeDisplay = document.createTextNode ( "" ); document.getElementById("clock").appendChild ( timeDisplay ); } function updateClock ( ) { var currentTime = new Date ( ); var currentHours = currentTime.getHours ( ); var currentMinutes = currentTime.getMinutes ( ); var currentSeconds = currentTime.getSeconds ( ); // Pad the minutes and seconds with leading zeros, if required currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes; currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds; // Choose either "AM" or "PM" as appropriate var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM"; // Convert the hours component to 12-hour format if needed currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours; // Convert an hours component of "0" to "12" currentHours = ( currentHours == 0 ) ? 12 : currentHours; // Compose the string for display var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay; // Update the time display document.getElementById("clock").firstChild.nodeValue = currentTimeString; } // --> </script> </head> <body onload="updateClock(); setInterval('updateClock()', 1000 )"> <div> <span id="clock"> </span> </div> </body> </html> The problem is that it (the code above) is using the users computer time. (I found (in the comments of http://www.elated.com/articles/creat...ascript-clock/) that I should use: PHP Code: var currentTime = [serverValue goes here]; But I don't really know what should I put in the "serverValue goes here" ..... ) So how can I make this code to use the server time (and not the users time)? Any Suggestion Will Be Helpfull Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <script type="text/javascript"> var info = new Date() var day = info.getDate() var mon = info.getMonth() var year = info.getFullYear() var hour = info.getHours() var min = info.getMinutes() var sec = info.getSeconds() alert(day+","+mon+","+year+","+hour+","+min+","+sec+",") if (day>=22 && mon>=5 && year>=2011 && hour>=12 && min>=00 && sec>=00) { document.write{ <script src="//c.tadst.com/common/fullscreen2.js" type="text/javascript"></script><tr><td id="c1" align="center" valign="middle"><h2 align="center" class=c>Time <span id=el_u1>until</span> SUMMER HOLIDAYS </h2> <div align="center"> <table class=wa> <tbody id=rs3><tr><td><span id=el_d1>7</span> <span id=el_d1t>days</span>, <span id=el_h1>19</span> <span id=el_h1t>hours</span>, <span id=el_m1>58</span> <span id=el_m1t>minutes</span>, <span id=el_s1>18</span> <span id=el_s1t>seconds</span></td></tr></tbody></table> </div> <h2 align="center"><span class="c">that is</span></h2> <p align="center"><script type="text/javascript"> <!-- et=1308231902;function f0(d){return ld[d.getUTCDay()]+','+' '+d.getUTCDate()+'.'+' '+lm[d.getUTCMonth()]+' '+pf(d.getUTCFullYear(),4)+', '+p2(d.getUTCHours())+':'+p2(d.getUTCMinutes())+':'+p2(d.getUTCSeconds());} cks={el:{t:[{o:7200,a:'CEST',d:1}],f:f0,c:{t:1308736800E3}}}; lm=new Array();lm[5]='Juni';ld=new Array();ld[2]='Dienstag';ld[3]='Mittwoch';ld[4]='Donnerstag';//--> </script> </p> <div align="center"> <table class="wa"> <tbody id="rs1"> <tr> <td id="el_d2" class="r dbl">7</td> <td class="dbl"> </td> <td id="el_d2t" class="dbl">days</td> </tr> <tr> <td id="el_h2" class="r dbl">187</td> <td class="dbl"> </td> <td id="el_h2t" class="dbl">hours</td> </tr> <tr> <td id="el_m2" class="r dbl">11275</td> <td class="dbl"> </td> <td id="el_m2t" class="dbl">minutes</td> </tr> <tr> <td id="el_s2" class="r dbl">676517</td> <td class="dbl"> </td> <td id="el_s2t" class="dbl">seconds</td> </tr> </tbody> </table> <script src="//c.tadst.com/common/common21.js?5" type="text/javascript"></script> <script src="//c.tadst.com/common/wcupd8.js?1" type="text/javascript"></script> </div> }; } else { document.write{ <img src="happysummerholiday.jpg" width="285" height="200" /> }; } </script> </body> </html> The Red part is html coding. Doesn't seam to work - please help me. The idea is that after the date (22.06.2011 at 12:00) the content changes to the picture. Thank you in advanced for helping me Hi, There are two text boxes in a HTML form. The first text box takes the time when the user starts to work on a project. The second box takes the time when the user stops working on that project. Now, I would like to calculate the total time worked on that project for that user. That is (stop time - start time). I tried few things without success. Any help will be appreciated. |