Hey liebe Gemeinde!
Ich habe da mal eine Frage an euch. Es geht um eine Sprache die ich nicht beherrsche, eine Programmiersprache. Was es ist weiß ich nicht...HTML? CSS? PHP? Fragt mich nicht, ich hab keine Ahnung. Wahrscheinlich ist's aber HTML, warum erklärt sich sofort.
Was habe ich vor? Ich habe mittels GC Star eine Exportdatei über Datei->Exportieren->HTML erstellt. Das ergebnis seht ihr
hier. Ursprünglich war die Anzahl an DVD's gar nicht dabei...soviel Verständnis hab ich dann doch noch so gerade eben, dass ich das selbst einfügen konnte.
Ich hätte aber gern, wenn man auf einen beliebigen Film klickt, dass anstatt der Bewertung "X/10" eines dieser Bilder hier erscheint:
Aber ich weiß nicht, wie ich den Code dafür basteln muss. Denn wenn das $$rating$$ = 1 ist, dann soll die Grafik für einen Stern angezeigt werden und keine andere. Aber wie mach ich klar, wie das Rating ist. Geht das einfach mit "=1"? Kann ich mir nicht vorstellen. Ich weiß nicht, wie da die Kommunikation und der Exportfunktion von GC Star ist.
Ich hab auch schon an eine if-Klausel gedacht. Aber dafür müsste ich ja erst wissen, wie ich dem klar mache, welches Rating gleich welche Grafik bedeutet. Ich hoffe ihr könnt mir helfen. Eigentlich wollte ich hier die Datei hoch laden, wo alles drin steht...aber ich weiß nicht welche Dateiendung das ist, also mach ich das anders. Ganz unten habe ich etwas fett und rot markiert. Das ist die Stelle wo das $$rating$$ steht:
Code:
[HEADER]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!--
Template made by Tian. It emulates a shelf display.
-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>$$PAGETITLE$$</title>
<style type="text/css">
body
{
color:black;
}
h1
{
text-align:left;
margin-left:0.5em;
font-size:200%;
font-weight:bold;
color:#6c7b8b;
}
h2
{
font-size:150%;
text-align:center;
color:#1c86ee;
font-weight:bold;
}
h3
{
font-size:120%;
font-weight:bold;
margin:1em 0;
color:#6c7b8b;
border-bottom:1px dashed #6c7b8b;
}
#left
{
[JAVASCRIPT]
width:48%;
[/JAVASCRIPT]
border:1px dashed #6c7b8b;
background:#f0f0f0;
}
.imgbox
{
float:left;
padding:2em 1em 0em;
margin:0;
}
img
{
margin:0;
padding:0;
[JAVASCRIPT]
cursor:pointer;
[/JAVASCRIPT]
}
.imginfo
{
float:left;
margin-top:0.5em;
[JAVASCRIPT]
cursor:default;
[/JAVASCRIPT]
}
.synopsis
{
height:8em;
overflow:auto;
padding:0.2em;
background:#f0f0f0;
}
table
{
margin:0 0.5em;
}
th
{
font-weight:bold;
text-align:left;
white-space:nowrap;
padding:0.5em;
background:#f0f0f0;
}
td
{
padding:0.5em;
background:#f0f0f0;
}
#note
{
text-align:center;
padding-top:0.5em;
[JAVASCRIPT]
width:48%;
[/JAVASCRIPT]
color:#6c7b8b;
}
#note a
{
font-weight:bold;
color:#1c86ee;
}
#note a:hover
{
color:#6c7b8b;
}
.spacer
{
clear: both;
}
[JAVASCRIPT]
.expander
{
padding:0;
width:1em;
display:block;
float:left;
text-align:center;
margin-right:0.5em;
cursor:pointer;
}
[/JAVASCRIPT]
.info
{
position:fixed;
top:0;
right:1%;
width:48%;
display:none;
}
.details
{
overflow: auto;
height: 500px;
}
</style>
[JAVASCRIPT]
<script type="text/javascript">
<!--
function getBoxes()
{
return document.getElementById("left").getElementsByTagName("div")
}
function getHeight()
{
//From http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myHeight = document.body.clientHeight;
}
return myHeight - 150;
}
function init()
{
// CSS changes from http://www.quirksmode.org/dom/changess.html
if (!document.styleSheets) return;
var theRules = new Array();
if (document.styleSheets[0].cssRules)
theRules = document.styleSheets[0].cssRules
else if (document.styleSheets[0].rules)
theRules = document.styleSheets[0].rules
theRules[theRules.length-1].style.height = getHeight()+'px';
boxes = getBoxes()
for(i=0; i < boxes.length; i++)
{
box = boxes[i]
if (box.className == "movie")
{
boxes2 = box.getElementsByTagName("div")
boxes2[0].onclick = function(evt)
{
div = this.parentNode
showMe(div.getElementsByTagName("div")[1], this)
}
}
}
headers = document.getElementById("left").getElementsByTagName("h3")
for(i=0; i < headers.length; i++)
{
header = headers[i]
header.style.cursor = 'pointer'
header.innerHTML = '<span class="expander">−</span> ' + header.innerHTML
header.onclick = function(evt)
{
table = this.nextSibling
while (table.tagName != "TABLE") { table = table.nextSibling }
if (table.style.display == "none")
{
table.style.display = "table"
this.innerHTML = this.innerHTML.replace(/\+<\/span>/, '−</span>')
}
else
{
table.style.display = "none"
this.innerHTML = this.innerHTML.replace(/−<\/span>/, '+</span>')
}
}
}
}
var currentBox = 0
var currentImg = 0
function showMe(box, img)
{
hidePrevious()
box.style.display = "block"
img.style.background = "#4b4f63"
img.style.padding = "1em"
currentBox = box
currentImg = img
}
function hidePrevious()
{
if (currentBox)
{
currentBox.style.display = "none"
currentImg.style.background = "#f0f0f0"
currentImg.style.padding = "2em 1em 0em"
}
}
-->
</script>
[/JAVASCRIPT]
</head>
<body [JAVASCRIPT]onload="init()"[/JAVASCRIPT]>
<h1>$$PAGETITLE$$               $$TOTALNUMBER$$ $$ITEMS$$</h1>
<div id="left">
[/HEADER]
[ITEM]
<div class="movie">
<div class="imgbox">
<img src="$$image$$" height="$$HEIGHT_PIC$$" alt="$$title$$" title="$$title$$" />
</div>
<div class="info">
<h2>$$title$$</h2>
<div class="details">
<h3>$$info_LABEL$$</h3>
<table>
<tr>
<td rowspan="5" width="10%">
<img class="imginfo" src="$$image$$" height="$$HEIGHT_PIC$$" alt="$$title$$" title="$$title$$" />
</td>
<th>$$date_LABEL$$</th><td>$$date$$</td>
</tr>
<tr><th>$$director_LABEL$$</th><td>$$director$$</td></tr>
<tr><th>$$time_LABEL$$</th><td>$$time$$</td></tr>
<tr><th>$$genre_LABEL$$</th><td>$$genre$$</td></tr>
<tr><th>$$actors_LABEL$$</th><td>$$actors$$</td></tr>
<tr>
<td colspan="3">
<p class="synopsis">
$$synopsis$$
</p>
</td>
</table>
<h3>$$details_LABEL$$</h3>
<table>
<tr><th>$$rating_LABEL$$</th><td>$$rating$$/10</td></tr>
<tr><th>$$format_LABEL$$</th><td>$$format$$</td></tr>
<tr><th>$$borrower_LABEL$$</th><td>$$borrower$$</td></tr>
</table>
</div>
</div>
</div>
[/ITEM]
[FOOTER]
<div class="spacer"> </div>
</div>
<p id="note">$$GENERATOR_NOTE$$</p>
</body>
</html>
[/FOOTER]
[POST]
[/POST]