I'm looking for a way to show markups when not in editMode. I want to be able to draw markups in the viewer while at the same time being able to use edit2D. Everytime I call leaveEditMode() on the markups extension, the markups disappear. If there was just a way to have them always showing even when not in edit mode, that would do the trick. I have seen stuff about a view mode but the enterViewMode() must be outdated as I cannot find it.
Another option would be to leave edit mode on in the markups extension and also use the edit2D tools simultaneously by changing which drawing layer/canvas is on top? I have no idea if that's possible or how to go about it though.
Any ideas would be helpful!
Okay so I figured out a way, I'm not sure what the repurcussions would be, but it seems to work.
Here's an edited code snippet I threw together quick to test and it seems to work. Basically I do the opposite of what enterEditMode() and leaveEditMode() already do. Basically markupsExtension.editModeSvgLayerNode holds the svg data for all the markups. When leaveEditMode() is called, it clears out markupsExtension.svg. So I just add it back after it's called manually. I also clear it out before re-entering because it does it on it's own and it might interfere.
if (buttonName === 'markup') {
let markupsExtension = this.viewer.getExtension('Autodesk.Viewing.MarkupsCore');
if (this.selectedButton === buttonName) {
// Exit markups
markupsExtension.leaveEditMode();
// Shows the markup after leaving
if (markupsExtension.editModeSvgLayerNode.svg) {
markupsExtension.svg.appendChild(markupsExtension.editModeSvgLayerNode.svg);
}
}
else {
this.selectedButton = buttonName;
// Remove the svg set we added so it can redraw it in "enterEditMode()"
if (markupsExtension.editModeSvgLayerNode && markupsExtension.editModeSvgLayerNode.svg.parentNode) {
markupsExtension.svg.removeChild(markupsExtension.editModeSvgLayerNode.svg);
}
markupsExtension.enterEditMode();
}
}
Related
I'm trying to add a simple 'confirm to remove dialog' on my mxgraph based app, but can't keep the remove event from actually happening when I want to cancel it. So far, I'm listening to mxEvent.REMOVE_CELLS, in my simplest approach I tried something like:
graph.addListener(mxEvent.REMOVE_CELLS, (sender, evt) => {
evt.consume();
});
As far as I know, consume should keep the event from propagating, and as I understood to have effect at all, but the nodes are deleted no matter what. I even tried to undo immediatelly after the event, and still not working.
Is there even a straight forward way to keep an event from happening and apply a different logic instead
Finally, I ended up overriding mxGraph.removeCells to fire my own custom event, looks something like:
mxGraph.prototype.removeCells = function(cells, includeEdges) {
...
if (shouldntRemoveDirectly) {
this.fireEvent(new mxEventObject('beforeRemoveLoop', 'cells', cells, 'includeEdges', includeEdges));
return;
}
...
}
I am using the library dragula for doing some drag & drop stuff.
Dragula internally uses cloneNode(true) to create a copy of the dragged element that will be appended to the body to show the preview image while dragging.
Unfortunately, if dragging a polymer element, the bound data get's not cloned. By consequence the contents of the dragged element (e.g. <div>[[someString]]</div>) are empty.
Is there a solution for this?
I actually do not need the data to be bound for my element, it is just a "read-only" element that displays some data that does not change after being initialized. Is there maybe a way to somehow "resolve" the strings to the html without being bound anymore?
Thank you already!
Found a solution myself. You have to override the cloneNode method inside the polymer class:
cloneNode(deep) {
let cloned = super.cloneNode(deep);
for (let prop in MyClass.properties) {
cloned[prop] = this[prop];
}
return cloned;
}
I'm working on a web app and users sometimes paste in things they've copy/pasted from other places and that input may come with the character (0xAD). I don't want to filter it out, I simply need the user to see that there is an invisible character there, so they have no surprises later.
Does anyone know a way to make the always be visible? To show a hyphen, rather than remain hidden? I suspect a custom web font might be needed, if so, does anyone know of a pre-existing one?
You would need to either use JavaScript or a custom typeface that has a visible glyph for the soft-hyphen character. Given the impracticalities of working with typefaces for the web (and burdening the user with an additional hundred-kilobyte download) I think the JavaScript approach is best, like so:
document.addEventListener("DOMContentLoaded", function(domReadyEvent) {
var textBoxes = document.querySelectorAll("input[type=text]");
for(var i=0;i<textBoxes.length;i++) {
textBoxes[i].addEventListener("paste", function(pasteEvent) {
var textBox = pasteEvent.target;
textBox.value = textBox.value.replace( "\xAD", "-" );
} );
}
} );
I have a Chrome Extension that performs some actions based on the button toggle (state 0/1).
The problem is that right now, it changes the color Red/Blue, but there are some other actions that need to happen. I can't find a way to refer to a separate multi-line script or file in Chrome.Tabs.ExecuteScript. Every example I've found on the Web only has a single command, which is useless for me! Splitting across lines doesn't work. There will be FOR-loops, IF-statements, and other complexity I want to inject.
Actions needed:
(State=0) Red background, make all IMG tag invisible, etc.
(State=1) Blue background, make all IMG tags visible, etc.
background.js
var state = 0;
function activate()
{
if (state == 0)
{
chrome.tabs.executeScript({
code: 'document.body.style.backgroundColor="red"'
});
state = 1;
}
else
{
chrome.tabs.executeScript({
code: 'document.body.style.backgroundColor="blue"'
});
state = 0;
}
}
chrome.browserAction.onClicked.addListener(activate);
Make a separate file with your commands, and execute it with
chrome.tabs.executeScript({
file: 'content1.js'
});
If you need to pass parameters along, see this question.
Alternative solution is to have a single content script and pass commands to it using Messaging.
If your approach registers listeners, make sure to execute addListener only once.
I try to make a photo-app that can read Qr-Codes with the ZXing-Library.
Most parts work but now somehow my LowLagPhotoCapture doesn't return anything useful:
var photoProperties = MediaProperties.ImageEncodingProperties.createJpeg();
mediaCaptureMgr.prepareLowLagPhotoCaptureAsync(photoProperties)
.done(function (_lowLagPhotoCapture) {
lowLagPhotoCapture = _lowLagPhotoCapture;
lowLagPhotoCapture.captureAsync()
.done(function (capturedPhoto) {
...
The MediaCaptureMgr works, I see a preview of the cam on the screen. But now I need to make a photo. The usual PhotoCapture didn't work with JavaScript and so I found this solution.
Somehow the lowLagPhotoCapture.captureAsync() crashes saying that lowLagPhotoCapture is empty. lowLagPhotoCapture is defined outside of this class because I need it later. But even if I pass the variable directly to the new method it fails =/
Any ideas what might go wrong with this?
Edit:
Okay, after every Async-operation I had a following nameless function and one exitOnError-function that was calles every time. If I remove thatv exitOnError-function out of .done(complete, error), it exits in the same place. But if I set a breakpoint on .captureAsync it goes 1-2 steps further, creates an ImageStream and exits somewhere there. Why the different behaviour with and without the breakpoint?