Februar
13
2006

Smarty Gewusst wie: Debuggen Javascript-Vorlage

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

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

Hier ist der Link, wo Sie die nanotree Javascript herunterladen ...
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 hinzugefügt, um benutzerdefinierte hand Debug vars ... Mein Debug-Struktur namens '_user_debug' und '_user_debug_key'

Für weitere Informationen, wie Sie 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 var-Abschnitt wickeln entfernen.

Eine andere Sache, möchten Sie vielleicht mit zu spielen ist, wie viele Zeichen als Wert für die Debug-Ausgabe sind. Geben Sie für diese und ändern Sie die zweite Zahl die max chars Ausgang ändern:debug_print_var: 0: 1000

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

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

PS Um alle bekommen die Javascript korrekt funktioniert müssen Sie nur ändern Sie die Zeile "var mynanopath =" und stellen Sie sicher, dass es zu Ihrem öffentlichen nanopath Verzeichnis verweist. Sie können mit den nanotree Paket von http://sourceforge.net/projects/nanotree/

Hier ist die aktualisierte Code

Code:
{*
Smarty Template Individuelle DHTML Debug
author Hielke Hoeve
author Owen Cole <owenc bei ideamesh dot com>
since 2006.02.13 Smarty 2.6.12
package Smarty
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, scrollbars = yes");
_smarty_console.document.write ("<html> <head> <title> Smarty Debug-Konsole _" + 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 ("; n tatsächlich zeigen den Baum \ * Und ShowTree (imagePath nennen).");
_smarty_console.document.write ("* Alternativ kann dies in einer Script-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");
_smarty_console.document.write ("* @ param TREENODE die TreeNode Objekt, das angeklickt haben. \ n");
_smarty_console.document.write ("* \ / \ n");
_smarty_console.document.write ("Funktion standardClick (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 "Bilder \ /folder_closed.gif'; \ n");
_smarty_console.document.write ("var openGif = '" + + mynanopath "Bilder \ /folder_open.gif'; \ n");
_smarty_console.document.write ("var pageIcon = '" + + mynanopath "Bilder \ /page16×16.gif'; \ n");
_smarty_console.document.write ("var usericon = '" + + mynanopath "Bilder \ /user_16×16.gif'; \ n");
_smarty_console.document.write ("var HelpIcon = '" + + mynanopath "Bilder \ /help_16×16.gif'; \ n");

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

{* Erstellen Knoten für Vorlage enthält *}
_smarty_console.document.write ("var Knoten {$ counter} = neue TreeNode ({$ counter}, 'mitgelieferten Vorlagen &-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% sogar} {else} #EEEEEE #fafafa {/ if}> <td colspan = 2> <tt> {section name = Gedankenstrich loop = $ _debug_tpls [Vorlagen] .depth} &&& {/ section} <font color = {if $ _debug_tpls [Vorlagen] .type eq "Vorlage"} {elseif $ braun _debug_tpls [Vorlagen] .type 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: ".% 5f"}) {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> ");
{/} Abschnitt
_smarty_console.document.write ("<\\ / table>");
_smarty_console.document.write ("'); \ n");

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

{* Erstellen Knoten für Benutzer Debug-Variablen *}
_smarty_console.document.write ("var Knoten {$ counter} = neue TreeNode ({$ counter}, 'Benutzer 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 = vars loop = $ _ user_debug}
_smarty_console.document.write ("var Knoten {$ counter} = neue 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} = neue TreeNode ({$ counter}, 'No User Debug-Informationen zugeordnet", HelpIcon); \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter ++}
{/} Abschnitt

{* Erstellen Knoten für Template-Variablen *}
_smarty_console.document.write ("var Knoten {$ counter} = neue 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 Template-Variablen *}
{Section name = vars loop = $ _ debug_keys}
{If $ _debug_keys [Vars]! = '_user_debug' && $ _debug_keys [Vars]! = '_user_debug_key'}
_smarty_console.document.write ("var Knoten {$ counter} = neue 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} = neue TreeNode ({$ counter}, 'Keine Template-Variablen zugewiesen", HelpIcon); \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter ++}
{/} Abschnitt

{* Erstellen Knoten für Smarty Konfigurations-Variablen *}
_smarty_console.document.write ("var Knoten {$ counter} = neue 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} = neue 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} = neue TreeNode ({$ counter}, 'Keine Config-Variablen zugewiesen", HelpIcon); \ n ");
_smarty_console.document.write ("parent.addChild (Knoten {$ counter}); \ n");
{$ Counter ++}
{/} Abschnitt

_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>");
_smarty_console.document.write ("<h4> Klicken Sie auf Variablen in der Baum, ihre Inhalte in der rechten Seitenwand angezeigt <\ / h4>.");
_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 | Hinterlasse einen Kommentar | Trackback-URL

Lassen Sie Ihren Kommentar

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