I'm using AWS Sagemaker Ground Truth for a Custom Labeling Task that involves editing bounding boxes and their labels. Ground Truth's UI has built-in keyboard shortcuts for doing things like choosing the label for a box, but it seems to lack shortcuts for other built-in UI elements like "No adjustments needed" or the "Submit" button.
Is there a way to add such shortcuts? I've looked at the crowd-html-elements for customizing the appearance of the page, but can't find anything in there about keyboard shortcuts. It doesn't even look like crowd-button or crowd-icon-button support specifying a shortcut as an attribute.
Could try something like:
document.addEventListener('keydown', function(event) {
if (event.shiftKey && event.keyCode === 13) {
document.getElementsByTagName('crowd-bounding-box')[0].shadowRoot.getElementById('nothing-to-adjust').querySelector('label').click();
}
});
Related
I'm using ReactJS and I have a lot of <button> in my code. I notice that I can use the Tab key to move over the button and there will be an outline on focused button like this:
But on this website which I'm trying to replicate, the buttons they use do not get Tab-focused on normal but just when we turn on the VoiceOver accessibility mode.
And the border of the Tab focus is also different.
I wonder how can we implement this in React?
Changing tabIndex to 0 or -1 doesn't work.
Thanks everyone!
Update
I ask because this leads to a problem:
If I use the UI Keyboard (UIKB) first and then try to type with the real keyboard keydown event. The tab focus would just stuck on the UIKB letter and return it twice.
This doesn't happen on the Wordle game because they just allow using tab focus when in accessibility mode.
tabIndex = -1 doesn't work because I want to allow the user use the tab focus just in a11y mode like Wordle, I don't want to totally disable it.
I got a problem with checkbox field using Adobe Indesign.
I want an image to become my checkbox button and also change the image after clicking. Unfortunately, after clicking on this button the image changes properly, but it also adds checker (check sign) in the middle of the picture. Can't see to overcome this.
It looks like this:
checkmarks
I would consider using two buttons for that. One hiding the opposite and vice-versa. Here is an example:
And here is a link to the package :
http://www.filedropper.com/dossieronoff
And here is a link to a demo PDF:
http://www.filedropper.com/onoff
Aloha adds mousedown, blur, ... handlers to the document body, to recognice when the the Toolbar is shown/ hidden and the document selection should be changed.
Now I have a plugin (a ColorPicker), which appends itself to document body. So when I click the the element aloha recognizes that no editable element is selected and hides the toolbar.
I found two ways to prevent this and both look like really dirty hacks.
Catching the mousedown handlers and not promote them to document body.
This is bad, since the plugin requires this click handlers too.
Add the class 'aloha-dialog' to editor
Aloha seems to treat elements which have this class differently. However this seems to break some intern functionality, if it is not hidden correctly.
So did I miss some functionality, or is this not handled by a standard functionality yet?
BR,
Stefan
Aloha uses Surface.trackRange on the toolbar, so that clicks in the toolbar (which is outside the editable) don't hide it.
For example:
Aloha.require(['aloha/jquery', 'ui/surface'], function ($, Surface) {
Surface.trackRange($('#color-picker'));
});
I have an intranet (office) website in which I am using telerik tooltip to guide users about every link, buttons etc, it is a little help system that allows the new users to know what this link do and what that link do. I was thinking that while it will be helpful to new users it will be a hindrance for old users so it will be better if user can toggle the tooltip system so I placed a checkbox below with label "Enable Help System", but I can't seem to figure out the logic through which I can disable the tooltip to appear as user uncheck the box, the Enabled = false property is not working and tooltip still appearing even after postback.
Any ideas/advices ?
You could either set Visible=false (in which case, the tooltip control will not be rendered on the page at all), or as an alternative - you could set ShowEvent=FromCode (in case you are using some other event to show the tooltip - OnMouseOver etc.)
I've got a "Main Window" containing quite a few things, including, in the status bar (at the very bottom of the window), a "Support" button, which the user can use at any time to open a window containing our support phone number, along with a little chat functionality if the user prefers to chat with us.
The problem is that if the program is displaying a modal dialog, the "support" button is not clickable anymore.
Stopping using modal dialogs is not an option ; I use them because I sometimes want to force the user into performing a specific task before I can do something else in the software.
What's the best way to let the user contact the support without having to close the current modal dialog?
Modal dialogs should behave as modal dialogs, the user won't expect to be able to click a button in the main window even if it were possible.
Your best bet is to put a support button on the dialog too.
Using a shortcut key instead of a button may be an option. The functionality could be factorized into a base form class like this :
public class BaseForm : Form
{
protected override bool ProcessDialogKey(Keys keyData)
{
if (keyData == Keys.F1)
{
SupportForm f = new SupportForm ();
f.Show();
}
return base.ProcessDialogKey(keyData);
}
}
Not using modal dialogs is an option. You can disable other parts of your interface during the required interaction to get whatever it is that you need out of the user.
The solution is to avoid situations where the user 'must' do something. Modal dialogs often get in the way if, for example, the user wants to quit the application right at that moment, or see something in a backgrounded window, or refer to another part of your application. Instead of using them, design your interaction so that if there is a required action/piece of information, it's folded into the application logic.
Think about website design -- modal dialogs are very rarely found on the web, and for good reason -- they disrupt the user's workflow unnecessarily. And yet plenty of sites have 'required' information.
Don't use modal dialogs; they are a shortcut to avoid a better design.