Add v2 UI for the perf dashboard
[WebKit-https.git] / Websites / perf.webkit.org / public / v2 / popup.js
1 App.PopupView = Ember.View.extend({
2     templateName: 'popup',
3     classNames: ['popup'],
4     popupListContainerView: Ember.ContainerView.extend(),
5     init: function ()
6     {
7         this._super();
8         this._listView = null;
9     },
10     showPopup: function ()
11     {
12         this.unscheduleHiding();
13         if (!this._listView) {
14             var list = this.get('list');
15             this._listView = App.PopupListView.create({tagName: 'ul', list: list});
16             this.get('popupListContainerViewInstance').pushObject(this._listView);
17         }
18         this._listView.showList();
19     },
20     scheduleHiding: function ()
21     {
22         this._hidingTimer = Ember.run.later(this, this.hideNow, 100);
23     },
24     unscheduleHiding: function ()
25     {
26         Ember.run.cancel(this._hidingTimer);
27         this._hidingTimer = null;
28     },
29     hideNow: function ()
30     {
31         if (this._listView)
32             this._listView.hideList();
33     }
34 });
35
36 App.PopupButtonView = Ember.View.extend({
37     template: Ember.Handlebars.compile('{{view.label}}'),
38     classNames: ['popup-button'],
39     attributeBindings: ['href'],
40     href: '#',
41     mouseEnter: function ()
42     {
43         this.get('parentView').showPopup();
44     },
45     click: function (event)
46     {
47         this.get('parentView').showPopup();
48         event.preventDefault();
49     },
50     mouseLeave: function ()
51     {
52         this.get('parentView').scheduleHiding();
53     },
54 });
55
56 App.PopupListView = Ember.View.extend({
57     templateName: 'popup-list',
58     init: function ()
59     {
60         this._super();
61         this._shouldHide = true;
62     },
63     _poupView: function ()
64     {
65         var containerView = this.get('parentView');
66         return containerView.get('parentView');
67     },
68     didInsertElement: function ()
69     {
70         if (this._shouldHide)
71             this.$().hide();
72         else
73             this._showListSyncIfPossible();
74         this._super();
75     },
76     mouseEnter: function ()
77     {
78         this._poupView().unscheduleHiding();
79     },
80     mouseLeave: function ()
81     {
82         this._poupView().scheduleHiding();
83     },
84     showList: function ()
85     {
86         this._shouldHide = false;
87         this._showListSyncIfPossible();
88     },
89     _showListSyncIfPossible: function ()
90     {
91         if (!this.$())
92             return;
93         var popupView = this._poupView();
94         if (popupView.get('parentView') instanceof App.PopupListView) {
95             var parentListView = popupView.get('parentView');
96             parentListView.get('childViews').map(function (sibling) {
97                 if (sibling != popupView)
98                     sibling.hideNow();
99             });
100             this.$().css('left', parentListView.$().outerWidth() + 5);
101         } else
102             this.$().css('top', popupView.$().height() - 5);
103         this.$().show();
104     },
105     hideList: function ()
106     {
107         this._shouldHide = true;
108         this._hideListSyncIfPossible();
109     },
110     _hideListSyncIfPossible: function ()
111     {
112         if (!this.$())
113             return;
114         this.$().hide();
115     }
116 });