teratail
回答率
85.36%
teratail 10th-anniversary
teratail 10th-anniversary
質問するログイン新規登録
トップに関する質問サイトバーの戻り値を自作辞書で翻訳したい

編集履歴

質問編集履歴

1

コードの更新

2020/02/25 10:10

投稿

TopingMado
TopingMado

スコア25

test CHANGED
File without changes
test CHANGED
@@ -10,65 +10,63 @@
10
10
 
11
11
  ### 該当のソースコード
12
12
 
13
-
13
+ サイトバーを表示
14
14
 
15
15
  ```gas
16
16
 
17
+ //MainController.gs
18
+
19
+ function showSidebar() {
20
+
21
+ var htmlOutput = HtmlService.createTemplateFromFile('index').evaluate();
22
+
23
+ SpreadsheetApp.getUi().showSidebar(htmlOutput);
24
+
25
+ ```
26
+
27
+ GASの関数
28
+
29
+ ```gas
30
+
31
+ //code.gs
32
+
17
33
  function Translate(Title,Sentence) {
18
34
 
35
+
36
+
19
- //サイトバーで選択したタイトルに応じて、辞書列(中国語、日本語)を選択し、文章作成スペースで入力した内容(Sentence)を翻訳
37
+ const Translate = (Title,Sentence) => {
20
-
38
+
21
- const dictSheet = SpreadsheetApp.getActive().getSheetByName("dict");
39
+ const dictionary = SpreadsheetApp.getActive().getSheetByName("dict").getDataRange().getValues();
40
+
22
-
41
+ const pattern = {
23
-
24
-
42
+
25
- if(Title=="タイトルA"){
43
+ "タイトルA":{key:0,value:1},
44
+
26
-
45
+ "タイトルB":{key:2,value:3},
46
+
47
+ "タイトルC":{key:4,value:5},
48
+
49
+ "タイトルD":{key:6,value:7},
50
+
51
+ };
52
+
53
+ const conf = pattern[Title];
54
+
55
+ if (!conf) return `${Sentence} 不正なタイトル`;
56
+
57
+ const dic = dictionary.filter(e=>e[conf["key"]] !== "").map(e=>[RegExp(e[conf["key"]],'g'),e[conf["value"]]]);
58
+
27
- var CHValues=dictSheet.getRange("A2:A").getValues();
59
+ return dic.reduce((a,c) => a.replace(c[0],c[1]),Sentence);
28
-
29
- var JPValues=dictSheet.getRange("B2:B").getValues();
60
+
30
-
31
-
32
-
33
- for(var i=0;i<CHValues.length;i++){
34
-
35
- var TranslatedValue = Sentence.replace(RegExp(CHValues[i],'g'),JPValues[i]);
36
-
37
- }
61
+ }
38
-
62
+
63
+
64
+
39
- var SetValue = TranslatedValue ;
65
+ const showSidebar = () => {
66
+
40
-
67
+ SpreadsheetApp.getUi().showSidebar(HtmlService.createTemplateFromFile('index').evaluate());
68
+
41
- }
69
+ }
42
-
43
-
44
-
45
-
46
-
47
- else if(Title=="タイトルB"){
48
-
49
- var CHValues=dictSheet.getRange("C2:C").getValues();
50
-
51
- var JPValues=dictSheet.getRange("D2:D").getValues();
52
-
53
-
54
-
55
- for(var i=0;i<CHValues.length;i++){
56
-
57
- var TranslatedValue = Sentence.replace(RegExp(CHValues[i],'g'),JPValues[i]);
58
-
59
- }
60
-
61
- var SetValue = TranslatedValue ;
62
-
63
- }
64
-
65
-
66
-
67
-
68
-
69
- return SetValue;
70
-
71
-
72
70
 
73
71
  }
74
72
 
@@ -78,92 +76,132 @@
78
76
 
79
77
  ```html
80
78
 
79
+ //index.html
80
+
81
81
  <!DOCTYPE html>
82
82
 
83
83
  <html>
84
84
 
85
85
  <head>
86
86
 
