Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1247)

Side by Side Diff: client/tests/client/layout/GridLayoutDemo.dart

Issue 9382027: Move client/{base, observable, layout, touch, util, view} to samples/ui_lib . (Closed) Base URL: http://dart.googlecode.com/svn/branches/bleeding_edge/dart/
Patch Set: '' Created 8 years, 10 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 | Annotate | Revision Log
OLDNEW
(Empty)
1 // Copyright (c) 2011, the Dart project authors. Please see the AUTHORS file
2 // for details. All rights reserved. Use of this source code is governed by a
3 // BSD-style license that can be found in the LICENSE file.
4
5 /**
6 * An app for testing the grid layout system.
7 */
8
9 /** Creates a grid view structure given the CSS styles. */
10 View createGrid(Map<String, Map<String, String>> styles) {
11 final gridStyle = styles['#grid'];
12
13 final children = new List<MockView>();
14 for (final String id in styles.getKeys()) {
15 // All selectors in this test are id selectors string the # prefix.
16 assert(id.startsWith('#'));
17 String elemId = id.substring(1);
18 if (elemId != 'grid') {
19 children.add(new MockView(elemId, styles[id]));
20 }
21 }
22
23 return new MockCompositeView('grid', gridStyle, children);
24 }
25
26 void _onLoad() {
27 var query = Uri.parseQuery(window.location.search)['q'];
28 if (query != null && query.length == 1) {
29 query = Uri.decodeComponent(query[0]);
30 addGridStyles('100%', '100%', 'margin:0px;');
31 final view = createGrid(GridExamples.styles[query]);
32 view.addToDocument(document.body);
33 _addColorStyles();
34 printMetrics(query);
35 } else {
36 final html = new StringBuffer();
37 for (String ex in GridExamples.styles.getKeys()) {
38 html.add('<div><a href="?q=$ex">Grid Example $ex</a></div>');
39 }
40 document.body.innerHTML = html.toString();
41 }
42 }
43
44 void addGridStyles(String width, String height, [String margin = '']) {
45 // Use monospace font and fixed line-height so the text size is predictable.
46 // TODO(jmesserly): only tested on Chromium Mac/Linux
47 Dom.addStyle('''
48 body { $margin }
49 #grid {
50 position: absolute;
51 width: $width;
52 height: $height;
53 border-color: black;
54 }
55 .grid-item {
56 border: solid 2px;
57 border-radius: 8px;
58 font-family:monospace;
59 font-size:16px;
60 line-height:20px;
61 }
62 ''');
63 }
64
65 void _addColorStyles() {
66 final grid = document.body.query('#grid');
67 final colors = const [ 'darkred', 'darkorange', 'darkgoldenrod',
68 'darkgreen', 'darkblue', 'darkviolet'];
69 int c = 0;
70 var node = grid.elements[0];
71 while (node != null) {
72 if (node.id != '') {
73 node.style.cssText += "color:" + colors[c++];
74 }
75 node = node.nextElementSibling;
76 }
77 }
78
79 class MockCompositeView extends CompositeView {
80 MockCompositeView(String id, Map styles, List childViews)
81 : super('') {
82 node.id = id;
83 CollectionUtils.copyMap(customStyle, styles);
84
85 for (final v in childViews) {
86 addChild(v);
87 }
88 }
89 }
90
91 class MockView extends View {
92 MockView(String id, Map styles)
93 : super.fromNode(new Element.html(
94 '<div class="grid-item">MockView-$id</div>')) {
95 node.id = id;
96 CollectionUtils.copyMap(customStyle, styles);
97 // TODO(jmesserly): this is needed to get horizontal content-sizing to work
98 node.style.display = 'inline-block';
99 }
100 }
101
102
103 void printMetrics(String example) {
104 final node = document.body.query('#grid');
105 String exampleId = example.split(' ')[0];
106 final sb = new StringBuffer();
107 sb.add("test('Spec Example $exampleId', () {\n");
108 sb.add(" verifyExample('$example', {\n");
109 final rects = new List();
110 final elements = node.elements;
111 for (Element child in elements) {
112 rects.add(child.rect);
113 }
114
115 window.requestLayoutFrame(() {
116 for (int i = 0; i < elements.length; i++) {
117 _appendMetrics(sb, elements[i], rects[i].value, ' ');
118 }
119 sb.add(' });\n');
120 sb.add('});\n\n');
121 window.console.log(sb.toString());
122 });
123 }
124
125 void _appendMetrics(StringBuffer sb, Element node, ElementRect rect,
126 [String indent = '']) {
127 String id = node.id;
128 final offset = rect.offset;
129 num left = offset.left, top = offset.top;
130 num width = offset.width, height = offset.height;
131 sb.add("${indent}'$id': [$left, $top, $width, $height],\n");
132 }
OLDNEW
« no previous file with comments | « client/tests/client/layout/GridExamples.dart ('k') | client/tests/client/layout/grid_layout_demo.dart » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698