กุมภาพันธ์
13
2006

Smarty วิธีการ: Javascript ดีบักแม่

UPDATE: ดาวน์โหลดแพคเกจที่มีอยู่ที่นี่: http://ideamesh.com/file/11/Smarty-Debug-with-Collapsible-Variables.html

นี่คือรหัสการปรับเปลี่ยนการทำงานและพร้อมที่จะไป ..

นี่คือการเชื่อมโยงที่คุณสามารถดาวน์โหลด nanotree จาวาสคริปต์ ...
http://nanotree.sourceforge.net/

แทนที่ตัวแปรของฉัน {} $ Site.framework_pub อย่างเหมาะสมเพื่อให้จาวาสคริปต์และภาพที่สามารถโหลดได้อย่างถูกต้อง

นอกจากนี้โปรดทราบว่าฉันได้เพิ่มในส่วนที่จะจัดการแก้ปัญหาที่ผู้ใช้กำหนด vars ... โครงสร้างการแก้ปัญหาของฉันชื่อ '_user_debug' และ '_user_debug_key'

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิธีการใช้ดูที่กระทู้นี้
http://www.smarty.net/forums/viewtopic.php?p=31241 # 31241

มิฉะนั้นถ้าคุณไม่ได้สนใจว่ามันมีความปลอดภัยที่จะลบส่วนนั้นจากแม่แบบ นอกจากนี้คุณยังสามารถลบ {} ถ้างบที่ผมใช้ในการห่อส่วนแม่ var

สิ่งที่คุณอาจต้องการที่จะเล่นกับอีกประการหนึ่งคือจำนวนตัวอักษรจะออกเป็นค่าสำหรับการแก้ปัญหา มองหานี้และการปรับเปลี่ยนจำนวนครั้งที่สองในการเปลี่ยนแปลงสูงสุด chars ออก: @ debug_print_var: 0:1000

PS ทุกคนสามารถคิดออกว่าทำไมฉันได้รับพื้นที่ดังกล่าวข้างต้น <h3> ในเซลล์ที่ถูกต้องหรือไม่

หวังว่านี้จะช่วยให้ฉันรู้ว่าฉันชอบมัน รอยยิ้ม

PS เพื่อให้ได้ทั้งหมดจาวาสคริปต์ทำงานอย่างถูกต้องคุณจะต้องปรับเปลี่ยนบรรทัด "var mynanopath =" และให้แน่ใจว่ามันชี้ไปยังไดเรกทอรี nanopath สาธารณะของคุณ คุณสามารถลงแพคเกจ nanotree จาก http://sourceforge.net/projects/nanotree/

นี่คือรหัสที่มีการปรับปรุง

รหัสสินค้า:
{*
Smarty DHTML แบบกำหนดเองแม่แบบการแก้ปัญหา
@ ผู้เขียน Hielke Hoeve
@ ผู้เขียน <owenc โอเว่นโคลที่ ideamesh จุด com>
@ ตั้งแต่ 2006/02/13 Smarty 2.6.12
@ แพคเกจ Smarty
@ ชื่อไฟล์ debug.tpl
*}

{} assign_debug_info

<SCRIPT language=javascript>
var mynanopath = "{$ Site.javascript_path} \ / nanotree \ /";

