var templates = {
    accessoryHide:
		new Template(
		'<div class="item">'
        + '</div>'
        ),

    accessoryImg:
		new Template(
		'<div onclick="items[\'#{y}\'][\'#{x}\'].move(this, \'#{y}\',\'#{x}\')" class="item">'
        +'<img src="/files/pen/product/#{imgcode}.png" style="display:inline;vertical-align:middle" '
        + ' onmouseover="items[\'#{y}\'][\'#{x}\'].showpanel(\'#{y}\',\'#{x}\')"'
        + ' onmouseout="items[\'#{y}\'][\'#{x}\'].hidepanel(\'#{y}\',\'#{x}\', 250)"'
        + '/>'
        + '</div>'
        ),
    accessoryImgIE6:
		new Template(
		'<div onclick="items[\'#{y}\'][\'#{x}\'].move(this, \'#{y}\',\'#{x}\')" class="item" >'
        +'<div style="height:100%;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'/files/pen/product/#{imgcode}.png\',sizingMethod=\'image\');" '
        + ' onmouseover="items[\'#{y}\'][\'#{x}\'].showpanel(\'#{y}\',\'#{x}\')"'
        + ' onmouseout="items[\'#{y}\'][\'#{x}\'].hidepanel(\'#{y}\',\'#{x}\', 250)"'
        +'></div>'
        +'</div>'
        ),
        
    accessoryLink:
        new Template(
            '<ul class=link>'
            +'<li>'
            + '<a onclick="items[\'#{y}\'][\'#{x}\'].showdetail(\'#{y}\',\'#{x}\')">詳細說明</a>'
            +'</li>'
            +'</ul>'
        ),
        
    bodyImg:
        new Template (
        '<img src="/files/pen/product/#{imgcode}#{items}.png" style="display:inline;vertical-align:middle" '
        + ' onclick="items[\'#{y}\'][\'#{x}\'].reset(\'#{y}\',\'#{x}\')"'
        + ' onmouseover="items[\'#{y}\'][\'#{x}\'].showpanel(\'#{y}\',\'#{x}\')"'
        + ' onmouseout="items[\'#{y}\'][\'#{x}\'].hidepanel(\'#{y}\',\'#{x}\', 250)"'
        + '/>'
        ),
    bodyColorImg:
        new Template (
        '<img src="/files/pen/product/#{imgcode}_#{color}_#{items}.png" style="display:inline;vertical-align:middle" '
        + ' onclick="items[\'#{y}\'][\'#{x}\'].reset(\'#{y}\',\'#{x}\')"'
        + ' onmouseover="items[\'#{y}\'][\'#{x}\'].showpanel(\'#{y}\',\'#{x}\')"'
        + ' onmouseout="items[\'#{y}\'][\'#{x}\'].hidepanel(\'#{y}\',\'#{x}\', 250)"'
        + '/>'
        ),
    bodyLink:
        new Template(
            '<ul class=link>'
            +'<li>'
            + '<a onclick="items[\'#{y}\'][\'#{x}\'].showdetail(\'#{y}\',\'#{x}\')">詳細說明</a>'
            +'</li>'
            +'</ul>'
        ),
    bodyColorLI:
        new Template(
             '<li>'
            + '<a href="#" onclick="items[\'#{y}\'][\'#{x}\'].changecolor(#{idx})"'
            + ' style="background-image:url(#{icon})"'
            +'>'
            + '#{desc}'
            + '</a></li>'
       ),        
    bodyColorLITextOnly:
        new Template(
             '<li>'
            +'<a href="#" onclick="items[\'#{y}\'][\'#{x}\'].changecolor(#{idx})">'
            +'#{desc} '
            +'</a></li>'
       ),
    bodyColorUL:
        new Template(
            '<ul class=link>#{li}</ul>'
       ),

    artworkPhotoIdx:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
             + '</div><div class=image>'
           + '<img src="/autoresize.aspx?size=#{size}&iP=#{url}" onclick="window.open(\'./gallery/photo.html?pi=#{idx}\', \'_self\')" style="cursor:pointer;"/>'
            + '</div></div>'
        ),

    artworkVideoIdx:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
             + '</div><div class=image>'
           + '<img src="/autoresize.aspx?size=#{size}&iP=#{url}" onclick="window.open(\'./gallery/video.html?vi=#{idx}\', \'_self\')" style="cursor:pointer;"/>'
            + '</div></div>'
        ),      

    artworkWallpaperIdx:
        new Template(
            '<div class=artwork><div class=image>'
           + '<img src="/autoresize.aspx?size=#{size}&iP=#{url}" />'
            + '</div>'
            +'<div class=wallpaper>'
            + '#{title}'
             + '</div></div>'
        ),   
        
    artworkPDFIdx:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
             + '</div><div class=image>'
           + '<img src="/autoresize.aspx?size=#{size}&iP=#{url}" onclick="window.open(\'#{full_url}\', \'_blank\')" style="cursor:pointer;"/>'
            + '</div></div>'
        ),
        
    artworkDownloadVideoIdx:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
             + '</div><div class=image>'
           + '<img src="/autoresize.aspx?size=#{size}&iP=#{url}" onclick="window.open(\'./download/video.html?vi=#{idx}\', \'_self\')" style="cursor:pointer;"/>'
            + '</div></div>'
        ),  
              
    artworkPhoto:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
             + '</div><div class=image>'
            + '<a href="#{url}" target="_blank"><img id="photo_#{id}" src="/autoresize2.aspx?iP=#{url}&size_w=550&size_h=430" /></a>'
            + '</div></div>'
            + '<div id="gallery_exif_div" class=exif>'
            + '</div>'
        ),      
    artworkPhotoExif:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
            + '</div><div class=image>'
            + '<a href="#{url}" target="_blank"><img id="photo_#{id}" src="/autoresize2.aspx?iP=#{url}&size_w=550&size_h=430" /></a>'
            + '</div></div>'
            + '<div id="gallery_exif_div" class=exif>'
            + '</div>'
           
        ) ,
    artworkVideo:
        new Template(
            '<div class=artwork><div class=title>'
            + '#{title}'
            + '</div><div id="mediaplayer">'
            //+ '<a href="http://www.adobe.com/go/getflashplayer">'
			//+ '<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />'
			//+ '</a>'
			+ '</div></div>'
			+ '<script>'
			+ 'changeVideo("#{url}", 480, 270, \'#{thumbnail}\');' 
			+ '</script>'
        )
         
};