Tracing pictures

Hello all.. I don't think this has been suggested before - an easy(ish)
way to trace pictures (as in being able to write text over the top of an
image).. it works on Internet Explorer 5 (might work on 4.. I don't
know) but not on Netscape Navigator (both on Windows 98) if you try it
on a different system, feel free to say..

You can see the result of this technique in my other post..

If this is a really bad idea, just say so..


Using Internet Explorer to 'trace' a picture in Ascii

Set aside a directory. Put the image you want to asciify into it, which
should be in .gif, .jpg, or .png format. Then open a text file and copy
and paste the following into it.

<HTML>
<HEAD>
<STYLE TYPE="text/css">
</STYLE>
</HEAD>
<BODY>
<FORM>
<TEXTAREA>
</TEXTAREA>
</FORM>
</BODY>
</HTML>

This is not great HTML, but it's good enough for our purposes.

Save the file with a .html ending.

The changes you'll need to make are between the <STYLE> and </STYLE>
tags. 

Put the following in there:

textarea: { background-image: myimg.jpg;
            color: blue;
            font-family: courier-new;
            height: 300;
            width: 300;
          }

* Change the value of background-image to your image file.

* Change the value of color to whatever color you want to work in - this
may take a little experimentation to get right.

* Change the value of font-family to your favourite monospace font.

* Change the value of height to the height of your image, and the value
of width to the width of your image. (you may like to add a little extra
to each of these to get some more working space)

Now, save the file again, and open it with Internet Explorer (on Windows
you can do this just by double clicking on the file).

If all is well you should get a box on screen with your picture inside
it. You should be able to type in this box - Use the image as a template
for your artwork.

Don't be too bound by the picture though, impression of a look is often
a lot more effective than an approximation of it.

Once done, copy and paste the text to another file.

A word of warning - whilst drawing be careful not to press the escape
key or everything you've typed will be instantly deleted.


-- 
James Mitchelhill
email - azi...@tcp.co.uk
website: http://neptune.spaceports.com/~poetry/

: Hello all.. I don't think this has been suggested before - an easy(ish)
: way to trace pictures (as in being able to write text over the top of an
: image).. it works on Internet Explorer 5 (might work on 4.. I don't
: know) but not on Netscape Navigator (both on Windows 98) if you try it
: on a different system, feel free to say..
:
: You can see the result of this technique in my other post..
:
: If this is a really bad idea, just say so..

Actually I think it's a great idea !

In fact i'm dying to try to make this into a fullfeatured DHTML ASCII editor.

Or short of that at least improve on a few things.

---------------

Allow selection of font and image and textarea size from the page
instead of having to alter the source. [EASY]

Allow for dimming, reversing and fliping of the image
using DHTML image filters [EASY to MEDIUM]

Include a quick repository of standard shapes and lines
ready for insertion [EASY to MEDIUM]

Make it work for Netscape too [MEDUIM]

Make a quick button that copies it directly to the clipboard [MEDIUM]

ASCII reversing selected text
(make ascii facing left, face rigth and vice versa) [MEDIUM to HARD]

Quickbutton to post directly to alt.ascii-art using a cgi script
(I probarbly won't do this .. this could make it easy for a webuser
to flood this newsgroup) [HARD]

Detection of nonascii characters [MEDIUM to HARD]

Rectangular copy and paste [HARD]

Catching of harmful input like the escape key
[MEDIUM - if it can be done properly]

Make it work correctly for browser versions below 4 [NO CHANCE IN HELL]

Make it work aproximatly for browser versions below 4 [MAYBE]

----------------


I have added it to my idea tank (TODOlist of crazy ideas I would like to carry
out one day)

I will probarbly begin work on it after i get my "SMS 2 POP" (a program that
allows you to check your POP3 mail from a ordinary cellphone) and my SSI-less
counter CGI done (a lowbandwidth webcounter -- with a twist) done.

Kind Regards
CeeJay

