/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Time Block overlap function

Copy linkTweet thisAlerts:
Oct 22.2009

I’m trying to create a function that will check the start/end times
of two periods to see if there is a conflict with a scheduling program.

For example:
Period 1 – 8:00 to 9:00 and Period 2 – 9:00 to 10:00 would be OK
Period 1 – 8:00 to 10:00 and Period 2 – 9:00 to 10:00 would be BAD
Period 1 – 8:30 to 9:30 and Period 2 – 9:00 to 10:00 would be BAD

My “CheckTimeConflict()” function does not work correctly. 😡

Is the function correctable
or should I write a completely different check using DATE/TIME formats?

Here’s what I’ve got so far:

[code]
<html>
<head>
<title>Time Block Checks</title>

<script type=”text/javascript”>
function CheckTimeConflict(frm) {
var STa = frm.stA.value*60; // convert to seconds
var ETa = frm.etA.value*60-1;
var STb = frm.stB.value*60;
var ETb = frm.etB.value*60-1;
var act = 0;
var Status = ”; // Different
if (STa == STb) { act = 1; } // Same
if ((ETa >= STb) && (STa >= STb)) { act = 2 } // Overlap (A within B)
if ((STa >= STb) && (STa <= ETb)) { act = 3 } // Overlap (A within B)
switch (act) {
case 1: Status = ‘BAD: STa == STb’; break;
case 2: Status = ‘BAD: (ETa > STb) && (STa >= STb)’; break;
case 3: Status = ‘BAD: (STa >= STb) && (STa <= ETb)’; break;
default:Status = ‘OK’; break;
}
alert(‘Block A: ‘+STa+’ –> ‘+ETa+’n Block B: ‘+STb+’ –> ‘+ETb+’nStatus: ‘+Status);
}
function SetSame(frm) {
frm.stA.value=’8′;
frm.etA.value=’9′;
frm.stB.value=’8′;
frm.etB.value=’9′;
}
function SetDiff(frm) {
frm.stA.value=’8′;
frm.etA.value=’9′;
frm.stB.value=’9′;
frm.etB.value=’10’;
}
function SetOver(frm) {
frm.stA.value=’8′;
frm.etA.value=’10’;
frm.stB.value=’9′;
frm.etB.value=’11’;
}
</script>
</head>
<body>
<form onsubmit=”return false”>
Block A START time:
<select name=”stA”>
<option value=”8″ selected>8:00 am</option>
<option value=”8.5″>8:30 am</option>
<option value=”9″>9:00 am</option>
<option value=”9.5″>9:30 am</option>
<option value=”10″>10:00 am</option>
<option value=”10.5″>10:30 am</option>
<option value=”11″>11:00 am</option>
<option value=”11.5″>11:30 am</option>
<option value=”12″>12:00 pm</option>
</select>
END time:
<select name=”etA”>
<option value=”8″>8:00 am</option>
<option value=”8.5″>8:30 am</option>
<option value=”9″ selected>9:00 am</option>
<option value=”9.5″>9:30 am</option>
<option value=”10″>10:00 am</option>
<option value=”10.5″>10:30 am</option>
<option value=”11″>11:00 am</option>
<option value=”11.5″>11:30 am</option>
<option value=”12″>12:00 pm</option>
<option value=”12.5″>12:30 pm</option>
<option value=”13″>1:00 pm</option>
<option value=”13.5″>1:30 pm</option>
</select>

<br>

Block B START time:
<select name=”stB”>
<option value=”8″>8:00 am</option>
<option value=”8.5″>8:30 am</option>
<option value=”9″ selected>9:00 am</option>
<option value=”9.5″>9:30 am</option>
<option value=”10″>10:00 am</option>
<option value=”10.5″>10:30 am</option>
<option value=”11″>11:00 am</option>
<option value=”11.5″>11:30 am</option>
<option value=”12″>12:00 pm</option>
</select>
END time:
<select name=”etB”>
<option value=”8″>8:00 am</option>
<option value=”8.5″>8:30 am</option>
<option value=”9″>9:00 am</option>
<option value=”9.5″>9:30 am</option>
<option value=”10″ selected>10:00 am</option>
<option value=”10.5″>10:30 am</option>
<option value=”11″>11:00 am</option>
<option value=”11.5″>11:30 am</option>
<option value=”12″>12:00 pm</option>
<option value=”12.5″>12:30 pm</option>
<option value=”13″>1:00 pm</option>
<option value=”13.5″>1:30 pm</option>
</select>
<p>
</form>
<input type=”radio” name=”setTimes” onclick=”SetDiff(this.form)”> Different
<input type=”radio” name=”setTimes” onclick=”SetSame(this.form)”> Same
<input type=”radio” name=”setTimes” onclick=”SetOver(this.form)”> Overlap
<br>
<button onclick=”CheckTimeConflict(this.form)”>Check Conflict</button>
</form>
</body>
</html>
[/code]

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@rnd_meOct 22.2009 — my act=4 seems ok for catching your act2+3:


