Februar
13
2006

Smarty Gewusst wie: Debuggen von Javascript Vorlage

UPDATE: Ein Download-Paket finden Sie hier: http://ideamesh.com/file/11/Smarty-Debug-with-Collapsible-Variables.html

Hier ist der modifizierte Code, arbeiten und bereit zu gehen ..

Hier ist der Link, wo man die nanotree Javascript downloaden ...
http://nanotree.sourceforge.net/

Ersetzen Sie meine Variable {$} Site.framework_pub so ein, dass die Javascript-und Bilder korrekt geladen werden.

Bitte beachten Sie auch, habe ich in einem Abschnitt zu benutzerdefinierten Debug hand hinzugefügt vars ... Meine Debug-Struktur '_user_debug' und '_user_debug_key' benannt

Für mehr Info auf, wie man dieses Blick auf diesen Thread zu implementieren:
http://www.smarty.net/forums/viewtopic.php?p=31241 # 31241

Andernfalls, wenn Sie nicht daran interessiert sind, ist es sicher, dass die Strecke von der Vorlage zu entfernen. Sie könnten auch die {if} Aussage, die ich verwendet, um die Vorlage zu wickeln var-Abschnitt zu entfernen.

Eine andere Sache, möchten Sie vielleicht mit zu spielen ist, wie viele Zeichen ausgegeben als Wert für debuggen. Geben Sie für diese und ändern Sie die zweite Zahl, ändern sich max verkohlt Ausgang: @ debug_print_var: 0:1000

PS Kann jemand herausfinden, warum ich immer einen Raum über der <h3> in die richtige Zelle?

Hoffe, das hilft, weiß ich, Ich mag es, Lächeln

PS Um erhalten Sie alle Javascript richtig müssen Sie lediglich die Zeile "var mynanopath =" zu ändern und sicherstellen, dass es zu Ihrem öffentlichen nanopath Arbeitsverzeichnis zeigt. Sie können Sie die nanotree Paket von http://sourceforge.net/projects/nanotree/

Hier ist der aktualisierte Code

Code:
{*
Smarty Template Individuelle DHTML Debug
@ Author Hielke Hoeve
@ Autor Owen Cole <owenc bei ideamesh dot com>
@ Seit 2006.02.13 Smarty 2.6.12
@ Smarty-Paket
@ Dateiname debug.tpl
*}

{} Assign_debug_info

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

if (self.name == ") {} ldelim
var title = 'Console';
{} Rdelim
else {} ldelim
var title = 'Console_' + self.name;
{} Rdelim
_smarty_console = window.open ("", title.value, "width = 800, height = 600, Größe veränderbar, Rollbalken = yes");
_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; margin: 0px 0px 0px 0px; background-color: # CCCCCC; rdelim {} \ n");
_smarty_console.document.write ("# debugtreetable {} ldelim width: 100%;} {rdelim \ n");
_smarty_console.document.write ("# debugtreetable td {} ldelim border: solid black dünn; rdelim {} \ n");
_smarty_console.document.write ("# debugtreetextdiv div {} ldelim padding-left: 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 (". * benötigt, um den Baum zu initialisieren \ n");
_smarty_console.document.write ("* Und ShowTree (imagePath) nennen;. tatsächlich zeigen den Baum \ n");
_smarty_console.document.write ("* Alternativ kann dies in einer Skript-Block an der Unterseite der Seite durchgeführt werden. \ n");
_smarty_console.document.write (". * Obwohl diese Methode ist etwas sauberer \ n");
_smarty_console.document.write ("* \ / \ n");
_smarty_console.document.write ("function init () {ldelim} \ n");
_smarty_console.document.write ("container = 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 ("* aufgerufen, wenn ein Benutzer auf einen Knoten klickt. \ n");
(". * @ param TREENODE die TreeNode-Objekt, das angeklickt haben, \ n") _smarty_console.document.write;
_smarty_console.document.write ("* \ / \ n");
_smarty_console.document.write ("Standardclick-Funktion (TreeNode) {ldelim} \ n");
_smarty_console.document.write ("var mytext = document.getElementById ('debugtreetextdiv'); \ n");
_smarty_console.document.write ("var param = treeNode.getParam (); \ n");
_smarty_console.document.write ("mytext.innerHTML = (param ==") treeNode.getName ():? <h3> '+ treeNode.getName () +' <\ / h3> <div> '+ + param' <\ / div> '; \ n ");
_smarty_console.document.write ("{rdelim} \ n");

_smarty_console.document.write ("Funktion nodeEdited (TreeNode) {ldelim} \ n");
_smarty_console.document.write ("{rdelim} \ n");

_smarty_console.document.write ("var closedGif = '" + + mynanopath "images \ / folder_closed.gif'; \ n");
_smarty_console.document.write ("var openGif = '" + + mynanopath "images \ / folder_open.gif'; \ n");
_smarty_console.document.write ("var pageIcon = '" + + mynanopath "images \ / Seite 16 × 16.gif'; \ n");
_smarty_console.document.write ("var usericon = '" + + mynanopath "images \ / user_16 × 16.gif'; \ n");
_smarty_console.document.write ("var HelpIcon = '" + + mynanopath "images \ / help_16 × 16.gif'; \ n");

{* Erstellen von Basisknoten *}
{Var = Zählerwert = 0 zuweisen}
_smarty_console.document.write ("rootNode = new TreeNode ({$ counter}," Smarty Debug ', HelpIcon,' Dies ist der Debug-Baum Es ersetzt die klassische Version der Smarty Debug-Konsole. '); \ n ");
{$ Counter + +}

{* Erstellen von Knoten für die Vorlage enthält *}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter}" enthalten Vorlagen und Konfigurationsdateien (Ladezeit in Sekunden): ', pageIcon, "");
_smarty_console.document.write ("<table width=\"100%\">");
{Section name = Vorlagen loop = $ _debug_tpls}
_smarty_console.document.write ("<tr bgcolor={if %templates.index% ist even}#eeeeee{else}#fafafa{/if}> <td colspan=2> <tt> {section name = Gedankenstrich loop = $ _debug_tpls [Vorlagen]. Tiefe} &&& {/ section} <font color = {if $ _debug_tpls [Vorlagen]. Typ eq "Vorlage"} {elseif $ braun _debug_tpls [Vorlagen]. Typ eq “insert”}black{else}green{/if}>{$_debug_tpls[templates].filename|escape:html|escape:javascript}<\\/font>{if isset (. $ _debug_tpls [Vorlagen] exec_time)} <font size=-1> <i> ({$ _debug_tpls [Vorlagen] exec_time | string_format:. "0,5% f"}) {if% templates.index% eq 0} (insgesamt) {/ if} <\ \ / i> <\ \ / font> {/ if} <\ \ / tt> <\ \ / td> <\ \ / tr> ");
{Section}
_smarty_console.document.write ("<tr bgcolor=#eeeeee> <td colspan=2> <tt> <i> keine Vorlagen enthalten <\ \ / i> <\ \ / tt> <\ \ / td> <\ \ / tr> ");
{/ Section}
_smarty_console.document.write ("<\ \ / table>");
_smarty_console.document.write ("') \ n");

_smarty_console.document.write ("rootNode.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}

{* Erstellen von Knoten für Benutzer Debug-Variablen *}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter}, 'user Debug-Variablen:', new Array (closedGif, openGif)); \ n");
_smarty_console.document.write ("rootNode.addChild (Knoten {$ counter}); \ n");
_smarty_console.document.write ("var parent = Knoten {$ counter}; \ n");
{$ Counter + +}

{* Erstellen Sie untergeordnete Knoten für Benutzer Debug-Variablen *}
{Section name = Schleife vars = $ _user_debug}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter} '{ldelim} $ {$ _user_debug_key [vars]} {} rdelim', pageIcon, '{$ _user_debug [vars] | @ debug_print_var: 0:1000 | escape: javascript | escape: javascript} '); \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}
{Section}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter} 'Nein Benutzer Debug-Informationen zugeordnet", HelpIcon), \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}
{/ Section}

