[HTML Templates] - Help/Examples/Tricks

Subject: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 5:44 am

Hi Everyone,

Some of you may not know this but the addition of HTML Templates is HUGE!

Plenty of commercial software have the ability to generate nice reports and HTML templates
but none of them offer the ease of scraping data like Media Companion and EMM do.

All those commercial softwares have you enter the movies manually one by one and the
ones that let you import from hard drives have you click ok for every single entry!!!

Anyway... i digress...

I would like to make this thread a sticky for people to come to and find nice templates
and help on creating their own.

So i will contribute one to get the ball rolling....

Screenshot :

[HTML Templates] - Help/Examples/Tricks Screen10

Instructions :

1. Save the following code as a text file into the html_templates directory of Media Companion

Code:: <title>Movie Card</title>
<<MC HTML Page>>
<<header>>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<link href="moviecard.css" rel="stylesheet" type="text/css">
<</header>>
<<body>>
<table align="center" border="0" width="800" bgcolor="#e0e0e0" cellspacing="10" cellpadding="5">
<tr>
   <td bgcolor="#ffffff">
   <table border="0" width="100%" cellspacing="0" cellpadding="0">
   <tr><td colspan="2" bgcolor="#000000" width="100%" height="1"></td></tr>
   <tr><td colspan="2" width="100%" height="5"></td></tr>
   <tr>



   <td width="160" align="center" valign="top">
               <table border="0" width="150" cellspacing="0" cellpadding="0">
               <tr>
               <td width="150"><img src="img/<<imdb_url>>.jpg" width="150"></td>
               </tr>
      </table>
   </td>





   <td width="610" align="left" valign="top">
      <table border="0" width="100%" cellspacing="8" cellpadding="0">
      <tr><td colspan="2" width="100%" bgcolor="#000000"><font color="#ffffff" class="headingfont"><b>  <<title>></b></font></td></tr>
      <tr><td colspan="2" width="100%" bgcolor="#000000" height="1"></td></tr>
   <tr class="smallfont">
         <td width="45%" align="left" valign="top">

         <table border="0" width="100%" cellspacing="0" cellpadding="0">
                     <tr><td width="30%">Year:</td><td><b><<movieyear>></b></td></tr>
                     <tr><td width="30%">Genre:</td><td><b><<moviegenre>></b></td></tr>
                     <tr><td width="30%">Rating:</td><td><b><<rating>></b></td></tr>
         </table>
         </td>

         <td width="55%" align="left" valign="top">
               <table border="0" width="100%" cellspacing="0" cellpadding="0">
                     <tr><td width="30%">Director:</td><td><b><<director>></b></td></tr>
                     <tr><td width="30%">Writer:</td><td><b><<writer>></b></td></tr>
                     <tr><td width="30%">Duration:</td><td><b><<runtime>></b></td></tr>
         </table>
         </td>
      </tr>
      <tr><td colspan="2" width="100%" bgcolor="#000000" height="1"></td></tr>

      <tr class="bigfont">
      <td colspan="2" width="100%">
      <b>Description:</b><br>
      <<outline>>
      </td>
      </tr>
      </table>
   </td>


   </tr>
   <tr><td colspan="2" width="100%" height="5"></td></tr>
   <tr><td colspan="2" bgcolor="#000000" width="100%" height="1"></td></tr>
   </table>
</td>
</tr>
<</body>>
<<footer>><</footer>>
<</MC HTML Page>>

2. Save the following code as moviecard.css to a folder (eg. C:\MyMovieList)

Code:: @charset "utf-8";
.smallfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
.bigfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.headingfont {
font-size: 26px;
}

3. As you can see, i have images in here. The trick is to go to the wall view so MC generates
the thumbnails and then you can go to the settings\postercache folder and copy all .jpg
from there. Put them in another folder under img (eg. C:\MyMovieList\img)

4. Next, generate the list and save the HTML in the root folder where your image folder is
(eg. C:\MyMovieList)

5. Open the HTML in a text editor. You are now going to do 2 find and replace.

Find all instances of :

Code:: http://www.imdb.com/title/

Replace with nothing (basically delete the text)

Then, find all instances of :

Code:: /.jpg

Replace with :

Code:: .jpg