87
- <base target="_top">
87
+ <base target="_top">
88
+
89
+ <meta charset="UTF-8">
90
+
91
+ <?!= HtmlService.createHtmlOutputFromFile('css').getContent(); ?>
92
+
93
+ </head>
94
+
95
+ <body>
96
+
97
+ <div>
98
+
99
+ <textarea id = "WritingArea" rows="8" cols="25" placeholder="文章作成用スペース"></textarea>
100
+
101
+ </div>
102
+
103
+ <div>
104
+
105
+ <textarea id = "TranslateArea" rows="8" cols="25" placeholder="翻訳用スペース"></textarea>
106
+
107
+ <textarea id = "TitleValue" rows="1" cols="10" placeholder="タイトルを選択"></textarea>
108
+
109
+ </div>
110
+
111
+ <div>
112
+
113
+ <select id="TitleList" size="4" onchange="javascript:GetTitleText()">
114
+
115
+ <option>タイトルA</option>
116
+
117
+ <option>タイトルB</option>
118
+
119
+ <option>タイトルC</option>
120
+
121
+ <option>タイトルD</option>
122
+
123
+ </select>
124
+
125
+ </div>
126
+
127
+ <div style="text-align:center;">
128
+
129
+ <input type="button" class="blue" value="翻訳" onclick="javascript:TranslateSentence();">
130
+
131
+ </div>
132
+
133
+ <?!= HtmlService.createHtmlOutputFromFile('js').getContent(); ?>
134
+
135
+ </body>
136
+
137
+ </html>
138
+
139
+ ```
140
+
141
+ CSS
142
+
143
+ ```HTML
144
+
145
+ //css.html
88
146
 
89
147
  <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
90
148
 
91
- <meta charset="UTF-8">
92
-
93
- <?!= HtmlService.createHtmlOutputFromFile('style').getContent(); ?>
94
-
95
- </head>
96
-
97
- <body>
98
-
99
- <div>
100
-
101
- <textarea id = "WritingArea" rows="8" cols="25" placeholder="文章作成用スペース"></textarea>
102
-
103
- </div>
104
-
105
- <div>
106
-
107
- <textarea id = "TranslateArea" rows="8" cols="25" placeholder="翻訳用スペース"></textarea>
108
-
109
- <textarea id = "TitleValue" rows="1" cols="10" placeholder="タイトルを選択"></textarea>
110
-
111
- </div>
112
-
113
- <div>
114
-
115
- <select id="TitleList" size="4" onchange="javascript:GetTitleText()">
116
-
117
- <option>タイトルA</option>
118
-
119
- <option>タイトルB</option>
120
-
121
- <option>タイトルC</option>
122
-
123
- <option>タイトルD</option>
124
-
125
- </select>
126
-
127
- </div>
128
-
129
- <div style="text-align:center;">
130
-
131
- <input type="button" class="blue" value="翻訳" onclick="javascript:TranslateSentence();">
132
-
133
- </div>
134
-
135
- <?!= HtmlService.createHtmlOutputFromFile('js').getContent(); ?>
136
-
137
- </body>
138
-
139
- </html>
140
-
141
149
  ```
142
150
 
143
151
  サイトバーで使う関数
144
152
 
145
153
  ```js
146
154
 
155
+ //js.html
156
+
157
+
158
+
159
+ <script>
160
+
161
+ function GetTitleText(){
162
+
163
+ var TitleElement = document.getElementById("TitleList");
164
+
165
+ var result = TitleElement.options[TitleElement.selectedIndex].text;
166
+
167
+ document.getElementById("TitleValue").innerHTML = result;
168
+
169
+ }
170
+
171
+
172
+
173
+
174
+
147
175
  function TranslateSentence(){
148
176
 
177
+ const TranslateSentence = () => {
178
+
149
- var TitleValue=document.getElementById("TitleValue").value;
179
+ const TitleValue=document.getElementById("TitleValue").value;
150
-
180
+
151
- var WriteValue=document.getElementById("WritingArea").value;
181
+ const WriteValue=document.getElementById("WritingArea").value;
152
-
153
-
154
-
155
- google.script.run
182
+
156
-
183
+
184
+
157
- .withSuccessHandler(function(Translated){
185
+ google.script.run.withSuccessHandler(Translated => {
158
-
186
+
159
- document.getElementById("TranslateArea").value =Translated;
187
+ document.getElementById("TranslateArea").value =Translated;
160
-
161
- //文章作成スペースを入力内容を翻訳して、翻訳用スペースに出力
188
+
162
-
163
- })
164
-
165
- .Translate(TitleValue,WriteValue);
189
+ }).Translate(TitleValue,WriteValue);
166
-
190
+
167
- }
191
+ }
192
+
168
-
193
+ const GetTitleText = () => {
194
+
195
+ document.getElementById("TitleValue").value = document.getElementById("TitleList").value;
196
+
197
+ }
198
+
199
+ }
200
+
201
+
202
+
203
+ </script>
204
+
205
+
206
+
169
- ```
207
+ ```