Reset Key Bindings - Ace Editor - javascript

OK, I'm doing a few experiments with Ace editor and I'm trying to control what keys/shortcuts have been bound.
The best way I could think of would be to totally eliminate/reset all keybinding, and re-set only the ones I need.
How is that doable?
Any ideas?
P.S. I've had a look into the the whole documentation (and the list of "default" Key Bindings) but I'm still not sure. I've also played with the JS console and editor.keyBinding.getKeyboardHandler() but I still cannot find any suitable way/method/property to unset a specific keybinding.
Trying this approach (Ace Editor - Change CTRL+H keybinding), I tried editor.commands.findnext={} in order - for instance - to eliminate the Cmd+G binding to the "Find Next" command. However, the shortcut is still there... :S

To remove all commands do
var allCommands = editor.commands.byName;
editor.commands.removeCommands(allCommands)
// now you can add commands as you wish
allCommands.findnext.bindKey = {win: "Ctrl-H", mac: "Cmd-H"}
editor.commands.addCommand(allCommands.findnext)
But if you want to only remove particular binding, call
editor.commands.bindKey("Cmd-G", null)

Related

OpenLayers.Control.Scale.template - how does it work and does it work at all?

The OpenLayers2 Doc here
http://dev.openlayers.org/docs/files/OpenLayers/Control/Scale-js.html#OpenLayers.Control.Scale.template
says Openlayers.Control.Scale has a Property called "template".
As far as i understood i tried to set it like:
new OpenLayers.Control.Scale('nodelist',
{ template: 'ca. 1: ${scaleDenom}' }
)
but it seems to have no effect at all.
The actual Scale-Control shown in the resulting div-Element remains defaultish as if it (if its set at all) is overridden.
So what would be the proper way to use Openlayers.Control.Scale.template Property or what is it for?
One close look into the OpenLayers 2.13 library itself revealed that the documentation is somehow malicous because there is no way to set something like a template property using the OpenLayers.Control.Scale constructor.
Though its possible to override the Scale class and use the modified one like an ordinary control.
Sorry for answering my own Question but it sure helps someone out there :)

Ace Editor Javascript: How to disable all extra commands that aren't default in textarea?

I want to use Ace Editor for event handling purposes, but do not want the extra functionality and commands (toggle lines, multiple cursors, etc.), but only the default commands. Is there a quick way to do this?
My current approach is to create an array of the standardCommands in a textarea (not sure yet how to do that) and then to remove them from all commands like this:
//Returns the set difference of this array and arr array
Array.prototype.diff = function(arr) {
return this.filter(function(i) {return arr.indexOf(i) < 0;});
};
//Removes all Ace Editor commands which are not in the standardCommands array
function removeSpecialCommands(editor) {
var commands = Object.keys(editor.commands.commands); //gets all commands
var specialCommands = commands.diff(standardCommands); //gets extra ace cmnds
editor.commands.removeCommands(specialCommands); //removes those commands
}
However going through every command is not easy as many can't be called directly on the editor. So I'm not sure which commands are the standard ones. Is there a simpler way to get just the standard textarea commands (tab, insert, delete, movecursor with home, pgup, arrow keys, etc.)?
This depends a lot on what you consider to be a standard command. E.g. you mention tab, but textareas do not handle tab.
If your goal is to simply disable some commands that override default browser keys you might be interested in https://github.com/ajaxorg/ace/blob/master/lib/ace/keyboard/textarea.js
To also disable creating multiple selections with mouse use editor.setOption("enableMultiselect", false)
going through every command is not easy as many can't be called directly on the editor
all the editor commands can be called using editor.execCommand(commandName|commandObject)

Greasemonkey, replace every occurence of string every second

