SUI.control.PasteData

The SUI.control.PasteData is a part of the HTML editor that deals with pasting data. We want to offer different ways of pasting text: plain text, filtered (just a limited set of tags and attributes) or with all markup.

The latter case is obviously very simple: that is how normal pasting works, but is not what we prefer as standard actions. We want to remove all useless and interfering markup that editors as Word use.

Since we're not allowed to access the paste buffer using JavaScript we fool the browser here. When pasting we direct the focus to an div element that we create for the purpose of intercepting the paste action. We use the 'onbeforepaste' (IE) and 'onpaste' (others) event handlers to do that.

We also monitor the key strokes and if we discover that there is data to paste we finish the paste action by cleaning the pasted data using the requested method and inserting it into the content.

Defined in: control/PasteData.js


Constructor summary

Attr. Name / Description
private

SUI.control.PasteData(arg)

The SUI.control.PasteData implements the pasting logic for the HTML editor. It is a fundamental part of the HTML editor and therefore both are able to access each other's private data members.

Member summary

Attr. Type Name Description
private Object

_blockTags

Set of tag that should be terminated with a line break when converted to plain text.

private HTMLElementNode

_div

The offscreen div to paste the data to.

private SUI.control._HTMLEditControl

_editor

A reference to the editor object.

private boolean

_finishing

Flag to indicate that we're currently are busy with finishing a paste action.

private boolean

_intercepting

Flag to indicate that we're currently are busy with intercepting a paste action and that there is data ready to be inserted.

private String

_pasteMethod

The paste method to use: 'text', 'filtered' or 'html'

private Object

_saveRange

The stored range (or bookmark in IE) to be able to restore the cursor position after the editor focus was moved to the offscreen div.

private int

_scrollTop1

One of the scroll tops to save (and restore) if the document scroll offset changes when the helper div is created and removed.

private int

_scrollTop2

One of the scroll tops to save (and restore) if the document scroll offset changes when the helper div is created and removed.

private Object

_tagFilter

Set of allowed tags an allowed attributes for tag filtering.

Method summary

Attr. Type Name / Description
private

_createPasteDiv()

Create an offscreen div as target for the paste actions so that we can access and process the data.

private

_filter()

Filter all unwanted tags and attributes from an HTML text string.

private

_filterClass(nd, cls)

When filtering (actually transfering) CSS class names keep the scrivo system styles.

private

_filterTags(src, dest)

Copy an HTML DOM sub tree from a HTML element to an other empty element node. And while doing so forget all unwanted tags and attributes, thus in effect filter the tree.

private

_finishPaste()

Finish a pending pasting action: filter out unwanted tags from the pasted data, remove the helper div and insert the cleaned data in the correct location of the document in the editor.

private

_finishPasteIE()

Finish a pending pasting action: filter out unwanted tags from the pasted data, remove the helper div and insert the cleaned data in the correct location of the document in the editor. This method is of course specific to IE.

private

_interceptPaste()

In order to manipulate the paste buffer we need to intercept the paste action. Therefore we create an offscreen contenteditable div that gets the focus over the editor's contenteditable. On a later moment we use 'finishPaste' to manipulate the pasted data and insert it into the editor.

private

_interceptPasteIE()

In order to manipulate the paste buffer we need to intercept the paste action. Therefore we create an offscreen contenteditable div that gets the focus over the editor's contenteditable. On a later moment we use 'finishPaste' to manipulate the pasted data and insert it into the editor. This method is of course specific to IE.

private

_toText(src, dest, prev)

Convert HTML that was filtered using the _filterTags method to plain text.

public

finishPaste()

The listener method to use on the 'keyup' event handler of the HTML editor to finish an intercepted the paste actions. If it is detected that there is data to be pasted the data will we cleaned using the currently set paste method and inserted into the content.

public

interceptPaste()

The listener method to use on the 'onbeforepaste' (IE) and 'onpaste' (others) event handlers to intercept the paste actions. If the paste method was set to 'html' the method returns true so that pasting will continue as default. In the case of 'text' or 'filtered' the data will be pasted to an offscreen div to process it by finishPaste later.

public String

pasteMethod(p)

Get or set the paste method to use when pasting.

 


