rangy

I'm trying to create a typeahead code to add to a wysihtml5 rich text editor. Basically, I need to be able to insert People/hashtag references like Twitter/Github/Facebook... do. I found some code of people trying to achieve the same kind of thing. http://jsfiddle.net/A9z3D/ This works pretty fine except it only do suggestions for the last word and has some bugs. And I want a select box like Twitter, not a simple "selection switching" using the tab key. For that I tried to detect the currently typed word. getCurrentlyTypedWord: function(e) { var iframe = this.$("iframe.wysihtml5-sandbox").get

I'm trying out the latest version of the "rangy" jQuery plugin (1.2 beta) to set the caret in a contenteditable DIV with a specific offset. However, it responds with a weird error in Firefox: Security error" code: "1000 Here is the offending code: var el = $("#editablediv"), index = 11; var range = rangy.createRange(); range.setStart(el, index); var sel = rangy.getSelection(); sel.setSingleRange(range); The code fails when calling the setStart function. Could anyone give an example of the proper usage of rangy please? I found the issue, I was supposed to pass through the correct node which is

What I am trying to achieve I am building input-like content editable div. You are supposed to click some tags outside the div to add them inside the div while also being able to type around said tags. The problem and how to reproduce it I am using user-select: none (normal and webkit) to keep tag buttons from being selected, therefore losing my caret's position. It works in Firefox and Chrome but not in Safari (I aware of the -webkit- prefix and using it). Here is a fiddle where you can reproduce the problem. What I've tried The root of my problem was maintaining the caret's position while

Here is what I am trying to accomplish: When a user uses a mouse, keyboard, or touch to select text inside "myDiv" I want to acquire three discreet chunks of HTML: the HTML before the selection (to the "left" of it), the HTML inside the selection, and the HTML after the selection (to the "right" of it). The html should be as it would appear with myDiv.innerHTML. The selection might start or end inside a tag pair (i.e., the isolated selection isn't necessarily valid HTML). I don't need to deal with special scenarios like absolute-positioned elements within the selection; all of the selections I

I have a jsfiddle here - http://jsfiddle.net/88em6qq9/ - where I'm trying to add <h1> tags around a selection of the entire line: "Here is some content and here too" Selecting the entire line and releasing the mouse button goes into the handler but rounding off the start and end end points with setStartBefore() and setEndAfter() gets me to different start and end containers, so the surround doesn't work. If I put "Here is some content" in its own <span> - see http://jsfiddle.net/88em6qq9/1/ - then we round to the same container and the h1 insert does work. But I need a solution that puts <h1>

What does this error mean in IE10/11: Error: Could not complete the operation due to error 800a025e. And how would I debug it? It says its this line: this.nativeSelection.removeAllRanges(); https://code.google.com/p/rangy/source/browse/trunk/src/js/core/wrappedselection.js#416 See it in action here: http://panmedia.github.io/raptor-editor/tests/cases/selection/selection-expand.html I had this error coming up recently, I fixed it with the following chceck: var sel = window.document.getSelection(); if (sel.rangeCount > 0 && sel.getRangeAt(0).getClientRects().length > 0) { sel.removeAllRanges();

I am making use of a contenteditable div in combination with the rangy Javascript library to insert HTML at the cursor position. End of the day the contents of the div commonly looks like: <div contenteditable="true"> "Hello " <button contenteditable="false" data-id="147">@John Smith</button> " " </div> Users get suggested upon pressing '@' and get subsequently inserted as a button when selected (ala Google Plus). I also insert a   after this button. The button gets removed in Chrome/Safari/Firefox when you hit backspace (after first removing the   ), but not in IE8. In IE8 the cursor merely