Wiki source code of Running KEITH

Version 21.1 by Soeren Domroes on 2019/05/16 10:36
Show last authors
1 = Running KEITH =
2
3
4
5 {{toc maxLevel="2"/}}
6
7 == Setting up your eclipse ==
8
9 For everything not mentioned here refer to [[Getting Eclipse>>doc:KIELER.Getting Eclipse||shape="rect"]] guide.
10
11 Use the installer go to advanced mode, add the KIELER url. Then select first pragmatics and after that semantics (**that is very** **important**).
12
13 Select the Theia stream for semantics and the Keith stream for pragmatics and use the latest eclipse if possible. Set the targetplatform to photon (or latest?) and finish.
14
15 Wait till everything installs and the setup tasks finish. If you have any problems in this stage refer to the [[Getting Eclipse>>doc:KIELER.Getting Eclipse||shape="rect"]] guide.
16
17 \\
18
19 The setup tasks for Modular Target will fail. Disable it after this happens and execute them again via //Help>Perform Setup Tasks//. Open the //plug-in development// perspective. Select working sets as top level elements. Run //clean build//. Several pragmatics projects have errors. Just close them and you will be fine.
20
21 To run the language server go to //Run Configurations// create a new //eclipse application// run configuration and select //Run an application//  and //de.cau.cs.kieler.language.server.LanguageServer//
22
23 == [[image:attach:Screenshot from 2019-02-15 14-10-50.png]] ==
24
25 \\
26
27 You have to edit the arguments too. The Vm arguments host and port are added to connect the LS via socket.
28
29 [[image:attach:Screenshot from 2019-02-15 14-13-34.png]]
30
31 The default port to which KEITH tries to connect is 5007.
32
33 == Setting up a KEITH developer setup... ==
34
35 General requirements:
36
37 * node
38 * npm (whatever node installs)
39 * yarn (latest version)
40 * Python (2.7.X)
41 * gcc, g++, and make (for native dependencies of some npm packages)
42 * [[Visual Studio Code>>url:https://code.visualstudio.com/||shape="rect"]] (latest version)
43 * a cloned [[keith >>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/keith/browse||shape="rect"]]repository
44
45 == ... on linux: ==
46
47 (Theia has a [[guide >>url:https://www.theia-ide.org/doc/authoring_extensions||shape="rect"]]for extension development that might be helpful)
48
49 install node 8:
50
51 {{code}}
52 curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.5/install.sh | bash
53 nvm install 8
54 {{/code}}
55
56 Install python if you haven't (remember: Python 2: , Python 3: ).
57
58 {{code language="none"}}
59 Install yarn (a package manager build on the package manager npm):
60 {{/code}}
61
62 {{{}}}
63
64 \\
65
66 {{code}}
67 npm install -g yarn
68 {{/code}}
69
70 \\
71
72 == ... on windows: ==
73
74 Install [[node 8>>url:https://nodejs.org/download/release/v8.15.0/||shape="rect"]] for windows. I personally used the {{code language="none"}}.msi{{/code}}.
75
76 Use that to install windows-build-tools by executing the command in an administrative powershell.
77
78 {{code}}
79 npm install -g windows-build-tools
80 {{/code}}
81
82 This installs make, gcc, g++, python and all this. Somehow this does not really terminate. If nothing happens anymore it may be finished, just kill the process if it does not terminate.
83
84 All the installed executables are not in the path and that is okay. This is not needed since yarn/npm knows how to call them when needed.
85
86 Yarn can be downloaded and installed from [[here>>url:https://yarnpkg.com/lang/en/docs/install/#windows-stable||shape="rect"]].
87
88 === Known Problems in this step ===
89
90 If python3 was already installed this may cause some problems.
91
92 == ... on mac: ==
93
94 Get a package manager, something like [[brew>>url:https://brew.sh/index_de||shape="rect"]].
95
96 Use brew to install all necessary stuff.
97
98 Apparently there is an issue with xcode-select: [[Theia developers>>url:https://github.com/theia-ide/theia/blob/master/doc/Developing.md||shape="rect"]] recommend the following:
99
100 {{code}}
101 xcode-select --install
102 {{/code}}
103
104 After doing this for your OS all that is missing is running KEITH (in developer setup) and setting up your eclipse for language server development).
105
106 = Stuff that may help =
107
108 == Running the already build LS ==
109
110 Go to the latest [[Bamboo build>>url:https://rtsys.informatik.uni-kiel.de/bamboo/browse/KISEMA-NSI||shape="rect"]] and go to Artifacts.
111
112 [[image:attach:image2019-2-7_17-46-58.png]]
113
114 Select Language Server Zip and download the LS and unpack it somewhere.
115
116 Locate the kieler.ini file. Depending on the OS it has a different location (linux; toplevel, windows, toplevel, mac: Content/Eclipse/kieler.ini)
117
118 Paste the following at the beginning of the ini-file:
119
120 {{code language="bash"}}
121 -application
122 de.cau.cs.kieler.language.server.LanguageServer
123 -noSplash
124 {{/code}}
125
126 Since an eclipse application is built, this is needed to start the LS without a splashscreen.
127
128 If you want to connect that LS via socket to your Theia application (KEITH) add the following to the vmargs:
129
130 {{code}}
131 -Dport=5007
132 {{/code}}
133
134 5007 is the standard port KEITH is currently connecting to in socket mode. You can find this port in your Theia application at the following location:
135
136 Assume you are in the [[keith >>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/keith/browse||shape="rect"]]repository. Go to {{code language="none"}}keith-app{{/code}}, you should see something like this:
137
138 [[image:attach:image2019-2-7_17-58-22.png]]
139
140 Open the {{code language="none"}}package.json{{/code}}. In the{{code language="none"}} package.json{{/code}} are several scripts defined.
141
142 [[image:attach:image2019-2-7_18-0-7.png]]
143
144 The {{code language="none"}}LSP_PORT{{/code}} option is used to activate the connection via socket. It is also possible to specify a relative location to a LS via {{code language="none"}}LS_PATH=<path to LS>{{/code}}.
145
146 \\
147
148 == How run KEITH in developer setup (socket) ==
149
150 Run the following to build and run KEITH in its developer setup (in socket mode, so the LS has to be started separately)
151
152 {{code language="bash"}}
153 yarn && cd keith-app && yarn run socket
154 {{/code}}
155
156 //yarn// builds all the stuff. //yarn run socket// in keith-app starts the application. After an initial build via yarn you can run //yarn watch // to watch the changes in your repository. In another console you run yarn run socket in keith-app. Now refreshing your browser is enough to apply the changes.
157
158 Per default the KEITH opens on localhost:3000.
159
160 It is required to restart the language server if KEITH is restarted, since the diagram view has a problem (since theia-sprotty is used) to reconnect after that.
161
162 === Known issues for windows: ===
163
164 nsfw.code not found: In the top level package.json exists a script called postinstall. Remove this on windows, delete the node_modules folder and rebuilt the application. This is a known issue of electron-builder.
165
166 === Known issues on mac: ===
167
168 Since SWT is still used as part of the diagram synthesis (but is not relevant anymore). Since it is not called on the main thread this causes a deadlock. Therefore mac just does not work.
169
170 === Known issues: ===
171
172 Refreshing the browser is not enough for the diagram to work. If the diagram is needed the language server has to be restarted before the browser is refreshed. This is a known issue in theia-sprotty.
173
174 = Developing for KEITH =
175
176 We use java ServiceLoader to register stuff. Here is a small example how a LanguageServerExtension is registered via a ServiceLoader and how it is used:
177
178 == Register LanguageServerExtensions (ServiceLoader Example) ==
179
180 This is a LanguageServerExtension. It has to be used in the de.cau.cs.kieler.language.server plugin. Since the language-server-plugin should not have dependencies to all plugins that define a language server extension dependency inversion is used to prevent that. A ServiceLoader does exactly that.
181
182 Here is such an example extension, the KiCoolLanguageServerExtension:
183
184 {{code}}
185 package de.cau.cs.kieler.kicool.ide.language.server
186
187
188 /**
189 * @author really fancy name
190 *
191 */
192 @Singleton
193 class KiCoolLanguageServerExtension implements ILanguageServerExtension, CommandExtension, ILanguageClientProvider {
194 // fancy extension stuff
195
196 var KeithLanguageClient client
197 // A language server extension must implement the initialize method,
198 // it is however only called if the extension is registered via a language.
199 // This should never be the case, so this is never called.
200 override initialize(ILanguageServerAccess access) {
201 this.languageServerAccess = access
202 }
203
204 // implement ILanguageClientProvider
205 override setLanguageClient(LanguageClient client) {
206 this.client = client as KeithLanguageClient
207 }
208
209 // implement ILanguageClientProvider
210 override getLanguageClient() {
211 return this.client
212 }
213
214 }
215 {{/code}}
216
217 The CommandExtension defines all commands (requests or notifications) that are send from client to server. An example how this looks like can be seen in the code snippet Example CommandExtension is an example how to [[define a server side extension interface.>>doc:||anchor="Registeranextension(onserverside)"]]
218
219 The ILanguageClientProvider should be implemented by an extension that plans to send [[messages from the server to the client>>doc:||anchor="ServerClientcommunicationinterface"]].
220
221 This language server extension is provided by a corresponding contribution, which is later used to access it:
222
223 {{code}}
224 package de.cau.cs.kieler.kicool.ide.language.server
225
226 import com.google.inject.Injector
227 import de.cau.cs.kieler.language.server.ILanguageServerContribution
228
229 /**
230 * @author really fancy name
231 *
232 */
233 class KiCoolLanguageServerContribution implements ILanguageServerContribution {
234
235 override getLanguageServerExtension(Injector injector) {
236 return injector.getInstance(KiCoolLanguageServerExtension)
237 }
238 }
239 {{/code}}
240
241 Create a file called de.cau.cs.kieler.language.server.ILanguageServerContribution in <plugin>/META-INF/services/ (in this example this is de.cau.cs.kieler.kicool.ide). The name of the file refers to the contribution interface that should be used to provide the contribution. The content of the file is the following:
242
243 {{code}}
244 de.cau.cs.kieler.kicool.ide.language.server.KiCoolLanguageServerContribution
245 {{/code}}
246
247 This is the fully qualified name of the contribution written earlier.
248
249 The language server uses all LanguageServerExtensions like this:
250
251 {{code}}
252 var iLanguageServerExtensions = <Object>newArrayList(languageServer) // list of all language server extensions
253 for (lse : KielerServiceLoader.load(ILanguageServerContribution)) { // load all contributions
254 iLanguageServerExtensions.add(lse.getLanguageServerExtension(injector))
255 }
256 {{/code}}
257
258 The resulting list of implementions is used to add the extensions to the language server.
259
260 == Register an extension (on server side) ==
261
262 See example above for ServiceLoader and initial stuff.
263
264 What is still missing are the contents of the CommandExtension implemented by the KiCoolLanguageServerExtension. This is an interface defining all additional commands. The CommandExtension looks like this.
265
266 {{code title="Example CommandExtension"}}
267 package de.cau.cs.kieler.kicool.ide.language.server
268
269 import java.util.concurrent.CompletableFuture
270 import org.eclipse.lsp4j.jsonrpc.services.JsonRequest
271 import org.eclipse.lsp4j.jsonrpc.services.JsonSegment
272
273 /**
274 * Interface to the LSP extension commands
275 *
276 * @author really fancy name
277 *
278 */
279 @JsonSegment('keith/kicool')
280 interface CommandExtension {
281
282 /**
283 * Compiles file given by uri with compilationsystem given by command.
284 */
285 @JsonRequest('compile')
286 def CompletableFuture<CompilationResults> compile(String uri, String clientId, String command, boolean inplace);
287
288 /**
289 * Build diagram for snapshot with id index for file given by uri. Only works, if the file was already compiled.
290 */
291 @JsonRequest('show')
292 def CompletableFuture<String> show(String uri, String clientId, int index)
293
294 /**
295 * Returns all compilation systems which are applicable for the file at given uri.
296 *
297 * @param uri URI as string to get compilation systems for
298 * @param filter boolean indicating whether compilation systems should be filtered
299 */
300 @JsonRequest('get-systems')
301 def CompletableFuture<Object> getSystems(String uri, boolean filterSystems)
302 }
303 {{/code}}
304
305 This defines three json-rpc commands: "keith/kicool/compile", "keith/kicool/show", "keith/kicool/get-systems". These are implemented in KiCoolLanguageServerExtension.
306
307 \\
308
309 == Server Client communication interface ==
310
311 Not only messages from client to server but rather mesages from server client might be needed
312
313 == Register and calling an extension (on client side) ==
314
315 Language server extension do not have to be registered on the client side. It is just called.
316
317 You can send a request or a notification to the language server like this:
318
319 {{code}}
320 const lclient = await this.client.languageClient
321 const snapshotsDescriptions: CodeContainer = await lclient.sendRequest("keith/kicool/compile", [uri, KeithDiagramManager.DIAGRAM_TYPE + '_sprotty', command,
322 this.compilerWidget.compileInplace]) as CodeContainer
323 // or via a thenable
324 client.languageClient.then(lClient => {
325 lClient.sendRequest("keith/kicool/compile").then((snapshotsDescriptions: CodeContainer) => {
326 // very important stuff
327 }
328 // await is preferred, since it is shorter.
329 {{/code}}
330
331 In this example client is an instance of a language client. It is usually injected like this:
332
333 {{code}}
334 constructor(
335 @inject(KeithLanguageClientContribution) public readonly client: KeithLanguageClientContribution
336 // other injected classes
337 ) {
338 // constructor stuff
339 }
340 {{/code}}
341
342 \\
343
344 == How to make a new package for KEITH ==
345
346 Clone the [[KEITH repository>>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/keith/browse||shape="rect"]].
347
348 Open the keith folder in VSCode. You are know in the keith directory in VSCode.
349
350 You see something like this: TODO picture
351
352 Create a new folder called keith-<your extension name>.
353
354 Copy a package.json, a tslint.json, a tsconfig.json, and a src folder into the folder.
355
356 Add keith-<your extension name> to workspaces in the top level package.json.
357
358 Add "keith-<your extension name>(% style="color: rgb(0,0,0);" %)": (%%)"0.1.0"(% style="color: rgb(0,0,0);" %) to the dependencies in the top level package.json and the product package.json files (e.g. the package.json in keith-app).
359
360 === What is in the src directory? ===
361
362 The source directory has three optional subfolders.
363
364 * node: Holds all backend related classes. This does currently only exist in the [[keith-language package>>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/keith/browse/keith-language||shape="rect"]].
365 * common: Holds general helper methods, string constants and some data classes
366 * browser: Holds all widgets, contribution for commands, menus, and widgets, and the frontend-extension.
367
368 ==== The frontend-extension ====
369
370 This binds all necessary classes. Look at existing frontend extension in [[KEITH>>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/keith/browse||shape="rect"]] or [[Theia>>url:https://github.com/theia-ide/theia/tree/master/packages||shape="rect"]] to see how this is done.
371
372 ==== More examples for stuff ====
373
374 See [[Theia examples>>url:https://www.theia-ide.org/doc/Commands_Keybindings.html||shape="rect"]].
375
376 == How to write a widget ==
377
378 There are different kinds of widgets that are commonly used in [[KEITH>>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/keith/browse||shape="rect"]] or in existing [[Theia packages>>url:https://github.com/theia-ide/theia/tree/master/packages||shape="rect"]].
379
380 * BaseWidget: Very basic
381 * ReactWidget: A render method has to be implemented that redraws the widget on demand. Additionally several on* event methods can beimplemented.
382 * TreeWidget: Extends the ReactWidget and draws the contents of the widget in a tree view.
383
384 If a widget has a state it should implement the StatefulWidget interface, which allows to imlement a store and restore method.
385
386 Look at examples in KEITH or Theia to see how this is done.
387
388 == How to make a new module for sprotty (see actionModule, ...) ==
389
390 WIP
391
392 \\

Navigation

Quick Links

KIELER on GitHub
RTSYS Homepage