chrome/browser/resources/performance_monitor/chart.html - Issue 10900035: Version 2 of CPM UI, with rearranged controls, multiple graphs, event rollovers, etc.

Side by Side Diff: chrome/browser/resources/performance_monitor/chart.html

Issue 10900035: Version 2 of CPM UI, with rearranged controls, multiple graphs, event rollovers, etc. (Closed) Base URL: http://git.chromium.org/chromium/src.git@master

Patch Set: Created 8 years, 3 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« chrome/browser/resources/performance_monitor/chart.css ('K') | « chrome/browser/resources/performance_monitor/chart.css ('k') | chrome/browser/resources/performance_monitor/chart.js » ('j') | chrome/browser/resources/performance_monitor/chart.js » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!doctype html>	1 <!doctype html>

2	2

3 <!-- Copyright (c) 2012 The Chromium Authors. All rights reserved.	3 <!-- Copyright (c) 2012 The Chromium Authors. All rights reserved.

4 Use of this source code is governed by a BSD-style license that can be	4 Use of this source code is governed by a BSD-style license that can be

5 found in the LICENSE file. -->	5 found in the LICENSE file. -->

6	6

7 <!-- This page uses Flot version 0.7 in compressed form for efficiency.	7 <!-- This page uses Flot version 0.7 in compressed form for efficiency.

8 Readable Flot source is available at http://code.google.com/p/flot/	8 Readable Flot source is available at http://code.google.com/p/flot/

9 Good caliber Flot API docs are at: http://people.iola.dk/olau/flot/API.txt	9 Good caliber Flot API docs are at: http://people.iola.dk/olau/flot/API.txt

10 as of 6/2012. -->	10 as of 6/2012. -->

11	11

12 <html>	12 <html>

13 <head>	13 <head>

14 <link rel="stylesheet" type="text/css" href="chart.css">	14 <link rel="stylesheet" type="text/css" href="chart.css">

15 </head>	15 </head>

16 <body>	16 <body>

17 <div id="choose-block">	17 <div class="horizontal-box">

18 <div id="choose-metrics">	18 <div id="choose-block">

19 <h2>Choose Metrics</h2>	19 <div id="choose-time-range-header" class="tab-label">
	Jeffrey Yasskin 2012/08/30 00:15:10 Why <div class="tab-label"> instead of <h1>? (Acce Why <div class="tab-label"> instead of <h1>? (Accessibility should be helped by using the standard elements, but maybe that's not how we do things in extensions.) clintstaley 2012/08/30 21:40:18 We're still working on that left-bar, and among ot Show quoted text On 2012/08/30 00:15:10, Jeffrey Yasskin wrote: > Why <div class="tab-label"> instead of <h1>? (Accessibility should be helped by > using the standard elements, but maybe that's not how we do things in > extensions.) We're still working on that left-bar, and among other things may be turning it into an accordion. Seems useful to be able to identify tags that are tab labels. The accessibility point is something I hadn't thought of, tho. Will bear this in mind and prefer standard tags when possible.
	20 Time Range

	21 </div>

	22 <div class="category-label">Time Resolution</div>

	23 <div id="choose-time-range">

	24 </div>

	25 <div class="category-label">Back/Forward by Half-Ranges</div>

	26 <div class="horizontal-box">

	27 <button id="back-time"><<</button>
	Jeffrey Yasskin 2012/08/30 00:15:10 title="Back"? title="Back"? clintstaley 2012/08/30 21:40:18 Accessiblity? Done. Show quoted text On 2012/08/30 00:15:10, Jeffrey Yasskin wrote: > title="Back"? Accessiblity? Done.
	28 <div class="spacer"></div>

	29 <button id="forward-time">>></button>

	30 </div>

	31

	32 <div id="choose-metrics-header" class="tab-label">

	33 Metrics to Display

	34 </div>

	35 <div id="choose-metrics">

	36 </div>

	37

	38 <div id="choose-events-header" class="tab-label">

	39 Events to Display

	40 </div>

	41 <div id="choose-events">

	42 </div>

20 </div>	43 </div>

21 <div id="choose-events">	44

22 <h2>Choose Events</h2>	45 <div id="charts"></div>

	46 <div id="templates" hidden>

	47 <div id="label-template" class="event-label"></div>

	48 <div id="category-label-template" class="category-label"></div>

	49 <div id="detail-checkbox-template" class="detail-checkbox">

	50 <div class="horizontal-box">

	51 <input type="checkbox"></input>

	52 <div class="detail-label">Change this label</div>

	53 <div class="spacer"></div>

	54 <div class="color-icon"></div>

	55 </div>

	56 </div>

	57 <div id="radio-template" class="radio">

	58 <div class="horizontal-box">

	59 <input type="radio" name="time-range"/>

	60 <span>Change this label</span>

	61 </div>

	62 </div>

23 </div>	63 </div>

24 <div class="spacer"></div>	64 <script src="chrome://resources/js/cr.js"></script>
	Jeffrey Yasskin 2012/08/30 00:15:10 Why move the scripts inside the div? Why move the scripts inside the div? clintstaley 2012/08/30 21:40:18 Sloppiness.:) Done. Show quoted text On 2012/08/30 00:15:10, Jeffrey Yasskin wrote: > Why move the scripts inside the div? Sloppiness.:) Done.
25 <div id="choose-time-range">	65 <script src="chrome://resources/js/util.js"></script>

26 <h2>Choose Time Range</h2>	66 <script src="jquery.js"></script>

27 </div>	67 <script src="flot.js"></script>

	68 <script src="chart.js"></script>

28 </div>	69 </div>

29 <div id="charts"></div>

30 <div id="templates" hidden>

31 <div id="label-template" class="event-label"></div>

32 <div id="checkbox-template" class="checkbox">

33 <label>

34 <input type="checkbox"></input>

35 <span>Change this label</span>

36 </label>

37 </div>

38 <div id="radio-template" class="radio">

39 <label>

40 <input type="radio" name="time-range">

41 <span>Change this label</span>

42 </label>

43 </div>

44 </div>

45 <script src="chrome://resources/js/cr.js"></script>

46 <script src="chrome://resources/js/util.js"></script>

47 <script src="jquery.js"></script>

48 <script src="flot.js"></script>

49 <script src="chart.js"></script>

50 </body>	70 </body>

51 </html>	71 </html>

OLD	NEW