From 47d23582d3d37fcabec51359c62b66fc5b0b398a Mon Sep 17 00:00:00 2001
From: garafu <garafo@gmail.com>
Date: Sat, 11 Jul 2015 17:28:58 +0900
Subject: [PATCH] Add showing thumbnail function. resolve #3

Can show thumbnail image in the list item.
---
 blogger.toc.csproj                      |   1 +
 build.bat                               |   2 +-
 build/blogger.toc.min.js                |  22 +++----
 demo/index_compile.html                 |   6 +-
 demo/index_nocompile.html               |  10 ++-
 images/noimage.png                      | Bin 0 -> 7516 bytes
 src/blogger/toc/contract.js             |  12 ++++
 src/blogger/toc/main.js                 |   3 +-
 src/blogger/toc/printer/entry.js        |  41 ++++++++++--
 src/blogger/toc/printer/labelprinter.js |   8 ---
 src/blogger/toc/printer/titleprinter.js |  79 ++++++++++++++++++------
 src/blogger/toc/settings.js             |  50 ++++++++-------
 stylesheets/simple.css                  |  23 ++++++-
 stylesheets/tile_emerald.css            |  18 ++++++
 stylesheets/tile_steel.css              |  18 ++++++
 stylesheets/white.css                   |  28 ++++++++-
 16 files changed, 245 insertions(+), 76 deletions(-)
 create mode 100644 images/noimage.png

diff --git a/blogger.toc.csproj b/blogger.toc.csproj
index b14b7e2..e9ed07b 100644
--- a/blogger.toc.csproj
+++ b/blogger.toc.csproj
@@ -63,6 +63,7 @@
     <Content Include="build\blogger.toc.min.js" />
     <Content Include="demo\index_compile.html" />
     <Content Include="demo\index_nocompile.html" />
+    <Content Include="images\noimage.png" />
     <Content Include="lib\bootstrap\css\bootstrap-theme.css" />
     <Content Include="lib\bootstrap\css\bootstrap-theme.min.css" />
     <Content Include="lib\bootstrap\css\bootstrap.css" />
diff --git a/build.bat b/build.bat
index bc90e8c..2197b04 100644
--- a/build.bat
+++ b/build.bat
@@ -42,6 +42,6 @@ rem    --compiler_flags="--formatting=pretty_print" ^
 
 
 rem Add copyright at header.
-echo /** Copyright (c) 2013 akinari tsugo */>tmp.txt
+echo /** Copyright (c) 2013-2015 akinari tsugo */>tmp.txt
 copy /b tmp.txt+%OUTPUT_FILE% tmp.txt
 move tmp.txt %OUTPUT_FILE%