[COLOR="Red"]EDIT: wait, i'm only half way...[/COLOR]

[B]edit2[/B]: hmm, seems to actually work, don't know why...

[CODE]
 if (STa == STb) { act = 1; } // Same
if ((ETa >= STb) && (STa >= STb)) { act = 2 } // Overlap (A within B)
if ((STa >= STb) && (STa <= ETb)) { act = 3 } // Overlap (A within B)
if (STb <= ETa) { act = 4 } // OverlapDD (B before A ended)
switch (act) {
case 1: Status = 'BAD: STa == STb'; break;
case 2: Status = 'BAD: (ETa > STb) && (STa >= STb)'; break;
case 3: Status = 'BAD: (STa >= STb) && (STa <= ETb)'; break;
case 4: Status = 'BAD: (B before A ended)'; break;
default:Status = 'OK'; break;
}
[/CODE]
you may want to allow back-to-back booking, my formula needs a 1 min break.

this would entail a separate case for "same".

a detector of (STb < ETa) for overlap, and (STb == ETa) for same...


[B]

edit3[/B]

another approach, which has to be foolproof:

tested ff3.5, ie8
[CODE]//status:
var ok=true;

//default overlaps:
STa=480;ETa=599;
STb=549;ETb=659;

//build array of "used" mins of a:
var totMins = ETa - STa;
var usedSlots=Array(totMins).join(",1").split(",");
var usedA=Array(STa).concat(usedSlots);

//check b for any hits in usedA:
if(usedA[STb] || usedA[ETb]){ok=false;}

alert(ok)//false[/CODE]
Copy linkTweet thisAlerts:
@JMRKERauthorOct 22.2009 — ...

you may want to allow back-to-back booking, my formula needs a 1 min break.

this would entail a separate case for "same".

a detector of (STb < ETa) for overlap, and (STb == ETa) for same...

