# HG changeset patch
# User Zoe Hong <zhong@mpiwg-berlin.mpg.de>
# Date 1433321340 -7200
# Node ID 61593b0472896e29bd9f0e6c5ece74a7330b72a4
# Parent  966a36752c342f796801a1a49b90c536a8b19cb1# Parent  fb5049fc5dd7a9afc78a4279d3c303a379649ca1
merged from extractapp_dev

diff -r 966a36752c34 -r 61593b047289 config/config.php
--- a/config/config.php	Thu Apr 23 17:08:31 2015 +0200
+++ b/config/config.php	Wed Jun 03 10:49:00 2015 +0200
@@ -22,17 +22,17 @@
 			$mysql_server = "localhost";
 			$mysql_user = "root";
 			$mysql_password = "admin";
-			$server_host = "http://localgazetteers-dev/";
+			$server_host = "http://localgazetteers/";
 			$lgserver_url = $server_host."LGServices/";
 
 		} else {
 			// localhost
-			$mysql_database = "Gazetteers";
+			$mysql_database = "Gazetteer";
 			$mysql_server = "localhost";
 			$mysql_user = "root";
 			$mysql_password = "root";
 			$server_host = "http://localhost:1080/localgazetteers-dev/";
-			$lgserver_url = "http://localgazetteers-dev/LGServices/";
+			$lgserver_url = "http://localgazetteers/LGServices/";
 		}
 
 		$systemNAME = "interface";
diff -r 966a36752c34 -r 61593b047289 controllers/extractapp.php
--- a/controllers/extractapp.php	Thu Apr 23 17:08:31 2015 +0200
+++ b/controllers/extractapp.php	Wed Jun 03 10:49:00 2015 +0200
@@ -59,6 +59,8 @@
         
         if (isset($this->postdata['func'])) {
             $func = $this->postdata['func'];
+        } else {
+            $func = "";
         }
         switch ($func) {
             case 'SaveFullText':
@@ -66,11 +68,20 @@
                 $this->ReturnView($viewmodel->StartTagging(), true); 
                 break;   
             case 'SaveFullTextToLGService':
-                $viewmodel->messages['info'] .= "SaveFullTextToLGService! ";
-                $viewmodel->SetInfoFromPreviousPage($this->postdata);
-                $response = $viewmodel->SaveFullTextToLGService($this->postdata);
-                $viewmodel->UpdateInfoResponsedFromLGService($response);    // update file_id, branch_id, user_id
-                $viewmodel->SetTextFromFileId();     
+                global $AT_LOCAL;
+                if ($AT_LOCAL) {
+                    $viewmodel->messages['info'] .= "SaveFullTextToLGService! (local test) ";
+                    $viewmodel->SetInfoFromPreviousPage($this->postdata);
+                    $response = $viewmodel->SaveFullTextToLGService($this->postdata);
+                    
+                } else {
+
+                    $viewmodel->messages['info'] .= "SaveFullTextToLGService! ";
+                    $viewmodel->SetInfoFromPreviousPage($this->postdata);
+                    $response = $viewmodel->SaveFullTextToLGService($this->postdata);
+                    $viewmodel->UpdateInfoResponsedFromLGService($response);    // update file_id, branch_id, user_id
+                    $viewmodel->SetTextFromFileId();     
+                }
                 $this->ReturnView($viewmodel->StartTagging(), true); 
                 break;
 
diff -r 966a36752c34 -r 61593b047289 css/taggingtext.css
--- a/css/taggingtext.css	Thu Apr 23 17:08:31 2015 +0200
+++ b/css/taggingtext.css	Wed Jun 03 10:49:00 2015 +0200
@@ -1,18 +1,56 @@
 .bg-danger{
 	background-color: #FFD1D1;
+	margin: 5 5 5 5;
 }
 
 .bg-warning{
 	background-color: #FFFF99;
+	margin: 5 5 5 5;
 }
-
+.bg-success{
+	background-color: #ADFAAA;
+	margin: 5 5 5 5;
+}
 .bg-info{
 	background-color: #E7F3FF;
-
+	margin: 5 5 5 5;
 }
 .bg-default{
 	background-color: #F4F4F4;
+	margin: 5 5 5 5;
 }
+.bg-white{
+	background-color: white;
+	margin: 5 5 5 5;
+}
+/*
+.btn-xs{
+	height: 25px;
+	width: 60px;
+}
+.btn-sm{
+	height: 35px; 
+	width: 70px;
+}
+.btn-md{
+	height: 35px;
+	width: 110px;
+}
+.btn-lg{
+	height: 35px; 
+	width: 220px;
+}
+
+*/
+.tool-frame .btn{
+	background-color: #F4F4F4;
+}
+
+.btn:hover {
+	border: 2px solid #A1A1A1;
+    border-radius: 4px;
+}
+
 
 .info-board{
 	margin:10 30 10 30;
@@ -21,18 +59,32 @@
 	min-width: 680px;
 	border: 2px solid #A1A1A1;
     border-radius: 4px;
-	height:70px;
+	max-height:70px;
 	overflow:scroll;
 	overflow-x:hidden;
 }
+
+
 #follow-scroll {
 	position:absolute; 
 	height:680px; 
 	overflow:scroll; 
 	margin:0 5 15 5; 
 	max-width:280px; 
-	border: 1px solid #A1A1A1;
-	border-radius: 4px;
+}
+
+.tool-frame{
+	background-color: white;
+	border: 2px solid #A1A1A1;
+	border-radius: 3px;
+	padding: 5px;
+}
+.tool-topic {
+	background-color: #E7F3FF;
+	border-radius: 3px;
+}
+.tool-topic:hover{
+	border: 2px solid #E7F3FF;
 }
 
 .popup-frame {
@@ -45,26 +97,44 @@
 }
 
 .popup-regex {
-	left: -400px;
-	width: 400px;
+	left: -450px;
+	width: 450px;
 	height: 300px;
-	top: 100px;
+	top: 120px;
 	z-index: 2;
 }
 
 .popup-loadregex{
 	left: -300px;
 	width: 300px;
-	height: 70px;
+	height: 85px;
 	top: 100px;
-	z-index: 2;
+	z-index: 3;
 
 }
 
 .popup-topic {
-	left: -200px;
-	width: 200px;
-	height: 50px;
+	left: -250px;
+	width: 250px;
+	height: 80px;
 	top: 20px;
 	z-index: 2;
 }
+
+.tagItemDivClass {
+	position:absolute; 
+	background-color: white; 
+	border: 2px solid #A1A1A1;
+	border-radius: 4px;	
+	padding: 5px; 
+	z-index:5;
+}
+
+.questionMarkClass {
+	position:absolute; 
+	background-color: white; 
+	border: 2px solid #A1A1A1;
+	border-radius: 4px;	
+	padding: 5px; 
+	z-index:4;
+}
diff -r 966a36752c34 -r 61593b047289 js/taggingtext.js
--- a/js/taggingtext.js	Thu Apr 23 17:08:31 2015 +0200
+++ b/js/taggingtext.js	Wed Jun 03 10:49:00 2015 +0200
@@ -238,16 +238,19 @@
 
 
 function removeTagNewDiv( eventObject, tagName, tagObject ) {
+    // TODO: nesting tag representaion
+
     saveUndoText();
     var newdiv = document.createElement("div");
-    newdiv.id = "questionMarkId";
-    newdiv.setAttribute("class", "questionMarkClass");
+    $(newdiv).id = "questionMarkId";
+    $(newdiv).attr("class", "questionMarkClass");
 
     // set z-index to 3 to bring popup tag windwo to front
-    newdiv.style.cssText = 'top:'+eventObject.pageY+'; left:'+eventObject.pageX+'; position:absolute; background-color: white; border:1px solid black; padding: 5px; z-index:3';
+    newdiv.style.cssText = 'top:'+eventObject.pageY+'; left:'+eventObject.pageX+';';
+    
     newdiv.innerHTML = "Tag: "+tagName+"<br>Value: "+tagObject.text()+"<br>";
     
-    var newbutton = $('<button>Remove this</button>').mouseup(function (e2) {
+    var newbutton = $('<button class="btn btn-default">Remove this</button>').mouseup(function (e2) {
         var textKeep = $(this).parent().parent().html();
         var regexText=/<div(.*?)<\/div>/g;
         var replaceText="";
@@ -257,7 +260,7 @@
     });
     newbutton.appendTo(newdiv);
     
-    var newbutton = $('<button>Remove this(with newline)</button>').mouseup(function (e2) {
+    var newbutton = $('<button class="btn btn-default">Remove this(with newline)</button>').mouseup(function (e2) {
         var textKeep = $(this).parent().parent().html();
         var regexText=/<div(.*?)<\/div>/g;
         var replaceText="";
@@ -271,7 +274,7 @@
     });
     newbutton.appendTo(newdiv);
     
-    var newbutton = $('<button>Remove all</button>').mouseup(function (e2) {
+    var newbutton = $('<button class="btn btn-default">Remove all</button>').mouseup(function (e2) {
         var textKeep = $(this).parent().parent().html();
         var regexText=/<div(.*?)<\/div>/g;
         var replaceText="";
@@ -293,7 +296,7 @@
     });
     newbutton.appendTo(newdiv);
     
-    var newbutton = $('<button>Remove all(with newline)</button>').mouseup(function (e2) {
+    var newbutton = $('<button class="btn btn-default">Remove all(with newline)</button>').mouseup(function (e2) {
         var textKeep = $(this).parent().parent().html();
         var regexText=/<div(.*?)<\/div>/g;
         var replaceText="";
@@ -464,7 +467,14 @@
 }
 
 function smartRegexNew() {
-    $('#smartRegexPopUpDiv').css("display", "block");
+
+    var popup_status = $('#smartRegexPopUpDiv').css("display");
+    if (popup_status == "block") {
+        $('#smartRegexPopUpDiv').css("display", "none");
+    } else {
+        $('#smartRegexPopUpDiv').css("display", "block");
+    }
+
 
     $('#smartRegexPopUpAdd').attr("disabled", false);
     $('#smartRegexPopUpEdit').attr("disabled", "disabled");
@@ -476,8 +486,6 @@
 
 function replaceSmartClose() {
     $('#smartRegexShowDiv > span').css("border","1px solid black");
-
-
     $('#smartRegexPopUpDiv').css("display", "none");
     $("#smartRegexPopUpSelectWord").val("NULL");
     $("#smartRegexPopUpText").val("");
@@ -545,6 +553,7 @@
     replaceSmartClose();
 }
 
+
 $(document).on("click", '#smartRegexShowDiv > span', function (e) {
     
     
@@ -566,6 +575,247 @@
     $('#smartRegexPopUpFor').attr("disabled", false);
 });
 
+function genRegexWindowOpen(){
+    var btn_state = $('#regex_generator').css('display');
+    if (btn_state == "block") {
+        $("#regex_generator").css("display", "none");
+        $("#gen_regex_window_open_id").text("Open Gen Regex");
+    } else { 
+        $('#regex_generator').css("display", "block");
+        $("#gen_regex_window_open_id").text("Close Gen Regex");
+    }
+}
+function genRegexWindowClose(){
+    $('#regex_generator').css("display", "none");
+}
+
+function sharedStart_(array){
+    var A= array.concat().sort(), 
+    a1= A[0], a2= A[A.length-1], L= a1.length, i= 0;
+    while(i<L && a1.charAt(i)=== a2.charAt(i)) i++;
+    return a1.substring(0, i);
+}
+
+function longestCommonSubstring_(string1, string2){
+    // init max value
+    var longestCommonSubstring = 0;
+    // init 2D array with 0
+    var table = [],
+        len1 = string1.length,
+        len2 = string2.length,
+        row, col;
+    
+    for(row = 0; row <= len1; row++){
+        table[row] = [];
+        for(col = 0; col <= len2; col++){
+            table[row][col] = 0;
+        }
+    }
+    // fill table
+    var i, j;
+    for(i = 0; i < len1; i++){
+        for(j = 0; j < len2; j++){
+            if(string1[i]==string2[j]){
+                if(table[i][j] == 0){
+                    table[i+1][j+1] = 1;
+                } else {
+                    table[i+1][j+1] = table[i][j] + 1;
+                }
+                if(table[i+1][j+1] > longestCommonSubstring){
+                    longestCommonSubstring = table[i+1][j+1];
+                }
+            } else {
+                table[i+1][j+1] = 0;
+            }
+        }
+    }
+    return longestCommonSubstring;
+}
+
+function longestCommonSubstring(s1, s2) {
+   
+    var start_idx = 0;
+    var max_len = 0;
+    for (var i = 0; i < s1.length; i++)
+    {
+        for (var j = 0; j < s2.length; j++)
+        {
+            var x = 0;
+            while (s1.charAt(i + x) == s2.charAt(j + x))
+            {
+                x++;
+                if ((i + x) >= s1.length || ((j + x) >= s2.length))
+                    break;
+            }
+            if (x > max_len)
+            {
+                max_len = x;
+                start_idx = i;
+            }
+         }
+    }
+    return s1.substring(start_idx, (start_idx + max_len));
+
+}
+
+function getRegex(_pattern) {
+    console.log(_pattern[0]);
+    console.log(_pattern[1]);
+    var p0 = _pattern[0];
+    var p1 = _pattern[1];
+
+    // TODO: find common pattern
+    var reg_str = "";
+    // _p1 = 測試
+    // _p2 = 測<tag_name>試</tag_name>一下
+    var combined = [];
+    if (p0.length > p1.length) {
+        combined = p0;
+    } else if(p0.length < p1.length) {
+        combined = p1;
+    } else {    // equal length
+        // find matching string
+        var cnt = p0.length;
+        for (var i = 0;  i < cnt; i++) {
+            if (p1[i].tag != null) {
+                combined.push({tag:p1[i].tag, txt:"[^○如即而之有<>〈〉【】]{1,"+p1[i].txt.length+"}"});
+            } else if (p0[i].tag != null) {
+                combined.push({tag:p0[i].tag, txt:"[^○如即而之有<>〈〉【】]{1,"+p0[i].txt.length+"}"});
+            } else {
+                // find matching for text in each corresponding position
+                var texts = [p0[i].txt, p1[i].txt];
+                var common = longestCommonSubstring(p0[i].txt, p1[i].txt);
+                
+                /*
+                var reg_for_common = "[";
+                for (var i = 0; i < common.length; i++) {
+                    common[i];
+                    reg_for_common += common[i]+"|";
+                };
+                reg_for_common += "]";
+                */
+                combined.push({tag:null, txt:common});
+            }
+        };
+    }
+
+    for (var i = 0; i < combined.length; i++) {
+       reg_str += combined[i].txt;
+    };
+
+    return reg_str;
+}
+
+var pattern_obj = [];  // record pattern array for regex generator. only contain pattern1 and pattern2
+
+function genRegexBySelection(tag_item_div, _selection) {
+    var add_gen_regex_button = document.createElement("button");
+    $(add_gen_regex_button).id = "addToGenRegex";
+    $(add_gen_regex_button).addClass("btn btn-md");
+    $(add_gen_regex_button).click( function(){
+        // popup for selected words regex gen
+        console.log("Debug: ");
+        console.log(_selection);
+
+        if (_selection.type == "Range") {
+            // select words, not just click on text
+            var anchor_node = _selection.anchorNode;
+            var focus_node = _selection.focusNode;
+            var sibling_node = anchor_node.nextElementSibling;
+            
+
+            if (anchor_node && sibling_node && focus_node && container.innerHTML.indexOf( "br" ) == -1) {
+                // Chrome can work on this.
+                // Safari does not support some of the member in selection object
+                // container.innerHTML.indexOf( "br" ) == -1: selection does not contain br.
+
+                var seleted_div = document.createElement("div");
+                var seleted_obj = [];   // array for selected text as well as its tag if it has any
+
+                if (anchor_node == focus_node ) { 
+                    // selected text in plain text
+                    var text_all = anchor_node.textContent;
+                    var text_ = text_all.substring(_selection.anchorOffset, _selection.focusOffset);
+                    $(seleted_div).text(text_);
+                    seleted_obj.push({tag:null, txt:text_});    // push object into array
+
+                } else {
+                    // selected text contain tags
+                    var text_before = anchor_node.textContent.substring(_selection.anchorOffset, anchor_node.length);
+                    var tag_name = sibling_node.nodeName.toLowerCase();
+                    var tagged_text = sibling_node.textContent;
+
+                    var text_after = _selection.focusNode.textContent.substring(0, _selection.focusOffset);
+
+                    $(seleted_div).text(text_before+tagged_text+text_after);
+                    seleted_obj.push({tag:null, txt:text_before});
+                    seleted_obj.push({tag:tag_name, txt:tagged_text});
+                    seleted_obj.push({tag:null, txt:text_after});
+
+
+                    console.log(text_before);
+                    console.log(tag_name);
+                    console.log(tagged_text);
+                    console.log(text_after);
+                }
+                
+                
+                var generated_regex = "";
+                // show generate regex window
+                $('#regex_generator').css("display", "block");
+                $("#gen_regex_window_open_id").text("Close Gen Regex");
+
+                //var seleted_text = String(_selection).replace(/^\s+|\s+$/g,'');
+                var pattern1 = $('#regex_pattern1');
+                var pattern2 = $('#regex_pattern2');
+                if (pattern1.children().length == 0) {
+                    pattern1.append(seleted_div);
+                    pattern_obj.push(seleted_obj);
+                    // pattern1.text(seleted_div.text());
+                } else if (pattern2.children().length == 0) {
+                    pattern2.append(seleted_div);
+                    pattern_obj.push(seleted_obj);
+                    //pattern2.text(seleted_div.text());
+                    generated_regex = getRegex(pattern_obj);
+
+                } else {
+                    // pattern1 and pattern2 are already having text
+                    pattern1.children().remove();
+                    pattern1.append(pattern2.children());
+
+                    pattern2.children().remove();
+                    pattern2.append(seleted_div);
+
+                    pattern_obj.shift();
+                    pattern_obj.push(seleted_obj);
+
+                    //pattern1.text(pattern2.text());
+                    //pattern2.text(seleted_div);
+                    generated_regex = getRegex(pattern_obj);
+
+                }
+                $('#generated_regex').text(generated_regex);
+                // ---
+
+                $('#regex_generator_error_msg').text("");
+            } else {
+                $('#regex_generator_error_msg').text("Note: Not a valid selection for regex generator.");
+            }
+
+            $('.tagItemDivClass').remove(); // close the tag window
+
+        } else if (_selection.type == "Caret") {
+            // TODO: click on tagged text case rather than select
+            // If do this process, also need to consider between browers since not all of them support
+            // and also need to modify pop_remove_tag_window
+        }       
+    });
+
+    $(add_gen_regex_button).text("Add to Gen Regex");
+    tag_item_div.appendChild(add_gen_regex_button);    
+}
+
+
 function smartRegexEmpty() {
     $('#smartRegexShowDiv').html("");
     regex_element_index = 0;
@@ -789,7 +1039,12 @@
 
 function smartRegexLoad(topic_id) {
     $('#load_regex_div').html("");
-    $('#load_regex_div').css("display", "block");
+    var popup_status = $('#load_regex_div').css("display");
+    if (popup_status == "block") {
+        $('#load_regex_div').css("display", "none");
+    } else {
+        $('#load_regex_div').css("display", "block");
+    }
 
     var newselect = document.createElement("select");
     newselect.id = "loadRegexSelect";
diff -r 966a36752c34 -r 61593b047289 models/extractapp.php
--- a/models/extractapp.php	Thu Apr 23 17:08:31 2015 +0200
+++ b/models/extractapp.php	Wed Jun 03 10:49:00 2015 +0200
@@ -27,7 +27,9 @@
 class ExtractappModel extends BaseModel{
     
     protected $section_id = 0, $data_path, $file_id = 0, $current_fileId=0, 
-        $branch_id = 0, $user_id = 0, $lg_text = "", $topic, $taglist_infile = "", $book_meta = "",$book_dynasty="";
+        $branch_id = 0, $user_id = 0, $lg_text = "", $topic, $taglist_infile = "", 
+        $book_meta = "", $book_dynasty = "";
+
     public $messages = array('info'=>"",'error'=>"",'warning'=>"",'debug'=>"");
 
 
@@ -76,11 +78,44 @@
         $section_meta = json_decode(file_get_contents($section_meta_url), true);
 
         $b = $section_meta['section']['book'];
-
+        
+        $this->book_name = $b['name'];
+        $this->book_id = $b['id'];
+        /*
         $book_meta = array();
         array_push($book_meta, array($b['id'],$b['name'],$b['level1'],$b['level2'],
                     $b['period'],$b['dynasty'], $b['start_year'], $b['end_year'],$b['line'],
                     $b['volume'],$b['author'], $b['edition'],$b['in_jibengujiku'], $b['admin_type']));    // missing author,year,pagenumber
+        */
+        /*
+        $book_meta = array('id'=>$b['id'],'name'=>$b['name'],'level1'=>$b['level1'],'level2'=>$b['level2'],
+                    'period'=>$b['period'],'dynasty'=>$b['dynasty'],'start_year'=>$b['start_year'], 'end_year'=>$b['end_year'],'line'=>$b['line'],
+                    'volume'=>$b['volume'],'author'=>$b['author'],'edition'=>$b['edition'],
+                    'in_jibengujiku'=>$b['in_jibengujiku'],'admin_type'=>$b['admin_type']);    // missing author,year,pagenumber
+        */
+
+        $book_meta->id = $b['id'];
+        $book_meta->name = $b['name'];
+        $book_meta->level1 = $b['level1'];
+        $book_meta->level2 = $b['level2'];
+        $book_meta->period = $b['period'];
+        $book_meta->dynasty = $b['dynasty'];
+        $book_meta->start_year = $b['start_year'];
+        $book_meta->end_year = $b['end_year'];
+        $book_meta->line = $b['line'];
+        $book_meta->volume = $b['volume'];
+        $book_meta->author = $b['author'];
+        $book_meta->edition = $b['edition'];
+        $book_meta->in_jibengujiku = $b['in_jibengujiku'];
+        $book_meta->admin_type = $b['admin_type'];
+
+        $coordinates = $section_meta['section']['coordinates_books'];
+        $book_meta->x = $coordinates['x'];
+        $book_meta->y = $coordinates['y'];
+        $book_meta->place_name = $coordinates['place_name'];
+
+
+
         $this->book_meta = $book_meta;
 
     }
@@ -213,7 +248,7 @@
         return true;
        
     }
-
+    
     // === for tagging ===
     public function StartTagging() {
         /**
@@ -229,7 +264,7 @@
         //$taglistArray = $this->GetTaglistArray();
         //for GetTaglistByTopicId: 
         $taglistArray = $this->GetTaglistByTopicId($this->GetTopic());
-        
+
         // $this->taglist_infile is set (1) from file or (2) from _postdata['taglistArray'] which comes from frontend that user decided
         // $this->taglist_infile is the most up-to-date taglist decided by user. Should be written into file.
         if( $this->TaglistSubsetIn($this->taglist_infile, $taglistArray) ) {    // TaglistSubsetIn($l1,$l2): $l1 is a subset of $l2 or not
@@ -253,13 +288,16 @@
         $data['section_id'] = $section_id;
         $data['topiclistArray'] = $topiclistArray;
         $data['default_topic_id'] = $this->GetTopic();
-        $data['topic_tag'] = $this->GetTopicTag($this->GetTopic());
-        $data['topic_name'] = $this->GetTopicName($this->GetTopic());
+        $topic_id = $this->GetTopic();
+
+        $data['topic_tag'] = $this->GetTopicTag($topic_id);
+        $data['topic_name'] = $this->GetTopicName($topic_id);
+        $data['topic_tag_ch'] = $this->GetTopicTagName($topic_id);
 
 
         $data['info'] = array('file_id'=>$this->file_id, 'user_id'=>$this->user_id,
                 'branch_id'=>$this->branch_id, 'section_id'=>$this->section_id, 'book_id'=>$this->book_id, 
-                'book_name'=>$this->book_name, 'section_name'=>$this->section_name,
+                'book_name'=>$this->book_name,'section_name'=>$this->section_name, 'period'=>$this->book_meta->period,
                 'current_fileId'=>$this->current_fileId);
 
         $this->messages['debug'] .= "[Debug] ";
@@ -272,6 +310,7 @@
         $this->messages['info'] .= ", section id: ". $this->section_id;
         $this->messages['info'] .= ", branch id: ".$this->branch_id;
         $this->messages['info'] .= ", file id: ".$this->file_id;
+        $this->messages['info'] .= ", period: ".$this->book_meta->period;
         $this->messages['info'] .= "<br>";
 
 
@@ -308,10 +347,9 @@
 
     public function UpdateInfoResponsedFromLGService($response) {
         /**
-         *
+         * 
          */
 
-
         if (isset($response["file"])) {
             $response_file = $response["file"];
         }
@@ -353,6 +391,29 @@
         $text .= "<topic>".$this->topic."</topic>\n";
         // --- book meta data ---
         $book = $this->book_meta;
+       
+        $text .= "<book>\n";
+            $text .= "<id>".$book->id."</id>\n";
+            $text .= "<name>".$book->name."</name>\n";
+            $text .= "<level1>".$book->level1."</level1>\n";
+            $text .= "<level2>".$book->level2."</level2>\n";
+            $text .= "<period>".$book->period."</period>\n";
+            $text .= "<dynasty>".$book->dynasty."</dynasty>\n";
+            $text .= "<start_year>".$book->start_year."</start_year>\n";
+            $text .= "<end_year>".$book->end_year."</end_year>\n";
+            $text .= "<line>".$book->line."</line>\n";
+            $text .= "<volume>".$book->volume."</volume>\n";
+            $text .= "<author>".$book->author."</author>\n";
+            $text .= "<edition>".$book->edition."</edition>\n";
+            $text .= "<in_jibengujiku>".$book->in_jibengujiku."</in_jibengujiku>\n";
+            $text .= "<admin_type>".$book->admin_type."</admin_type>\n";
+       
+            $text .= "<place_name>".$book->place_name."</place_name>\n";
+            $text .= "<x>".$book->x."</x>\n";
+            $text .= "<y>".$book->y."</y>\n";
+        $text .= "</book>\n";
+        
+        /*
         foreach ($book as $b) {
             $text .= "<book>\n";
             $text .= "<id>".$b[0]."</id>\n";
@@ -372,6 +433,8 @@
             $text .= "</book>\n";
             
         }
+        */ 
+
         // --- section info ---
         $text .= "<section>\n";
         $text .= "<id>".$this->section_id."</id>\n";
@@ -1086,7 +1149,6 @@
         $row = mysql_fetch_assoc($result);
         $tag = $row['tag'];
         return $tag;
-
     }
     private function GetTopicName($topic_id) {
         $result = $this->GetTopicById($topic_id);
@@ -1094,10 +1156,19 @@
         //$name = $row['name'];
         $name = array('name_en'=>$row['name_en'], 'name_ch'=>$row['name_ch'], 'name_pinyin'=>$row['name_pinyin']);
         return $name;
+    }
+    private function GetTopicTagName($topic_id) {
+        $topic_tag = $this->GetTopicTag($topic_id);
+        $query = "SELECT * FROM `taglist` WHERE tag='".$topic_tag."'";
+        $result = mysql_query($query);
+        $row = mysql_fetch_assoc($result);
 
+        return $row['name'];
     }
 
 
+
+
     // =========================== 
 
     // === for manage wordlist ===
@@ -1290,6 +1361,8 @@
         $bookId = $section_info['bookId'];
         $startPage = $section_info['startPage'];
         $endPage = $section_info['endPage'];
+        $this->section_name = $section_info['sectionName'];
+
 
         $contentString="";
         $data_path = $this->GetDataPath();
diff -r 966a36752c34 -r 61593b047289 views/Extractapp/TaggingText.php
--- a/views/Extractapp/TaggingText.php	Thu Apr 23 17:08:31 2015 +0200
+++ b/views/Extractapp/TaggingText.php	Wed Jun 03 10:49:00 2015 +0200
@@ -40,6 +40,7 @@
 $default_topic_id = $viewmodel['default_topic_id'];
 $topic_name = $viewmodel['topic_name']; // array of names
 $topic_tag = $viewmodel['topic_tag'];
+$topic_tag_ch = $viewmodel['topic_tag_ch'];
 $info = $viewmodel['info']; 
 $messages = $viewmodel['messages'];
 
@@ -53,7 +54,9 @@
 <head>
     <meta charset="UTF-8">
     <title>Extraction Interface</title>
-
+    <meta http-equiv="no-cache">
+    <meta http-equiv="Expires" content="-1">
+    <meta http-equiv="Cache-Control" content="no-cache">
 <style>
 dynasty
 {
@@ -91,6 +94,8 @@
 
 <script type="text/javascript">
 
+var cjst = window.cjst; // for pinyin from cjst.js
+
 // not use this for now
 function _showTagColor(up_to_date) {
     var taglistArray = "";
@@ -211,6 +216,7 @@
     });
     // ---
 
+
     //--- for popups ---
     //run once
     var el=$('#popups');
@@ -247,7 +253,7 @@
     var info = JSON.parse('<?php echo json_encode($info) ?>');
     // the first time to this section. without branch_id and file_id
     if (info['file_id'] == 0) {  // or info['branch_id'] == 0, means new file
-        $( "#saveTextToLGService_id").text( "Create(Save) Branch to LGService" );
+        $( "#save_text_to_LGService_id").text( "Create(Save) Branch to LGService" );
 
     }
     handleFileVersionConflict();
@@ -266,7 +272,7 @@
 
         // TOOD: ask user to modify/decide tags
         // showing taglist_infile and taglistArray
-        alert("Warning: taglist is deprecated in the current file.");
+        //alert("Warning: taglist is deprecated in the current file.");
 
     }
 
@@ -285,15 +291,20 @@
     container = document.createElement("div");
     container.appendChild(selection.getRangeAt(0).cloneContents());
 
-    if(selection && (selection = new String(selection).replace(/^\s+|\s+$/g,''))) {
+    if(selection && (selection_plain = new String(selection).replace(/^\s+|\s+$/g,''))) {
         try{
         	var newdiv = document.createElement("div");
-            newdiv.id = "tagItemDivId";
-            newdiv.setAttribute("class", "tagItemDivClass");
-            newdiv.style.cssText = 'top:'+e.pageY+'; left:'+e.pageX+'; position:absolute; background-color: white; border:1px solid black; padding: 5px; z-index:4';
-            
+            //newdiv.id = "tagItemDivId";
+            //newdiv.setAttribute("class", "tagItemDivClass");
+            $(newdiv).id = "tagItemDivId";
+            $(newdiv).addClass("tagItemDivClass");
+            newdiv.style.cssText = 'top:'+e.pageY+'; left:'+e.pageX+';';
             //console.log(selection.getRangeAt(0).cloneContents());
             if ( container.innerHTML.indexOf( "br" ) != -1 ) {
+                // when selected words containing tags (i.e. has 'br' in the selected string), 
+                // which means user want to apply Title / or tags all in once at each line
+                // This may not be the best checking solution, since 'br' also appears between not-tagged words
+
                 var newselect = document.createElement("select");
                 newselect.id = "TitletagType";
                 //console.log(JSON.parse('<?php echo json_encode($taglistArray) ?>'));
@@ -314,8 +325,6 @@
                 } else {
                     newdiv.innerHTML += "<input id=\"TitletagName\" value=\"\"></br>";
                 }
-
-
                 newdiv.innerHTML += "<button onclick=\"addTagTitle( range, container )\">Add Title Tag To Each Line</button></br>";
                 
                 /*
@@ -335,57 +344,52 @@
                 newdiv.innerHTML += "<button onclick=\"removeTagTitle( range, container )\">Remove</button></br>";
             } else {
      			// for pop up window on edit-area for tag list
-                newdiv.innerHTML = "Tag: "+String(selection)+"<br>";
-                
+                // newdiv.innerHTML = "Tagging word: "+String(selection)+"<br>";
+                var tagging_words = document.createElement("div");
+                $(tagging_words).addClass("bg-info");
+                $(tagging_words).text("Tagging words: " + String(selection_plain));
+
+                newdiv.appendChild(tagging_words);
+
+                var tagging_tags = document.createElement("div");
+                $(tagging_tags).addClass("bg-white");
+                $(tagging_tags).text("Tag as: ");
+
+                tagging_tags.innerHTML += "<button accesskey=\"2\" onclick=\"tagwithtitle( range, '"+String(selection_plain)+"' )\">Title</button></br>";
+               
                 <?php 
                 foreach ( $taglistArray as $taglistValue ) {
-
                     if ($taglistValue[2] == $topic_tag) {
-                    	echo "newdiv.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."2' )\\\">[TopicTag]Tag as:".$taglistValue[1]."(necessary for this topic!)</button>\";\n";
-                        echo "newdiv.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(No BR)</button>\";\n";
-                        echo "newdiv.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
-                        
-                        /*
-                        echo "newdiv.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(No BR)</button>\";\n";
-                        echo "newdiv.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."2' )\\\">Tag as:".$taglistValue[1]."</button>\";\n";
-                        echo "newdiv.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
-                		*/
+                    	echo "tagging_tags.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection_plain)+\"', '".$taglistValue[2]."2' )\\\">".$taglistValue[1]."</button>\";\n";
+                        echo "tagging_tags.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection_plain)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(without new line)</button>\";\n";
+                        echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection_plain)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n";
                         break;
                 	}
                 }
+			    foreach ( $taglistArray as $taglistValue ) {
+                    if ($taglistValue[2] == $topic_tag) { 
+                		// pass
+                	} else if ($taglistValue[2] == "post_time") {
+                        echo "tagging_tags.innerHTML += \"<button accesskey=\\\"3\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."</button>\";\n";
+                        echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
+                    } else if ($taglistValue[2] == "office") {
+                        echo "tagging_tags.innerHTML += \"<button accesskey=\\\"4\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."</button>\";\n";
+                        echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n";
+                    } else {
+                        echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."</button>\";\n";
+                        echo "tagging_tags.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">".$taglistValue[1]."(ALL)</button></br>\";\n";
+                    } 
+                }
                 ?>
 
-                newdiv.innerHTML += "<button accesskey=\"2\" onclick=\"tagwithtitle( range, '"+String(selection)+"' )\">Tag As Title</button></br>";
-                
-                <?php 
-                	
-    			    foreach ( $taglistArray as $taglistValue ) {
-                    	/*
-                    	if ( $taglistValue[2] == "person") {
-                            echo "newdiv.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(No BR)</button>\";\n";
-                            echo "newdiv.innerHTML += \"<button accesskey=\\\"1\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."2' )\\\">Tag as:".$taglistValue[1]."</button>\";\n";
-                            echo "newdiv.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
-                    	} else */
-                        if ($taglistValue[2] == $topic_tag) { 
-                    		// pass
-                    	} else if ($taglistValue[2] == "post_time") {
-                            echo "newdiv.innerHTML += \"<button accesskey=\\\"3\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."</button>\";\n";
-                            echo "newdiv.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
-                        } else if ($taglistValue[2] == "office") {
-                            echo "newdiv.innerHTML += \"<button accesskey=\\\"4\\\" onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."</button>\";\n";
-                            echo "newdiv.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
-                        } else {
-                            echo "newdiv.innerHTML += \"<button onclick=\\\"tagwithOnlytag( range, '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."</button>\";\n";
-                            echo "newdiv.innerHTML += \"<button onclick=\\\"tagStringWithTag( '\"+String(selection)+\"', '".$taglistValue[2]."' )\\\">Tag as:".$taglistValue[1]."(ALL)</button></br>\";\n";
-                        } 
+                newdiv.appendChild(tagging_tags);
+                // add selected words to generator regex
+                genRegexBySelection(newdiv, selection); // append button to newdiv and handle the selection words
 
-                    }
-                ?>
             }
 
             //$('#tagItemDivId').addClass();  // tagItemDivId is newdiv's id
             $('body').append(newdiv);
-            
             $('#TitletagType').val(lastAddTag);
 
             // selected some words, so hide popping up remove-tag-window
@@ -400,15 +404,9 @@
         pop_remove_tag_window = true;
     }
 
-
-
     //e.stopPropagation();
-
-
-
 });
 
-
 // === for exporttable.php ===
 function exportTable( range, container ) {
     //MsgBox("enter function");
@@ -637,6 +635,7 @@
     var topic_id = JSON.parse('<?php echo json_encode($default_topic_id) ?>');
 
     // if this is a new branch, ask for label
+    // if (info['branch_id'] == 0) {
     if (info['branch_id'] == 0) {
         //var label = prompt("Please enter your label for this new branch", "section"+info['section_id']);
         var today = new Date();
@@ -651,11 +650,23 @@
             mm='0'+mm
         } 
         today = dd+'.'+mm+'.'+yyyy;
-        var label = prompt("Please enter your label for this new branch", today);
+        var book_name = info['book_name'];
+        var section_name = info['section_name'];
+        var period = info['period'];
+
+        var default_label = "";
+        if (book_name == "" || section_name == "" || period == "") {
+            default_label = today;
+        } else {
+            default_label = book_name+"("+cjst.chineseToPinyin(book_name).join(' ')+")_"+period+ "_"+section_name
+                        + "("+ cjst.chineseToPinyin(section_name).join(' ') + ")_" + today;
+        }
+        
+
+        var label = prompt("Please enter your label for this new branch", default_label);
         while (label == null) {
             alert("You haven't saved your editing.");
             return;
-            // label = prompt("Please enter your label for this new branch (not empty)", "section"+info['section_id']);
         }    
     };
     
@@ -690,9 +701,13 @@
     var t = JSON.parse( '<?php echo json_encode($topiclistArray) ?>' );
     var info = JSON.parse('<?php echo json_encode($info) ?>');
 
-
     $('#load_topic_div').html("");
-    $('#load_topic_div').css("display", "block");
+    var popup_status = $('#load_topic_div').css("display");
+    if (popup_status == "block") {
+        $('#load_topic_div').css("display", "none");
+    } else {
+        $('#load_topic_div').css("display", "block");
+    }
     /*
     $('#load_topic_div').css("border", "1px solid black");
     $('#load_topic_div').css("background-color", "White");
@@ -780,6 +795,7 @@
     hiddenField.setAttribute("name", "book_meta");
     var book_metaObj = JSON.parse('<?php echo json_encode($book_meta) ?>');
     book_metaArray = JSON.stringify(book_metaObj);
+
     hiddenField.setAttribute("value", book_metaArray);
     form.appendChild(hiddenField);    
 
@@ -882,10 +898,24 @@
     }
 });
 
+
 </script>
- 
-<div id="dialog-form" title="config tags for topic" style="position:fixed; top: 30px; ">
-</div>
+
+
+<!--
+<fieldset class="info-board">
+    <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#info_board">Information <span class="caret"></span></h5></legend>
+    <div id="info_board" class="collapse in">
+        <div class="bg-danger"><strong><?php echo $messages['error']; ?> </strong></div>
+        <div class="bg-warning"> <?php echo $messages['warning']; ?> 
+            <button id="reloadTextButton" onclick="reloadText(<?php echo $default_topic_id; ?>)" style="display:none;">Latest Version</button>
+        </div>
+        <div class="bg-info"> <?php echo $messages['info']; ?> </div>
+        <div class="bg-default"> <?php echo $messages['debug']; ?> </div>
+    </div>
+</fieldset>
+
+-->
 
 <div class="info-board">
     <div class="bg-danger"><strong><?php echo $messages['error']; ?> </strong></div>
@@ -896,7 +926,8 @@
     <div class="bg-default"> <?php echo $messages['debug']; ?> </div>
 </div>
 
-<table border="1" style="margin:10 30 30 30; width:100%; max-width:1270px">
+
+<table border="1" style="margin:10 30 30 30; width:100%; max-width:1270px; min-width:680px">
     <tr>
         <td style="padding:0 5 0 5; margin: 0 5 0 5;">
             <div id="editable-area" class="area" style="max-width:980px; min-width:400px"><?php echo $stringInput; ?></div>
@@ -905,6 +936,20 @@
             <div id="popups" style="position:absolute; width:300px; ">
                 <div id="load_topic_div" class="popup-topic popup-frame"></div>
                 <div id="load_regex_div" class="popup-loadregex popup-frame"></div>
+                <div id="regex_generator" class="popup-regex popup-frame">
+                    <h3>Gen Regex</h3>
+                    <div>Pattern 1: 
+                        <div id="regex_pattern1" class="bg-info"></div>
+                    </div>
+                    <div>Pattern 2:
+                        <div id="regex_pattern2" class="bg-info"></div>
+                    </div>
+                    <div>Suggested Regex: 
+                        <div id="generated_regex" class="bg-success"></div>
+                    </div>
+                    <button onclick="genRegexWindowClose()" class="btn btn-default btn-xs">Close</button>
+                    <div id="regex_generator_error_msg" class="bg-white"></div>
+                </div>
                 <div id="smartRegexPopUpDiv" class="popup-regex popup-frame">
                     Name: <input id="smartRegexPopUpName"></input><br><br>
                     Word List: 
@@ -940,67 +985,94 @@
 
             <div id="follow-scroll">
                 <form action="javascript:void(0);">   
-                    <fieldset>
-                        <legend><h5 class="text-success"> Config Topic: </h5></legend>
-                        <div> current topic is: <?php echo $topic_name['name_en']; ?> <br>
-                            (<?php echo $topic_name['name_ch']; ?>, <?php echo $topic_name['name_pinyin']; ?>)
-                            <button onclick="chooseTopic(<?php echo $default_topic_id;?>)" class="btn btn-xs btn-default">Change</button>
+                    <fieldset class="tool-frame">
+                        <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_topic"> Topic: <span class="caret"></span></h5></legend>
+                        <div id="tool_topic" class="collapse in">
+                            <div> Current topic is: <br> 
+                                <?php echo $topic_name['name_en']; ?> 
+                                (<?php echo $topic_name['name_ch']; ?>, <?php echo $topic_name['name_pinyin']; ?>)
+                                <button onclick="chooseTopic(<?php echo $default_topic_id;?>)" class="btn btn-default btn-xs">Change</button>
+                            </div>
+                            <div>The topic tag is: <?php echo $topic_tag_ch;?>(<?php echo $topic_tag;?>)</div>
+                            <button onclick="editTaglist(<?php echo $default_topic_id; ?>)" class="btn btn-default btn-block">Edit Tag List</button>
+                            <button onclick="configTagsInTopic(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Select Existing Tags</button>
                         </div>
-                        <button onclick="configTagsInTopic(<?php echo $default_topic_id;?>)" class="btn btn-sm btn-default" style="">Manage Tags in topic</button></br>
                     </fieldset>
 
-                    <fieldset>
-                        <legend><h5 class="text-success"> Replace By <i><b>Smart Regex</b></i>©: </h5></legend>
-                        <div id="smartRegexShowDiv"></div><br>
-                        <button onclick="smartRegexNew()" style="height: 35px; width: 220px">Add Regex Group</button></br>
-                        Range: <input type="text" size="5" id="regexPageStart">to<input type="text" size="5" id="regexPageEnd"><br>
-                        <button onclick="replaceSmartRun()" style="height: 35px; width: 100px">Run</button>
-                        <button onclick="replaceSmartRunWithBr()" style="height: 35px; width: 100px">Run(with Br)</button></br>
-                        <button onclick="replaceSmartRunSpace()" style="height: 35px; width: 220px">Run(Allow space between Group)</button></br>
-                        <button onclick="smartRegexSave(<?php echo $default_topic_id; ?>)" style="height: 35px; width: 70px">Save</button>
-                        <button onclick="smartRegexLoad(<?php echo $default_topic_id; ?>)" style="height: 35px; width: 70px">Load</button>
-                        <button onclick="smartRegexEmpty()" style="height: 35px; width: 70px">Clear</button></br>
+                    <fieldset class="tool-frame">
+                        <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_regex"> Replace By <i><b>Smart Regex</b></i>©: <span class="caret"></span></h5></legend>
+                        
+                        <div id="tool_regex" class="collapse in">
+                            <div id="smartRegexShowDiv"></div><br>
+                            <!-- <button onclick="smartRegexNew()" class="btn-lg">Add Regex Group</button></br>
+                            -->
+                            <button onclick="smartRegexNew()" id="smart_regex_new_id" class="btn btn-default btn-block">Search by Patterns (Smart Regex)</button>
+
+                            <button onclick="smartRegexLoad(<?php echo $default_topic_id; ?>)" class="btn btn-default">Load</button>
+                            <button onclick="smartRegexSave(<?php echo $default_topic_id; ?>)" class="btn btn-default">Save</button>
+                            <button onclick="smartRegexEmpty()" class="btn btn-default">Clear</button></br>
+
+
+                            Range: <input type="text" size="5" id="regexPageStart">to<input type="text" size="5" id="regexPageEnd"><br>
+                            <button onclick="replaceSmartRun()" class="btn btn-default">Run</button>
+                            <button onclick="replaceSmartRunWithBr()" class="btn btn-default">Run(in new line)</button></br>
+                            <!-- <button onclick="replaceSmartRunSpace()" class="btn-lg">Run(Allow space between Group)</button></br>
+                            -->
+                            <button onclick="replaceSmartRunSpace()" class="btn btn-default">Run(Allow space between block)</button></br>
+                            <button onclick="Undo()" class="btn btn-default btn-block" id="buttonUndo" disabled="true">Undo</button>
+
+                            <!-- developing...-->
+                            <button onclick="genRegexWindowOpen()" id="gen_regex_window_open_id" class="btn btn-default">Open GenRegex(test)</button></br>
+                        </div>
                     </fieldset>
                     
-                    <fieldset>
-                        <legend><h5 class="text-success"> Tag by rule:</h5></legend>
-                        <button onclick="tagNameWithLastName()" style="height: 35px; width: 220px">Tag Word Begin With Surname</button></br>
-                        <button onclick="tagNameWithLastName2()" style="height: 35px; width: 170px">Tag Word Begin With</button><input type="text" size="2" id="surname"></br>
+
+                    <?php
+                    if ($default_topic_id == 1) {
+                    ?>
+                    <fieldset class="tool-frame">
+                        <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_rule"> Tag by rule: <span class="caret"></span></h5></legend>
+                        <div id="tool_rule" class="collapse out">
+                            <button onclick="tagNameWithLastName()" class="btn btn-default">Tag Word Begin With Surname</button></br>
+                            <button onclick="tagNameWithLastName2()" class="btn btn-default btn-sm">Tag Word Begin With</button> <input type="text" size="2" id="surname">
+                        </div>
                         <!--<button onclick="tagTime()" style="height: 30px; width: 220px">Tag Time</button></br>-->
                         <!--<button onclick="tagBiogAddr()" style="height: 30px; width: 220px">Tag BiogAddr</button></br>-->
-                        <button onclick="Undo()" style="height: 35px; width: 220px" id="buttonUndo" disabled="true">Undo</button>
                     </fieldset>
-                
-                    <fieldset>
-                        <legend><h5 class="text-success"> Edit:</h5></legend>
 
-                        <button onclick="saveTextToLGService()" id="saveTextToLGService_id" style="height: 35px; width: 220px">Save to LGService</button></br>
-                    
+                    <?php }?>
+                                     
+                    <fieldset class="tool-frame">
+                        <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_edit"> Edit: <span class="caret"></span></h5></legend>
                         <!--<button onclick="cleanUpTextArea()" style="height: 30px; width: 220px">Reform the text</button></br>-->
                         <!-- save text in local. replaced by saveTextToLGService, which is also saving on copy in local in development stage -->
                         <!-- 
                         <button onclick="saveText(<?php echo $section_id; ?>)" style="height: 30px; width: 220px">Save the text</button></br>
                         -->
-
-                        <button onclick="editText()" id="editTextId" style="height: 35px; width: 220px">Edit the text</button></br>
-                        </br>
-                        <button onclick="window.open('./EditWordlist')" style="height: 35px; width: 220px">Manage Word List</button></br>
-                        <button onclick="editTaglist(<?php echo $default_topic_id; ?>)" style="height: 35px; width: 220px">Manage Tag List</button></br>
+                        <div class="collapse out" id="tool_edit">
+                            <button onclick="editText()" id="editTextId" class="btn btn-default btn-block">Edit the text</button>
+                            <button onclick="window.open('./EditWordlist')" class="btn btn-default btn-block">Edit WordList</button>
+                        </div>
                     </fieldset>
                     
-                    <fieldset>
-                        <legend><h5 class="text-success"> Export:</h5></legend>
-                        Page: <input type="text" size="5" id="exportPageStart">to<input type="text" size="5" id="exportPageEnd"><br>
-                        <button onclick="exportPage(<?php echo $default_topic_id;?>)" style="height: 35px; width: 220px">Export</button></br>
-                        <button onclick="exportAll(<?php echo $default_topic_id;?>)" style="height: 35px; width: 220px">Export All</button></br>
+                    <fieldset class="tool-frame">
+                        <legend><h5 class="tool-topic" data-toggle="collapse" data-target="#tool_save"> Save and Export: <span class="caret"></span></h5></legend>
+                        <div class="collapse in" id="tool_save">
+                            <button onclick="saveTextToLGService()" id="save_text_to_LGService_id" class="btn btn-default btn-block">Save to LGService</button>
+                            <button onclick="exportAll(<?php echo $default_topic_id;?>)" class="btn btn-default btn-block">Export All</button>
+                            Page: <input type="text" size="5" id="exportPageStart">to<input type="text" size="5" id="exportPageEnd">
+                            <button onclick="exportPage(<?php echo $default_topic_id;?>)" class="btn btn-default btn-sm">Export</button></br>
+                        </div>
                     </fieldset>
                 
-                    <fieldset>
-                        <legend><h5 class="text-success"> Replace By <i><b>Regex</b></i>: </h5></legend>
-                        Range: <input type="text" size="5" id="regexPageStart2">to<input type="text" size="5" id="regexPageEnd2"><br>
-                        Regex: <input type="text" size="23" id="regexText"></br>
-                        Replace: <input type="text" size="23" id="replaceText"><br>
-                        <button onclick="replaceSmartRegex()">Replace!</button>
+                    <fieldset class="tool-frame">
+                        <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>
+                        <div class="collapse out" id="tool_replace_by">
+                            Range: <input type="text" size="5" id="regexPageStart2">to<input type="text" size="5" id="regexPageEnd2"><br>
+                            Regex: <input type="text" size="23" id="regexText"></br>
+                            Replace: <input type="text" size="23" id="replaceText"><br>
+                            <button onclick="replaceSmartRegex()" class="btn btn-default btn-sm">Replace!</button>
+                        </div>
                     </fieldset>
                 </form>
             </div>
diff -r 966a36752c34 -r 61593b047289 views/maintemplate.php
--- a/views/maintemplate.php	Thu Apr 23 17:08:31 2015 +0200
+++ b/views/maintemplate.php	Wed Jun 03 10:49:00 2015 +0200
@@ -4,7 +4,10 @@
 <script src="../js/jquery-1.10.2.min.js"></script>
 <script src="../js/jquery-ui.js"></script>
 <script src="../js/taggingtext.js"></script>
+<script src="../js/cjst.js"></script>
+<script src="../js/bootstrap.min.js"></script>
 <link href="../css/taggingtext.css" rel="stylesheet">
+<link href="../css/bootstrap.min.css" rel="stylesheet">
 
 </head>
 <body>
diff -r 966a36752c34 -r 61593b047289 views/maintemplate_local.php
--- a/views/maintemplate_local.php	Thu Apr 23 17:08:31 2015 +0200
+++ b/views/maintemplate_local.php	Wed Jun 03 10:49:00 2015 +0200
@@ -4,7 +4,10 @@
 <script src="../../js/jquery-1.10.2.min.js"></script>
 <script src="../../js/jquery-ui.js"></script>
 <script src="../../js/taggingtext.js"></script>
+<script src="../../js/cjst.js"></script>
+<script src="../../js/bootstrap.min.js"></script>
 <link href="../../css/taggingtext.css" rel="stylesheet">
+<link href="../../css/bootstrap.min.css" rel="stylesheet">
 
 </head>
 <body>