Skip to content
This repository has been archived by the owner on Jul 9, 2023. It is now read-only.

Commit

Permalink
fix bug, improve slider on mobile, add more documentation
Browse files Browse the repository at this point in the history
David Ralph committed Feb 20, 2022
1 parent 7999ee2 commit 86e2378
Showing 4 changed files with 43 additions and 4 deletions.
2 changes: 2 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -6,6 +6,8 @@ This is designed to be used when VLC is running on a separate device that isn't
a laptop behind the scenes in an event. The web interface allows you to control the interval music from your phone or a computer. The advantages of this project over the built-in interface are that it comes with shortcuts to automate tasks such as gradually increasing volume and fade-in/fade-out.

## Installation
### Quick start
Download a release from [here](https://github.com/davidcralph/vlc-bgm/releases), extract the folder, modify the config then run the binary.
### Requirements
* [VLC](https://www.videolan.org/vlc/)
* [Node.js](https://nodejs.org/en/)
4 changes: 2 additions & 2 deletions src/modules/socket.js
Original file line number Diff line number Diff line change
@@ -125,8 +125,8 @@ module.exports = (io, vlc, refresh, config, log) => {
if (checkDisconnect(socket) === true) {
return;
}
vlc.setVolume(val * 0.256);
vlc.setVolume(val * 2.56);
io.emit('refresh', await refresh());
});
});
}
};
37 changes: 37 additions & 0 deletions src/public/assets/css/index.css
Original file line number Diff line number Diff line change
@@ -122,3 +122,40 @@ body {
margin-top: 50px;
}
}

input[type=range] {
-webkit-appearance: none;
appearance: none;
background: #363636;
border-radius: 12px;
}

input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 30px;
height: 30px;
background: #48c78e;
cursor: pointer;
border-radius: 12px;
}

input[type=range]::-moz-range-thumb {
width: 30px;
height: 30px;
background: #48c78e;
cursor: pointer;
border-radius: 12px;
}

input[type=range]::-webkit-slider-thumb:hover {
background: #3ec487;
}

input[type=range]::-moz-range-thumb:hover {
background: #3ec487;
}

input, span {
vertical-align: middle;
}
4 changes: 2 additions & 2 deletions src/views/index.eta
Original file line number Diff line number Diff line change
@@ -40,7 +40,7 @@
<p class='subtitle'>Volume control</p>
<div class='volumecontrol'>
<span>0%</span>
<input type='range' min='0' max='100' step='5' name='volume' id='volumeslider' value='<%= it.volume %>'
<input type='range' min='0' max='100' step='5' name='volume' id='volumeslider' value='<%= it.volume %>'>
<span>100%</span>
</div>
</div>
@@ -75,7 +75,7 @@
<span>1</span>
<input type='range' min='0' max='100' value='50' step='10' name='amount' id='amount'>
<span id='amountcurrent'>0 (50)</span>
<br />
<br /><br />
<label for='speed'>Speed (ms)</label>
<br />
<span>0</span>

0 comments on commit 86e2378

Please sign in to comment.