--
 ,________________________________________________________
 |\'-._(   /                                              |
 | \  .'-._\     CeeJay Central                      ,   ,|
 |-.\'    .-;    http://CeeJay.findhere.com/       .'\`-' |
 |   \  .' (                                    _.'   \   |
 |.--.\'   _)     "It's my little place      ;-;       \._|
 |    ` _\(_)/_        on the web.."          \ `'-,_,-'\ |
 jgs____ /(O)\  ______________________________/____)_`-._\|

I must have missed the first post. What is this a trick you can do
with the browsers?

Laura

On Wed, 03 Nov 1999 14:19:53 +0100, Veronica Karlsson
<aci...@earthling.net> wrote:

>James Mitchelhill wrote:
>> 
>> Hello all.. I don't think this has been suggested before - an easy(ish)
>> way to trace pictures (as in being able to write text over the top of an
>> image).. it works on Internet Explorer 5 (might work on 4.. I don't
>> know) but not on Netscape Navigator (both on Windows 98) if you try it
>> on a different system, feel free to say..
>> <snip>
>
>This is just another version of the good old Plastic Bag Method. I use
>the HTML editor in Netscape 4 to do the same thing (which is better than
>your version, since I can hit "Save" every now and then...).
>
>
>-- 
>    (,         http://www.ludd.luth.se/~vk/cgi/asciichat/
>    /|__--__                       .                        __--__
>    |\ '__                        /|\                        _{ _ 
>    `.' / `.,_ _________           |           _________ _,.' (/ `.
>    /  ||``._.'             ASCII ART CHAT!             `---'|:||,/
>  .'   /|                                                   /|:| \
>.'    /\ \         __   __                _                 `/|'\'
> ` `,/ /`,\        \ \ / /__ _ _ ___ _ _ (_)__ __ _         /,'\ \
>   .'.'  /|         \ V / -_) '_/ _ \ ' \| / _/ _` |        |\  `.`.
> ,' /   / |          \_/\___|_| \___/_||_|_\__\__,_|        | \   \ `,
>- `- -- `-'- -ejm-------------------------------------VK-- -`-' -- -' -


              __,,--``\\
      _,,-''``         \\     ,
     '----------_.------'-.___|\__
        _.--''``    `)__   )__   @\__
       (  .. ''---/___,,E/__,E'------`
        `-''`''                           ldb
      http://members.xoom.com/ldb/fireone.htm

James Mitchelhill wrote:
> 
> Hello all.. I don't think this has been suggested before - an easy(ish)
> way to trace pictures (as in being able to write text over the top of an
> image).. it works on Internet Explorer 5 (might work on 4.. I don't
> know) but not on Netscape Navigator (both on Windows 98) if you try it
> on a different system, feel free to say..
> <snip>

This is just another version of the good old Plastic Bag Method. I use
the HTML editor in Netscape 4 to do the same thing (which is better than
your version, since I can hit "Save" every now and then...).


-- 
    (,         http://www.ludd.luth.se/~vk/cgi/asciichat/
    /|__--__                       .                        __--__
    |\ '__                        /|\                        _{ _ 
    `.' / `.,_ _________           |           _________ _,.' (/ `.
    /  ||``._.'             ASCII ART CHAT!             `---'|:||,/
  .'   /|                                                   /|:| \
.'    /\ \         __   __                _                 `/|'\'
 ` `,/ /`,\        \ \ / /__ _ _ ___ _ _ (_)__ __ _         /,'\ \
   .'.'  /|         \ V / -_) '_/ _ \ ' \| / _/ _` |        |\  `.`.
 ,' /   / |          \_/\___|_| \___/_||_|_\__\__,_|        | \   \ `,
- `- -- `-'- -ejm-------------------------------------VK-- -`-' -- -' -

On Wed, 03 Nov 1999 10:56:01 GMT, She...@excite.com (LDB) wrote:

>I must have missed the first post. What is this a trick you can do
>with the browsers?
>
>Laura

I emailed you a copy :)


-- 
James Mitchelhill
email - azi...@tcp.co.uk
website: http://neptune.spaceports.com/~poetry/

LDB wrote:
> Veronica Karlsson wrote:
> >James Mitchelhill wrote:
> >>
> >> Hello all.. I don't think this has been suggested before - an easy(ish)
> >> way to trace pictures <snip>
> >
> >This is just another version of the good old Plastic Bag Method. <snip>
> 
> I must have missed the first post. What is this a trick you can do
> with the browsers?
> 


What I call "The Plastic Bag Method" works like this:

* Take a plastic bag (or OH film) and copy your picture to that with
  a pen.

* Tape the bag to your monitor (where you have your normal text
  editor open).

* Try to draw an ascii image with the drawing on the bag as a
  "guide".

* Remove the bag and diddle until you're satisfied with the picture.


A "WYSIWYG" HTML editor (editor, not browser) can be used in a similar
way:

* Open a new document.

* Set the background image to be the one you want to draw.

* Choose a monospaced font.

* Try to draw an ascii image with the "page" background as a "guide".

* Copy-Paste to your normal text editor and diddle until you're
  satisfied with the picture.


WARNING!

Don't try to use the paint program "Paint" (in Windows) to do this.
There's a risk that you accidentally click your mouse or something, with
the result that the whole thing is turned into a bitmap...


-- 
    (,         http://www.ludd.luth.se/~vk/cgi/asciichat/
    /|__--__                       .                        __--__
    |\ '__                        /|\                        _{ _ 
    `.' / `.,_ _________           |           _________ _,.' (/ `.
    /  ||``._.'             ASCII ART CHAT!             `---'|:||,/
  .'   /|                                                   /|:| \
.'    /\ \         __   __                _                 `/|'\'
 ` `,/ /`,\        \ \ / /__ _ _ ___ _ _ (_)__ __ _         /,'\ \
   .'.'  /|         \ V / -_) '_/ _ \ ' \| / _/ _` |        |\  `.`.
 ,' /   / |          \_/\___|_| \___/_||_|_\__\__,_|        | \   \ `,
- `- -- `-'- -ejm-------------------------------------VK-- -`-' -- -' -

.----- On Wed, 03 Nov 1999 14:19:53 +0100, Veronica Karlsson posted:
|James Mitchelhill wrote:
|> 
|> Hello all.. I don't think this has been suggested before - an easy(ish)
|> way to trace pictures (as in being able to write text over the top of an
|> image).. it works on Internet Explorer 5 (might work on 4.. I don't
|> know) but not on Netscape Navigator (both on Windows 98) if you try it
|> on a different system, feel free to say..
|> <snip>
|
|This is just another version of the good old Plastic Bag Method. I use
|the HTML editor in Netscape 4 to do the same thing (which is better than
|your version, since I can hit "Save" every now and then...).
|
'------------------------------------

...And I've done one picture the same way in MartSoft AycheTeaEm 'ell ...
yes, MartSoft as in me.
It's my text editor specially tooled-up for HTML.

</advertising>

Kind Regards,
-Martin
|\/| _..__|_o._   /\_|_| o._  _   mart.atkins@--
|  |(_||  |_|| | /--\|_|<|| |_>            --bigfoot.com