Now hopefully this step will be obsolete once Billy adds functionality for images in the templates!

P.S. Some of you may recognize the template from the All My Movies software. Yes i pretty much
copied it from there. All credit goes to the original author.

-Pr.

P.P.S I forgot to mention that i also added tags for moviegenre, director, and writer. They are not
implemented yet but i fully expect they will be real soon.

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 7:38 am

Thats fricking awesome sinister.

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 9:47 am

This really IS thinking outside the square.....

It's really what I hope for. People with the capability & interest to play with the provided tokens to create html magic!

Cheers & Thanks for posting!

Senior Member Posts : 223 Join date : 2008-12-08

paybac wrote:: Thats fricking awesome sinister.

It occurs to me now that we may want to have multiple sets of templates available (probably one set per subdir in template root dir) and select which one we wish to use...

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 10:06 am

StormyKnight wrote:: This really IS thinking outside the square.....

It's really what I hope for. People with the capability & interest to play with the provided tokens to create html magic!

Cheers & Thanks for posting!

Hmmmm now if someone could just write the HTML template that sends the document to Stormy's color printing business for printing then posts it back to us Laughing

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 10:15 am

.....just to add for anyone using this script.....

I have about 330 movies & the search/replace is taking ages in notepad Rolling Eyes

So if you think notepad has locked up, just be patient....my speed about 1 search replace per second....

I may need a replacent for notepad unless Billy can add the extra tokens .... Razz

Cheers

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 10:28 am

paybac wrote:: Hmmmm now if someone could just write the HTML template that sends the document to Stormy's color printing business for printing then posts it back to us

I've been watching Moon, if I can rig it, I'll get a clone onto that straight away Smile

Senior Member Posts : 223 Join date : 2008-12-08

StormyKnight wrote:: I may need a replacent for notepad