ถ้า (self.name == ") {} ldelim
ชื่อ var = 'คอนโซล';
{} rdelim
else {} ldelim
ชื่อ var = 'Console_' + self.name;
{} rdelim
_smarty_console = window.open ("", title.value "width = 800 height = 600 ปรับขนาดเลื่อน = ใช่");
_smarty_console.document.write ("<html> <head> <title> Smarty Debug Console_" + + self.name "<\ / title> \ n");
_smarty_console.document.write ("<style> \ n");
_smarty_console.document.write ("h3 {} ldelim padding: 5px 5px 5px 5px; ขอบ: 0px 0px 0px 0px; สีพื้น: # cccccc;} {rdelim \ n");
_smarty_console.document.write ("# debugtreetable {} ldelim กว้าง: 100%;} {rdelim \ n");
_smarty_console.document.write ("# debugtreetable TD {} ldelim ชายแดน: บางของแข็งสีดำ {rdelim} \ n");
_smarty_console.document.write ("# debugtreetextdiv div {} ldelim padding ซ้าย: 10px;} {rdelim \ n");
_smarty_console.document.write ("<\ / style> \ n");
_smarty_console.document.write ("<script language=\"Javascript\" src=\"" + + mynanopath "nanotree.js\"> <\ / script> \ n");
_smarty_console.document.write ("<script type=\"text\/javascript\" language=\"JavaScript\"> \ n");
_smarty_console.document.write ("<- \ n");
_smarty_console.document.write ("showRootNode = true; \ n");
_smarty_console.document.write ("sortNodes = 0; \ n");
_smarty_console.document.write ("dragable = false; \ n");
_smarty_console.document.write ("showAllNodesOnStartup = true; \ n");

_smarty_console.document.write ("\ / ** \ n");
_smarty_console.document.write (". * ที่จำเป็นในการเริ่มต้นต้นไม้ \ n");
_smarty_console.document.write ("* และจะเรียก showTree (ImagePath);. เพื่อแสดงให้เห็นจริงต้นไม้ \ n");
_smarty_console.document.write ("* หรือนี้สามารถทำได้ในบล็อกสคริปต์ที่ด้านล่างของหน้า \ n.");
_smarty_console.document.write ("*. แต่วิธีการนี​​้ค่อนข้างสะอาด \ n");
_smarty_console.document.write ("* \ / \ n");
_smarty_console.document.write ("init function () {} ldelim \ n");
_smarty_console.document.write ("ภาชนะ = document.getElementById ('debugtreediv'); \ n");
_smarty_console.document.write ("showTree ('" + mynanopath + "'); \ n");
_smarty_console.document.write ("{rdelim} \ n");

_smarty_console.document.write ("\ / ** \ n");
_smarty_console.document.write ("* เรียกว่าเมื่อผู้ใช้คลิกที่โหนด \ n.");
(". * @ พระราม TreeNode TreeNode วัตถุที่ได้รับการคลิก \ n") _smarty_console.document.write;
_smarty_console.document.write ("* \ / \ n");
_smarty_console.document.write ("ฟังก์ชั่น standardClick (TreeNode) {} ldelim \ n");
_smarty_console.document.write ("var MyText = document.getElementById ('debugtreetextdiv'); \ n");
_smarty_console.document.write ("var พระราม = treeNode.getParam (); \ n");
_smarty_console.document.write ("mytext.innerHTML = (พระราม ==") treeNode.getName ():? <h3> '+ treeNode.getName () +' <\ / h3> <div> '+ พระราม + <\ / div> '; \ n ");
_smarty_console.document.write ("{rdelim} \ n");

_smarty_console.document.write ("ฟังก์ชั่น nodeEdited (TreeNode) {} ldelim \ n");
_smarty_console.document.write ("{rdelim} \ n");

_smarty_console.document.write ("var closedGif = '" + mynanopath + "ภาพ \ / folder_closed.gif'; \ n");
_smarty_console.document.write ("var openGif = '" + mynanopath + "ภาพ \ / folder_open.gif'; \ n");
_smarty_console.document.write ("var pageIcon = '" + mynanopath + "ภาพ \ / page16 × 16.gif'; \ n");
_smarty_console.document.write ("var userIcon = '" + mynanopath + "ภาพ \ / user_16 × 16.gif'; \ n");
_smarty_console.document.write ("var helpIcon = '" + mynanopath + "ภาพ \ / help_16 × 16.gif'; \ n");

{* สร้างโหนดฐาน *}
{var = กำหนดค่าเคาน์เตอร์ = 0}
_smarty_console.document.write ("rootNode = TreeNode ใหม่ ({$ เคาน์เตอร์} 'Smarty Debug' helpIcon ว่านี่คือการแก้ปัญหาต้นไม้แทนที่รุ่นคลาสสิกของ Smarty ดีบักคอนโซล. '); \ n");
{$ เคาน์เตอร์ + + +}

{* สร้างโหนดสำหรับแม่รวมถึง *}
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'รวมถึงแม่แบบและ config ไฟล์ (เวลาในการโหลดในวินาที):' pageIcon '");
_smarty_console.document.write ("<table width=\"100%\">");
{ชื่อส่วน = ห่วงแม่ = $ _debug_tpls}
_smarty_console.document.write ("<tr bgcolor={if %templates.index% เป็น even}#eeeeee{else}#fafafa{/if}> <td colspan=2> <tt> {ชื่อส่วน = ห่วงเยื้อง = $ _debug_tpls [แม่]. ความลึก &&&} {/ ส่วน} <สีตัวอักษร = {ถ้า $ _debug_tpls [แม่] ประเภทอีคิว "แม่แบบ".} elseif น้ำตาล {$ _debug_tpls [แม่] ประเภทอีคิว. “insert”}black{else}green{/if}>{$_debug_tpls[templates].filename|escape:html|escape:javascript}<\\/font>{if isset (. $ _debug_tpls [แม่] exec_time)} <font size=-1> <i> ({$ _debug_tpls [แม่] exec_time | string_format. "% .5 ฉ"}) {ถ้า templates.index%% อีคิว 0} (รวม) {/ ถ้า} <\ \ / i> <\ \ / font> {/ ถ้า} <\ \ / tt> <\ \ / td> <\ \ / tr> ");
{} sectionelse
_smarty_console.document.write ("<tr bgcolor=#eeeeee> <td colspan=2> <tt> <i> ไม่มีแม่รวม <\ \ / i> <\ \ / tt> <\ \ / td> <\ \ / tr> ");
{/} ส่วน
_smarty_console.document.write ("<\ \ / table>");
_smarty_console.document.write ("'); \ n");

_smarty_console.document.write ("rootNode.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}

{* สร้างโหนดสำหรับตัวแปรการแก้ปัญหาผู้ใช้ *}
_smarty_console.document.write ("โหนด {var $ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'ผู้ใช้แก้ปัญหาตัวแปร:', อาร์เรย์ใหม่ (closedGif, openGif)); \ n");
_smarty_console.document.write ("rootNode.addChild (โหนด {$ เคาน์เตอร์}) \ n");
_smarty_console.document.write ("แม่ var = โหนด {$ เคาน์เตอร์} \ n");
{$ เคาน์เตอร์ + + +}

{* สร้างโหนดเด็กสำหรับตัวแปรการแก้ปัญหาผู้ใช้ *}
{ส่วนชื่อ = ห่วง Vars = $ _user_debug}
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} '{ldelim} $ {$ _user_debug_key [vars]} {} rdelim' pageIcon '{$ _user_debug [vars] | @ debug_print_var: 0:1000 | หลบหนี: javascript | หลบหนี: javascript} '); \ n ");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}
{} sectionelse
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'ไม่มีผู้ใช้แก้ปัญหาข้อมูลที่ได้รับมอบหมาย' HelpIcon); \ n");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}
{/} ส่วน

