Bookmarklet copy & paste that preserves formatting

[Amir Michail]

Hi,

I would like to add a submission bookmarklet to my app that takes the
current selection and pastes it into the app's rich text editor while
preserving formatting. It should work in at least Firefox & IE.

Any pointers on how this could be done? Are there any examples that I
can look at?

Amir

[scripts.contact]

On Jun 5, 3:25 pm, Amir Michail <[e-mail]:

Hi,

I would like to add a submission bookmarklet to my app that takes the
current selection and pastes it into the app's rich text editor while
preserving formatting. It should work in at least Firefox & IE.

use
getSelection().getRangeAt(0).cloneContents();
to clone the contents of current selection then append it to your rte.

if you want the HTML then append the cloned contents to an element
(e.g. div) and use innerHTML property to get the HTML

[-Lost]

scripts.contact wrote:

On Jun 5, 3:25 pm, Amir Michail <[e-mail]:

>Hi,

I would like to add a submission bookmarklet to my app that takes the
current selection and pastes it into the app's rich text editor while
preserving formatting. It should work in at least Firefox & IE.

use
getSelection().getRangeAt(0).cloneContents();
to clone the contents of current selection then append it to your rte.

if you want the HTML then append the cloned contents to an element
(e.g. div) and use innerHTML property to get the HTML

OK, since *you* brought it up. ;)

Can you explain what the hell a range is for?

Why would you need to addRange?

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.

[-Lost]

-Lost wrote:

scripts.contact wrote:

>On Jun 5, 3:25 pm, Amir Michail <[e-mail]:

>>Hi,

I would like to add a submission bookmarklet to my app that takes the
current selection and pastes it into the app's rich text editor while
preserving formatting. It should work in at least Firefox & IE.

use
getSelection().getRangeAt(0).cloneContents();
to clone the contents of current selection then append it to your rte.

if you want the HTML then append the cloned contents to an element
(e.g. div) and use innerHTML property to get the HTML

OK, since *you* brought it up. ;)

Can you explain what the hell a range is for?

Why would you need to addRange?

I have thought on this some, and think I may have an example of its usage.

Let's say you provide the user with the ability to click multiple
paragraphs and do something with them.

You would need to addRange on a per-paragraph basis, right?

Jeez, I gotta' stop replying to myself.

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.

[scripts.contact]

On Jun 5, 3:25 pm, Amir Michail <[e-mail]:

Hi,

I would like to add a submission bookmarklet to my app that takes the
current selection and pastes it into the app's rich text editor while
preserving formatting. It should work in at least Firefox & IE.

use
var c=getSelection().getRangeAt(0).cloneContents();
method to clone the contents of current selection then append it
anywhere using appendChild(c).

If you wand to get the HTML of selection then just append the content
in a DIV and use innerHTML property

[Amir Michail]

On Jun 8, 5:20 am, "scripts.contact" <[e-mail]>
wrote:

On Jun 5, 3:25 pm, Amir Michail <[e-mail]:

Hi,

I would like to add a submission bookmarklet to my app that takes the
current selection and pastes it into the app's rich text editor while
preserving formatting. It should work in at least Firefox & IE.

use
var c=getSelection().getRangeAt(0).cloneContents();
method to clone the contents of current selection then append it
anywhere using appendChild(c).

If you wand to get the HTML of selection then just append the content
in a DIV and use innerHTML property

I still don't understand the mechanism for copying the selection to
a RichTextArea widget in a gwt app via a bookmarklet.

Clicking on a bookmarklet normally redirects to an app url along with
some additional parameters added.

So maybe I need to get the selection as html first and add that html
to the
end of the url? Or is there some other way?

Amir

[scripts.contact]

On Jun 8, 7:30 am, Amir Michail <[e-mail]:

>
I still don't understand the mechanism for copying the selection to
a RichTextArea widget in a gwt app via a bookmarklet.

try this :
<script>
function copyCont(){
var ifr=document.getElementById("s");

ifr.contentDocument.body.appendChild(getSelection( ).getRangeAt(0).cloneContents())
}
</script>
<iframe id="s" onload="this.contentDocument.designMode='on';"></
iframe>
<div>content<bcontent</b<icontent</i></div>
<button onclick="copyCont()">Copy contents of selection in IFRAME</
button>

Clicking on a bookmarklet normally redirects to an app url along with
some additional parameters added.

So maybe I need to get the selection as html first and add that html
to the
end of the url? Or is there some other way?

what is the URL ?

[Amir Michail]

On Jun 8, 3:35 pm, "scripts.contact" <[e-mail]>
wrote:

On Jun 8, 7:30 am, Amir Michail <[e-mail]:

I still don't understand the mechanism for copying the selection to
a RichTextArea widget in a gwt app via a bookmarklet.

try this :
<script>
function copyCont(){
var ifr=document.getElementById("s");

ifr.contentDocument.body.appendChild(getSelection( ).getRangeAt(0).cloneContents())
}
</script>
<iframe id="s" onload="this.contentDocument.designMode='on';"></
iframe>
<div>content<bcontent</b<icontent</i></div>
<button onclick="copyCont()">Copy contents of selection in IFRAME</
button>

The gwt app may not be open when the user clicks on the bookmarklet.

Moreover, if the bookmarklet opens it and tries to access the rich
text editor therein, won't that be a security violation?

Clicking on a bookmarklet normally redirects to an app url along with
some additional parameters added.

So maybe I need to get the selection as html first and add that html
to the
end of the url? Or is there some other way?

what is the URL ?

This is for my Study Stickies gwt app:

http://studystickies.com

Currently, the bookmarklets look like this (but they do not preserve
formatting in selections):

Add Resource
============

javascript:t=document.title;u=document.location.hr ef;s=(document.getSelection)?
document.getSelection():document.selection.createR ange().text;location.href='http://
studystickies.com#?cmd=add_resource&title=' + encodeURIComponent(t)
+'&url='+encodeURIComponent(u)+'&selection='+encod eURIComponent(s);

Add Sticky
==========

javascript:t=document.title;u=document.location.hr ef;s=(document.getSelection)?
document.getSelection():document.selection.createR ange().text;location.href='http://
studystickies.com#?cmd=add_sticky&title=' + encodeURIComponent(t)
+'&url='+encodeURIComponent(u)+'&selection='+encod eURIComponent(s);

Amir