Skip to content
This repository was archived by the owner on Nov 18, 2024. It is now read-only.

Commit e411036

Browse files
committed
Web components based app to view dart docs. Still has rough edges.
Please review the entire file contents rather than the diff. The previous version is just a checkpoint I accidentally pushed to master to avoid losing work if my local machine died. Review URL: https://chromiumcodereview.appspot.com//11636011
1 parent d3ca731 commit e411036

23 files changed

+645
-605
lines changed

client/web/ast.dart

Lines changed: 243 additions & 212 deletions
Large diffs are not rendered by default.

client/web/doc_link.html

Lines changed: 12 additions & 144 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,16 @@
11
<!DOCTYPE html>
22
<html><body>
3-
<element name="x-doc-link" constructor="DocLink" extends="span">
3+
<element name="x-doc-link" extends="span">
44
<template>
55
<template instantiate="if ref.refId != 'void'">
6-
<a href="{{permalink(ref)}}">{{ref.name}}</a>
6+
<a href="{{permalink(ref)}}">
7+
<template instantiate="if short">
8+
{{ref.name}}
9+
</template>
10+
<template instantiate="if !short">
11+
{{ref.shortDescription}}
12+
</template>
13+
</a>
714
</template>
815
<template instantiate="if ref.refId == 'void'">
916
{{ref.name}}
@@ -15,150 +22,11 @@
1522
import 'model.dart';
1623

1724
class DocLink extends WebComponent {
18-
/// Must be a Reference or Element.
25+
/** Must be a Reference or Element. */
1926
var ref;
27+
/** Whether a short version of the Element name should be used. */
28+
bool short = false;
2029
}
2130
</script>
2231
</element>
23-
24-
<element name="x-member-blocks" constructor="MemberBlocks" extends="div">
25-
<template>
26-
<template iterate='block in blocks'>
27-
<div>
28-
<h3>{{block.kindTitle}}</h3>
29-
<ul>
30-
<template iterate='element in block.elements'>
31-
<li class="{{kindCssClass(element)}}">
32-
<x-element-summary element="{{element}}"></x-element-summary>
33-
</li>
34-
</template>
35-
</ul>
36-
</div>
37-
</template>
38-
</template>
39-
<script type="application/dart">
40-
// TODO(jacobr): this is kinda a rediculous way to do this
41-
import 'package:web_ui/web_ui.dart';
42-
import 'ast.dart';
43-
import 'model.dart';
44-
45-
class MemberBlocks extends WebComponent {
46-
List<ElementBlock> blocks;
47-
}
48-
</script>
49-
</element>
50-
51-
<element name="x-element-signature" constructor="ElementSignature" extends="span">
52-
<template>
53-
<span class="element-class">
54-
<template instantiate="if (element is MethodElementBase || element is TypedefElement) && element.returnType != null">
55-
<x-doc-link ref="{{element.returnType}}"></x-doc-link>
56-
</template>
57-
</span>
58-
<span class="element-definition">
59-
<span class="element-name"><x-doc-link ref="{{element}}"></x-doc-link></span>
60-
<template instantiate="if element is MethodElement || element is ConstructorElement || element is TypedefElement">
61-
<span class="args">(
62-
<template iterate="param in element.parameters">
63-
<span class="arg">
64-
<template instantiate="if param.type != null">
65-
<span class = "arg-type">
66-
<x-doc-link ref="{{param.type}}"></x-doc-link>
67-
</span>
68-
</template>
69-
<span class="arg-name">{{param.name}}</span>
70-
</span>
71-
</template>)
72-
</span>
73-
</template>
74-
</span>
75-
</template>
76-
<script type="application/dart">
77-
import 'package:web_ui/web_ui.dart';
78-
import 'ast.dart';
79-
import 'model.dart';
80-
81-
class ElementSignature extends WebComponent {
82-
Element element;
83-
}
84-
</script>
85-
</element>
86-
87-
<element name="x-element-summary" constructor="ElementSummary" extends="div">
88-
<template>
89-
<!--TODO(jacobr): use id instead of data-id and use a different escaping scheme-->
90-
<details class="element-details {{(element is MethodElementBase) ? 'member-details' : 'type-details'}}" data-id="{{element.id}}" open="{{currentMember != null && element.id == currentMember.id}}">
91-
<summary>
92-
<div class="overflow-shadow"></div>
93-
<template instantiate="if element is! ClassElement">
94-
<x-element-signature element="{{element}}">
95-
</x-element-signature>
96-
</template>
97-
<template instantiate="if element is ClassElement">
98-
<x-doc-link class="element-name element-definition" ref="{{element}}"></x-doc-link>
99-
</template>
100-
<div class="documentation">
101-
{{element.commentHtml}}
102-
</div>
103-
</summary>
104-
<details class="extended-element-info">
105-
<summary>View ?? comments.</summary>
106-
TODO(jacobr): implement.
107-
</details>
108-
</details>
109-
</template>
110-
<script type="application/dart">
111-
// TODO(jacobr): this is kinda a rediculous way to do this
112-
import 'package:web_ui/web_ui.dart';
113-
import 'ast.dart';
114-
import 'model.dart';
115-
116-
class ElementSummary extends WebComponent {
117-
Element element;
118-
}
119-
</script>
120-
</element>
121-
122-
<element name="x-class-hierarchy-subtree" constructor="ClassHierarchySubtree" extends="div">
123-
<template>
124-
<template instantiate="if (index < clazz.superclasses.length)">
125-
<div><x-doc-link ref={{clazz.superclasses[index]}}></x-doc-link></div>
126-
<div style="padding-left: 15px">
127-
<x-class-hierarchy-subtree clazz="{{clazz}}" index="{{index+1}}">
128-
</x-class-hierarchy-subtree>
129-
</div>
130-
</template>
131-
<template instantiate="if index == clazz.superclasses.length">
132-
<div><strong>{{clazz.name}}</strong></div>
133-
</template>
134-
</template>
135-
<script type="application/dart">
136-
// TODO(jacobr): this is kinda a rediculous way to do this
137-
import 'package:web_ui/web_ui.dart';
138-
import 'ast.dart';
139-
import 'model.dart';
140-
141-
class ClassHierarchySubtree extends WebComponent {
142-
ClassElement clazz;
143-
int index;
144-
}
145-
</script>
146-
</element>
147-
148-
<element name="x-class-hierarchy" constructor="ClassHierarchy" extends="div">
149-
<template>
150-
<x-class-hierarchy-subtree clazz="{{clazz}}" index="{{0}}">
151-
</x-class-hierarchy-subtree>
152-
</template>
153-
<script type="application/dart">
154-
import 'package:web_ui/web_ui.dart';
155-
import 'ast.dart';
156-
import 'model.dart';
157-
158-
class ClassHierarchy extends WebComponent {
159-
ClassElement clazz;
160-
}
161-
</script>
162-
</element>
163-
<!-- more below... -->
16432
</body></html>

