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

Tags with attributes and insert at cursor

Discuss features, code, contributions, ideas, suggestions, ...
For bugs, patches and feature requests, please post on the Trac:
http://trac.wymeditor.org/

Tags with attributes and insert at cursor

Postby Surt on Wed Sep 03, 2008 8:36 am

Hi all,

looking at the subversion last branch for the new sapi, will be really useful to make some things:
1.- i was wondering about the issue 18 to create tags with some attributtes, like title, cite, etc
2.- i was triying to add a new button with an "insert at cursor position" to create a <q>Write here your Inline quote</q> but no way, i can't get caret position and insert at it.

at this moment all i need is the second one. Just click a button wich inserts a html tag with content "<q>Write here your Inline quote</q>" but i want it at cursor position. At this moment i can add the string to the end of the actual container (.prev().append), even create a new container and add the string. But i want to write the string at cursor position, because my users will add text from word and then they will try to add quotes, cites, etc... after paste the text, so they will select position and click on the "cite" button to add at the position.

I was looking on the forum and i know that the only way, at this moment, is to go back to the 0.2 version with the insertatposition function. I was triying to add that function plus getCaret at version 0.5 but i can't because is difficult for me to translate from the 0.2 architecture to 0.5 one :(

So, any help will be welcome.

P.D. Good Editor anyway, and will be really better with some things i saw at 0.6 beta

Please, forget my english :)
Surt
 
Posts: 4
Joined: Tue Sep 02, 2008 5:11 pm

Re: Tags with attributes and insert at cursor

Postby Surt on Wed Sep 03, 2008 10:01 am

Trying to get Superscript and Subscript feature to repeat it to enclose selected text on a tag but i can't find it.
ok, 'Subscript' and 'Superscript' are execCommand :(

There is some sapi functions on the script but i can't find the way to make it works to insert string into cursor position.
Surt
 
Posts: 4
Joined: Tue Sep 02, 2008 5:11 pm

Re: Tags with attributes and insert at cursor

Postby onip on Thu Sep 04, 2008 3:07 pm

I think (I'm still testing on this) that you could get a Range object and then use Range.insertNode() method.

Code: Select all
if ( wym._iframe.contentWindow.getSelection )
   {
      var selectedRange = wym._iframe.contentWindow.getSelection().getRangeAt(0);
   }
   else if ( wym._doc.selection )
      var selectedRange = wym._doc.selection.createRange();

   selectedRange.insertNode( jQuery('<span>').addClass('foo').html('bar')[0] );


you could test if selection is a 'single point' one (start and end are the same) with the selectedRange.collapsed property.
I've just stumbled upon Ranges (stilll learning js ) and so i don't know its crossbrowser support status (i've tested similar code with ff3 only)

A pair of usefull links
http://www.quirksmode.org/dom/range_intro.html
http://www.wrox.com/WileyCDA/Section/Ja ... 92301.html
User avatar
onip
 
Posts: 5
Joined: Tue Sep 02, 2008 1:11 pm

Re: Tags with attributes and insert at cursor

Postby Surt on Mon Sep 08, 2008 12:15 pm

Hi, thx onip,

i finally did this, taking code from a french post in this forum:

Code: Select all
WYMeditor.editor.prototype.cite = function() {
   var jqexpr = 'cite';
   var sClass = 'footnote';
    var container = (this._selected_image ? this._selected_image : jQuery(this.selected()));
   
   //area selected on most browsers
   if (window.getSelection){ //FF
      sel=this._iframe.contentWindow.getSelection();
   }else{ // IE
      var sel =  this._doc.selection;
      rng = sel.createRange();
      rng.select();
      sel=rng.text;
   }

   // if selected area is a <cite> tag
   if (this.selected().tagName!="cite" && jqexpr=="cite" && sel!=""){
      if (window.getSelection && sel!=""){ //FF
         this._doc.execCommand("inserthtml", false, "<cite class=\""+sClass+"\" title=\""+sel+"\">note</cite>");
      }else if(sel!=""){ // IE
         try {  this._doc.selection.createRange().pasteHTML(" <cite class=\""+sClass+"\" title=\""+sel+"\">note</cite> &nbsp;");} catch (e) { }
      }
    }
    else if(this.selected().tagName!="cite" && jqexpr=="cite"  && sel!="") {
      //alert("1236: DELETE cite");
      if (window.getSelection){ //FF
         this._doc.execCommand("inserthtml", false, sel);
      }else{//IE
         this.selected().removeNode(true); //cite
         try { this._doc.selection.createRange().pasteHTML(sel); ok=1;} catch (e) { }
      }
    }
};



it works ok at this moment, what i do is:
get selected text and make it TITLE of a <cite> tag, cite tag content converts to "note".
example: <cite title="this is the selected text">note</cite>

i am still triying to unset cite tag if i click again on the button.
Surt
 
Posts: 4
Joined: Tue Sep 02, 2008 5:11 pm


Return to Developers

Who is online

Users browsing this forum: No registered users and 3 guests