Blog Documentation Book a Demo
Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

[ Request ] Spoiler Tags?

blizeHblizeH ✭✭
edited November 2007 in Vanilla 1.0 Help
Just wondering if someone could possibly create an extension that does the 'proper' spoiler tags? i.e. you hover over a question mark and it brings up the text. I've seen this used very effectively on another forum (a phpBB one I think?) and it was great ;o
«1

Comments

  • StashStash ✭
    I think this was started (and finished?) with an extension called "Hidden Text" or something similar.
  • WandererWanderer
    That one never worked for me
    so I hacked my own.
    Apparently it stuffs up in Exploder 5 or 6 or both.pic

    Posted: Wednesday, 14 March 2007 at 2:03PM (AEDT)

  • KrakKrak New
    Hey, I made that extension, a few people tossed out ideas and nothing else ever happened. No one ever mentioned it "stuffed up" anything else.

    Wanderer why don't you add it to the add-ons site? And I have a few questions: how does yours work? Mine inserts a div with an id added to each post, so you can have 1 hidden message per post. Can yours? I see you have more than one in that discussion can you have more than just that, like in extra comments made?

    I'm curious, did you just take some of the JS examples in my add-ons thread and put them to work?

    Maybe after seeing yours I can improve mine. Mine works like BBCode for the user, yours?
  • WandererWanderer
    This is the js (can't remember where I hacked it from)...
    function show_hidden(obj, txt) { obj.className = 'debhide'; obj.innerHTML = txt; }

    This is the CSS...
    .debhide { color: #e70031; }
    I don't think I'll release it as an extension, the JavaScript bits in the comment fields are way too fiddly to expect the layperson to deal with. If you can make it useable, go for it.

    Posted: Wednesday, 14 March 2007 at 3:40PM (AEDT)

  • MySchizoBuddyMySchizoBuddy
    how do u guys put spoliers use a spoiler tag or what how do u expect to use it
  • WandererWanderer
    A movie review for example...
    In the movie Wild Hogs a cameo appearance by spoiler was an unexpected thrill.
    If you don't want it spoiled for you, don't click on spoiler.

    Posted: Wednesday, 14 March 2007 at 4:23PM (AEDT)

  • MySchizoBuddyMySchizoBuddy
    and how would u add a spoiler. in html what?
    I guess i'm asking cause i will make one if I know what u guys really want. so u need to click the spoiler to view it, or hover over it.. on clicking on it makes the spoiler magically appear under it. what EXACTLY do u want.

    how about this
    <p class="spoiler">Enter spoiler details here</p>
    that paragraph won't show in the comments. It will be replaced by "Show Spolier" link. when u click on it the spoiler appears right below it.
  • WandererWanderer
    That sounds great but it should appear instead of it.
    That is, "Show Spoiler" should disappear and be replaced with the paragraph.
    Not expecting pages of text to be the actual spoiler paragraph, it's usually only a short sentence.

    Posted: Wednesday, 14 March 2007 at 5:41PM (AEDT)

  • StashStash ✭
    All you really need (I'm sure it's more complicated than this) is a class that is hidden by default (visibility:hidden;) and that gets made visible (visibility:visible;) when you click on a link. I'm shooting in the dark here as my JS is crap, but I think you could use generated content (and IE hacks for it) to display/hide the "Show Spoiler" text instead. I think jQuery has some relatively simple ways to get this done, but as I say, my JS is crap...
  • WallPhoneWallPhone
    Just wanted to point out that Safari has trouble switching things from visibility: hidden to visible, so you should position absolutely with a large negative left position to place the spoiler off the side of the browser screen.

    Other option is to save the spoiler in javascript and write it in when the spoiler is clicked (I like this idea better, it's more accessible, as screen readers may still read the spoiler if its pushed to the left.)
  • StashStash ✭
    Bloody hell - feels like CSS image replacement all over a-bloody-gain.

    That AJAXy way you've suggested sounds sodding complicated :P Agreed that it's probably best, but would this require putting things into databases and the like?
  • WallPhoneWallPhone
    Nah, I think all it would need is something like this:<a href="#" onclick="document.write(' Ha ha ha, you thought this would be a spoiler--and it's not! Sucker!')">Click for spoiler</a>
    Of course, I'm no javascript guru, so it might need a appendChild, addElement, or something along those lines.
  • WandererWanderer
    This is the code I hacked...
    <x style="color:red;background: #eee;" onclick="show_hidden(this, 'The cameo was by Peter Fonda!');"> <em style="cursor:pointer"> Spoiler </em></x>
    This is what it looks like...
    Spoiler

    Of course it won't work here without the external js.
    You can see it working here.

    Posted: Thursday, 15 March 2007 at 7:27AM (AEDT)

  • MySchizoBuddyMySchizoBuddy
    Wanderer how will u add the onclick stuff using bbcode? or markdown. and whether users will find it easy to do so making the extension is not hard at all. the problem is how will they enter the spoiler. do we need special spoiler classes Spoliers on game sites can be quite long to put in onclick anyway. they also have html in it as well
  • WandererWanderer
    This is the exact problem that's keeping me from making it an extension!

    I hate BBCode, no idea what Markdown is, I'd be using plain Html (Quicktags).

    Posted: Thursday, 15 March 2007 at 9:37AM (AEDT)

  • bjrnbjrn
    Markdown is a way of formatting text using common characters like /, * and -. So for emphasis instead of <em>OH NO</em>, you'd write *OH NO*, or _OH NO_
  • WandererWanderer
    Thanks bjrn, I have seen that before.
    I like keeping things standard, I hate proprietary one-use-only stuff, not just on forums but in everyday life.
    Can't afford wasting brain energy on learning something so specific.

    Posted: Thursday, 15 March 2007 at 10:11AM (AEDT)

  • TomTesterTomTester New
    Wanderer.... It'll save you a LOT of time. Much more efficient than HTML and BBCode.

    Almost like using a PC (type type) vs a Mac (click, move click, drag, command-click, hehe).

    I thought you of all people would appreciate that... (kidding!, don't get started, it's the
    other way around, at least Markdown is...)
  • WandererWanderer
    You forget Tommy boy that certain people actually prefer "click, move click, drag" as they have better things to do with their brain power than remember obtuse stuff to type. It's called a human interface.

    In other words, they have a life!

    Don't get me started ;-)

    Posted: Thursday, 15 March 2007 at 11:12AM (AEDT)

  • KrakKrak New
    I hacked the bbcode extension up to get mine to work. There is a button near the form that says insert spoiler, click it and it pops out a tag in the comment field [hide][/hide]. I went the bbcode direction thinking it would be the easiest thing for users to use, no html code , just a simple hide bracket.

    Sounds like we should mix the two extensions together, best of both worlds. Only issue is, I am not that good with JS.
This discussion has been closed.