client/web/element_summary.html

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<link rel="components" href="doc_link.html">
5+
</head>
6+
7+
<body>
8+
<element name="x-member-blocks" extends="div">
9+
<template>
10+
<template iterate='block in blocks'>
11+
<div>
12+
<h3>{{block.kindTitle}}</h3>
13+
<template iterate='element in block.elements'>
14+
<x-element-summary element="{{element}}"></x-element-summary>
15+
</template>
16+
</div>
17+
</template>
18+
</template>
19+
<script type="application/dart">
20+
import 'package:web_ui/web_ui.dart';
21+
import 'ast.dart';
22+
import 'model.dart';
23+
24+
class MemberBlocks extends WebComponent {
25+
List<ElementBlock> blocks;
26+
}
27+
</script>
28+
</element>
29+
30+
<element name="x-element-signature" extends="span">
31+
<template>
32+
<span class="element-class">
33+
<template instantiate="if hasReturnType">
34+
<x-doc-link ref="{{element.returnType}}"></x-doc-link>
35+
</template>
36+
</span>
37+
<span class="element-definition">
38+
<span class="element-name">
39+
<x-doc-link ref="{{element}}" short="{{true}}"></x-doc-link>
40+
</span>
41+
<template instantiate="if hasArguments">
42+
<span class="args">(
43+
<template iterate="param in element.parameters">
44+
<span class="arg">
45+
<template instantiate="if param.type != null">
46+
<span class="arg-type">
47+
<x-doc-link ref="{{param.type}}"></x-doc-link>
48+
</span>
49+
</template>
50+
<span class="arg-name">{{param.name}}</span>
51+
</span>
52+
</template>)
53+
</span>
54+
</template>
55+
</span>
56+
</template>
57+
<script type="application/dart">
58+
import 'package:web_ui/web_ui.dart';
59+
import 'ast.dart';
60+
import 'model.dart';
61+
62+
class ElementSignature extends WebComponent {
63+
Element element;
64+
65+
bool get hasReturnType =>
66+
(element is MethodLikeElement || element is TypedefElement)
67+
&& element.returnType != null;
68+
69+
bool get hasArguments =>
70+
element is MethodElement || element is ConstructorElement
71+
|| element is TypedefElement;
72+
}
73+
</script>
74+
</element>
75+
76+
<element name="x-element-summary" extends="div">
77+
<template>
78+
<!--TODO(jacobr): use id instead of data-id and use a different escaping scheme-->
79+
<details class="element-details {{kindClass}} {{memberOrTypeClass}}"
80+
data-id="{{element.id}}"
81+
open="{{isOpen}}">
82+
<summary>
83+
<div class="overflow-shadow"></div>
84+
<template instantiate="if element is! ClassElement">
85+
<x-element-signature element="{{element}}">
86+
</x-element-signature>
87+
</template>
88+
<template instantiate="if element is ClassElement">
89+
<x-doc-link class="element-name element-definition"
90+
ref="{{element}}">
91+
</x-doc-link>
92+
</template>
93+
<div class="documentation">{{element.commentHtml}}</div>
94+
</summary>
95+
<details class="extended-element-info">
96+
<summary>View ?? comments.</summary>
97+
TODO(jacobr): implement.
98+
</details>
99+
</details>
100+
</template>
101+
<script type="application/dart">
102+
// TODO(jacobr): this is kinda a rediculous way to do this
103+
import 'package:web_ui/web_ui.dart';
104+
import 'ast.dart';
105+
import 'model.dart';
106+
107+
class ElementSummary extends WebComponent {
108+
Element element;
109+
110+
String get kindClass => kindCssClass(element);
111+
String get memberOrTypeClass =>
112+
(element is MethodLikeElement) ? 'member-details' : 'type-details';
113+
114+
bool get isOpen =>
115+
currentMember != null && element.id == currentMember.id;
116+
}
117+
</script>
118+
</element>
119+
120+
<element name="x-class-hierarchy-subtree" extends="div">
121+
<template>
122+
<template instantiate="if (index < clazz.superclasses.length)">
123+
<div><x-doc-link ref={{clazz.superclasses[index]}}></x-doc-link></div>
124+
<!-- TODO(jacobr): why doesn't it work to just put this class on the
125+
x-class-hierarchy-subtree node? -->
126+
<div class="child-subtree">
127+
<x-class-hierarchy-subtree clazz="{{clazz}}" index="{{index+1}}">
128+
</x-class-hierarchy-subtree>
129+
</div>
130+
</template>
131+
<template instantiate="if index == clazz.superclasses.length">
132+
<div><strong>{{clazz.shortDescription}}</strong></div>
133+
</template>
134+
</template>
135+
<script type="application/dart">
136+
// TODO(jacobr): this is kinda a rediculous way to do this
137+
import 'package:web_ui/web_ui.dart';
138+
import 'ast.dart';
139+
import 'model.dart';
140+
141+
class ClassHierarchySubtree extends WebComponent {
142+
ClassElement clazz;
143+
int index;
144+
}
145+
</script>
146+
</element>
147+
148+
<element name="x-class-hierarchy" extends="div">
149+
<template>
150+
<x-class-hierarchy-subtree clazz="{{clazz}}" index="{{0}}">
151+
</x-class-hierarchy-subtree>
152+
</template>
153+
<script type="application/dart">
154+
import 'package:web_ui/web_ui.dart';
155+
import 'ast.dart';
156+
import 'model.dart';
157+
158+
class ClassHierarchy extends WebComponent {
159+
ClassElement clazz;
160+
}
161+
</script>
162+
</element>
163+
</body></html>

0 commit comments

Comments
 (0)