20100731

17.10 Uhr

Diese Nacht hatte ich zwei Stunden gesurft und nach Ideen gesucht, was ich falsch mache beim Bildschirmaufbau. Ohne Erfolg. Es geht um folgenden Punkt aus der /todo:

  • Das “Öffnen” eines neuen “Fensters” ist langsamer als im UI mit echten Fenstern (Ext.Window). Weil jetzt der Inhalt des alten Fensters zunächst aus dem Viewport entfernt wird. Einfach ein neues Ext.Window zu öffnen und über den vorigen Browserinhalt zu knallen ging offenbar schneller.

Heute morgen habe ich unsere beiden Schornsteine gefegt und wollte nach dem Mittagessen eigentlich den Rasen mähen gehen. Aber da kam mir eine Idee für Lino.WindowWrapper.show() und Lino.WindowWrapper.close(). Bisher waren diese beiden Funktionen wie folgt:

show : function() {
    var main = Ext.getCmp('main_area');
    var old = main.items.first();
    Lino.hidden_windows.push(old);
    Ext.apply(this.window,{autoSize: true,id:'current_window'});
    main.items.replace(this.window);
    main.doLayout();
},
close : function() {
    var main = Ext.getCmp('main_area');
    var current = main.items.first();
    var w = Lino.hidden_windows.pop();
    if (w) {
      main.items.replace(w);
    } else {
      main.removeAll();
    }
    current.destroy();
}

Zu bemerken ist, dass das this.window eines WindowWrapper ja kein Ext.Window mehr ist, sondern ein Ext.Panel. Jetzt zu meiner Idee. Anstatt das so kompliziert zu machen, mache ich einfach:

show : function() {
    Ext.apply(this.window,{renderTo: 'main_area', constrain:true, maximized:true });
    this.window.show();
},
close : function() {
    this.window.close();
}

Und außerdem ist das this.window jetzt wieder ein Ext.Window. Voilà. Ich bin nicht sicher, ob die Fenster jetzt tatsächlich schneller gerendert werden, aber durch irgendeinen Zaubertrick, den Ext.Window offensichtlich benutzt, sieht man jetzt nicht mehr mit bloßem Auge, wie der Fensterinhalt stückweise aufgebaut wird. Eine gut investierte halbe Stunde! Check-In 1096 und dann aber Rasenmähen.

21.20 Uhr

Okay, das Detail-Fenster kommt jetzt auf einen Schlag… aber leider erst nach ca. 4 Sekunden. Während dieser 4 Sekunden geschieht nichts. Kein AJAX-Call (der kommt erst, wenn das Fenster angezeigt ist), und keinerlei Feedback, dass er überhaupt was tut. Jetzt wäre es also wichtig, dass der Benutzer wenigstens sehen kann, das er warten soll. Und sei es nur der Maus-Cursor.

Ich habe mal an diversen Stellen mit Ext.Element.setStyle({cursor:’wait’}) gespielt (mögliche Mauscursor-Formen siehe selfhtml.org), das funktionierte auch, aber der Maus-Cursor soll (wahrscheinlich) lediglich auf dem Button zum Mauscursor werden. Das habe ich noch nicht hingekriegt. Eine irritierende Beobachtung ist: wenn ich in den Button-Handler vor den Aufruf der Lino.contacts.Persons.detail() ein console.log(arguments); einfüge, dann erscheint auch diese Meldung erst nach 5 Sekunden. Was tut der während der 5 Sekunden?! Aber okay, jetzt ist Schlafenszeit.

03.00 Uhr

Wenn man auf den Button klickt, passiert ja genau genommen schon ein bisschen : für ca. eine Sekunde ändert er seine Farbe. Irritierend ist eigentlich nur, dass er schon nach einer Sekunde wieder normal wird (und nicht erst wenn der Handler zu Ende ist).

Lino.build_buttons() arbeitet jetzt ein bisschen anders, damit der Button als zweiter Parameter an den Handler übergeben wird.

Experimentierfreundlicherer Code in lino.ui.extjsw.ext_ui.ExtUI.a2btn.

Nach Lektüre von ext-all-debug.js habe ich in der lino.css mal folgendes probiert (und verstehe nicht, weshalb das keinerlei Effekt hat):

.x-btn-text {
        color: red; font-style:italic;
}

.x-btn-menu-active {
        cursor: 'wait';
        color:'red';
}