1. My pages do not scroll smoothly. Why is this? Manually added extra components? Images? Is it constantly re-drawing the page? Poorly structured code? I'm afriad I can't see why it's doing this.
2. Annoying but not so important - changing the width of the page (i.e. all the boxes as a whole) does not properly affect the recent page, but does the friends page, i.e. I set overall width of the main table to, say, 900px and the friends page does this, but the recent entries page will not go below a certain width (I think ~ 1165px, on my screens). Or rather, I think it may not be going below a certain percentage, but I am using pixels for the main table, not percentages. As it is, I've just made them both big enough that the effect is not seen (~1165px).
layerinfo "type" = "theme";
layerinfo "name" = "J Component Var 2";
function page_layout(Page p) {
var string title = $p->title();
"""
<html>
<head>
<link rel="stylesheet" href="$p.stylesheet_url" type="text/css"/>
$p.head_content
"""; $p->print_custom_head(); """
<title>$title</title>
</head>
<body>
<table width="1140px" cellspacing="0" cellpadding="0" border="0" valign="top" align="center">
<tr><td align="center">
<img align="center" src="http://www.btinternet.com/~euphbass/ljtop.jpg">
</td></tr>
</table><br>
<table width="1165px" cellspacing="0" cellpadding="0" valign="top" align="center">
<tr valign="top" width="100%">
<td width="3">
<img src="http://www.livejournal.com/palimg/component/clear.gif" width="3" height="1" alt="" border="0">
</td>
""";
if ($*comp_state == "left") {
print_my_components($p);
"""
<td width="3">
<img src="http://www.livejournal.com/palimg/component/clear.gif" width="3" height="1" alt="" border="0">
</td>
""";
}
print_my_entries($p, $title);
if ($*comp_state == "right") {
"""
<td width="3">
<img src="http://www.livejournal.com/palimg/component/clear.gif" width="3" height="1" alt="" border="0">
</td>
""";
print_my_components($p);
}
"""
<td width="3">
<img src="http://www.livejournal.com/palimg/component/clear.gif" width="3" height="1" alt="" border="0">
</td>
</tr>
</table>
</body>
</html>
""";
}
#Code to create custom side components.
function print_free_text(Page p) {
var Color k1Mbg;
print_comp_header("Place") ;
"""
<div id="Layer1" style="position:relative; width:100%; height:225px; z-index:1; overflow: none; ">
<table width="100%" cellpadding="3" cellspacing="0">
<tr style="background-color:$k1Mbg;">
<td style="align:center;">
<img src="http://www.astro.gla.ac.uk/~jennifer/ljsideimage.jpg">
</td>
</tr>
</table>
</div>
""" ;
print_comp_footer();
print_comp_header("Book") ;
"""
<div id="Layer1" style="position:relative; width:100%; z-index:1; overflow: auto; overflow-x: hidden;">
<table width="100%" cellpadding="3" cellspacing="0">
<tr style="background-color:$k1Mbg;">
<td style="text-align:justify; padding-top:10; padding-bottom:10">
"The Grail was invented in the mid-twelfth century by the writer Chretien de Troyes. There was nothing necessarily holy about Chretien's grail; he did not write about it as the cup or chalice at the Last Supper,
nor did he give it any other religious association. For that matter, he did not describe it as a cup or chalice at all, but rather as a serving dish, which is the usual and original meaning of the Old French
word <i>graal</i>. But there is something wonderful about the grail's first appearance in the pages of Chretien's story at the beginning because Chretien never finished what he began, so we do not know what the
secret of the grail was meant to be." <br><br>
<b>[The Rough Guide To <i>The Da Vinci Code</i>, Michael & Veronica Hagg, pg.105]</b>
</td>
</tr>
</table>
</div>
""" ;
print_comp_footer();
}
#Code to alter entry formet.
function print_entry(Page p, Entry e, Color bgcolor, Color fgcolor, bool hide_text) {
# Print the anchor to be used in the page summary.
if ($p.view=="friends") {
"""<a name="$e.journal.username$e.itemid"></a> """;
} else { # for recent, day, entry pages.
"""<a name="item$e.itemid"></a>""";
}
# Print the header for the entry.
print_entry_header((defined $e.security_icon?"$e.security_icon ":"")+$e.time->time_format()+" <b>"+$e.time->date_format("long")+"</b>" );
print_system_box_top();
"""<table cellspacing="0" cellpadding="0" border="0" width="100%"><tr>""";
# Start the main entry text area
"""<td width="100%" valign="top">""";
print_content_top();
# If the subject is not empty, then print it followed by the line to seperate it from the entry text
if ($e.subject!="") { """
<div class="entryHeader">$e.subject</div>
<div class="entryDash"><img src="http://www.livejournal.com/palimg/component/clear.gif" width="1" height="1" alt="" border="0" /></div>
</td>
<td width="1" class="medLine"><img src="http://stat.livejournal.com/palimg/component/clear.gif" width="1" height="1" alt="" border="0" /></td>
</tr>
<tr>
<td width="1" class="medLine"><img src="http://stat.livejournal.com/palimg/component/clear.gif" width="1" height="1" alt="" border="0" /></td>
<td class="entry">
"""; }
# Print the entry text.
""" $e.text """;
# Print Mood and/or Music Fields:
# Mood
if ($e.metadata{"mood"}!="") {
"""<br/><br/>""";
# Print the mood label, followed by a mood icon if one exists, followed by the mood text.
"""<b> $*text_meta_mood </b>""";
if (defined $e.mood_icon) { """ $e.mood_icon """; }
print $e.metadata{"mood"};
"""<br/>""";
}
# Music
if ($e.metadata{"music"}!="") {
if ($e.metadata{"mood"}=="") { """<br/><br/>"""; }
# Print the actual music label and the music
"""<b> $*text_meta_music : </b>"""; print $e.metadata{"music"};
}
# Close off the entry text area
print_content_bottom();
# Area underneath the entry that holds the comment links.
"""
<table width="100%">
<tr>
<td width="50%" align="left" valign="center">
<div class="entryComments"><center>
""";
# Print the comment links if the entry allows comments
if ($e.comments.enabled) {
$e.comments->print();
}
"""
</center></div>
</td>
</tr>
</table>
""";
# Check to see if we need to display a usericon and/or journal names, and if so, then print them.
if ($p.view=="friends" or ($*show_entry_userpic and defined $e.userpic) or $e.journal.journal_type=="C") {
# Start the table that will hold the icon and/or names
"""
<td valign="top" style="padding-right: 8px;">
<table cellspacing="0" cellpadding="0" border="0" align="center">
<tr>
<td><img src="http://www.livejournal.com/palimg/component/clear.gif" width="10" height="1" alt="" border="0" /></td>
</tr>
""";
# Display the icon if it exists
if (defined $e.userpic) { """
<tr>
<td><img src="http://www.livejournal.com/palimg/component/clear.gif" width="1" height="2" alt="" border="0" /></td>
""";
#Friends view icon borders can be set here.
if ($p.view=="friends") {
""" <div style="padding-top: 3px; padding-left: 3px; padding-right: 3px; padding-bottom: 3px; background-color: """; print $bgcolor.as_string; """ ;" align="center">
<img border="0" src="$e.userpic.url" width="$e.userpic.width" height="$e.userpic.height" alt="" style="border-color: """; print $fgcolor.as_string; """ ;" />
</div> """;
}else{
""" <td align="center" class="userpic"><img border="1" src="$e.userpic.url" width="$e.userpic.width" height="$e.userpic.height" alt="" /></td> """;
}
"""
</tr>
"""; }
# Display the journal and also poster name if we are viewing the friends page or any page on a community.
if ($p.view=="friends" or $e.journal.journal_type=="C") { """
<tr>
<td><img src="http://www.livejournal.com/palimg/component/clear.gif" width="1" height="2" alt="" border="0" /></td>
<td align="center" class="ljuser">$e.journal""";
if ($e.journal.username!=$e.poster.username) {"""
<div align="center" class="ljuser">$e.poster</div>""";
} """
</td>
</tr>""";
}
"""
</table>
<center><img src="http://www.livejournal.com/palimg/component/clear.gif" width="1" height="14" alt="" border="0" /><br/>
""" ;
$e->print_linkbar() ;
"""
<br/><br/><span style="white-space:nowrap;"><b><a href="$e.permalink_url" class="commentLinks">$*text_permalink</a> </b></span>
</center>
</td>
"""; }
# End the entry component and put a spacer after it so that entry components are seperated.
"""</tr></td></table>""";
print_system_box_bottom();
""" <div><img src="http://www.livejournal.com/palimg/component/clear.gif" width="3" height="3" alt="" border="0"></div> """;
} # end of Function print_entry