二月
13
2006

Smarty的如何:使用Javascript调试模板

更新:一个下载包,请访问: http://ideamesh.com/file/11/Smarty,调试,使用,可折叠,Variables.html

下面是修改后的代码,工作和准备去..

在这里你可以下载nanotree JavaScript的链接...
http://nanotree.sourceforge.net/

更换我的变量{$ Site.framework_pub}适当地使JavaScript和图像可以被正确加载。

同时请注意,我在一节加入到处理用户定义的调试瓦尔...我调试的结构被命名为“_user_debug'和'_user_debug_key”

有关如何实现这个看这个线程的详细信息:
http://www.smarty.net/forums/viewtopic.php?p=31241#31241

否则,如果你不感兴趣,可以安全地删除部分的模板。 您也可以删除我用包装模板VAR部分{}如果语句。

你可能想一起玩的另一件事是,有多少字符作为调试输出的值。 瞧,这和修改,第二个数字来改变最大字符输出:@debug_print_var:0:1000

PS谁能弄清楚为什么我得到一个空间上面的<H3>在右侧单元格?

希望这会有所帮助,我知道我喜欢它 微笑

ps获得所有的JavaScript正常工作,你只需要修改该行“VAR mynanopath =”,并确保它指向您的公共nanopath目录。 您可以向下从nanotree包http://sourceforge.net/projects/nanotree/

这里是更新的代码

代码:
{*
Smarty的自定义DHTML调试模板
@author Hielke Hoeve酒店
@作者欧文·科尔<owenc在ideamesh点com>
@since 2006年2月13日的Smarty 2.6.12
@package小聪明
@filename文件debug.tpl
*}

{} assign_debug_info

<SCRIPT LANGUAGE = JavaScript的>
变种mynanopath =“{$ Site.javascript_path} \ / nanotree \ /”;