diff --git a/build/blogger.toc.min.js b/build/blogger.toc.min.js
index ba8c4fb..828bf12 100644
--- a/build/blogger.toc.min.js
+++ b/build/blogger.toc.min.js
@@ -1,12 +1,10 @@
-/** Copyright (c) 2013 akinari tsugo */
-(function(){function h(a){return function(){return a}}function k(a,b){function c(){}c.prototype=b.prototype;a.r=b.prototype;a.prototype=new c};function l(a){this.a=a};function n(a){this.a=a}k(n,l);n.prototype.execute=function(a){a=a.entry||[];var b,c,e,d;b=document.createElement("ul");b.className="poststoc-list";e=0;for(d=a.length;e<d;e++)c=document.createElement("li"),c.appendChild(r(a[e])),c.className="poststoc-item",b.appendChild(c);return b};
-function r(a){var b=document.createElement("span"),c=document.createElement("span"),e=document.createElement("span"),d=document.createElement("a");c.appendChild(document.createTextNode(a.published.$t));c.className="poststoc-published";e.appendChild(document.createTextNode(a.updated.$t));e.className="poststoc-updated";d.appendChild(document.createTextNode(a.title.$t));d.href=a.link[a.link.length-1].href;d.className="poststoc-title";b.appendChild(c);b.appendChild(e);b.appendChild(d);b.className="poststoc-entry";
-return b};function s(a,b){this.a=a;this.c=b;this.d=null;this.g()}s.prototype.getName=function(){return this.c.title.o};
-s.prototype.g=function(){var a=this.c,b=document.createElement("span"),c=document.createElement("span"),e=document.createElement("span"),d=document.createElement("a");c.appendChild(document.createTextNode(a.published.$t));c.className="poststoc-published";e.appendChild(document.createTextNode(a.updated.$t));e.className="poststoc-updated";d.appendChild(document.createTextNode(a.title.$t));d.href=a.link[a.link.length-1].href;d.className="poststoc-title";b.appendChild(c);b.appendChild(e);b.appendChild(d);
-b.className="poststoc-entry";this.d=b};function t(a,b){this.a=a;this.c=b;this.f=this.n=this.d=null;this.g()}t.prototype.getName=function(){return this.c.term};
-t.prototype.g=function(){var a=this.a,b=this.c.term,c=document.createElement("div"),e=document.createElement("div"),d=document.createElement("a"),f=document.createElement("ul"),a="http://"+a.j,a=a+"/search/label/",a=a+b;d.appendChild(document.createTextNode(b));d.href=a;d.className="poststoc-category-anchor";e.appendChild(d);e.className="poststoc-category-title";f.className="poststoc-list";c.appendChild(e);c.appendChild(f);c.className="poststoc-category";this.d=c;this.n=e;this.f=f};function u(a){this.a=a}k(u,l);u.prototype.execute=function(a){var b=this.a,c=a.entry||[];a=a.category||[];var e,d,f,C,m,D,p,E,g,q;C={};m=[];D=document.createDocumentFragment();e=0;for(f=c.length;e<f;e++)for(E=c[e],a=E.category||[],d=a.length;d--;)p=a[d],q=new s(b,E),g=C[p.term],g||(g=new t(b,p),C[p.term]=g,m[m.length]=g),p=q.d,g=g.f,q=document.createElement("li"),q.className="poststoc-item",q.appendChild(p),g.appendChild(q);m=this.sort(m);e=0;for(f=m.length;e<f;e++)D.appendChild(m[e].d);return D};
-u.prototype.sort=function(a){return a};function v(a){this.a=a}k(v,u);v.prototype.sort=function(a){return a.sort(function(a,c){return a.f.childNodes.length<c.f.childNodes.length?1:-1})};function w(a){this.a=a}w.prototype.e=h("published");w.prototype.execute=function(){};function x(a){this.a=a}k(x,w);x.prototype.e=h("published");x.prototype.execute=function(){};function y(a){this.a=a}k(y,u);y.prototype.sort=function(a){return a.sort(function(a,c){return a.getName()<c.getName()?-1:1})};function z(){var a=window.POSTSTOC_SETTINGS||{};this.j=A(a.blogURL,"garafu.blogspot.jp");this.h=A(a.maxResults,Infinity);this.style=A(a.style,"");this.l=A(a.orderby,"published");this.m=A(a.printby,"label");this.p=A(a.labelListEnabled,!0);this.s=A(a.updatedDateEnabled,!1);this.q=A(a.publishedDateEnabled,!0)}function A(a,b){return void 0!==a?a:b};function B(a,b,c){var e;B=e=window.addEventListener?function(a,b,c){a.addEventListener(b,c,!1)}:window.attachEvent?function(a,b,c){a.attachEvent("on"+b,c)}:function(a,b,c){a["on"+b]=c};e(a,b,c)};function F(a){this.a=a}k(F,w);F.prototype.e=h("published");F.prototype.execute=function(a){(a.entry||[]).sort(function(a,c){return a.title.$t>c.title.$t?1:-1})};function G(a){this.a=a}k(G,w);G.prototype.e=h("updated");G.prototype.execute=function(){};function H(){this.a=new z;this.i=I(this);this.k=J(this);this.b=0;K(this)}var L="__garafu.blogger.toc__"+(new Date).getTime(),M=null,contract=contract||void 0,N=contract;function O(){var a=M;a||(M=a=new H);return a}
-function K(a){var b,c,e;b=a.b+1;e=a.b+500<a.a.h?a.b+500:a.a.h-a.b;var d=a.a;c=a.i;d="http://"+d.j;d+="/feeds/posts/summary?";d+="redirect=false&";d+="start-index="+b+"&";d+="max-results="+e+"&";d+="orderby="+c.e()+"&";d+="alt=json-in-script&";d+="callback=";b=d+="garafu.blogger.toc.load";c=document.createElement("script");c.src=b;c.type="text/javascript";document.body.appendChild(c);a.b=e}H.prototype.sort=function(a){this.i.execute(a.feed||{})};
-H.prototype.print=function(a){a=this.k.execute(a.feed||{});var b=document.createElement("div"),c=document.createElement("a");document.createElement("a");document.createElement("a");c.href="https://github.com/garafu/blogger.toc";c.appendChild(document.createTextNode('This page uses "blogger.toc" created by garafu.'));b.appendChild(c);b.style.display="block";b.style.fontSize="small";b.style.margin="20px 0";a.appendChild(b);document.getElementById(L).appendChild(a)};
-function I(a){a=a.a;switch(a.l.toLowerCase()){case "published":return new x(a);case "updated":return new G(a);case "title":return new F(a);default:return new x(a)}}function J(a){a=a.a;switch(a.m.toLowerCase()){case "title":return new n(a);case "label":return new u(a);case "label.nameorder":return new y(a);case "label.contentsorder":return new v(a);default:return new n(a)}}B(window,"load",function(){O()});document.write('<div id="'+L+'" class="poststoc">LOAD DATA ...</div>');
-function P(a){var b,c,e;b=O();N?a.feed.entry&&0!=a.feed.entry.length&&(c=N.feed.entry,e=a.feed.entry,c=c.concat(e),N.feed.entry=c):N=a;if(b.a.h<=b.b||!a.feed.entry||a.feed.entry&&0===a.feed.entry.length){for(a=document.getElementById(L);c=a.firstChild;)a.removeChild(c);b.sort(N);b.print(N)}else K(b)}var Q=["garafu","blogger","toc","load"],R=this;Q[0]in R||!R.execScript||R.execScript("var "+Q[0]);for(var S;Q.length&&(S=Q.shift());)Q.length||void 0===P?R=R[S]?R[S]:R[S]={}:R[S]=P;})();
+/** Copyright (c) 2013-2015 akinari tsugo */
+(function(){function k(a){return function(){return a}}function l(a,c){function b(){}b.prototype=c.prototype;a.l=c.prototype;a.prototype=new b};function n(a,c){this.a=a;this.d=c;this.c=null;this.g()}n.prototype.getName=function(){return this.d.title.k};
+n.prototype.g=function(){var a=this.a,c=this.d,b=document.createElement("span"),e=document.createElement("span"),d=document.createElement("span"),f=document.createElement("span"),g=document.createElement("a");a.thumbnail.enabled&&(f.appendChild(r(this,c.media$thumbnail)),f.className="poststoc-thumbnail");e.appendChild(document.createTextNode(c.published.$t));e.className="poststoc-published";d.appendChild(document.createTextNode(c.updated.$t));d.className="poststoc-updated";g.appendChild(document.createTextNode(c.title.$t));
+g.href=c.link[c.link.length-1].href;g.className="poststoc-title";a.thumbnail.enabled&&b.appendChild(f);b.appendChild(e);b.appendChild(d);b.appendChild(g);b.className="poststoc-entry";this.c=b};function r(a,c){var b=document.createElement("img");c?(b.src=c.url,b.className="poststoc-thumbnail-image"):(b.src=a.a.thumbnail.noImageURL,b.className="poststoc-thumbnail-noimage");return b};function s(a){this.a=a};function t(a){this.a=a}l(t,s);t.prototype.execute=function(a){a=a.entry||[];var c,b,e,d;c=document.createElement("ul");c.className="poststoc-list";e=0;for(d=a.length;e<d;e++)b=document.createElement("li"),b.appendChild(u(this,a[e])),b.className="poststoc-item",c.appendChild(b);return c};function u(a,c){c=new n(a.a,c);return c.c};function v(a,c){this.a=a;this.d=c;this.f=this.j=this.c=null;this.g()}v.prototype.getName=function(){return this.d.term};
+v.prototype.g=function(){var a=this.a,c=this.d.term,b=document.createElement("div"),e=document.createElement("div"),d=document.createElement("a"),f=document.createElement("ul"),a="http://"+a.blogURL,a=a+"/search/label/",a=a+c;d.appendChild(document.createTextNode(c));d.href=a;d.className="poststoc-category-anchor";e.appendChild(d);e.className="poststoc-category-title";f.className="poststoc-list";b.appendChild(e);b.appendChild(f);b.className="poststoc-category";this.c=b;this.j=e;this.f=f};function w(a){this.a=a}l(w,s);w.prototype.execute=function(a){var c=this.a,b=a.entry||[];a=a.category||[];var e,d,f,g,m,C,p,D,h,q;g={};m=[];C=document.createDocumentFragment();e=0;for(f=b.length;e<f;e++)for(D=b[e],a=D.category||[],d=a.length;d--;)p=a[d],q=new n(c,D),h=g[p.term],h||(h=new v(c,p),g[p.term]=h,m[m.length]=h),p=q.c,h=h.f,q=document.createElement("li"),q.className="poststoc-item",q.appendChild(p),h.appendChild(q);m=this.sort(m);e=0;for(f=m.length;e<f;e++)C.appendChild(m[e].c);return C};
+w.prototype.sort=function(a){return a};function x(a){this.a=a}l(x,w);x.prototype.sort=function(a){return a.sort(function(a,b){return a.f.childNodes.length<b.f.childNodes.length?1:-1})};function y(a){this.a=a}y.prototype.e=k("published");y.prototype.execute=function(){};function z(a){this.a=a}l(z,y);z.prototype.e=k("published");z.prototype.execute=function(){};function A(a){this.a=a}l(A,w);A.prototype.sort=function(a){return a.sort(function(a,b){return a.getName()<b.getName()?-1:1})};function B(){E(this,this,POSTSTOC_SETTINGS,{blogURL:"garafu.blogspot.jp",maxResults:Infinity,orderby:"published",printby:"label",thumbnail:{enabled:!1,noImageURL:"http://garafu.github.io/blogger.toc/release/0.0.4/noimage.png"}})}function E(a,c,b,e){var d;b=b||{};for(d in e)"object"===typeof e[d]?(c[d]=c[d]||{},E(a,c[d],b[d],e[d])):c[d]=void 0!==b[d]?b[d]:e[d]};function F(a,c,b){var e;F=e=window.addEventListener?function(a,b,c){a.addEventListener(b,c,!1)}:window.attachEvent?function(a,b,c){a.attachEvent("on"+b,c)}:function(a,b,c){a["on"+b]=c};e(a,c,b)};function G(a){this.a=a}l(G,y);G.prototype.e=k("published");G.prototype.execute=function(a){(a.entry||[]).sort(function(a,b){return a.title.$t>b.title.$t?1:-1})};function H(a){this.a=a}l(H,y);H.prototype.e=k("updated");H.prototype.execute=function(){};function I(){this.a=new B;this.h=J(this);this.i=K(this);this.b=0;L(this)}var M="__garafu.blogger.toc__"+(new Date).getTime(),N=null,contract=contract||void 0,O=contract;function P(){var a=N;a||(N=a=new I);return a}
+function L(a){var c,b,e;c=a.b+1;e=a.b+500<a.a.maxResults?a.b+500:a.a.maxResults-a.b;var d=a.a;b=a.h;d="http://"+d.blogURL;d+="/feeds/posts/summary?";d+="redirect=false&";d+="start-index="+c+"&";d+="max-results="+e+"&";d+="orderby="+b.e()+"&";d+="alt=json-in-script&";d+="callback=";c=d+="garafu.blogger.toc.load";b=document.createElement("script");b.src=c;b.type="text/javascript";document.body.appendChild(b);a.b=e}I.prototype.sort=function(a){this.h.execute(a.feed||{})};
+I.prototype.print=function(a){a=this.i.execute(a.feed||{});var c=document.createElement("div"),b=document.createElement("a");document.createElement("a");document.createElement("a");b.href="https://github.com/garafu/blogger.toc";b.appendChild(document.createTextNode('This page uses "blogger.toc" created by garafu.'));c.appendChild(b);c.style.display="block";c.style.fontSize="small";c.style.margin="20px 0";a.appendChild(c);document.getElementById(M).appendChild(a)};
+function J(a){a=a.a;switch(a.orderby.toLowerCase()){case "published":return new z(a);case "updated":return new H(a);case "title":return new G(a);default:return new z(a)}}function K(a){a=a.a;switch(a.printby.toLowerCase()){case "title":return new t(a);case "label":return new w(a);case "label.nameorder":return new A(a);case "label.contentsorder":return new x(a);default:return new t(a)}}F(window,"load",function(){P()});document.write('<div id="'+M+'" class="poststoc">LOAD DATA ...</div>');
+function Q(a){var c,b,e;c=P();O?a.feed.entry&&0!=a.feed.entry.length&&(b=O.feed.entry,e=a.feed.entry,b=b.concat(e),O.feed.entry=b):O=a;if(c.a.maxResults<=c.b||!a.feed.entry||a.feed.entry&&0===a.feed.entry.length){for(a=document.getElementById(M);b=a.firstChild;)a.removeChild(b);c.sort(O);c.print(O)}else L(c)}var R=["garafu","blogger","toc","load"],S=this;R[0]in S||!S.execScript||S.execScript("var "+R[0]);for(var T;R.length&&(T=R.shift());)R.length||void 0===Q?S=S[T]?S[T]:S[T]={}:S[T]=Q;})();
diff --git a/demo/index_compile.html b/demo/index_compile.html
index a72b5ee..2b45e87 100644
--- a/demo/index_compile.html
+++ b/demo/index_compile.html
@@ -7,12 +7,16 @@
 </head>
 <body>
 <div>
