Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 474
  • Last Modified:

Son of javascript text write

Good afternoon Expert,

Please forgive the long code section but don't worry, it is listed to
ask a question of concept. The code works. But I now have nineteen
functions. Perhaps there is no way to use looping or arays or some opther
method of reducing the number of functions or perhaps there is. I remember
in VB class that looping or arrays were a way of reducing the number of subroutines.
Does that apply here? If so can you give me a basic idea of the syntax?

Also a brief and specific question. (Maybe I should make this a separate question. If
so let me know.) In the diagram marked Business Anaylsis Body of Knowledge there
is text that appears, 'Enterprise Anaysis'.that  Ioverlaps the box it is supposed to go in.
Is there some way of putting a line break (<br>) int the line
<area shape ="rect" coords ="65,241,140,338" onMouseOver="writeTextG('Enterprise Analysis')"/>

Thanks

Allen in Dallas



begin code section ++++++++++++++++

<html>
<head>
<script type="text/javascript">
function writeText(txt)
{
document.getElementById("desc").innerHTML=txt;
}

function writeTextB(txt)
{
document.getElementById("descB").innerHTML=txt;
}

function writeTextC(txt)
{
document.getElementById("descC").innerHTML=txt;
}

function writeTextD(txt)
{
document.getElementById("descD").innerHTML=txt;
}

function writeTextE(txt)
{
document.getElementById("descE").innerHTML=txt;
}

function writeTextF(txt)
{
document.getElementById("descF").innerHTML=txt;
}

function writeTextG(txt)
{
document.getElementById("descG").innerHTML=txt;
}

function writeTextH(txt)
{
document.getElementById("descH").innerHTML=txt;
}

function writeTextJ(txt)
{
document.getElementById("descJ").innerHTML=txt;
}

function writeTextK(txt)
{
document.getElementById("descK").innerHTML=txt;
}

function writeTextL(txt)
{
document.getElementById("descL").innerHTML=txt;
}

function writeTextM(txt)
{
document.getElementById("descM").innerHTML=txt;
}

function writeTextN(txt)
{
document.getElementById("descN").innerHTML=txt;
}

function writeTextP(txt)
{
document.getElementById("descP").innerHTML=txt;
}

function writeTextQ(txt)
{
document.getElementById("descQ").innerHTML=txt;
}

function writeTextR(txt)
{
document.getElementById("descR").innerHTML=txt;
}

function writeTextS(txt)
{
document.getElementById("descS").innerHTML=txt;
}

function writeTextT(txt)
{
document.getElementById("descT").innerHTML=txt;
}

function writeTextU(txt)
{
document.getElementById("descU").innerHTML=txt;
}

</script>
</head>
<body>
<div><img src ="images/BABOK_e.gif" width ="780" height ="600" usemap="#RPM" /></div>
<map id ="RPM" name="RPM">
<area shape ="rect" coords ="177,145,641,176" onMouseOver="writeText('Requirements Planning and Management')"/>
<area shape ="rect" coords ="259,221,440,262" onMouseOver="writeTextB('Requirements Elicitation')"/>
<area shape ="rect" coords ="315,270,497,312" onMouseOver="writeTextC('Req_ments Analysis and Doc.')"/>
<area shape ="rect" coords ="441,322,622,362" onMouseOver="writeTextD('Solution Assess. & Eval.')"/>
<area shape ="rect" coords ="235,412,700,440" onMouseOver="writeTextE('Requirements Communication')"/>
<area shape ="rect" coords ="176,411,641,441" onMouseOver="writeTextF('Requirements Communication')"/>
<area shape ="rect" coords ="65,241,140,338" onMouseOver="writeTextG('Enterprise Analysis')"/>
</map>
<div  id="desc" style="position: absolute; height: auto; width: auto; left: 280px; top: 170px; font-family: arial; "></div>
<div id="descB" style="position: absolute; height: auto; width: auto; left: 235px; top: 252px; font-family: arial; font-size: 12; "></div>
<div id="descC" style="position: absolute; height: auto; width: auto; left: 335px; top: 302px; font-family: arial; font-size: 12; "></div>
<div id="descD" style="position: absolute; height: auto; width: auto; left: 470px; top: 352px; font-family: arial; font-size: 12; "></div>
<div id="descF" style="position: absolute; height: auto; width: auto; left: 330px; top: 435px; font-family: arial; "></div>
<div id="descG" style="position: absolute; height: auto; width: auto; left: 70px; top: 305px; font-family: arial; font-size: 12;"></div>

