Spring naar letter van het alfabet

  • Onderwerp starter Onderwerp starter huijb
  • Startdatum Startdatum
Status
Niet open voor verdere reacties.
huijb

huijb

Supermoderator
Forumleiding
Supermoderator
Lid geworden
19 dec 2001
Berichten
9.985
D.m.v. onderstaande code creeër ik met MP3tag een HTML lijst van mijn muziek.
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">
<table class="table1" width="80$char(37)" border="2" cellspacing="1" cellpadding="2">
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="1">
		<tr>
			<th class="title">Nummer</th>
			<th class="title">Artiest</th>
			<th class="title">Titel</th>
			<th class="title">Locatie</th>
			<th class="title">Duur</th>
		</tr>
$loop("%_filename_ext%")<tr>
<td class="table$if($odd(%_counter%),2,3)" align="center" width="1$char(37)">$num(%_counter%, 2)</td>
<td class="table$if($odd(%_counter%),2,3)" align="left" width="6$char(37)">%artist%</td>
<td class="table$if($odd(%_counter%),2,3)" align="left" width="6$char(37)">%title%</td>
<td class="table$if($odd(%_counter%),2,3)" align="left" width="6$char(37)">%_folderpath_rel%</td>
<td class="table$if($odd(%_counter%),2,3)" align="center" width="1$char(37)">%_length%</td>
</tr>$loopend()
</table><br>

</div>
</body>
</html>

Is het mogelijk dat ik bovenaan de pagina het alfabet krijg en dat ik door middel van klikken op een letter van dat alfabet, ik naar de desbetreffende nummers ga die beginnen met de letter waarop ik klikte.
 
Springen kan; via het <a> tag (anchors). Zoiets:
HTML: 
<a href='#a'>A</a> | <a href='#b'>B</a> | <a href='#c'>C</a>


<a name='a'>Nummers met een A</a>
*hier lijstje met A*

<a name='b'>Nummers met een B</a>
*hier lijstje met A*

<a name='c'>Nummers met een C</a>
*hier lijstje met C*

Zolang je loop maar op alfabet is, kan je dit er dus ergens tussen maken. Ik zie alleen even niet zo snel met welke 'server-side' taal je je playlist maakt, dus als je dat kan vertellen, zou het veel helpen.
 
Ik zal je voorstel eens proberen. Wat voor taal het is, MP3tag zegt dat het HTML is. Hier staan enkele voorbeelden die worden gebruikt als export. Misschien dat dat licht in de duisternis brengt.

Edit: nu ik je voorstel beter bekijk, waar zou ik regel 4 t/m 11 dan moeten zetten. De lijst wordt d.m.v. een loop gecreerd.
 
Laatst bewerkt:
Ah, ik had eroverheen gelezen. MP3tag gebruikt de code dus om er iets van te maken.


(...) leest wat voorbeelden van die site (...)


Hmm, dit gaat vervelend worden. Het punt is 1) dat ik niet op de hoogte ben van de code die ze gebruiken en 2) ik zo snel niet een manier zie om de loop op alfabet te laten gaan. Wat ik wel eventueel kan doen is een javascriptje gebruiken om het te maken, maar, dan moet je dus wel javascript willen. Niet dat het heel erg is, maar mischien heb je dat liever niet.
 
Het gaat om het resultaat en als dat resultaat met javascript te bereiken wie ben ik dan om dat niet te willen. ;) M.a.w. als het niet teveel gevraagd is :thumb:
 
Okay, nu, ik heb even een testje gemaakt; het kan goed zijn dat dit niet werkt, maargoed.

Overgens is het de bedoeling dat er als uitkomst steeds op 1 regel alle data achter elkaar komt, met komma's ertussen. Geen tabel nog, dat komt later wel.

HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">

<script type='text/javascript'>

var stuff = [];

$loop("%_filename_ext%")
   stuff[%_counter%] = [$num(%_counter%, 2),%artist%,%title%,%_folderpath_rel%,%_length%];
$loopend()


var obj = document.getElementById('test');

