Coder Social home page Coder Social logo

standoff-properties-editor's People

Contributors

argimenes avatar kuczera avatar mrckzgl avatar nichtich avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

standoff-properties-editor's Issues

selection detection / handling issues

Preface

Hi, first thanks for this great library and the extensive work which was put in. Also of course thanks for making it publicly available. I am working on a small annotation tool which incorporates your library. We only use the Editor class of your library. There are some caveats which we detected and for some I also found workarounds and fixes, which I'd like to contribute upstream. So, if things work well there might be issue reports and also pull requests following :-)

Issue

I've noticed that selected nodes detection does not work correctly in all cases in Firefox. This is due to https://bugzilla.mozilla.org/show_bug.cgi?id=957724#c10
In contrast to chromium, in ff, depending where a user clicks it might be the case that the selection range starts at the span previous to the first selected char with startOffset = 1 (instead of the start span with startOffset = 0). This can be reproduced by double clicking a word in the editor and then add an annotation. The annotation will include the spaces surrounding the word.

I will attach a pull request to fix this. The pull request also fixes that getSelectionNodes() will crash if selection is outside of editor div or if the selection is empty. In the project we develop we need to detect if selection is cleared. Currently the Editor does not notify the selectors in that case. It would be nice if this could be added. I am happy to include this into the pull request (don't know if this has any side effects to the other parts of the library which I don't use, hence I didn't include this for now)
To fix that, I simply call updateSelectors() in any case in handleMouseUpEvent() and let updateSelectors() also notify the selectors if selection is null.

best
Martin

Support for Arabic text

This is really an impressive standoff editor, and I'm looking forward to exploring it more thoroughly. Just as an initial test, I tried typing the Arabic word اختبار ("test") in the demo, and it looks like this:

screenshot 2019-02-05 at 18 40 39

RTL text would need to be represented using the HTML dir attribute (see Structural markup and right-to-left text in HTML).

Also, Arabic letters have to be joined together. Putting each character in a separate <span> seems to breaks the joining of letters, but I've read that this can be solved by adding a zero-width joiner Unicode character.

How easy do you think it would be to do this? I would be glad to try to help, with some guidance.

Add TEI annotation layer

Can we add a new annotation layer for layout in TEI:
tei/layout/emph rend=”red” [red text]
tei/layout/expan abbr="" [blue text]
tei/layout/corr sic="original" [green underline]
tei/layout/del cause=“moved“, rend=”striked out”, unit="line" quantity="2" [striked out]
tei/layout/add place="margin, above etc." [orange text]
tei/layout/gap reason=“not readable“ [underlined white space]
tei/layout/surplus [brown underline]

Monitor: compress annotation label space

Annotation labels can be quite long as they include the name, attributes, and action buttons: consider putting everything to the right of the name into a container that can be toggled in and out.

Add 'text' modal for TEI demo

Copy across the code from Codex to load 'text' annotations (e.g., note, del, add, etc.) into a SPEEDy modal window.

Bug: navigation with ZPAs

Moving a ZPA with the left/right arrows results in the adjacent text being swallowed up into the ZPA text, rather than the ZPA itself being moved.

Import HTML

Use sanitize-html to reduce HTML to a restricted set of tags, attributes, and styles, possibly add whitespace normalization, extract the plain text and map HTML tags to a list of properties. This feature would also allow pasting styled text (e.g. from Word or Google Docs) into the editor.

Feature: Make characters ignored by speedy configurable

In our project, we need to handle the newline characters similar as all other characters are handled by speedy.
Currently, it is hardcoded that newline characters will be skipped while processing text.
It would be nice to make this configurable.
I've therefore created already a pull request: #29

the-codex

You can add a link to codex in the README ?

Support for combining characters

The way I usually type an accented character (on macOS with the British keyboard) is that I first type the accent, then the character it will combine with. For example, to get ü, I type Alt-U to get the umlaut, then 'u'.

If I do this in the editor demo, something strange happens. Starting with an empty editor window, I type the umlaut, and this appears:

screenshot 2019-02-20 at 13 52 17

Then when I type the 'u':

screenshot 2019-02-20 at 13 56 29

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.