ruby_uml_class 0.6.0 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 8952fd045ae8e4fb567037f549808810d7b584e227636315774c5b70f291d737
4
- data.tar.gz: 22fcb7d5c79a0a121bbeeb0fcd90a8d3486cf5b6d88e1aeab6e8ba2d16d07a78
3
+ metadata.gz: 4a502c7d0f36ebc35ed1f6be546eafc840cb1cfb2b38444d57e3eb4a4bb2fa2a
4
+ data.tar.gz: aa223cc87182d91906176b590cbcfea3c9cf2f720297ac1a84491a01a485a3a0
5
5
  SHA512:
6
- metadata.gz: 2ea9bed328dba69c48a260dfabb2f8ebee2adbf5f566973e89383add10abbee264162f9e09e9a4d20896f6bf9094d69b3edcfc703abccd800ec2c7fa41898048
7
- data.tar.gz: 688e1e6d26f637f1c3c3e649fb442686761608ea313151bc84861d997831fe0e492dd11f10a610650d6dcc9bd6f726c9d3fb9cc358e293c7748ed4199dbc803c
6
+ metadata.gz: af4dbdf5c4bb7c71f21a46f7a5f147a113dc61108253d0ff8b0aa7374a81ec84468d22938b090409c2c9a8eaa5cb9b0646ff95a443c1d6630557c0cf5c845c82
7
+ data.tar.gz: ef9bc9f8f05337ff3b32dfbe40e4f2626a307d9c136c1ad380e15d2581329cabb8201b999eb3d0967c28cccb741ad6595dc592934d3ad09b313400cce20520ed
data/README.md CHANGED
@@ -2,39 +2,73 @@
2
2
 
3
3
  RubyUmlClass creates a Ruby class diagram.
4
4
  PlantUML and rufo commands are used to create class diagrams.
5
- The created class diagram is displayed on the browser screen.
5
+ The generated class diagram is displayed on the browser screen.
6
6
 
7
7
  ## Setup
8
- for ubuntu
9
- $ sudo apt install plantuml
10
8
 
11
- for windoes
12
- install java and PlanUML
13
- Set java and plantuml.jar in [PlantUML Command]
14
- PlantUML of vscode extension function is also possible
15
-
16
- Set [RubyUmlClass=>Setting=>PlantUML Command] as follows
17
- "java -jar C:/Users/%USERNAME%/.vscode/extensions/jebbs.plantuml-2.17.5/plantuml.jar -svg --charset UTF-8"
9
+ for Ubuntu
10
+ ```sh
11
+ $ sudo apt install plantuml
12
+ ```
13
+
14
+ for Windows
15
+ Install Java and PlantUML.
16
+ Set java and plantuml.jar in [PlantUML Command].
17
+ You can also use the PlantUML extension function of VSCode.
18
+
19
+ Set [RubyUmlClass => Setting => PlantUML Command] as follows:
20
+ ```
21
+ java -jar C:/Users/%USERNAME%/.vscode/extensions/jebbs.plantuml-2.17.5/plantuml.jar -svg --charset UTF-8
22
+ ```
18
23
 
19
24
  ## Installation
20
25
 
21
26
  Install the gem and add to the application's Gemfile by executing:
22
27
 
23
- $ bundle add ruby_uml_class
28
+ ```sh
29
+ $ bundle add ruby_uml_class
30
+ ```
24
31
 
25
32
  If bundler is not being used to manage dependencies, install the gem by executing:
26
33
 
27
- $ gem install ruby_uml_class
34
+ ```sh
35
+ $ gem install ruby_uml_class
36
+ ```
28
37
 
29
38
  ## Usage
30
39
 
31
- $ start_ruby_uml_class.rb
40
+ ```sh
41
+ $ start_ruby_uml_class.rb
42
+ ```
43
+
44
+ ![RubyUmlClass](img/RubyUmlClass.gif)
45
+
46
+ ---
47
+
48
+ ## Main Changes from v0.6.0 to v0.6.1
49
+
50
+ - **Major UI/Design Update**
51
+ - Modernized color scheme, layout, buttons, and menu design
52
+ - Improved settings dialog and log display
53
+ - **Improvements to Settings/File Selection Dialogs**
54
+ - Automatic dialog size adjustment, support for textarea settings (such as JSON input)
55
+ - Enhanced input assistance and validation
56
+ - **Functional Improvements**
57
+ - Enhanced parent directory (../) selection when choosing files
58
+ - Simplified editor launch process
59
+ - **Changes to Server Port and Browser Launch Command**
60
+ - Support for multiple browsers (Edge/Chrome on Windows, Chromium on Linux, etc.)
61
+ - Changed default WebSocket port
62
+ - **Version Up**
63
+ - Bumped version from 0.6.0 to 0.6.1
32
64
 
33
- https://user-images.githubusercontent.com/88954426/211500980-3bb839a9-8cf5-44da-b8f9-733a87f22c96.mp4
65
+ ---
34
66
 
35
67
  ## Development
36
68
 