...[/QUOTE]
That was the reason for the set-up conditions below, where I reduce the duration by 1 minute:
[CODE]function CheckTimeConflict(frm) {
var STa = frm.stA.value*60; // convert to seconds
var ETa = frm.etA.value*60-1;
var STb = frm.stB.value*60;
var ETb = frm.etB.value*60-1;
[/CODE]

Thanks, I'll try these suggestions and incorporate the best into my problems.

Appreciate the expertise here and in PMs.
Copy linkTweet thisAlerts:
@svidgenOct 22.2009 — Is this issue resolved?
Copy linkTweet thisAlerts:
@JMRKERauthorOct 22.2009 — Pretty much resolved.

I plan on changing:

1. The parameter passing to the function so that it is not so dependent on hard-code

and be able to use it in another project I building.

2. Other cosmetic changes in project program.

(Thanks to 'rnd_me'): Here's what I'm testing with at this point.

Note, most of script is test set-up and CSS. Actual test function used is somewhat short.
<i>
</i>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Time Block Checks&lt;/title&gt;
&lt;style type="text/css"&gt;
* { margin:0px; padding:0px; }
.graphic { width:500px; height:300px; position:relative; border:1px solid red; }
.Times { width:100px; height:300px; position:absolute; top:0px; left:400px;
border-left:1px solid red; padding: 0px 4px; font-size: 1em;}
.period { width:200px; height:60px; position:absolute; border:1px solid blue; background-color:orange; }
#BlkA { top:0px; left:0px; height:2.5em; }
#BlkB { top:2.5em; left:200px; height:2.5em; }
&lt;/style&gt;

&lt;script type="text/javascript"&gt;
function CheckTimeConflict(frm) {
var STa = frm.stA.value*60; // convert to seconds
var ETa = frm.etA.value*60-1;
var STb = frm.stB.value*60;
var ETb = frm.etB.value*60-1;
var act = 0;
var Status = ''; // Different (A before B)
// if (ETb &lt;= STa) { act = 0 } // Different (B before A)

// From suggestion on: http://www.webdeveloper.com/forum/showthread.php?p=1043052#post1043052
if (STa == STb) { act = 1; } // Same
if ((ETa &gt;= STb) &amp;&amp; (STa &gt;= STb)) { act = 2 } // Overlap (A within B)
if ((STa &gt;= STb) &amp;&amp; (STa &lt;= ETb)) { act = 3 } // Overlap (A within B)
if (STb &lt;= ETa) { act = 4 } // OverlapDD (B before A ended)
if (ETb &lt;= STa) { act = 0 } // Different (B before A) NOTE CHANGE IN TEST ORDER
switch (act) {
case 1: Status = 'BAD: STa == STb'; break;
case 2: Status = 'BAD: (ETa &gt; STb) &amp;&amp; (STa &gt;= STb)'; break;
case 3: Status = 'BAD: (STa &gt;= STb) &amp;&amp; (STa &lt;= ETb)'; break;
case 4: Status = 'BAD: Conflicts)'; break;
default:Status = 'OK'; break;
}
alert('Block A: '+STa+' --&gt; '+ETa+'n Block B: '+STb+' --&gt; '+ETb+'nStatus: '+Status);
}

function SetSame(frm) {
frm.stA.value='8'; frm.etA.value='9'; frm.stB.value='8'; frm.etB.value='9';
document.getElementById('BlkA').style.top = "0px"; document.getElementById('BlkB').style.top = "0px";
document.getElementById('BlkA').style.height = "2.5em"; document.getElementById('BlkB').style.height = "2.5em";
document.getElementById('BlkB').style.left = "200px";
}
function SetDiffAB(frm) {
frm.stA.value='8'; frm.etA.value='9'; frm.stB.value='9'; frm.etB.value='10';
document.getElementById('BlkA').style.top = "0px"; document.getElementById('BlkB').style.top = "2.5em";
document.getElementById('BlkA').style.height = "2.5em"; document.getElementById('BlkB').style.height = "2.5em";
document.getElementById('BlkB').style.left = "200px";
}
function SetDiffBA(frm) {
frm.stA.value='9'; frm.etA.value='10'; frm.stB.value='8'; frm.etB.value='9';
document.getElementById('BlkA').style.top = "2.5em"; document.getElementById('BlkB').style.top = "0px";
document.getElementById('BlkA').style.height = "2.5em"; document.getElementById('BlkB').style.height = "2.5em";
document.getElementById('BlkB').style.left = "200px";
}
function SetOverA_B(frm) {
frm.stA.value='8'; frm.etA.value='10'; frm.stB.value='9'; frm.etB.value='11';
document.getElementById('BlkA').style.top = "0px"; document.getElementById('BlkB').style.top = "2.5em";
document.getElementById('BlkA').style.height = "5em"; document.getElementById('BlkB').style.height = "5em";
document.getElementById('BlkB').style.left = "200px";
}
function SetOverB_A(frm) {
frm.stA.value='9'; frm.etA.value='11'; frm.stB.value='8'; frm.etB.value='10';
document.getElementById('BlkA').style.top = "2.5em"; document.getElementById('BlkB').style.top = "0px";
document.getElementById('BlkA').style.height = "5em"; document.getElementById('BlkB').style.height = "5em";
document.getElementById('BlkB').style.left = "200px";
}
function SetOverAB(frm) {
frm.stA.value='8'; frm.etA.value='11'; frm.stB.value='9'; frm.etB.value='10';
document.getElementById('BlkA').style.top = "0px"; document.getElementById('BlkB').style.top = "2.5em";
document.getElementById('BlkA').style.height = "7.5em"; document.getElementById('BlkB').style.height = "2.5em";
document.getElementById('BlkB').style.left = "200px";
}
function SetOverBA(frm) {
frm.stA.value='9'; frm.etA.value='10'; frm.stB.value='8'; frm.etB.value='11';
document.getElementById('BlkA').style.top = "2.5em"; document.getElementById('BlkB').style.top = "0px";
document.getElementById('BlkA').style.height = "2.5em"; document.getElementById('BlkB').style.height = "7.5em";
document.getElementById('BlkB').style.left = "200px";
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;form onsubmit="return false"&gt;
&lt;h3&gt;Time Block Conflict Test&lt;/h3&gt;
&lt;br&gt;&amp;nbsp;
&lt;p&gt;
Block A START time:
&lt;select name="stA"&gt;
&lt;option value="8" selected&gt;8:00 am&lt;/option&gt;
&lt;option value="8.5"&gt;8:30 am&lt;/option&gt;
&lt;option value="9"&gt;9:00 am&lt;/option&gt;
&lt;option value="9.5"&gt;9:30 am&lt;/option&gt;
&lt;option value="10"&gt;10:00 am&lt;/option&gt;
&lt;option value="10.5"&gt;10:30 am&lt;/option&gt;
&lt;option value="11"&gt;11:00 am&lt;/option&gt;
&lt;option value="11.5"&gt;11:30 am&lt;/option&gt;
&lt;option value="12"&gt;12:00 pm&lt;/option&gt;
&lt;/select&gt;
END time:
&lt;select name="etA"&gt;
&lt;option value="8"&gt;8:00 am&lt;/option&gt;
&lt;option value="8.5"&gt;8:30 am&lt;/option&gt;
&lt;option value="9" selected&gt;9:00 am&lt;/option&gt;
&lt;option value="9.5"&gt;9:30 am&lt;/option&gt;
&lt;option value="10"&gt;10:00 am&lt;/option&gt;
&lt;option value="10.5"&gt;10:30 am&lt;/option&gt;
&lt;option value="11"&gt;11:00 am&lt;/option&gt;
&lt;option value="11.5"&gt;11:30 am&lt;/option&gt;
&lt;option value="12"&gt;12:00 pm&lt;/option&gt;
&lt;option value="12.5"&gt;12:30 pm&lt;/option&gt;
&lt;option value="13"&gt;1:00 pm&lt;/option&gt;
&lt;option value="13.5"&gt;1:30 pm&lt;/option&gt;
&lt;/select&gt;

&lt;br&gt;

Block B START time:
&lt;select name="stB"&gt;
&lt;option value="8"&gt;8:00 am&lt;/option&gt;
&lt;option value="8.5"&gt;8:30 am&lt;/option&gt;
&lt;option value="9" selected&gt;9:00 am&lt;/option&gt;
&lt;option value="9.5"&gt;9:30 am&lt;/option&gt;
&lt;option value="10"&gt;10:00 am&lt;/option&gt;
&lt;option value="10.5"&gt;10:30 am&lt;/option&gt;
&lt;option value="11"&gt;11:00 am&lt;/option&gt;
&lt;option value="11.5"&gt;11:30 am&lt;/option&gt;
&lt;option value="12"&gt;12:00 pm&lt;/option&gt;
&lt;/select&gt;
END time:
&lt;select name="etB"&gt;
&lt;option value="8"&gt;8:00 am&lt;/option&gt;
&lt;option value="8.5"&gt;8:30 am&lt;/option&gt;
&lt;option value="9"&gt;9:00 am&lt;/option&gt;
&lt;option value="9.5"&gt;9:30 am&lt;/option&gt;
&lt;option value="10" selected&gt;10:00 am&lt;/option&gt;
&lt;option value="10.5"&gt;10:30 am&lt;/option&gt;
&lt;option value="11"&gt;11:00 am&lt;/option&gt;
&lt;option value="11.5"&gt;11:30 am&lt;/option&gt;
&lt;option value="12"&gt;12:00 pm&lt;/option&gt;
&lt;option value="12.5"&gt;12:30 pm&lt;/option&gt;
&lt;option value="13"&gt;1:00 pm&lt;/option&gt;
&lt;option value="13.5"&gt;1:30 pm&lt;/option&gt;
&lt;/select&gt;
&lt;br&gt;&amp;nbsp;
&lt;p&gt;Same:
&lt;input type="radio" name="setTimes" onclick="SetSame(this.form)"&gt; (A == B)
&lt;p&gt;Different:
&lt;input type="radio" name="setTimes" onclick="SetDiffAB(this.form)"&gt; (A &amp;lt; B)
&lt;input type="radio" name="setTimes" onclick="SetDiffBA(this.form)"&gt; (B &amp;lt; A)
&lt;br&gt;Overlap:
&lt;input type="radio" name="setTimes" onclick="SetOverA_B(this.form)"&gt; (A in B)
&lt;input type="radio" name="setTimes" onclick="SetOverB_A(this.form)"&gt; (B in A)
&lt;input type="radio" name="setTimes" onclick="SetOverBA(this.form)"&gt; (A in B)
&lt;input type="radio" name="setTimes" onclick="SetOverAB(this.form)"&gt; (B in A)
&lt;br&gt; &amp;nbsp; &lt;br&gt;
&lt;button onclick="CheckTimeConflict(this.form)"&gt;Check Conflict&lt;/button&gt;
&lt;/form&gt;
&lt;p&gt;
&lt;div class="graphic"&gt;
&lt;div id="BlkA" class="period"&gt; Block A &lt;/div&gt;
&lt;div id="BlkB" class="period"&gt; Block B &lt;/div&gt;
&lt;div id="Time" class="Times"&gt;
8:00 am&lt;p&gt;8:30 am&lt;p&gt;9:00 am&lt;p&gt;9:30 am&lt;p&gt;
10:00 am&lt;p&gt;10:30 am&lt;p&gt;11:00 am&lt;p&gt;11:30 am&lt;p&gt;
12:00 am&lt;p&gt;12:30 am&lt;p&gt;1:00 am&lt;p&gt;1:30 am&lt;p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;

?
×

Success!

Help @JMRKER spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 4.29,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...