creating a "tail" like textarea ?

[Mel]

i need to create a unix like "tail" function on my site.

the question:
the text is displayed in a scrolled area and a new line is added at the
end and the entire text is scrolled down so that user can see the last item
added.

i am trying to avoid displaying an HTML file and have to scroll it down,
since it does not seem to work all the time

any pointer is highly appreciated

[kaeli]

Re: creating a "tail&quot ; like textarea ?

In article <42404d6a$1@use net01.boi.hp.co m>, mel.m.heravi@hp .com enlightened
us with...[color=blue]
> i need to create a unix like "tail" function on my site.
>
> the question:
> the text is displayed in a scrolled area and a new line is added at the
> end and the entire text is scrolled down so that user can see the last item
> added.[/color]

Is there a reason the user can't find the End key?

End goes to the bottom.
Home goes to the top.
The keys are usually sitting in the middle section of the keyboard, above the
arrows.

If your application doesn't support End and Home, you may want to consider
fixing that. It's easier than coding JS scrolling. ;)

--
--
~kaeli~
A lot of money is tainted - It taint yours and it taint mine.

http://www.ipwebdesign.net/wildAtHeart

http://www.ipwebdesign.net/kaelisSpace

[Mel]

Re: creating a &quot;tail&quot ; like textarea ?

user want to see the last line and does not have to page down every time a
line is inserted !!!

"kaeli" <tiny_one@NOSPA M.comcast.net> wrote in message
news:MPG.1caa37 7028c041e98a3b6 @nntp.lucent.co m...[color=blue]
> In article <42404d6a$1@use net01.boi.hp.co m>, mel.m.heravi@hp .com[/color]
enlightened[color=blue]
> us with...[color=green]
> > i need to create a unix like "tail" function on my site.
> >
> > the question:
> > the text is displayed in a scrolled area and a new line is added at[/color][/color]
the[color=blue][color=green]
> > end and the entire text is scrolled down so that user can see the last[/color][/color]
item[color=blue][color=green]
> > added.[/color]
>
> Is there a reason the user can't find the End key?
>
> End goes to the bottom.
> Home goes to the top.
> The keys are usually sitting in the middle section of the keyboard, above[/color]
the[color=blue]
> arrows.
>
> If your application doesn't support End and Home, you may want to consider
> fixing that. It's easier than coding JS scrolling. ;)
>
> --
> --
> ~kaeli~
> A lot of money is tainted - It taint yours and it taint mine.
> http://www.ipwebdesign.net/wildAtHeart
> http://www.ipwebdesign.net/kaelisSpace
>[/color]

[RobG]

Re: creating a &quot;tail&quot ; like textarea ?

Mel wrote:[color=blue]
> i need to create a unix like "tail" function on my site.
>
> the question:
> the text is displayed in a scrolled area and a new line is added at the
> end and the entire text is scrolled down so that user can see the last item
> added.[/color]
[..]

The following is rudimentary, it adds new lines to the top
rather than the bottom (which makes more sense to most users),
and displays a fixed number of entries so the bottom lines are
trimmed off.

If you want it to add to the bottom, that is possible too by
deleting the first element then adding the new one to the end.


<script type="text/javascript">
// Add more elements if a longer tail is required
var tail = new Array(10);
function tailIt(x,y){
tail.unshift(x) ;
tail.pop();
document.getEle mentById(y).inn erHTML = tail.join('<br> ');
}
</script>
<form action="">
<table border="1"><tr> <td>
<input type="text" size="30" name="inText">
</td><td>
<input type="button" value="Add to tail" onclick="
tailIt(this.for m.inText.value, 'outputCell');" >
</td><td id="outputCell " style="width: 20em;">
<script type="text/javascript">
document.write( tail.join('<br> '));
</script>
</td>
</tr>
</table>
</form>


--
Rob

[Tim Williams]

Re: creating a &quot;tail&quot ; like textarea ?

"Mel" <mel.m.heravi@h p.com> wrote in message
news:42404d6a$1 @usenet01.boi.h p.com...[color=blue]
>i need to create a unix like "tail" function on my site.
>
> the question:
> the text is displayed in a scrolled area and a new line is added
> at the
> end and the entire text is scrolled down so that user can see the
> last item
> added.
>[/color]
Textarea?

http://groups-beta.google.com/group/comp.lang.javascript/browse_frm/thread/b84f98e97a7dd16b/25af73464870f483?q=textarea+scroll+javascript#25af73464870f483

Tim

[kaeli]

Re: creating a &quot;tail&quot ; like textarea ?

In article <4240879e$1@use net01.boi.hp.co m>, mel.m.heravi@hp .com enlightened
us with...[color=blue]
> user want to see the last line and does not have to page down every time a
> line is inserted !!![/color]

Is the user not adding the lines?
What is creating the text and what element is it in?

Have you looked at the scrollTo function?

--
--
~kaeli~
Murphy's Law #2030: If at first you don't succeed, destroy
all evidence that you tried.

http://www.ipwebdesign.net/wildAtHeart

http://www.ipwebdesign.net/kaelisSpace

[Mel]

Re: creating a &quot;tail&quot ; like textarea ?

i am a newbee in JS

i did look at scrollTo function, but it does not inside a div for whatever
reason

