Forum closed. New forum available at http://community.wymeditor.org/

How to do underlining?

Support forum for WYMeditor.

How to do underlining?

Postby mrtwice99 on Mon Mar 30, 2009 3:46 am

I know underlining isn't very semantic, but its more proof of concept than anything. I was thinking I would do it with a class, but it looks like I can only apply a class to the block level elements (which makes sense). I need this underlining to apply like bold or italics (i.e. it needs to span words, not apply to a block level element). How would I go about doing this? Just some general pointers on what to look at would be enough most likely.

Thanks.
mrtwice99
 
Posts: 2
Joined: Fri Mar 27, 2009 9:12 pm

Re: How to do underlining?

Postby Jacopo on Mon Mar 30, 2009 2:36 pm

Take a look at the wrap/unwrap function example.
Jacopo
 
Posts: 5
Joined: Fri Aug 29, 2008 5:22 pm
Location: Pisa & Milan

Re: How to do underlining?

Postby Anniepannie on Mon Nov 30, 2009 10:33 am

Is there a way to wrap/unwrap in one function. So when it's already wrapped, unwrap, if not, wrap?
Anniepannie
 
Posts: 3
Joined: Sat Nov 28, 2009 9:23 pm

Re: How to do underlining?

Postby mr_lundis on Wed Jan 06, 2010 9:14 pm

The ability to "toggle wrappings" is a bit tricky. If you just want to remove the wrapping element whether the whole element is selected or not (i.e. just placing the caret inside the wrapping element is enough to trigger an unwrapp) then it's rather easy. If you want to "unwrap" the selection only, then its a little more complex, as the number of different cases increase...

Anyway, the current WYMeditor version does not provide this functionality although it will most likely be included in 0.6. You can however implement this yourself. What you have to do is essentially to look at in which elements the selection starts and ends, as well as their common ancestor. Take a look at the current wrap/unwrap implementation to get started. MDC also provides good documentation on how w3c selections and ranges work. For IE you'll need to head over too MSDN. If you get around to implementing this, a patch would be greatly appreciated. :)

MDC links:
https://developer.mozilla.org/En/DOM/Range
https://developer.mozilla.org/en/DOM/Selection

MSDN links:
http://msdn.microsoft.com/en-us/library ... 85%29.aspx
http://msdn.microsoft.com/en-us/library ... 85%29.aspx

Cheers! ;)
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: How to do underlining?

Postby johnpitcairn on Sat Jan 23, 2010 1:42 am

I've just been fiddling with this in Drupal, and it appears the wrap/unwrap example is broken for Safari (I have nothing else here to test with). Wrap works, but Unwrap does nothing.

I would also like to implement a toggle behaviour, and for the selected text to remain selected after a wrap/unwrap, as for bold etc.

Is there perhaps any way to bind the existing handler for the bold/italic/superscript/etc buttons to handle this?
johnpitcairn
 
Posts: 6
Joined: Fri Sep 18, 2009 3:18 am

Re: How to do underlining?

Postby johnpitcairn on Sat Jan 23, 2010 2:55 am

Or, to take a hacky approach: if I don't need subscript, how can I get wymEditor to output a different tag if I call wym.exec('Subscript') from a custom button? Where exactly is that "sub" tag output defined?

My client needs to define "small" text, and I'd prefer to use an actual "small" tag rather than "span class=small" for this purpose anyway.
johnpitcairn
 
Posts: 6
Joined: Fri Sep 18, 2009 3:18 am

Re: How to do underlining?

Postby johnpitcairn on Sun Jan 24, 2010 8:52 pm

Ah. wymEditor uses the browser's internal execCommand support to do bold, italic etc, but browser support for execCommand('decreasefontsize') is not good (Mozilla only). Can't do it that way.

I have a toggle button working using wym.wrap('small', 'small') and a custom unwrap function, but the text doesn't stay selected (will work on that) and there can be issues with toggling selections within a wrap, as mr_lundis says.

Any improvement on this for 0.6 will certainly be welcome.
johnpitcairn
 
Posts: 6
Joined: Fri Sep 18, 2009 3:18 am

Re: How to do underlining?

Postby mr_lundis on Mon Jan 25, 2010 9:47 am

As you suggest, once the SAPI is more stable we'll use the wrap/unwrap/toggle functionality for a more consistent behaviour, instead of the designMode api. For now if you need to recreate the selection - take a look at the Mozilla docs:
https://developer.mozilla.org/En/DOM/Range
https://developer.mozilla.org/en/DOM/Selection

Regarding the Safari bug, could you provide some more details?

Cheers! ;)
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: How to do underlining?

Postby iUser59 on Tue Feb 23, 2010 8:01 am

I'm trying to do something quite similar.

I'm trying to obtain this result : <p><span class="class1">Text</span> Text <span class="class2">Text</span></p>

How can I do to make it possible on select part of my text in my <p> tag and apply this on click on the name class in the right panel?

Thx for help
iUser59
 
Posts: 2
Joined: Mon Feb 22, 2010 5:41 pm

Re: How to do underlining?

Postby stevennwhite on Fri Feb 26, 2010 7:42 pm

stevennwhite
 
Posts: 1
Joined: Fri Feb 26, 2010 7:05 pm
Location: us

Re: How to do underlining?

Postby christracy123 on Fri Mar 26, 2010 12:37 pm

Thanks for the example! Thanks to these links! :)
Being stressed out and overweight may not be YOUR fault! It's true, a mysterious condition might be to blame. An estimated 70-80% are suffering from this condition, and don't even know it!

http://www.howtocurecandida.com/survey/
christracy123
 
Posts: 6
Joined: Sat Jan 23, 2010 6:04 am


Return to Support

Who is online

Users browsing this forum: No registered users and 2 guests

cron