2 * Menu shown by {@link Docs.view.HoverMenuButton}.
4 Ext.define('Docs.view.HoverMenu', {
5 extend: 'Ext.view.View',
7 componentCls: 'hover-menu',
8 itemSelector: 'div.item',
10 renderTo: Ext.getBody(),
13 * @cfg {Number} colHeight maximum number of items in one column.
14 * When more than that, items are placed into multiple columns.
15 * Defaults to 25 (current maximum length of history).
19 * @cfg {Boolean} showCloseButtons true to show "x" after each menu item.
22 showCloseButtons: false,
24 initComponent: function() {
25 this.tpl = new Ext.XTemplate(
31 '{[this.renderLink(values)]}',
32 '<tpl if="this.showCloseButtons">',
33 '<a class="close" href="#" rel="{cls}">x</a>',
36 // Start new column when columnHeight reached
37 '<tpl if="xindex % this.columnHeight === 0 && xcount > xindex">',
45 columnHeight: this.columnHeight,
46 showCloseButtons: this.showCloseButtons,
47 renderLink: function(values) {
48 var url = values.url || values.cls;
49 var label = values.label || values.cls;
50 return Ext.String.format('<a href="#/api/{0}" rel="{0}" class="docClass">{1}</a>', url, label);