37
- To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and the created tag, and push the `.gem` file to [rubygems.org](https://rubygems.org).
69
+ To install this gem onto your local machine, run `bundle exec rake install`.
70
+ To release a new version, update the version number in `version.rb`, and then run
71
+ `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
38
72
 
39
73
  ## Contributing
40
74
 
Binary file
data/img/RubyUmlClass.mp4 CHANGED
Binary file
@@ -1,4 +1,6 @@
1
1
  {
2
- "chrome_win": "start chrome",
3
- "chrome_linux": "google-chrome"
4
- }
2
+ "chrome_win": "start msedge",
3
+ "chrome_win_": "start chrome",
4
+ "chrome_linux_": "google-chrome",
5
+ "chrome_linux": "chromium-browser"
6
+ }
data/lib/config.ru CHANGED
@@ -102,6 +102,6 @@ configure do
102
102
 
103
103
  end
104
104
 
105
- #\ --port 35983
105
+ #\ --port 40589
106
106
 
107
107
  run Sinatra::Application
data/lib/css/index.css CHANGED
@@ -1,178 +1,485 @@
1
- body {
2
- color: #000000;
3
- background-color: #cac3ec4f;
4
- overflow: hidden;
5
- font-size: 12px;
1
+ :root {
2
+ --main-bg: #f6fbff;
3
+ --main-color: #424242;
4
+ --btn-shadow: 0 2px 8px rgba(60, 60, 60, 0.11);
5
+ --btn-gradient: linear-gradient(90deg, #eaf6f9 0%, #61afe7 100%);
6
+ --btn-gradient-accent: linear-gradient(90deg, #eaf6f9 0%, #61afe7 100%);
7
+ --btn-gradient-danger: linear-gradient(90deg, #eaf6f9 0%, #f1f1c7 100%);
6
8
  }
7
9
 
8
- hr {
9
- color: #ffffff;
10
- background-color: #000000;
11
- height: 1px;
12
- /* 線の太さ */
13
- border: 1px;
14
- /* 枠の太さ */
15
- border-style: solid;
16
- /* 枠の種類 */
10
+ body {
11
+ font-family: 'Roboto', Arial, sans-serif;
12
+ background: linear-gradient(135deg, #e3f0fc 0%, #b6d6f6 100%);
13
+ min-height: 100vh;
14
+ margin: 0;
15
+ padding: 0;
16
+ color: #234067;
17
+ font-size: 13px;
17
18
  }
18
19
 
19
- .error {
20
- color: red;
20
+ .main-title-row {
21
+ display: flex;
22
+ align-items: center;
23
+ justify-content: space-between;
24
+ margin-bottom: 6px;
25
+ gap: 18px;
21
26
  }
22
27
 
23
- .outarea {
24
- background-color: #FFFFFF;
25
- margin: 5px;
26
- padding: 5px;
27
- width: 95vw;
28
- height: 50vh;
29
- overflow: auto;
28
+ .main-title {
29
+ color: #234067;
30
+ font-size: 1.2rem;
31
+ letter-spacing: 0.01em;
32
+ margin: 0;
33
+ flex-shrink: 0;
34
+ margin-left: 10px;
30
35
  }
31
36
 
32
- .inarea {
33
- border: thin solid #000000;
34
- margin: 5px;
35
- padding: 5px;
36
- width: 98%;
37
+ .main-title-actions {
38
+ display: flex;
39
+ gap: 10px;
37
40
  }
38
41
 
39
- input.long {
40
- width: 98%;
41
- background-color: #FAFAFA;
42
- margin: 5px;
43
- padding: 5px;
42
+ .main-title-actions .btn {
43
+ font-size: 13px;
44
+ padding: 7px 16px;
45
+ text-decoration: none;
46
+ cursor: pointer;
44
47
  }
45
48
 
46
- textarea.long {
47
- width: 95vw;
48
- height: 50vh;
49
+ .main-title-actions .menu-title {
50
+ position: relative;
51
+ user-select: none;
49
52
  }
50
53
 
51
- .ui-widget {
52
- font-size: 12px;
54
+ .main-title-actions .menuSub {
55
+ display: none;
56
+ position: absolute;
57
+ top: 100%;
58
+ right: 0;
59
+ left: auto;
60
+ background: #f6fbff;
61
+ box-shadow: 0 1px 5px #b6d6f6;
62
+ border-radius: 0 0 5px 5px;
63
+ min-width: 120px;
64
+ z-index: 100;
65
+ padding: 0;
66
+ margin: 0;
53
67
  }
54
68
 
55
- .ui-autocomplete {
56
- max-height: 45vh;
57
- max-width: 90wh;
58
- overflow-y: auto;
59
- overflow-x: auto;
60
- padding-right: 10px;
69
+ .main-title-actions .menu-title:hover .menuSub,
70
+ .main-title-actions .menu-title:focus-within .menuSub {
71
+ display: block;
61
72
  }
62
73
 
63
- #jquery-ui-autocomplete label {
64
- float: left;
65
- margin-right: 0.5em;
66
- color: black;
74
+ .main-title-actions .menuSub li a {
75
+ color: #3b5c7e;
76
+ padding: 7px 15px;
77
+ display: block;
78
+ border-bottom: 1px solid #e3f0fc;
79
+ transition: color 0.2s, background 0.2s;
80
+ text-decoration: none;
81
+ font-size: 13px;
67
82
  }
68
83
 
69
- .ui-autocomplete.ui-front {
70
- max-height: 250px;
71
- overflow-y: auto;
72
- /* prevent horizontal scrollbar */
73
- overflow-x: hidden;
74
- /* add padding to account for vertical scrollbar */
75
- z-index: 1000 !important;
84
+ .main-title-actions .menuSub li:last-child a {
85
+ border-bottom: none;
76
86
  }
77
87
 
78
- .ui-dialog {
79
- position: absolute;
80
- top: 0;
81
- left: 0;
82
- padding: .2em;
83
- outline: 0;
88
+ .main-title-actions .menuSub li a:hover {
89
+ background: #d2e8f7;
90
+ color: #234067;
84
91
  }
85
92
 
86
- .long {
87
- width: 90%;
93
+ hr {
94
+ border: none;
95
+ border-top: 1px solid #b6d6f6;
96
+ margin: 6px 0 14px 0;
97
+ width: 60%;
88
98
  }
89
99
 
90
- #setting_dialog {
91
- color: #ffffff;
92
- background-color: #000000;
100
+ .btn.primary {
101
+ background: var(--btn-gradient);
102
+ border-bottom: 3px solid #333;
93
103
  }
94
104
 
95
- .setting_name {
96
- width: 200px;
97
- color: #ffffff;
98
- background-color: #000000;
105
+ .btn.primary:hover {
106
+ background: #212121;
107
+ color: #fff;
99
108
  }
100
109
 
101
- .setting_value {
102
- width: 300px;
103
- color: #ffffff;
104
- background-color: #000000;
110
+ .btn.danger {
111
+ background: var(--btn-gradient-danger);
112
+ border-bottom: 3px solid #c62828;
105
113
  }
106
114
 
107
- .setting_checkbox {
108
- color: #ffffff;
109
- background-color: #000000;
115
+ .btn.danger:hover {
116
+ background: #b71c1c;
117
+ color: #fff;
110
118
  }
111
119
 
112
- ul.log {
113
- list-style-type: none;
114
- font-size: 12px;
115
- color: #000000;
120
+ .app-header {
121
+ display: flex;
122
+ align-items: center;
123
+ background: #b3d6f6;
124
+ padding: 10px 20px;
125
+ box-shadow: 0 1px 8px #afd6f9aa;
126
+ border-bottom: 1px solid #a3c9e6;
116
127
  }
117
128
 
118
- input[type="search"] {
119
- -webkit-appearance: searchfield;
129
+ .app-header .material-icons {
130
+ font-size: 1.6rem;
131
+ color: #539ad9;
132
+ margin-right: 10px;
120
133
  }
121
134
 
122
- input[type="search"]::-webkit-search-cancel-button {
123
- -webkit-appearance: searchfield-cancel-button;
135
+ .app-title {
136
+ font-size: 1.2rem;
137
+ font-weight: 700;
138
+ letter-spacing: 1px;
139
+ color: #234067;
124
140
  }
125
141
 
126
- /* menu */
142
+ /* Modern Menu Styling */
127
143
  .menu {
128
144
  display: flex;
129
- justify-content: flex-start;
130
- list-style-type: none;
131
- color: #393737;
145
+ list-style: none;
132
146
  padding: 0;
133
- font-size: 12px;
134
- font-weight: bold;
147
+ margin: 18px 0 0 18px;
148
+ gap: 10px;
149
+ font-size: 13px;
135
150
  }
136
151
 
137
- .menu li {
152
+ .menu>li {
138
153
  position: relative;
139
- width: 100px;
140
- margin-left: 1px;
141
- padding: 5px;
142
- background: #d8dada;
143
- list-style-type: none;
154
+ background: #e5f2fb;
155
+ border-radius: 5px;
156
+ overflow: visible;
157
+ transition: box-shadow 0.2s;
144
158
  }
145
159
 
146
- .menu li a {
147
- color: rgb(20, 114, 192);
160
+ .menu>li:hover,
161
+ .menu>li:focus-within {
162
+ box-shadow: 0 2px 8px #539ad955;
163
+ background: #d2e8f7;
148
164
  }
149
165
 
150
- .menu li a:hover {
151
- background: #eba399;
166
+ .menu>li>a,
167
+ .menu>li>span {
168
+ display: block;
169
+ color: #234067;
170
+ font-weight: 500;
171
+ padding: 7px 16px;
172
+ text-decoration: none;
173
+ cursor: pointer;
174
+ font-size: 13px;
175
+ transition: background 0.2s;
152
176
  }
153
177
 
178
+ /* サブメニューの表示制御 */
154
179
  .menuSub {
180
+ display: none;
155
181
  position: absolute;
156
- margin-left: -6px;
182
+ top: 100%;
183
+ left: 0;
184
+ background: #f6fbff;
185
+ box-shadow: 0 1px 5px #b6d6f6;
186
+ border-radius: 0 0 5px 5px;
187
+ min-width: 150px;
188
+ z-index: 100;
157
189
  padding: 0;
158
- display: none;
190
+ margin: 0;
159
191
  }
160
192
 
161
- /*.openが付与された時、表示の設定*/
162
- .menuSub.open {
193
+ .menu>li:hover>.menuSub,
194
+ .menu>li:focus-within>.menuSub {
163
195
  display: block;
164
196
  }
165
197
 
198
+ .menuSub li {
199
+ list-style: none;
200
+ }
201
+
166
202
  .menuSub li a {
167
- padding: 5px;
168
- margin-left: -5px;
169
- margin-right: -5px;
170
- margin-bottom: -5px;
203
+ color: #3b5c7e;
204
+ padding: 7px 15px;
171
205
  display: block;
172
- color: rgb(20, 114, 192);
206
+ border-bottom: 1px solid #e3f0fc;
207
+ transition: color 0.2s, background 0.2s;
173
208
  text-decoration: none;
209
+ font-size: 13px;
210
+ }
211
+
212
+ .menuSub li:last-child a {
213
+ border-bottom: none;
174
214
  }
175
215
 
176
216
  .menuSub li a:hover {
177
- background: #eba399;
217
+ background: #d2e8f7;
218
+ color: #234067;
219
+ }
220
+
221
+ /* Main Content Layout */
222
+ .main-content {
223
+ display: flex;
224
+ flex-direction: column;
225
+ margin: 5px 1vw 0 1vw;
226
+ /* 余白を減らす */
227
+ gap: 6px;
228
+ /* 要素間の隙間も少し減らす */
229
+ font-size: 13px;
230
+ }
231
+
232
+ .input-row {
233
+ display: flex;
234
+ align-items: center;
235
+ gap: 10px;
236
+ margin-bottom: 7px;
237
+ font-size: 13px;
238
+ }
239
+
240
+ .input-row input[type="search"],
241
+ .input-row input[type="text"] {
242
+ background: #e5f2fb;
243
+ border: 1px solid #b3d6f6;
244
+ border-radius: 4px;
245
+ padding: 6px 10px;
246
+ color: #234067;
247
+ font-size: 13px;
248
+ outline: none;
249
+ transition: box-shadow 0.2s;
250
+ width: 170px;
251
+ }
252
+
253
+ .input-row input[type="search"]:focus {
254
+ box-shadow: 0 0 0 2px #b6d6f6;
255
+ }
256
+
257
+ .input-row button,
258
+ .input-row input[type="button"] {
259
+ background: #b6d6f6;
260
+ color: #234067;
261
+ border: none;
262
+ border-radius: 4px;
263
+ padding: 6px 13px;
264
+ font-size: 13px;
265
+ cursor: pointer;
266
+ transition: background 0.2s, color 0.2s;
267
+ font-weight: 500;
268
+ margin-left: 1px;
269
+ box-shadow: 0 1px 4px #b6d6f633;
270
+ }
271
+
272
+ .input-row button:hover,
273
+ .input-row input[type="button"]:hover {
274
+ background: #d2e8f7;
275
+ color: #539ad9;
276
+ box-shadow: 0 1px 8px #b6d6f6cc;
277
+ }
278
+
279
+ /* Dialog Styling Overrides */
280
+ .ui-dialog {
281
+ background: #e5f2fb;
282
+ color: #234067;
283
+ border-radius: 6px;
284
+ box-shadow: 0 2px 12px #b6d6f677;
285
+ border: none;
286
+ font-size: 13px;
287
+ }
288
+
289
+ .ui-dialog-titlebar {
290
+ background: #b6d6f6;
291
+ color: #539ad9;
292
+ border: none;
293
+ border-radius: 6px 6px 0 0;
294
+ font-weight: 700;
295
+ font-size: 13px;
296
+ }
297
+
298
+ .ui-dialog-buttonpane button {
299
+ background: #b6d6f6;
300
+ color: #234067;
301
+ border: none;
302
+ border-radius: 4px;
303
+ padding: 5px 11px;
304
+ font-weight: bold;
305
+ margin: 0 5px;
306
+ font-size: 13px;
307
+ transition: background 0.2s, color 0.2s;
308
+ }
309
+
310
+ .ui-dialog-buttonpane button:hover {
311
+ background: #539ad9;
312
+ color: #f6fbff;
313
+ }
314
+
315
+ /* Settings dialog table */
316
+ #setting_dialog table {
317
+ width: 95%;
318
+ margin-bottom: 5px;
319
+ font-size: 13px;
320
+ }
321
+
322
+ #setting_dialog .setting_name {
323
+ color: #539ad9;
324
+ width: 120px;
325
+ font-weight: bold;
326
+ padding-right: 12px;
327
+ font-size: 13px;
328
+ }
329
+
330
+ #setting_dialog .setting_value {
331
+ width: 100%;
332
+ max-width: 100%;
333
+ min-width: 120px;
334
+ box-sizing: border-box;
335
+ }
336
+
337
+ #setting_dialog input,
338
+ #setting_dialog select {
339
+ background: #f6fbff;
340
+ color: #234067;
341
+ border: 1px solid #b3d6f6;
342
+ border-radius: 4px;
343
+ padding: 5px 8px;
344
+ font-size: 13px;
345
+ }
346
+
347
+ #msg_text {
348
+ font-size: 13px;
349
+ color: #234067;
350
+ padding: 10px 0;
351
+ }
352
+
353
+ @media (max-width: 700px) {
354
+ .main-content {
355
+ margin: 7px 2vw;
356
+ }
357
+
358
+ .outarea {
359
+ padding: 7px;
360
+ }
361
+
362
+ .menu>li>a,
363
+ .menu>li>span {
364
+ padding: 7px 7px;
365
+ }
366
+
367
+ .input-row input[type="search"] {
368
+ width: 80px;
369
+ }
370
+ }
371
+
372
+ .input-row input#inDir {
373
+ width: 80vw;
374
+ max-width: 80vw;
375
+ min-width: 200px;
376
+ }
377
+
378
+ .input-row input#outFile {
379
+ width: 80vw;
380
+ max-width: 80vw;
381
+ min-width: 200px;
382
+ }
383
+
384
+ .input-row input#inDir,
385
+ .input-row input#outDir {
386
+ background: #f6fbff;
387
+ color: #234067;
388
+ border: 1px solid #b3d6f6;
389
+ border-radius: 4px;
390
+ padding: 6px 10px;
391
+ font-size: 13px;
392
+ outline: none;
393
+ transition: box-shadow 0.2s;
394
+ }
395
+
396
+ .input-row input#inDir:focus,
397
+ .input-row input#outDir:focus {
398
+ box-shadow: 0 0 0 2px #b6d6f6;
399
+ }
400
+
401
+ .input-row input#outFile,
402
+ .input-row input#outDir {
403
+ background: #f6fbff;
404
+ color: #234067;
405
+ border: 1px solid #b3d6f6;
406
+ border-radius: 4px;
407
+ padding: 6px 10px;
408
+ font-size: 13px;
409
+ outline: none;
410
+ transition: box-shadow 0.2s;
411
+ }
412
+
413
+ .input-row input#outFile:focus,
414
+ .input-row input#outDir:focus {
415
+ box-shadow: 0 0 0 2px #b6d6f6;
416
+ }
417
+
418
+ #dialog1 #search_str {
419
+ width: 80vw;
420
+ min-width: 400px;
421
+ max-width: 100%;
422
+ box-sizing: border-box;
423
+ }
424
+
425
+ #dialog2 #search_str2 {
426
+ width: 80vw;
427
+ min-width: 400px;
428
+ max-width: 100%;
429
+ box-sizing: border-box;
430
+ }
431
+
432
+ .inarea {
433
+ /* font-size: 1.13rem; */
434
+ padding: 3px 3px;
435
+ border: 1.5px soslid #bbb;
436
+ border-radius: var(--border-radius);
437
+ width: 85vw;
438
+ max-width: 100vw;
439
+ min-width: 50vw;
440
+ box-sizing: border-box;
441
+ background: #fafafa;
442
+ outline: none;
443
+ display: block;
444
+ margin-left: 10px;
445
+
446
+ }
447
+
448
+ .inarea:focus {
449
+ border-color: var(--main-color);
450
+ background: #fff;
451
+ }
452
+
453
+ /* Log Output */
454
+ .outarea {
455
+ background: #f6fbff;
456
+ border-radius: 7px;
457
+ min-height: 200px;
458
+ width: 98vw;
459
+ height: 85vh;
460
+ max-width: 100vw;
461
+ max-height: 100vh;
462
+ box-shadow: 1px 1px 1px #b6d6f677;
463
+ margin-top: 4px;
464
+ color: #b0bec5;
465
+ overflow-y: auto;
466
+ font-size: 12px;
467
+ margin-left: 10px;
468
+ margin-right: 1px;
469
+ display: block;
470
+ padding: 3px 1px;
471
+
472
+ }
473
+
474
+ ul.log {
475
+ margin: 0;
476
+ padding-left: 0.5px;
477
+ font-size: 13px;
478
+ color: #539ad9;
479
+ letter-spacing: 0.1px;
480
+ padding: 0.5px 0.5px;
481
+ }
482
+
483
+ ul.log li {
484
+ margin-bottom: 0.3em;
178
485
  }
data/lib/html/index.html CHANGED
@@ -10,71 +10,66 @@
10
10
  <!-- jQuery UI -->
11
11
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
12
12
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
13
-
14
13
  <script src="js/main.js"></script>
15
- <link rel="stylesheet" href="css/index.css" type="text/css">
14
+ <link rel="stylesheet" href="../css/index.css" type="text/css">
16
15
  </head>
17
16
 
18
17
  <body>
19
- <div id="msg_dialog" style="display:none;">
18
+ <div id="msg_dialog" class="dialog" style="display:none;">
20
19
  <div id="msg_text">message</div>
21
20
  </div>
22
- <hr>
23
- <!-- menu -->
24
- <div id="setting_dialog" style="display:none;">
25
- <dl id="wrap"></dl>
26
- </div>
27
- <div>
28
- <ul class="menu">
29
- <Li><a href="#" id="exec" name="exec">実行</a></li>
30
- <li><a href="#" id="stop" name="stop">停止</a></li>
31
- <li>
21
+ <div class="main-title-row">
22
+ <h2 class="main-title">RubyAppBase</h2>
23
+ <div class="main-title-actions">
24
+ <a href="#" id="exec" name="exec" class="btn primary">実行</a>
25
+ <a href="#" id="stop" name="stop" class="btn danger">停止</a>
26
+ <div class="btn primary menu-title" style="position:relative;">
32
27
  設定
33
- <ul class="menuSub">
28
+ <ul class="menuSub" style="right:0; left:auto; min-width:120px;">
34
29
  <li><a href="#" id="setting">設定</a></li>
35
30
  <li><a href="#" id="save_setting">設定保存</a></li>
36
31
  <li><a href="#" id="load_setting">設定読み込み</a></li>
37
32
  </ul>
38
- </li>
39
- <!--
40
- <li>
41
- menu3
42
- <ul class="menuSub">
43
- <li><a href="#">menu3-1</a></li>
44
- <li><a href="#">menu3-2</a></li>
45
- </ul>
46
- </li>
47
- -->
48
- </ul>
33
+ </div>
34
+ </div>
35
+ </div>
36
+ <hr>
37
+ <div id="setting_dialog" class="dialog" style="display:none;">
38
+ <dl id="wrap"></dl>
49
39
  </div>
50
40
 
51
- <table>
52
- <tr>
53
- <td>
54
- <div id="dialog1" style="display:none;">
55
- <input class="inarea" type="search" name="search_str" id="search_str">
56
- </div>
57
- </td>
58
- <td class="long"><input class="inarea" type="search" id="inDir" name="inDir"></td>
59
- <td><input type="button" id="select_dir" value="対象フォルダ" /></td>
60
- </tr>
61
- <tr>
62
- <td>
63
- <div id="dialog2" style="display:none;">
64
- <input class="inarea" type="search" name="search_str2" id="search_str2">
65
- </div>
66
- </td>
67
- <td class="long"><input class="inarea" type="search" id="outFile" name="outFile"></td>
68
- <td><input type="button" id="select_file" value="出力ファイル" /></td>
69
- <td><input type="button" id="open_file" value="開く" /></td>
70
- </tr>
71
- </table>
41
+ <section class="input-section">
42
+ <div id="dialog1" class="dialog" style="display:none;">
43
+ <input class="inarea" type="search" name="search_str" id="search_str">
44
+ </div>
45
+ <table>
46
+ <tr>
47
+ <td class="long">
48
+ <input class="inarea" type="search" id="inDir" name="inDir" placeholder="対象のフォルダを入力/選択...">
49
+ </td>
50
+ <td>
51
+ <input type="button" id="select_dir" value="対象フォルダ" class="btn secondary" />
52
+ </td>
53
+ </tr>
54
+ </table>
72
55
 
73
- <div class="outarea">
74
- <ul name="log" id="log" class="log">
75
- </ul>
76
- </div>
56
+ <div id="dialog2" class="dialog" style="display:none;">
57
+ <input class="inarea" type="search" name="search_str2" id="search_str2">
58
+ </div>
59
+ <table>
60
+ <tr>
61
+ <td class="long">
62
+ <input class="inarea" type="search" id="outFile" name="outFile" placeholder="出力ファイルを入力/選択...">
63
+ </td>
64
+ <td><input type="button" id="select_file" value="出力ファイル" /></td>
65
+ <td><input type="button" id="open_file" value="開く" /></td>
66
+ </tr>
67
+ </table>
68
+ </section>
77
69
 
70
+ <section class="outarea">
71
+ <div name="log" id="log" class="log"></div>
72
+ </section>
78
73
  </body>
79
74
 
80
75
  </html>
data/lib/js/main.js CHANGED
@@ -78,7 +78,10 @@ function server_connect(url) {
78
78
  open_dialog("<font color='red'>エラーが発生しました</font>");
79
79
  }
80
80
  else if (evt.data.match(/^popup:/)) {
81
- open_dialog(evt.data.replace(/^popup:/, ""), 3000);
81
+ console.log("str=" + evt.data);
82
+ const timeout_str = evt.data.match(/:(\d+):/);
83
+ console.log("timeout_str=" + timeout_str[1]);
84
+ open_dialog(evt.data.replace(/^popup:(\d+):/, ""), Number(timeout_str[1]));
82
85
  } else {
83
86
  var log = "<li>" + evt.data + "</li>";
84
87
  $('#log').append(log);
@@ -177,21 +180,30 @@ function select_file_dialog(search_id, file_kind, dialog_id, select_file, file_n
177
180
  $("#" + search_id).val($("#" + file_name).val());
178
181
  $("#" + dialog_id).dialog({
179
182
  modal: true
180
- , show: "slide" //表示時のアニメーション
181
- , hide: "explode" //閉じた時のアニメーション
182
- , title: "Select File" //ダイアログのタイトル
183
- , width: 580 //ダイアログの横幅
184
- , height: 400 //ダイアログの高さ
185
- , resizable: true //リサイズ可
186
- , closeOnEscape: false //[ESC]キーで閉じられなくする
187
- , draggable: true //ダイアログの移動を可に
183
+ , show: "slide"
184
+ , hide: "explode"
185
+ , title: "Select File"
186
+ , width: 580
187
+ , height: 400
188
+ , resizable: true
189
+ , closeOnEscape: false
190
+ , draggable: true
191
+ , open: function (event, ui) {
192
+ // ダイアログの高さを取得
193
+ var dialogHeight = $("#" + dialog_id).height();
194
+ // オートコンプリートリストの高さをダイアログに合わせる
195
+ $(".ui-autocomplete").css({
196
+ "max-height": dialogHeight + "px",
197
+ "overflow-y": "auto"
198
+ });
199
+ }
188
200
  , buttons: {
189
- "OK": function () { //OKボタン
201
+ "OK": function () {
190
202
  $("#" + file_name).val($("#" + search_id).val());
191
203
  $(this).dialog("close");
192
204
  $("#" + search_id).autocomplete("destroy");
193
205
  },
194
- "Cancel": function () { //Cancelボタン
206
+ "Cancel": function () {
195
207
  $(this).dialog("close");
196
208
  $("#" + search_id).autocomplete("destroy");
197
209
  }
@@ -202,6 +214,8 @@ function select_file_dialog(search_id, file_kind, dialog_id, select_file, file_n
202
214
 
203
215
  function setting_dialog(open_id, dialog_id, json_file) {
204
216
  var version;
217
+ var is_error = false;
218
+
205
219
  $("#" + open_id).click(function () {
206
220
  $("#" + dialog_id).val = $(function () {
207
221
  $("dl#wrap").empty();
@@ -214,6 +228,14 @@ function setting_dialog(open_id, dialog_id, json_file) {
214
228
  + "<td><input class='setting_value' type='text' " + "id=" + s["setting_list"][i].name + "_value " + "value=" + "'" + s["setting_list"][i].value + "'" + ">"
215
229
  + "</td></tr></table>"
216
230
  $("dl#wrap").append(h);
231
+ } else if (s["setting_list"][i].type == "textarea") {
232
+ var h = "<table><tr>"
233
+ + "<td class='setting_name'>" + s["setting_list"][i].description + "</td>"
234
+ + "<td><textarea class='setting_value' rows='5' " + "id=" + s["setting_list"][i].name + "_value " + "value=" + ">"
235
+ + "" + JSON.stringify(s["setting_list"][i].value, null, 2)
236
+ + "</textarea>"
237
+ + "</td></tr></table>"
238
+ $("dl#wrap").append(h);
217
239
  } else if (s["setting_list"][i].type == "checkbox") {
218
240
  var h = "<table><tr>";
219
241
  h += "<td class='setting_name'>" + s["setting_list"][i].description + "</td>";
@@ -249,8 +271,8 @@ function setting_dialog(open_id, dialog_id, json_file) {
249
271
  , show: "slide" //表示時のアニメーション
250
272
  , hide: "explode" //閉じた時のアニメーション
251
273
  , title: "Setting" //ダイアログのタイトル
252
- , width: 580 //ダイアログの横幅
253
- , height: 400 //ダイアログの高さ
274
+ , width: 650 //ダイアログの横幅
275
+ , height: 600 //ダイアログの高さ
254
276
  , resizable: true //リサイズ可
255
277
  , closeOnEscape: false //[ESC]キーで閉じられなくする
256
278
  , draggable: true //ダイアログの移動を可に
@@ -258,6 +280,7 @@ function setting_dialog(open_id, dialog_id, json_file) {
258
280
  "OK": function () { //OKボタン
259
281
  var json_obj = {};
260
282
  var json_data = [];
283
+ is_error = false;
261
284
  $.getJSON(json_file, function (s) {
262
285
  json_obj["version"] = s["version"];
263
286
  for (var i in s["setting_list"]) {
@@ -271,6 +294,20 @@ function setting_dialog(open_id, dialog_id, json_file) {
271
294
  data["description"] = s["setting_list"][i].description;
272
295
  json_data.push(data);
273
296
  }
297
+ else if (s["setting_list"][i].type == "textarea") {
298
+ var data = {};
299
+ data["name"] = s["setting_list"][i].name;
300
+ try {
301
+ data["value"] = JSON.parse($("#" + s["setting_list"][i].name + "_value").val());
302
+ } catch (e) {
303
+ is_error = true;
304
+ alert("JavaScript error:" + e.message + "\n" + $("#" + s["setting_list"][i].name + "_value").val());
305
+ }
306
+ data["type"] = s["setting_list"][i].type;
307
+ data["select"] = s["setting_list"][i].select;
308
+ data["description"] = s["setting_list"][i].description;
309
+ json_data.push(data);
310
+ }
274
311
  else if (s["setting_list"][i].type == "checkbox") {
275
312
  var data = {};
276
313
  data["name"] = s["setting_list"][i].name;
@@ -295,6 +332,7 @@ function setting_dialog(open_id, dialog_id, json_file) {
295
332
  //console.log("type=" + s["setting_list"][i].type);
296
333
  }
297
334
  }
335
+ console.log("OK Button " + is_error);
298
336
  // Jsonデータをサーバに送信
299
337
  json_obj["setting_list"] = json_data;
300
338
  $ws.send("setting:" + JSON.stringify(json_obj));
@@ -302,6 +340,7 @@ function setting_dialog(open_id, dialog_id, json_file) {
302
340
  $(this).dialog("close");
303
341
  },
304
342
  "Cancel": function () { //Cancelボタン
343
+ console.log("Cancel Button");
305
344
  $(this).dialog("close");
306
345
  }
307
346
  }
@@ -381,10 +420,10 @@ function openFile(file) {
381
420
  $(document).ready(function () {
382
421
 
383
422
  // サーバに接続
384
- server_connect("ws://localhost:40159/wsserver")
423
+ server_connect("ws://localhost:40589/wsserver")
385
424
  window.onload = function (e) {
386
425
  // サーバに接続
387
- //server_connect("ws://localhost:40159/wsserver")
426
+ //server_connect("ws://localhost:40589/wsserver")
388
427
  }
389
428
 
390
429
  // menu
@@ -405,14 +444,14 @@ $(document).ready(function () {
405
444
  var width = 800;
406
445
  var height = 600;
407
446
  $(window).resize(function () {
408
- $(".outarea").height($(window).height() - 180);
447
+ //$(".outarea").height($(window).height() - 220);
409
448
  });
410
449
  // ウインドウの位置
411
450
  $(function () {
412
- //window.resizeTo(width, height);
413
- //window.moveTo((window.screen.width / 2) - (width / 2), (screen.height / 2) - (height / 2));
414
- //window.moveTo(0,0);
415
- $(".outarea").height($(window).height() - 180);
451
+ // window.resizeTo(width, height);
452
+ // window.moveTo((window.screen.width / 2) - (width / 2), (screen.height / 2) - (height / 2));
453
+ // //window.moveTo(0,0);
454
+ // $(".outarea").height($(window).height() - 220);
416
455
  });
417
456
 
418
457
  $('.outarea').scroll(function () {
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module RubyUmlClassVer
4
- VERSION = "0.6.0"
4
+ VERSION = "0.6.1"
5
5
  end
data/lib/server.rb CHANGED
@@ -53,6 +53,16 @@ class Search < Sinatra::Base
53
53
  data["value"] = File.expand_path(file)
54
54
  res.push data
55
55
  end
56
+ if 0 == res.select { |dir| dir["label"] == "../" }.size
57
+ data = {}
58
+ pp = Pathname(File.expand_path("#{dir}/#{file}"))
59
+ data["label"] = "../"
60
+ data["label"] += "/" if pp.parent == "/"
61
+ data["value"] = pp.parent.to_s
62
+ data["value"] = "/" if data["value"] =~ /^[\/]+$/
63
+ #puts "value = #{pp.parent.to_s}"
64
+ res.push data
65
+ end
56
66
  JSON.generate res.sort { |a, b| a["value"] <=> b["value"] }
57
67
  end
58
68
  end
data/lib/wsserver.rb CHANGED
@@ -111,11 +111,9 @@ class WsServer < Sinatra::Base
111
111
  end
112
112
  if msg =~ /^openfile:/
113
113
  file = msg.gsub(/^openfile:/, "")
114
- if file != ""
115
- Thread.new {
116
- system "#{json_config["editor"]} #{CGI.unescapeHTML(file)}"
117
- }
118
- end
114
+ Thread.new {
115
+ system "#{json_config["editor"]} #{CGI.unescapeHTML(file)}"
116
+ }
119
117
  end
120
118
 
121
119
  # アプリケーション終了
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: ruby_uml_class
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.6.0
4
+ version: 0.6.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Masataka kuwayama
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2025-03-16 00:00:00.000000000 Z
11
+ date: 2025-08-24 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: browser_app_base
@@ -69,6 +69,7 @@ files:
69
69
  - Rakefile
70
70
  - bin/start_ruby_uml_class.rb
71
71
  - bin/start_ruby_uml_class.rbw
72
+ - img/RubyUmlClass.gif
72
73
  - img/RubyUmlClass.mp4
73
74
  - lib/app_load.rb
74
75
  - lib/config.ru