+  <h1>Compile Mode</h1>
   <div id="main">
     <script type="text/javascript">
     var POSTSTOC_SETTINGS = {
         blogURL: 'garafu.blogspot.jp',
         orderby: 'published',
-        printby: 'title'
+        printby: 'label',
+        thumbnail: {
+            enabled: true
+        }
     };
     </script>
     <script type="text/javascript" src="../build/blogger.toc.min.js"></script>
diff --git a/demo/index_nocompile.html b/demo/index_nocompile.html
index 5370dfa..fd2d73d 100644
--- a/demo/index_nocompile.html
+++ b/demo/index_nocompile.html
@@ -2,17 +2,21 @@
 <html>
 <head>
     <title></title>
-    <link rel="stylesheet" type="text/css" href="../lib/bootstrap/css/bootstrap.css" />
+    <!--<link rel="stylesheet" type="text/css" href="../lib/bootstrap/css/bootstrap.css" />-->
     <link rel="stylesheet" type="text/css" href="../stylesheets/simple.css" />
 </head>
 <body>
 <div>
+  <h1>No Compile Mode</h1>
   <div id="main">
     <script type="text/javascript">
     var POSTSTOC_SETTINGS = {
         blogURL: 'garafu.blogspot.jp',
-        orderby: 'title',
-        printby: 'label'
+        orderby: 'published',
+        printby: 'label.contentsorder',
+        thumbnail: {
+            enabled: false
+        }
     };
     </script>
     <script type="text/javascript" src="../lib/closure-library/closure/goog/base.js"></script>
