|
JavaScript - Problem Coding A Time Countdown
I am new to JavaScript and am enrolled in an introductory class. My assignment is to create JavaScript for a Web page that counts down the time left until several events. I have been working on this code for several hours now, and I have done everything the textbook instructs me to do, yet when I load the Web page I still get blank fields where my countdown info should be.
I would really appreciate it if someone could look through the code I've created and give me some pointers. I have an .htm file and an external .js file. The .htm file is: Code: <html>
<head>
<!--
New Perspectives on JavaScript
Tutorial 2
Review Assignment
Events in Dixon
Author:
Date:
Filename: events.htm
Supporting files: dates.js, dixon.css, logo.jpg
-->
<title>Upcoming Events at Dixon</title>
<link href="dixon.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="dates.js"></script>
<script type="text/javascript">
function showCountdown() {
var today = new Date("December 1, 2007 6:31:45");
var Date1 = new Date("January 14, 2007 10:00:00");
var Date2 = new Date("May 21, 2007 12:00:00");
var Date3 = new Date("July 4, 2007 21:00:00");
var Date4 = new Date("September 1, 2007 12:00:00");
var Date5 = new Date("December 1, 2007 11:30:00");
var Date6 = new Date("December 31, 2007 15:30:00");
document.eventform.thisDay.value = showDateTime(today);
changeYear(today, Date1);
changeYear(today, Date2);
changeYear(today, Date3);
changeYear(today, Date4);
changeYear(today, Date5);
changeYear(today, Date6);
document.eventform.count1.value = countdown(today, Date1);
document.eventform.count2.value = countdown(today, Date2);
document.eventform.count3.value = countdown(today, Date3);
document.eventform.count4.value = countdown(today, Date4);
document.eventform.count5.value = countdown(today, Date5);
document.eventform.count6.value = countdown(today, Date6);
}
</script>
</head>
<body onload="setInterval('showCountdown()',100)">
<form name="eventform" id="eventform" action="">
<div id="links1">
<a href="#">Home</a>
<a href="#">City Services</a>
<a href="#">City Agencies</a>
<a href="#">Mayor's Office</a>
<a href="#">News Today</a>
<a href="#">Upcoming Events</a>
</div>
<div id="logo">
<img src="logo.jpg" alt="New Years Bash" />
</div>
<div id="links2">
<a href="#">Site Map</a>
<a href="#">Search Engine</a>
<a href="#">Public Notices</a>
<a href="#">Survey Form</a>
<a href="#">Contact Us</a>
<a href="#">E-Government</a>
</div>
<div id="main">
<h3>Countdown to Upcoming Events</h3>
<table>
<tr>
<td></td>
<th style="text-align: right">Current Time </th>
<td><input name="thisDay" id="thisDay" readonly="readonly" size="40" /></td>
</tr>
<tr>
<th>Event</th>
<th>Starting Time</th>
<th>Countdown to Event</th>
</tr>
<tr>
<td><input value="Heritage Day" readonly="readonly" size="20" /></td>
<td><input value="Jan 14 at 10:00 am"readonly="readonly" size="20" /></td>
<td><input name="count1" id="count1" size="40" /></td>
</tr>
<tr>
<td><input value="Spring Day Rally" readonly="readonly" size="20" /></td>
<td><input value="May 21 at 12:00 pm"readonly="readonly" size="20" /></td>
<td><input name="count2" id="count2" size="40" /></td>
</tr>
<tr>
<td><input value="July 4th Fireworks" readonly="readonly" size="20" /></td>
<td><input value="Jul 4 at 9:00 pm" readonly="readonly" size="20" /></td>
<td><input name="count3" id="count3" size="40" /></td>
</tr>
<tr>
<td><input value="Summer Bash" readonly="readonly" size="20" /></td>
<td><input value="Sep 1 at 12:00 pm" readonly="readonly" size="20" /></td>
<td><input name="count4" id="count4" size="40" /></td>
</tr><tr>
<td><input value="Holiday Party" readonly="readonly" size="20" /></td>
<td><input value="Dec 1 at 11:30 am" readonly="readonly" size="20" /></td>
<td><input name="count5" id="count5" size="40" /></td>
</tr>
<tr>
<td><input value="New Year's Bash" readonly="readonly" size="20" /></td>
<td><input value="Dec. 31 at 3:30 pm" readonly="readonly" size="20" /></td>
<td><input name="count6" id="count6" size="40" /></td>
</tr>
</table>
</div>
</form>
</body>
</html>
The external .js file is: Code: /*
New Perspectives on JavaScript
Tutorial 2
Review Assignment
Author:
Date:
Function List:
showDateTime(time)
Returns the date in a text string formatted as:
mm/dd/yyyy at hh:mm:ss am
changeYear(today, holiday)
Changes the year value of the holiday object to point to the
next year if it has already occurred in the present year
countdown(stop, start)
Displays the time between the stop and start date objects in the
text format:
dd days, hh hrs, mm mins, ss secs
*/
function showDateTime(time) {
date = time.getDate();
month = time.getMonth()+1;
year = time.getFullYear();
second = time.getSeconds();
minute = time.getMinutes();
hour = time.getHours();
ampm = (hour < 12) ? " am" : " pm";
hour = (hour > 12) ? hour - 12 : hour;
hour = (hour == 0) ? 12 : hour;
minute = minute < 10 ? "0"+minute : minute;
second = second < 10 ? "0"+second : second;
return month+"/"+date +"/"+year+" at "+hour+":"+minute+":"+second+ampm;
}
function changeYear(today, holiday) {
year = today.getFullYear();
holiday.setFullYear(year);
(holiday < today) ? ++year : year;
holiday.setFullYear(year);
}
function countdown(start, stop) {
var time = stop - start;
var days = Math.floor(time/(1000*60*60*24);
var hours = Math.floor(time/1000*60*60);
var minutes = Math.floor(time/1000*60);
var seconds = Math.floor(time/1000);
return days +"days, "+ hours +"hrs, "+ minutes +"mins, "+ seconds +"secs"+;
}
If there is any more information that is needed, I will do my best to give that, as well. Thanks! Similar TutorialsI need help so the specific date & time which the text was saved , appears alongside the text automatically each time a question is asked. It currently just displays the text but NOT DATE OR TIME the text was submitted :/ Thanks a lot in adavance i am just a beginner Here is the coding JSP : Code: <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<body>
<%@ page import="java.util.Vector " %>
Enter a news story here
<form action=Exercise24.jsp method=post>
<textarea name="story" rows=5 cols=100></textarea><br>
<input type=submit value="Save"><br><br>
</form>
All news stories:
<jsp:useBean id="nl" class="newspackage.NewsStore" scope="application"/>
<jsp:setProperty name="nl" property="story"/>
<%
Vector<String> theList = nl.getStories();
%>
<ol>
<%
for (int i=0; i < theList.size(); i++) {
%>
<li> <%= theList.elementAt(i) %> </li>
<%
}
%>
</ol>
</body>
Here is the coding in .java: Code: package newspackage;
import java.util.Vector;
public class NewsStore {
Vector<String> stories = new Vector<String>();
public void setStory(String theNews){
stories.addElement(theNews);
}
public Vector<String> getStories() {
return stories;
}
}
Here is the coding to print the specific time WHICH THE QUESTION WAS ASKED: Code: <%@page contentType="text/html" import="java.util.*" %> <!-- http://www.java-samples.com/jsp --> <html> <body> This question was submitted <%= startTime %>. <br> <%! Date startTime = new Date();%> </body> </html> 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 I hope I hit the topic I have a problem in java script i need it for an online game that I develop but not as I do not go javasript countdown or can help me I need a timer that counts down and ceases to move to the other side but not when Refresh to go back and allow you to set time thanks in advance
hi, i am now playing with the time. can you please tell me how to make the time move in downwards, i mean a countdown like format, e.g the time will start countdown and end in 2 days? here's my initial noob code for creating time Code: <script type="text/javascript">
var today = new Date();
h = today.getHours();
m = today.getMinutes();
s = today.getSeconds();
function showDate(){
if(document.getElementById('but').value = "locked"){
h = checktime(h);
m = checktime(m);
s = checktime(s);
}
document.getElementById('t').innerHTML = h +":"+m+":"+s;
}
function checktime(i){
if(i < 10){
i = "0" + i;
}
return i;
}
function ocl(){
var x = true;
if(x){
document.getElementById('but').value = "locked";
showDate();
}
}
function mo(){
document.getElementById('but').value = "lock me ?";
x = false;
}
</script>
<h3>
<a id="t"></a>
</h3>
<input type="button" id="but" value="unlocked" onmouseover="mo();" onclick="ocl();" />
What im trying to do is have the page auto refresh after the time countdown has expired. Here is the java code for the counter how would it be possible to add a autorefresh after the counter has reached 0 time left. Code: function ulticountdown(time, id, format, keepCounting, zero, langarray){
timeleft = time;
var countUp = false;
if (timeleft < 0) {
if (keepCounting == 0) {
timeleft = 0;
} else {
timeleft *= -1;
countUp = true;
}
}
seconds = timeleft%60;
timeleft -= seconds;
timeleft = timeleft/60;
minutes = timeleft%60;
timeleft -= minutes;
timeleft = timeleft/60;
hours = timeleft%24;
timeleft -= hours;
days = timeleft/24;
var counterstring = '';
if (zero == 1) {
if (seconds < 10) {
seconds = '0'+seconds;
}
if (minutes < 10) {
minutes = '0'+minutes;
}
if (hours < 10) {
hours = '0'+hours;
}
}
if (format == 1) {
if (days != 0) {
if (days != 1) {
counterstring = counterstring+" "+days+" "+langarray[1];
} else {
counterstring = counterstring+" "+days+" "+langarray[0];
}
}
if (hours != 0) {
if (hours != 1) {
counterstring = counterstring+" "+hours+" "+langarray[3];
} else {
counterstring = counterstring+" "+hours+" "+langarray[2];
}
}
if (minutes != 0) {
if (minutes != 1) {
counterstring = counterstring+" "+minutes+" "+langarray[5];
} else {
counterstring = counterstring+" "+minutes+" "+langarray[4];
}
}
if (seconds != 1) {
counterstring = counterstring+" "+seconds+" "+langarray[7];
} else {
counterstring = counterstring+" "+seconds+" "+langarray[6];
}
} else if (format == 2) {
if (days != 0) {
if (days != 1) {
counterstring = counterstring+" "+days+" "+langarray[1];
} else {
counterstring = counterstring+" "+days+" "+langarray[0];
}
}
if (hours != 0) {
if (hours != 1) {
counterstring = counterstring+" "+hours+" "+langarray[3];
} else {
counterstring = counterstring+" "+hours+" "+langarray[2];
}
}
if (minutes != 0) {
if (minutes != 1) {
counterstring = counterstring+" "+minutes+" "+langarray[5];
} else {
counterstring = counterstring+" "+minutes+" "+langarray[4];
}
}
} else if (format == 3) {
if (days != 0) {
if (days != 1) {
counterstring = counterstring+" "+days+" "+langarray[1];
} else {
counterstring = counterstring+" "+days+" "+langarray[0];
}
}
if (hours != 0) {
if (hours != 1) {
counterstring = counterstring+" "+hours+" "+langarray[3];
} else {
counterstring = counterstring+" "+hours+" "+langarray[2];
}
}
} else if (format == 4) {
if (days != 0) {
if (days != 1) {
counterstring = counterstring+" "+days+" "+langarray[1];
} else {
counterstring = counterstring+" "+days+" "+langarray[0];
}
}
} else if (format == 5) {
if (days != 0) {
if (days != 1) {
counterstring = counterstring+" "+days+" "+langarray[1];
} else {
counterstring = counterstring+" "+days+" "+langarray[0];
}
}
counterstring += " "+hours+":"+minutes+":"+seconds;
} else if (format == 6) {
counterstring = days;
}else {
// we should never get here, but for safety add the last one as default case.
if (days != 0) {
if (days != 1) {
counterstring = counterstring+" "+days+" "+langarray[1];
} else {
counterstring = counterstring+" "+days+" "+langarray[0];
}
}
counterstring += " "+hours+":"+minutes+":"+seconds;
}
var newdiv = document.createElement("div");
newdiv.innerHTML = counterstring;
var olddiv = document.getElementById("counter"+id);
var parent = olddiv.parentNode;
parent.removeChild(olddiv);
newdiv.id = "counter"+id;
parent.appendChild(newdiv);
if (countUp == true) {
newtime = time-1;
} else {
newtime = time-1;
}
setTimeout("ulticountdown("+newtime+","+id+","+format+", "+keepCounting+", "+zero+", langarray)",1000);
}
Hey. I'm currently looking for a countdown script, which is based on the server's time. I've only found scripts, that's based on the local computer's time, which means the output of the script changes, when the time on the computer is changed. And I want to make a public announcement which counts down to something - and should output the same at every person. I'm not that familiar with JavaScript, I know some jQuery - if anyone can supply any links or can help me with this, I'd appreciate it. 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. Hello everyone, I am completely new to javascripts. I want to have a count down timer on my webpage. I already found a script, but it does not do everything I want it to do. I couldn't find a script that did everything I need. I need it to do the following things: - Use the time zone GMT+1 - Reset everyday at a specific time - From 15:00 till 17:30: A countdown (so it shows 2 hours and 30 minutes from the start and count's down to 0 (which will be 17:30) - During 15:00 till 17:30 it shows: "The game is playing" - Once it is 17:30 I want it to reset and countdown till the next day 15:00 - From 17:30 till 15:00 next day it says: "The game will start in" So it is actually 2 countdown clocks in one javascript. One countdown from 15:00 to 17:30 (whilst the game is playing) and one directly starting after it from 17:30 till 15:00 next day. But both are displayed on the same spot. The countdown will be in text. No buttons or fancy images etc. Hope you can help me out. Thanks Code: <html>
<head>
<script type = "text/javascript">
function getSeconds() {
var now = new Date();
var time = now.getTime(); // time now in milliseconds
var midnight = new Date(now.getFullYear(),now.getMonth(),now.getDate(),0,0,0); // midnight 0000 hrs
// midnight - change time hh,mm,ss to whatever time required, e.g. 7,50,0 (0750)
var ft = midnight.getTime() + 86400000; // add one day
var diff = ft - time;
diff = parseInt(diff/1000);
if (diff > 86400) {diff = diff - 86400}
startTimer (diff);
}
var timeInSecs;
var ticker;
function startTimer(secs){
timeInSecs = parseInt(secs);
ticker = setInterval("tick()",1000);
tick(); // to start counter display right away
}
function tick() {
var secs = timeInSecs;
if (secs>0) {
timeInSecs--;
}
else {
clearInterval(ticker); // stop counting at zero
//getSeconds(); // and start again if required
}
var hours= Math.floor(secs/3600);
secs %= 3600;
var mins = Math.floor(secs/60);
secs %= 60;
var result = ((hours < 10 ) ? "0" : "" ) + hours + " hours " + ( (mins < 10) ? "0" : "" ) + mins
+ " minutes " + ( (secs < 10) ? "0" : "" ) + secs + " seconds";
document.getElementById("countdown").innerHTML = "The game will start in " + result;
}
</script>
</head>
<body onload = "getSeconds()">
<span id="countdown" style="font-weight: bold;"></span>
</body>
</html>
Reply With Quote 01-07-2015, 10:11 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts First of all, move your JavaScript where it belongs: Just before the </body> tag. Then you don't need stuff such as onload='....' Here's my attempt at it: Code: <!DOCTYP html>
<html>
<head>
<title>Game play starts at 17:30</title>
</head>
<body>
Other stuff...<br/><br/>
<span id="countdown" style="font-weight: bold;"></span>
<br/><br/>Other stuff...<br/><br/>
<script type="text/javascript">
var timer = null;
function tick( )
{
var msg = document.getElementById("countdown");
var now = new Date();
var yr = now.getFullYear(); var mon = now.getMonth(); var dy = now.getDate();
var startat = new Date(yr,mon,dy,15,0,0);
var endat = new Date(yr,mon,dy,17,30,0);
if ( now.getTime() < startat.getTime() )
{
msg.innerHTML = "The game will start at 17:30";
} else if ( now.getTime() > endat.getTime() )
{
msg.innerHTML = "The game started at 17:30";
} else {
var sec = Math.floor( ( endat.getTime() - now.getTime() ) / 1000 );
var min = Math.floor ( sec / 60 );
sec %= 60;
var hr = Math.floor ( min / 60 );
min %= 60;
if ( min < 10 ) min = "0" + min;
if ( sec < 10 ) sec = "0" + sec;
msg.innerHTML = "The game will start in " + hr + ":" + min + ":" + sec;
}
}
tick(); // immediate start
timer = setInterval( tick, 1000 ); // every second
</script>
</body>
</html>
Thread duplicated see one above!
Code: <script language="JavaScript"> TargetDate = "12/5/2009 12:00 PM"; BackColor = "grey"; ForeColor = "white"; CountActive = true; CountStepper = -1; LeadingZero = true; DisplayFormat = "%%D%% Days, %%H%% Hours, %%M%% Minutes, %%S%% Seconds."; FinishMessage = "Its finally here"; </script> <script language="JavaScript" src="http://scripts.hashemian.com/js/countdown.js"></script> i found this code on a website. it is a countdown timer. and i wanted to put it on a forum. but i think there will be a problem when others view it.. i think that other people from different time zones will see the time countdown different times.. is there a way to include a specific time zone (i.e. mine?) in this code? BTW its suppose to go to December 5, 2009. i am in GMT-6 Central Time. Hi, Im looking for a simple script or solution that will allow a timer to count down 48hrs from a set time of the day and then after that reset and start the process again. For Example: Order within 23 hours 6 minutes for Delivery Tommorow The problem I have got is im not sure how to create a timer that does not reset every time you refresh the browser etc. Any hep would be great as im stumped with this one! Thanks I have a javascript countdown clock in my camping page on my website www.bsatroop459.org. It works on IE7 and IE8 but it will not work on Firefox. Could somebody give me a clue as why my countdown clock will not work in Firefox. The is a white box I can't seem to get rid of! <script language="JavaScript"> CountActive = true; DisplayFormat = "%%D%% Days, %%H%% Hours, %%M%% Minutes, and %%S%% Seconds"; </script><script language="JavaScript" type="text/javascript"> <!-- function calcage(secs, num1, num2) { s = ((Math.floor(secs/num1))%num2).toString(); if (s.length < 2) s = "0" + s; return s; } function CountBack(secs) { DisplayStr = DisplayFormat.replace(/%%D%%/g, calcage(secs,86400,100000)); DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs,3600,24)); DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs,60,60)); DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs,1,60)); document.getElementById("cntdwn").innerHTML = DisplayStr; if (CountActive) setTimeout("CountBack(" + (secs-1) + ")", 990); } function putspan(backcolor, forecolor) { document.write("<span id='cntdwn' style='background-color:" + backcolor + "; color:" + forecolor + "'></span>"); } if (typeof(BackColor)=="undefined") BackColor = "white"; if (typeof(ForeColor)=="undefined") ForeColor= "black"; if (typeof(TargetDate)=="undefined") TargetDate = "6/13/2011 9:00 AM"; if (typeof(DisplayFormat)=="undefined") DisplayFormat = "%%D%% Days, %%H%% Hours, %%M%% Minutes, %%S%% Seconds."; if (typeof(CountActive)=="undefined") CountActive = true; putspan(BackColor, ForeColor); var dthen = new Date(TargetDate); var dnow = new Date(); ddiff = new Date(dthen-dnow); gsecs = Math.floor(ddiff.valueOf()/1000); CountBack(gsecs); //--> </script> <!-- comment out below for the clock --> <form name="clock_form"> <tr><td align="center" bgcolor="maroon"><font color="yellow" face="Arial, Helvetica, sans-serif"><b>Countdown to Bartle Summer Camp 2011</b> </font></td></tr> <tr> <td align="center"><input type="text" name="clock" size="60"></a></td></tr> </form> <!-- end of comment out area --> Thank you for your time. Mike OK well one I have tried to contact the author of this application and he no longer writes or supports it and I know nothing about javascript... so here I am BEGGING FOR HELP!!! any body will to give this a go would love to try anything here is my problem the timer is self works fine but since new updates (RECENT) in Chrome and Firefox when you move away from the window it stop the count then when you come back to it the count starts again I dont want the count to stop any ideas would be great Code: window.onload=progressBarInit;
// Timer Bar - Version 1.0
// Author: Brian Gosselin of http://scriptasylum.com
var loadedcolor='<?php echo $gSurfLoadColour; ?>' ; // PROGRESS BAR COLOR
var unloadedcolor='<?php echo $gSurfUnloadColour; ?>'; // COLOR OF UNLOADED AREA
var bordercolor='<?php echo $gSurfLoadBoardColour; ?>'; // COLOR OF THE BORDER
var barheight=15; // HEIGHT OF PROGRESS BAR IN PIXELS
var barwidth=190; // WIDTH OF THE BAR IN PIXELS
var waitTime=<?php echo $gSurfTimer - $members_time_deduct; ?>; // NUMBER OF SECONDS FOR PROGRESSBAR
// THE FUNCTION BELOW CONTAINS THE ACTION(S) TAKEN ONCE BAR REACHES 100%.
// IF NO ACTION IS DESIRED, TAKE EVERYTHING OUT FROM BETWEEN THE CURLY BRACES ({})
// BUT LEAVE THE FUNCTION NAME AND CURLY BRACES IN PLACE.
// PRESENTLY, IT IS SET TO DO NOTHING, BUT CAN BE CHANGED EASILY.
// TO CAUSE A REDIRECT TO ANOTHER PAGE, INSERT THE FOLLOWING LINE:
// window.location="http://redirect_page.html";
// JUST CHANGE THE ACTUAL URL OF COURSE :)
//*****************************************************//
//********** DO NOT EDIT BEYOND THIS POINT **********//
//*****************************************************//
var ns4=(document.layers)?true:false;
var ie4=(document.all)?true:false;
var blocksize=(barwidth-2)/waitTime/10;
var loaded=0;
var PBouter;
var PBdone;
var PBbckgnd;
var Pid=0;
var txt='';
if(ns4){
txt+='<table border=0 cellpadding=0 cellspacing=0><tr><td>';
txt+='<ilayer name="PBouter" visibility="hide" height="'+barheight+'" width="'+barwidth+'">';
txt+='<layer width="'+barwidth+'" height="'+barheight+'" bgcolor="'+bordercolor+'" top="0" left="0"></layer>';
txt+='<layer width="'+(barwidth-2)+'" height="'+(barheight-2)+'" bgcolor="'+unloadedcolor+'" top="1" left="1"></layer>';
txt+='<layer name="PBdone" width="'+(barwidth-2)+'" height="'+(barheight-2)+'" bgcolor="'+loadedcolor+'" top="1" left="1"></layer>';
txt+='</ilayer>';
txt+='</td></tr></table>';
}else{
txt+='<div id="PBouter" style="position:relative; visibility:hidden; background-color:'+bordercolor+'; width:'+barwidth+'px; height:'+barheight+'px;">';
txt+='<div style="position:absolute; top:1px; left:1px; width:'+(barwidth-2)+'px; height:'+(barheight-2)+'px; background-color:'+unloadedcolor+'; font-size:1px;"></div>';
txt+='<div id="PBdone" style="position:absolute; top:1px; left:1px; width:0px; height:'+(barheight-2)+'px; background-color:'+loadedcolor+'; font-size:1px;"></div>';
txt+='</div>';
}
function incrCount(){
window.status="<?php echo $gSurfWStatusCD; ?>";
loaded++;
if(loaded<0)loaded=0;
if(loaded>=waitTime*10){
clearInterval(Pid);
loaded=waitTime*10;
setTimeout('hidebar()',100);
}
resizeEl(PBdone, 0, blocksize*loaded, barheight-2, 0);
//alert((waitTime+1)-Math.ceil(loaded/10));
tempcnt = (waitTime+1)-Math.ceil(loaded/10);
document.getElementById('count').innerHTML=tempcnt;
}
function breaker_bar() {
parent.np=1;
parent.framesBreaking(false);
return true;
}
function wrong() {
parent.wsftpaw.location.replace('../index.php?_w=wrong_button');
}
function submitform(id) {
parent.np=1;
parent.framesBreaking(false);
document.surfform.cl.value=id;
document.surfform.submit();
}
function hidebar(){
document.getElementById('count').innerHTML=0;
window.status='<?php echo $gSurfWStatusEnd; ?>';
switchDiv('counter', false,0);
switchDiv('buttons', true,0);
}
//THIS FUNCTION BY MIKE HALL OF BRAINJAR.COM
function findlayer(name,doc){
var i,layer;
for(i=0;i<doc.layers.length;i++){
layer=doc.layers[i];
if(layer.name==name)return layer;
if(layer.document.layers.length>0)
if((layer=findlayer(name,layer.document))!=null)
return layer;
}
return null;
}
function progressBarInit(){
PBouter=(ns4)?findlayer('PBouter',document):(ie4)?document.all['PBouter']:document.getElementById('PBouter');
PBdone=(ns4)?PBouter.document.layers['PBdone']:(ie4)?document.all['PBdone']:document.getElementById('PBdone');
resizeEl(PBdone,0,0,barheight-2,0);
if(ns4)PBouter.visibility="show";
else PBouter.style.visibility="visible";
Pid=setInterval('incrCount()',95);
//Load the rest of the pages, loading sequence system
Here is yet another project of mine...ive got most done but the timers are working in milliseconds and the hours, minutes, and seconds arent working right. heres the code. THE .JS FILE Code: /* Function List:
showDateTime(time)
Returns the date in a text string formatted as:
mm/dd/yyyy at hh:mm:ss am
changeYear(today, holiday)
Changes the year value of the holiday object to point to the
next year if it has already occurred in the present year
countdown(stop, start)
Displays the time between the stop and start date objects in the
text format:
dd days, hh hrs, mm mins, ss secs
*/
function showDateTime(time) {
date = time.getDate();
month = time.getMonth()+1;
year = time.getFullYear();
second = time.getSeconds();
minute = time.getMinutes();
hour = time.getHours();
ampm = (hour < 12) ? " am" : " pm";
hour = (hour > 12) ? hour - 12 : hour;
hour = (hour == 0) ? 12 : hour;
minute = minute < 10 ? "0"+minute : minute;
second = second < 10 ? "0"+second : second;
return month+"/"+date +"/"+year+" at "+hour+":"+minute+":"+second+ampm;
}
function changeYear(today, holiday){
year = today.getFullYear();
holiday.setFullYear(year);
(holiday < today) ? year++ : year;
holiday.setFullYear(year);
}
function countdown(start, stop) {
time = stop - start;
days = Math.floor(time/1000*60*60*24);
hours = (days - Math.floor(days))*24;
minutes = (hours - Math.floor(hours))*60;
seconds = (minutes - Math.floor(minutes))*60;
return days + " days," + hours + "hours," + minutes + " mins," + seconds + "secs";
}
THE HTML FILE.. Code: <script type="text/javascript" src="dates1.js"></script>
<script type="text/javascript">
function showCountdown() {
var today = new Date();
var Date1 = new Date("January 14, 2007 10:00:00");
var Date2 = new Date("May 21, 2007 12:00:00");
var Date3 = new Date("July 4, 2007 21:00:00");
var Date4 = new Date("September 1, 2007 12:00:00");
var Date5 = new Date("December 1, 2007 11:30:00");
var Date6 = new Date("December 31, 2007 15:30:00");
document.eventform.thisDay.value = showDateTime(today);
changeYear(today, Date1);
changeYear(today, Date2);
changeYear(today, Date3);
changeYear(today, Date4);
changeYear(today, Date5);
changeYear(today, Date6);
document.eventform.count1.value = countdown(today, Date1);
document.eventform.count2.value = countdown(today, Date2);
document.eventform.count3.value = countdown(today, Date3);
document.eventform.count4.value = countdown(today, Date4);
document.eventform.count5.value = countdown(today, Date5);
document.eventform.count6.value = countdown(today, Date6);
}
</script>
</head>
<body onload="setInterval('showCountdown()' ,100)">
yes ive done all the coding just cant figure out why the timers wont work correctly. Hello everybody, I have a nice search engine but its seems i can't put it twice on the same page: Code: <script language="JavaScript">
function startSearch(){
searchString = document.searchForm.searchText.value;
if(searchString != ""){
searchEngine = document.searchForm.whichEngine.selectedIndex + 1;
finalSearchString = "";
if(searchEngine == 1){
finalSearchString = "http://www.altavista.digital.com/cgi-bin/query?pg=q&what=web&fmt=.&q=" + searchString;
}
if(searchEngine == 2){
finalSearchString = "http://av.yahoo.com/bin/query?p=" + searchString + "&hc=0&hs=0";
}
if(searchEngine == 3){
finalSearchString = "http://www.excite.com/search.gw?trace=a&search=" + searchString;
}
if(searchEngine == 4){
finalSearchString = "http://www.hotbot.com/?SW=web&SM=MC&MT=" + searchString + "&DC=10&DE=2&RG=NA&_v=2&act.search.x=89&act.search.y=7";
}
if(searchEngine == 5){
finalSearchString = "http://www.infoseek.com/Titles?qt=" + searchString + "&col=WW&sv=IS&lk=noframes&nh=10";
}
if(searchEngine == 6){
finalSearchString = "http://www.lycos.com/cgi-bin/pursuit?adv=%26adv%3B&cat=lycos&matchmode=and&query=" + searchString + "&x=45&y=11";
}
if(searchEngine == 7){
finalSearchString = "http://netfind.aol.com/search.gw?search=" + searchString + "&c=web&lk=excite_netfind_us&src=1";
}
location.href = finalSearchString;
}
}
// -->
</script>
<basefont face="Verdana, Arial, sans-serif">
<form name="searchForm">
<table width=320 border cellpadding=3 cellspacing=2 bgcolor=444444>
<tr>
<td bgcolor=lightblue><font size=1 face="Verdana, Arial, sans-serif">Search for:<br>
<td bgcolor=lightblue><font size=1 face="Verdana, Arial, sans-serif">Search from:
<td bgcolor=lightblue>
<tr>
<td bgcolor=navajowhite><input style="background: dddddd" name="searchText" type="text">
<td bgcolor=navajowhite>
<select style="background: dddddd" name="whichEngine">
<option selected>Altavista
<option>Yahoo!
<option>Excite
<option>Hotbot
<option>Infoseek
<option>Lycos
<option>AOL Netfind
</select>
<td bgcolor=navajowhite><input type="button" value="Send" onClick="startSearch()">
</select>
</table>
</form>
Can someone tell me how to put the code twice in the html page without creating a conflict as a result of identical codes? Ok, with a little help I was able to write up this script, but whenever I put it onto my page it will not show up. Any idea on what I need to add? Code: <head>
<!-- stylesheets -->
<link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/style.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/slide.css" type="text/css" media="screen" />
<!-- PNG FIX for IE6 -->
<!-- http://24ways.org/2007/supersleight-transparent-png-in-ie6 -->
<!--[if lte IE 6]>
<script type="text/javascript" src="http://alig.mezoka.com/slider/js/pngfix/supersleight-min.js"></script>
<![endif]-->
<!-- jQuery - the core -->
<script src="http://alig.mezoka.com/slider/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<!-- Sliding effect -->
<script src="http://alig.mezoka.com/slider/js/slide.js" type="text/javascript"></script>
</head>
</body>
<!-- BEGIN switch_user_login_form_header -->
<!-- Panel -->
<div id="toppanel">
<div id="panel">
<div class="content clearfix">
<div class="left">
<!-- Login Form -->
<form class="clearfix" action="http://www.roleplayandwritinghaven.com/login.forum?connexion" method="post">
<h1>Member Login</h1>
<label class="grey" for="log">Username:</label>
<input class="field" type="text" name="username" id="log" value="" size="23" />
<label class="grey" for="pwd">Password:</label>
<input class="field" type="password" name="password" id="pwd" size="23" />
<label>Log me on automatically at each visit: <input name="autologin" checked="checked" type="checkbox"></label>
<div class="clear"></div>
<input type="submit" name="submit" value="Login" class="bt_login" />
<a class="lost-pwd" href="#">Lost your password?</a>
</form>
</div>
<div class="left right">
<!-- Register Form -->
<form action="http://www.roleplayandwritinghaven.com/profile.forum?mode=register" method="post">
<h1>Not a member yet? Sign Up!</h1>
<label class="grey" for="signup">Username:</label>
<input class="field" type="text" name="signup" id="signup" value="" size="23" />
<label class="grey" for="email">Email:</label>
<input class="field" type="text" name="email" id="email" size="23" />
<label>A password will be e-mailed to you.</label>
<input type="submit" name="submit" value="Register" class="bt_register" />
</form>
</div>
</div>
</div> <!-- /login -->
<!-- The tab on top -->
<div class="tab">
<ul class="login">
<li class="left"> </li>
<li>Hello Guest!</li>
<li class="sep">|</li>
<li id="toggle">
<a id="open" class="open" href="#">Log In | Register</a>
<a id="close" style="display: none;" class="close" href="#">Close Panel</a>
</li>
<li class="right"> </li>
</ul>
</div> <!-- / top -->
</div> <!--panel -->
<!-- END switch_user_login_form_header -->
</body>
Hi everyone I'm having a hard time, wrapping my head around an array sort+combine function. I have an array which would look somewhat (these are simplified numbers) like this Code: TestArray = [ ["222222","1"], ["222222","1"], ["222222","1"], ["333333","1"] ["111111","1"], ["000000","2"], ["111111","2"], ["111111","2"], ["222222","20"], ]; I got it as far as to be sorted like this: Code: SortedArray = [ ["000000","2"], ["111111","1"], ["111111","2"], ["111111","2"], ["222222","1"], ["222222","1"], ["222222","20"], ["222222","1"], ["333333","1"] ]; And from there to this: Code: BadlyMergedArray = [ ["000000","2"], ["111111,"1","2"], ["222222","1","20","1"], ["333333","1"] ]; But I want to end up with this: Code: MergedArray = [ ["000000","2"], ["111111","1","2"], ["222222","1","20"], ["333333","1"] ]; So the first part of the inner arrays is the first item to be sorted and combined by. After that, the smaller numbers have to do practically the same, while staying in the correct order under the first sort. I'm only a spare time programmer, and my code is probably one of the most confusing pieces of code ever written. I am assuming that this is some fairly easy stuff for one of you guys. I can post my code, but I think there's a much easier solution to it, so I wanted to see if someone can point me in the right direction, or show me how this is properly done. Thanks so much! here's to hoping! patrick/shootingpandas I wanted to make script that will work fine with pictures. For example if its 21:21 there are pictures of those numbers instead of normal mechanic numbers. I tested this code: Code: <script type="text/javascript">
function Time() {
var Date1=new Date()
var Hours1=Datum.getHours()
var Minutes1=Datum.getMinutes()
if (Hours1==21 & Minutes1==12)
document.write("<img src='http://img839.imageshack.us/img839/2383/47819853.png'" + "<img src='http://img714.imageshack.us/img714/9003/asdadajy.png'" + "<img src='http://img210.imageshack.us/img210/2020/34813695.png'")
}
</script>
And have this: Code: <button type="button" onClick="vreme()">Click</button> That work fine for time 21:12 but if i want to work for all pictures i will ahve to write different code like: if ... elseif... elseif... And plenty of those codes which is totaly wrong. What should I do? Hello everybody I am new here and my English is not very good, sorry. I hope this post is in the correct forum.Thank you in advance for helping me out. I am from the netherlands and we are having a problem with a script. I will explain a few things so everything is clear for you. We are a member from a website: www.onderdelenzoeker.nl Through this website customers can ask for used carparts. If we have these parts in stock we can send the customers an email trough this website. (we are loggin in at leden.onderdelenzoeker.nl) We don't have a regular stock and price so every email we send is unique. That is why we are using this script. When we are sending a customer an email, this script will put the parts in our webshop with the prices. The customer will get an email with a unique link and can order the parts and pay trough the internet. But now the problem , this script won't work the first time. If we fill in a form and send it the first time the script won't work (the customer is getting an email but without the link and the parts are not in the webshop). If we fill in the same form a second time and send it the script is working and the customer is getting an email with a link and the parts are in the shop. Now the script is working in IE and we are using Trixie (is the same like greasemonkey is for FF) I hope I have written down all the information you need. And I hope there is somebody who can help me out. Thank you for your time and effort. Nicole This is the script: PHP Code: // ==UserScript== // @name onderdelenzoeker.nl Extractor for ie // @namespace http://www.autodemontage-wlubbers.nl // @description Adds products to the autodemontage-wlubbers.nl webshop width the information form the onderdelenzoeker.nl website when a users request a product. // @date 09.05.2011 // @version 1.0.2 // @require http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js // @include http://leden.onderdelenzoeker.nl/* // ==/UserScript== var merk; var model; var bouwjaar; var base_url = 'http://www.autodemontage-wlubbers.nl/shop/admin/services.php?action='; $(document).ready(function(){ setTimeout('replace_button()',500); }); replace_button = function(){ if($('.info').find('td:eq(7)').length!=0){ merk = $('.info').find('td:eq(7)').html().split(' ')[0]; model = $('.info').find('td:eq(10)').html(); bouwjaar = $('.info').find('td:eq(13)').html().replace(/[^A-Za-z0-9 .]/,''); $('.info:eq(4)').find('button').after('<input type="button" class="button" onclick="addProjectToShop();" style="width:100%" value="Verstuur gegevens naar aanvrager" />'); $('.info:eq(4)').find('button:eq(0)').remove(); $('body').after('<iframe style="display:none;" id="sendFrame" />'); $('#sendFrame').attr('src',base_url+'login&pass=q6pk4mcn5kzy5hppg0bcq'); } setTimeout('replace_button()',1000); } addProjectToShop = function (){ $('body').after('<div style="position:fixed;top:'+(window.innerHeight/2-100)+';left:'+(window.innerWidth/2-200)+';width:400px;height:200px;border:1px solid black;background:white;" id="loadingFrame" ><h1>Sending...</h1></div>'); var length = 10; var sPassword = ""; for (i=0; i < length; i++) { numI = getRandomNum(); while (checkPunc(numI)) { numI = getRandomNum(); } sPassword = sPassword + String.fromCharCode(numI); } var int_ = 200; $('.info:eq(4)').find('label').each(function(){ var parent = $(this).parent().parent().parent(); if(parent.find('input:eq(0)').attr('checked')) { setTimeout('$(\'#sendFrame\').attr(\'src\',\''+base_url+'addProduct&pass=q6pk4mcn5kzy5hppg0bcq&code='+sPassword+'&merk='+merk+'&model='+model+'&bouwjaar='+bouwjaar+'&item='+$(this).html()+'&prijs='+parent.find('input:eq(1)').val()+'&statiegeld='+parent.find('input:eq(2)').val()+'&verzendkosten='+$('#verzendkosten').val()+'&garantie='+parent.find('select option:selected').text()+'\');',int_); int_ = int_ + 200; } }); setTimeout('$(\'#sendFrame\').attr(\'src\',\''+base_url+'logout\');',int_); $('textarea').val($('textarea').val()+"\nU kunt de producten via onze webshop bestellen.\nKlik of kopieer de onderstaande link in uw browser.\nhttp://www.autodemontage-wlubbers.nl/shop/index.php?route=product/product/refcode&refcode="+sPassword); setTimeout('$(\'#loadingFrame\').remove();$(\'#sendFrame\').remove();validate_and_submit();',4000); return false; } getRandomNum = function () { var rndNum = Math.random() rndNum = parseInt(rndNum * 1000); rndNum = (rndNum % 94) + 33; return rndNum; } checkPunc = function (num) { if ((num >=33) && (num <=47)) { return true; } if ((num >=58) && (num <=64)) { return true; } if ((num >=91) && (num <=96)) { return true; } if ((num >=123) && (num <=126)) { return true; } return false; } 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. |
|||||||