Constructor

private SUI.control.PasteData( object arg)

The SUI.control.PasteData implements the pasting logic for the HTML editor. It is a fundamental part of the HTML editor and therefore both are able to access each other's private data members.

Parameters:

Name Type Description
SUI.control._HTMLEditControl arg.editor A reference to an instance of the SUI.control.HTMLEditControl.

Members

private Object _blockTags

Set of tag that should be terminated with a line break when converted to plain text.

private HTMLElementNode _div

The offscreen div to paste the data to.

private SUI.control._HTMLEditControl _editor

A reference to the editor object.

private boolean _finishing

Flag to indicate that we're currently are busy with finishing a paste action.

private boolean _intercepting

Flag to indicate that we're currently are busy with intercepting a paste action and that there is data ready to be inserted.

private String _pasteMethod

The paste method to use: 'text', 'filtered' or 'html'

private Object _saveRange

The stored range (or bookmark in IE) to be able to restore the cursor position after the editor focus was moved to the offscreen div.

private int _scrollTop1

One of the scroll tops to save (and restore) if the document scroll offset changes when the helper div is created and removed.

private int _scrollTop2

One of the scroll tops to save (and restore) if the document scroll offset changes when the helper div is created and removed.

private Object _tagFilter

Set of allowed tags an allowed attributes for tag filtering.


Methods

private _createPasteDiv()

Create an offscreen div as target for the paste actions so that we can access and process the data.

private _filter()

Filter all unwanted tags and attributes from an HTML text string.

private _filterClass( HTMLElementNode nd, String cls)

When filtering (actually transfering) CSS class names keep the scrivo system styles.

Parameters:

Name Type Description
HTMLElementNode nd The target node.
String cls The class name to strip the non scrivo class selectors from.
private _filterTags( HTMLElementNode src, HTMLElementNode dest)

Copy an HTML DOM sub tree from a HTML element to an other empty element node. And while doing so forget all unwanted tags and attributes, thus in effect filter the tree.

Parameters:

Name Type Description
HTMLElementNode src An source node containing a an HTML fragment to filter.
HTMLElementNode dest An empty target node.
private _finishPaste()

Finish a pending pasting action: filter out unwanted tags from the pasted data, remove the helper div and insert the cleaned data in the correct location of the document in the editor.

private _finishPasteIE()

Finish a pending pasting action: filter out unwanted tags from the pasted data, remove the helper div and insert the cleaned data in the correct location of the document in the editor. This method is of course specific to IE.

private _interceptPaste()

In order to manipulate the paste buffer we need to intercept the paste action. Therefore we create an offscreen contenteditable div that gets the focus over the editor's contenteditable. On a later moment we use 'finishPaste' to manipulate the pasted data and insert it into the editor.

private _interceptPasteIE()

In order to manipulate the paste buffer we need to intercept the paste action. Therefore we create an offscreen contenteditable div that gets the focus over the editor's contenteditable. On a later moment we use 'finishPaste' to manipulate the pasted data and insert it into the editor. This method is of course specific to IE.

private _toText( HTMLElementNode src, object dest, bool prev)

Convert HTML that was filtered using the _filterTags method to plain text.

Parameters:

Name Type Description
HTMLElementNode src An source node containing a an HTML fragment to filter.
object dest An object containing a 'res' data member field.
bool prev Value to indicate that the line break should be appended before the new text will be added.
public finishPaste()

The listener method to use on the 'keyup' event handler of the HTML editor to finish an intercepted the paste actions. If it is detected that there is data to be pasted the data will we cleaned using the currently set paste method and inserted into the content.

public interceptPaste()

The listener method to use on the 'onbeforepaste' (IE) and 'onpaste' (others) event handlers to intercept the paste actions. If the paste method was set to 'html' the method returns true so that pasting will continue as default. In the case of 'text' or 'filtered' the data will be pasted to an offscreen div to process it by finishPaste later.

public String pasteMethod( String p)

Get or set the paste method to use when pasting.

Parameters:

Name Type Argument Description
String p <optional>
The desired method for pasting text: 'text', 'filtered' or 'html' (or none to use this method as a getter).

Returns:

String The current paste method setting (or null if this method was used as a setter).