diff --git a/images/noimage.png b/images/noimage.png
new file mode 100644
index 0000000000000000000000000000000000000000..80bd21876e0163f93ab18f6702c9e7a273fd3ad6
GIT binary patch
literal 7516
zcmaJm1yohhmY0wc5a~`SK^n<NN=S#av~)^5It1zN?v@7<BHi67-Q5k3W}biM&ze7L
z{@k_BJ?qroclSQ~hA1gWVW1JC0RVvUQTl@ltnd5VP>^8nGR^W#Schsat>p*+FLC}h
zI3P8h5CG8REyTr@l+5j%>>SPQ>?uEri&NS=*qK^bn*f08e1@uvW*ih>Xa#EWN?mOB
zv@*&18$eA1LFvQN%EgKW48LPxi*yGBqp9QKy-t@_>+<`9CY=$yp3P8aCK?*79j5k~
z_n2a_sK(3v<ml*r=Duksedl4sZS<AzYizoh?OaQMPbEN*f0iOjQM#+Y*%uy9dKHlp
zYkRQ6>_s;KoFcfndOKAJKfwL81K<JsKP+#sd)J=*8<glY0LmC(l^T2JC0w)$(8uzr
z4;Sbo1S(Xkzn}r}0ATIrDMk(azyJ;}KMK77W=rB034qyL(h?LP0uD%Fka`0z(g+x+
zeN$nEZ|eZEAtKZ)h;8L?zFNOIq~Lv<UjX1p&FEJm27qsh81oQ7$qNsNlj95{P|6`>
zvrV+Fmgw6D)JekuZG#EJNwO21xOE9*#4hKjtLs$j9oCg%h6IdQrl_0L=}BocIMO=^
zawF&fKzuvi{=_RBy|cZ!wr#p&eRA2I`($-$M=eBkw(`^z4vz?6DU6=X>u+sMBiQ%C
zRXDd=mFNKT>VWymtuE&RYPL4onEP#*8}EY%d1j7MpCB12+RK+mv_?72Y#U)h&zx&^
zt6|>Pu+^sp_fz0&sz^#%Tb}>pS3_HHxk}{DAfgz%Ep&(GsW-sqF_Lk7ovZRQGhXPK
zW=Ne9wS2Ezy-Lgns{Vv^>^&cjGm6AV)HoLm01~L!rtllNX3)CL`xp*B3{!Ig42XDN
zybC9O83SOMadEgo0U)mRHcEsE4j4|#-vEH7UBb`B@dR=`C;;#w``g<JQDpRXTu2*c
zdOKND8v(o_(gzXrH*JDgVo005q-Z&WiK0ZG+W2P?Ybp?kvtOsKVf|`n=f&7r#s2*5
zz@7lffH1RzuqhA~QM3;Q$B>FY__a~wEcFNqK}sYdwV^autZzQ$UNEjQb$6dbK75Io
zWsI&g&G|bAT)v3UB6raXeUu!b51~y`?D5~Klo6)joki-4DTqURvK_~rxL)b{Cgxg=
z6aOLy`Tou=8kgO5b^^RYBaMB>*)dJS=L|oG2T2%&XcE));u~*ia;ryi8<T1BfbmG$
zG7V2q-oS_X;vAyreaGss_KS{|(v;H_FQz@D`GwtpqJirFoxOveI<8pp7p*(?ZI`PN
ze`U0$B!upmikvEwR*xPNM?X&b4Q7ArrUDujZ8XQnmmjU97o^|itL6($U|FQg(H%tF
z^e=CsRQW<ElVWP4Uqvg%-uHKI*5dMa2d~Sa=DtzMkH?nbHWA)JEXd*zOUeGBJY14F
zh4LeqKTG?gO*UAGRW+yths!yYb~p`Rd@%oA-k-5l3o{F-IqRNN1L~4LxkS=f(uCD6
z^4`v#|D_8$Mj(cNue1>Zkrj~#Q4wJ+5o?NE;fu+nl)g`FGaMu-X34LT?bI~iUcdFk
ziy6R9;7?Fb@J`tI@kz~5P56)7kC&fH)n1kAse2Vls#Pm(l%P)Gm;NasQ)?`FUp}JZ
zq7tPvs;r;aqW|c3XN*x57$BJ)D4qAoxVDEVf(pNf!{kg;Y}!E`;egpHS>8ye>h@3$
z{NkPj%<3VhD(?8h6k-}<nz8+L7!I?ia`lvNE?s7XY6N4%;~l~~;dhnOmSv`8-eo-V
z?(;44Mn?`u_(uoxC(ia6A{opXSNt~oP-oPJ_YKMo0Sybzqx(XW#s_YDs8<75n0rg(
zQdc&Yc~=DcC(|e66g+HPDDR_*tl4>uPluw7cde2w>c&sMuNA)@G;fIMGS3_Tm`7hn
zcN}E4!R<;QWD2n(HG*(0n=D!h8X8$}EaZ3PcW<^Z4#!)inl_C8nsgc(>SJDn%tHDP
zBl-TMTV)!y%rz}ML<AH_q<71Ny$|b6oKN%|e32-h2!$l83#q%QU#ZVPK2Co=U_P*!
z*05G0(MUs2<4+s>U0jw{)&)+pS;1Y$jbfZ&yi&EDXFq&6L_179L^|TTHoT_2wz(c9
z8zRLfn-*{q@N{r;9s*n2Hyz}!adnn-m2~cDn30&}IA&aM6BNou4`L^QlL%C8ib9KQ
zv)l(0wup}#CTb?H^3od97R%;rrj~|4-Cm{l@+@g2{kol?6Vc04sOI|Dp^c29w4#oS
z=p9x)u%4FQeKWaYbvj+<G@DJ|LYK~J^Pq<TzYxgeZe$NZs7DAs%RMWorLcv11=K?0
zJ?)+1jr@>#FK{>b7<JRS=5~&Mrtrc5t{rX*uK64Bw`v3{1Pa6y!~$gQ7ZEQSkyz1%
z@WjwjF|;Tg;_TW8&Pi^KITy{CQ^)ZJP%`keN$%K&=;X+!Uq=RxqO4$f+ZEo*?G61#
z30{@54z8oHAW9*)^}=O*%khI{U-_4+(^n@b^E6~r>)xz6@+_((yk20z^0x!n3}R`m
zVr_hwR_9yyqwbq)(2c}d61Ef08`Pta&92!lP{@WO{El@hXZmL9r$i^?@~y?(dV=k}
zk-<zCK`m~rXiwgNWbC9W;VpkkF(p<)#jPS+c`}^y?`Z*w5-qtAxyqHbbuxmn+ZpN!
z*St#tUgCG=fr^sOJ)EeDDok!MM6vZW7xL;Krk5e3b6@A)@x`adr{}3)SS0>pnqjMD
zs8uv&Vv57qblbKWAc+eafNs*<I$kW`SqI3C=lxPCSHi@XV=ZQK)gjbzt&?t+)}G>A
zF@4&<rFrRx@7Ww(p;T8<JzM9hb+$^~D$$5f6Q)Yw!oser((uLA;&j4m(0s5e@lk1A
zQ$_9E(rxiPQpJCwpg^3-PlGF=B))&pw)|4N-Wbm?;fvadWzruVb)UBc3HlIwNOAd1
zg=F3Kx`u-OAI~c{oB8==nc9J)1L=eO16v4GtM#W$v!&>tvA|P|GLo~1EfRejnPsOO
zcgw5D;a|f8!wB4l+($Y?zab0fIq&nX-7|c22h|_TN^4u@=;o(ems~t9F#XB!1eQ<Y
z51VS3Ts5qkCA_X|CyxD=qKJ)18d|r#m+GWk6uUE{JPJIJuO&_nES>DE7k{?4R-xLc
zypJH4=C|KU^R=5#J4$t_vDbc!*&({sPQOy<>9L`-n={h6*g3qC;!}Htav<%-G{N8M
z40)GllMTvgKG_Y=%OKMulWM7b_C8_XFm~?cj?&1?&R_tY-ER8DZ4`Ye%FIv@22G_b
zx<Tb0Qmk~9b(_t^M>B;9oQ~yc^`ZS2%R5oJr%m>k)KH@Z+FIE%P&r7-+x~G)`lpWF
zfeCc*NJFsP=~DhcVEkm#=gzY2kK@eE42y1-Tk}cJAxW(*-4baXZNt?K`1**z1?^aF
zQP(}n_2)y&{Nq0I-K%|{Ur&`LZ8obn25knTom#I>Fj0dtpW>e<gVrXbhNS+`NYX?^
zWl&I%U=TN-e;J8eE2=8O86EIee|9@?EZtdoT)&qc)qI#eeR&%;+FI^ba^Y}NTJn>>
zm!_AZX~Ye5R`^ghvfy=6cha!Z+f0$d@F4P}bTNKs+*>rJ2o>7#e0pGoe!sY<oyg*Z
zWt)`7(kk)*;7$twzWxAk`wZ*%0Kl0I0QL<4fIk@k2<&3@yCnetJLKaB(NC`PhZ#O{
zIx|Z_6xjZUhDDsja&=+iIU=Ervnan+0xU)MNeYy6WVoZT-{s2`@=R!##1UI0EVs<l
zZAGce<V#rQ7OIQ~)8&4fk~XnaQe{+@;Wy9rQy3FPmY4IV5oo6ZTOzP{KLaEJgy(q{
z%d4K`j6MeXD~lH(DBq69F&}g}+?<P80wo3;p{>Sh1{ak|r9y@ZOUw_2O7wd)rI<7p
z)tg`}><=iY)ZY<b|DFC{!++iN?+%H=Qs(~w<6jTKK>weZ{;})75ubG$D52O!nR5+9
zknr3bH=axs%9U#Tq!SQG3lB$Et3a$5ppHSw@;pa18%d`k#Vpdj4VR=zdvCLzVwTx%
zFt%sUNi=TG<$g5JEnyU*x3SqDmk#nsH0Mffp%;}zQd3iFI_-G5FF)nKC`7>Wc{S_#
zVJFt%;igx3+okoMEK2aa&*sF@!6BALD)N+)TV~umetB6hU4cFdbe;TG&;N3P;ETKa
zT@J&+<s}ykfKovza=q8_j<4s{{-3Ft8C6Y9SN*5fk`l(JCur-%Fwe?EYrKYEut08h
zHW1V)s;)lmb^9!q6OFWmy%}TzLsYxsou*c5E3BH4kwJ@v!n_a4blXn3rwfXvgxc79
zJl<V-OnBhp;W1`oe=)g;%X;{(|G2O5#ng0p@^StMd_|7^Wy|<|+U@PAPh|fW6*h8g
zrxcC9{8WKZq)WdMqr{R9>+ghp5OqxOTQ$E$ftK5C5=?TzViAUJY_VcwH-If|_+g!(
zwQbKSHZ3iUs}TeO4JR;Z+^mPO^7=dpwi_tH#ZkUOwwi_*9!!_<W{l99tyfo7Rm@q>
zTEBm9w>-3y<ufAuboL5H7CeLKMAFs4%;eaZ2pDF~I~}F!%350eIEsRzR#r^UFs9&1
zM~F^@!K9h#eP;naUUZXkcoUnEF+7qX;C8oH<m?#d9(|eH)RYbb>plK<er`^SMXyO(
zU!MZTZ%R^3V=iJw28OmRhf3R}hJ3Ce1GdwLi&0K)?rzwD@-~_1gwY1)gW}Rsoi{<f
z8#!fV5wb}v@9u`T29x&o_t(dzC<<CyG9Mlu-hABO->-AOdP~5n_sKWGsO)o9Rn=^h
z+eI$-XD=@=Qa*<_1*9RL8=OL5$}l!FlXO|%|HbHHdsut7m>edHn~f+{C8g-gxg>q>
zk2*R!p6>-{X#AZIrq>+m*$B~{z+i{l^R1if$;ruIH8qu%f8M^gp2d1@%Fg!frSM5_
zZx?-`?FSk9<_3FIES(?koP{1vJL^bIt5fu!?`9zStwKVlnd#|r*ofPS4e9*Op?-ew
z(-18j#hQV^!Q1me*2%kmCYj2Kcy6od3h>dqL`lNT!Hexo*{igbhd}yFS3j5?_4T1p
zcwN3;T3TX+?p(PO6llLs!wBonH7G^aa?>nR50^An`N1V9Nc!y28Hj<4i;IO8aI>)T
z)Z_DXk)?C&=<1sM<HwJiSsIuLrl+TSIJo2~y>ifZ+l-NlMcT<xLdhCM9$E@Jw&(5Z
z>sx)ey{M%{_8r}kO_k?Kk#o7UW}y;QM@&gcdDxW_hL?7Kh*S!tO>U&$fRRYR$;p{I
z7)|+#9>yY1=#mRWubDqny}Jh!W_HzPqYl@Ha{}{b>gwvAK5Wpo+Mq4eXc)QS{rw*c
z3k%nM%*@P;tLIu~glyjHOlX(GbexW!9?u%J>O46)d37Lx>8zELgJV7Jo6Daq67;&y
z<@o`j8s(o2jf}+F6DgUZ?0K7ZbH=*6yFXU1xpV|#kT9^YDBLmsZc~<y#_PYm*ooU_
zFnWn`a;b&@GymD#7f~}m^><(-qE#Vk)w?$9H8eKHCHf`H(fw89g(y<pR&S7i%duRl
zYKUZ>lZ#8Q*;aS6lt$$-PL}r_<6lH!_|?_bw?}q9vOYe-Fu5oXeEp!HfSJZ)r{HFF
z+#N=6dpW6y_ZddQ?e&74g^kTtL6ROdE2~}3OZ}SA^K%E7<WU2}!XqNSZuDS4)R}}I
z_Y{*nhe~D+3TkQ+>{=hy+tor7$Uir`ClnUa36d)goXFGR(9+VzCndqOwIZLCJSqsb
zQm)thBU>i=vf~7LF(Pm>HaXdOcz8(m2nK@_Gc(DT-FC<xyj%TBaG5};L7g!DJ?p2>
zs&GC~4-E@T@<JUwJY?4Qy27LIzFEul`0yR^qYjIHi=3(|j+T~|;N5N>E&)MYTpZ4`
zw~>+G&z8GTm<?Jmh9J7RretPrAN*|n+tk_K^r2xUw!=IHSX(gaEpdbcj405WF3d}L
zUsq?HO~|qqbdwZ{<zV?d9_U}$Ug~6*YW`QWBKBWY#6Fq#uQ%E9xtq))Pd!Jwq8wCF
zQaT+IoaSU=vKpVH2td?IgvGn_%{WCNTobSJetH7Xsscl|wh%880&CMLJWMY=ujkAx
zZp}ww4$1p=P`?Uhzl|*zyczw$l6m7+Gv$ofwUoGM1zQeL5D4T~@=Oe+m^u1C!{k3h
z+<!&Qe-8f<J%gRZd4NS@(<X8B@X_YZ#V?LZsYxZ-(paxMg~vwDFe!j~9lboRH8o^0
z#>BsYvp{pbyn^3y&Nd=K6oS@=CRMwLmV+w`^W|NgY)C0oxF|R&!h(6-AFSyN>9`_2
z`ecE&c>kqL#Yo1B$ZOCVc{hliM-n#GJf<+xoc<#j^)<>UMf14W`5JBfut68c^OjuO
z@NOR>6(CDq046C3<>p*7o$@+3QXyAgw>w#fGHztyHg?T!D{WR8Yf%f~kVD1D7Q4R+
zZu+55Harvh1M%ZG(=4Q%8&2<=rS8q`$EUYD-W^&(+FK6uGT_70ZF35Y;|)Twl4UbZ
zq{J~K5>I?Cmq$8D<&u%-G~$wOXoFsXSJUoeXRi5(?A($z9(h`$C*{@>b-AWz+2Ifa
zU7vT^8@ys9783rn4wVn2(?-#63dze}^r9oHwlefKfoU)r_Zf7{52<*HqPQn38J>_F
znD*zC@$#GNGXj1NnmZkJ#QZu!^g5{>TLvXoVg6lh9(J}PDGj3PPDQ;OZ+aeUB1H-}
z<utwUn`s}%#B7}#5;5N!cwA+@cjGA_1z!7gk~Q6L>+^zy94TbC&9ZNm(D(qqa4_li
zt_7=WBd>clV*sh+0>*E$T(^=A4@JjI``%aw0I_#u+{qy2W*B|kebpX~Z`)|+05p=*
zc@&OBFeC3k*3^9#@4$SxQ}#G~`2v=Gz~!a$vPtuz2R=j`F00m#4Il@agBCyhq(FH!
zF)!4WMIvJ-B+lz~$+lzkla^;wMY+{~N5-*|kXp_a>89=qvAG51gP;>Bf9PI>Msd|*
zQ0{HR-YML6jo{U1vNV~pRf?R8F9JK;ijs;_ICkLsv!M29ou2B^=~d<`KOgh8I#kYC
z@6fMOWWV#D4Zcrzl68gJGA~Mt+h7FL<I8<dws#qyo?xHZ4?^afp6Go7vDn(S^(tm&
z^MKWN>^57Cov{el{GrPcz2KwYGj6o_bty!q*zPCgQ2hP2=x1C3@YH&rjx=lIid~@>
z8_Jq!B!zkR`3_PjjB-rF4nwxYsf+oOgIHBcSw@V7w`@JXouW3H`6~A<3uwFp<0~Jp
zytwMD9qWAxLr6VnG4AzDWW5gwjML4JsGM3ulUhSG^nC&dn2t6znKx&3r;e5e6Bh&Y
zdQO5KB3LhaT6CxCj26@;D(sL=&W0t4QtRpu>Gv>3pJN&WlAzOT6~j>>9P*pEe=4BR
zg<#=w_qwb#31nU|GdoBSQ;xTt7@1~h@q&)xM`nj2g^kEZW===L#o3vGkV;Lr+SC0L
z{qRA!Xp2hKW-E#alM8O5<AUak_B~1Rhf+;RdI4glk0~ZPj#>?sE{=Conh!r?=aD`$
z@{Ht}Dz1l|vlsQ8gpo}hyJ6~VuWx+i#ik>?u$oil5yt;WP2h1X7TPha6<?Nmv`|~^
zbq@yfsK+@-Bp3Moh;>a0bWwh}(Mb{q=?b~n_GeR5QN|y2CQ8v1ygm@ZnH(AD2~3^p
z{f63G9$0spS)M5ok)Z;iWhhya+*?9lT=cr^RY5R*@h4$0eEpr;RD8zj?CR%I5I+~(
z?{tda2K5RuiB${c(zB57jr}*wU;>tV4vk+(_q&JtrnAt;(3pOXSR|y~i#MP8Q}DGD
zTd;jsP`<-urG2GT^jlPUl|Itwd4BWV$56zaHUCuos2)Utv|~BBaSib0BXfT5Swcs@
z;$&kBUD%*;ZM5_LJzJ4x$c$2lOqf~H6*HxY!Oli}QdP0!DS6*~gTo>desxdO*bGPP
zed2G}hrklNR{k@};}KOpuf3}b92aNyLNFhP3ThF_?Gk+skBbz3d#m|q?AjrF)UGh>
zQ?|7jQd$3!N<QOoNf(rbk3?t*s$?5sWYk$id4WyL=txvkqcBwKyh%qMZ(?oHs5$<H
zW7$GHP0s<H>tef7v;$SmW`wnC&1s$4*`PM1uWN7*0XgY4BD0#n?6hMvj`8b`ydzTg
zJTm_|ly-YD$%N5F?V0n4=zfKe!ETvG0Xmx(m70!}(>eD|u3wpT_-tJsh|x_;O#+g<
zgRiGw@Imk*nwo~cZAE%)U?IE<;$z2$^M|8$l=<L?Dw*=KWT`rB|5N*LP2Aw>Vps8~
z|1%tshBTIM2Zu~@tJB_r8LyJ~a_r6{ub2Nzx8UZ!mX60=U1=`}iG{U2Gy52HLuWhG
zGW!4&d4=4rDY-$?$bi~NM0Um@#IInQlkw0rahqw5dVV+?vHB7roNY63f>vBWbY{FW
z{TyDiWcePA`<1W!UZW=aq^R2AJU_WY^GfaJL(hku`}D8~x(K{a0_v`FG@KzC6t<}%
za=T=yI`|)C{*+=4L)+F+a!wc1B}z(TQwa`=!SxJPOP1Ce9|CC9kwr%`v`r%!xdz(I
zqYc=k*<x#5+gL@9>#2D4JXwTVUy}=teA_0cGmS+i#{r#uEe3&Yx~1oS&m)`SL(ADy
z*Kvx`uO}QYwD>j(if(~kq|U+P9zEi)Wj34p=OE#yEs(ahw)t&#TuV#Ktq)B&GCZPK
z3G!Eozgf$Nzy*~lI5y6a{ydwr5E&~8?gE+0<6e>cP*6l3Detr*77FI?vuP4~wjBbM
zFQ{xB`yU%NEy`v^{h2WI%(Xtr2h_N<Xpk1#JX7$+=?4#E8!R4mW^uLYv3PozlY-ci
zOkYzS5*4l>j43|X<I<}ht8%qGP#1(yaj8}1eRcgxwz+LwtA!HYcy{CWve($D>WFUv
z0cYS>D@E7lY<o*mtrDS~3JoHt^YRt_fMH?9wVIw411)G7YMEyX{T;v|)p65<v`0bO
zNs!bjr}aoNdmR4Q)4Mwy#w{+?RLLIN9z18=(<B#1eC9mqba|Ppb?Qo%jI-ay(_`>V
zX^iSX=#XUuJrFpyHM&{b6NSX{XI#|VPz~x~^32)uW;n(vt1raT*Y@jmE(>dLEIX#E
z>UP#WR^E$3aMh+xt!w-}u5RAO4S$>D<H@d^mveDx8ay&KWU|JjcTCgL`lY3Z=dr?I
zn0<k+`-l+UtKbxd5mX(zubFam70w~((ml8oHKWW2y&b}OXZL=b0?Bv|b}4jtN4z`w
z9sWBF+Xh8$UO|Mn@G4(tN(?b^sLE9Pv-$?vZhm!X*0&qDl!|%T;vXgL7PY6@OZd4S
z6B3q4skfb#qHP0(GkQDqIvA<<u<_Y#qbu=>Q4$TPBU{I|8@pZt@(#**-16scn`klb
z%w%$LkMszE3@HPZnzleu+3>K42ffn<*>yozyrw!jx2r$jH!0>T&!d@;DH~W^<B9G)
zUV$QEyirKO8TjkvZV2tPLxH)Cs&02IC3SNO)hc;G>raB((ZN2~j;Y4}(4|EGKYHIv
zAy^&?cc5Y&Ka?ENhJRNG`F~0-|8Mo=-<MoqMU}s|{r@c6{7VA*cltj|E-kN~d4RH$
Wg!~J1;O}2k;G=}XhjK9kzyARE*@kfd

literal 0
HcmV?d00001

diff --git a/src/blogger/toc/contract.js b/src/blogger/toc/contract.js
index 20ebe63..654a9b5 100644
--- a/src/blogger/toc/contract.js
+++ b/src/blogger/toc/contract.js
@@ -121,3 +121,15 @@ var contract = {
         xmlns$thr: ''
     }
 };
+
+var POSTSTOC_SETTINGS = {
+    blogURL: '',
+    maxResults: Infinity,
+    style: '',
+    orderby: '',
+    printby: '',
+    thumbnail: {
+        enabled: false,
+        noImageURL: ''
+    }
+};
\ No newline at end of file
diff --git a/src/blogger/toc/main.js b/src/blogger/toc/main.js
index f5ed9e1..ab0f106 100644
--- a/src/blogger/toc/main.js
+++ b/src/blogger/toc/main.js
@@ -24,6 +24,7 @@ goog.require('garafu.events');
 // --------------------------------------------------------------------------------
 /**
 * @class
+*
 * @public
 * @constructor
 */
@@ -73,7 +74,7 @@ garafu.blogger.toc.Main._instance = null;
 
 
 /**
-* Revieved data.
+* Recieved data.
 *
 * @private
 */
diff --git a/src/blogger/toc/printer/entry.js b/src/blogger/toc/printer/entry.js
index afbefc3..e80f93c 100644
--- a/src/blogger/toc/printer/entry.js
+++ b/src/blogger/toc/printer/entry.js
@@ -55,28 +55,61 @@ garafu.blogger.toc.printer.Entry.prototype.getRootElement = function () {
 * @private
 */
 garafu.blogger.toc.printer.Entry.prototype.initialize = function () {
+    var settings = this._settings;
     var entry = this._data;
     var container = document.createElement('span');
     var published = document.createElement('span');
     var updated = document.createElement('span');
+    var thumbnail = document.createElement('span');
     var title = document.createElement('a');
+    var img;
 
+    // Create thumbnail
+    if (settings.thumbnail.enabled) {
+        thumbnail.appendChild(this.createThumbnailElement(entry.media$thumbnail));
+        thumbnail.className = 'poststoc-thumbnail';
+    }
+
+    // Create published date
     published.appendChild(document.createTextNode(entry.published.$t));
     published.className = 'poststoc-published';
-    
+
+    // Create update date
     updated.appendChild(document.createTextNode(entry.updated.$t));
     updated.className = 'poststoc-updated';
-    
+
+    // Create title
     title.appendChild(document.createTextNode(entry.title.$t));
     title.href = entry.link[entry.link.length - 1].href;
     title.className = 'poststoc-title';
-    
+
+    // Compose DOM element structure
+    if (settings.thumbnail.enabled) {
+        container.appendChild(thumbnail);
+    }
     container.appendChild(published);
     container.appendChild(updated);
     container.appendChild(title);
     container.className = 'poststoc-entry';
-    
+
     // Save to cache.
     this.rootElement = container;
 };
 
+
+
+garafu.blogger.toc.printer.Entry.prototype.createThumbnailElement = function (media) {
+    var img = document.createElement('img');
+
+    if (media) {
+        // Create image element.
+        img.src = media.url;
+        img.className = 'poststoc-thumbnail-image';
+    } else {
+        // Create no-image element.
+        img.src = this._settings.thumbnail.noImageURL;
+        img.className = 'poststoc-thumbnail-noimage';
+    }
+
+    return img;
+};
\ No newline at end of file
diff --git a/src/blogger/toc/printer/labelprinter.js b/src/blogger/toc/printer/labelprinter.js
index c141844..f85b4b8 100644
--- a/src/blogger/toc/printer/labelprinter.js
+++ b/src/blogger/toc/printer/labelprinter.js
@@ -40,14 +40,6 @@ garafu.blogger.toc.printer.LabelPrinter.prototype.execute = function (feed) {
     list = [];
     fragment = document.createDocumentFragment();
     
-//// Create category.
-//for (i = 0, length = categoryList.length; i < length; i++) {
-//    categoryItem = categoryList[i];
-//    category = new garafu.blogger.toc.printer.Category(settings, categoryItem);
-//    hash[category.getName()] = category;
-//    list[list.length] = category;
-//}
-    
     // Create categry & entry.
     for (i = 0, length = entryList.length; i < length; i++) {
         entryItem = entryList[i];
diff --git a/src/blogger/toc/printer/titleprinter.js b/src/blogger/toc/printer/titleprinter.js
index 9de2148..eaa7233 100644
--- a/src/blogger/toc/printer/titleprinter.js
+++ b/src/blogger/toc/printer/titleprinter.js
@@ -1,7 +1,7 @@
 goog.provide('garafu.blogger.toc.printer.TitlePrinter');
 
 goog.require('garafu.blogger.toc.printer.AbstractPrinter');
-
+goog.require('garafu.blogger.toc.printer.Entry')
 
 
 
@@ -9,9 +9,10 @@ goog.require('garafu.blogger.toc.printer.AbstractPrinter');
 //  constructor
 // --------------------------------------------------------------------------------
 /**
+* @class
+*
 * @public
 * @constructor
-* @class
 */
 garafu.blogger.toc.printer.TitlePrinter = function (settings) {
     goog.base(this, settings);
@@ -33,7 +34,6 @@ garafu.blogger.toc.printer.TitlePrinter.prototype.execute = function (feed) {
     
     list = this.createList(entry);
     
-    //document.getElementById('poststoc').appendChild(list);
     return list;
 };
 
@@ -66,27 +66,68 @@ garafu.blogger.toc.printer.TitlePrinter.prototype.createList = function (entry)
 * @private
 */
 garafu.blogger.toc.printer.TitlePrinter.prototype.createEntry = function (entry) {
-    var container = document.createElement('span');
-    var published = document.createElement('span');
-    var updated = document.createElement('span');
-    var title = document.createElement('a');
 
-    published.appendChild(document.createTextNode(entry.published.$t));
-    published.className = 'poststoc-published';
+    var entry = new garafu.blogger.toc.printer.Entry(this._settings, entry);
+    return entry.getRootElement();
+
+    ////var settings = this._settings;
+    ////var container = document.createElement('span');
+    ////var published = document.createElement('span');
+    ////var updated = document.createElement('span');
+    ////var thumbnail = document.createElement('span');
+    ////var title = document.createElement('a');
+    ////var img;
+
+    ////// Create thumbnail
+    ////if (settings.thumbnail.enabled) {
+    ////    thumbnail.appendChild(this.createThumbnail(entry.media$thumbnail));
+    ////    thumbnail.className = 'poststoc-thumbnail';
+    ////}
+
+    ////// Create published date
+    ////published.appendChild(document.createTextNode(entry.published.$t));
+    ////published.className = 'poststoc-published';
     
-    updated.appendChild(document.createTextNode(entry.updated.$t));
-    updated.className = 'poststoc-updated';
+    ////// Create update date
+    ////updated.appendChild(document.createTextNode(entry.updated.$t));
+    ////updated.className = 'poststoc-updated';
     
-    title.appendChild(document.createTextNode(entry.title.$t));
-    title.href = entry.link[entry.link.length - 1].href;
-    title.className = 'poststoc-title';
+    ////// Create title
+    ////title.appendChild(document.createTextNode(entry.title.$t));
+    ////title.href = entry.link[entry.link.length - 1].href;
+    ////title.className = 'poststoc-title';
     
-    container.appendChild(published);
-    container.appendChild(updated);
-    container.appendChild(title);
-    container.className = 'poststoc-entry';
+    ////// Compose DOM element structure
+    ////if (settings.thumbnail.enabled) {
+    ////    container.appendChild(thumbnail);
+    ////}
+    ////container.appendChild(published);
+    ////container.appendChild(updated);
+    ////container.appendChild(title);
+    ////container.className = 'poststoc-entry';
     
-    return container;
+    ////return container;
 };
 
 
+
+
+/**
+* @private
+*/
+garafu.blogger.toc.printer.TitlePrinter.prototype.createThumbnail = function (media) {
+    var img = document.createElement('img');
+
+    if (media) {
+        // Create image element.
+        img.src = media.url;
+        img.className = 'poststoc-thumbnail-image';
+    } else {
+        // Create no-image element.
+        img.src = this._settings.thumbnail.noImageURL;
+        img.className = 'poststoc-thumbnail-noimage';
+    }
+
+    return img;
+};
+
diff --git a/src/blogger/toc/settings.js b/src/blogger/toc/settings.js
index 20d9de6..576ba74 100644
--- a/src/blogger/toc/settings.js
+++ b/src/blogger/toc/settings.js
@@ -7,22 +7,26 @@ goog.provide('garafu.blogger.toc.Settings');
 //  garafu.blogger.toc.Settings class
 // --------------------------------------------------------------------------------
 /**
+* @class
 * @putlic
 * @constructor
-* @class
 */
 garafu.blogger.toc.Settings = function () {
-    var user = window['POSTSTOC_SETTINGS'] || {};
-    
-    // Default settings.
-    this.blogURL = this.getValueOrDefault(user['blogURL'], 'garafu.blogspot.jp');
-    this.maxResults = this.getValueOrDefault(user['maxResults'], Infinity);
-    this.style = this.getValueOrDefault(user['style'], '');
-    this.orderby = this.getValueOrDefault(user['orderby'], 'published');
-    this.printby = this.getValueOrDefault(user['printby'], 'label');
-    this.labelListEnabled = this.getValueOrDefault(user['labelListEnabled'], true);
-    this.updatedDateEnabled = this.getValueOrDefault(user['updatedDateEnabled'], false);
-    this.publishedDateEnabled = this.getValueOrDefault(user['publishedDateEnabled'], true);
+
+    // Set default settings.
+    var defaultSettings = {
+        blogURL: 'garafu.blogspot.jp',
+        maxResults: Infinity,
+        orderby: 'published',
+        printby: 'label',
+        thumbnail: {
+            enabled: false,
+            noImageURL: 'http://garafu.github.io/blogger.toc/release/0.0.4/noimage.png'
+        }
+    };
+
+    // Apply user settings or default settings.
+    this.merge(this, POSTSTOC_SETTINGS, defaultSettings);
 };
 
 
@@ -45,17 +49,17 @@ garafu.blogger.toc.Settings.prototype.getValueOrDefault = function (userSetting,
 /**
 * @private
 */
-garafu.blogger.toc.Settings.prototype.merge = function () {
-    var userSettings, i, key, value;
-    
-    // Get user settings from global object.
-    userSettings = window['POSTSTOC_SETTINGS'] || {};
-    
-    // Merge settings.
-    for (key in this) {
-        if (typeof this[key] !== 'function' &&
-            undefined !== userSettings[key]) {
-            this[key] = userSettings[key];
+garafu.blogger.toc.Settings.prototype.merge = function (settings, userSettings, defaultSettings) {
+    var key;
+
+    userSettings = userSettings || {};
+
+    for (key in defaultSettings) {
+        if (typeof (defaultSettings[key]) === 'object') {
+            settings[key] = settings[key] || {};
+            this.merge(settings[key], userSettings[key], defaultSettings[key]);
+        } else {
+            settings[key] = this.getValueOrDefault(userSettings[key], defaultSettings[key]);
         }
     }
 };
diff --git a/stylesheets/simple.css b/stylesheets/simple.css
index 1c9ddd2..a7280ae 100644
--- a/stylesheets/simple.css
+++ b/stylesheets/simple.css
@@ -1,7 +1,7 @@
 #main .poststoc
 {
     font-size: 12px;
-    font-family: Trebuchet MS', Trebuchet, Verdana, sans-serif;
+    font-family: 'Trebuchet MS', Trebuchet, Verdana, sans-serif;
 }
 #main .poststoc-category
 {
@@ -17,9 +17,30 @@
 #main .poststoc-list
 {
 }
+#main .poststoc-item
+{
+}
 #main .poststoc-entry
 {
 }
+#main .poststoc-thumbnail
+{
+    display: inline-block;
+    margin: 2px 4px;
+}
+#main .poststoc-thumbnail-image
+{
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
+#main .poststoc-thumbnail-noimage
+{
+    display: inline-block;
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
 #main .poststoc-published
 {
     display: none;
diff --git a/stylesheets/tile_emerald.css b/stylesheets/tile_emerald.css
index d023cc3..06cd4e0 100644
--- a/stylesheets/tile_emerald.css
+++ b/stylesheets/tile_emerald.css
@@ -42,6 +42,24 @@
 {
     padding-left: 10px;
 }
+#main .poststoc-thumbnail
+{
+    display: inline-block;
+    margin: 2px 4px;
+}
+#main .poststoc-thumbnail-image
+{
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
+#main .poststoc-thumbnail-noimage
+{
+    display: inline-block;
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
 #main .poststoc-published
 {
     display: none;
diff --git a/stylesheets/tile_steel.css b/stylesheets/tile_steel.css
index c729d73..270ff85 100644
--- a/stylesheets/tile_steel.css
+++ b/stylesheets/tile_steel.css
@@ -42,6 +42,24 @@
 {
     padding-left: 10px;
 }
+#main .poststoc-thumbnail
+{
+    display: inline-block;
+    margin: 2px 4px;
+}
+#main .poststoc-thumbnail-image
+{
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
+#main .poststoc-thumbnail-noimage
+{
+    display: inline-block;
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
 #main .poststoc-published
 {
     display: none;
diff --git a/stylesheets/white.css b/stylesheets/white.css
index 0cb3fc5..2587acf 100644
--- a/stylesheets/white.css
+++ b/stylesheets/white.css
@@ -4,6 +4,30 @@
 #main .poststoc-list
 {
 }
+#main .poststoc-item
+{
+}
+#main .poststoc-entry
+{
+}
+#main .poststoc-thumbnail
+{
+    display: inline-block;
+    margin: 2px 4px;
+}
+#main .poststoc-thumbnail-image
+{
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
+#main .poststoc-thumbnail-noimage
+{
+    display: inline-block;
+    width: 32px;
+    height: 32px;
+    vertical-align: middle;
+}
 #main .poststoc-published
 {
     font-size: x-small;
@@ -16,6 +40,4 @@
 #main .poststoc-title
 {
 }
-#main .poststoc-entry
-{
-}
+