{* Erstellen von Knoten für die Template-Variablen *}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter}, 'Template-Variablen zugewiesen:', new Array (closedGif, openGif)); \ n");
_smarty_console.document.write ("rootNode.addChild (Knoten {$ counter}); \ n");
_smarty_console.document.write ("var parent = Knoten {$ counter}; \ n");
{$ Counter + +}

{* Erstellen Sie untergeordnete Knoten für die Template-Variablen *}
{Section name = Schleife vars = $ _debug_keys}
{If $ _debug_keys [vars!] = '_user_debug' && $ _debug_keys [Vars!] = '_user_debug_key'}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter} '{ldelim} $ {$ _debug_keys [vars]} {} rdelim', pageIcon, '{$ _debug_vals [vars] | @ debug_print_var: 0:1000 | escape: javascript | escape: javascript} '); \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}
{/ If}
{Section}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter} 'Keine Template-Variablen zugewiesen", HelpIcon), \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}
{/ Section}

{* Erstellen von Knoten für Smarty Konfigurations-Variablen *}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter}" zugeordnet Konfigurations-Variablen (äußere Rahmen Vorlage): ', new Array (closedGif, openGif)); \ n ");
_smarty_console.document.write ("rootNode.addChild (Knoten {$ counter}); \ n");
_smarty_console.document.write ("var parent = Knoten {$ counter}; \ n");
{$ Counter + +}

{* Erstellen Sie untergeordnete Knoten für Smarty Konfigurations-Variablen *}
{Section name = config_vars loop = $ _debug_config_keys}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter} '{ldelim} $ {$ _debug_config_keys [config_vars]} {} rdelim', pageIcon, '{$ _debug_config_vals [config_vars] | @ debug_print_var: 0:1000 | escape: javascript | escape: javascript} '); \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}
{Section}
_smarty_console.document.write ("var Knoten {$ counter} = new TreeNode ({$ counter} 'Keine config-Variablen zugewiesen", HelpIcon), \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter + +}
{/ Section}

_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 & Benutzer Debug-Konsole <\ / h3>");
(". <h4> Klicken Sie auf Variablen, die in dem Baum zu haben, deren Inhalt in der rechten Seitenwand angezeigt <\ / 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: ,
veröffentlicht in Guides , Programmierung von Owen

Folgen Sie Kommentare über den RSS-Feed | Kommentar schreiben | Trackback-URL

Lassen Sie Ihren Kommentar

© 2008 - 2014 - Alle Rechte vorbehalten - Ideamesh, Inc. 22 Abfragen. 0,313 Sekunden.