How do i color something like a blueprint?

•

What is DaniWeb IT Discussion Community?

You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 375,197 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,095 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.

Join our community!

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

Thread Tools Display Modes

Views: 499 | Replies: 2

•

Join Date: Mar 2007

Posts: 7

Reputation: computerman11 is an unknown quantity at this point

Rep Power: 0

Solved Threads: 0

computerman11 computerman11 is offline

Offline

Newbie Poster

How do i color something like a blueprint?

Mar 2nd, 2008

I have a blueprint of a building that I have scanned into my computer. I am looking to have a menu of some sort where I can select what room I want to color, and another menu to change the color. Any ideas?

•

Join Date: Jan 2008

Location: Bangalore, India

Posts: 327

Reputation: DangerDev is an unknown quantity at this point

Rep Power: 0

Solved Threads: 31

DangerDev

Offline

Posting Whiz

Re: How do i color something like a blueprint?

Mar 2nd, 2008

you want any software or you want to build one ?

A computer lets you make more mistakes faster than any invention in human history - with the possible exceptions of handguns and tequila.
~Mitch Ratcliffe

•

Join Date: Mar 2007

Posts: 7

Reputation: computerman11 is an unknown quantity at this point

Rep Power: 0

Solved Threads: 0

computerman11 computerman11 is offline

Offline

Newbie Poster

Re: How do i color something like a blueprint?

Mar 3rd, 2008

I am interested in doing it myself, but I am running into some issues. I really want a drop down menu with room numbers and then another drop down menu with the color i want that room. I found a snippit of code that I am using, and have started tweaking it. The code will follow.

The boxes in my table are just for testing purposes. I have a trial of dreamweaver so I am just playing around with trying to pass different values to the java function I have defined, while using drop down menus.

If this just looks like it is too much work for a simple home project, then I would be interested in any premade software you know of.

EDIT: if you want to test this, the 3 number areas in the code where you can type the hex value of HTML color scheme work.

Help with Code Tags

(Toggle Plain Text)

<html><head>
<body>
<script type="text/javascript" src="ddcolorposter.js"></script>
<form>
  <p>
    <label>
    <select name="room" id="room">
      <option value="colorbox1">Room1</option>
      <option value="colorbox2">Room2</option>
    </select>
    </label>
  </p>
#
    <input id="room1" onFocus="ddcolorposter.echocolor(this, room)" size="20" type="text" />
    <br>
#
<input id="room2" onFocus="ddcolorposter.echocolor(this, 'colorbox2')" size="20" type="text" />
<br>
#
<input id="room3" onFocus="ddcolorposter.echocolor(this, 'colorbox3')" size="20" type="text" />
<br>
#
<input id="room4" onFocus="ddcolorposter.echocolor(this, 'colorbox4')" size="20" type="text" />
  </p> 
</form>


<table width="200" border="1">
    <tr>
      <td><span style="background-color: rgb(255, 255, 255);" id="colorbox1" class="colorbox">____</span></td>
      <td><span style="background-color: rgb(255, 255, 255);" id="colorbox2" class="colorbox">____</span></td>
      <td><span style="background-color: rgb(255, 255, 255);" id="colorbox3" class="colorbox">____</span></td>
      <td><span style="background-color: rgb(255, 255, 255);" id="colorbox4" class="colorbox">____</span></td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
</table>

<p>&nbsp;</p>
</body></html>

And here is the javascript:

Help with Code Tags

(Toggle Plain Text)

function executeonload(functionref){
	if (window.addEventListener)
		window.addEventListener("load", functionref, false)
	else if (window.attachEvent)
		window.attachEvent("onload", functionref)
	else if (document.getElementById)
		window.onload=functionref
}

var ddcolorposter={
echocolor:function(inputobj, divID){
	this.targetobj=inputobj
	this.divobj=document.getElementById(divID)
	this.targetobj.onblur=function(){
	if (inputobj.value.search(/^[a-zA-Z0-9]{6}$/)!=-1) //if field contains valid hex value
		document.getElementById(divID).style.backgroundColor="#"+inputobj.value
	}
}
}

Last edited by computerman11 : Mar 3rd, 2008 at 1:25 am.