=== modified file 'src/com/goldencode/p2j/ui/client/gui/ModalWindow.java' --- src/com/goldencode/p2j/ui/client/gui/ModalWindow.java 2015-08-26 22:14:27 +0000 +++ src/com/goldencode/p2j/ui/client/gui/ModalWindow.java 2015-09-09 21:33:23 +0000 @@ -74,7 +74,8 @@ titleBar = new WindowTitleBar(WidgetId.nextID(), false, - new CaptionButtonType[] {CaptionButtonType.CLOSE}); + new CaptionButtonType[] {CaptionButtonType.CLOSE}, + title); windowPane.add(titleBar); windowPane.add(contentPane); add(windowPane); === modified file 'src/com/goldencode/p2j/ui/client/gui/WindowGuiImpl.java' --- src/com/goldencode/p2j/ui/client/gui/WindowGuiImpl.java 2015-09-04 13:38:15 +0000 +++ src/com/goldencode/p2j/ui/client/gui/WindowGuiImpl.java 2015-09-09 21:32:42 +0000 @@ -1316,8 +1316,7 @@ protected void reset() { super.reset(); - - titleBar = new WindowTitleBar(WidgetId.nextID()); + titleBar = new WindowTitleBar(WidgetId.nextID(), title()); // TODO: what is the layout mgr for the GUI window (the workspace)? workspace = new WindowWorkSpace(WidgetId.nextID(), ScrollBar.Bars.BOTH); === modified file 'src/com/goldencode/p2j/ui/client/gui/WindowTitleBar.java' --- src/com/goldencode/p2j/ui/client/gui/WindowTitleBar.java 2015-09-08 22:00:49 +0000 +++ src/com/goldencode/p2j/ui/client/gui/WindowTitleBar.java 2015-09-09 21:45:30 +0000 @@ -93,15 +93,18 @@ * * @param id * The widget's ID. + * @param windowTitle + * The window title. */ - public WindowTitleBar(WidgetId id) + public WindowTitleBar(WidgetId id, String windowTitle) { this(id, true, new CaptionButtonType[] { CaptionButtonType.ICONIFY, CaptionButtonType.MAXIMIZE, CaptionButtonType.CLOSE - }); + }, + windowTitle); } /** @@ -113,8 +116,11 @@ * If true the window's window icon will be shown. * @param buttonTypes * Array of button types to create on the bar. + * @param windowTitle + * The window title. */ - public WindowTitleBar(WidgetId id, boolean showWindowIcon, CaptionButtonType[] buttonTypes) + public WindowTitleBar(WidgetId id, boolean showWindowIcon, CaptionButtonType[] buttonTypes, + String windowTitle) { nativeInsets = new NativeInsets(2, 2, 2, 2); @@ -139,6 +145,7 @@ } title = new WindowTitle(WidgetId.nextID()); + title.setTitle(windowTitle); this.add(title); buttons = new CaptionButton[buttonTypes.length]; @@ -582,6 +589,9 @@ private class WindowTitle extends Label { + + private String title; + private boolean titleIsChanged; /** * Basic c'tor. * @@ -592,7 +602,29 @@ { super(id, "", WindowTitleBar.this.getId().asInt()); } - + + /** + * Returns the window title. + * + * @return The title + */ + public String getTitle() + { + return title; + } + + /** + * Sets the window title. + * + * @param title + * The title to set + */ + public void setTitle(String title) + { + this.title = title; + this.titleIsChanged = true; + } + /** * Draw this window title. */ @@ -603,7 +635,12 @@ String windowTitle = window.title(); final String title = (windowTitle == null ? WindowGuiImpl.DEFAULT_TITLE : windowTitle); - gd.setTitle(title); + + if (titleIsChanged || !title.equals(getTitle())) + { + gd.setTitle(title); + titleIsChanged = false; + } NativePoint origin = physicalLocation(); final NativeDimension d = physicalDimension(); final NativeRectangle clip = clipRectangle(origin, d); === modified file 'src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js' --- src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js 2015-09-09 15:55:53 +0000 +++ src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js 2015-09-09 21:13:14 +0000 @@ -734,9 +734,6 @@ fontId = p2j.socket.readInt32BinaryMessage(message, idx + 1); setFont(this.ctx, fontId); - - //sets font for the task bar - taskBar.setDefaultFont(fontId); break; case ops.SET_FONT_STYLE: var style = p2j.socket.readInt32BinaryMessage(message, idx + 1); @@ -1605,6 +1602,7 @@ p2j.fonts, p2j.logger); taskBar = desktop.getTaskBar(); + taskBar.setFont(cfg); }; /** === modified file 'src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.virtual_desktop.js' --- src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.virtual_desktop.js 2015-09-09 15:55:53 +0000 +++ src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.virtual_desktop.js 2015-09-09 21:13:14 +0000 @@ -202,19 +202,56 @@ function TaskBar(peer, bg, fg, fontsManager, logger) { var DRAGGED_OPACITY = 0.3; - var TOP_PADDING = 2; - var LEFT_PADDING = 2; + /** + * Top padding from the task bar border + */ + var TOP_PADDING = 2; + /** + * Bottom padding from the task bar border + */ + var BOTTOM_PADDING = 2; + /** + * Left padding from the task bar border + */ + var LEFT_PADDING = 2; + /** + * Right padding from the task bar border + */ + var RIGHT_PADDING = 2; + /** + * Margin around the icon + */ var ICON_MARGIN = 1; - var TEXT_MARGIN = 1; - var TASK_BAR_TITLE = "Task Bar"; + /** + * Margin around the text + */ + var TEXT_MARGIN = 4; + /** + * The task bar title. + */ + var TASK_BAR_TITLE = "Task Bar"; + /** + * The default task icon widget dimension: 40 x32 + */ var TASK_ICON_WIDTH = 40; var TASK_ICON_HEIGHT = 32; + /** + * The space between task icons. + */ var SHIFT = 2; - var TASK_BAR_FONT_ID = createDefaultFont(); - - + /** + * The task bar font id uses negative number in order + * to be different from fonts created for p2j windows + */ + var TASK_BAR_FONT_ID = -1; + + var LIGHTEN_COLOR_INTENSE = 10; + /** + * The task bar dragged panel + */ var dragged; + var canvas = document.createElement('canvas'); canvas.className="canvas"; canvas.style["height"] = "100%"; @@ -246,20 +283,6 @@ } /** - * Creates the default font for the task bar. - * It is added for the standalone test. - */ - function createDefaultFont() - { - var font = 1; - var name = "sans-serif"; - var size = 8; - var style = 1; - var b64Font = ""; - return fontsManager.createFont(font, name, size, style, b64Font); - }; - - /** * The default task bar tooltip. */ function setDefaultTooltip() @@ -311,7 +334,7 @@ var y; if (horizontalLayout) { - x = width - viewLogButton.width - LEFT_PADDING; + x = width - viewLogButton.width - RIGHT_PADDING; // to place on the centered horizontal line of the task bar. y = (height - viewLogButton.height) / 2; } @@ -319,7 +342,7 @@ { // to place on the centered vertical line of the task bar. x = (width - viewLogButton.width) / 2; - y = height - viewLogButton.height - TOP_PADDING; + y = height - viewLogButton.height - BOTTOM_PADDING; } viewLogButton.setLocation(x, y); viewLogButton.draw(); @@ -358,7 +381,7 @@ horizontalLayout = false; } - var unified = calculateTaskIconWidth(width, height, horizontalLayout); + var unified = calculateTaskIconWidth(width, height, SHIFT, horizontalLayout); setUnifiedDimension(unified, TASK_ICON_HEIGHT, horizontalLayout); var x; @@ -474,6 +497,8 @@ * The task bar width in pixels. * @param {Number} height * The task bar height in pixels. + * @param {Number} space + * The space between widgets in pixels. * @param {Boolean} horizontalLayout * Indicates the task bar layout, true if the task bar is along a horizontal line, otherwise, * it is along a vertical line. @@ -481,16 +506,20 @@ * @return {Number} * The unified task icon width. */ - function calculateTaskIconWidth(width, height, horizontalLayout) + function calculateTaskIconWidth(width, height, space, horizontalLayout) { + var numberOfWidgets = taskIcons.length + sysButtons.length; + var wasteSpaceWidth = space * (numberOfWidgets - 1); var maxWidth; if (horizontalLayout) { - maxWidth = width / (taskIcons.length + sysButtons.length); + // LEFT_PADDING widget1 SPACE widget2 .... SPACE widgetn RIGHT_PADDING + maxWidth = (width - wasteSpaceWidth - LEFT_PADDING - RIGHT_PADDING) / numberOfWidgets; } else { - maxWidth = height / (taskIcons.length + sysButtons.length); + // TOP_PADDING widget1 SPACE widget2 .... SPACE widgetn BOTTOM_PADDING + maxWidth = (height - wasteSpaceWidth - TOP_PADDING - BOTTOM_PADDING)/ numberOfWidgets; } var taskIconsWidth = calculateMaximalIconWidth(taskIcons, horizontalLayout); if (taskIconsWidth > 0) @@ -520,7 +549,7 @@ */ function setUnifiedDimension(unifiedWidth, unifiedHeight, horizontalLayout) { - function set(element, index, array) + function setDimension(element, index, array) { if (horizontalLayout) { @@ -534,8 +563,8 @@ } array[index].horizontalLayout = horizontalLayout; }; - taskIcons.forEach(set); - sysButtons.forEach(set); + taskIcons.forEach(setDimension); + sysButtons.forEach(setDimension); }; /** @@ -625,15 +654,40 @@ return taskIcon; }; - this.setDefaultFont = setDefaultFont; + this.setFont = setFont; /** * Sets the default font to be used by the task bar. + * + * @param {Object} fontConfig + * The font configuration { name : 'sans-serif', size : 8 }. */ - function setDefaultFont(fontId) + function setFont(fontConfig) { - TASK_BAR_FONT_ID = fontId; - }; + var font = TASK_BAR_FONT_ID; + var name; + if (fontConfig.name) + { + name = fontConfig.name; + } + else + { + name = "sans-serif"; + } + var size; + if (fontConfig.size) + { + size = fontConfig.size; + } + else + { + size = 8; + } + // bold + var style = 1; + var b64Font = ""; + return fontsManager.createFont(font, name, size, style, b64Font); + } /** * Find the window task that represents the target window. @@ -849,6 +903,31 @@ canvas.addEventListener("mouseover", changeTooltipOverWidget); canvas.addEventListener("mouseleave", function(event) { setDefaultTooltip(); }); + // add MDN resize throttler + window.addEventListener("resize", resizeThrottler, false); + + /** + * The id of the scheduled resize function + */ + var resizeTimeout; + + /** + * Redraws this task bar if the browser window is changing its size, + * with the frequency that doesn' exceed one time per 100 ms + */ + function resizeThrottler() + { + // ignore resize events as long as an actualResizeHandler execution is in the queue + if (!resizeTimeout) + { + resizeTimeout = window.setTimeout( + function() + { + resizeTimeout = null; + doLayout(peer.offsetWidth, peer.offsetHeight); + }, 100); + } + }; /** * Returns rgba(r,g,b,a) string representation for the target color * with the target transparency. @@ -997,33 +1076,43 @@ var textWidth = fontsManager.getTextWidth(TASK_BAR_FONT_ID, that.title); var textHeight = fontsManager.getTextHeight(TASK_BAR_FONT_ID, that.title); ctx.font = fontsManager.getFontName(TASK_BAR_FONT_ID); - var xTextPos; var yTextPos; if (that.horizontalLayout) { - var xShift = 0; + var xShift = TEXT_MARGIN; if (that.iconWidth > 0) { xShift += that.iconWidth + 2 * ICON_MARGIN; } - xTextPos = that.x + (that.width - textWidth + xShift) / 2; + xTextPos = that.x + (that.width - TEXT_MARGIN - textWidth + xShift) / 2; yTextPos = that.y + (that.height + textHeight) / 2; } else { - var yShift = 0; + var yShift = TEXT_MARGIN; if (that.iconHeight > 0) { yShift += that.iconHeight + 2 * ICON_MARGIN; } xTextPos = that.x + (that.width - textHeight) / 2; - yTextPos = that.y + (that.height - textWidth + yShift) / 2; + yTextPos = that.y + (that.height - TEXT_MARGIN - textWidth + yShift) / 2; ctx.translate(xTextPos, yTextPos); ctx.rotate(Math.PI / 2); xTextPos = 0; yTextPos = 0; } + if (active) + { + var textRgb = canvasRenderer.parseColor(ctx.fillStyle); + var selectedTextRgb = canvasRenderer.lightenColor(textRgb).map( + function(channel) + { + return LIGHTEN_COLOR_INTENSE * channel; + }); + ctx.fillStyle = canvasRenderer.createColorString(selectedTextRgb); + } + canvasRenderer.drawText( that.title, xTextPos,