If you do want to look, I found many editors promise that they handle large files (they don't, they read the whole file into virtual memory, not "page" the file) the only one I found was "WinVI" (http://makemsi-manual.dennisbareis.com/winvi.htm). I only use it for huge files and use JEDIT for anything else except for very quick trivial changes in notepad.

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 12:40 pm

Anyone able to shed some light on how to get this html output to print nicely without splitting the tables?

I have tried adding the following to the css sheet

.break {
page-break-inside: avoid;
}

& then adding to the table class="break", plus I tried <div> & <p> too!

unfortunately this doesn't work on IE, Firefox, Chrome OR Opera

The only way I can see it working is if we have a tag that defines when MC adds a tag when the <<count>>div 4 = 0 for example...i.e every 4 movies add this text to the html - that text being a forced page break which does seem to work 100% in IE8, not so well in firefox...(some of the table border is printed on the wrong page)

So in essence, you will get 4 movies per page in this example....

I'm open to suggestions.....html was never really designed to print nicely afterall... Shocked

New User Posts : 4 Join date : 2008-12-08

StormyKnight wrote:: .....just to add for anyone using this script.....

I have about 330 movies & the search/replace is taking ages in notepad So if you think notepad has locked up, just be patient....my speed about 1 search replace per second....

I may need a replacent for notepad unless Billy can add the extra tokens ....

Cheers

Try Notepad++

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 5:34 pm

StormyKnight wrote:: .....just to add for anyone using this script.....

I have about 330 movies & the search/replace is taking ages in notepad So if you think notepad has locked up, just be patient....my speed about 1 search replace per second....

I may need a replacent for notepad unless Billy can add the extra tokens ....

Cheers

Yeah i don't personally use notepad. I just said that for people without text editors.

I love UltraEdit. I have 1736 Movies and UltraEdit did the whole search and replace in about
1 minute.

You may want to try NotePad++ it is free and very powerful.

But of course, the new tokens is what we really need! I hope Billy is reading this thread Smile

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 5:44 pm

StormyKnight wrote:: Anyone able to shed some light on how to get this html output to print nicely without splitting the tables?

I have tried adding the following to the css sheet

.break {
page-break-inside: avoid;
}

& then adding to the table class="break", plus I tried <div> & <p> too!

unfortunately this doesn't work on IE, Firefox, Chrome OR Opera

The only way I can see it working is if we have a tag that defines when MC adds a tag when the <<count>>div 4 = 0 for example...i.e every 4 movies add this text to the html - that text being a forced page break which does seem to work 100% in IE8, not so well in firefox...(some of the table border is printed on the wrong page)

So in essence, you will get 4 movies per page in this example....

I'm open to suggestions.....html was never really designed to print nicely afterall...

That's weird cause when i print in FireFox v3.5.5, I get 4 Movies per page no problem.
No splitting or anything... Did you add/change anything in the template (such as using fullplot
instead of outline)?

I think that once the footer functionality is added, we probably will have the option of having
a footer on every page instead of at the end and that may help us close the tags better.

Of course having the ability to limit the amount of movies per page and/or the amount of
lines from the fullplot to display would be a great addition.

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 6:49 pm

StormyKnight wrote:: .....just to add for anyone using this script.....

I have about 330 movies & the search/replace is taking ages in notepad So if you think notepad has locked up, just be patient....my speed about 1 search replace per second....

I may need a replacent for notepad unless Billy can add the extra tokens ....

Cheers

Strange Stormy - I have 1200 movies and the replace was about 2 seconds for the whole thing. Time to do some adware scans maybe? Razz

Subject: Re: [HTML Templates] - Help/Examples/Tricks Tue Nov 24, 2009 6:58 pm

Pr.Sinister - excellent work. This is what I was looking for (with my crude attempt at tables). With the attidion of the new tags (hint hint Billy) you could get some very detailed visual layouts. Kudos!

Subject: Re: [HTML Templates] - Help/Examples/Tricks Wed Nov 25, 2009 2:04 am

Wow. This is very cool.

I've been using Ant Movie Catalog for years to create a simple HTML output of my movie collection. The reasons I've stuck with it are:

It's free
The app also uses media info.dll so it gets the data by simply dragging the file/s onto the app window
There are scripts to scrape movie info from a massive number of sites. Most importantly for me, the IMDB is kept up to date by community so it ALWAYS works
The HTML output templates were extremely simple to tweak with limited HTML skill to get the desired fields into the web page.

Looks like I might finally have found a replacement in MC!

So fields I'd like to see implemented are: Director, Genre, Poster file name, Media Info (e.g. Video Format, Video Resolution, Audio Format, No of files, Size of file/s) plus some generic fields like <<todaydate>> (to date stamp the web page).

it would also be nice if the output remembered the folder location (currently does) and file name it is outputting to to avoi dhaving to re-enter it each time.

I've made some minor tweaks to Pr.Sinister's template (made all poster images and movie titles clicky link to relevant IMDB entry, Added page header with link back to MC, added total movie count) which can be seen on-line here - http://anthonyb.dyndns.org/movielist/index.htm

The template and .CSS file are zipped and here if anyone wants to download - http://anthonyb.dyndns.org/rich_template.zip

Subject: Re: [HTML Templates] - Help/Examples/Tricks Thu Nov 26, 2009 2:14 am

StormyKnight wrote:: Anyone able to shed some light on how to get this html output to print nicely without splitting the tables?

I have tried adding the following to the css sheet

.break {
page-break-inside: avoid;
}

& then adding to the table class="break", plus I tried <div> & <p> too!

unfortunately this doesn't work on IE, Firefox, Chrome OR Opera

The only way I can see it working is if we have a tag that defines when MC adds a tag when the <<count>>div 4 = 0 for example...i.e every 4 movies add this text to the html - that text being a forced page break which does seem to work 100% in IE8, not so well in firefox...(some of the table border is printed on the wrong page)

So in essence, you will get 4 movies per page in this example....

I'm open to suggestions.....html was never really designed to print nicely afterall...

I have been trying to get this to print 4 per page myself. Thought it was lined up, but somewhere around pages 7-10 things start getting out of alignment. I have edited the margins in IE Page Setups, but I can't get it to resolve either.

I would love to see a template that can fit more per page. Printing 400+ pages isn't somehting I'm looking forward to. Love the design though for viewing. 10 per pages would be nice to get the 'booklet' down in size Smile

Subject: Re: [HTML Templates] - Help/Examples/Tricks Thu Nov 26, 2009 5:36 am

Ok if you read my previous post in this spot, well this is the update....& this works much better too!

I rewrote the template because I worked out that when printing, a browser will generally not break an image into two bits, so in this case we use that fact to create our new tables. The image on the left stops the other lines on the right from separating. However, if the outline is very long & it is the last item on the page, it will still separate!

Ok you still have to search & replace the same text as in the original post and you still need to create you img folder & copy the moviecard.css too if you haven't already done so.

Code:: <title>Movie Card Easy Print</title>
<<MC HTML Page>>
<<header>>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<link href="moviecard.css" rel="stylesheet" type="text/css">
</head>
<body>
<</header>>
<<body>>
<table align="center" border="0" width="800" bgcolor="#e0e0e0" cellspacing="0" cellpadding="0">
<tr ><td rowspan="7" valign="top"><img src="img/<<imdb_url>>.jpg" width="150" height="200" hspace="10"
border="1"></td><td align="left" colspan ="4" width="600" height="1" bgcolor="#000000"><font color="#ffffff"
class="headingfont" ><b>  <<title>></b></font></td></tr>
<tr height="1" ><td colspan="4" width ="100%" ><hr></td></tr>
<tr class="bigfont" height="1"><td width="15%">    Year:</td><td
width="35%"><b><<movieyear>></b></td><td width="15%">Director:</td><td><b><<director>></b></td></tr>
<tr class="bigfont"
height="1"><td>    Genre:</td><td><b><<moviegenre>></b></td><td>Writer:</td><td><b><<writer>></b></td></tr>
<tr class="bigfont"
height="1"><td>    Rating:</td><td><b><<rating>></b></td><td>Duration:</td><td><b><<runtime>></b></td></tr>
<tr><td colspan="4" width ="100%"><hr></td></tr>
<tr class="bigfont" valign="top"><td colspan="4" width ="100%"><b>Description:</b><br><font
class="smallfont"><<outline>></td></tr>
</table>
<center><hr width="800"></center>
<</body>>
<<footer>><</footer>>
<</MC HTML Page>>

Oh I nearly forgot the best part...now you can fit 5 movies per page! cheers

(10mm top & bottom margin on A4 paper)

Subject: Re: [HTML Templates] - Help/Examples/Tricks Thu Nov 26, 2009 6:28 pm

[quote= Oh I nearly forgot the best part...now you can fit 5 movies per page! cheers

(10mm top & bottom margin on A4 paper)[/quote]

Well we're half way there...get me to 2 columns now and I'm saving a few trees in the Amazon Smile

Admin Posts : 1326 Join date : 2008-09-20

This is great, if I knew that there would be this much interest in the html templates then I would have been much faster in implementing it.

Take it for granted that the next build will support the following extra tags:-
<<director>>
<<writer>>
<<genre>>
I may limit the genre to 2 or 3 catagories, not sure how extral long genre fields would mess with html, let me know.

I am also looking to implement support for the tag
<<smallimage>>
The idea that for this tag, the appropriate thumbnail from the postercache will be copied to an "images" folder located in the same location as the html.
the tag will be replaced with:
<img border="0" src="images/tt1175491.jpg" width="150" height="200">

Admin Posts : 1326 Join date : 2008-09-20

OK - I've got it working now, with a small change to the above

Using the following template offered by Pr.Sinister

Code:: <title>Movie Card Easy Print</title>
<<MC HTML Page>>
<<header>>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<link href="moviecard.css" rel="stylesheet" type="text/css">
</head>
<body>
<</header>>
<<body>>
<table align="center" border="0" width="800" bgcolor="#e0e0e0" cellspacing="0" cellpadding="0">
<tr ><td rowspan="7" valign="top"><img src="<<smallimage>>" width="150" height="200" hspace="10"
border="1"></td><td align="left" colspan ="4" width="600" height="1" bgcolor="#000000"><font color="#ffffff"
class="headingfont" ><b>  <<title>></b></font></td></tr>
<tr height="1" ><td colspan="4" width ="100%" ><hr></td></tr>
<tr class="bigfont" height="1"><td width="15%">    Year:</td><td
width="35%"><b><<movieyear>></b></td><td width="15%">Director:</td><td><b><<director>></b></td></tr>
<tr class="bigfont"
height="1"><td>    Genre:</td><td><b><<moviegenre>></b></td><td>Writer:</td><td><b><<writer>></b></td></tr>
<tr class="bigfont"
height="1"><td>    Rating:</td><td><b><<rating>></b></td><td>Duration:</td><td><b><<runtime>></b></td></tr>
<tr><td colspan="4" width ="100%"><hr></td></tr>
<tr class="bigfont" valign="top"><td colspan="4" width ="100%"><b>Description:</b><br><font
class="smallfont"><<outline>></td></tr>
</table>
<center><hr width="800"></center>
<</body>>
<<footer>><</footer>>
<</MC HTML Page>>

<<smallimage>> will simply be replaced with "images/tt1175491.jpg", the folder must always be images, MC will do all the work.

The HTML page is now generated fully by MC, including the images, writer, director, and genre.

The only think I need to work on the the css file, I need to add a way to add this to the template so it can be saved into the html folder.

Subject: Re: [HTML Templates] - Help/Examples/Tricks Thu Nov 26, 2009 10:41 pm

I've got an idea for all you HTML guru's out there.

How about an Template for creating a simple DVD cover or VCD cover or perhaps 1 for each.

i.e. Movie Poster and Movie Title on the front (I was thinking title as some movies have very poor titles on them)
Then all the other info on the back
Perhaps if possible a title on the spine?

What you think?

Paybac

Subject: Re: [HTML Templates] - Help/Examples/Tricks Fri Nov 27, 2009 12:35 am

Wizerd wrote:

StormyKnight wrote:: Oh I nearly forgot the best part...now you can fit 5 movies per page! (10mm top & bottom margin on A4 paper)

Well we're half way there...get me to 2 columns now and I'm saving a few trees in the Amazon Smile

Unfortunately with the current system it flows top to bottom, i.e. the next movie must be below the last....

However, often your printer driver will allow you to fit two portrait pages on one landscape page or even 4 pages on 1. I tried this last night on my PDF driver & it worked a treat!

billyad2000 wrote:: The only think I need to work on the the css file, I need to add a way to add this to the template so it can be saved into the html folder.

Yes indeed....perhaps before the <<Header>> another section for those txt files?

Code:: <<TextFile=movie.css>>
@charset "utf-8";
.smallfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
.bigfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.headingfont {
font-size: 26px;
}
<</TextFile>>

That way multiple txt files can be added & named easily...

Oh um Billy , the code you refer to is the one I posted...... Smile

When I said I edited my post I meant just that entry since I had provided some information to assist with pagenation, but later I decided to create my own template to assist with solving the issue.

paybac wrote:: I've got an idea for all you HTML guru's out there.

How about an Template for creating a simple DVD cover or VCD cover or perhaps 1 for each.

i.e. Movie Poster and Movie Title on the front (I was thinking title as some movies have very poor titles on them)
Then all the other info on the back
Perhaps if possible a title on the spine?

What you think?

Paybac

Yes this should be possible, we just need a token to give access to the full size pictures.......

Admin Posts : 1326 Join date : 2008-09-20

StormyKnight wrote:

Oh um Billy , the code you refer to is the one I posted...... Smile

When I said I edited my post I meant just that entry since I had provided some information to assist with pagenation, but later I decided to create my own template to assist with solving the issue.

paybac wrote:: I've got an idea for all you HTML guru's out there.

How about an Template for creating a simple DVD cover or VCD cover or perhaps 1 for each.

i.e. Movie Poster and Movie Title on the front (I was thinking title as some movies have very poor titles on them)
Then all the other info on the back
Perhaps if possible a title on the spine?

What you think?

Paybac

Yes this should be possible, we just need a token to give access to the full size pictures.......

My apologies, just was playing with both Sinisters and yours, got a bit mixed up on which I finally used Embarassed

I will add support for fullsize images and the ability to resize them for the build after the next one.

» Program Not Responding, Scrapes Taking Long
» Tricks for Deciding on Along with Donning A low priced Bash Costume.
» Tricks of Buying And additionally Making use of A better value Blowout Clothes.
» Tricks for Deciding on Along with Donning A low priced Bash Costume.
» Tricks of Buying And additionally Making use of A better value Blowout Clothes.