Ideamesh

กุมภาพันธ์

2006

Smarty วิธีการ: แม่ Debug Javascript

UPDATE: แพคเกจการดาวน์โหลดสามารถใช้ได้ที่นี่: http://ideamesh.com/file/11/Smarty-Debug-with-Collapsible-Variables.html

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

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

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

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

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

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

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

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

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

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

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

รหัสสินค้า:

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

{} assign_debug_info

ถ้า (self.name == ") {} ldelim
var title = 'คอนโซล';
{} rdelim
else {} ldelim
var title = 'Console_' + self.name;
{} rdelim
_smarty_console = window.open ("", title.value, "width = 800 ความสูง = 600, เลื่อน, ปรับขนาดได้ = yes");
_smarty_console.document.write ("<html> <head> <title> Debug Smarty Console_" + self.name + "<\ / title> \ n");
_smarty_console.document.write ("<style> \ n");
_smarty_console.document.write ("h3 {padding ldelim}: 5px 5px 5px 5px; ขอบ: 0px 0px 0px 0px; background-color: # cccccc;} {rdelim \ n");
_smarty_console.document.write ("ความกว้าง {} ldelim debugtreetable #: 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 () {} 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.");
_smarty_console.document.write ("* @ พระราม TreeNode วัตถุ TreeNode ที่ได้รับการคลิก \ n.");
_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 = new TreeNode ({} $ เคาน์เตอร์, 'Debug Smarty', helpIcon, 'นี่คือต้นไม้ Debug มันแทนที่รุ่นคลาสสิกของคอนโซล Debug 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 $ [แม่]. ประเภทของ EQ "แม่"} elseif น้ำตาล {$ _debug_tpls [แม่]. EQ ประเภท isset ($ _debug_tpls [แม่] exec_time.)} <font size=-1> <i> ({$ _debug_tpls [แม่] exec_time | string_format. "% .5 f"}) {if templates.index%% EQ 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 ({} $ เคาน์เตอร์, 'ตัวแปรการแก้ปัญหาผู้ใช้:', new Array (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 ({} $ เคาน์เตอร์, 'ไม่มีข้อมูลของผู้ใช้ที่ได้รับมอบหมาย Debug', HelpIcon) \ n");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + +}
{ส่วน /}

{* สร้างโหนดสำหรับแม่ * ตัวแปร}
_smarty_console.document.write ("โหนด var {$} = เคาน์เตอร์ใหม่ TreeNode ({} $ เคาน์เตอร์, 'กำหนดตัวแปรแม่แบบ:', new Array (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");
{$ เคาน์เตอร์ + +}
{/} ถ้า
{} sectionelse
_smarty_console.document.write ("โหนด var {$} = เคาน์เตอร์ใหม่ TreeNode ({} $ เคาน์เตอร์, 'ไม่มีตัวแปรแม่แบบที่กำหนด', HelpIcon) \ n");
_smarty_console.document.write ("parent.addChild (โหนด {$ เคาน์เตอร์}) \ n");
{$ เคาน์เตอร์ + +}
{ส่วน /}

{* โหนดสร้างสำหรับตัวแปรไฟล์ config Smarty *}
_smarty_console.document.write ("โหนด var {$} = เคาน์เตอร์ใหม่ TreeNode ({} $ เคาน์เตอร์, 'กำหนดค่าตัวแปรไฟล์ (ขอบเขตแม่แบบด้านนอก):', new Array (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 ({} $ เคาน์เตอร์, 'ไม่มีตัวแปร config ที่ได้รับมอบหมาย', 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>");
_smarty_console.document.write ("คลิก <h4> กับตัวแปรในต้นไม้ที่จะมีเนื้อหาของพวกเขาแสดงในแผงด้านขวา <\ / h4>.");
_smarty_console.document.write ("<table border='0' id='debugtreetable'> <tr>");
_smarty_console.document.write ("valign='top' <td 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>

แท็ก: จาวาสคริปต์ , Smarty
โพสต์ใน เคล็ดลับ , การเขียนโปรแกรม โดยโอเว่น

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

Ideamesh

นักแปล

ตัวเลือกไซต์

Smarty วิธีการ: แม่ Debug Javascript

ฝากความคิดเห็นของคุณ

Ideamesh

Tags:

กระทู้ยอดนิยม

นักแปล

ตัวเลือกไซต์

Smarty วิธีการ: แม่ Debug Javascript

ฝากความคิดเห็นของคุณ