Skip to content

Add a translucent background behind the words #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
nahall wants to merge 7 commits into
base: master
Choose a base branch
from
Open

Add a translucent background behind the words #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
90eba31
Add a translucent background behind the words
nahall Apr 22, 2020
548f51e
Update formatting for our church
nahall Apr 22, 2020
c4a8454
Rework network code to simplify and automatically reconnect.
May 25, 2020
22c4aee
Merge branch 'WebSocketRewrite'
May 25, 2020
5ab0381
Update stylesheet.css
BirdManP Aug 3, 2025
d1fc3b5
Strip text of unnecessary newline characters.
BirdManP Aug 3, 2025
2dac827
Merge pull request #1 from BirdManP/master
nahall Aug 4, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
141 changes: 83 additions & 58 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,69 +4,94 @@
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="stylesheet.css">
<script type="text/javascript" src="lib/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="lib/jquery.json.min.js"></script>
<script type="text/javascript" src="lib/jquery.simple.websocket.js"></script>
<script type="text/javascript" src="lib/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript">
//Connect to ProPresenter Remote Stage Display
var webSocket = $.simpleWebSocket({
url: 'ws://' + config['propresenter_ip'] + ':' + config['propresenter_port'] + '/stagedisplay'
});

//Connect and send the password
webSocket.send({
"pwd": config['propresenter_password'],
"ptl": 610,
"acn": "ath"
}).done(function() {
// message send
console.log("SENT AUTH");
}).fail(function(e) {
// error sending
});


prev_text = '';

// reconnected listening
webSocket.listen(function(message) {

// /* enable this to view Array of data in the console.
// if (message['acn'] != "vid") {
// console.log(message);
// }

// only parse fv arrays
if (message['acn'] == "fv") {
if (message['ary'][0]['txt'] != undefined && message['ary'][0]['acn'] === 'cs') {
var text = '';

// check slide note for noText keyword. If noText is defined dont step into this IF
if (typeof message['ary'][2] !== 'undefined' && message['ary'][2]['txt'] !== config["noText"]) {
// replace carriage return \r and linefeed \n with <br> global
text = message['ary'][0]['txt'].replace(/\r\n|\n|\r/g, '<br />');

// if fading is true and repeated text is true
if (prev_text !== text || config['fade_repeated_text']){
// if fading is true
if (config['fade']){
$("#cs").fadeOut(config["fade_speed"], function(){
$("#cs").html(text);
$("#cs").fadeIn(config["fade_speed"]);
});
// no fade
}else{
$("#cs").html(text);
}
}
// noText keyword was defined on slide note so set #cs to blank
}else{
$("#cs").html("");
}
prev_text = text;
}
}
});
function processProPresenterMessage(message) {

/* enable this to view Array of data in the console. */
/*
if (message['acn'] != "vid") {
console.log(message);
}
*/

// only parse fv arrays
if (message['acn'] == "fv") {
if (message['ary'][0]['txt'] != undefined && message['ary'][0]['acn'] === 'cs') {
var text = '';

// check slide note for noText keyword. If noText is defined dont step into this IF
if (typeof message['ary'][2] !== 'undefined' && message['ary'][2]['txt'] !== config["noText"]) {
// remove newlines at beginning and end of line
// replace carriage return \r and linefeed \n with <br> global
text = message['ary'][0]['txt'].replace(/^\s+|\s+$/g, "").replace(/\r\n|\n|\r/g, '<br />');

// if fading is true and repeated text is true
if (prev_text !== text || config['fade_repeated_text']) {
// if fading is true
if (config['fade']) {
$("#cs").fadeOut(config["fade_speed"], function() {
$("#cs").html(text);
$("#cs").fadeIn(config["fade_speed"]);
});
}
// no fade
else {
$("#cs").html(text);
}
}
}
// noText keyword was defined on slide note so set #cs to blank
else{
$("#cs").html("");
}
prev_text = text;
}
}
}



function connectToProPresenter() {
var proPresenterStageDisplayURL = 'ws://' + config['propresenter_ip'] + ':' + config['propresenter_port'] + '/stagedisplay';

var ws = new WebSocket(proPresenterStageDisplayURL);

ws.onopen = function() {
console.log('ProPresenter connection opened');
ws.send(JSON.stringify({
"pwd": config['propresenter_password'],
"ptl": 610,
"acn": "ath"
}));
};

ws.onmessage = function(e) {
processProPresenterMessage(JSON.parse(e.data));
};

ws.onclose = function(e) {
console.log('ProPresenter socket was closed. Attempting to reconnect in 1 second...', e.reason);
setTimeout(function() {
connectToProPresenter();
}, 1000);
};

ws.onerror = function(err) {
console.error('ProPresenter socket has error: ', err.message, 'Closing socket');
ws.close();
};
}



connectToProPresenter();

</script>
</head>

Expand Down
5 changes: 0 additions & 5 deletions lib/jquery-1.12.0.min.js
View file
Open in desktop

This file was deleted.

2 changes: 2 additions & 0 deletions lib/jquery-3.5.1.min.js
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 0 additions & 2 deletions lib/jquery.json.min.js
View file
Open in desktop

This file was deleted.

Loading