Extract Event from objects.

39 views
Skip to first unread message

Simon Van de Water

unread,
Jan 4, 2013, 8:00:47 PM1/4/13
to fla...@googlegroups.com
Hey guys,

I understood that a big advantage of Flapjax is the fact that you don't have to define callbacks anymore that should be triggered when certain events fire. I have kept this "rule" in mind and I tried not to use callbacks in a project I am making.

In this project I am working on, I'm using CodeMirror. In the HTML-file attached to this post you can find a small example on how I use it (and how I would like to use it is commented out). If you want to run the example you'll have to download the files from http://codemirror.net/ and update the references in the .HTML-file because I renamed some of the folders of CodeMirror.

Anyway; here is my problem: to use CodeMirror, you have to "transform" a regular textArea-element into a CodeMirror. This is done as such: 
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-csrc"
      });

Now that we have this "editor" object we can listen for the events it fires as such:
editor.on('cursorActivity',function(instance){
         alert(instance.getCursor().ch);
}
);

This works fine, but I would like to eliminate the usage of callback-functions. Normally this can be done by using the extractValueE(a,b)-function but I don't think this can work because we're listening for events on the "editor"-object rather than on the textArea-element. Is there some easy way (built into flapjax) to listen for events being triggered by objects? I tried this but it obviously doesn't work:
var editorE = extractEventE(editor,'cursorActivity');
editorE.mapE(doit);

I don't think this can be done because those objects that fire events are very implementation-specific and I wouldn't mind using the callback-approach. I was just wondering if this could be done in the spirit of Flapjax (i.e. without using callbacks).

Thank you in advance,
Simon
testCodeMirror.html

Leo Meyerovich

unread,
Jan 4, 2013, 8:24:10 PM1/4/13
to fla...@googlegroups.com
Hi Simon,

1. You can probably define a mirrorE() to work similar to extractEvent():

function mirrorExtractE(obj, evt) {
var resE = receiverE();
obj.on(evt, function (v) { resE.sendEvent(v); });
return resE;
}

var cursorActivitiesE = mirrorE(editor, 'cursorActivity');
var chE = cursorActivitiesE.mapE(function (v) { return v.getCursor().ch; });


2. If you can use and modify CodeMirror's prototype chain, you might make an even cleaner extraction pattern:

Mirror.prototype.onE = function (evt) { return mirrorExtractE(this, vet); };
var cursorActivitiesE = editor.onE('cursorActivity');

Hope that helps!

- Leo






--
Flapjax home page: www.flapjax-lang.org
Flapjax list: groups.google.com/group/flapjax
Post: fla...@googlegroups.com
Unsubscribe: flapjax-u...@googlegroups.com<testCodeMirror.html>

Simon Van de Water

unread,
Jan 5, 2013, 11:14:51 AM1/5/13
to fla...@googlegroups.com
Hey Leo,

Thanks! That's really helpful. I modified it a little because there are some events that pass more than one argument;

function mirrorExtractE(obj, evt) {
var resE = receiverE();
obj.on(evt, function () { 
resE.sendEvent(arguments); });
return resE;
}
var changesE = mirrorExtractE(editor, 'change');
var chE = changesE.mapE(function (args) { 
var instance = args[0];
var changeObj = args[1];
//do stuff
});


Thanks again,
Simon
Reply all
Reply to author
Forward
0 new messages