i try to figure out a greasemonkey script that replaces every onmousedown on a site with an ondblclick. And i want it to constantly update, like every 1,5 Seconds, because the page refreshes using AJAX.
This is the script i came up with, but it doesn't seem to be working.
window.setInterval(document.body.innerHTML= document.body.innerHTML.replace('onmousedown','ondblclick');,1500);
The page it should work with is internal use only. But a good example would be the google search, where onmousedown is used for the links of the results to swap out the URL before you click it.
I also tried it without the semicolon after the document.body.innerHTML.replace.
I'm really new to JavaScript, but since i'm the only one in the company who can code, this one is stuck with me.
Any help would be appreciated.
Also, a small "side question"
Do i have to use #exclude, or is it enough to only use #include internal.companysite.tld* so it will only work on this site ?
A direct answer: you need to supply a function to setInterval - and it's best to set a variable so that you can later cancel it with clearInterval() if necessary.
function myF(){document.body....;}
var myIntv = setInterval(myF, 1500);
You could also do it using an anonymous function in one line as you're trying to do... do that this way:
var myIntv = setInterval(function(){document.body....;}, 1500);
I wouldn't suggest this as the solution to your problem. What it sounds like you want to do is manipulate the active DOM - not really change the UI. You likely need something like this:
var objs = document.getElementsBy__(); // ById/ByName/etc - depends on which ones you want
for (var i in objs){objs[i].ondblclick = objs[i].onmousedown;objs[i].onmousedown = undefined;} // just an example - but this should convey the basic idea
Even better, if you can use jQuery, then you'll be able to select the proper nodes more easily and manipulate the event handlers in a more manageable way:
$(".class.for.example").each(function(){this.ondblclick = this.onmousedown;this.onmousedown = undefined;}); // just an example - there are multiple ways to set and clear these

textmate reformat with 2 spaces

I've set textmate to use softtabs 2 spaces on my file. But when I try to reformat the entire document, it uses 2 hard tabs as the indents.
Regular indents work as I want it to, just the document format doesn't. Anyway to get textmate to be obedient?
Thanks.
The JavaScript bundle's "Reformat Document / Selection" command is passing the document's text to the js_beautify function in the bundle's beautify.php file (found on my system and probably by default at /Applications/TextMate.app/Contents/SharedSupport/Bundles/JavaScript.tmbundle/Support/lib/beautify.php). If you take a look at the function definition you'll see that there's a second parameter, $tab_size, with a default value of 4. There's a line in the bundle that reads print js_beautify($input);. Change this to print js_beautify($input, 2); and you should, I expect, get tab stops with two spaces.
To make it a bit more flexible, use the TextMate environment variable TM_TAB_SIZE, as in print js_beautify( $input, getenv('TM_TAB_SIZE' ) );, which should update how the command operates if you ever change your tab size.
Note, I've tested none of this. :) Just took a look at the bundle and tracked down what seems to be necessary.
So, I tried chuck's suggestion and it gave me an error. I did this to "fix it". I'm sure it could be done more elegantly, but this worked for me.
Open up the same file Chuck says to open up, line 50 (or so) should look like this:
function js_beautify($js_source_text, $tab_size = 4)
change $tab_size to 1
function js_beautify($js_source_text, $tab_size = 1)
Now, around line 56 where it says:
$tab_string = str_repeat(' ', $tab_size);
change the space to a tab like so:
$tab_string = str_repeat("\t", $tab_size);
That worked for me.

Ways to access a JavaScript Object's Property in IE6

I have a JavaScript object with some properties. Lets say:
var haystack = {
foo: {value: "fooooo"},
bar: {value: "baaaaa"}
};
Now, I want to access one of those properties, but I don't know which one. Luckily, this variable does:
var needle = "foo";
In modern browsers I seem to be able to do the following and it works:
haystack[needle].value; # returns "fooooo"
But in IE6 it throws a wobbly, haystack[...] is null or not an object.
Is there a way to achieve what I'm trying to achieve in IE6? If so, how so?
EDIT - Adding further information in response to the comments below...
What I am trying to achieve is actually related to CKEditor. I haven written a plugin image manager that opens in an iframe.
What I then want to achieve is to place the chosen image back in the correct instance of CKEditor (and there can be more than one instance on some pages).
What I have done (and I know this is an ugly hack), when the iframe is opened I have put a hidden field next to it with the name of the instance. So the parent page contains some markup like this:
<iframe><!-- Image manager --></iframe>
<input type="hidden" id="ckinstance" value="article_body" />
So then, inside the iframe when an image is selected to be inserted I have some JavaScript that looks like this:
var CKEDITOR = window.parent.CKEDITOR;
var instance = window.parent.$('#ckinstance').val();
var img = '<img src="/whatevers/been/selected" />';
CKEDITOR.instances[instance].insertHtml(img);
window.parent.$.modal.close();
This works fine in FF, Chrome, etc. Just IE6 is complaining with:
CKEDITOR.instances[...] is null or not an object.
EDIT 2
I've just done some debugging and actually it looks like IE6 is failing on window.parent.$('#ckinstance').val() and is returning undefined.
So the original problem that I've described is not the problem at all.
Still need help though :)
It's quite annoying when you spend a couple of hours scratching your head over something, only to realise the solutions is:
Tools > Internet Options > Delete Files

Categories