| [qo-modules-dev] [48] Cleaning up code comments, making classes more configurable. |
[ Thread Index |
Date Index
| More lists.tuxfamily.org/qo-modules-dev Archives
]
Revision: 48
Author: mjlecomte
Date: 2008-12-05 23:40:04 +0100 (Fri, 05 Dec 2008)
Log Message:
-----------
Cleaning up code comments, making classes more configurable. I'm not happy yet with launch handlers, I may try to make them observables, fire events through a central bus or something.
Modified Paths:
--------------
mickael/trunk/ext/v3.0.0-a1/learn/desktop/desktop.html
mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/App.js
mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/Module.js
mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/button/TaskButton.js
mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/ActiveApps.js
mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/TaskBar.js
Modified: mickael/trunk/ext/v3.0.0-a1/learn/desktop/desktop.html
===================================================================
--- mickael/trunk/ext/v3.0.0-a1/learn/desktop/desktop.html 2008-12-05 22:25:02 UTC (rev 47)
+++ mickael/trunk/ext/v3.0.0-a1/learn/desktop/desktop.html 2008-12-05 22:40:04 UTC (rev 48)
@@ -12,11 +12,13 @@
<!-- LIBS -->
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
+
+ <script type="text/javascript" src="../../ext-all.js"></script>
<!--
- <script type="text/javascript" src="../../ext-all.js"></script>
--->
+-->
+<!--
<script type="text/javascript" src="../../ext-all-detail.js"></script>
-
+-->
<!-- OVERRIDES --> <!-- Destroy context menus -->
<script type="text/javascript" src="js/overrides/override.js"></script>
Modified: mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/App.js
===================================================================
--- mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/App.js 2008-12-05 22:25:02 UTC (rev 47)
+++ mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/App.js 2008-12-05 22:40:04 UTC (rev 48)
@@ -308,6 +308,7 @@
preventBackspace: function () {
var map = new Ext.KeyMap(document, [{
key: Ext.EventObject.BACKSPACE,
+ stopEvent: false,
fn: function (key, e) {
var t = e.target.tagName;
if (t !== "INPUT" && t !== "TEXTAREA") {
Modified: mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/Module.js
===================================================================
--- mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/Module.js 2008-12-05 22:25:02 UTC (rev 47)
+++ mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/Module.js 2008-12-05 22:40:04 UTC (rev 48)
@@ -42,7 +42,15 @@
* @extends Ext.Window
*/
Ext.ux.Module = Ext.extend(Ext.Window, {
+
/**
+ * @cfg {String} activeBtnCls
+ * An optional class to be applied to the taskbar button associated with this module when
+ * the active state of the module window changes.
+ */
+ clsActiveBtn: '',
+
+ /**
* @cfg {Boolean} closable
* <p>True to display the 'close' tool button and allow the user to close the window, false to
* hide the button and disallow closing the window (default to true).</p>
@@ -262,7 +270,7 @@
}
this.app.view.taskbar.setActiveButton(win.taskButton);
this.app.view.activeWindow = win;
- Ext.fly(win.taskButton.el).addClass('active-win');
+ Ext.fly(win.taskButton.el).addClass(this.activeBtnCls);
win.minimized = false;
},
@@ -274,7 +282,7 @@
markInactive: function (win) {
if (win === this.activeWindow) {
this.activeWindow = null;
- Ext.fly(win.taskButton.el).removeClass('active-win');
+ Ext.fly(win.taskButton.el).removeClass(this.activeBtnCls);
}
},
Modified: mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/button/TaskButton.js
===================================================================
--- mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/button/TaskButton.js 2008-12-05 22:25:02 UTC (rev 47)
+++ mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/button/TaskButton.js 2008-12-05 22:40:04 UTC (rev 48)
@@ -5,13 +5,63 @@
* @extends Ext.Button
*/
Ext.ux.button.TaskButton = Ext.extend(Ext.Button, {
-
+ align: 'left',
/**
+ * @cfg {String} clickEvent
+ * The type of event to map to the button's event handler (defaults to 'mousedown' instead of standard 'click')
+ */
+ clickEvent: 'mousedown',
+
+ /**
+ * @cfg {Number} ellipsis Ellipsis value to be used for the button title (defaults to 20)
+ */
+ ellipsis: 20,
+
+ /**
+ * @cfg {Boolean} enableToggle
+ * True to enable pressed/not pressed toggling (defaults to true)
+ */
+ enableToggle: true,
+
+ /**
+ * @cfg {String} iconAlign
+ * The location for the icon (defaults to 'left').
+ */
+ iconAlign : 'left',
+
+ /**
+ * @cfg {Number} minWidth The minimum width for this button (used to give a set of buttons a common width)
+ */
+ minWidth: 118,
+
+ /**
+ * @cfg {Number} The initial width for the button title (defaults to 168)
+ */
+ width: 168,
+
+ /**
+ * @cfg {String} menuAlign
+ * The position to align the menu to (see {@link Ext.Element#alignTo} for more details, defaults to 'bl-tl').
+ */
+ menuAlign: 'bl-tl',
+
+ /**
+ * @cfg {String} scale
+ * The scale to apply to the cls (defaults to 'small') ('x-btn-SCALE' 'x-btn-icon-SCALE').
+ */
+ scale: 'small',
+
+ /**
+ * @cfg {String} toggleGroup The group this toggle button is a member of (only 1 per group can be pressed)
+ */
+ toggleGroup: 'taskbuttons',
+
+ /**
* @cfg {String} tooltipTpl
* Default tooltip template for displaying tooltips when hovering over task buttons.
- * Defaults to:
+ * Defaults to '<h3>{title:ellipsis(20)} ({no})</h3><span class="{cls}">{description:trim}</span></div>'.
*/
- tooltipTpl: '<h3>{value:ellipsis(10)}</h3><span class="{cls}">{name:trim}</span></div>',
+ tooltipTpl: '<h3>{title:ellipsis(20)} ({no})</h3><span class="{cls}">{description:trim}</span></div>',
/* @private */
constructor: function (win) {
@@ -19,12 +69,16 @@
// create the tooltip for the button
this.createTooltip();
-
+
Ext.ux.button.TaskButton.superclass.constructor.call(this, {
+ /**
+ * @property {String} iconCls
+ * A css class which sets a background image to be used as the icon for this button
+ */
iconCls: win.iconCls,
+
id: win.id + '_TaskBarTaskButton',
- text: Ext.util.Format.ellipsis(win.title, 12),
- tooltip: this.tooltip,
+ // function called when the button is clicked (used instead of click event)
handler : function () {
if (win.minimized || win.hidden) {
win.show();
@@ -34,7 +88,14 @@
win.toFront();
}
},
- clickEvent: 'mousedown'
+ pressed: true, // start as pressed
+ scope: this, // scope for the handler
+ text: Ext.util.Format.ellipsis(win.title, this.ellipsis),
+ toggleHandler: function(button, state){
+ //TODO leverage built in toggle support
+ //change the btn class?
+ },
+ tooltip: this.tooltip
});
},
@@ -50,6 +111,7 @@
var data = {cls: 'myclass', title: w.title, no: n, description: desc};
this.setTipText(data);
+ // QuickTips config object
this.tooltip = {
//title: 'My Tooltip',
text: this.toolTipText
Modified: mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/ActiveApps.js
===================================================================
--- mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/ActiveApps.js 2008-12-05 22:25:02 UTC (rev 47)
+++ mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/ActiveApps.js 2008-12-05 22:40:04 UTC (rev 48)
@@ -3,6 +3,7 @@
* @extends Ext.ux.Appbar
*/
Ext.ux.ActiveAppsPanel = Ext.extend(Ext.ux.Appbar, {
+/*
activeButton: null,
enableScroll: true,
scrollIncrement: 0,
@@ -10,11 +11,8 @@
scrollDuration: 0.35,
animScroll: true,
resizeButtons: true,
- buttonWidth: 168,
- minButtonWidth: 118,
buttonMargin: 2,//2,
buttonWidthSet: false,
- toggleGroup: 'taskbuttons',
baseCls: 'ux-taskbuttons',
@@ -26,16 +24,16 @@
},
delegateUpdates: function () {
- /*if(this.suspendUpdates){
+ if(this.suspendUpdates){
return;
- }*/
+ }
if (this.rendered && this.items) {
if (this.resizeButtons) {
- //this.autoSize();
+ this.autoSize();
}
if (this.enableScroll) {
- //this.autoScroll();
+ this.autoScroll();
}
}
},
@@ -58,12 +56,12 @@
this.items = s;
this.delegateUpdates();
},
-
+*/
setActiveButton: function (btn) {
this.activeButton = btn;
- this.delegateUpdates();
- },
-
+// this.delegateUpdates();
+ }
+/*
autoSize: function () {
var count, ow, aw, each, btns, btn, tw, iw;
// if (!this.items) return;
@@ -195,10 +193,10 @@
return (this.scrollIncrement || this.lastButtonWidth + 2);
},
- /* getBtnEl : function(item){
+ getBtnEl : function(item){
return document.getElementById(item.id);
- }, */
-
+ },
+
scrollToButton : function (item, animate) {
var el, pos, area, right, left;
item = item.el.dom.parentNode; // li
@@ -248,5 +246,6 @@
this.scrollLeft[pos === 0 ? 'addClass' : 'removeClass']('ux-taskbuttons-scroller-left-disabled');
this.scrollRight[pos >= (this.getScrollWidth() - this.getScrollArea()) ? 'addClass' : 'removeClass']('ux-taskbuttons-scroller-right-disabled');
}
+*/
});
Ext.reg('activeAppsPanel', Ext.ux.ActiveAppsPanel);
\ No newline at end of file
Modified: mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/TaskBar.js
===================================================================
--- mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/TaskBar.js 2008-12-05 22:25:02 UTC (rev 47)
+++ mickael/trunk/ext/v3.0.0-a1/learn/desktop/js/toolbar/TaskBar.js 2008-12-05 22:40:04 UTC (rev 48)
@@ -155,6 +155,7 @@
var taskbar = {
//xtype: 'panel',
id: this.id || 'ux-taskbar',
+//TODO: WTF doesn't firefox see this as the height? IE does when it doesn't barf
height: 90,
collapsible: true,
collapseMode: 'mini',
@@ -165,6 +166,8 @@
Ext.apply(this, taskbar);
this.items = [tbStart, tbApps, tbTray];
+
+//TODO: get the above heap block to still work if moved inside initComponent
Ext.ux.TaskBar.superclass.constructor.call(this, config);
},
@@ -198,9 +201,8 @@
* Called on beforecollapse event of taskbar
*/
onBeforeCollapse: function() {
- //need to maintain a high z-index so the
- //taskbar remains visually on top (Ext resets
- //the z-index when it expands/collapses)
+ // Ext resets the z-index when it expands/collapses)
+ // need to maintain a high z-index so the taskbar remains visually on top when expanded again
this.el.applyStyles('z-index:14001');
},