mirror of
https://github.com/ZDoom/fluidsynth.git
synced 2024-11-30 16:01:51 +00:00
Updated XSL / styling for fluidsettings.xml
This commit is contained in:
Marcus Weseloh
parent
b28c0ed044
commit
a8041e45f8
1 changed files with 283 additions and 203 deletions
|
|
@ -5,212 +5,292 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
table
|
||||
{
|
||||
border: 3px solid black;
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: sans-serif;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.first-row
|
||||
{
|
||||
border-top: 3px solid black;
|
||||
#sidebar {
|
||||
position: fixed;
|
||||
width: 25em;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
padding-bottom: 2em;
|
||||
box-sizing: border-box;
|
||||
overflow-y: auto;
|
||||
color: white;
|
||||
background: #333;
|
||||
}
|
||||
|
||||
th
|
||||
{
|
||||
font-weight: normal;
|
||||
white-space: nowrap;
|
||||
padding: 15px 5px 15px 5px;
|
||||
border-top: 1px solid black;
|
||||
border-left: 1px solid black;
|
||||
border-right: 1px solid black;
|
||||
#sidebar ul li a {
|
||||
display: block;
|
||||
padding-left: 5%;
|
||||
padding-top: 0.3em;
|
||||
padding-bottom: 0.3em;
|
||||
color: #fafafa;
|
||||
}
|
||||
|
||||
|
||||
td
|
||||
{
|
||||
padding: 15px 5px 15px 5px;
|
||||
#sidebar a:hover {
|
||||
background: #666;
|
||||
}
|
||||
|
||||
.cell-def
|
||||
{
|
||||
white-space: nowrap;
|
||||
border-top: 1px solid black;
|
||||
}
|
||||
.cell-vals
|
||||
{
|
||||
border-top: 1px solid black;
|
||||
}
|
||||
.cell-desc
|
||||
{
|
||||
border-top: 1px solid black;
|
||||
#sidebar .muted {
|
||||
color: #ccc !important;
|
||||
}
|
||||
|
||||
.audio {background-color: hsl(170, 100%, 90%);}
|
||||
.midi {background-color: hsl(125, 100%, 90%);}
|
||||
.player {background-color: hsl(85, 100%, 85%);}
|
||||
.shell {background-color: hsl(60, 100%, 90%);}
|
||||
.synth {background-color: hsl(35, 100%, 90%);}
|
||||
.deprecated {background-color: hsl(0, 0%, 93%);}
|
||||
#sidebar h1 {
|
||||
padding-top: 1em;
|
||||
margin: 0;
|
||||
padding-left: 5%;
|
||||
}
|
||||
|
||||
#sidebar h2 {
|
||||
padding-left: 5%;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
color: lightblue;
|
||||
}
|
||||
|
||||
#sidebar ul,
|
||||
#sidebar ul li
|
||||
{
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#sidebar li a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.deprecated-badge {
|
||||
margin-left: 0.5em;
|
||||
font-size: 80%;
|
||||
font-weight: bold;
|
||||
color: red;
|
||||
}
|
||||
|
||||
#main {
|
||||
margin-left: 25em;
|
||||
padding: 1em 2em;
|
||||
box-sizing: border-box;
|
||||
max-width: 60em;
|
||||
background: white;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#main h2 {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
#main h2:first-child {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.setting {
|
||||
padding: 0;
|
||||
margin: 1em 0;
|
||||
border-left: 1px solid #eee;
|
||||
border-radius: 5px 0px 0px 0px;
|
||||
}
|
||||
|
||||
@-webkit-keyframes flash-header {
|
||||
from { background: lightblue; }
|
||||
50% { background: #eee; }
|
||||
to { background: lightblue; }
|
||||
}
|
||||
|
||||
@keyframes flash-header {
|
||||
from { background: lightblue; }
|
||||
50% { background: #eee; }
|
||||
to { background: lightblue; }
|
||||
}
|
||||
|
||||
.setting:target .setting-header {
|
||||
background: lightblue;
|
||||
-webkit-animation: flash-header .5s 2 linear;
|
||||
animation: flash-header .5s 2 linear;
|
||||
}
|
||||
|
||||
.setting-header {
|
||||
background: #eee;
|
||||
border-radius: 5px 0px 0px 0px;
|
||||
padding: 0.5em 1em;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.setting-body {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.setting-name {
|
||||
font-weight: bold;
|
||||
display: inline;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.setting-type {
|
||||
color: #666;
|
||||
font-weight: bold;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.setting-attribute {
|
||||
margin-bottom: 0.8em;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.setting-attribute .label {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-width: 6em;
|
||||
}
|
||||
|
||||
.setting-attribute .value {
|
||||
display: inline-block;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.setting-deprecated {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.setting-description {
|
||||
color: black;
|
||||
margin-top: 1.5em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: darkblue;
|
||||
}
|
||||
</style>
|
||||
<title>FluidSettings</title>
|
||||
<title>FluidSynth Settings</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>FluidSettings</h1>
|
||||
<div id="sidebar">
|
||||
<h1>FluidSynth Settings</h1>
|
||||
|
||||
<xsl:for-each select="fluidsettings/*">
|
||||
<xsl:sort select="setting[1]/isFirst" />
|
||||
|
||||
<h2><xsl:value-of select="setting[1]/isFirst" /></h2>
|
||||
<ul>
|
||||
<!-- Select the first setting of each group and use it for building up a TOC -->
|
||||
<xsl:for-each select="fluidsettings/*/*[isFirst]">
|
||||
<xsl:sort select="name(..)" />
|
||||
<li style="margin-bottom: 15px">
|
||||
<xsl:attribute name="class">
|
||||
<xsl:value-of select="name(..)" />
|
||||
</xsl:attribute>
|
||||
<xsl:for-each select="*">
|
||||
<li>
|
||||
<a>
|
||||
<xsl:attribute name="href"><![CDATA[#]]><xsl:value-of select="name(..)" /><![CDATA[.]]><xsl:value-of select="name" /></xsl:attribute>
|
||||
<xsl:value-of select="isFirst" />
|
||||
<span class="muted"><xsl:value-of select="name(..)" /></span>.<xsl:value-of select="name" />
|
||||
<xsl:if test="deprecated">
|
||||
<span class="deprecated-badge">deprecated</span>
|
||||
</xsl:if>
|
||||
</a>
|
||||
</li>
|
||||
</xsl:for-each>
|
||||
</ul>
|
||||
</xsl:for-each>
|
||||
</div>
|
||||
|
||||
<div id="main">
|
||||
<xsl:for-each select="fluidsettings/*">
|
||||
<xsl:sort select="setting[1]/isFirst" />
|
||||
|
||||
<table>
|
||||
<!--print each and every setting row by row in the table-->
|
||||
<xsl:for-each select="fluidsettings/*/*">
|
||||
<h2><xsl:value-of select="setting[1]/isFirst" /></h2>
|
||||
|
||||
<xsl:for-each select="*">
|
||||
<xsl:sort select="name(..)" />
|
||||
<!-- <xsl:sort select="name" /> -->
|
||||
<tr>
|
||||
<!-- the class attribute of tr shall be the name of the settings group of the current setting, unless the setting is marked deprecated -->
|
||||
<xsl:attribute name="class">
|
||||
<xsl:choose>
|
||||
<xsl:when test="deprecated">
|
||||
deprecated
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
<xsl:value-of select="name(..)" />
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
<div class="setting">
|
||||
<xsl:attribute name="id">
|
||||
<xsl:value-of select="name(..)" /><![CDATA[.]]><xsl:value-of select="name" />
|
||||
</xsl:attribute>
|
||||
|
||||
<td class="cell-name first-row">
|
||||
<xsl:attribute name="id"><xsl:value-of select="name(..)" /><![CDATA[.]]><xsl:value-of select="name" /></xsl:attribute>
|
||||
<a>
|
||||
<xsl:attribute name="href"><![CDATA[#]]><xsl:value-of select="name(..)" /><![CDATA[.]]><xsl:value-of select="name" /></xsl:attribute>
|
||||
<div class="setting-header">
|
||||
<div class="setting-name">
|
||||
<xsl:value-of select="name(..)" />.<xsl:value-of select="name" />
|
||||
</a>
|
||||
</td>
|
||||
</div>
|
||||
|
||||
<th class="first-row">Type</th>
|
||||
<div class="setting-type">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<td class="cell-type first-row">
|
||||
<div class="setting-body">
|
||||
|
||||
<div class="setting-attribute">
|
||||
<div class="label">Type:</div>
|
||||
<div class="value">
|
||||
<xsl:choose>
|
||||
<xsl:when test="type = 'bool'">
|
||||
int (bool)
|
||||
Boolean (int)
|
||||
</xsl:when>
|
||||
<xsl:when test="type = 'int'">
|
||||
Integer (int)
|
||||
</xsl:when>
|
||||
<xsl:when test="type = 'str'">
|
||||
<xsl:choose>
|
||||
<xsl:when test="vals">
|
||||
Selection (str)
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
String (str)
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
</xsl:when>
|
||||
<xsl:when test="type = 'num'">
|
||||
Float (num)
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
<xsl:value-of select="type" />
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
</td>
|
||||
</tr>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<tr>
|
||||
<xsl:attribute name="class">
|
||||
<xsl:choose>
|
||||
<xsl:when test="deprecated">
|
||||
deprecated
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
<xsl:value-of select="name(..)" />
|
||||
</xsl:otherwise>
|
||||
|
||||
</xsl:choose>
|
||||
</xsl:attribute>
|
||||
|
||||
<td></td>
|
||||
<th>Default</th>
|
||||
<td class="cell-def">
|
||||
<xsl:copy-of select="def" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<xsl:attribute name="class">
|
||||
<xsl:choose>
|
||||
<xsl:when test="deprecated">
|
||||
deprecated
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
<xsl:value-of select="name(..)" />
|
||||
</xsl:otherwise>
|
||||
|
||||
</xsl:choose>
|
||||
</xsl:attribute>
|
||||
|
||||
<td></td>
|
||||
<th>
|
||||
<xsl:choose>
|
||||
<xsl:when test="type = 'str'">
|
||||
Values
|
||||
<xsl:when test="type = 'str' and vals">
|
||||
<div class="setting-attribute">
|
||||
<div class="label">Choices:</div>
|
||||
<div class="value"><xsl:value-of select="vals" /></div>
|
||||
</div>
|
||||
</xsl:when>
|
||||
<xsl:when test="type = 'bool'">
|
||||
Values
|
||||
<div class="setting-attribute">
|
||||
<div class="label">Values:</div>
|
||||
<div class="value">0, 1</div>
|
||||
</div>
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
Min
|
||||
-
|
||||
Max
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
</th>
|
||||
|
||||
<td class="cell-vals">
|
||||
<xsl:choose>
|
||||
<xsl:when test="type = 'str'">
|
||||
<xsl:value-of select="vals" />
|
||||
</xsl:when>
|
||||
<xsl:when test="type = 'bool'">
|
||||
1, 0
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
<xsl:when test="min or max">
|
||||
<div class="setting-attribute">
|
||||
<div class="label">Min - Max:</div>
|
||||
<div class="value">
|
||||
<xsl:value-of select="min" />
|
||||
-
|
||||
<xsl:value-of select="max" />
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<xsl:attribute name="class">
|
||||
<xsl:choose>
|
||||
<xsl:when test="deprecated">
|
||||
deprecated
|
||||
</div>
|
||||
</div>
|
||||
</xsl:when>
|
||||
<xsl:otherwise>
|
||||
<xsl:value-of select="name(..)" />
|
||||
</xsl:otherwise>
|
||||
|
||||
</xsl:choose>
|
||||
</xsl:attribute>
|
||||
|
||||
<td></td>
|
||||
<th>Description</th>
|
||||
<td class="cell-desc">
|
||||
<div class="setting-attribute">
|
||||
<div class="label">Default:</div>
|
||||
<div class="value"><xsl:copy-of select="def" /></div>
|
||||
</div>
|
||||
|
||||
<xsl:if test="deprecated">
|
||||
<div class="setting-deprecated">
|
||||
This setting is deprecated and might be removed in a future version of FluidSynth.
|
||||
</div>
|
||||
</xsl:if>
|
||||
|
||||
<div class="setting-description">
|
||||
<xsl:copy-of select="desc" />
|
||||
<xsl:choose>
|
||||
<xsl:when test="deprecated">
|
||||
<br /><br />
|
||||
<strong style="color:red">DEPRECATED</strong><br /><br />
|
||||
<xsl:copy-of select="deprecated" />
|
||||
</xsl:when>
|
||||
</xsl:choose>
|
||||
</td>
|
||||
</tr>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</xsl:for-each>
|
||||
</table>
|
||||
</xsl:for-each>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</xsl:template>
|
||||
</xsl:stylesheet>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue