[發(fā)明專利]一種實現(xiàn)代碼可視化編輯組合的方法及系統(tǒng)

有效

• 申請?zhí)枺?/td>: 201410301768.2
• 申請日: 2014-06-27
• 公開（公告）號: CN104049978B
• 公開（公告）日: 2017-06-13
• 發(fā)明（設(shè)計）人: 汪國慶
• 申請（專利權(quán)）人: 北京思特奇信息技術(shù)股份有限公司
• 主分類號: G06F9/44
• 分類號: G06F9/44
• 代理公司: 北京輕創(chuàng)知識產(chǎn)權(quán)代理有限公司11212
• 代理人: 楊立

1.一種實現(xiàn)代碼可視化編輯組合的方法，其特征在于，包括如下步驟：

步驟1：服務器將待處理的一個或一個以上代碼片段轉(zhuǎn)義傳送給web頁面；

步驟2：所述web頁面將轉(zhuǎn)義后的代碼片段分別裝載入不同的頁面標簽容器中，每個頁面標簽容器綁定拖動事件；

步驟3：所述web頁面根據(jù)各個頁面標簽容器的內(nèi)容在頁面中展示代碼片段對應的名稱、入?yún)⒑统鰠⒏袷剑?/p>

步驟4：依次將待處理的代碼片段拖動至代碼編輯區(qū)進行可視化編輯組合，生成組合的可編輯代碼；

步驟4中依次將待處理的代碼片段拖動至代碼編輯區(qū)進行可視化編輯組合，生成組合的可編輯代碼的具體實現(xiàn)為：

步驟4.1：利用鼠標左鍵點擊一個待處理的代碼片段的名稱，此時生成相應的代理容器，該代理容器跟隨鼠標指針移動至代碼編輯區(qū)；

步驟4.2：在代碼編輯區(qū)點擊鼠標左鍵，判斷當前位置是否可以插入代碼，如果允許，則執(zhí)行步驟4.3；如果不允許，則提示當前位置不能插入該代碼片段，則自動釋放當前的代理容器，結(jié)束流程；

步驟4.3：直接插入所拖動的代碼片段，并對插入的代碼片段進行參數(shù)的可視化配置，判斷所有代碼片段是否均處理完畢，如果是則得到組合的可編輯代碼，結(jié)束；否則返回步驟4.1；

步驟5：將組合的可編輯代碼進行轉(zhuǎn)義得到目標代碼，將組合的可編輯代碼和目標代碼均傳送給服務器保存。

2.根據(jù)權(quán)利要求1所述一種實現(xiàn)代碼可視化編輯組合的方法，其特征在于，還包括預先設(shè)定代碼編輯區(qū)的屬性為可編輯，使代碼片段能正常插入。

3.根據(jù)權(quán)利要求1所述一種實現(xiàn)代碼可視化編輯組合的方法，其特征在于，所述步驟1的具體實現(xiàn)為：服務器對代碼片段進行轉(zhuǎn)義，傳送給web頁面；web頁面對接收到的代碼片段進行html標簽轉(zhuǎn)義，使之能在web頁面進行顯示。

4.根據(jù)權(quán)利要求1所述一種實現(xiàn)代碼可視化編輯組合的方法，其特征在于，步驟4.1中生成代理容器，使代理容器跟隨鼠標移動至代碼編輯區(qū)的具體實現(xiàn)為：鼠標左鍵點擊代碼名稱時，web頁面產(chǎn)生一個代理容器，將當前拖動代碼片段名稱對應的頁面標簽容器中的代碼片段拷貝至代理容器中，進而通過代理容器使代碼片段跟隨鼠標移動至代碼編輯區(qū)。

5.根據(jù)權(quán)利要求1所述一種實現(xiàn)代碼可視化編輯組合的方法，其特征在于，步驟4.3中對插入的代碼片段進行參數(shù)的可視化配置的具體實現(xiàn)為：通過文本輸入或下拉條件選擇的形式，對插入的代碼片段進行參數(shù)的可視化配置，配置入?yún)⒑统鰠ⅰ?/p>

6.根據(jù)權(quán)利要求1所述一種實現(xiàn)代碼可視化編輯組合的方法，其特征在于，步驟5中將組合的可編輯代碼進行轉(zhuǎn)義得到目標代碼片段的具體實現(xiàn)為：去除組合的可編輯代碼中包含的輸入框、下拉框、不可編輯區(qū)域標識，進而生成目標代碼。

7.一種實現(xiàn)代碼可視化編輯組合的系統(tǒng)，其特征在于，包括服務器和web頁面，所述web頁面包括頁面標簽容器、頁面展示模塊、代理容器、代碼編輯模塊和目標代碼生成模塊；

所述服務器，其用于將待處理的代碼片段轉(zhuǎn)義傳送給web頁面；還用于存儲經(jīng)web頁面處理生成的組合的可編輯代碼和目標代碼；

所述web頁面標簽容器，其用于存儲轉(zhuǎn)義后的代碼片段；還用于與拖動事件綁定；

所述頁面展示模塊，其用于根據(jù)頁面標簽容器的內(nèi)容在頁面中展示代碼片段對應的名稱、入?yún)⒑统鰠⒏袷剑?/p>

所述代理容器，其在點擊代碼名稱時產(chǎn)生，用于暫存頁面標簽容器中的代碼片段，當代碼片段允許插入代碼編輯模塊時，將代碼片段插入到代碼編輯模塊，否則自動釋放；

所述代碼編輯模塊，其用于通過文本輸入和下拉條件選擇形式對插入的代碼片段進行參數(shù)的可視化配置，得到組合的可編輯代碼；

所述目標代碼生成模塊，其用于將組合的可編輯代碼進行轉(zhuǎn)義得到目標代碼片段，將組合的可編輯代碼和目標代碼均傳送給服務器保存。

8.根據(jù)權(quán)利要求7所述一種實現(xiàn)代碼可視化編輯組合的系統(tǒng)，其特征在于，所述服務器包括第一轉(zhuǎn)義模塊和數(shù)據(jù)庫；

所述第一轉(zhuǎn)義模塊，其用于從數(shù)據(jù)庫中獲取待處理的代碼片段，并對代碼片段進行轉(zhuǎn)義，傳送給web頁面；

所述數(shù)據(jù)庫，其用于存儲待處理的代碼片段；還用于存儲經(jīng)web頁面處理產(chǎn)生的組合的可編輯代碼和目標代碼。

9.根據(jù)權(quán)利要求7所述一種實現(xiàn)代碼可視化編輯組合的系統(tǒng)，其特征在于，所述web頁面還包括第二轉(zhuǎn)義模塊，其用于對接收到的代碼片段進行html標簽轉(zhuǎn)義，使之能在web頁面進行顯示。