for(var i=0;i<stuff.length;i++)
{
   obj.innerHTML += stuff[i][0] + ',' + stuff[i][1] + ',' + stuff[i][2] + ',' + stuff[i][3] + ',' + stuff[i][4] + '<br />';
}

</script>
 
<div id='test'></div>

</div>
</body>
</html>
Kan je, mocht dit niet/wel werken, ook even de gegenereerde html kunnen posten? (eventueel van aleen een folder met 5 of 6 nummers als het er veel zijn)


:thumb:
 
Hm, okay. Blijkbaar moet je haakjes tussen andere haakjes zetten. Grappig.


Anywho, ik heb het script veranderd; probeer het nog eens: (yup, dit gaat waarschijnlijk nog 3 of 4 keer gebeuren)
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">
 
<script type='text/javascript'>
 
var stuff = '['']';
 
$loop("%_filename_ext%")
   stuff'['%_counter%']' = '['"$num(%_counter%, 2)","%artist%","%title%","%_folderpath_rel%","%_length%"']';
$loopend()
 
 
var obj = document.getElementById('test');
 
for(var i=0;i<stuff.length;i++)
{
   obj.innerHTML += stuff'['i']''['0']' + ',' + stuff'['i']''['1]' + ',' + stuff'['i']''['2']' + ',' + stuff'['i']''['3']' + ',' + stuff'['i']''['4']' + '<br />';
}
 
</script>
 
<div id='test'></div>
 
</div>
</body>
</html>
 
Vegras zei:
Hm, okay. Blijkbaar moet je haakjes tussen andere haakjes zetten. Grappig.


Anywho, ik heb het script veranderd; probeer het nog eens: (yup, dit gaat waarschijnlijk nog 3 of 4 keer gebeuren)
Klik om te vergroten...
Je hoort mij niet klagen :) Maar het resultaat is het volgende;
[ SYNTAX ERROR IN FORMATTING STRING ]
 
Oh, okay. Nou, deze dan?
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">
 
<script type='text/javascript'>
 
var stuff = '['']';
 
$loop("%_filename_ext%")
   stuff'['%_counter%']' = '['$num(%_counter%, 2),%artist%,%title%,%_folderpath_rel%,%_length%']';
$loopend()
 
 
var obj = document.getElementById('test');
 
for(var i=0;i<stuff.length;i++)
{
   obj.innerHTML += stuff'['i']''['0']' + ',' + stuff'['i']''['1]' + ',' + stuff'['i']''['2']' + ',' + stuff'['i']''['3']' + ',' + stuff'['i']''['4']' + '<br />';
}
 
</script>
 
<div id='test'></div>
 
</div>
</body>
</html>
 
Resultaat hetzelfde:
[ SYNTAX ERROR IN FORMATTING STRING ]
 
hmmm, vreemd.

Als er nog iemand is die dit een poging wil geven: vond de scripting functies: http://help.mp3tag.de/en/main_scripting.html en hier nog meer info

Nou, nog maar een keer dan:
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">
 
<script type='text/javascript'>
 
var stuff = new Array();
 
$loop("%_filename_ext%")
   stuff'['%_counter%']' = '['$num(%_counter%, 2),%artist%,%title%,%_folderpath_rel%,%_length%']';
$loopend()
 
 
var obj = document.getElementById('test');
  
</script>
 
<div id='test'></div>
 
</div>
</body>
</html>
 
Geen error.
Opent goed. Bovenste balk met made 020909 en MP3tag enz. staat in beeld. Maar je voelt hem al, geen muziekoverzicht. Wel opmaak, zoals achtergrondkleur.
 
okay, dat klopt, ik heb het deel met neerzetten eruit gehaald, om te kijken of het daaraan lag. Kan je alsnog even de bron posten? (daar gaat het om, kijken of de javascript goed aangemaakt word)
 
Aha. Nou, even wat code teruggelezen, en er miste ergens een '-tje (lang leve syntax highlighting). Anyway, de volgende test:
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">
 
<script type='text/javascript'>
 
var stuff = new Array();
 
$loop("%_filename_ext%")
   stuff'['%_counter%']' = '['"%_counter%","%artist%","%title%","%_folderpath_rel%","%_length%"']';
$loopend()
 
 
var obj = document.getElementById("test");


for(var i=0;i<stuff.length;i++)
{
   obj.innerHTML += stuff'['i']''['0']' + ',' + stuff'['i']''['1']' + ',' + stuff'['i']''['2']' + ',' + stuff'['i']''['3']' + ',' + stuff'['i']''['4']' + '<br />';
}


</script>
 
<div id='test'></div>
 
</div>
</body>
</html>
uiteraard weer graag de broncode terug. We zijn er bijna!


:thumb:
 
Okay, geweldig nieuws: nog 1 (of 2!) testjes en het is klaar :)
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>
<pre> </pre>
<div align="center">
 
<script type='text/javascript'>
 
var stuff = new Array();
 
$loop("%_filename_ext%")
   stuff'['%_counter%']' = '['"%_counter%","%artist%","%title%","$replace(%_folderpath_rel%,\,\\)","%_length%"']';
$loopend()
 
 
var obj = document.getElementById("test");
 
 
for(var i=0;i<stuff.length;i++)
{
   obj.innerHTML += stuff'['i']''['0']' + ',' + stuff'['i']''['1']' + ',' + stuff'['i']''['2']' + ',' + stuff'['i']''['3']' + ',' + stuff'['i']''['4']' + '<br />';
}
 
 
</script>
 
<div id='test'></div>
 
</div>
</body>
</html>
je weet wat je moet doen ;)
 
alrigt:
HTML: 
$filename(Mijn muziek %_date%.html)<html>
<head>
<title>Mijn muziek of "%_date%"</title>
<style type="text/css"><!--
BODY { background: #404142; color: white; FONT-FAMILY: Verdana,Arial; FONT-SIZE: 9pt; }
.table1 { background: #7B8279; FONT-SIZE: 8pt; color: white; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table2 { background: #2C2D2E; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
.table3 { background: #111112; FONT-SIZE: 8pt; color: #B9C2C4; FONT-FAMILY: Tahoma,Verdana,Arial; }
a:link, a:visited, a:active { text-decoration: none;color: #000; }
a:hover { text-decoration: underline;color: #B9C2C4; }
--></style>
</head>
<body>
<table class="table1" width="80$char(37)" border="0" cellspacing="1" cellpadding="2" ALIGN="center">
<tr>
<td align="center">made on %_datetime% with <a href="http://www.mp3tag.de/" target="_blank"><b>%_app%</b></a> - the <b>universal</b> Tag Editor</td>
</tr>
</table>

<div align="center">
<table class="table1" width="80$char(37)" border="2" cellspacing="1" cellpadding="2">
<table class="table1" id='test' width="80$char(37)" border="0" cellspacing="1" cellpadding="1">
        <tr>
            <th class="title">Nummer</th>
            <th class="title">Artiest</th>
            <th class="title">Titel</th>
            <th class="title">Locatie</th>
            <th class="title">Duur</th>
        </tr>


</table></table><br>
 

<script type='text/javascript'>
 
var stuff = new Array();
 
$loop("%_filename_ext%")
   stuff'['%_counter%']' = '['"%_counter%","%artist%","%title%","$replace(%_folderpath_rel%,\,\\)","%_length%"']';
$loopend()
 
 
var obj = document.getElementById("test");
 

for(var i=0;i<stuff.length;i++)
{
   obj.innerHTML += "<tr>";
   obj.innerHTML += "<td>" + stuff'['i']''['0']' + "</td>";
   obj.innerHTML += "<td>" + stuff'['i']''['1']' + "</td>";
   obj.innerHTML += "<td>" + stuff'['i']''['2']' + "</td>";
   obj.innerHTML += "<td>" + stuff'['i']''['3']' + "\</td>";
   obj.innerHTML += "<td>" + stuff'['i']''['4']' + "</td>";
   obj.innerHTML += "</tr>";
}
 
</script>

</div>
</body>
</html>
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan