API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Apr 29th, 2009
372
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.06 KB | None | 0 0
raw download clone embed print report
  1. Ext.onReady(function() {
  2. Ext.QuickTips.init();
  3. var alertData = [['10','node0','crit','tmp table to disk ratio too high'],
  4. ['36','node0','crit','binary logs not set to auto-purge'],
  5. ['39','node0','crit','max_heap_table_size ratio too small']
  6. ];
  7.  
  8. var summaryData = [
  9. ['node0',
  10. 0,
  11. 95,
  12. 0.17,
  13. 5,
  14. 58,
  15. 10,
  16. 1018259336,
  17. 20,
  18. 25,
  19. 550792,
  20. 1017708544],
  21.  
  22. ['Total Values',
  23. 0,
  24. 0,
  25. 0.17,
  26. 5,
  27. 58,
  28. 10,
  29. 1018259336,
  30. 20,
  31. 25,
  32. 550792,
  33. 1017708544]];
  34.  
  35. var detailEl;
  36.  
  37. var contentPanel = {
  38. id: 'content-panel',
  39. region: 'center',
  40. layout: 'card',
  41. margins: '2 5 5 0',
  42. activeItem: 0,
  43. border: false,
  44. items: [
  45. border
  46. ]
  47. };
  48.  
  49. var refreshTab=function(tab){
  50. tab.getUpdater().refresh();
  51. };
  52.  
  53. var border = {
  54. id:'border-panel',
  55. title: 'Kontrollbase',
  56. layout:'border',
  57. region:'center',
  58. bodyBorder: false,
  59. defaults: {
  60. collapsible: true,
  61. split: true,
  62. animFloat: false,
  63. autoHide: false,
  64. useSplitTips: true,
  65. bodyStyle: 'padding:0px'
  66. },
  67.  
  68. items: [
  69. {
  70. title: 'Critical Environment Alerts',
  71. region: 'south',
  72. height: 200,
  73. xtype: 'grid',
  74. store: new Ext.data.SimpleStore({
  75. fields: [
  76. {name: 'id'},
  77. {name: 'server'},
  78. {name: 'state'},
  79. {name: 'name'}
  80. ]}),
  81. columns: [
  82. {
  83. id: 'id',
  84. header: "id",
  85. width: 60,
  86. sortable: true,
  87. renderer: 'undef',
  88. dataIndex: 'id'
  89. },
  90. {
  91. id: 'server',
  92. header: "server",
  93. width: 160,
  94. sortable: true,
  95. renderer: 'undef',
  96. dataIndex: 'server'
  97. },
  98. {
  99. id: 'state',
  100. header: "state",
  101. width: 35,
  102. sortable: true,
  103. renderer: 'undef',
  104. dataIndex: 'state'
  105. },
  106. {
  107. id: 'name',
  108. header: "name",
  109. width: 200,
  110. sortable: true,
  111. renderer: 'undef',
  112. dataIndex: 'name'
  113. }
  114. ],
  115. stripeRows: true,
  116. autoExpandColumn: 'name',
  117. listeners: { render: function(){this.store.loadData(alertData);}}
  118. },
  119. {
  120. region:'west',
  121. id:'west-panel',
  122. title:'Navigation',
  123. split:true,
  124. width: 200,
  125. minSize: 175,
  126. maxSize: 400,
  127. collapsible: true,
  128. margins:'5 0 0 0',
  129. layout:'accordion',
  130. layoutConfig:{
  131. animate:true
  132. },
  133. items: [{
  134. title: 'Servers List',
  135. html: "foo",
  136. autoScroll: true,
  137. animScroll: true,
  138. iconCls:'nav'
  139. },{
  140. title:'Session',
  141. iconCls:'settings',
  142. deferredRender: true,
  143. autoScroll: true,
  144. animScroll: true,
  145. listeners: {activate: refreshTab},
  146. autoLoad: {url: 'session.php'}
  147. }]
  148. },
  149. {
  150. xtype: 'tabpanel',
  151. plain: true,
  152. region: 'center',
  153. margins: '5 0 0 0',
  154. activeTab: 0,
  155. autoScroll: true,
  156. animScroll: true,
  157. collapsible: false,
  158. bodyStyle: 'padding:5px 0px 0px 5px',
  159. items: [
  160. {
  161. title: 'Overview',
  162. deferredRender: true,
  163. width:440,
  164. height:480,
  165. layout : 'fit',
  166. listeners: {activate: refreshTab},
  167. autoLoad: {url: 'overview.php'},
  168. shim:false,
  169. frame:true,
  170. animCollapse:false,
  171. enableTabScroll:true,
  172. autoScroll:true
  173. },
  174. {
  175. title: 'Summary Data',
  176. xtype: 'grid',
  177. layout: 'fit',
  178. store: new Ext.data.SimpleStore({
  179. fields: [
  180. {name: 'hostname'},
  181. {name: 'load', type: 'float'},
  182. {name: 'mem_used', type: 'float'},
  183. {name: 'QPS', type: 'float'},
  184. {name: 'schema', type: 'float'},
  185. {name: 'tables', type: 'float'},
  186. {name: 'conn', type: 'float'},
  187. {name: 'total_size', type: 'float'},
  188. {name: 'num_innodb', type: 'float'},
  189. {name: 'num_myisam', type: 'float'},
  190. {name: 'myisam_total', type: 'float'},
  191. {name: 'innodb_total', type: 'float'}
  192. ]
  193. }),
  194. columns: [
  195. {id: 'hostname', header: "server hostname", width: 80, sortable: true, renderer: 'lowercase', dataIndex: 'hostname'},
  196. {id: 'load', header: "load", width: 45, sortable: true, renderer: 'undef', dataIndex: 'load'},
  197. {id: 'mem_used', header: "mem%", width: 50, sortable: true, renderer: 'undef', dataIndex: 'mem_used'},
  198. {id: 'QPS', header: "QPS", width: 50, sortable: true, renderer: 'undef', dataIndex: 'QPS'},
  199. {id: 'schema', header: "schema", width: 55, sortable: true, renderer: 'undef', dataIndex: 'schema'},
  200. {id: 'tables', header: "tables", width: 55, sortable: true, renderer: 'undef', dataIndex: 'tables'},
  201. {id: 'conn', header: "#conn", width: 55, sortable: true, renderer: 'undef',dataIndex: 'conn'},
  202. {id: 'total_size', header: "total size", width: 65, sortable: true, renderer: 'fileSize', dataIndex: 'total_size'},
  203. {id: 'num_innodb', header: "#innodb", width: 65, sortable: true, renderer: 'undef', dataIndex: 'num_innodb'},
  204. {id: 'num_myisam', header: "#myisam", width: 65, sortable: true, renderer: 'undef', dataIndex: 'num_myisam'},
  205. {id: 'myisam_total', header: "myisam_total", width: 75, sortable: true, renderer: 'fileSize', dataIndex: 'myisam_total'},
  206. {id: 'innodb_total', header: "innodb_total", width: 75, sortable: true, renderer: 'fileSize', dataIndex: 'innodb_total'},
  207. ],
  208. stripeRows: true,
  209. autoExpandColumn: 'hostname',
  210. listeners: { render: function(){this.store.loadData(summaryData);}}},
  211. {
  212. title: 'Alert Management',
  213. deferredRender: true,
  214. height: 480,
  215. width:440,
  216. layout : 'fit',
  217. items: [
  218. {
  219. xtype: 'tabpanel',
  220. plain: true,
  221. region: 'center',
  222. margins: '0 5 5 5',
  223. activeTab: 0,
  224. autoScroll: true,
  225. animScroll: true,
  226. items: [
  227. {
  228. title: 'Alerts',
  229. deferredRender: true,
  230. height: 480,
  231. width:440,
  232. layout : 'fit',
  233. listeners: {activate: refreshTab},
  234. items: {
  235. xtype : 'iframepanel',
  236. defaultSrc : 'foo'
  237. },
  238. shim:false,
  239. frame:true,
  240. animCollapse:false,
  241. enableTabScroll:true,
  242. autoScroll:true
  243. },
  244. {
  245. title: 'Acknowledged',
  246. deferredRender: true,
  247. height: 480,
  248. width:440,
  249. layout : 'fit',
  250. listeners: {activate: refreshTab},
  251. items: {
  252. xtype : 'iframepanel',
  253. defaultSrc : 'foo'
  254. },
  255. shim:false,
  256. frame:true,
  257. animCollapse:false,
  258. enableTabScroll:true,
  259. autoScroll:true
  260. },
  261. {
  262. title: 'Ignored',
  263. deferredRender: true,
  264. height: 480,
  265. width:440,
  266. layout : 'fit',
  267. listeners: {activate: refreshTab},
  268. items: {
  269. xtype : 'iframepanel',
  270. defaultSrc : 'foo'
  271. },
  272. shim:false,
  273. frame:true,
  274. animCollapse:false,
  275. enableTabScroll:true,
  276. autoScroll:true
  277. }
  278. ]
  279. }]},
  280. {
  281. title: 'System Management',
  282. deferredRender: true,
  283. height: 480,
  284. width:440,
  285. layout : 'fit',
  286. items: [
  287. {
  288. xtype: 'tabpanel',
  289. plain: true,
  290. region: 'center',
  291. margins: '0 5 5 5',
  292. activeTab: 0,
  293. autoScroll: true,
  294. animScroll: true,
  295. items: [
  296. {
  297. title: 'Data Management',
  298. deferredRender: true,
  299. height: 480,
  300. width:440,
  301. layout : 'fit',
  302. listeners: {activate: refreshTab},
  303. items: {
  304. xtype : 'iframepanel',
  305. defaultSrc : 'foo'
  306. },
  307. shim:false,
  308. frame:true,
  309. animCollapse:false,
  310. enableTabScroll:true,
  311. autoScroll:true
  312. },
  313. {
  314. title: 'System',
  315. deferredRender: true,
  316. height: 480,
  317. width:440,
  318. layout : 'fit',
  319. listeners: {activate: refreshTab},
  320. items: {
  321. xtype : 'iframepanel',
  322. defaultSrc : 'foo'
  323. },
  324. shim:false,
  325. frame:true,
  326. animCollapse:false,
  327. enableTabScroll:true,
  328. autoScroll:true
  329. },
  330. {
  331. title: 'Hosts',
  332. deferredRender: true,
  333. height: 480,
  334. width:440,
  335. layout : 'fit',
  336. listeners: {activate: refreshTab},
  337. items: {
  338. xtype : 'iframepanel',
  339. defaultSrc : 'foo'
  340. },
  341. shim:false,
  342. frame:true,
  343. animCollapse:false,
  344. enableTabScroll:true,
  345. autoScroll:true
  346. },
  347. {
  348. title: 'Users',
  349. deferredRender: true,
  350. height: 480,
  351. width:440,
  352. layout : 'fit',
  353. listeners: {activate: refreshTab},
  354. items: {
  355. xtype : 'iframepanel',
  356. defaultSrc : 'foo'
  357. },
  358. shim:false,
  359. frame:true,
  360. animCollapse:false,
  361. enableTabScroll:true,
  362. autoScroll:true
  363. },
  364. {
  365. title: 'Clients',
  366. deferredRender: true,
  367. height: 480,
  368. width:440,
  369. layout : 'fit',
  370. listeners: {activate: refreshTab},
  371. items: {
  372. xtype : 'iframepanel',
  373. defaultSrc : 'foo'
  374. },
  375. shim:false,
  376. frame:true,
  377. animCollapse:false,
  378. enableTabScroll:true,
  379. autoScroll:true
  380. }
  381.  
  382. ]}]},
  383. {
  384. title: 'User Guide',
  385. deferredRender: true,
  386. height: 480,
  387. width:440,
  388. layout : 'fit',
  389. listeners: {activate: refreshTab},
  390. items: {
  391. xtype : 'iframepanel',
  392. defaultSrc : 'foo'
  393. },
  394. shim:false,
  395. frame:true,
  396. animCollapse:false,
  397. enableTabScroll:true,
  398. autoScroll:true
  399. }
  400.  
  401. ]}]};
  402.  
  403.  
  404. new Ext.Viewport({
  405. layout: 'border',
  406. title: 'Ext Layout Browser',
  407. items: [
  408. border
  409. ],
  410. renderTo: Ext.getBody()
  411. });
  412. });
  413.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!