{"body": "<div class=\"section\" id=\"template-tags\">\n<h1>Template Tags<a class=\"headerlink\" href=\"#template-tags\" title=\"Permalink to this headline\">\u00b6</a></h1>\n<p>Django-lastfm contains only one template tag in <a class=\"reference internal\" href=\"#module-lastfm.templatetags.lastfm_widget\"><tt class=\"xref py py-mod docutils literal\"><span class=\"pre\">lastfm.templatetags.lastfm_widget</span></tt></a> that is used to load a context object\nwith all necessary data.</p>\n<div class=\"section\" id=\"module-lastfm.templatetags.lastfm_widget\">\n<span id=\"usage-of-the-template-tag\"></span><h2>Usage of the template tag<a class=\"headerlink\" href=\"#module-lastfm.templatetags.lastfm_widget\" title=\"Permalink to this headline\">\u00b6</a></h2>\n<p>This module defines a single template tag that will return a context object\nfor your Last.fm widget. It contains a title for the widget and a <tt class=\"docutils literal\"><span class=\"pre\">&lt;div&gt;</span></tt> container. This container includes the AJAX code that retrieves the data\nfrom the <tt class=\"docutils literal\"><span class=\"pre\">lastfm</span></tt> view and generates an image for each item.</p>\n<div class=\"highlight-html+django\"><div class=\"highlight\"><pre><span class=\"cp\">{%</span> <span class=\"k\">load</span> <span class=\"nv\">lastfm_widget</span> <span class=\"cp\">%}</span>\n\n<span class=\"cp\">{%</span> <span class=\"k\">get_lastfm_widget</span> <span class=\"k\">as</span> <span class=\"nv\">lastfm_widget</span> <span class=\"cp\">%}</span>\n<span class=\"nt\">&lt;h2&gt;</span><span class=\"cp\">{{</span> <span class=\"nv\">lastfm_widget.title</span> <span class=\"cp\">}}</span><span class=\"nt\">&lt;/h2&gt;</span>\n<span class=\"cp\">{{</span> <span class=\"nv\">lastfm_widget.content</span> <span class=\"cp\">}}</span>\n</pre></div>\n</div>\n<p>The generated code will roughly look like this:</p>\n<div class=\"highlight-html\"><div class=\"highlight\"><pre><span class=\"nt\">&lt;div</span> <span class=\"na\">class=</span><span class=\"s\">&quot;lastfm&quot;</span><span class=\"nt\">&gt;</span>\n    <span class=\"nt\">&lt;div&gt;&lt;a&gt;&lt;img</span> <span class=\"nt\">/&gt;&lt;/a&gt;&lt;/div&gt;</span>\n    <span class=\"nt\">&lt;div&gt;&lt;a&gt;&lt;img</span> <span class=\"nt\">/&gt;&lt;/a&gt;&lt;/div&gt;</span>\n    <span class=\"c\">&lt;!-- ... --&gt;</span>\n<span class=\"nt\">&lt;/div&gt;</span>\n</pre></div>\n</div>\n<p>The surrounding <tt class=\"docutils literal\"><span class=\"pre\">&lt;div&gt;</span></tt> has the CSS class <em>lastfm</em>. You can use this to\ncustomize the style of the widget. This how it could look like:</p>\n<div class=\"highlight-css\"><div class=\"highlight\"><pre><span class=\"nf\">#sidebar</span> <span class=\"o\">&gt;</span> <span class=\"nf\">#lastfm</span> <span class=\"p\">{</span>\n    <span class=\"k\">min-height</span><span class=\"o\">:</span> <span class=\"m\">225px</span><span class=\"p\">;</span> <span class=\"c\">/* required due to &quot;float: left&quot; in the next sec. */</span>\n<span class=\"p\">}</span>\n\n<span class=\"nf\">#sidebar</span> <span class=\"nf\">#lastfm</span> <span class=\"nt\">div</span> <span class=\"p\">{</span>\n    <span class=\"k\">width</span><span class=\"o\">:</span> <span class=\"m\">54px</span><span class=\"p\">;</span>\n    <span class=\"k\">height</span><span class=\"o\">:</span> <span class=\"m\">39px</span><span class=\"p\">;</span>\n    <span class=\"k\">overflow</span><span class=\"o\">:</span> <span class=\"k\">hidden</span><span class=\"p\">;</span>\n    <span class=\"k\">float</span><span class=\"o\">:</span> <span class=\"k\">left</span><span class=\"p\">;</span>\n    <span class=\"k\">border</span><span class=\"o\">:</span> <span class=\"m\">1px</span> <span class=\"k\">solid</span> <span class=\"nb\">white</span><span class=\"p\">;</span>\n    <span class=\"o\">-</span><span class=\"n\">moz</span><span class=\"o\">-</span><span class=\"k\">border</span><span class=\"o\">-</span><span class=\"n\">radius</span><span class=\"o\">:</span> <span class=\"m\">2px</span><span class=\"p\">;</span>\n    <span class=\"o\">-</span><span class=\"n\">khtml</span><span class=\"o\">-</span><span class=\"k\">border</span><span class=\"o\">-</span><span class=\"n\">radius</span><span class=\"o\">:</span> <span class=\"m\">2px</span><span class=\"p\">;</span>\n    <span class=\"k\">border</span><span class=\"o\">-</span><span class=\"n\">radius</span><span class=\"o\">:</span> <span class=\"m\">2px</span><span class=\"p\">;</span>\n    <span class=\"k\">margin</span><span class=\"o\">:</span> <span class=\"m\">0px</span> <span class=\"m\">2px</span> <span class=\"m\">4px</span> <span class=\"m\">2px</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n\n<span class=\"nf\">#sidebar</span> <span class=\"nf\">#lastfm</span> <span class=\"nt\">div</span><span class=\"nd\">:active</span><span class=\"o\">,</span> <span class=\"nf\">#sidebar</span> <span class=\"nf\">#lastfm</span> <span class=\"nt\">div</span><span class=\"nd\">:hover</span> <span class=\"p\">{</span>\n    <span class=\"k\">border-color</span><span class=\"o\">:</span> <span class=\"m\">#9FC765</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n\n<span class=\"nf\">#sidebar</span> <span class=\"nf\">#lastfm</span> <span class=\"nt\">img</span> <span class=\"p\">{</span>\n    <span class=\"k\">width</span><span class=\"o\">:</span> <span class=\"m\">54px</span><span class=\"p\">;</span>\n    <span class=\"k\">min-height</span><span class=\"o\">:</span> <span class=\"m\">39px</span><span class=\"p\">;</span>\n<span class=\"p\">}</span>\n</pre></div>\n</div>\n</div>\n<div class=\"section\" id=\"implementation\">\n<h2>Implementation<a class=\"headerlink\" href=\"#implementation\" title=\"Permalink to this headline\">\u00b6</a></h2>\n<p>As for every template tag, there is a compilation function (<a class=\"reference internal\" href=\"#lastfm.templatetags.lastfm_widget.get_lastfm_widget\" title=\"lastfm.templatetags.lastfm_widget.get_lastfm_widget\"><tt class=\"xref py py-func docutils literal\"><span class=\"pre\">get_lastfm_widget()</span></tt></a>) and a renderer (<a class=\"reference internal\" href=\"#lastfm.templatetags.lastfm_widget.LastfmWidgetNode\" title=\"lastfm.templatetags.lastfm_widget.LastfmWidgetNode\"><tt class=\"xref py py-class docutils literal\"><span class=\"pre\">LastfmWidgetNode</span></tt></a>) that do all the work.</p>\n<dl class=\"class\">\n<dt id=\"lastfm.templatetags.lastfm_widget.LastfmWidgetNode\">\n<em class=\"property\">class </em><tt class=\"descclassname\">lastfm.templatetags.lastfm_widget.</tt><tt class=\"descname\">LastfmWidgetNode</tt><big>(</big><em>var_name</em><big>)</big><a class=\"headerlink\" href=\"#lastfm.templatetags.lastfm_widget.LastfmWidgetNode\" title=\"Permalink to this definition\">\u00b6</a></dt>\n<dd><p>This class will create a context object named <tt class=\"docutils literal\"><span class=\"pre\">var_name</span></tt>. It will \ncontain the <tt class=\"docutils literal\"><span class=\"pre\">title</span></tt> and the <tt class=\"docutils literal\"><span class=\"pre\">content</span></tt> of the widget.</p>\n</dd></dl>\n\n<dl class=\"function\">\n<dt id=\"lastfm.templatetags.lastfm_widget.get_lastfm_widget\">\n<tt class=\"descclassname\">lastfm.templatetags.lastfm_widget.</tt><tt class=\"descname\">get_lastfm_widget</tt><big>(</big><em>parser</em>, <em>token</em><big>)</big><a class=\"headerlink\" href=\"#lastfm.templatetags.lastfm_widget.get_lastfm_widget\" title=\"Permalink to this definition\">\u00b6</a></dt>\n<dd><p>Get the variable name for the widget from the template tag.</p>\n</dd></dl>\n\n</div>\n</div>\n", "display_toc": true, "title": "Template Tags", "sourcename": "ref/templatetags.txt", "customsidebar": null, "current_page_name": "ref/templatetags", "next": {"link": "../views/", "title": "Views"}, "rellinks": [["genindex", "General Index", "I", "index"], ["py-modindex", "Python Module Index", "", "modules"], ["ref/views", "Views", "N", "next"], ["ref/index", "API-Reference", "P", "previous"]], "meta": {}, "parents": [{"link": "../", "title": "API-Reference"}], "sidebars": null, "toc": "<ul>\n<li><a class=\"reference internal\" href=\"#\">Template Tags</a><ul>\n<li><a class=\"reference internal\" href=\"#module-lastfm.templatetags.lastfm_widget\">Usage of the template tag</a></li>\n<li><a class=\"reference internal\" href=\"#implementation\">Implementation</a></li>\n</ul>\n</li>\n</ul>\n", "prev": {"link": "../", "title": "API-Reference"}, "metatags": ""}