<div><img src ="images/requirements_types.gif" width ="600" height ="500" usemap="#RT" /></div>
<map id ="RT" name="RT">
<area shape ="rect" coords ="40,67,193,110" onMouseOver="writeTextH('Business Requirements')"/>
<area shape ="rect" coords ="40,132,193,174" onMouseOver="writeTextJ('User Requirements')"/>
<area shape ="rect" coords ="40,190,193,231" onMouseOver="writeTextK('Functional Requirements')"/>
<area shape ="rect" coords ="40,254,193,294" onMouseOver="writeTextL('Qual of Serv Requirements')"/>
<area shape ="rect" coords ="40,313,193,354" onMouseOver="writeTextM('Assumpt_ns & Constraints')"/>
<area shape ="rect" coords ="40,380,193,421" onMouseOver="writeTextN('Implement_n Req_ments')"/>

<area shape ="rect" coords ="214,67,560,110" onMouseOver="writeTextP('High level goals. Business purpose & metrics')"/>
<area shape ="rect" coords ="214,132,560,174" onMouseOver="writeTextQ('Gathered by requirements elicitation')"/>
<area shape ="rect" coords ="214,190,560,231" onMouseOver="writeTextR('Behavior and information of solution')"/>
<area shape ="rect" coords ="214,254,560,294" onMouseOver="writeTextS('Environmental conditions')"/>
<area shape ="rect" coords ="214,313,560,354" onMouseOver="writeTextT('Nonfunctional aspects that limit or impact')"/>
<area shape ="rect" coords ="214,380,560,421" onMouseOver="writeTextU('Transition from current to desired, temporary')"/>


</map>

<div id="descH" style="position: absolute; height: auto; width: auto; left: 60px; top: 705px; font-family: arial; font-size: 12;"></div>
<div id="descJ" style="position: absolute; height: auto; width: auto; left: 65px; top: 765px; font-family: arial; font-size: 12; "></div>
<div id="descK" style="position: absolute; height: auto; width: auto; left: 60px; top: 825px; font-family: arial; font-size: 12; "></div>
<div id="descL" style="position: absolute; height: auto; width: auto; left: 60px; top: 885px; font-family: arial; font-size: 12; "></div>
<div id="descM" style="position: absolute; height: auto; width: auto; left: 60px; top: 950px; font-family: arial; font-size: 12; "></div>
<div id="descN" style="position: absolute; height: auto; width: auto; left: 60px; top: 1015px; font-family: arial; font-size: 12;"></div>

<div id="descP" style="position: absolute; height: auto; width: auto; left: 235px; top: 705px; font-family: arial; font-size: 12;"></div>
<div id="descQ" style="position: absolute; height: auto; width: auto; left: 235px; top: 765px; font-family: arial; font-size: 12; "></div>
<div id="descR" style="position: absolute; height: auto; width: auto; left: 235px; top: 825px; font-family: arial; font-size: 12; "></div>
<div id="descS" style="position: absolute; height: auto; width: auto; left: 235px; top: 885px; font-family: arial; font-size: 12; "></div>
<div id="descT" style="position: absolute; height: auto; width: auto; left: 235px; top: 950px; font-family: arial; font-size: 12; "></div>
<div id="descU" style="position: absolute; height: auto; width: auto; left: 235px; top: 1015px; font-family: arial; font-size: 12;"></div>

</body>
</html>

end code section ++++++++++++++++


BABOK-e.gif
Requirements-types.gif
0
Allen Pitts
Asked:
Allen Pitts
2 Solutions
 
glcumminsCommented:
You can combine those functions into a single function that takes two parameters:

 1. The text to be written
 2. The ID of the field to write

Like this:

function writeText(txt, fieldId)
{
document.getElementById(fieldId).innerHTML=txt;
}
0
 
mltsyCommented:
I agree with glcummins on that question.

As for the text overlapping the box it's supposed to fit in - it looks like you have the positioned to the pixel, you could also add in a pixel width so that the text would wrap properly for the box it's supposed to fit in, something like:

<div id="descG" style="position: absolute; height: auto; width: 90px; left: 70px; top: 305px; font-family: arial; font-size: 12;"></div>
0
 
Allen PittsBusiness analystAuthor Commented:
Spilt points to recognize both contributions. Thanks
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now