Premature Optimization Is The Root Of All Evil

I'm working on some code which requires a pretty high quantity of calculations. To prototype it, I used Python, and I did a test job in about 190 lines. I wanted to do it quickly to check if the logic was Ok, so I used just the regular "pythonic" tools, like list comprehensions, and a bit of functional programming (which really fits this kind of job).
To calculate something quite small, the code take about 1 minute and half.
For the size of the calculation, this is a bit too much (but hey! I didn't use PyNum).

Since it's pretty short and I needed performances, today I reimplemented it in C++, using std::vectors and a lot of blings that ease code writing. The same code took about 260 lines of code. Same test, took 20 seconds. Using a simple optimization, like -O1 (using other optimizations didn't make it significantly faster), reduced computation time to 4 seconds. Which is rather

But since a relevant part of the job is dome multiple times, and it can be pre-calculated (nothing really big, it's simple math, but it's calculated rather often), I'm trying to use the new tr1::array and some template metaprogramming.

TM is pretty nice in some occasions, and I suggest this book about the topic. In addition, it's an occasion to test a bit of C++0x on actual code :) Hoping to make a good work on performances.

I'll let you know the results as soon as I get them.
Stay --sync

GJ Adobe

Apple decided to ignore Flash on its devices. Fair enough: I don't like this choice, but its understandable.

This means Adobe shall do its best to show that Apple is wrong, or such a big voice will be very influent on the Flash market.

On the other side, Adobe is doing all the possible to make Flash suck even more.

Makes sense.
Stay --sync

Python Wave

I'm not expert with audio, both theory and practice, but from time to time, I do simple experiments. Months ago I tried OpenAL, which is pretty cute.
But lately I'm doing also things with Python, and I had some difficulties to make OpenAL running on python (i.e. on Fedora I can't find the package out of the box. Yes, I'm lazy), so I just tried something else.

First choice: SDL Mixer, that is present in pygame. Too bad it hangs when initializing the mixer. So I gave up on that because I didn't have time to check for bugs and so on.
So, alternatives? FMOD? Seems cute, but... I found out another way! It's non-interactive, but still easy to use for my purpose (that is, generating waveforms). I don't mind the realtime, right now...

So, Python Wave library!! Great :D Support for writing and reading wave files. Easy, straightforward, fast to learn.

Well, after few hours (with many distractions...) I made this example.