i have :
<DIV id=MYDIV style=overflow: auto>
.....
</DIV>

i modify the contect of the div with javascript apend and that works, but
can not scroll the page down (something like a chat program)

thanks for your help

and as usual, code samples are Greeeeeeeeeeeee eaaaaaaaaat :-)

"kaeli" <tiny_one@NOSPA M.comcast.net> wrote in message
news:MPG.1cab47 f2b3fe44af98a3b d@nntp.lucent.c om...[color=blue]
> In article <4240879e$1@use net01.boi.hp.co m>, mel.m.heravi@hp .com[/color]
enlightened[color=blue]
> us with...[color=green]
> > user want to see the last line and does not have to page down every time[/color][/color]
a[color=blue][color=green]
> > line is inserted !!![/color]
>
> Is the user not adding the lines?
> What is creating the text and what element is it in?
>
> Have you looked at the scrollTo function?
>
> --
> --
> ~kaeli~
> Murphy's Law #2030: If at first you don't succeed, destroy
> all evidence that you tried.
> http://www.ipwebdesign.net/wildAtHeart
> http://www.ipwebdesign.net/kaelisSpace
>[/color]

[Mel]

Re: creating a &quot;tail&quot ; like textarea ?

the problem with this approach is that the user looses the context. he can
not see the entire thing without the scrolling capabilities.


"RobG" <rgqld@iinet.ne t.auau> wrote in message
news:rr10e.481$ Zn.27200@news.o ptus.net.au...[color=blue]
> Mel wrote:[color=green]
> > i need to create a unix like "tail" function on my site.
> >
> > the question:
> > the text is displayed in a scrolled area and a new line is added at[/color][/color]
the[color=blue][color=green]
> > end and the entire text is scrolled down so that user can see the last[/color][/color]
item[color=blue][color=green]
> > added.[/color]
> [..]
>
> The following is rudimentary, it adds new lines to the top
> rather than the bottom (which makes more sense to most users),
> and displays a fixed number of entries so the bottom lines are
> trimmed off.
>
> If you want it to add to the bottom, that is possible too by
> deleting the first element then adding the new one to the end.
>
>
> <script type="text/javascript">
> // Add more elements if a longer tail is required
> var tail = new Array(10);
> function tailIt(x,y){
> tail.unshift(x) ;
> tail.pop();
> document.getEle mentById(y).inn erHTML = tail.join('<br> ');
> }
> </script>
> <form action="">
> <table border="1"><tr> <td>
> <input type="text" size="30" name="inText">
> </td><td>
> <input type="button" value="Add to tail" onclick="
> tailIt(this.for m.inText.value, 'outputCell');" >
> </td><td id="outputCell " style="width: 20em;">
> <script type="text/javascript">
> document.write( tail.join('<br> '));
> </script>
> </td>
> </tr>
> </table>
> </form>
>
>
> --
> Rob[/color]

[Lee]

Re: creating a &quot;tail&quot ; like textarea ?

Mel said:[color=blue]
>
>the problem with this approach is that the user looses the context. he can
>not see the entire thing without the scrolling capabilities.[/color]

Which is also why you should post your new text *after* a trimmed quote
of the message you're responding to. (and the word is "loses").

[kaeli]

Re: creating a &quot;tail&quot ; like textarea ?

In article <4241900e$1@use net01.boi.hp.co m>, mel.m.heravi@hp .com enlightened
us with...[color=blue]
> i am a newbee in JS
>
> i did look at scrollTo function, but it does not inside a div for whatever
> reason[/color]

That's because it's for the window object, not a div.
[color=blue]
>
> i have :
> <DIV id=MYDIV style=overflow: auto>
> ....
> </DIV>
>[/color]

Try this.

document.getEle mentById("MYDIV ").scrollTo p = document.getEle mentById
("MYDIV").scrol lHeight;

Not sure how cross-browser that is...


--
--
~kaeli~
If that phone was up your a$$, maybe you could drive a
little better!

http://www.ipwebdesign.net/wildAtHeart

http://www.ipwebdesign.net/kaelisSpace

[RobG]

Re: creating a &quot;tail&quot ; like textarea ?

Mel wrote:[color=blue]
> the problem with this approach is that the user looses the context. he can
> not see the entire thing without the scrolling capabilities.[/color]

And top posting does not have the same effect?

Sorry, I was more thinking of head than tail, I prefer to look at the
top of the div to see new stuff rather than the bottom (that's how I
order my mail, news, etc.).

Anyhow, enough excuses, try this (tested in IE and Firefox)


<script type="text/javascript">
var lineNo = 0; // Just a line number
</script>

<form action="">
<table border="1"><tr> <td>
<input type="text" size="30" name="inText">
</td><td>

<input type="button" value="Add to tail" onclick="
var t = document.getEle mentById('outpu tCell');
t.innerHTML += (lineNo > 0)? '<br>' : '';
t.innerHTML += lineNo + ': ' + this.form.inTex t.value;
lineNo++;
if ('undefined' != typeof t.scrollTop) {
t.scrollTop = 0;
t.scrollTop = 5000; // some really big number
}
">

</td><td>
<div id="outputCell " style="height: 10em; width: 20em;
overflow: auto;"></div>
</td>
</tr>
</table>
</form>


--
Rob