1 // Copyright 2013 The Chromium Authors. All rights reserved. 2 // Use of this source code is governed by a BSD-style license that can be 3 // found in the LICENSE file. 4 5 /** 6 * This is a view class showing subs of selected item. 7 * TODO(junjianx): use dropdown menu to show. 8 * @param {Object} profiler Must have addListener method. 9 * @construct 10 */ 11 var DropdownView = function(profiler) { 12 this.profiler_ = profiler; 13 this.placeholder_ = '#subs-dropdown'; 14 // Clear state when profiler model changed. 15 profiler.addListener('changed', this.redraw_.bind(this)); 16 profiler.addListener('changed:selected', this.update_.bind(this)); 17 }; 18 19 /** 20 * Render new dropdown at first time being called and recover otherwise. 21 * @private 22 */ 23 DropdownView.prototype.redraw_ = function() { 24 var self = this; 25 26 var data = [{ label: 'subs' }]; 27 if (!this.$tree_) { 28 this.$tree_ = $(this.placeholder_).tree({ 29 data: data, 30 autoOpen: true 31 }); 32 33 // Delegate click event to profiler. 34 this.$tree_.bind('tree.click', function(event) { 35 event.preventDefault(); 36 self.profiler_.setSub(event.node.id); 37 }); 38 } else { 39 this.$tree_.tree('loadData', data); 40 $(this.placeholder_).css('display', 'none'); 41 } 42 }; 43 44 /** 45 * Update dropdown view when new model is selected in menu view. 46 * @param {string} id Model id. 47 * @param {Object} pos Clicked position. 48 * @private 49 */ 50 DropdownView.prototype.update_ = function(id, pos) { 51 if (id == null) { 52 $(this.placeholder_).css('display', 'none'); 53 return; 54 } 55 56 var self = this; 57 58 // Get all subs of selected model. 59 var prof = this.profiler_; 60 var models = prof.getModelsbyId(id); 61 var children = models.reduce(function(previous, current) { 62 if ('subs' in current) { 63 current.subs.forEach(function(sub) { 64 var id = sub.join(','); 65 var label = sub.join(':'); 66 if (!previous.some(function(sub) { 67 return sub.id === id; 68 })) { 69 var child = { 70 id: id, 71 label: label 72 }; 73 previous.push(child); 74 } 75 }); 76 } 77 return previous; 78 }, []); 79 80 // Update data of subs tree. 81 var data = [{ 82 label: 'subs', 83 children: children 84 }]; 85 var $tree = this.$tree_; 86 $tree.tree('loadData', data); 87 88 // Select current sub if exists. 89 var curSub = prof.getCurSubById(id); 90 if (curSub) { 91 var node = $tree.tree('getNodeById', curSub); 92 $tree.tree('selectNode', node); 93 } 94 95 // If selected category has subs, display subs box. 96 $(this.placeholder_).css('display', 'none'); 97 if (children.length > 0) { 98 var view = $(this.placeholder_); 99 view.css('display', 'block'); 100 if (pos != undefined) { 101 view.css('position', 'fixed'); 102 view.css('top', pos.pageY); 103 view.css('left', pos.pageX); 104 } else { 105 view.css('position', 'static'); 106 } 107 } 108 }; 109