/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ const Clutter = imports.gi.Clutter; const Lang = imports.lang; const Mainloop = imports.mainloop; const St = imports.gi.St; const Signals = imports.signals; const Tweener = imports.ui.tweener; const Main = imports.ui.main; const ANIMATION_TIME = 0.2; const NOTIFICATION_TIMEOUT = 4; const MESSAGE_TRAY_TIMEOUT = 0.2; const ICON_SIZE = 24; function Notification(icon, text) { this._init(icon, text); } Notification.prototype = { _init: function(icon, text) { this.icon = icon; this.text = text; } } function NotificationBox() { this._init(); } NotificationBox.prototype = { _init: function() { this.actor = new St.BoxLayout({ name: 'notification' }); this._iconBox = new St.Bin(); this.actor.add(this._iconBox); this._text = new St.Label(); this.actor.add(this._text, { expand: true, x_fill: false, y_fill: false, y_align: St.Align.MIDDLE }); }, setContent: function(notification) { this._iconBox.child = notification.icon; // Support , , and , escape anything else // so it displays as raw markup. let markup = notification.text.replace(/<(\/?[^biu]>|[^>\/][^>])/g, "<$1"); this._text.clutter_text.set_markup(markup); } }; function Source(id, createIcon) { this._init(id, createIcon); } Source.prototype = { _init: function(id, createIcon) { this.id = id; if (createIcon) this.createIcon = createIcon; }, // This can be overridden by a subclass, or by the createIcon // parameter to _init() createIcon: function(size) { throw new Error('no implementation of createIcon in ' + this); }, notify: function(text) { Main.messageTray.showNotification(new Notification(this.createIcon(ICON_SIZE), text)); }, clicked: function() { this.emit('clicked'); }, destroy: function() { this.emit('destroy'); } }; Signals.addSignalMethods(Source.prototype); function MessageTray() { this._init(); } MessageTray.prototype = { _init: function() { this.actor = new St.BoxLayout({ name: 'message-tray', reactive: true }); let primary = global.get_primary_monitor(); this.actor.x = 0; this.actor.y = primary.height - 1; this.actor.width = primary.width; this._summaryBin = new St.Bin({ x_align: St.Align.END }); this.actor.add(this._summaryBin, { expand: true }); this._summaryBin.hide(); this._notificationBox = new NotificationBox(); this._notificationQueue = []; this.actor.add(this._notificationBox.actor); this._notificationBox.actor.hide(); Main.chrome.addActor(this.actor, { affectsStruts: false }); this.actor.connect('enter-event', Lang.bind(this, this._onMessageTrayEntered)); this.actor.connect('leave-event', Lang.bind(this, this._onMessageTrayLeft)); this._isShowing = false; this.actor.show(); this._summary = new St.BoxLayout({ name: 'summary-mode' }); this._summaryBin.child = this._summary; this._sources = {}; this._icons = {}; }, contains: function(source) { return this._sources.hasOwnProperty(source.id); }, add: function(source) { if (this.contains(source)) { log('Trying to re-add source ' + source.id); return; } let iconBox = new St.Bin({ reactive: true }); iconBox.child = source.createIcon(ICON_SIZE); this._summary.insert_actor(iconBox, 0); this._icons[source.id] = iconBox; this._sources[source.id] = source; iconBox.connect('button-release-event', Lang.bind(this, function () { source.clicked(); })); source.connect('destroy', Lang.bind(this, function () { this.remove(source); })); }, remove: function(source) { if (!this.contains(source)) return; this._summary.remove_actor(this._icons[source.id]); delete this._icons[source.id]; delete this._sources[source.id]; }, getSource: function(id) { return this._sources[id]; }, _onMessageTrayEntered: function() { // Don't hide the message tray after a timeout if the user has moved the mouse over it. // We might have a timeout in place if the user moved the mouse away from the message tray for a very short period of time // or if we are showing a notification. if (this._hideTimeoutId > 0) Mainloop.source_remove(this._hideTimeoutId); if (this._isShowing) return; // If the message tray was not already showing, we'll show it in the summary mode. this._summaryBin.show(); this._show(); }, _onMessageTrayLeft: function() { if (!this._isShowing) return; // We wait just a little before hiding the message tray in case the user will quickly move the mouse back over it. this._hideTimeoutId = Mainloop.timeout_add(MESSAGE_TRAY_TIMEOUT * 1000, Lang.bind(this, this._hide)); }, _show: function() { this._isShowing = true; let primary = global.get_primary_monitor(); Tweener.addTween(this.actor, { y: primary.height - this.actor.height, time: ANIMATION_TIME, transition: "easeOutQuad" }); }, _hide: function() { this._hideTimeoutId = 0; let primary = global.get_primary_monitor(); Tweener.addTween(this.actor, { y: primary.height - 1, time: ANIMATION_TIME, transition: "easeOutQuad", onComplete: this._hideComplete, onCompleteScope: this }); return false; }, _hideComplete: function() { this._isShowing = false; this._summaryBin.hide(); this._notificationBox.actor.hide(); if (this._notificationQueue.length > 0) this.showNotification(this._notificationQueue.shift()); }, showNotification: function(notification) { if (this._isShowing) { this._notificationQueue.push(notification); return; } this._notificationBox.setContent(notification); this._notificationBox.actor.x = Math.round((this.actor.width - this._notificationBox.actor.width) / 2); this._notificationBox.actor.show(); // Because we set up the timeout before we do the animation, we add ANIMATION_TIME to NOTIFICATION_TIMEOUT, so that // NOTIFICATION_TIMEOUT represents the time the notifiation is fully shown. this._hideTimeoutId = Mainloop.timeout_add((NOTIFICATION_TIMEOUT + ANIMATION_TIME) * 1000, Lang.bind(this, this._hide)); this._show(); } };