-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
323 lines (288 loc) · 17.4 KB
/
index.html
File metadata and controls
323 lines (288 loc) · 17.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
<!DOCTYPE html>
<html>
<head>
<title>Dart Designer</title>
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@dartdesigner">
<meta name="twitter:title" content="Dart Designer">
<meta name="twitter:description" content="Graphical tooling based on Eclipse Sirius for the Dart programming language.">
<meta name="twitter:creator" content="@sbegaudeau">
<meta name="twitter:image:src" content="http://dartdesigner.github.io/images/ModuleDiagram.png">
<meta name="twitter:domain" content="http://dartdesigner.github.io">
<meta property="og:title" content="Dart Designer" />
<meta property="og:type" content="article" />
<meta property="og:url" content="http://dartdesigner.github.io/" />
<meta property="og:image" content="http://dartdesigner.github.io/images/ModuleDiagram.png" />
<meta property="og:description" content="Graphical tooling based on Eclipse Sirius for the Dart programming language." />
<meta property="og:site_name" content="Dart Designer Official Website" />
<meta itemprop="name" content="Dart Designer">
<meta itemprop="description" content="Graphical tooling based on Eclipse Sirius for the Dart programming language.">
<meta itemprop="image" content="http://dartdesigner.github.io/images/ModuleDiagram.png">
<link rel="stylesheet" type="text/css" href="app/bower_components/bootflat/bootstrap/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="app/bower_components/bootflat/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="app/bower_components/bootflat/css/bootflat.css">
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="app/bower_components/bootflat/js/html5shiv.js"></script>
<script type="text/javascript" src="app/bower_components/bootflat/js/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="app/bower_components/bootflat/js/jquery.icheck.js"></script>
<script type="text/javascript" src="app/bower_components/bootflat/js/bootstrap.min.js"></script>
<script type="text/javascript" src="app/bower_components/bootflat/js/respond.min.js"></script>
<link rel="shortcut icon" type="image/png" href="/favicon.png"/>
</head>
<body>
<nav class="navbar" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<a class="navbar-brand" href="">Dart Designer</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="#features">Features</a></li>
<li><a href="#releases">Releases</a></li>
<li><a href="#license">License</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container -->
</nav>
<div class="docs-header">
<div class="container">
<div class="row">
<div class="col-md-12">
<img src="images/DartSirius-Word_1000.png" class="logo">
</div>
</div>
<div class="row">
<div class="col-md-12 logo-description">
Graphical tooling based on Eclipse Sirius for the Dart programming language.
</div>
<div class="col-md-3 col-md-offset-3">
<a href="https://github.com/dartdesigner/Dart-Designer/releases/latest" role="button" class="btn btn-primary btn-block btn-lg">Download</a>
</div>
<div class="col-md-3">
<a href="https://github.com/dartdesigner/Dart-Designer" role="button" class="btn btn-default btn-block btn-lg">Github</a>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1></h1>
</div>
<div class="col-md-12 text-center">
<iframe width="853" height="480" src="//www.youtube.com/embed/CCbhPVMYZ30?rel=0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
<div class="docs-section docs-feature" id="features">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/Dart.png"></div>
<div class="jumbotron-contents">
<h2>Dedicated To Dart</h2>
<p>The Dart Designer comes as a single application dedicated for <a href="https://www.dartlang.org">Dart</a> developers with custom menus, toolbars, help and tutorials.</p>
<h2>Integrating the Dart Editor</h2>
<p><a href="https://www.dartlang.org/tools/editor/">The Dart Editor</a> is directly embedded within the Dart Designer to create a kickass development environment for Dart.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/BuiltOnEclipse.png"></div>
<div class="jumbotron-contents">
<h2>Eclipse RCP</h2>
<p>The Dart Designer is built on top of the Eclipse platform like the official Dart Editor.</p>
<h2>Eclipse Sirius</h2>
<p>Using years of experience in critical software engineering injected into the <a href="https://www.eclipse.org/sirius/">Sirius</a> project.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/PackageDiagram.png"></div>
<div class="jumbotron-contents">
<h2>Package Diagram</h2>
<p>The Package diagram of the Dart Designer will let you have a bird eye view of your project by having a look at the various Dart packages used and their dependencies. From this main viewpoint, you can <strong>navigate to other representations</strong> of your Dart resources by jumping on very quickly to a Class diagram representation of your Dart package.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/ClassDiagram.png"></div>
<div class="jumbotron-contents">
<h2>Class Diagram</h2>
<p>The Class diagram is the main representation of the entities of your Dart application. Tailored to the need of Dart developers, this Class diagram representation let you manipulate <strong>native concepts of the Dart language</strong> like metadata, applications or even libraries. From this representation, you can easily see the various relations between your entities (mixins, implements or extends).</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/ExplorerDiagram.png"></div>
<div class="jumbotron-contents">
<h2>Explorer Diagram</h2>
<p>The Explorer diagram let you navigate in your Dart project as if it was on your file system. You can see your resources and navigate in the folders of your project easily. You will also be able to see the relationships between your resources.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/LibraryDiagram.png"></div>
<div class="jumbotron-contents">
<h2>Library Diagram</h2>
<p>The Library diagram will show the dependencies between the various libraries of your application. You will be able to see your libraries and their contents easily. This representation will show what is imported and exported.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/ModuleDiagram.png"></div>
<div class="jumbotron-contents">
<h2>Module Diagram</h2>
<p>The Module diagram displays your AngularDart modules and their related elements. With this representation, you can see how your components, controllers, decorators and formatters are organized.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/RouteDiagram.png"></div>
<div class="jumbotron-contents">
<h2>Route Diagram</h2>
<p>The Route diagram contains the various routes that have been declared in your AngularDart application. This diagram will let you see quickly how your components are linked to your routes in your application.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/Navigation.png"></div>
<div class="jumbotron-contents">
<h2>Navigation Support</h2>
<p>In order to ease the manipulation of all the representations in your Dart Designer project, you have the ability to quickly create new representations and navigate to existing ones without leaving your diagrams. Just select an element and right click on it to easily move to another representation if possible.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-photo"><img src="images/Layers.png"></div>
<div class="jumbotron-contents">
<h2>Filter Support</h2>
<p>In the Class diagram, you can easily filter the information that you do not want to see. You can filter fields, operations, references or the whole class content. You can combine multiple filters in order to have the diagrams that you want for your documentation.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-contents">
<h2>Unsynchronized Representations</h2>
<p>Most of the representation are not fully synchronized with your data, as a result if you want to create a Class diagram, it does not have to display all the classes available in your Dart package. You can easily <strong>create multiple diagrams on various subsets of your entities.</strong>. If you have two sets of classes in a given folder, used for separate concerns in your application, you can create a Class diagram for each set of classes in the folder.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="jumbotron">
<div class="jumbotron-contents">
<h2>Synchronized Data</h2>
<p>Contrary to the representations, the data of your Dart Designer projects are fully synchronized. Make a change on an entity in one representation (like a Class diagram) and you can <strong>see the impact in real time on all the other representations</strong> using this entity (like another Class or Package diagram). As a result, the state of your data in shared between all the representations, save in one editor and all the others will be saved.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="docs-section docs-releases" id="releases">
<div class="container">
<div class="row">
<h1>Releases</h1>
<ul>
<li><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.1.0">Hyperbolic Void</a></li>
<li><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.2.0">Minimalist Dawn</a></li>
<li><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.3.0">Confidential Cruise</a></li>
<li><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.4.0">Shielded Arrow <span class="label label-info">latest release</span></a></li>
</ul>
<div class="col-md-8">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.1.0">Hyperbolic Void</a></h3>
</div>
<div class="panel-body">
This first release will contain the first basic version of a couple of designers for Dart including the Package diagram, the Explorer diagram and the Class diagram. It will also be used to iron out some of the details of the branding and the release engineering process.
</div>
</div>
</div>
<div class="col-md-8">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.2.0">Minimalist Dawn</a></h3>
</div>
<div class="panel-body">
The main focus of this release will be the improvement of the Class and Explorer diagrams. New elements and relationships will be visible in the Class diagram like fields and methods. The direct edit will also be improved. The design of the Explorer diagram will be greatly improved and new elements will be visible.
</div>
</div>
</div>
<div class="col-md-8">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.3.0">Confidential Cruise</a></h3>
</div>
<div class="panel-body">
The main focus of this release will be the integration of the Dart Editor in Dart Designer. A new kind of representation will also be introduced, in a basic version, in order to have a bird eye view of the libraries. Starting with this release, the Dart Editor will now be embedded directly in Dart Designer. The other representations (Class, Explorer, Package) will also be improved.
</div>
</div>
</div>
<div class="col-md-8">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><a href="https://github.com/dartdesigner/Dart-Designer/releases/tag/v0.4.0">Shielded Arrow - Latest Release</a></h3>
</div>
<div class="panel-body">
Shielded Arrow now introduces the support for AngularDart. Two new representations, Module diagram and Route diagram will now let you define the AngularDart-specific parts of your applications. Tons of new concepts have been added to represents AngularDart application and a new design for all the representations (Class, Explorer, Package, Library, etc) has also been introduced.
</div>
</div>
</div>
</div>
</div>
</div>
<div class="docs-section docs-license" id="license">
<div class="container">
<div class="row">
<h1>License</h1>
<div class="col-md-12">
<p>The Dart Designer is available under the <a href="http://www.eclipse.org/legal/epl-v10.html">Eclipse Public License v1.0</a>. It includes components from the Eclipse Foundation, the Apache Foundation and the Dart project.</p>
</div>
</div>
</div>
</div>
<footer class="docs-footer">
<div class="container">
<div class="social">
<a href="https://twitter.com/dartdesigner" class="twitter-follow-button" data-show-count="false" data-dnt="true">Follow @dartdesigner</a>
</div>
<p>Designed and build with ❤ by <a href="http://www.twitter.com/sbegaudeau">@sbegaudeau</a>.</p>
<p>Code licensed under <a href="http://www.eclipse.org/legal/epl-v10.html">EPL</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a></p>
<p>Copyright 2014 <a href="http://www.twitter.com/obeo_corp">Obeo</a>. All rights reserved.</p>
</div>
</footer>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-50092246-1', 'dartdesigner.github.io');
ga('send', 'pageview');
</script>
</body>
</html>