{* สร้างโหนดสำหรับตัวแปรแม่ *}
_smarty_console.document.write ("โหนด {var $ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'กำหนดตัวแปรแม่แบบ:', อาร์เรย์ใหม่ (closedGif, openGif)); \ n");
_smarty_console.document.write ("rootNode.addChild (โหนด {$ เคาน์เตอร์}) \ n");
_smarty_console.document.write ("แม่ var = โหนด {$ เคาน์เตอร์} \ n");
{$ เคาน์เตอร์ + + +}

{* สร้างโหนดเด็กสำหรับตัวแปรแม่ *}
{ชื่อส่วน = ห่วง Vars = $ _debug_keys}
{ถ้า $ _debug_keys [Vars]! = '_user_debug' && $ _debug_keys [Vars]! = '_user_debug_key'}
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} '{ldelim} $ {$ _debug_keys [vars]} {} rdelim' pageIcon '{$ _debug_vals [vars] | @ debug_print_var: 0:1000 | หลบหนี: javascript | หลบหนี: javascript} '); \ n ");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}
{/ if}
{} sectionelse
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'ไม่มีตัวแปรแม่แบบที่ได้รับมอบหมาย' HelpIcon); \ n");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}
{/} ส่วน

{* สร้างโหนดสำหรับตัวแปรการตั้งค่าไฟล์ Smarty *}
_smarty_console.document.write ("โหนด {var $ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'ที่ได้รับมอบหมายไฟล์การตั้งค่าตัวแปร (ขอบเขตแม่แบบด้านนอก):', อาร์เรย์ใหม่ (closedGif, openGif)); \ n");
_smarty_console.document.write ("rootNode.addChild (โหนด {$ เคาน์เตอร์}) \ n");
_smarty_console.document.write ("แม่ var = โหนด {$ เคาน์เตอร์} \ n");
{$ เคาน์เตอร์ + + +}

{* สร้างโหนดเด็กสำหรับตัวแปรไฟล์ config Smarty *}
{ชื่อส่วน = ห่วง config_vars = $ _debug_config_keys}
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} '{ldelim} $ {$ _debug_config_keys [config_vars]} {} rdelim' pageIcon '{$ _debug_config_vals [config_vars] | @ debug_print_var: 0:1000 | หลบหนี: javascript | หลบหนี: javascript} '); \ n ");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}
{} sectionelse
_smarty_console.document.write ("var โหนด {$ เคาน์เตอร์} = TreeNode ใหม่ ({$ เคาน์เตอร์} 'ไม่มีการตั้งค่าตัวแปรที่ได้รับมอบหมาย' HelpIcon); \ n");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + + +}
{/} ส่วน

_smarty_console.document.write ("\ / \ / -> \ n");
_smarty_console.document.write ("<\ / script> \ n \ n");
_smarty_console.document.write ("<\ / head> <body onload=\"init()\"> \ n");
_smarty_console.document.write ("<h3> Smarty และผู้ใช้ดีบักคอนโซล <\ / h3>");
(". <h4> คลิกที่ตัวแปรในต้นไม้ที่จะมีเนื้อหาของพวกเขาแสดงในแผงด้านขวา <\ / h4>") _smarty_console.document.write;
_smarty_console.document.write ("<table border='0' id='debugtreetable'> <tr>");
_smarty_console.document.write ("<td valign='top' style='width: 250px;'> <div id='debugtreediv'> & <\ / div> <\ / td>");
_smarty_console.document.write ("<td valign='top'> <div id='debugtreetextdiv'> & <\ / td>");
_smarty_console.document.write ("<\ / tr> <\ / table>");
_smarty_console.document.write ("<\ / body> <\ / html>");
_smarty_console.document.close ();
</ script>

Tags: ,
โพสต์ใน คำแนะนำ , การเขียนโปรแกรม โดยโอเว่น

ทำตามความคิดเห็นผ่านทาง ฟีด RSS | ฝากความคิดเห็น | Trackback URL

แสดงความคิดเห็นของคุณ

© 2008 - 2014 - สงวนลิขสิทธิ์ - Ideamesh, Inc 22 คำสั่ง 0.337 วินาที