如果(self.name ==“){} ldelim
VAR标题='控制台';
{} rdelim
其他{ldelim}
VAR标题='Console_'+ self.name;
{} rdelim
_smarty_console =的window.open(“”,title.value,“宽= 800,高= 600,调整大小,滚动条=是的”);
_smarty_console.document.write(“<HTML> <HEAD> <标题> Smarty的调试控制台_”+ self.name +“<\ / TITLE> \ n”);
_smarty_console.document.write(“<样式> \ n”);
_smarty_console.document.write(“H3 {} ldelim填充:5像素5像素5像素5像素;保证金: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(“#DIV debugtreetextdiv {ldelim}填充左:10px的; {rdelim} \ n”);
_smarty_console.document.write(“<\ /样式> \ n”);
_smarty_console.document.write(“<脚本语言= \”的Javascript \“SRC = \”“+ mynanopath +”nanotree.js \“> <\ / SCRIPT> \ n”);
_smarty_console.document.write(“<脚本类型= \”文\ / JavaScript的\“语言= \”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(“* @参数树节点已被点击的树节点对象\ n”);
_smarty_console.document.write(“* \ / \ n”);
_smarty_console.document.write(“功能standardClick(树节点){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(树节点){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中=新的树节点({$}柜台,”Smarty的调试“,helpIcon,”这是调试树它取代了传统版本的Smarty的调试控制台。'); \ n“);
{$反+ +}

{*创建节点模板包括*}
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,”包括模板和配置文件在几秒钟内(加载时间):',pageIcon,“”);
_smarty_console.document.write(“<表格的宽度= \”100%\“>”);
{段名=模板循环= $ _ debug_tpls}
_smarty_console.document.write(“<TR BGCOLOR = {IF%templates.index%甚至} #eeeeee {}其他{​​#fafafa / IF}> <TD合并单元格= 2> <TT> {段名=缩进循环= $ _debug_tpls [模板] .depth} &&& {/条} <字体颜色= {如果$ _debug_tpls [模板]。类型EQ“模板”} {棕色elseif的$ _debug_tpls [模板]。类型EQ “insert”}black{else}green{/if}>{$_debug_tpls[templates].filename|escape:html|escape:javascript}<\\/font>{if 使用isset($ _ debug_tpls [模板] .exec_time)} <字体大小= -1> <I>({$ _ debug_tpls [模板] .exec_time | string_format:“%5F”}){IF%templates.index%EQ 0} (总){/如果} <\\ / I> <\\ / FONT> {/如果} <\\ / TT> <\\ / TD> <\\ / TR>“);
{} sectionelse
_smarty_console.document.write(“<TR BGCOLOR =#EEEEEE> <TD合并单元格= 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节点{$计数器} =新的树节点({$}柜台,”用户调试变量:',新的Array(closedGif,openGif))的\ n“);
_smarty_console.document.write(“rootNode.addChild(结点{$计数器}); \ n”);
_smarty_console.document.write(“VAR =父结点{$计数器}; \ n”);
{$反+ +}

{*用户调试变量创建子节点*}
{段名=瓦尔环= $ _ user_debug}
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,'{ldelim} $ {$ _ user_debug_key [增值经销商]} {rdelim}',pageIcon,'{$ _user_debug [瓦尔] | @ debug_print_var:0:1000 |越狱:JavaScript的|越狱:JavaScript的}'); \ n“);
_smarty_console.document.write(“parent.addChild(结点{$计数器}); \ n”);
{$反+ +}
{} sectionelse
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,”没有用户调试信息分配“,HelpIcon); \ n”);
_smarty_console.document.write(“parent.addChild(结点{$计数器}); \ n”);
{$反+ +}
{/部分}

{*模板创建的变量节点*}
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,”指定模板变量:',新的Array(closedGif,openGif))的\ n“);
_smarty_console.document.write(“rootNode.addChild(结点{$计数器}); \ n”);
_smarty_console.document.write(“VAR =父结点{$计数器}; \ n”);
{$反+ +}

{*为模板变量创建子节点*}
{段名=瓦尔环= $ _ debug_keys}
{如果$ _debug_keys [瓦尔]!='_user_debug'&& $ _debug_keys [瓦尔]!='_user_debug_key'}
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,'{ldelim} $ {$ _ debug_keys [增值经销商]} {rdelim}',pageIcon,'{$ _debug_vals [瓦尔] | @ debug_print_var:0:1000 |越狱:JavaScript的|越狱:JavaScript的}'); \ n“);
_smarty_console.document.write(“parent.addChild(结点{$计数器}); \ n”);
{$反+ +}
{/如果}
{} sectionelse
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}专柜,”无模板变量赋值',HelpIcon); \ n“);
_smarty_console.document.write(“parent.addChild(结点{$计数器}); \ n”);
{$反+ +}
{/部分}

{*创建节点,智者配置文件中的变量*}
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,”指定配置文件的变量(外模板范围):“,新的Array(closedGif,openGif))的\ n”);
_smarty_console.document.write(“rootNode.addChild(结点{$计数器}); \ n”);
_smarty_console.document.write(“VAR =父结点{$计数器}; \ n”);
{$反+ +}

{*为智者配置文件中的变量创建子节点*}
{段名= config_vars环= $ _ debug_config_keys}
_smarty_console.document.write(“VAR节点{$计数器} =新的树节点({$}柜台,'{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节点{$计数器} =新的树节点({$}柜台,”不配置变量赋值',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>小聪明和用户调试控制台<\ / H3>”);
_smarty_console.document.write(“<H4>点击变量在树中具有它们的内容将显示在右侧面板<\ / H4>”);
_smarty_console.document.write(“<表格边框=”0“ID =”debugtreetable“> <TR>”);
_smarty_console.document.write(“<TD VALIGN ='顶'的风格=”宽度:250像素;“> <DIV ID ='debugtreediv'>&<\ / DIV> <\ / TD>”);
_smarty_console.document.write(“<TD VALIGN ='顶'> <DIV ID ='debugtreetextdiv'>&<\ / TD>”);
_smarty_console.document.write(“<\ / TR> <\ / TABLE>”);
_smarty_console.document.write(“<\ / BODY> <\ / HTML>”);
_smarty_console.document.close();
</ SCRIPT>

标签:
张贴在导游编程欧文

通过跟随评论RSS源 | 发表评论 | 引用网址

留下您的评论

©2008 - 2014 -版权所有- Ideamesh,公司 22个查询。 0.250秒。