Skip to content

Instantly share code, notes, and snippets.

@watershed
Last active March 11, 2024 14:43
Show Gist options
  • Save watershed/f1eb328ac17006b8678146d397d71119 to your computer and use it in GitHub Desktop.
Save watershed/f1eb328ac17006b8678146d397d71119 to your computer and use it in GitHub Desktop.
Laura Ritchie note options (lrno)
<!-- Within the source code view of a WordPress post body -->
<style>
/* CSS for the `lrno` namespace to be provided and inserted here */
</style>
<!-- Hidden after successful JavaScript outcome -->
<div class="lrno-path">/path/to/assets/here</div>
<!-- Hidden after successful JavaScript outcome -->
<table class="lrno-table">
<caption class="lrno-label">Note options setup</caption>
<thead>
<tr>
<th>Note</th>
<th>Milliseconds</th>
<th>Image file name</th>
<th>Audio file name</th>
</tr>
</thead>
<tbody>
<!-- Table rows providing a spec for the note options -->
</tbody>
</table>
<div class="lrno-wrapper">
<!-- JavaScript inserts results here -->
</div>
<!-- JavaScript to be provided, and then uploaded, and its path amended accordingly (replace the …) -->
<script src="/wp-content/uploads/ … /lrno.js"></script>
@watershed
Copy link
Author

watershed commented Mar 11, 2024

  • Every table row must have 4 columns
  • Every row must specify:
    • A note number
    • An image file name which exists at the path provided
    • An audio file name which exists at the path provided
  • For each note number, at least one of its rows must specify an audio duration number in milliseconds
  • It is probably best that:
    • The first table row for a given note provides the duration
    • All rows are in order of their note number
  • A row with the same note number as another is understood to provide the next option for that note:
    • e.g. If row 1 is for note 1, then it provides note 1, option 1; if row 2 is also for note 1, then it provides note 1, option 2
  • Notes may be of different duration, but all note options are understood to span the same duration as their note siblings:
    • Options of different duration are not currently in scope but adaptations for that could be made.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment