SitePoint Sponsor

User Tag List

Results 1 to 8 of 8

Thread: Smilies

  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Cincinnati, Ohio
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smilies

    How can I make something like on the left hand side of the Create New Topic page when you actually create one where you click on an image and it will add a code for that image. Exactly like what it does for the smilies! And it puts it into a textarea box?

  2. #2
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Sorry

    Sorry to be the bringer of bad news...

    There isn't anyway of embedding extra charmap features into a text area.

    That's why when you write your posts here.. they don't actually show the smilies until it is shown on the page for real.

    The way to do it is work out how you want to have your shortcut for images ... and then have it insert the text for that smilie into the page.

    Eg:

    |_unhappy_|

    You can then either have CS or SS language parse through the text being put into the div or td in your forum page, and replace |_(.+)_| with <img src="/smilies/$1.gif">.

    Does this help?

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Cincinnati, Ohio
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    I understand that...

    I need help with the java script part understanding how to add the smilie code into the text... I knew i had to do that but im just lost on the java script part on understanding when you click it it adds it to the text area.

  4. #4
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh.. alright then

    Just have an onclick for each smiley..

    <img src="images/unhappy.gif" id="unhappy"
    onclick="document.all.textarea.innerHTML+='|_'+this.id+'_|';"; >


    This would add |_unhappy_| to our text field.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  5. #5
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    afterthought

    You could even put that into a function

    Code:
    <img id="unhappy" onclick="addme()">
    
    <script>
    function addme(){
         var ref=window.event.srcElement.id;
         document.all.textarea.innerHTML+='|_'+ref+'_|';
         }
    </script>
    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  6. #6
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Cincinnati, Ohio
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    More...

    Ok... I took that function and added it to a .js file. Is there anyway to take the file name or id or some how make it |_id_| or |_filename_| if it is the file name i would have to take of the last four characters or the ".gif". Is this possible? I want it this way so it will work for more than one image.

    Thanks a lot!

  7. #7
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm afraid what you just typed made VERY little sense.
    Please try to use a bit more punctuation - if you find you can't say what you've typed then we probably can't understand it.

    From what you're saying you want to know if this would work for multiple smilies.

    Well that's the whole point in loading the variable ref with srcElement.id.

    You give the image the id of the name of the file it represents... and then the function will refer to that image name.

    ie:
    <img src="/smilies/redhot.gif" id="redhot" onclick="addme();">

    this would send the function the value redhot for 'ref'.

    The function would then make the reference to the image as /smilies/redhot.gif.

    This shouldn't be too hard, i think.

    The parser at the other end (CSide or SSide) should then be able to just parse for |_(.+)_| and regex switch for <img src="/smilies/$1">.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  8. #8
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Cincinnati, Ohio
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Nevermind

    Nevemind im stupid. You satisfied my needs the first time you made the script and I didn't do it right. Thanks a lot for you help!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •