convergencelabs / ace-collab-ext Goto Github PK

I am getting this error when i use radar view

AceRadarView.ts:31 Uncaught TypeError: Cannot read properties of null (reading 'style')

const radarView = new AceCollabExt.AceRadarView(
          'radar-view',
          aceEditor.current.editor.getSession()
        );

        const initialIndices =
          AceCollabExt.AceViewportUtil.getVisibleIndexRange(
            aceEditor.current.editor.getSession()
          );
        const initialRows = AceCollabExt.AceViewportUtil.indicesToRows(
          aceEditor.current.editor.getSession(),
          initialIndices.start,
          initialIndices.end
        );
        radarView.addView(user.userId, user.name, user.color, initialRows, 0);

markerLayer.elt is not a function.
When this function is executed ,curMgr.addCursor("uid1", "User 1", "orange", {row: 0, column: 10});

Typescript definitions would be a benefit to consumers of this library.

We are currently webpacking the common js module. This is not necessary at all.

Ace builds is now webpackable, and brace is not keeping up with ace versions.

https://examples.convergence.io/ace/index.html

Perhaps publish it to Github pages?

currently am using angular 6 . when i try npm install --save-dev @convergencelabs/ace-collab-ext

"npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@convergencelabs%2face-collab-ext - Not found
npm ERR! 404
npm ERR! 404 '@convergencelabs/ace-collab-ext@latest' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:
"
please check

@ajai06 Reported that there was an errant import on in the AceRadarView class in the 0.4.0 release.

i'm looking to integrate collaborative plugin (npm install --save-dev @convergencelabs/ace-collab-ext) with angular 6's ng2-ace-editor(version 3.9). Package successfully imported but ends with an error message when trying to call
const curMgr = new AceCollabExt.AceMultiCursorManager(this.editor._editor.session); curMgr.addCursor("uid1", "User 1", "orange", {row: 2, column: 2});
ng2-ace-editor is using brace for ace editor configuration. Is there any version mismatch? How can i rectify this. Could you please help me where i have gone wrong.

ng2-ace-editor is using brace for ace setup. how can i update this

Add a tooltip to the cursor on movement of the cursor.

Currently the AceMultiCursorManager and AceMultiSelectionManager are currently constructed with the Ace Editor like so:

var editor = ace.edit("editor");
var curMgr = new AceCollabExt.AceMultiCursorManager(editor);
var selMgr = new AceCollabExt.AceMultiSelectionManager(editor);

This means that you have to created the editor first, which usually causes a render. Users may wish to initialize the edit session first and set up the cursors and selections before rendering. So these should take the edit session instead. Like so:

var editor = ace.edit("editor");
var curMgr = new AceCollabExt.AceMultiCursorManager(editor.getSession());
var selMgr = new AceCollabExt.AceMultiSelectionManager(editor.getSession());

Hello! I was going through the example, and then looked into the index.html, file. There is this import, as shown below,

This is a relative import from the root from the repository, but I don't see a dist directory. In the same file, just above this, there is also this stylesheet import,

This now maps to ../src/css/ace-collab-ext.css , but I was unable to resolve this as the same as with the first example. There is no umd directory. There is no ace-collab-ext.js under the ts directory as well.

Thanks!

The index is being transmitted to connected clients. The setup I have now is basically identical to the example. If you look at the "set" listener, both reference.sessionId() and reference.value() are correct. I followed the code and the index (reference.value()) gets converted to the {row,col} formatted properly. This makes it all the way to the addDynamicCursor. So I have no idea where it goes wrong.

I would like to add that I am using react-ace.

const cursorKey = "cursor";
let cursorReference = null;
let cursorManager = null;

const initSharedCursors = (textModel) => {
  cursorManager = new AceCollabExt.AceMultiCursorManager(editor.getSession());
  cursorReference = textModel.indexReference(cursorKey);

  const references = textModel.references({ key: cursorKey });
  references.forEach((ref) => {
    if (!ref.isLocal()) addCursor(ref);
  })

  setLocalCursor();
  cursorReference.share();
  
  editor.getSession().selection.on('changeCursor', () => setLocalCursor());
  
  textModel.on('reference', (e) => {
    if (e.reference.key() === cursorKey) addCursor(e.reference);
  });
}

const setLocalCursor = () => {
  const position = editor.getCursorPosition();
  const index = doc.positionToIndex(position);
  cursorReference.set(index);
}

const addCursor = (reference) => {
  const color = colorAssigner.getColorAsHex(reference.sessionId());
  const remoteCursorIndex = reference.value();
  
  cursorManager.addCursor(reference.sessionId(), reference.user().displayName, color, remoteCursorIndex);
  
  reference.on("cleared", () => cursorManager.clearCursor(reference.sessionId()));
  reference.on("disposed", () => cursorManager.removeCursor(reference.sessionId()));
  reference.on("set", () => {
    cursorManager.setCursor(reference.sessionId(), reference.value())
  });
}

The marker API changed in ACE 1.4.0.

ajaxorg/ace#3874

Update to work with this new version.

I've been playing with the Ace demo. I notice when collaborating if you press undo it undoes the other user's changes, which would be confusing when collaborating.

I also observed the following.
user 1: enter 'a', press undo. 'a' disappears as you would expect.
user 2: press undo. 'a' reappears.