Mercurial > hg > extraction-interface
comparison views/Extractapp/TaggingText.php @ 122:a36bb5a48af4 extractapp tip
1. remove redundancy server side code.
2. All pop up sub-windows are made with dialog component of bootstrap v3.3.2
author | Calvin Yeh <cyeh@mpiwg-berlin.mpg.de> |
---|---|
date | Thu, 28 Sep 2017 22:26:48 +0200 |
parents | 7f2c5d542616 |
children |
comparison
equal
deleted
inserted
replaced
121:21e89eca0b84 | 122:a36bb5a48af4 |
---|---|
15 * | 15 * |
16 * You should have received a copy of the GNU General Public License | 16 * You should have received a copy of the GNU General Public License |
17 * along with Extraction-interface. If not, see <http://www.gnu.org/licenses/>. | 17 * along with Extraction-interface. If not, see <http://www.gnu.org/licenses/>. |
18 */ | 18 */ |
19 | 19 |
20 /*! \file | 20 /*! \file |
21 * This is the view for TaggingText. | 21 * This is the view for TaggingText. |
22 * It shows the extraction-interface application itself. | 22 * It shows the extraction-interface application itself. |
23 * The input data for this view come from models/extractapp.php which is handled by controllers/extractapp.php. | 23 * The input data for this view come from models/extractapp.php which is handled by controllers/extractapp.php. |
24 * Input data for example, are (1)text string (containing tags if there are any), | 24 * Input data for example, are (1)text string (containing tags if there are any), |
25 * (2)taglist for the current topic, (3)book and section information, etc. | 25 * (2)taglist for the current topic, (3)book and section information, etc. |
26 * The output data are passed to backend by controller to corresponding method in model/extractapp.php. | 26 * The output data are passed to backend by controller to corresponding method in model/extractapp.php. |
27 * Output data is the tagged text string. | 27 * Output data is the tagged text string. |
28 * | 28 * |
29 * The user interface contains tagging area on the left side, and toolbox on the right side. | 29 * The user interface contains tagging area on the left side, and toolbox on the right side. |
30 * There are popup windows to assist the tagging task, for example RegEx-editors, tag-window, remove-tag-window, etc. | 30 * There are popup windows to assist the tagging task, for example RegEx-editors, tag-window, remove-tag-window, etc. |
31 * | 31 * |
32 */ | 32 */ |
33 | 33 |
34 // --- initialize config file and input text --- | 34 // --- initialize config file and input text --- |
35 $stringInput = $viewmodel['stringInput']; | 35 $stringInput = $viewmodel['stringInput']; |
36 $wordlistArray = $viewmodel['wordlistArray']; | 36 $wordlistArray = $viewmodel['wordlistArray']; |
39 $topiclistArray = $viewmodel['topiclistArray']; | 39 $topiclistArray = $viewmodel['topiclistArray']; |
40 $default_topic_id = $viewmodel['default_topic_id']; | 40 $default_topic_id = $viewmodel['default_topic_id']; |
41 $topic_name = $viewmodel['topic_name']; // array of names | 41 $topic_name = $viewmodel['topic_name']; // array of names |
42 $topic_tag = $viewmodel['topic_tag']; | 42 $topic_tag = $viewmodel['topic_tag']; |
43 $topic_tag_ch = $viewmodel['topic_tag_ch']; | 43 $topic_tag_ch = $viewmodel['topic_tag_ch']; |
44 $info = $viewmodel['info']; | 44 $info = $viewmodel['info']; |
45 $messages = $viewmodel['messages']; | 45 $messages = $viewmodel['messages']; |
46 | 46 |
47 $taglist_infile = $viewmodel['taglist_infile']; | 47 $taglist_infile = $viewmodel['taglist_infile']; |
48 $book_meta = $viewmodel['book_meta']; | 48 $book_meta = $viewmodel['book_meta']; |
49 | 49 |
55 <meta charset="UTF-8"> | 55 <meta charset="UTF-8"> |
56 <title>Extraction Interface</title> | 56 <title>Extraction Interface</title> |
57 <meta http-equiv="no-cache"> | 57 <meta http-equiv="no-cache"> |
58 <meta http-equiv="Expires" content="-1"> | 58 <meta http-equiv="Expires" content="-1"> |
59 <meta http-equiv="Cache-Control" content="no-cache"> | 59 <meta http-equiv="Cache-Control" content="no-cache"> |
60 <?php include 'views/maintemplate.php'; ?> | |
61 <script src="../js/jquery.bootstrap-growl.min.js"></script> | |
60 | 62 |
61 <style> | 63 <style> |
62 dynasty | 64 dynasty |
63 { | 65 { |
64 color:red; | 66 color:red; |
69 } | 71 } |
70 name | 72 name |
71 { | 73 { |
72 color:orange; | 74 color:orange; |
73 } | 75 } |
76 | |
77 body { | |
78 overflow: hidden; | |
79 padding: 15px; | |
80 } | |
81 | |
82 #editable-area-wraper { | |
83 height: 90vh; | |
84 overflow: auto; | |
85 } | |
86 | |
74 #editable-area { | 87 #editable-area { |
75 line-height:160%; | 88 line-height:160%; |
76 letter-spacing:1.5px; | 89 letter-spacing:1.5px; |
77 font-size:21px; | 90 font-size:21px; |
78 } | 91 word-wrap: break-word; |
92 } | |
93 | |
79 | 94 |
80 <?php | 95 <?php |
81 // color on the tags | 96 // color on the tags |
82 foreach ( $taglistArray as $taglistValue ) { | 97 foreach ( $taglistArray as $taglistValue ) { |
98 | |
83 echo $taglistValue[2]."\n{\ncolor:".$taglistValue[3]."; cursor: hand;\n}\n"; | 99 echo $taglistValue[2]."\n{\ncolor:".$taglistValue[3]."; cursor: hand;\n}\n"; |
84 | 100 |
101 echo ".EditingMode ".$taglistValue[2]."\n{\ncursor: initial;\n}\n"; | |
102 | |
85 echo ".span_".$taglistValue[2]."\n{\nbackground-color:".$taglistValue[3]."\n}\n"; | 103 echo ".span_".$taglistValue[2]."\n{\nbackground-color:".$taglistValue[3]."\n}\n"; |
86 } | 104 } |
87 | 105 |
88 ?> | 106 ?> |
89 </style> | 107 </style> |
106 } | 124 } |
107 | 125 |
108 | 126 |
109 for (var i = 0; i < taglistArray.length; i++) { | 127 for (var i = 0; i < taglistArray.length; i++) { |
110 var taglistValue = taglistArray[i]; | 128 var taglistValue = taglistArray[i]; |
111 | 129 |
112 $(taglistValue[2]).css('color', taglistValue[3]); | 130 $(taglistValue[2]).css('color', taglistValue[3]); |
113 /*var element = document.querySelectorAll(taglistValue[2]); | 131 /*var element = document.querySelectorAll(taglistValue[2]); |
114 for (var j = 0; j < element.length; j++) { | 132 for (var j = 0; j < element.length; j++) { |
115 element[j].style.color = taglistValue[3]; | 133 element[j].style.color = taglistValue[3]; |
116 } | 134 } |
117 */ | 135 */ |
118 } | 136 } |
119 } | 137 } |
120 | 138 |
121 | 139 |
122 // ---- use cookie to save text and reload page for the up-to-date taglist | 140 // ---- use cookie to save text and reload page for the up-to-date taglist |
123 function updatePage() { | 141 function updatePage() { |
124 var text = getCookie(); | 142 var text = getCookie(); |
125 //document.forms['receiver'].elements['message'].value = text; | 143 //document.forms['receiver'].elements['message'].value = text; |
126 console.log(text); | |
127 if (text == "reload") { | 144 if (text == "reload") { |
128 setCookie(""); | 145 setCookie(""); |
129 saveTextToLGService(); | 146 saveTextToLGService(); |
130 | 147 |
131 } | 148 } |
149 var form = document.createElement("form"); | 166 var form = document.createElement("form"); |
150 form.setAttribute("method", "post"); | 167 form.setAttribute("method", "post"); |
151 form.setAttribute("action", "./TaggingText"); // hand to controller | 168 form.setAttribute("action", "./TaggingText"); // hand to controller |
152 form.setAttribute("target", "_blank"); | 169 form.setAttribute("target", "_blank"); |
153 | 170 |
154 var hiddenField = document.createElement("input"); | 171 var hiddenField = document.createElement("input"); |
155 hiddenField.setAttribute("name", "topic"); | 172 hiddenField.setAttribute("name", "topic"); |
156 var topic_id = JSON.parse('<?php echo json_encode($default_topic_id) ?>'); | 173 var topic_id = JSON.parse('<?php echo json_encode($default_topic_id) ?>'); |
157 hiddenField.setAttribute("value", topic_id); | 174 hiddenField.setAttribute("value", topic_id); |
158 form.appendChild(hiddenField); | 175 form.appendChild(hiddenField); |
159 | 176 |
160 var hiddenField = document.createElement("input"); | 177 var hiddenField = document.createElement("input"); |
161 hiddenField.setAttribute("name", "func"); | 178 hiddenField.setAttribute("name", "func"); |
162 hiddenField.setAttribute("value", "ReloadText"); | 179 hiddenField.setAttribute("value", "ReloadText"); |
163 form.appendChild(hiddenField); | 180 form.appendChild(hiddenField); |
164 | 181 |
165 _postForContineTagging(form); | 182 _postForContineTagging(form); |
175 $('#reloadTextButton').css("display", "block"); | 192 $('#reloadTextButton').css("display", "block"); |
176 | 193 |
177 return; | 194 return; |
178 } | 195 } |
179 return; | 196 return; |
180 | 197 |
181 } | 198 } |
182 | 199 |
183 // on click on tagged words, call removeTagNewDiv() for the popup window | 200 // on click on tagged words, call removeTagNewDiv() for the popup window |
184 // popup-window overlapping issue | 201 // popup-window overlapping issue |
185 var pop_remove_tag_window = true; | 202 var pop_remove_tag_window = true; |
186 var taglistArray = JSON.parse('<?php echo json_encode($taglistArray) ?>'); | 203 var taglistArray = JSON.parse('<?php echo json_encode($taglistArray) ?>'); |
187 for (var i = 0; i < taglistArray.length; i++) { | 204 for (var i = 0; i < taglistArray.length; i++) { |
188 var taglistValue = taglistArray[i]; | 205 var taglistValue = taglistArray[i]; |
189 | 206 |
190 | 207 |
191 $(document).on("click", taglistValue[2], function (e, taglistValue) { | 208 $(document).on("click", taglistValue[2], function (e, taglistValue) { |
192 if ($("#editTextId").html() != "Edit text") return 0; | 209 //if ($("#editTextId").html() != "Edit text") return 0; |
210 if(EditingMode === "editing") return 0; | |
193 var tag = $(this).prop("tagName").toLowerCase(); | 211 var tag = $(this).prop("tagName").toLowerCase(); |
194 //if (tagName != taglistValue[2]) return 0; | 212 //if (tagName != taglistValue[2]) return 0; |
195 | 213 |
196 // pop_remove_tag_window is a global variable which indicates if to show the remove-popup-window | 214 // pop_remove_tag_window is a global variable which indicates if to show the remove-popup-window |
197 if (pop_remove_tag_window) { | 215 if (pop_remove_tag_window) { |
198 removeTagNewDiv( e, tag , $(this)); | 216 removeTagNewDiv( e, tag , $(this)); |
199 | 217 |
200 }; | 218 }; |
201 return false; | 219 return false; |
202 }); | 220 }); |
203 | 221 |
204 | 222 |
205 | 223 |
206 }; | 224 }; |
207 | 225 |
208 /* | |
209 <?php | |
210 foreach ( $taglistArray as $taglistValue ) { | |
211 echo '$(document).on("click", "'.$taglistValue[2].'", function (e) {'."\n"; | |
212 echo "\t".'if ( $(this).prop("tagName").toLowerCase() != "'.$taglistValue[2].'" ) return 0;'."\n"; | |
213 echo "\t".'if ( $("#editTextId").html() != "Edit text" ) return 0;'."\n"; | |
214 echo "\tremoveTagNewDiv( e, \"".$taglistValue[2]."\", $(this) );\n"; | |
215 echo "});\n"; | |
216 } | |
217 ?> | |
218 */ | |
219 | |
220 $(document).ready(function(){ | 226 $(document).ready(function(){ |
221 | 227 |
222 $("#loading").hide(); | 228 $("#loading").hide(); |
223 | 229 |
224 // --- for sidebar--- | 230 // --- for sidebar--- |
225 //run once | 231 //run once |
226 var el=$('#follow-scroll'); | 232 var el=$('#follow-scroll'); |
227 var originalelpos=el.offset().top; // take it where it originally is on the page | 233 var originalelpos=el.offset().top; // take it where it originally is on the page |
228 | 234 |
229 //run on scroll | 235 //run on scroll |
230 $(window).scroll(function(){ | 236 $(window).scroll(function(){ |
231 var el = $('#follow-scroll'); // important! (local) | 237 var el = $('#follow-scroll'); // important! (local) |
232 var elpos = el.offset().top; // take current situation | 238 var elpos = el.offset().top; // take current situation |
233 var windowpos = $(window).scrollTop(); | 239 var windowpos = $(window).scrollTop(); |
240 | 246 |
241 //--- for popups --- | 247 //--- for popups --- |
242 //run once | 248 //run once |
243 var el=$('#popups'); | 249 var el=$('#popups'); |
244 var originalelpos=el.offset().top; // take it where it originally is on the page | 250 var originalelpos=el.offset().top; // take it where it originally is on the page |
245 | 251 |
246 //run on scroll | 252 //run on scroll |
247 $(window).scroll(function(){ | 253 $(window).scroll(function(){ |
248 var el = $('#popups'); // important! (local) | 254 var el = $('#popups'); // important! (local) |
249 var elpos = el.offset().top; // take current situation | 255 var elpos = el.offset().top; // take current situation |
250 var windowpos = $(window).scrollTop(); | 256 var windowpos = $(window).scrollTop(); |
253 el.stop().animate({'top':finaldestination},0); | 259 el.stop().animate({'top':finaldestination},0); |
254 }); | 260 }); |
255 // --- | 261 // --- |
256 | 262 |
257 | 263 |
258 // === This case only be possible for developing on local machine ==== | 264 // === This case only be possible for developing on local machine ==== |
259 var _GET = JSON.parse('<?php echo json_encode($_GET) ?>'); | 265 var _GET = JSON.parse('<?php echo json_encode($_GET) ?>'); |
260 if (_GET['id']) { | 266 if (_GET['id']) { |
261 var info = JSON.parse('<?php echo json_encode($info) ?>'); | 267 var info = JSON.parse('<?php echo json_encode($info) ?>'); |
262 var redirectUrl = "http://localhost:1080/localgazetteers-dev/extraction-interface/Extractapp/TaggingText"; | 268 var redirectUrl = "http://localhost:1080/localgazetteers-dev/extraction-interface/Extractapp/TaggingText"; |
263 var section_id = info['section_id']; | 269 var section_id = info['section_id']; |
265 var form = $('<form action="' + redirectUrl + '" method="post">' + | 271 var form = $('<form action="' + redirectUrl + '" method="post">' + |
266 '<input type="hidden" name="sectionId" value="'+section_id+'" />' + | 272 '<input type="hidden" name="sectionId" value="'+section_id+'" />' + |
267 '</form>'); | 273 '</form>'); |
268 $('body').append(form); | 274 $('body').append(form); |
269 $(form).submit(); | 275 $(form).submit(); |
270 } | 276 } |
271 // -------- | 277 // -------- |
272 | 278 |
273 // --- handle file version conflict --- | 279 // --- handle file version conflict --- |
274 var info = JSON.parse('<?php echo json_encode($info) ?>'); | 280 var info = JSON.parse('<?php echo json_encode($info) ?>'); |
275 // the first time to this section. without branch_id and file_id | 281 // the first time to this section. without branch_id and file_id |
281 | 287 |
282 // --- handle taglist deprecation --- | 288 // --- handle taglist deprecation --- |
283 var taglist_infile = JSON.parse('<?php echo json_encode($taglist_infile) ?>'); | 289 var taglist_infile = JSON.parse('<?php echo json_encode($taglist_infile) ?>'); |
284 var taglistArray = JSON.parse('<?php echo json_encode($taglistArray) ?>'); | 290 var taglistArray = JSON.parse('<?php echo json_encode($taglistArray) ?>'); |
285 | 291 |
292 /* | |
286 if (taglist_infile == "") { | 293 if (taglist_infile == "") { |
287 console.log("Debug: taglist_infile is empty which means taglist_infile is equal to taglist in db."); | 294 console.log("Debug: taglist_infile is empty which means taglist_infile is equal to taglist in db."); |
288 } else { | 295 } else { |
289 console.log("Debug: taglist in file, length=" + taglist_infile.length); | 296 console.log("Debug: taglist in file, length=" + taglist_infile.length); |
290 console.log(taglist_infile); | 297 console.log(taglist_infile); |
292 console.log(taglistArray); | 299 console.log(taglistArray); |
293 | 300 |
294 // TOOD: ask user to modify/decide tags (?) | 301 // TOOD: ask user to modify/decide tags (?) |
295 // showing taglist_infile and taglistArray | 302 // showing taglist_infile and taglistArray |
296 } | 303 } |
297 | 304 */ |
305 //prevent user paste rich text which means html tag with attributes | |
306 $('[contenteditable]').on('paste', function(e) { | |
307 e.preventDefault(); | |
308 var text = ''; | |
309 if (e.clipboardData || e.originalEvent.clipboardData) { | |
310 text = (e.originalEvent || e).clipboardData.getData('text/plain'); | |
311 } else if (window.clipboardData) { | |
312 text = window.clipboardData.getData('Text'); | |
313 } | |
314 if (document.queryCommandSupported('insertText')) { | |
315 document.execCommand('insertText', false, text); | |
316 } else { | |
317 document.execCommand('paste', false, text); | |
318 } | |
319 }); | |
298 }); | 320 }); |
299 | 321 |
300 $(document).on("mouseup", '#editable-area', function (e) { | 322 $(document).on("mouseup", '#editable-area', function (e) { |
323 | |
301 $('.questionMarkClass').remove(); | 324 $('.questionMarkClass').remove(); |
302 $('.tagItemDivClass').remove(); | 325 $('.tagItemDivClass').remove(); |
303 | 326 |
304 if ( $("#editTextId").html() != "Edit text" ) return 0; | 327 //if ( $("#editTextId").html() != "Edit text" ) return 0; |
305 | 328 if(EditingMode === "editing") return 0; |
329 | |
306 //var selection = getSelected(); | 330 //var selection = getSelected(); |
307 selection = getSelected(); // selection is a global variable | 331 selection = getSelected(); // selection is a global variable |
308 | 332 |
309 range = selection.getRangeAt(0); // range is a global variable | 333 range = selection.getRangeAt(0); // range is a global variable |
310 | 334 |
311 container = document.createElement("div"); | 335 container = document.createElement("div"); |
312 container.appendChild(selection.getRangeAt(0).cloneContents()); | 336 container.appendChild(selection.getRangeAt(0).cloneContents()); |
313 | 337 |
338 let userTags = {}; | |
339 | |
340 <?php | |
341 foreach ( $taglistArray as $taglistValue ) { | |
342 echo "userTags['".$taglistValue[1]."']='".$taglistValue[2]."';\n"; | |
343 } | |
344 ?> | |
314 | 345 |
315 if(selection && (selection_plain = new String(selection).replace(/^\s+|\s+$/g,''))) { | 346 if(selection && (selection_plain = new String(selection).replace(/^\s+|\s+$/g,''))) { |
316 try{ | 347 //try{ |
317 var newdiv = document.createElement("div"); | 348 var newdiv = document.createElement("div"); |
318 //newdiv.id = "tagItemDivId"; | 349 //newdiv.id = "tagItemDivId"; |
319 //newdiv.setAttribute("class", "tagItemDivClass"); | 350 //newdiv.setAttribute("class", "tagItemDivClass"); |
320 $(newdiv).id = "tagItemDivId"; | 351 $(newdiv).id = "tagItemDivId"; |
321 $(newdiv).addClass("tagItemDivClass"); | 352 $(newdiv).addClass("tagItemDivClass"); |
322 newdiv.style.cssText = 'top:'+e.pageY+'; left:'+e.pageX+';'; | 353 |
323 //console.log(selection.getRangeAt(0).cloneContents()); | |
324 if ( container.innerHTML.indexOf( "br" ) != -1 ) { | 354 if ( container.innerHTML.indexOf( "br" ) != -1 ) { |
325 // when selected words containing tags (i.e. has 'br' in the selected string), | 355 |
356 // when selected words containing tags (i.e. has 'br' in the selected string), | |
326 // which means user want to apply Title / or tags all in once at each line | 357 // which means user want to apply Title / or tags all in once at each line |
327 // This may not be the best checking solution, since 'br' also appears between not-tagged words | 358 // This may not be the best checking solution, since 'br' also appears between not-tagged words |
328 | 359 |
329 var newselect = document.createElement("select"); | 360 var newselect = document.createElement("select"); |
330 newselect.id = "TitletagType"; | 361 newselect.id = "TitletagType"; |
331 //console.log(JSON.parse('<?php echo json_encode($taglistArray) ?>')); | 362 let strTagOpts = ''; |
332 | 363 |
333 <?php | 364 for(let key in userTags){ |
334 foreach ( $taglistArray as $taglistValue ) { | 365 |
335 echo "newselect.innerHTML += \"<option value='".$taglistValue[2]."'>".$taglistValue[1]."</option>\";\n"; | 366 strTagOpts += (`<option value='${userTags[key]}'>${key}</option>`); |
336 } | 367 } |
337 ?> | 368 |
369 newselect.innerHTML = strTagOpts; | |
370 | |
338 newdiv.appendChild(newselect); | 371 newdiv.appendChild(newselect); |
339 | 372 |
340 //matchValue = .match(); | 373 //matchValue = .match(); |
341 myRegexp = new RegExp("〈(.*?)〉", "g") | 374 myRegexp = new RegExp("〈(.*?)〉", "g") |
342 matchValue = myRegexp.exec(String(selection)); | 375 matchValue = myRegexp.exec(String(selection)); |
343 | 376 |
344 if ( matchValue != null ) { | 377 newdiv.innerHTML += `<input id='TitletagName' value='${(matchValue) ? matchValue[1] : ''}'>`; |
345 newdiv.innerHTML += "<input id=\"TitletagName\" value=\""+ matchValue[1] +"\"></br>"; | 378 newdiv.innerHTML += "<div style='text-align:right;margin:3px 0px 8px;'><button class='btn btn-sm btn-primary' onclick=\"addTagTitle(range, container)\">Add Title Tag To Each Line</button><div>"; |
346 } else { | 379 |
347 newdiv.innerHTML += "<input id=\"TitletagName\" value=\"\"></br>"; | |
348 } | |
349 newdiv.innerHTML += "<button onclick=\"addTagTitle( range, container )\">Add Title Tag To Each Line</button></br>"; | |
350 | |
351 /* | 380 /* |
352 newdiv.innerHTML += "<button onclick=\"exportTable( range, container )\">Export As A Table</button></br></br>"; | 381 newdiv.innerHTML += "<button onclick=\"exportTable( range, container )\">Export As A Table</button></br></br>"; |
353 */ | 382 */ |
354 | 383 |
355 var newselect = document.createElement("select"); | 384 var newselect = document.createElement("select"); |
356 newselect.id = "RemoveTitletagType"; | 385 newselect.id = "RemoveTitletagType"; |
357 <?php | 386 newselect.innerHTML = strTagOpts; |
358 foreach ( $taglistArray as $taglistValue ) { | |
359 echo "newselect.innerHTML += \"<option value='".$taglistValue[2]."'>".$taglistValue[1]."</option>\";\n"; | |
360 } | |
361 ?> | |
362 newdiv.appendChild(newselect); | 387 newdiv.appendChild(newselect); |
363 | 388 |
364 newdiv.innerHTML += "<input id=\"RemoveTitletagName\" value=\"\"></br>"; | 389 newdiv.innerHTML += "<input id=\"RemoveTitletagName\" value=\"\"><br>"; |
365 newdiv.innerHTML += "<button onclick=\"removeTagTitle( range, container )\">Remove</button></br>"; | 390 newdiv.innerHTML += "<div style='text-align:right;margin:3px 0px;'><button class='btn btn-sm btn-default' onclick=\"removeTagTitle( range, container )\">Remove</button></br>"; |
391 | |
392 let pageY = e.pageY, | |
393 topPosi = pageY - ( (window.innerHeight - pageY < 145 ) ? 145 : 0); | |
394 newdiv.style.cssText = 'top:'+ topPosi +'; left:'+e.pageX+';'; | |
395 | |
366 } else { | 396 } else { |
397 | |
367 // for pop up window on edit-area for tag list | 398 // for pop up window on edit-area for tag list |
368 // newdiv.innerHTML = "Tagging word: "+String(selection)+"<br>"; | 399 // newdiv.innerHTML = "Tagging word: "+String(selection)+"<br>"; |
369 var tagging_words = document.createElement("div"); | 400 var tagging_words = document.createElement("div"); |
370 $(tagging_words).addClass("bg-info"); | 401 $(tagging_words).addClass("bg-info"); |
371 $(tagging_words).text("Tagging words: " + String(selection_plain)); | 402 $(tagging_words).text("Tagging words: " + String(selection_plain)); |
374 | 405 |
375 var tagging_tags = document.createElement("div"); | 406 var tagging_tags = document.createElement("div"); |
376 $(tagging_tags).addClass("bg-white"); | 407 $(tagging_tags).addClass("bg-white"); |
377 $(tagging_tags).text("Tag as: "); | 408 $(tagging_tags).text("Tag as: "); |
378 | 409 |
379 tagging_tags.innerHTML += "<button accesskey=\"2\" onclick=\"tagwithtitle( range, '"+String(selection_plain)+"' )\">Title</button></br>"; | 410 tagging_tags.innerHTML += "<button class='btn btn-sm btn-primary' accesskey=\"2\" onclick=\"tagwithtitle( range, '"+String(selection_plain)+"' )\">Title</button>"; |
380 | 411 |
381 | 412 var tagBtns_area = document.createElement("div"); |
382 console.log(selection); | 413 $(tagBtns_area).addClass("tagBtns-area"); |
383 | 414 |
384 console.log(JSON.parse('<?php echo json_encode($taglistArray) ?>')); | 415 let tagVal, |
385 | 416 tagging_btns = {R1:[], R2:[], R3:[], R4:[]}, |
386 console.log(JSON.parse('<?php echo json_encode($topic_tag) ?>')); | 417 aryMainTaggingBtns = [], |
387 | 418 aryTaggingBtns = [], |
388 | 419 <?php echo "defaultTopicTag='".$topic_tag."';\n" ?>; |
389 <?php | 420 |
390 | 421 for(let key in userTags){ |
391 foreach ( $taglistArray as $taglistValue ) { | 422 |
392 if ($taglistValue[2] == $topic_tag) { | 423 tagVal = userTags[key]; |
393 echo "tagging_tags.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, selection, '".$taglistValue[2]."2' )\\\">".$taglistValue[1]."</button>\";\n"; | 424 |
394 echo "tagging_tags.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, selection, '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(without new line)</button>\";\n"; | 425 if (tagVal == defaultTopicTag) { |
395 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection_plain)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n"; | 426 aryMainTaggingBtns.push(`<button class='btn btn-primary' accesskey="1" onclick="tagwithOnlytag(range, selection, '${tagVal}2')">${key}</button>`); |
396 break; | 427 aryMainTaggingBtns.push(`<button class='btn btn-default' onclick="tagStringWithTag('${String(selection_plain)}', '${tagVal}')">${key}(ALL)</button>`); |
397 } | 428 aryMainTaggingBtns.push(`<button class='btn btn-default' accesskey="1" onclick="tagwithOnlytag(range, selection, '${tagVal}')">${key}(without new line)</button>`); |
429 } | |
430 else{ | |
431 aryTaggingBtns.push(`<button class='btn btn-primary' onclick="tagwithOnlytag(range, selection, '${tagVal}')">${key}</button>`); | |
432 aryTaggingBtns.push(`<button class='btn btn-default' onclick="tagStringWithTag('${String(selection)}', '${tagVal}')">${key}(ALL)</button>`); | |
433 } | |
398 } | 434 } |
399 foreach ( $taglistArray as $taglistValue ) { | 435 |
400 if ($taglistValue[2] == $topic_tag) { | 436 var remainder, btnRow; |
401 // pass | 437 for(let idx = 0, len = aryTaggingBtns.length - 1; idx < len; idx = idx + 2){ |
402 } else if ($taglistValue[2] == "post_time") { | 438 |
403 // this case could be deprecated | 439 remainder = (idx / 2 % 4) + 1; |
404 echo "tagging_tags.innerHTML += \"<button accesskey=\\\"3\\\" onclick=\\\"tagwithOnlytag( range, selection, '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."</button>\";\n"; | 440 |
405 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n"; | 441 btnRow = tagging_btns["R" + remainder]; |
406 } else if ($taglistValue[2] == "office") { | 442 btnRow.push(aryTaggingBtns[idx]); |
407 // this case could be deprecated | 443 btnRow.push(aryTaggingBtns[idx+1]); |
408 echo "tagging_tags.innerHTML += \"<button accesskey=\\\"4\\\" onclick=\\\"tagwithOnlytag( range, selection, '".$taglistValue[2]."' )\\\">".$taglistValue[1]."</button>\";\n"; | 444 } |
409 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n"; | 445 |
410 } else { | 446 var str_tagging_btns = ""; |
411 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagwithOnlytag(range, selection, '".$taglistValue[2]."')\\\">".$taglistValue[1]."</button>\";\n"; | 447 |
412 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n"; | 448 if(aryMainTaggingBtns.length > 0){ |
413 | 449 str_tagging_btns = "<tr><td>" |
414 /* testing... backup the original one | 450 + aryMainTaggingBtns[0] + "</td><td>" |
415 | 451 + aryMainTaggingBtns[1] + "</td><td colspan='2'>" |
416 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."</button>\";\n"; | 452 + aryMainTaggingBtns[2] + "</td></tr>"; |
417 echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n"; | 453 } |
418 */ | 454 |
419 | 455 for(let idx = 1, len = 4; idx <= len; idx++){ |
420 } | 456 |
421 } | 457 btnRow = tagging_btns["R" + idx]; |
422 ?> | 458 |
423 | 459 if(btnRow.length > 0){ |
424 newdiv.appendChild(tagging_tags); | 460 |
425 | 461 str_tagging_btns += ("<tr><td>" + btnRow.join("</td><td>") + "</td></tr>"); |
426 | 462 } |
427 // add selected words to generator regex | 463 } |
428 // remove this feature... | 464 |
429 // genRegexBySelection(newdiv, selection); // append button to newdiv and handle the selection words | 465 str_tagging_btns = "<table>" + str_tagging_btns + "</table>"; |
466 | |
467 tagBtns_area.innerHTML = str_tagging_btns; | |
468 | |
469 newdiv.appendChild(tagging_tags); | |
470 newdiv.appendChild(tagBtns_area); | |
471 | |
472 let tagCnt = aryTaggingBtns.length / 2, | |
473 heightLimit = 109 + ( (tagCnt >= 4) ? 4 : ( tagCnt % 4 ) ) * 32, | |
474 pageY = e.pageY, | |
475 topPosi = pageY - ( (window.innerHeight - pageY < heightLimit ) ? heightLimit : 0); | |
476 | |
477 newdiv.style.cssText = 'top:'+ topPosi +'; left:'+e.pageX+';max-height:280px;'; | |
430 | 478 |
431 } | 479 } |
432 | 480 |
433 //$('#tagItemDivId').addClass(); // tagItemDivId is newdiv's id | 481 //$('#tagItemDivId').addClass(); // tagItemDivId is newdiv's id |
434 $('body').append(newdiv); | 482 $('body').append(newdiv); |
435 $('#TitletagType').val(lastAddTag); | 483 $('#TitletagType').val(lastAddTag); |
436 | 484 |
437 // selected some words, so hide popping up remove-tag-window | 485 // selected some words, so hide popping up remove-tag-window |
438 pop_remove_tag_window = false; // questionMarkID | 486 pop_remove_tag_window = false; // questionMarkID |
439 } | 487 // } |
440 catch(err){ | 488 // catch(err){ |
441 pop_remove_tag_window = true; // questionMarkID | 489 // pop_remove_tag_window = true; // questionMarkID |
442 | 490 // |
443 } | 491 // } |
444 } else { | 492 } else { |
445 // without selecting any word, so pop up remove-tag-window | 493 // without selecting any word, so pop up remove-tag-window |
446 pop_remove_tag_window = true; | 494 pop_remove_tag_window = true; |
447 } | 495 } |
448 | 496 |
454 //MsgBox("enter function"); | 502 //MsgBox("enter function"); |
455 var form = document.createElement("form"); | 503 var form = document.createElement("form"); |
456 form.setAttribute("method", "post"); | 504 form.setAttribute("method", "post"); |
457 form.setAttribute("action", "./ExportTable"); | 505 form.setAttribute("action", "./ExportTable"); |
458 form.setAttribute("target", "_blank"); | 506 form.setAttribute("target", "_blank"); |
459 | 507 |
460 var hiddenField = document.createElement("input"); | 508 var hiddenField = document.createElement("input"); |
461 hiddenField.setAttribute("name", "func"); | 509 hiddenField.setAttribute("name", "func"); |
462 hiddenField.setAttribute("value", "exportFromExtractionInterface"); | 510 hiddenField.setAttribute("value", "exportFromExtractionInterface"); |
463 form.appendChild(hiddenField); | 511 form.appendChild(hiddenField); |
464 | 512 |
465 var hiddenField = document.createElement("input"); | 513 var hiddenField = document.createElement("input"); |
466 hiddenField.setAttribute("name", "content"); | 514 hiddenField.setAttribute("name", "content"); |
467 hiddenField.setAttribute("value", container.innerHTML); | 515 hiddenField.setAttribute("value", container.innerHTML); |
468 form.appendChild(hiddenField); | 516 form.appendChild(hiddenField); |
469 | 517 |
470 var hiddenField = document.createElement("input"); | 518 var hiddenField = document.createElement("input"); |
471 hiddenField.setAttribute("name", "sectionid"); | 519 hiddenField.setAttribute("name", "sectionid"); |
472 hiddenField.setAttribute("value", "<?php echo $section_id; ?>"); | 520 hiddenField.setAttribute("value", "<?php echo $section_id; ?>"); |
473 form.appendChild(hiddenField); | 521 form.appendChild(hiddenField); |
474 | 522 |
475 var hiddenField2 = document.createElement("input"); | 523 var hiddenField2 = document.createElement("input"); |
476 hiddenField2.setAttribute("name", "topic"); | 524 hiddenField2.setAttribute("name", "topic"); |
477 hiddenField2.setAttribute("value", topic_id); | 525 hiddenField2.setAttribute("value", topic_id); |
478 form.appendChild(hiddenField2); | 526 form.appendChild(hiddenField2); |
479 | 527 |
480 var info = JSON.parse( '<?php echo json_encode($info) ?>'); | 528 var info = JSON.parse( '<?php echo json_encode($info) ?>'); |
481 var book_meta = JSON.parse( '<?php echo json_encode($book_meta) ?>'); | 529 var book_meta = JSON.parse( '<?php echo json_encode($book_meta) ?>'); |
482 | 530 |
483 if (info) { | 531 if (info) { |
484 var hiddenField = document.createElement("input"); | 532 var hiddenField = document.createElement("input"); |
485 hiddenField.setAttribute("name", "bookId"); | 533 hiddenField.setAttribute("name", "bookId"); |
486 hiddenField.setAttribute("value", info['book_id']); | 534 hiddenField.setAttribute("value", info['book_id']); |
487 form.appendChild(hiddenField); | 535 form.appendChild(hiddenField); |
488 | 536 |
489 var hiddenField = document.createElement("input"); | 537 var hiddenField = document.createElement("input"); |
490 hiddenField.setAttribute("name", "bookName"); | 538 hiddenField.setAttribute("name", "bookName"); |
491 hiddenField.setAttribute("value", info['book_name']); | 539 hiddenField.setAttribute("value", info['book_name']); |
492 form.appendChild(hiddenField); | 540 form.appendChild(hiddenField); |
493 | 541 |
494 var hiddenField = document.createElement("input"); | 542 var hiddenField = document.createElement("input"); |
495 hiddenField.setAttribute("name", "sectionName"); | 543 hiddenField.setAttribute("name", "sectionName"); |
496 hiddenField.setAttribute("value", info['section_name']); | 544 hiddenField.setAttribute("value", info['section_name']); |
497 form.appendChild(hiddenField); | 545 form.appendChild(hiddenField); |
498 | 546 |
499 }; | 547 }; |
504 document.body.removeChild(form); | 552 document.body.removeChild(form); |
505 } else { | 553 } else { |
506 document.body.appendChild(form); | 554 document.body.appendChild(form); |
507 form.submit(); | 555 form.submit(); |
508 document.body.removeChild(form); | 556 document.body.removeChild(form); |
509 //form.submit(); // works under IE and Chrome, but not FF | 557 //form.submit(); // works under IE and Chrome, but not FF |
510 } | 558 } |
559 } | |
560 | |
561 var exportMode = "all"; | |
562 | |
563 function onExportModeChanged(ele){ | |
564 exportMode = ele.value | |
565 } | |
566 | |
567 function startExport(topic_id){ | |
568 | |
569 switch(exportMode){ | |
570 case "all" : | |
571 exportAll(topic_id); | |
572 break; | |
573 case "pages" : | |
574 exportPage(topic_id); | |
575 break; | |
576 } | |
511 } | 577 } |
512 | 578 |
513 function exportPage(topic_id) { | 579 function exportPage(topic_id) { |
514 var startPage = $('#exportPageStart').val(); | 580 var startPage = $('#exportPageStart').val(); |
515 var endPage = $('#exportPageEnd').val(); | 581 var endPage = $('#exportPageEnd').val(); |
516 | 582 |
517 var el = document.getElementById("editable-area"); | 583 var el = document.getElementById("editable-area"); |
518 var str="" + el.innerHTML; | 584 var str="" + el.innerHTML; |
519 | 585 |
520 var regexText="【<a([^<>]*?)>"+startPage+"</a>】(.*?)【<a([^<>]*?)>"+endPage+"</a>】"; | 586 var regexText="【<a([^<>]*?)>"+startPage+"</a>】(.*?)【<a([^<>]*?)>"+endPage+"</a>】"; |
521 | 587 |
522 var form = document.createElement("form"); | 588 var form = document.createElement("form"); |
523 form.setAttribute("method", "post"); | 589 form.setAttribute("method", "post"); |
524 form.setAttribute("action", "./ExportTable"); | 590 form.setAttribute("action", "./ExportTable"); |
525 form.setAttribute("target", "_blank"); | 591 form.setAttribute("target", "_blank"); |
526 | 592 |
527 var hiddenField = document.createElement("input"); | 593 var hiddenField = document.createElement("input"); |
528 hiddenField.setAttribute("name", "func"); | 594 hiddenField.setAttribute("name", "func"); |
529 hiddenField.setAttribute("value", "exportFromExtractionInterface"); | 595 hiddenField.setAttribute("value", "exportFromExtractionInterface"); |
530 form.appendChild(hiddenField); | 596 form.appendChild(hiddenField); |
531 | 597 |
532 var hiddenField = document.createElement("input"); | 598 var hiddenField = document.createElement("input"); |
533 hiddenField.setAttribute("name", "content"); | 599 hiddenField.setAttribute("name", "content"); |
534 hiddenField.setAttribute("value", str.match(new RegExp(regexText, "g"))); | 600 hiddenField.setAttribute("value", str.match(new RegExp(regexText, "g"))); |
535 form.appendChild(hiddenField); | 601 form.appendChild(hiddenField); |
536 | 602 |
537 var hiddenField = document.createElement("input"); | 603 var hiddenField = document.createElement("input"); |
538 hiddenField.setAttribute("name", "topic"); | 604 hiddenField.setAttribute("name", "topic"); |
539 hiddenField.setAttribute("value", topic_id); | 605 hiddenField.setAttribute("value", topic_id); |
540 form.appendChild(hiddenField); | 606 form.appendChild(hiddenField); |
541 | 607 |
542 _postForContineTagging(form); | 608 _postForContineTagging(form); |
543 | 609 |
544 | 610 |
545 /* | 611 /* |
546 var section_id = JSON.parse('<?php echo json_encode($section_id) ?>'); | 612 var section_id = JSON.parse('<?php echo json_encode($section_id) ?>'); |
547 console.log("section_id: "+section_id+", topic_id: "+topic_id); | 613 |
548 | 614 var hiddenField = document.createElement("input"); |
549 var hiddenField = document.createElement("input"); | |
550 hiddenField.setAttribute("name", "sectionId"); | 615 hiddenField.setAttribute("name", "sectionId"); |
551 hiddenField.setAttribute("value", section_id); | 616 hiddenField.setAttribute("value", section_id); |
552 form.appendChild(hiddenField); | 617 form.appendChild(hiddenField); |
553 | 618 |
554 var info = JSON.parse( '<?php echo json_encode($info) ?>'); | 619 var info = JSON.parse( '<?php echo json_encode($info) ?>'); |
555 | 620 |
556 if (info) { | 621 if (info) { |
557 var hiddenField = document.createElement("input"); | 622 var hiddenField = document.createElement("input"); |
558 hiddenField.setAttribute("name", "bookId"); | 623 hiddenField.setAttribute("name", "bookId"); |
559 hiddenField.setAttribute("value", info['book_id']); | 624 hiddenField.setAttribute("value", info['book_id']); |
560 form.appendChild(hiddenField); | 625 form.appendChild(hiddenField); |
561 | 626 |
562 var hiddenField = document.createElement("input"); | 627 var hiddenField = document.createElement("input"); |
563 hiddenField.setAttribute("name", "bookName"); | 628 hiddenField.setAttribute("name", "bookName"); |
564 hiddenField.setAttribute("value", info['book_name']); | 629 hiddenField.setAttribute("value", info['book_name']); |
565 form.appendChild(hiddenField); | 630 form.appendChild(hiddenField); |
566 | 631 |
567 var hiddenField = document.createElement("input"); | 632 var hiddenField = document.createElement("input"); |
568 hiddenField.setAttribute("name", "sectionName"); | 633 hiddenField.setAttribute("name", "sectionName"); |
569 hiddenField.setAttribute("value", info['section_name']); | 634 hiddenField.setAttribute("value", info['section_name']); |
570 form.appendChild(hiddenField); | 635 form.appendChild(hiddenField); |
571 | 636 |
572 }; | 637 }; |
574 | 639 |
575 if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1) { | 640 if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1) { |
576 document.body.appendChild(form); | 641 document.body.appendChild(form); |
577 form.submit(); | 642 form.submit(); |
578 } else { | 643 } else { |
579 form.submit(); // works under IE and Chrome, but not FF | 644 form.submit(); // works under IE and Chrome, but not FF |
580 } | 645 } |
581 */ | 646 */ |
582 } | 647 } |
583 | 648 |
584 function exportAll(topic_id) { | 649 function exportAll(topic_id) { |
586 var str= "" + el.innerHTML; | 651 var str= "" + el.innerHTML; |
587 var form = document.createElement("form"); | 652 var form = document.createElement("form"); |
588 form.setAttribute("method", "post"); | 653 form.setAttribute("method", "post"); |
589 form.setAttribute("action", "./ExportTable");//+section_id); // hand to controller | 654 form.setAttribute("action", "./ExportTable");//+section_id); // hand to controller |
590 form.setAttribute("target", "_blank"); | 655 form.setAttribute("target", "_blank"); |
591 | 656 |
592 var hiddenField = document.createElement("input"); | 657 var hiddenField = document.createElement("input"); |
593 hiddenField.setAttribute("name", "func"); | 658 hiddenField.setAttribute("name", "func"); |
594 hiddenField.setAttribute("value", "exportFromExtractionInterface"); | 659 hiddenField.setAttribute("value", "exportFromExtractionInterface"); |
595 form.appendChild(hiddenField); | 660 form.appendChild(hiddenField); |
596 | 661 |
597 | 662 |
598 | 663 |
599 var hiddenField = document.createElement("input"); | 664 var hiddenField = document.createElement("input"); |
600 hiddenField.setAttribute("name", "content"); | 665 hiddenField.setAttribute("name", "content"); |
601 hiddenField.setAttribute("value", str); | 666 hiddenField.setAttribute("value", str); |
602 form.appendChild(hiddenField); | 667 form.appendChild(hiddenField); |
603 | 668 |
604 var hiddenField = document.createElement("input"); | 669 var hiddenField = document.createElement("input"); |
605 hiddenField.setAttribute("name", "topic"); | 670 hiddenField.setAttribute("name", "topic"); |
606 hiddenField.setAttribute("value", topic_id); | 671 hiddenField.setAttribute("value", topic_id); |
607 form.appendChild(hiddenField); | 672 form.appendChild(hiddenField); |
608 | 673 |
609 _postForContineTagging(form); | 674 _postForContineTagging(form); |
610 | 675 |
611 } | 676 } |
612 | 677 |
613 | |
614 function tagTestX(range, selection, tag) { | 678 function tagTestX(range, selection, tag) { |
615 console.log("selection string: "); | |
616 console.log(String(selection)); | |
617 | 679 |
618 var stringSelection = String(selection); | 680 var stringSelection = String(selection); |
619 | 681 |
620 saveUndoText(); | 682 saveUndoText(); |
621 var topic_tag = JSON.parse('<?php echo json_encode($topic_tag) ?>'); | 683 var topic_tag = JSON.parse('<?php echo json_encode($topic_tag) ?>'); |
625 // stringSelection here only contains plain text (string) without the tagging structure | 687 // stringSelection here only contains plain text (string) without the tagging structure |
626 // how to use the existing tagging structure | 688 // how to use the existing tagging structure |
627 | 689 |
628 // --- | 690 // --- |
629 var documentFragment = range.extractContents(); | 691 var documentFragment = range.extractContents(); |
630 | 692 |
631 | 693 |
632 var tmpStringSelection = "" | 694 var tmpStringSelection = "" |
633 var childNodes = documentFragment.childNodes | 695 var childNodes = documentFragment.childNodes |
634 for (var i = 0; i < childNodes.length; i++){ | 696 for (var i = 0; i < childNodes.length; i++){ |
635 | 697 |
636 if (childNodes[i].outerHTML == undefined) { | 698 if (childNodes[i].outerHTML == undefined) { |
637 | 699 |
638 tmpStringSelection += childNodes[i].textContent | 700 tmpStringSelection += childNodes[i].textContent |
639 } else { | 701 } else { |
640 | 702 |
641 tmpStringSelection += childNodes[i].outerHTML | 703 tmpStringSelection += childNodes[i].outerHTML |
642 } | 704 } |
643 | 705 |
644 } | 706 } |
645 | 707 |
646 stringSelection = tmpStringSelection | 708 stringSelection = tmpStringSelection; |
647 | 709 |
648 range.deleteContents(); | 710 range.deleteContents(); |
649 | 711 |
650 if ( tag==topic_tag2) { | 712 if ( tag==topic_tag2) { |
651 var newdiv = document.createElement(topic_tag); | 713 var newdiv = document.createElement(topic_tag); |
661 } | 723 } |
662 | 724 |
663 | 725 |
664 $('.tagItemDivClass').remove(); | 726 $('.tagItemDivClass').remove(); |
665 | 727 |
666 | 728 return; |
667 return | 729 |
668 | 730 // TODO if no fragment... bug |
669 | 731 |
670 // --- | |
671 | |
672 console.log("the anchorNode: "); | |
673 console.log(selection.anchorNode); | |
674 | |
675 console.log("the anchorNode's nextSibling"); | |
676 console.log(next); | |
677 | |
678 | |
679 // TODO if no fragment... bug | |
680 | |
681 if ( typeof selection !== 'string' ) { | 732 if ( typeof selection !== 'string' ) { |
682 var next = selection.anchorNode.nextSibling; | 733 var next = selection.anchorNode.nextSibling; |
683 | 734 |
684 | |
685 | |
686 // TODO fragment at the beginning of selection: anchorNode | 735 // TODO fragment at the beginning of selection: anchorNode |
687 var tmpStringSelection = "" | 736 var tmpStringSelection = "" |
688 | 737 |
689 var startInx = selection.anchorOffset | 738 var startInx = selection.anchorOffset; |
690 var endSelectionInx = startInx + stringSelection.length | 739 var endSelectionInx = startInx + stringSelection.length; |
691 var endInx = selection.anchorNode.length | 740 var endInx = selection.anchorNode.length; |
692 console.log("startInx=" + startInx + " endInx= " + endInx + "; endSelectionInx= " + endSelectionInx) | 741 |
693 | 742 var anchorText = selection.anchorNode.textContent; |
694 var anchorText = selection.anchorNode.textContent | |
695 | |
696 | 743 |
697 /* | 744 /* |
698 console.log("anchorNode...") | 745 if (selection.anchorNode.nodeType == 3 && next.nodeName != "BR" && next.nodeName != "br") { |
699 if (selection.anchorNode.nodeType == 3 && next.nodeName != "BR" && next.nodeName != "br") { | 746 // if (next != null && selection.anchorNode.nodeType == 3 && next.nodeName != "BR" && next.nodeName != "br") { |
700 // if (next != null && selection.anchorNode.nodeType == 3 && next.nodeName != "BR" && next.nodeName != "br") { | |
701 // here the anchor node is text | 747 // here the anchor node is text |
702 | 748 |
703 //tmpStringSelection += anchorText.substring(selection.anchorOffset, selection.anchorNode.length); | 749 //tmpStringSelection += anchorText.substring(selection.anchorOffset, selection.anchorNode.length); |
704 tmpStringSelection += anchorText.substring(startInx, endSelectionInx); | 750 tmpStringSelection += anchorText.substring(startInx, endSelectionInx); |
705 | 751 |
706 console.log("append anchorText to tmpStringSelection: " + tmpStringSelection) | |
707 | |
708 endInx += endSelectionInx - startInx; | 752 endInx += endSelectionInx - startInx; |
709 | 753 |
710 //endInx += (selection.anchorNode.length - selection.anchorOffset); | 754 //endInx += (selection.anchorNode.length - selection.anchorOffset); |
711 | 755 |
712 | 756 |
713 } | 757 } |
714 */ | 758 */ |
715 | 759 |
716 // TODO when anchorNode is not text, but a node | 760 // TODO when anchorNode is not text, but a node |
717 | 761 |
718 | 762 |
719 /* | 763 /* |
720 if (next != null) { | 764 if (next != null) { |
721 | 765 |
722 if (selection.anchorNode.nodeType == 3 && next.nodeName != "BR" && next.nodeName != "br") { | 766 if (selection.anchorNode.nodeType == 3 && next.nodeName != "BR" && next.nodeName != "br") { |
723 var anchorText = selection.anchorNode.textContent | 767 var anchorText = selection.anchorNode.textContent |
724 // never goes here? | 768 // never goes here? |
725 tmpStringSelection += anchorText.substring(selection.anchorOffset, selection.anchorNode.length); | 769 tmpStringSelection += anchorText.substring(selection.anchorOffset, selection.anchorNode.length); |
726 | 770 |
727 console.log("append anchorText to tmpStringSelection: " + tmpStringSelection) | 771 |
728 | 772 } |
729 | |
730 } | |
731 } | 773 } |
732 */ | 774 */ |
733 | 775 |
734 // TODO parsing stringSelection object in string, with the tagging strucutre | 776 // TODO parsing stringSelection object in string, with the tagging strucutre |
735 | 777 |
736 var checkExtentNode = true | 778 var checkExtentNode = true |
737 | 779 |
738 while(next != null && next != undefined && next.nodeName != "BR" && next.nodeName != "br" ) { | 780 while(next != null && next != undefined && next.nodeName != "BR" && next.nodeName != "br" ) { |
739 | |
740 /* | |
741 if (endInx >= endSelectionInx) { | |
742 console.log("startInx=" + startInx + " endInx= " + endInx + "; endSelectionInx= " + endSelectionInx) | |
743 | |
744 console.log("debug: end of traverse. next=") | |
745 console.log(next) | |
746 | |
747 break; | |
748 } | |
749 */ | |
750 | 781 |
751 startInx = endInx | 782 startInx = endInx |
752 | 783 |
753 if (next.nodeType == 3) { // text case | 784 if (next.nodeType == 3) { // text case |
754 console.log("text case.") | 785 |
755 | 786 |
756 endInx += next.textContent.length | 787 endInx += next.textContent.length |
757 | 788 |
758 if (endInx > endSelectionInx) { | 789 if (endInx > endSelectionInx) { |
759 | 790 |
760 /* | 791 /* |
761 tmpStringSelection += next.textContent.substring(0, endSelectionInx-startInx) | 792 tmpStringSelection += next.textContent.substring(0, endSelectionInx-startInx) |
762 | 793 |
763 console.log("startInx=" + startInx + " endInx= " + endInx + "; endSelectionInx= " + endSelectionInx) | |
764 console.log("appened next.textContent.substring tmpStringSelection (text case): " + tmpStringSelection) | |
765 */ | 794 */ |
766 | 795 |
767 //checkExtentNode = false | 796 //checkExtentNode = false |
768 | 797 |
769 //break; | 798 //break; |
770 } else { | 799 } else { |
771 | 800 |
772 | |
773 tmpStringSelection += next.textContent; | 801 tmpStringSelection += next.textContent; |
774 console.log("appened tmpStringSelection (text case): " + tmpStringSelection) | 802 |
775 | |
776 | |
777 } | 803 } |
778 | 804 |
779 | 805 |
780 | 806 |
781 } else if (next.nodeType == 1) { // node case | 807 } else if (next.nodeType == 1) { // node case |
782 console.log("node case") | 808 |
783 | 809 endInx += next.innerHTML.length |
784 endInx += next.innerHTML.length | |
785 | 810 |
786 if (endInx > endSelectionInx) { | 811 if (endInx > endSelectionInx) { |
787 | 812 |
788 // TODO do something about tmpStringSelection here? | 813 // TODO do something about tmpStringSelection here? |
789 | |
790 console.log("startInx=" + startInx + " endInx= " + endInx + "; endSelectionInx= " + endSelectionInx) | |
791 | |
792 | 814 |
793 //checkExtentNode = false | 815 //checkExtentNode = false |
794 | 816 |
795 //break; | 817 //break; |
796 } else { | 818 } else { |
797 | 819 |
798 | 820 |
799 tmpStringSelection += next.outerHTML; | 821 tmpStringSelection += next.outerHTML; |
800 console.log("appened tmpStringSelection (node case): " + tmpStringSelection) | 822 |
801 // endInx += next.outerHTML.length | 823 // endInx += next.outerHTML.length |
802 } | 824 } |
803 | 825 |
804 | 826 |
805 } else { | 827 } else { |
806 console.log("[debug] case: nodeType=" + next.nodeType) | 828 //console.log("[debug] case: nodeType=" + next.nodeType) |
807 } | 829 } |
808 | 830 |
809 | 831 |
810 /* | 832 /* |
811 | 833 |
812 } else if (next.innerHTML != undefined) { | 834 } else if (next.innerHTML != undefined) { |
813 | 835 |
814 | 836 |
815 endInx += next.innerHTML.length; | 837 endInx += next.innerHTML.length; |
816 if (endInx >= endSelectionInx) { | 838 if (endInx >= endSelectionInx) { |
817 break; | 839 break; |
818 } | 840 } |
819 | 841 |
820 | 842 |
821 } else { | 843 } else { |
822 break | 844 break |
823 } | 845 } |
824 console.log("startInx= " + startInx + "; endInx= " + endInx) | 846 |
825 if (next.outerHTML != undefined) { | 847 if (next.outerHTML != undefined) { |
826 tmpStringSelection += next.outerHTML; | 848 tmpStringSelection += next.outerHTML; |
827 console.log("appened tmpStringSelection: " + tmpStringSelection) | 849 } |
828 | |
829 } | |
830 */ | 850 */ |
831 | 851 |
832 console.log("next: "); | |
833 console.log(next); | |
834 next = next.nextSibling; | 852 next = next.nextSibling; |
835 | 853 |
836 } | 854 } |
837 | 855 |
838 | 856 |
839 // TODO | 857 // TODO |
840 // fragment at the end of selection: extentNode | 858 // fragment at the end of selection: extentNode |
841 | 859 |
842 console.log("extentNode...") | |
843 console.log("startInx=" + startInx + " endInx= " + endInx + "; endSelectionInx= " + endSelectionInx) | |
844 | |
845 var extentNode = selection.extentNode | 860 var extentNode = selection.extentNode |
846 | 861 |
847 | 862 |
848 if (checkExtentNode) { | 863 if (checkExtentNode) { |
849 | 864 |
850 if (endInx < endSelectionInx && startInx < endSelectionInx ) { | 865 if (endInx < endSelectionInx && startInx < endSelectionInx ) { |
851 tmpStringSelection += anchorText.substring(endInx, endSelectionInx); | 866 tmpStringSelection += anchorText.substring(endInx, endSelectionInx); |
852 console.log("append anchorText.substring(endInx, endSelectionInx) to tmpStringSelection: " + tmpStringSelection) | 867 |
853 | |
854 } else if (extentNode != null) { | 868 } else if (extentNode != null) { |
855 var extentText = extentNode.textContent | 869 var extentText = extentNode.textContent |
856 | 870 |
857 tmpStringSelection += extentText.substring(startInx, endSelectionInx); | 871 tmpStringSelection += extentText.substring(startInx, endSelectionInx); |
858 | 872 |
859 console.log("append extentNode to tmpStringSelection: " + tmpStringSelection) | |
860 } else { | 873 } else { |
861 tmpStringSelection += anchorText.substring(startInx, endSelectionInx); | 874 tmpStringSelection += anchorText.substring(startInx, endSelectionInx); |
862 console.log("append anchorText.substring(startInx, endSelectionInx) to tmpStringSelection: " + tmpStringSelection) | |
863 } | 875 } |
864 } | 876 } |
865 | 877 |
866 /* | 878 /* |
867 if (extentNode != null) { | 879 if (extentNode != null) { |
868 if (extentNode.nodeType == 3 ) { // text case | 880 if (extentNode.nodeType == 3 ) { // text case |
869 var extentText = extentNode.textContent | 881 var extentText = extentNode.textContent |
870 | 882 |
871 if (endInx >= endSelectionInx) { | 883 if (endInx >= endSelectionInx) { |
872 | 884 |
873 console.log("tmpStringSelection: " + tmpStringSelection) | |
874 | |
875 console.log(extentText.substring(startInx, selection.extentOffset)) | |
876 tmpStringSelection += extentText.substring(startInx, endSelectionInx); | 885 tmpStringSelection += extentText.substring(startInx, endSelectionInx); |
877 | |
878 console.log("append extentNode to tmpStringSelection: " + tmpStringSelection) | |
879 | 886 |
880 } else { | 887 } else { |
881 tmpStringSelection += anchorText.substring(endInx, endSelectionInx); | 888 tmpStringSelection += anchorText.substring(endInx, endSelectionInx); |
882 | 889 |
883 } | 890 } |
884 } | 891 } |
885 } | 892 } |
886 */ | 893 */ |
887 | 894 |
888 console.log("tmpStringSelection:") | |
889 console.log(tmpStringSelection) | |
890 stringSelection = tmpStringSelection; | 895 stringSelection = tmpStringSelection; |
891 | 896 |
892 } | 897 } |
893 | 898 |
894 range.deleteContents(); | 899 range.deleteContents(); |
895 | 900 |
896 if ( tag==topic_tag2) { | 901 if ( tag==topic_tag2) { |
911 | 916 |
912 | 917 |
913 } | 918 } |
914 | 919 |
915 function tagwithOnlytag( range, selection, tag ) { | 920 function tagwithOnlytag( range, selection, tag ) { |
916 | 921 |
917 $('#loading').show(); | 922 $('#loading').show(); |
918 | 923 |
919 saveUndoText(); | 924 saveUndoText(); |
920 var topic_tag = JSON.parse('<?php echo json_encode($topic_tag) ?>'); | 925 var topic_tag = JSON.parse('<?php echo json_encode($topic_tag) ?>'); |
921 var topic_tag2 = topic_tag+"2"; | 926 var topic_tag2 = topic_tag+"2"; |
922 | 927 |
923 var documentFragment = range.extractContents(); | 928 var documentFragment = range.extractContents(); |
924 | |
925 console.log("topic_tag: "+ topic_tag + ", topic_tag2: " + topic_tag2); | |
926 | 929 |
927 var stringSelection = "" | 930 var stringSelection = "" |
928 var childNodes = documentFragment.childNodes | 931 var childNodes = documentFragment.childNodes |
929 for (var i = 0; i < childNodes.length; i++){ | 932 for (var i = 0; i < childNodes.length; i++){ |
930 if (childNodes[i].outerHTML == undefined) { | 933 if (childNodes[i].outerHTML == undefined) { |
931 stringSelection += childNodes[i].textContent | 934 stringSelection += childNodes[i].textContent |
932 } else { | 935 } else { |
933 stringSelection += childNodes[i].outerHTML | 936 stringSelection += childNodes[i].outerHTML |
934 } | 937 } |
935 | 938 |
936 } | 939 } |
937 | |
938 | |
939 //console.log("stringSelection: " + stringSelection); | |
940 | |
941 | 940 |
942 range.deleteContents(); | 941 range.deleteContents(); |
943 | 942 |
944 if ( tag==topic_tag2) { | 943 if ( tag==topic_tag2) { |
945 var newdiv = document.createElement(topic_tag); | 944 var newdiv = document.createElement(topic_tag); |
987 | 986 |
988 function replaceSmartRegex() { | 987 function replaceSmartRegex() { |
989 saveUndoText(); | 988 saveUndoText(); |
990 var startPage = $('#regexPageStart2').val(); | 989 var startPage = $('#regexPageStart2').val(); |
991 var endPage = $('#regexPageEnd2').val(); | 990 var endPage = $('#regexPageEnd2').val(); |
992 | 991 |
993 var el = document.getElementById("editable-area"); | 992 var el = document.getElementById("editable-area"); |
994 var regexText=document.getElementById("regexText").value; | 993 var regexText=document.getElementById("regexText").value; |
995 | 994 |
996 <?php | 995 <?php |
997 foreach ( $wordlistArray as $wordlistValue ) { | 996 foreach ( $wordlistArray as $wordlistValue ) { |
998 echo "\tvar regexText1=\"List ".$wordlistValue[1]."\";\n"; | 997 echo "\tvar regexText1=\"List ".$wordlistValue[1]."\";\n"; |
999 echo "\tregexText1 = preg_quote(regexText1);\n"; | 998 echo "\tregexText1 = preg_quote(regexText1);\n"; |
1000 echo "\tvar replaceText1=\"".$wordlistValue[2]."\";\n"; | 999 echo "\tvar replaceText1=\"".$wordlistValue[2]."\";\n"; |
1001 echo "\tregexText = regexText.replace(new RegExp(regexText1, \"g\"), replaceText1);\n\n"; | 1000 echo "\tregexText = regexText.replace(new RegExp(regexText1, \"g\"), replaceText1);\n\n"; |
1002 } | 1001 } |
1003 ?> | 1002 ?> |
1004 | 1003 |
1005 var replaceText=document.getElementById("replaceText").value; | 1004 var replaceText=document.getElementById("replaceText").value; |
1006 var str="" + el.innerHTML; | 1005 var str="" + el.innerHTML; |
1007 | 1006 var objReg1 = new RegExp(regexText, "g"); |
1007 var occurrences, info; | |
1008 if ( startPage == "" ) { | 1008 if ( startPage == "" ) { |
1009 alert( "Tagged "+str.match(new RegExp(regexText, "g")).length+" entities!" ); | 1009 |
1010 el.innerHTML = str.replace(new RegExp(regexText, "g"), replaceText); | 1010 occurrences = (str.match(objReg1)||[]).length; |
1011 | |
1012 if(occurrences > 0){ | |
1013 info = "Replaced "+ occurrences +" entities."; | |
1014 el.innerHTML = str.replace(objReg1, replaceText); | |
1015 } | |
1011 } else { | 1016 } else { |
1012 var regexText2="【<a([^<>]*?)>"+startPage+"</a>】(.*?)【<a([^<>]*?)>"+endPage+"</a>】"; | 1017 var regexText2="【<a([^<>]*?)>"+startPage+"</a>】(.*?)【<a([^<>]*?)>"+endPage+"</a>】"; |
1013 var partString = ""+str.match(new RegExp(regexText2, "g")); | 1018 var objReg2 = new RegExp(regexText2, "g"); |
1014 alert(partString); | 1019 var partString = "" + str.match(objReg2); |
1015 | 1020 //alert(partString); |
1016 alert( "Tagged "+partString.match(new RegExp(regexText, "g")).length+" entities!" ); | 1021 |
1017 var resultString = partString.replace(new RegExp(regexText, "g"), replaceText); | 1022 occurrences = (partString.match(objReg1)||[]).length; |
1018 | 1023 |
1019 str="" + el.innerHTML; | 1024 if(occurrences > 0){ |
1020 el.innerHTML = str.replace(new RegExp(regexText2, "g"), resultString); | 1025 info = "Replaced "+ occurrences +" entities."; |
1021 } | 1026 var resultString = partString.replace(objReg1, replaceText); |
1027 | |
1028 str = "" + el.innerHTML; | |
1029 el.innerHTML = str.replace(objReg2, resultString); | |
1030 } | |
1031 } | |
1032 | |
1033 if(occurrences == 0) info = "Found 0 occurrence."; | |
1034 | |
1035 $.bootstrapGrowl(info); | |
1022 //document.styleSheets[0].addRule("tag001", "color:green;") | 1036 //document.styleSheets[0].addRule("tag001", "color:green;") |
1023 } | 1037 } |
1024 | 1038 |
1025 function saveTextToLGService() { | 1039 function saveTextToLGService() { |
1026 // clean editable-area | 1040 // clean editable-area |
1027 $('.questionMarkClass').remove(); | 1041 $('.questionMarkClass').remove(); |
1028 $('.tagItemDivClass').remove(); | 1042 $('.tagItemDivClass').remove(); |
1029 | 1043 |
1030 // ------------- | 1044 // ------------- |
1031 var info = JSON.parse('<?php echo json_encode($info) ?>'); | 1045 var info = JSON.parse('<?php echo json_encode($info) ?>'); |
1032 var topic_id = JSON.parse('<?php echo json_encode($default_topic_id) ?>'); | 1046 var topic_id = JSON.parse('<?php echo json_encode($default_topic_id) ?>'); |
1033 | 1047 |
1034 // if this is a new branch, ask for label | 1048 // if this is a new branch, ask for label |
1040 var mm = today.getMonth()+1; //January is 0! | 1054 var mm = today.getMonth()+1; //January is 0! |
1041 var yyyy = today.getFullYear(); | 1055 var yyyy = today.getFullYear(); |
1042 | 1056 |
1043 if(dd<10) { | 1057 if(dd<10) { |
1044 dd='0'+dd | 1058 dd='0'+dd |
1045 } | 1059 } |
1046 if(mm<10) { | 1060 if(mm<10) { |
1047 mm='0'+mm | 1061 mm='0'+mm |
1048 } | 1062 } |
1049 today = dd+'.'+mm+'.'+yyyy; | 1063 today = dd+'.'+mm+'.'+yyyy; |
1050 var book_name = info['book_name']; | 1064 var book_name = info['book_name']; |
1051 var section_name = info['section_name']; | 1065 var section_name = info['section_name']; |
1052 var period = info['period']; | 1066 var period = info['period']; |
1053 | 1067 |
1055 if (book_name == "" || section_name == "" || period == "") { | 1069 if (book_name == "" || section_name == "" || period == "") { |
1056 default_label = today; | 1070 default_label = today; |
1057 } else { | 1071 } else { |
1058 default_label = book_name + "(" + cjst.chineseToPinyin(book_name).join(' ') + ")_" | 1072 default_label = book_name + "(" + cjst.chineseToPinyin(book_name).join(' ') + ")_" |
1059 + period + "(" + cjst.chineseToPinyin(period).join(' ') + ")_" | 1073 + period + "(" + cjst.chineseToPinyin(period).join(' ') + ")_" |
1060 + section_name + "(" + cjst.chineseToPinyin(section_name).join(' ') + ")_" | 1074 + section_name + "(" + cjst.chineseToPinyin(section_name).join(' ') + ")_" |
1061 + today; | 1075 + today; |
1062 } | 1076 } |
1063 | 1077 |
1064 | 1078 |
1065 var label = prompt("Please enter your label for this new task", default_label); | 1079 var label = prompt("Please enter your label for this new task", default_label); |
1066 while (label == null) { | 1080 while (label == null) { |
1067 alert("You haven't saved your editing."); | 1081 alert("You haven't saved your editing."); |
1068 return; | 1082 return; |
1069 } | 1083 } |
1070 }; | 1084 }; |
1071 | 1085 |
1072 var form = document.createElement("form"); | 1086 var form = document.createElement("form"); |
1073 form.setAttribute("method", "post"); | 1087 form.setAttribute("method", "post"); |
1074 form.setAttribute("action", "./TaggingText"); // hand to controller | 1088 form.setAttribute("action", "./TaggingText"); // hand to controller |
1075 form.setAttribute("target", "_self"); | 1089 form.setAttribute("target", "_self"); |
1076 | 1090 |
1077 var hiddenField = document.createElement("input"); | 1091 var hiddenField = document.createElement("input"); |
1078 hiddenField.setAttribute("name", "func"); | 1092 hiddenField.setAttribute("name", "func"); |
1079 hiddenField.setAttribute("value", "SaveFullTextToLGService"); | 1093 hiddenField.setAttribute("value", "SaveFullTextToLGService"); |
1080 form.appendChild(hiddenField); | 1094 form.appendChild(hiddenField); |
1081 | 1095 |
1082 | 1096 |
1083 var hiddenField = document.createElement("input"); | 1097 var hiddenField = document.createElement("input"); |
1084 hiddenField.setAttribute("name", "label"); | 1098 hiddenField.setAttribute("name", "label"); |
1085 hiddenField.setAttribute("value", label); | 1099 hiddenField.setAttribute("value", label); |
1086 form.appendChild(hiddenField); | 1100 form.appendChild(hiddenField); |
1087 | 1101 |
1088 var hiddenField = document.createElement("input"); | 1102 var hiddenField = document.createElement("input"); |
1089 hiddenField.setAttribute("name", "topic"); | 1103 hiddenField.setAttribute("name", "topic"); |
1090 hiddenField.setAttribute("value", topic_id); | 1104 hiddenField.setAttribute("value", topic_id); |
1091 form.appendChild(hiddenField); | 1105 form.appendChild(hiddenField); |
1092 | 1106 |
1093 _postForContineTagging(form); | 1107 _postForContineTagging(form); |
1094 | 1108 |
1095 // set Cookies to triger LGService to reload for the up-to-date version | 1109 // set Cookies to triger LGService to reload for the up-to-date version |
1096 var value = 1; | 1110 var value = 1; |
1097 document.cookie = "saveTextToLGService=" + value + "; path=/LGServices/pages"; | 1111 document.cookie = "saveTextToLGService=" + value + "; path=/LGServices/pages"; |
1098 | |
1099 console.log("complete saving to LGService"); | |
1100 | 1112 |
1101 } | 1113 } |
1102 | 1114 |
1103 function createTopic(default_topic_id) { | 1115 function createTopic(default_topic_id) { |
1104 var popup_status = $('#new_topic_div').css("display"); | 1116 var popup_status = $('#new_topic_div').css("display"); |
1107 } else { | 1119 } else { |
1108 $('#new_topic_div').css("display", "block"); | 1120 $('#new_topic_div').css("display", "block"); |
1109 } | 1121 } |
1110 | 1122 |
1111 var newtopic = document.getElementById("newTopicSubmit"); | 1123 var newtopic = document.getElementById("newTopicSubmit"); |
1112 | 1124 |
1113 newtopic.onclick = function(){ | 1125 newtopic.onclick = function(){ |
1114 // check if all fields are filled in | 1126 // check if all fields are filled in |
1115 if ($("#newTopicNameEn").val()==""|| $("#newTopicNameCh").val()=="" || $("#newTopicNamePi").val()=="" || | 1127 if ($("#newTopicNameEn").val()==""|| $("#newTopicNameCh").val()=="" || $("#newTopicNamePi").val()=="" || |
1116 $("#newTopicTag").val()=="" || $("#newTopicTagName").val()=="") { | 1128 $("#newTopicTag").val()=="" || $("#newTopicTagName").val()=="") { |
1117 alert("Please fill in all the fields for the new topic."); | 1129 alert("Please fill in all the fields for the new topic."); |
1118 return; | 1130 return; |
1119 } | 1131 } |
1120 | 1132 |
1121 | 1133 |
1122 var form = document.createElement("form"); | 1134 var form = document.createElement("form"); |
1123 form.setAttribute("method", "post"); | 1135 form.setAttribute("method", "post"); |
1124 form.setAttribute("action", "./TaggingText"); // hand to controller | 1136 form.setAttribute("action", "./TaggingText"); // hand to controller |
1125 form.setAttribute("target", "_self"); | 1137 form.setAttribute("target", "_self"); |
1126 | 1138 |
1127 var hiddenField = document.createElement("input"); | 1139 var hiddenField = document.createElement("input"); |
1128 hiddenField.setAttribute("name", "func"); | 1140 hiddenField.setAttribute("name", "func"); |
1129 hiddenField.setAttribute("value", "CreateNewTopic"); | 1141 hiddenField.setAttribute("value", "CreateNewTopic"); |
1130 form.appendChild(hiddenField); | 1142 form.appendChild(hiddenField); |
1131 | 1143 |
1132 var hiddenField = document.createElement("input"); | 1144 var hiddenField = document.createElement("input"); |
1133 hiddenField.setAttribute("name", "new_topic_name_en"); | 1145 hiddenField.setAttribute("name", "new_topic_name_en"); |
1134 hiddenField.setAttribute("value", $("#newTopicNameEn").val()); | 1146 hiddenField.setAttribute("value", $("#newTopicNameEn").val()); |
1135 form.appendChild(hiddenField); | 1147 form.appendChild(hiddenField); |
1136 var hiddenField = document.createElement("input"); | 1148 var hiddenField = document.createElement("input"); |
1137 hiddenField.setAttribute("name", "new_topic_name_ch"); | 1149 hiddenField.setAttribute("name", "new_topic_name_ch"); |
1138 hiddenField.setAttribute("value", $("#newTopicNameCh").val()); | 1150 hiddenField.setAttribute("value", $("#newTopicNameCh").val()); |
1139 form.appendChild(hiddenField); | 1151 form.appendChild(hiddenField); |
1140 var hiddenField = document.createElement("input"); | 1152 var hiddenField = document.createElement("input"); |
1141 hiddenField.setAttribute("name", "new_topic_name_pi"); | 1153 hiddenField.setAttribute("name", "new_topic_name_pi"); |
1142 hiddenField.setAttribute("value", $("#newTopicNamePi").val()); | 1154 hiddenField.setAttribute("value", $("#newTopicNamePi").val()); |
1143 form.appendChild(hiddenField); | 1155 form.appendChild(hiddenField); |
1144 var hiddenField = document.createElement("input"); | 1156 var hiddenField = document.createElement("input"); |
1145 hiddenField.setAttribute("name", "new_topic_tag"); | 1157 hiddenField.setAttribute("name", "new_topic_tag"); |
1146 hiddenField.setAttribute("value", $("#newTopicTag").val()); | 1158 hiddenField.setAttribute("value", $("#newTopicTag").val()); |
1147 form.appendChild(hiddenField); | 1159 form.appendChild(hiddenField); |
1148 var hiddenField = document.createElement("input"); | 1160 var hiddenField = document.createElement("input"); |
1149 hiddenField.setAttribute("name", "new_topic_tag_name"); | 1161 hiddenField.setAttribute("name", "new_topic_tag_name"); |
1150 hiddenField.setAttribute("value", $("#newTopicTagName").val()); | 1162 hiddenField.setAttribute("value", $("#newTopicTagName").val()); |
1151 form.appendChild(hiddenField); | 1163 form.appendChild(hiddenField); |
1152 | 1164 |
1153 | 1165 |
1154 _postForContineTagging(form); | 1166 _postForContineTagging(form); |
1155 | 1167 |
1156 } | 1168 } |
1157 | 1169 |
1158 $("#newTopicCancel").attr("onclick", "$('#new_topic_div').css(\"display\", \"none\");"); | 1170 $("#newTopicCancel").attr("onclick", "$('#new_topic_div').css(\"display\", \"none\");"); |
1159 | 1171 |
1160 } | 1172 } |
1161 | 1173 |
1162 function chooseTopic(default_topic_id) { | 1174 function chooseTopic(default_topic_id) { |
1187 var changeConfirm = confirm("You're going to change topic. \nUnsaved data will be lost."); | 1199 var changeConfirm = confirm("You're going to change topic. \nUnsaved data will be lost."); |
1188 | 1200 |
1189 if (changeConfirm) { | 1201 if (changeConfirm) { |
1190 | 1202 |
1191 selected_topic = topic_select.options[topic_select.selectedIndex]; | 1203 selected_topic = topic_select.options[topic_select.selectedIndex]; |
1192 console.log(selected_topic.text); | |
1193 | 1204 |
1194 var topic_id = selected_topic.value; | 1205 var topic_id = selected_topic.value; |
1195 | 1206 |
1196 var form = document.createElement("form"); | 1207 var form = document.createElement("form"); |
1197 form.setAttribute("method", "post"); | 1208 form.setAttribute("method", "post"); |
1198 form.setAttribute("action", "./TaggingText"); // hand to controller | 1209 form.setAttribute("action", "./TaggingText"); // hand to controller |
1199 form.setAttribute("target", "_self"); | 1210 form.setAttribute("target", "_self"); |
1200 | 1211 |
1201 var hiddenField = document.createElement("input"); | 1212 var hiddenField = document.createElement("input"); |
1202 hiddenField.setAttribute("name", "topic"); | 1213 hiddenField.setAttribute("name", "topic"); |
1203 hiddenField.setAttribute("value", topic_id); | 1214 hiddenField.setAttribute("value", topic_id); |
1204 form.appendChild(hiddenField); | 1215 form.appendChild(hiddenField); |
1205 | 1216 |
1206 var hiddenField = document.createElement("input"); | 1217 var hiddenField = document.createElement("input"); |
1207 hiddenField.setAttribute("name", "func"); | 1218 hiddenField.setAttribute("name", "func"); |
1208 hiddenField.setAttribute("value", "ContinueTagging"); | 1219 hiddenField.setAttribute("value", "ContinueTagging"); |
1209 form.appendChild(hiddenField); | 1220 form.appendChild(hiddenField); |
1210 | 1221 |
1211 _postForContineTagging(form); | 1222 _postForContineTagging(form); |
1212 | 1223 |
1213 | 1224 |
1214 } else { | 1225 } else { |
1215 return | 1226 return |
1216 } | 1227 } |
1217 }; | 1228 }; |
1218 | 1229 |
1219 | 1230 |
1220 //Create and append the options | 1231 //Create and append the options |
1221 for (var i = 0; i < t.length; i++) { | 1232 for (var i = 0; i < t.length; i++) { |
1226 option.selected = true; | 1237 option.selected = true; |
1227 }; | 1238 }; |
1228 topic_select.appendChild(option); | 1239 topic_select.appendChild(option); |
1229 } | 1240 } |
1230 | 1241 |
1231 $('#load_topic_div').append(topic_select); | |
1232 | |
1233 var newbutton = document.createElement("button"); | 1242 var newbutton = document.createElement("button"); |
1234 $(newbutton).html("Close"); | 1243 $(newbutton).html('<span aria-hidden=\"true\">×</span>'); |
1235 $(newbutton).addClass("btn btn-xs btn-default"); | 1244 $(newbutton).addClass("btn btn-xs btn-default close-btn"); |
1236 $(newbutton).attr("onclick", "$('#load_topic_div').css(\"display\", \"none\");"); | 1245 $(newbutton).attr("onclick", "$('#load_topic_div').css(\"display\", \"none\");"); |
1237 $('#load_topic_div').append(newbutton); | 1246 $('#load_topic_div').append(newbutton); |
1238 | 1247 |
1239 } | 1248 $('#load_topic_div').append(topic_select); |
1240 | 1249 |
1250 } | |
1241 | 1251 |
1242 function _postForContineTagging(form) { | 1252 function _postForContineTagging(form) { |
1243 var hiddenField = document.createElement("input"); | 1253 var hiddenField = document.createElement("input"); |
1244 hiddenField.setAttribute("name", "text"); | 1254 hiddenField.setAttribute("name", "text"); |
1245 var el = document.getElementById("editable-area"); | 1255 var el = document.getElementById("editable-area"); |
1246 var text = el.innerHTML; | 1256 var text = el.innerHTML; |
1247 hiddenField.setAttribute("value", text); | 1257 hiddenField.setAttribute("value", text); |
1248 form.appendChild(hiddenField); | 1258 form.appendChild(hiddenField); |
1249 | 1259 |
1250 // pass taglist | 1260 // pass taglist |
1251 var hiddenField = document.createElement("input"); | 1261 var hiddenField = document.createElement("input"); |
1252 hiddenField.setAttribute("name", "taglistArray"); | 1262 hiddenField.setAttribute("name", "taglistArray"); |
1253 | 1263 |
1254 // use json_encode($taglistArray), which is the up-to-date taglist (in db) instead, | 1264 // use json_encode($taglistArray), which is the up-to-date taglist (in db) instead, |
1255 // so replace the follwoing code | 1265 // so replace the follwoing code |
1256 /* | 1266 /* |
1257 var taglistObj = JSON.parse('<?php echo json_encode($taglist_infile) ?>'); | 1267 var taglistObj = JSON.parse('<?php echo json_encode($taglist_infile) ?>'); |
1258 // if taglist_infile == "" means the taglist in db is up-to-date, will use taglistArray to save to file | 1268 // if taglist_infile == "" means the taglist in db is up-to-date, will use taglistArray to save to file |
1261 // TODO: should pass the user-decided taglist to post['taglistArray'] | 1271 // TODO: should pass the user-decided taglist to post['taglistArray'] |
1262 taglistObj = JSON.parse('<?php echo json_encode($taglistArray) ?>'); | 1272 taglistObj = JSON.parse('<?php echo json_encode($taglistArray) ?>'); |
1263 } | 1273 } |
1264 taglistArray = JSON.stringify(taglistObj); | 1274 taglistArray = JSON.stringify(taglistObj); |
1265 */ | 1275 */ |
1266 | 1276 |
1267 | 1277 |
1268 var taglistArray = JSON.parse('<?php echo json_encode($taglistArray) ?>'); | 1278 var taglistArray = JSON.parse('<?php echo json_encode($taglistArray) ?>'); |
1269 hiddenField.setAttribute("value", taglistArray); | 1279 hiddenField.setAttribute("value", taglistArray); |
1270 form.appendChild(hiddenField); | 1280 form.appendChild(hiddenField); |
1271 | 1281 |
1272 // pass book_meta | 1282 // pass book_meta |
1273 var hiddenField = document.createElement("input"); | 1283 var hiddenField = document.createElement("input"); |
1274 hiddenField.setAttribute("name", "book_meta"); | 1284 hiddenField.setAttribute("name", "book_meta"); |
1275 var book_metaObj = JSON.parse('<?php echo json_encode($book_meta) ?>'); | 1285 var book_metaObj = JSON.parse('<?php echo json_encode($book_meta) ?>'); |
1276 book_metaArray = JSON.stringify(book_metaObj); | 1286 book_metaArray = JSON.stringify(book_metaObj); |
1277 | 1287 |
1278 hiddenField.setAttribute("value", book_metaArray); | 1288 hiddenField.setAttribute("value", book_metaArray); |
1279 form.appendChild(hiddenField); | 1289 form.appendChild(hiddenField); |
1280 | 1290 |
1281 | 1291 |
1282 var info = JSON.parse( '<?php echo json_encode($info) ?>'); | 1292 var info = JSON.parse( '<?php echo json_encode($info) ?>'); |
1283 | 1293 |
1284 if (info) { | 1294 if (info) { |
1285 if (info['file_id']) { | 1295 if (info['file_id']) { |
1286 var hiddenField = document.createElement("input"); | 1296 var hiddenField = document.createElement("input"); |
1287 hiddenField.setAttribute("name", "fileId"); | 1297 hiddenField.setAttribute("name", "fileId"); |
1288 hiddenField.setAttribute("value", info['file_id']); | 1298 hiddenField.setAttribute("value", info['file_id']); |
1289 form.appendChild(hiddenField); | 1299 form.appendChild(hiddenField); |
1290 }; | 1300 }; |
1291 if (info['branch_id']) { | 1301 if (info['branch_id']) { |
1292 var hiddenField = document.createElement("input"); | 1302 var hiddenField = document.createElement("input"); |
1293 hiddenField.setAttribute("name", "branchId"); | 1303 hiddenField.setAttribute("name", "branchId"); |
1294 hiddenField.setAttribute("value", info['branch_id']); | 1304 hiddenField.setAttribute("value", info['branch_id']); |
1295 form.appendChild(hiddenField); | 1305 form.appendChild(hiddenField); |
1296 }; | 1306 }; |
1297 if (info['user_id']) { | 1307 if (info['user_id']) { |
1298 var hiddenField = document.createElement("input"); | 1308 var hiddenField = document.createElement("input"); |
1299 hiddenField.setAttribute("name", "userId"); | 1309 hiddenField.setAttribute("name", "userId"); |
1300 hiddenField.setAttribute("value", info['user_id']); | 1310 hiddenField.setAttribute("value", info['user_id']); |
1301 form.appendChild(hiddenField); | 1311 form.appendChild(hiddenField); |
1302 }; | 1312 }; |
1303 if (info['section_id']) { | 1313 if (info['section_id']) { |
1304 var hiddenField = document.createElement("input"); | 1314 var hiddenField = document.createElement("input"); |
1305 hiddenField.setAttribute("name", "sectionId"); | 1315 hiddenField.setAttribute("name", "sectionId"); |
1306 hiddenField.setAttribute("value", info['section_id']); | 1316 hiddenField.setAttribute("value", info['section_id']); |
1307 form.appendChild(hiddenField); | 1317 form.appendChild(hiddenField); |
1308 }; | 1318 }; |
1309 if (info['book_id']) { | 1319 if (info['book_id']) { |
1310 var hiddenField = document.createElement("input"); | 1320 var hiddenField = document.createElement("input"); |
1311 hiddenField.setAttribute("name", "bookId"); | 1321 hiddenField.setAttribute("name", "bookId"); |
1312 hiddenField.setAttribute("value", info['book_id']); | 1322 hiddenField.setAttribute("value", info['book_id']); |
1313 form.appendChild(hiddenField); | 1323 form.appendChild(hiddenField); |
1314 }; | 1324 }; |
1315 if (info['section_name']) { | 1325 if (info['section_name']) { |
1316 var hiddenField = document.createElement("input"); | 1326 var hiddenField = document.createElement("input"); |
1317 hiddenField.setAttribute("name", "sectionName"); | 1327 hiddenField.setAttribute("name", "sectionName"); |
1318 hiddenField.setAttribute("value", info['section_name']); | 1328 hiddenField.setAttribute("value", info['section_name']); |
1319 form.appendChild(hiddenField); | 1329 form.appendChild(hiddenField); |
1320 }; | 1330 }; |
1321 if (info['book_name']) { | 1331 if (info['book_name']) { |
1322 var hiddenField = document.createElement("input"); | 1332 var hiddenField = document.createElement("input"); |
1323 hiddenField.setAttribute("name", "bookName"); | 1333 hiddenField.setAttribute("name", "bookName"); |
1324 hiddenField.setAttribute("value", info['book_name']); | 1334 hiddenField.setAttribute("value", info['book_name']); |
1325 form.appendChild(hiddenField); | 1335 form.appendChild(hiddenField); |
1326 }; | 1336 }; |
1327 if (info['current_fileId']) { | 1337 if (info['current_fileId']) { |
1328 var hiddenField = document.createElement("input"); | 1338 var hiddenField = document.createElement("input"); |
1329 hiddenField.setAttribute("name", "currentFileId"); | 1339 hiddenField.setAttribute("name", "currentFileId"); |
1330 hiddenField.setAttribute("value", info['current_fileId']); | 1340 hiddenField.setAttribute("value", info['current_fileId']); |
1331 form.appendChild(hiddenField); | 1341 form.appendChild(hiddenField); |
1332 }; | 1342 }; |
1333 | 1343 |
1334 } | 1344 } |
1335 if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1) { | 1345 |
1336 document.body.appendChild(form); | |
1337 form.submit(); | |
1338 document.body.removeChild(form); | |
1339 } else { | |
1340 document.body.appendChild(form); | 1346 document.body.appendChild(form); |
1341 form.submit(); | 1347 form.submit(); |
1342 document.body.removeChild(form); | 1348 document.body.removeChild(form); |
1343 //form.submit(); // works under IE and Chrome, but not FF | 1349 |
1344 } | |
1345 | 1350 |
1346 } | 1351 } |
1347 | 1352 |
1348 function configTagsInTopic(topic_id) { | 1353 function configTagsInTopic(topic_id) { |
1349 var form = document.createElement("form"); | 1354 var form = document.createElement("form"); |
1350 | 1355 |
1351 form.setAttribute("method", "post"); | 1356 form.setAttribute("method", "post"); |
1352 form.setAttribute("action", "./ConfigTagsInTopic"); // hand to controller | 1357 form.setAttribute("action", "./ConfigTagsInTopic"); // hand to controller |
1353 form.setAttribute("target", "_blank"); | 1358 form.setAttribute("target", "_blank"); |
1354 | 1359 |
1355 var hiddenField = document.createElement("input"); | 1360 var hiddenField = document.createElement("input"); |
1356 hiddenField.setAttribute("name", "topic"); | 1361 hiddenField.setAttribute("name", "topic"); |
1357 hiddenField.setAttribute("value", topic_id); | 1362 hiddenField.setAttribute("value", topic_id); |
1358 form.appendChild(hiddenField); | 1363 form.appendChild(hiddenField); |
1359 | 1364 |
1360 _postForContineTagging(form); | 1365 _postForContineTagging(form); |
1361 | 1366 |
1362 | 1367 |
1368 } | |
1369 | |
1370 var toolPanelPosition = "right"; | |
1371 | |
1372 function moveToolPanel(toWhere){ | |
1373 | |
1374 if(toolPanelPosition == toWhere) return; | |
1375 | |
1376 var oldAreaId, newAreaId, oldBtn, newBtn; | |
1377 if(toWhere == "left"){ | |
1378 oldAreaId = 'right-tool-bar-area'; | |
1379 newAreaId = 'left-tool-bar-area'; | |
1380 oldBtn = 'toLeft'; | |
1381 newBtn = 'toRight'; | |
1382 } | |
1383 else{ | |
1384 oldAreaId = 'left-tool-bar-area'; | |
1385 newAreaId = 'right-tool-bar-area'; | |
1386 oldBtn = 'toRight'; | |
1387 newBtn = 'toLeft'; | |
1388 } | |
1389 | |
1390 var oldParent = document.getElementById(oldAreaId), | |
1391 newParent = document.getElementById(newAreaId); | |
1392 | |
1393 while (oldParent.hasChildNodes()){ | |
1394 newParent.appendChild(oldParent.firstChild); | |
1395 } | |
1396 | |
1397 newParent.style.display = "block"; | |
1398 oldParent.style.display = "none"; | |
1399 | |
1400 document.getElementById(newBtn).firstChild.style.display = "block"; | |
1401 document.getElementById(oldBtn).firstChild.style.display = "none"; | |
1402 | |
1403 toolPanelPosition = toWhere; | |
1404 | |
1363 } | 1405 } |
1364 | 1406 |
1365 $(document).on("change", '#smartRegexPopUpSelectWord', function (e) { | 1407 $(document).on("change", '#smartRegexPopUpSelectWord', function (e) { |
1366 var wordlistArray = JSON.parse('<?php echo json_encode($wordlistArray) ?>'); | 1408 var wordlistArray = JSON.parse('<?php echo json_encode($wordlistArray) ?>'); |
1367 | 1409 |
1368 for (var i = 0; i < wordlistArray.length; i++) { | 1410 for (var i = 0; i < wordlistArray.length; i++) { |
1369 var wordlistValue = wordlistArray[i]; // wordlistValue is array(id, name, listString) | 1411 var wordlistValue = wordlistArray[i]; // wordlistValue is array(id, name, listString) |
1370 if ($('#smartRegexPopUpSelectWord').val() == wordlistValue[0]) { | 1412 if ($('#smartRegexPopUpSelectWord').val() == wordlistValue[0]) { |
1371 var textarea_text = $('#smartRegexPopUpText').val(); | 1413 var textarea_text = $('#smartRegexPopUpText').val(); |
1372 // insert selected wordlist into textarea at cursor position | 1414 // insert selected wordlist into textarea at cursor position |
1373 var cursorPosition = $('#smartRegexPopUpText').prop("selectionStart"); | 1415 var cursorPosition = $('#smartRegexPopUpText').prop("selectionStart"); |
1374 // cut textarea_text by cursorPosition | 1416 // cut textarea_text by cursorPosition |
1375 var text_before_cursor = textarea_text.substring(0,cursorPosition); | 1417 var text_before_cursor = textarea_text.substring(0,cursorPosition); |
1379 $('#smartRegexPopUpText').val( text_before_cursor+"["+wordlistValue[2]+"]{1,1}"+text_after_cursor); | 1421 $('#smartRegexPopUpText').val( text_before_cursor+"["+wordlistValue[2]+"]{1,1}"+text_after_cursor); |
1380 } | 1422 } |
1381 } | 1423 } |
1382 }); | 1424 }); |
1383 | 1425 |
1384 | |
1385 </script> | 1426 </script> |
1386 | 1427 |
1387 | 1428 <div id="loading">...</div> |
1388 <!-- | 1429 |
1389 <fieldset class="info-board"> | 1430 <div class="container-fluid info-board"> |
1390 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#info_board">Information <span class="caret"></span></h5></legend> | 1431 <div class="row"> |
1391 <div id="info_board" class="collapse in"> | 1432 <div class="bg-danger"><strong><?php echo $messages['error']; ?> </strong></div> |
1392 <div class="bg-danger"><strong><?php echo $messages['error']; ?> </strong></div> | 1433 <div class="bg-warning"> <?php echo $messages['warning']; ?> |
1393 <div class="bg-warning"> <?php echo $messages['warning']; ?> | 1434 <button id="reloadTextButton" onclick="reloadText(<?php echo $default_topic_id; ?>)" style="display:none;">Latest Version</button> |
1394 <button id="reloadTextButton" onclick="reloadText(<?php echo $default_topic_id; ?>)" style="display:none;">Latest Version</button> | 1435 </div> |
1436 <div class="bg-info"> <?php echo $messages['info']; ?> </div> | |
1437 </div> | |
1438 </div> | |
1439 | |
1440 <div class="container-fluid"> | |
1441 <div class="row"> | |
1442 <div id="left-tool-bar-area" class="col-md-3 tool-col" style="display:none"></div> | |
1443 <div class="col-md-9 content-col"> | |
1444 <div id="editable-area-wraper"> | |
1445 <div id="editable-area" class="area" contenteditable="false"><?php echo $stringInput; ?></div> | |
1446 </div> | |
1395 </div> | 1447 </div> |
1396 <div class="bg-info"> <?php echo $messages['info']; ?> </div> | 1448 <div id="right-tool-bar-area" class="col-md-3 tool-col"> |
1397 <div class="bg-default"> <?php echo $messages['debug']; ?> </div> | |
1398 </div> | |
1399 </fieldset> | |
1400 | |
1401 --> | |
1402 <div id="loading">...</div> | |
1403 | |
1404 <div class="info-board"> | |
1405 <div class="bg-danger"><strong><?php echo $messages['error']; ?> </strong></div> | |
1406 <div class="bg-warning"> <?php echo $messages['warning']; ?> | |
1407 <button id="reloadTextButton" onclick="reloadText(<?php echo $default_topic_id; ?>)" style="display:none;">Latest Version</button> | |
1408 </div> | |
1409 <div class="bg-info"> <?php echo $messages['info']; ?> </div> | |
1410 <!-- | |
1411 <div class="bg-default"> <?php echo $messages['debug']; ?> </div> | |
1412 --> | |
1413 </div> | |
1414 | |
1415 <table border="1" style="margin:10 30 30 30; width:100%; max-width:1270px; min-width:680px"> | |
1416 <tr> | |
1417 <td style="padding:0 5 0 5; margin: 0 5 0 5;"> | |
1418 <div id="editable-area" class="area" style="max-width:980px; min-width:400px"><?php echo $stringInput; ?></div> | |
1419 </td> | |
1420 <td valign="top" style="min-width:280px; padding:0 5 0 5; margin:0 5 0 5;"> | |
1421 <div id="popups" style="position:absolute; width:300px; "> | 1449 <div id="popups" style="position:absolute; width:300px; "> |
1422 <div id="load_topic_div" class="popup-topic popup-frame"></div> | 1450 <div id="load_topic_div" class="popup-topic popup-frame"></div> |
1423 <div id="new_topic_div" class="popup-newtopic popup-frame"> | 1451 <div id="new_topic_div" class="popup-newtopic popup-frame"> |
1424 <div class="form-horizontal"> | 1452 <div class="form-horizontal"> |
1425 <h4 class="text-info">New topic name:</h4> | 1453 <h4 class="text-info">New topic name:</h4> |
1439 <label for="newTopicNamePi" class="col-sm-5 control-label">name (pinyin)</label> | 1467 <label for="newTopicNamePi" class="col-sm-5 control-label">name (pinyin)</label> |
1440 <div class="col-sm-7"> | 1468 <div class="col-sm-7"> |
1441 <input type="text" class="form-control" id="newTopicNamePi" placeholder="e.g. wu chan"> | 1469 <input type="text" class="form-control" id="newTopicNamePi" placeholder="e.g. wu chan"> |
1442 </div> | 1470 </div> |
1443 </div> | 1471 </div> |
1444 | 1472 |
1445 | 1473 |
1446 <h4 class="text-info">Define the topic tag for the new topic:</h4> | 1474 <h4 class="text-info">Define the topic tag for the new topic:</h4> |
1447 <div class="form-group form-group-sm"> | 1475 <div class="form-group form-group-sm"> |
1448 <label for="newTopicTag" class="col-sm-5 control-label">topic tag (eng)</label> | 1476 <label for="newTopicTag" class="col-sm-5 control-label">topic tag (eng)</label> |
1449 <div class="col-sm-7"> | 1477 <div class="col-sm-7"> |
1469 | 1497 |
1470 </div> | 1498 </div> |
1471 <div id="load_regex_div" class="popup-loadregex popup-frame"></div> | 1499 <div id="load_regex_div" class="popup-loadregex popup-frame"></div> |
1472 <div id="regex_generator" class="popup-frame"> | 1500 <div id="regex_generator" class="popup-frame"> |
1473 <h3>Gen Regex</h3> | 1501 <h3>Gen Regex</h3> |
1474 <div>Pattern 1: | 1502 <div>Pattern 1: |
1475 <div id="regex_pattern1" class="bg-info"></div> | 1503 <div id="regex_pattern1" class="bg-info"></div> |
1476 </div> | 1504 </div> |
1477 <div>Pattern 2: | 1505 <div>Pattern 2: |
1478 <div id="regex_pattern2" class="bg-info"></div> | 1506 <div id="regex_pattern2" class="bg-info"></div> |
1479 </div> | 1507 </div> |
1480 <div>Suggested Regex: | 1508 <div>Suggested Regex: |
1481 <div id="generated_regex" class="bg-success"></div> | 1509 <div id="generated_regex" class="bg-success"></div> |
1482 </div> | 1510 </div> |
1483 <button onclick="genRegexAddToSmartRegex()" class="btn btn-info">Add it to SmartRegex</button> | 1511 <button onclick="genRegexAddToSmartRegex()" class="btn btn-info">Add it to SmartRegex</button> |
1484 <button onclick="genRegexWindowClose()" class="btn btn-default">Close</button> | 1512 <button onclick="genRegexWindowClose()" class="btn btn-default">Close</button> |
1485 <div id="regex_generator_error_msg" class="bg-white"></div> | 1513 <div id="regex_generator_error_msg" class="bg-white"></div> |
1486 </div> | 1514 </div> |
1487 <div id="smartRegexPopUpDiv" class="popup-frame"> | 1515 <div id="smartRegexPopUpDiv" class="popup-frame"> |
1488 Name: <input id="smartRegexPopUpName"></input><br><br> | 1516 |
1489 Word List: | 1517 Name: <input id="smartRegexPopUpName"></input> |
1518 <button onclick="replaceSmartClose()" class="btn btn-sm btn-default close-btn" ><span aria-hidden="true">×</span></button><br><br> | |
1519 Word List: | |
1490 <select id="smartRegexPopUpSelectWord"> | 1520 <select id="smartRegexPopUpSelectWord"> |
1491 <option value="NULL" selected>無</option> | 1521 <option value="NULL" selected>無</option> |
1492 <?php | 1522 <?php |
1493 foreach ( $wordlistArray as $wordlistValue ) { | 1523 foreach ( $wordlistArray as $wordlistValue ) { |
1494 echo "<option value=\"".$wordlistValue[0]."\">".$wordlistValue[1]."</option>\n"; | 1524 echo "<option value=\"".$wordlistValue[0]."\">".$wordlistValue[1]."</option>\n"; |
1495 } | 1525 } |
1496 ?> | 1526 ?> |
1497 </select> | 1527 </select> |
1498 <!-- edit wordlist --> | 1528 <!-- edit wordlist --> |
1499 <button onclick="window.open('./EditWordlist')" class="btn btn-default">Edit WordList</button></br> | 1529 <button onclick="window.open('./EditWordlist')" class="btn btn-sm btn-default">Edit WordList</button></br> |
1500 | 1530 |
1501 <br> | 1531 <br> |
1502 OR (USE "|" TO SEPARATE WORDS):<br> | 1532 OR (USE "|" TO SEPARATE WORDS):<br> |
1503 <TEXTAREA id="smartRegexPopUpText" COLS=30 ROWS=4></TEXTAREA><br><br> | 1533 <TEXTAREA id="smartRegexPopUpText" COLS=59 ROWS=4 style="width:100%;"></TEXTAREA><br><br> |
1504 Tag: | 1534 Tag: |
1505 <select id="smartRegexPopUpSelectTag"> | 1535 <select id="smartRegexPopUpSelectTag"> |
1506 <?php | 1536 <?php |
1507 foreach ( $taglistArray as $taglistValue ) { | 1537 foreach ( $taglistArray as $taglistValue ) { |
1508 echo "<option value=\"".$taglistValue[2]."\">".$taglistValue[1]."</option>\n"; | 1538 echo "<option value=\"".$taglistValue[2]."\">".$taglistValue[1]."</option>\n"; |
1509 } | 1539 } |
1510 echo "<option value=\"title\">Title</option>\n"; | 1540 echo "<option value=\"title\">Title</option>\n"; |
1511 ?> | 1541 ?> |
1512 <option value="NOTAG">不標記</option> | 1542 <option value="NOTAG">不標記</option> |
1513 </select><br> | 1543 </select><br><br> |
1514 <button id="smartRegexPopUpAdd" onclick="replaceSmartAdd()" class="btn btn-info">Add</button> | 1544 <button id="smartRegexPopUpBack" onclick="replaceSmartBack()" class="btn btn-sm btn-default"><<</button> |
1515 <button id="smartRegexPopUpEdit" onclick="replaceSmartEdit()" class="btn btn-success">Edit/Update</button> | 1545 <button id="smartRegexPopUpAdd" onclick="replaceSmartAdd()" class="btn btn-sm btn-info" style="display:none">Add</button> |
1516 <button id="smartRegexPopUpDel" onclick="replaceSmartDel()" class="btn btn-danger">Delete</button> | 1546 <button id="smartRegexPopUpDel" onclick="replaceSmartRemove()" class="btn btn-sm btn-danger">Remove</button> |
1517 <button id="smartRegexPopUpBack" onclick="replaceSmartBack()" class="btn btn-default"><<</button> | 1547 <button id="smartRegexPopUpEdit" onclick="replaceSmartEdit()" class="btn btn-sm btn-success">Edit/Update</button> |
1518 <button id="smartRegexPopUpFor" onclick="replaceSmartFor()" class="btn btn-default">>></button> | 1548 <button id="smartRegexPopUpFor" onclick="replaceSmartFor()" class="btn btn-sm btn-default">>></button> |
1519 <button onclick="replaceSmartClose()" class="btn btn-default" >Close</button> | |
1520 </div> | 1549 </div> |
1521 </div> | 1550 </div> |
1522 | 1551 <div id="toLeft" onclick="moveToolPanel('left')"><span class="glyphicon glyphicon-arrow-left switch-btn"></span></div> |
1523 <div id="follow-scroll"> | 1552 <div id="follow-scroll"> |
1524 <form action="javascript:void(0);"> | 1553 <div class="panel panel-default" style="margin-bottom: 10px;"> |
1525 <fieldset class="tool-frame"> | 1554 <div class="panel-body" style="padding:5px;"> |
1526 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_topic"> Topic and Tags: <span class="caret"></span></h5></legend> | 1555 Current topic is : <?php echo $topic_name['name_en']; ?> (<?php echo $topic_name['name_ch']; ?>, <?php echo $topic_name['name_pinyin']; ?>) |
1527 <div id="tool_topic" class="collapse in"> | 1556 </div> |
1528 <div> Current topic is: | 1557 </div> |
1529 <?php echo $topic_name['name_en']; ?> (<?php echo $topic_name['name_ch']; ?>, <?php echo $topic_name['name_pinyin']; ?>) | 1558 |
1530 <button onclick="chooseTopic(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Change Topic</button> | 1559 <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> |
1531 <!-- | 1560 <div class="panel panel-default"> |
1532 <button onclick="createTopic(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Create a New Topic</button> | 1561 <div class="panel-heading" role="tab" id="headingOne"> |
1533 --> | 1562 <h4 class="panel-title"> |
1563 <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> | |
1564 Change Topic and Tags: <span class="caret"></span> | |
1565 </a> | |
1566 </h4> | |
1567 </div> | |
1568 <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne"> | |
1569 <div class="panel-body"> | |
1570 <button onclick="chooseTopic(<?php echo $default_topic_id;?>)" class="btn btn-info btn-block">Change Topic</button> | |
1571 <br> | |
1572 | |
1573 <div>Main tag: <?php echo $topic_tag_ch;?> | |
1574 <p class="text-muted">(Only the lines with the tag will be in the exported table.)</p> | |
1575 </div> | |
1576 <button onclick="editTaglist(<?php echo $default_topic_id; ?>)" class="btn btn-primary btn-block">Edit Tag List</button> | |
1577 <!-- <button onclick="configTagsInTopic(< ?php echo $default_topic_id;? >)" class="btn btn-default btn-block">Select Existing Tags (testing)</button> --> | |
1578 </div> | |
1579 </div> | |
1580 </div> | |
1581 | |
1582 <div class="panel panel-default"> | |
1583 <div class="panel-heading" role="tab" id="headingTwo"> | |
1584 <h4 class="panel-title"> | |
1585 <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> | |
1586 Edit, Tag, Save text : <span class="caret"></span> | |
1587 </a> | |
1588 </h4> | |
1589 </div> | |
1590 <div id="collapseTwo" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingTwo"> | |
1591 <div class="panel-body"> | |
1592 | |
1593 <!-- <button onclick="editText()" id="editTextId" class="btn btn-default">Edit text</button> --> | |
1594 <div class="btn-group" data-toggle="buttons"> | |
1595 <label class="btn btn-default btn-sm active" onclick="switchToTaggingMode(this, 'tagging')"> | |
1596 <input type="radio" name="EditMode" value="tagging" autocomplete="off" checked> Tagging | |
1597 </label> | |
1598 <label class="btn btn-default btn-sm" onclick="switchToEditingMode(this, 'editing')"> | |
1599 <input type="radio" name="EditMode" value="editing" autocomplete="off"> Editing | |
1600 </label> | |
1601 </div> | |
1602 <button onclick="Undo()" class="btn btn-sm btn-default" id="buttonUndo" disabled="true" style="float:right;">Undo changes</button> | |
1603 | |
1604 <div id="smart-regex-area" class="sub-group-area"><span><i><b>Smart Regex</b></i>©</span> | |
1605 <div id="smartRegexShowDiv"></div> | |
1606 <!-- <button onclick="smartRegexNew()" class="btn-lg">Add Regex Group</button></br> --> | |
1607 <button onclick="smartRegexNew()" id="smart_regex_new_id" class="btn btn-sm btn-info">Compose</button> | |
1608 <button onclick="smartRegexLoad(<?php echo $default_topic_id; ?>)" class="btn btn-sm btn-info">Load</button> | |
1609 <button onclick="smartRegexSave(<?php echo $default_topic_id; ?>)" class="btn btn-sm btn-default" style="float:right;">Save</button> | |
1610 <button onclick="smartRegexEmpty()" class="btn btn-sm btn-danger" style="float:right;margin-right:4px">Clear</button> | |
1611 </div> | |
1612 <div> | |
1613 <div id="tag-function-area" class="sub-group-area"> | |
1614 Tag only for this range: | |
1615 <input type="text" size="5" id="regexPageStart"> to <input type="text" size="5" id="regexPageEnd"><br><br> | |
1616 | |
1617 <div> | |
1618 <label> | |
1619 <input type="radio" name="tagging_mode" onclick="onTagModeChanged(this)" value="default" checked> Default | |
1620 </label> | |
1534 </div> | 1621 </div> |
1535 | 1622 <div> |
1536 <div>Main tag: <?php echo $topic_tag_ch;?> | 1623 <label> |
1537 <p class="text-muted">(Only the lines with the tag will be in the exported table.)</p> | 1624 <input type="radio" name="tagging_mode" onclick="onTagModeChanged(this)" value="with_line_break"> With line break |
1625 </label> | |
1538 </div> | 1626 </div> |
1539 <button onclick="editTaglist(<?php echo $default_topic_id; ?>)" class="btn btn-default btn-block">Edit Tag List</button> | 1627 <!-- |
1540 <button onclick="configTagsInTopic(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Select Existing Tags (testing)</button> | 1628 <div> |
1541 | 1629 <label> |
1630 <input type="radio" name="tagging_mode" onclick="onTagModeChanged(this)" value="space_within_block"> Allow space within block | |
1631 </label> | |
1632 </div> | |
1633 --> | |
1634 <div style="text-align:right"><button onclick="startToTag()" class="btn btn-primary">Tag</button></div> | |
1542 </div> | 1635 </div> |
1543 </fieldset> | 1636 <button onclick="saveTextToLGService()" id="save_text_to_LGService_id" class="btn btn-primary btn-block" style="margin-top:10px;">Save text</button> |
1544 <!-- | 1637 |
1545 <fieldset class="tool-frame"> | 1638 </div> |
1546 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_tag"> Tag: <span class="caret"></span></h5></legend> | 1639 </div> |
1547 <div id="tool_tag" class="collapse in"> | 1640 </div> |
1548 <div>The topic tag is: <?php echo $topic_tag_ch;?> | 1641 |
1549 <p class="text-muted">(Only the lines with the tag will be in the exported table.)</p> | 1642 <div class="panel panel-default"> |
1550 </div> | 1643 <div class="panel-heading" role="tab" id="headingThree"> |
1551 <button onclick="editTaglist(<?php echo $default_topic_id; ?>)" class="btn btn-default btn-block">Edit Tag List</button> | 1644 <h4 class="panel-title"> |
1552 <button onclick="configTagsInTopic(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Select Existing Tags</button> | 1645 <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> |
1553 | 1646 Replace By <i><b>Regex</b></i>: <span class="caret"></span> |
1554 </div> | 1647 </a> |
1555 </fieldset> | 1648 </h4> |
1556 --> | 1649 </div> |
1557 <fieldset class="tool-frame"> | 1650 <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree"> |
1558 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_edit"> Edit, Save, and Export: <span class="caret"></span></h5></legend> | 1651 <div class="panel-body"> |
1559 <!--<button onclick="cleanUpTextArea()" style="height: 30px; width: 220px">Reform the text</button></br>--> | 1652 Range: <input type="text" size="5" id="regexPageStart2"> to <input type="text" size="5" id="regexPageEnd2"><br><br> |
1560 <!-- save text in local. replaced by saveTextToLGService, which is also saving on copy in local in development stage --> | 1653 Regex: <input type="text" size="23" id="regexText"><br><br> |
1561 <!-- | 1654 Replace: <input type="text" size="23" id="replaceText"><br><br> |
1562 <button onclick="saveText(<?php echo $section_id; ?>)" style="height: 30px; width: 220px">Save the text</button></br> | 1655 <div style="text-align:right"><button onclick="replaceSmartRegex()" class="btn btn-primary btn-sm">Replace</button></div> |
1563 --> | 1656 </div> |
1564 <div class="collapse in" id="tool_edit"> | 1657 </div> |
1565 <button onclick="editText()" id="editTextId" class="btn btn-default">Edit text</button> | 1658 </div> |
1566 <button onclick="Undo()" class="btn btn-default" id="buttonUndo" disabled="true">Undo changes</button> | 1659 |
1567 | 1660 <div class="panel panel-default"> |
1568 <button onclick="saveTextToLGService()" id="save_text_to_LGService_id" class="btn btn-default btn-block">Save to LGService</button> | 1661 <div class="panel-heading" role="tab" id="headingFour"> |
1569 <button onclick="exportAll(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Export All</button> | 1662 <h4 class="panel-title"> |
1570 Page: <input type="text" size="5" id="exportPageStart">to<input type="text" size="5" id="exportPageEnd"> | 1663 |
1571 <button onclick="exportPage(<?php echo $default_topic_id;?>)" class="btn btn-default btn-sm">Export</button></br> | 1664 <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="false" aria-controls="collapseFour"> |
1572 </div> | 1665 <!-- Tag by <i><b>Smart Regex</b></i>©:<span class="caret"></span> --> |
1573 | 1666 Preview<span class="caret"></span> |
1574 | 1667 </a> |
1575 </fieldset> | 1668 </h4> |
1576 | 1669 </div> |
1577 <fieldset class="tool-frame"> | 1670 <div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour"> |
1578 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_regex"> Tag by <i><b>Smart Regex</b></i>©:<span class="caret"></span></h5></legend> | 1671 <div class="panel-body"> |
1579 <!-- rename: "Replace By <i><b>Smart Regex</b></i>©:" to "Tag by Smart Regex" --> | 1672 |
1580 | 1673 <div> |
1581 <div id="tool_regex" class="collapse in"> | 1674 <label> |
1582 <div id="smartRegexShowDiv"></div><br> | 1675 <input type="radio" name="export_mode" onclick="onExportModeChanged(this)" value="all" checked> All |
1583 <!-- <button onclick="smartRegexNew()" class="btn-lg">Add Regex Group</button></br> | 1676 </label> |
1584 --> | 1677 </div> |
1585 <button onclick="smartRegexNew()" id="smart_regex_new_id" class="btn btn-default btn-block">Compile a new Regex</button> | 1678 <div> |
1586 <!-- rename "Search by Patterns (Smart Regex)" to "Compile a new Regex"--> | 1679 <label> |
1587 | 1680 <input type="radio" name="export_mode" onclick="onExportModeChanged(this)" value="pages"> |
1588 <button onclick="smartRegexLoad(<?php echo $default_topic_id; ?>)" class="btn btn-default">Load</button> | 1681 Page: <input type="text" size="5" id="exportPageStart"> to <input type="text" size="5" id="exportPageEnd"> |
1589 <button onclick="smartRegexSave(<?php echo $default_topic_id; ?>)" class="btn btn-default">Save</button> | 1682 </div> |
1590 <button onclick="smartRegexEmpty()" class="btn btn-default">Clear</button></br></br> | 1683 |
1591 Tag only for this range: </br> | 1684 <div style="text-align:right"><button onclick="startExport(<?php echo $default_topic_id;?>)" class="btn btn-primary btn-sm">Preview</button></div> |
1592 <input type="text" size="5" id="regexPageStart">to<input type="text" size="5" id="regexPageEnd"></br> | 1685 </div> |
1593 <button onclick="replaceSmartRun()" class="btn btn-default">Tag</button> | 1686 |
1594 <button onclick="replaceSmartRunWithBr()" class="btn btn-default">Tag (with line break)</button> | 1687 </div> |
1595 <!-- <button onclick="replaceSmartRunSpace()" class="btn-lg">Run(Allow space between Group)</button></br> | 1688 </div> |
1596 --> | 1689 |
1597 <button onclick="replaceSmartRunSpace()" class="btn btn-default btn-block">Tag (Allow space within block)</button></br> | 1690 </div> |
1598 | 1691 |
1599 <!-- developing...--> | |
1600 <!-- | |
1601 <button onclick="genRegexWindowOpen()" id="gen_regex_window_open_id" class="btn btn-default btn-block btn-xs">Open GenRegex (developing...)</button></br> | |
1602 --> | |
1603 </div> | |
1604 </fieldset> | |
1605 | |
1606 | |
1607 <?php | |
1608 if ($default_topic_id == 1) { | |
1609 ?> | |
1610 <fieldset class="tool-frame"> | |
1611 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_rule"> Tag by rule: <span class="caret"></span></h5></legend> | |
1612 <div id="tool_rule" class="collapse out"> | |
1613 <button onclick="tagNameWithLastName()" class="btn btn-default">Tag Word Begin With Surname</button></br> | |
1614 <button onclick="tagNameWithLastName2()" class="btn btn-default btn-sm">Tag Word Begin With</button> <input type="text" size="2" id="surname"> | |
1615 </div> | |
1616 <!--<button onclick="tagTime()" style="height: 30px; width: 220px">Tag Time</button></br>--> | |
1617 <!--<button onclick="tagBiogAddr()" style="height: 30px; width: 220px">Tag BiogAddr</button></br>--> | |
1618 </fieldset> | |
1619 | |
1620 <?php }?> | |
1621 | |
1622 | |
1623 | |
1624 <fieldset class="tool-frame"> | |
1625 <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_replace_by"> Replace By <i><b>Regex</b></i>: <span class="caret"></span></h5></legend> | |
1626 <div class="collapse out" id="tool_replace_by"> | |
1627 Range: <input type="text" size="5" id="regexPageStart2">to<input type="text" size="5" id="regexPageEnd2"><br> | |
1628 Regex: <input type="text" size="23" id="regexText"></br> | |
1629 Replace: <input type="text" size="23" id="replaceText"><br> | |
1630 <button onclick="replaceSmartRegex()" class="btn btn-default btn-sm">Replace!</button> | |
1631 </div> | |
1632 </fieldset> | |
1633 </form> | |
1634 </div> | 1692 </div> |
1635 </td> | 1693 <div id="toRight" onclick="moveToolPanel('right')"><span class="glyphicon glyphicon-arrow-right switch-btn" style="display:none"></span></div> |
1636 </tr> | 1694 </div> |
1637 | 1695 |
1638 </table> | 1696 </div> |
1697 | |
1698 </div> | |
1639 | 1699 |
1640 | 1700 |
1641 | 1701 |
1642 | 1702 |
1643 </body> | 1703 </body> |