You know what? It remind me when I used to play with audio on Quick Basic: you gave it a string of notes and some other parameters, and it would sound for you :) How cute.
Feel free to read it, run it, test it (but absolutely you CAN'T modify it or your head will explode) and see how dangerous is for your ears to listen to 8-bit 11kHz sampled sounds... XD

I'm not really interested in improving this ugly code... Not only it's full of magic constants (127, 'b', and so on, which highly depends on the actual configuration), but, I mean, my purpose is not to make computer-generated melodies easily with python just using strings. It's not hard to do that, would require no more than 30 minutes of coding, but I simply don't care (now... Maybe I'll do it as a toy in future :D)

But maybe someone of you can enjoy playing with it, improving, or simply use it as reference when it comes to generate noises using python.

Oh, I didn't care about performances either, clearly. If you do, I suggest to use numpy arrays.

Stay --sync

Repo Online

As I said some days ago, the mercurial repository on Google Code has been erased, and a new one has been created. This because being BCL a multiple-user community, I thought was better to have separated repository for each user, keeping the main repository for common projects (and now it's still empty :P).

Anyway, I also found out that mercurial is not meant to keep many projects under the same repository, so I'm not even going to use subrepos for my repository. But I'll won't upload additional and personal stuff as I did before, because if someone wants to checkout, that would be mostly a waste of space and time.

So, I just uploaded what's "interesting", and updated the references on blog posts, which are the following ones.

• Flattr content localization
• Intro
• Visualizing grid of data
• The importance of differentiation

Stay --sync

Custom icon in CKEditor toolbar

Disclaimer: this post is starting unfinished. I'm pretty sure there are 2 (or more) methods of handling icons in CKEditor - and the "best one" involves the usage of bundled images, maybe using resources and so on. The way I'm showing here is a pretty quick fix, that probably is good only when your plugin have few buttons.

Bundling icons (i.e. composing many icons in a single image, and then extracting from that each icon you need) is a Good Thing, and you shall take that way, because reduces request overhead, it's easier when it comes to caching, updating and so on. You shall totally take that way when you have many icons. But I still don't know how to do it, so if you know or find out before me, please leave a comment.

How to set a custom icon

• Put your icons in the plugin directory (maybe under yourplugin/images/ or something else, but it's not required).
• Use the icon attribute when defining a button or a menu item.
• Specify the path for the icon using CKEDITOR.getURL().

An example for toolbars and menus

In this example, a function will add a button in the toolbar and the menu, with same parameters.

function addButtonAndItem(definition, execCode, listener) {

  editor.addCommand(definition.command, { exec: execCode });

  if (editor.addMenuItem)

    editor.addMenuItem(definition.command, definition);

  if (editor.contextMenu)

    editor.contextMenu.addListener(listener);

  var button = CKEDITOR.tools.clone(definition);

  delete button.group;

  editor.ui.addButton(button.command, button);

}

editor.addMenuGroup('myGroup');

addButtonAndItem({

  command: 'myCommand',

  label: 'Do something',

  icon: CKEDITOR.getUrl(this.path + 'images/mcIcon.gif'),

  group: 'myGroup'

}, function(editor) {

  alert("Doing something");

}, function(elem, select) {

  return { myCommand: CKEDITOR.TRISTATE_ON };

});

and don't forget to add your button in the config:

config.toolbar = 'myToolbar';

  config.toolbar_myToolbar = [

    ['Source', 'myCommand' /* ... */]

  ];

Stay --sync

EDIT: Found another method here:
http://www.voofie.com/content/2/ckeditor-plugin-development/#Button_Icon

CKEditor Context Menu

This is a short how-to on how insert a context menu in CKEditor. It's not hard, but now it's still undocumented.

What you have to do

A short reference for who already knows (or wants to figure out) how to do these steps.

1. Create a regular command (as the UI button commands).
2. Create a group for your menu' items.
3. Create an item and add it to the menu'.

Details

A more detailed explanation... With code and plugin example ;)

CKEditor have two plugins: menu and contextmenu.

The first plugin defines the primitives (menu, group and item) that allow CKEditor to have menus. A menu is a container (in detail, a floatpanel, which is provided by another plugin) which can be placed anywere in your editor and contains a list of items, divided in groups. Every item has a name, a label and an associated command to it. AFAIK, the menu plugin doesn't imply anything else than this (definition and rendering). This means that menu bars and context menus aren't handled anyway by this plugin.

The contextmenu plugins requires the menu plugin, and it's pretty short: it's responsibility is only to check if the menu items shall be shown in a particular context. In other words, when you ask for a context menu (probably right clicking), some listener functions are called to check what items goes in the menu. These listener functions are registered in each plugins (so, each plugin has a listener function for the context menus).

In general, a plugin will register many menu items, and when a context menu is asked, the listener will return which items to show.

Let's see an example: I'll create a plugin that executes an arbitrary code when an item is clicked.

First: create the plugin: plugins/myplugin/plugin.js

CKEDITOR.plugins.add('testplugin', {
  init: function(editor) {
  alert("Ok");
  }
});

and load it in your config.js (load multiple plugins by comma separating them in the string)


CKEDITOR.editorConfig = function(config) {
  config.extraPlugins = 'testplugin';
};

This plugin shall load correctly and alert an "Ok". If not, search elsewhere details on plugin loading :P
First step, is to define a command to execute. Here a dummy command:

CKEDITOR.plugins.add('testplugin', {
  init: function(editor) {
  editor.addCommand('testcommand', {
      exec: function(editor) {
  alert("Ok");
  }
  });
    editor.execCommand('testcommand');
  }
});

The command shall be added and executed, and another "Ok" shall appear. If not, scream loudly :D

Now we'll create a context menu capable of executing that command. Replace execCommand with this:

if (editor.addMenuItem) {

  // A group menu is required

  // order, as second parameter, is not required

  editor.addMenuGroup('testgroup');

  // Create a manu item

  editor.addMenuItem('testitem', {

label: 'Do something',

  command: 'testcommand',

  group: 'testgroup'

  });

}

if (editor.contextMenu) {

  editor.contextMenu.addListener(function(element, selection) {

return { testitem: CKEDITOR.TRISTATE_ON };

  });

}

This code checks for the presence of the addMenuItem function in the editor (i.e. the plugin is loaded): if present, adds a group and a menu item. Note that the item have a name, a label, a command and a group. The next snipped checks if the contextMenu is present, and in that case, adds a new listener that always enables the testitem item in the menu list. The listener shall return a dictionary where keys are menu item names, and values are CKEDITOR.TRISTATE_X depending on your need. If null is returned instead of this dictionary, all items are not displayed by default (of course... Or it would be a mess!).

This shall produce an editor that clicked anywhere, pops up a context menu with our "Do something" item, that alerts an "Ok" when clicked.

It's done :) But to show you that this is actually about contexts and not about menus I'll add a check: if the context menu is asked on a bold text, then the voice will appear, else it won't.
Check out this new listener:

editor.contextMenu.addListener(function(element, selection) {
  // Get elements parent, strong parent first
  var parents = element.getParents("strong");
  // Check if it's strong
  if (parents[0].getName() != "strong")
    return null; // No item
  // Show item
  return { testitem: CKEDITOR.TRISTATE_ON };
});

Ok, done.
Stay --sync

Italiani di merda.

Questo titolo ce lo meritiamo tutto.

Sono appena tornato dalla riunione KiSSME e in treno ho potuto (dovuto?) assistere ad una scena a dir poco riprovevole.

Mi son perso l'inizio, ma credo di aver capito com'e' cominciato tutto: una signora con due figlie (chiameremola M) chiese (piu' o meno garbatamente) ad una signora L di non fumare vicino a loro (L fumava in treno, da quanto ho capito). L ignoro' la richiesta di M e poco dopo passo' di nuovo vicino con la sigaretta accesa.

L'indole di M ha evidentemente acceso i toni, le due son finite presto a botte.

Vabe'. Gia' questo e' uno scempio, ma si stan solo menando per diseducazione. Capita. Di solito le risse di questo tipo finiscono li (M ownava alla grande L).

Io sono relativamente vicino, 3 metri, e assisto incredulo le due che se le danno. Arriva un uomo (chiamiamolo F) e separa le due, trattenendo M. Chiede spiegazioni, ella risponde che e' a causa della sigaretta, e l'uomo le dice (piu' o meno urlando) che "non e' sua competenza" dover far rispettare il divieto di fumare, s'intende. Anche se c'erano le 2 figlie. "C'e' il controllore". F era il ragazzo di L, da quanto ho appreso nel discorso.

M e L continuano a battibeccare, poi c'e' una nuova piccola rissa, e vengono separate nuovamente. Naturalmente le due bimbe preoccupate si mettono a gridare come matte a vedere la loro mamma in una rissa.

Col casino, giunge dunque un secondo signore, claudicante, - chiamiamolo C, che pero' non sta per Claudicante - e un'altro ragazzo, che ha assistito alla scena e poi ha testimoniato alle forze dell'ordine. Ma questo ragazzo e' stato bravo e ha solo fatto il suo dovere (e ci guardava, come noi, sconcertato).

Dopo l'intervento di C arriva il controllore (persona ragionevole), separa le due, vanno su due carrozze separate - ma son vicine, perche' la rissa e' avvenuta nel tubo di collegamento.

Il controllore discute con M - e intanto prende i dati, C ed F discutevano con L. Poi il controllore si sposta da L e C si sposta da M.

Ora arriva il bello: quando il controllore si allontana un attimo e va a chiamare un vigile in borghese che c'era in testa al treno, L da della puttana a M dicendole che fa schifo, che non deve procreare, che l'Italia e' una merda per gente come lei, etc etc.

Poi C impone il silenzio ad M, che naturalmente si ribella, e C si mette a dire che lui paga ancora le tasse per la gente come M, che lei deve stare zitta e chissa' cosa fa nella vita.

M risponde (con parole simili ma non esatte a queste): "Certo, perche' lo sai tu cosa faccio nella vita."
e C, prontamente: "Si, la puttana!"

Era davanti a me, alche' ho detto che non era educato parlare cosi' ad una sconosciuta. Lui se ne frego' abbastanza del mio intervento, probabilmente perche' a differenza degli altri presenti non devo scimmiottare, muovere le mani o urlare per esprimermi.

Poi C se ne torna al suo posto, altrove, distante.

Aveste sentito che insulti ha tirato prima L a M... C'e' da vergognarsi di vivere in un paese con queste persone... Dico persone come L e C: benche' abbia trovato M troppo propensa alla rissa, aveva "tutte" le ragioni di essere trattata meglio, ma, d'altronde, M era colpevole di una cosa, che evidentemente ne' C, ne' L ne' il suo ragazzo F potevano perdonarle...

M era nera.

Una persona e' stata insultata davanti ad una amica/sorella/altro, due figlie e tutte le altre persone, perche' era scura di pelle.
Le hanno dato della puttana, perche' era scura di pelle.
Le hanno detto che non aveva diritto di essere in Italia, perche' era scura di pelle.
Le hanno detto che rubava gli uomini e il lavoro agli italiani, perche' era scura di pelle.

Siamo in un Paese di razzisti del cazzo. E ho fatto male a non alzarmi ed impormi, perche' il razzismo non va tollerato. Cuore buono una minchia. Ospitalita' italiana una minchia.

Questo titolo ce lo meritiamo tutto.
Questo titolo ce lo meritiamo tutti, perche' se abbiamo dei razzisti in casa, la colpa e' anche nostra.

Stay --vergogna.

Flattr Content Localization

Yay! Just finished :D Thanks to the new Flattr API (and Google, and jQuery), I could easily implement a language detection system for flattr content.

Until now, all the posts were marked en_GB, and most of flattr content aren't correctly localized, because AFAIK, flattr didn't auto-detect the language.

Now I've developed a simple piece of code that uses Google translation API to detect the language of the current post and to insert a correct Flattr button there.

Look at my current template source here.

How to use it

1. Copy the JavaScript script tag (also the google jsapi) at the beginning in your template.
2. Update your UID, post category and languages (langDict).
3. Insert a tag where your button will be inserted in (flattr-button, line 1215).
4. Find the contents tags (for example post.url, post.title and so on) and set a class attribute to their container (rows 35-40), eventually changing these classes (look at lines 1192 or 1218 for examples on how to set these class names).
5. Upload the new template to blogger.

How it works

With the new API 0.5.0, it's pretty simple, and it's done like this:

1. insert a tag marked for containing the button (.flattr-button);
2. for each of this tag, find the associated post data (using other flattr-X classes),
3. start translating the data (async),
4. in the callback, when translation is ready, use FlattrLoader.render() to render that button.

To avoiding copying around the values - as was done in Nico's - I work on every button instance (elements with class flattr-button). Using jQuery I get the post content (the parent of all the data, classed flattr-post), and in its scope, I try to find the tags with the contents (flattr-title, -url, etc).

If you don't want to use jQuery or you don't want to rely on this hierarchical structure, you can insert hidden tags, marked as you like, like Nico's, but I think that data duplication is bad, so it's better to fix a bit the code and avoiding duplicates.

There is room for improvements:

• the mapping between Google languages list and Flattr's language list isn't automatic, but it's done manually with a dictionary. I didn't check how to do it, and probably I won't do it in short term :P
• tag list isn't processed, it may be comma separated, but also separated with colons, spaces, whatever. So this is a case where data duplication isn't a bad idea (but it would require the user to tweak more the template). Now, I'm relying on the fact that my template uses comma separated tags;
• I'm tired and I can't remember the other issue :D EDIT: Oh yeah! It uses jQuery... If you know JavaScript better than me, and want to replace jQuery with a standard-multi-browser version, would be great.

Hope you like it.
Stay --sync

Adobe Flash + Google Chrome

I'm not an expert in this field, even if I'm actually developing for the web, I don't use Flash and I'm not familiar with the Chrome's internal.
But in past I heard about an integration of Flash in Chrome and it just happened to be released.

My first though: "Ok, integrated, but how much?"

Let me explain:

• Chrome uses JavaScript (and it's pretty fast, too: thanks V8), Flash uses ActionScript. Both of them are dialects of ECMAScript.
• Chrome supports SVG, that is vectorial painting, and Flash is vectorial based.
• Chrome is multi platform, as well as Flash.
• With the upcoming HTML5 standard, Chrome will (does) support audio and video. I'm hoping in a more advanced standard about A/V manipulation (like the Mozilla's Audio API), but there is a common base here, too.

It's not surprising that the combination HTML5+SVG+CSS+JavaScript is felt like a substitution for Flash: as matter of fact, they are almost the same thing.

In general, a modern HTML5 engine is something like a virtual machine capable of multimedial rendering - just as Flash has been for years. It's evident how Flash was an advances technology, but it has some limitations:

• Was distributed as a plugin.
• Is closed-source.
• It makes content unaccessible.

Strong with the its experience, W3C has melted almost all the required features in an open standard: HTML5, which overcomes (someway) these limitations and adds Web3.0 features (i.e. a serious approach to semantic).

So - back to the subject - I'm hoping that what is Flash, will be fused in the actual Chrome capabilities. I'm not really talking about "distributing the Flash plugin with Chrome" or "Integrating Flash source in Chrome source", but "merging and reimplementing Flash using Chrome's primitives".

This would provide a perfect solution to many problems:

• Flash would become someway open (at least if this merging is done on Chromium).
• No plugins required, no additional software: a single engine would render all the content.
• SWF decoding would become a browser feature.
• Flash would be accessible on many platforms, mobile included.
• Google and Adobe effort and experience would melt in a better final product (2 teams would work on a single code, which would be more optimized, bug free, more powerful, etc.).
• The Open Source and Free Software communities would be flattered.
• Other browsers could do the same.
• The industry and the Flash developers will be able to continue developing Flash, overcoming their problems, and avoiding to be scared from Apple's diktat (which I consider stupid and closed).

One could say: "yes, but plugins have the advantage of not requiring to rely on browser's capabilities", that is: if IE's SVG render was poor, then also the new-Flash render would be affected.

It's an half-issue: every browser maker could optimize and make sure that their Flash implementation would render correctly. While using a plugin, you can't rely on manufacturer's quality: it's closed, and no-one could improve the work quality.

I feel that such approach would benefit a LOT. Flash and HTML5 won't become opposed technologies (as they are being pushed to be), but they would be almost the same.
As they are.

Sadly, I don't think the Flash's integration in Chrome is something like this... I *think* it's more like a "their plugin is distributed with our software". But not sure.
I'm hoping Adobe and Google are moving toward this common interest - would be great for everyone, except Apple.

Stay --sync

Repo Erased

For structural changes, the BCL's repository has been reset and all (my) sources are being moved to other locations. So links to sources may be broken. I'll fix them in (hope near) future.

Per cambiamenti strutturali, il repository di BCL e' stato resettato e tutti i (miei) sorgenti sono in via di spostamento altrove. Quindi i link ai sorgenti potrebbero essere invalidi. Li sistemero' in (spero vicino) futuro.

Stay --sync