Create custom Range in Word Javascript API / Office.js - javascript

I understand that many methods of the Word Javascript API return a Range or RangeCollection. But, is there a constructor function developers can use to create a new Range directly?
My use case is that I need to look at each paragraph, identify errors, and syntax highlight them. So, I'd like to just get the plain text of the paragraph using the API, find the errors on my own, and then use that information to create a Range that I can use to decorate the text (or add a Bounday/ContentControl to refer to it later).

there are a couple of options for you.
a. Use search - you can scope it to the paragraph. You can also use range.compareLocationWith to compare if the found range is the same and remove dupes. So the idea is you grab a paragraph, analyze, find an issue, do a search to get the range (and make sure is the range you need). Once you have a range you can apply formatting, insert content controls or insert, replace content.
b. Use split - is a method you can use to decompose a paragraph into words (each a range).
c. ExpandTo - to extend a given range to another.
d. on any object you can use .getRange() to get its associated range.

Related

How to set filtering by the combination of letters?

I'm using Webix and I need to customize suggest in the сombo box.
As I can see, basically suggest filter provides to search by the first letters, but I need more flexible search function in my app.
Is it possible to set filtering by the combination of letters located anywhere in the word or phrase?
Perhaps webix functionality is not possible, what I did was do the search using like SQL.
Window, text, combo, button and list

Grabbing the sentence that a selected word appears in

Using Javascript, I need to allow a user to double click a word on a page and retrieve the sentence that it appears in. Not just any sentence, but that specific one. I've toyed with retrieving all sentences that that word appears in and somehow choosing the correct sentence, so maybe that's an option.
I've scoured the web looking for this beast, and I've thought a lot about it. Some have recommended using Rangy but I haven't been able to find the functionality I'm looking for, or even functionality that would help me get where I need to be.
Any ideas?
You could turn your page into one or multiple read-only textareas, use clever CSS styling to mask it, then use the onselect event as described here: Detect selected text in a text area with javascript
Depends of course, how your page looks like and where it's used.

Javascript, Text Annotations and Ideas

I am very curious to hear input from others on a problem I've been contemplating for some time now.
Essentially I would like to present a user with a text document and allow him/her to make selections of text and annotate it. Specific to the annotations I aim to achieve the following:
Allow users to make a text selection, annotate it, then save the selection and annotation for reference later
(UI) Support representing overlapped annotations. For example if the string where: "This is the test sentence for my example test sentence", user1 might have an annotation on "is the test sentence for my example" and user2 might have an annotation on "for my example".
Account for a situations where the document's text changes. The annotations would to be updated, if possible.
How would you tackle this from a technical perspective?
Some ideas I've had are:
Use javascript ranges and store an annotation as a pair of integers something like: (document_start_char, document_end_char). Save this pair in the db.
Alternatively, using JS get the text selected and actually save the full text in the db. (not sure how i would then do overlapping annotations)
Represent overlapped annotations by applying a css style to highlight the text then darken the "stack" of annotations where they overlap. Smallest annotation would always have to be on the top of the "stack".
What are your thoughts or areas of improvement? How the heck could i support a document's text being updated without breaking all the annotations?
I'm researching this same question and personally I favor staying away from rolling my own, in favor of an existing open source library like Annotator.
http://mark.koli.ch/2009/09/use-javascript-and-jquery-to-get-user-selected-text.html (404 response)
http://mark.koli.ch/2009/09/05/get-selected-text-javascript.html- (404 response)
Getting the selected text is really easy. Storing it (or its starting/ending points) is also a joke. But what about your point number 3? What if the text changes?
If the text changes, both the original text and the original selection coordinates you stored won't equal the current modified text. You should be aware of the annotations present in the text document, so that everytime it changes, the annotations referencing to that particular piece of changed text should be updated, or deleted (maybe after a quick comparison between the before and after text: are some words missing? or just some words have been corrected?), but this seems really a struggling task.
I think storing the entire text annotation in a db is essential, to avoid it being changed and the annotation lost. This way you will still have the complete text you annotated. Then you should also use a sort of flag to indicate the start character of the annotation, and if the text changes, you could calculate the difference in characters from the document text before the change, and the one after it, and find this way the new starting point of the original annotation (assuming the annotation part of the document text has't changed).
Dividing the text document in as many paragraphs as possible should also help, this way you could separate different pieces of the document and work on one by one.
Now I would really like to see it done! :)

How do I format an HTML text field to use multiple styles?

I'm looking for a way to apply some formatting to a single-line text input field in JavaScript. It would work like this:
The user types in a formula, such as:
(7 + 3) ^ x
As the user types, my code would format it using colour to look like this:
I can do the necessary parsing but I don't know how to apply these styles to the user's text as they edit.
I've been struggling to find the right thing to Google for. My searches mostly lead me to full-blown text editors.
Is there such a component? If not, can I achieve this with a <input type="text"...> field?
Out of curiosity I built this: http://jsfiddle.net/hunter/npbDL/
This catches key strokes and inserts a span-wrapped character into an element. If the character maps to an item in the character-to-class collection it also gives that span the class specified.
It also handles enter and backspace.
You can probably take it from there...
I think the only way you can achieve the styling you want is by wrapping HTML tags around individual characters then styling the tags, and I don’t think you can do that inside an <input type="text">.
There is the widely-supported contenteditable attribute which makes most elements editable, but I’m not sure that it allows this either. If no-one else provides a better answer, you might want to view source on the last example here: http://www.hyperwrite.com/Articles/contenteditable.aspx
You can't format a text field with various colors. You might be able to use colors in WYSIWYG editors... or Flash.
I don't think you can change of individual characters in any <input> nor <textarea>. Look into source code of Etherpad for example - it uses similar system (not exactly the same - it highlights other stuff) and it might help you.

In BIRT, how do I access an arbitrary data set from JavaScript?

I am building my first report in BIRT.
Very quickly I ran into a problem in which I wanted to display some text or data based on an expression that included data from two different tables (not tables that can/should be joined - (hypothetically example- take a student's ACT score from his record in the student table and compare it against the statistics table's entry for ACT statistics). I soon realized that a data element has to be bound to a dataset (only one of them.)
I found a similar question in the BIRT mailing list which helped me get to a solution - I can bind an individual data element to a different dataset, but it can still access the elements of its container. I can send a parameters to the dataset that the element is bound to (e.g. "ACT" in the example I mentioned above).
Eventually however, I came to a place where I needed to use data from three different tables. I am stuck here, and I'm assuming that there is a way to do this through the scripting abilities, but I have yet to see in the documentation a way to extract data from a data set - everything I have dealt with so far is associated with binding a report element to a dataset.
To be clear, I have seen that I can add JavaScript functions to the initialize section of the top level report (and call them from an expression in a data element) but I don't see how in a script I can query any of my datasets -- as opposed to only interacting with the dataset bound to my data element).
How can I access an arbitrary (though already defined) data set from JavaScript in BIRT? (Or how can I access more than two datasets from an element - one that it is bound to, and one that its container is bound to?)
I have not tried to do this for a while. The immediate answer that pops to mind is that you need to put the third data set into a table (can have visibility set to false) and you would need to populate the table values to a GlobalValue. Then you could get at the GlobalValues from the data control through script.
I know that it is not pretty. I will have a look over the weekend and see if 2.3 has added any functionality that makes this easier.
Use the this.getValue() which will return the current column's binding value instead of dataSetRow["RUN"]

Categories

Resources