Support #423

GSQMRC needs updates and Overview for setting up their WebScoreboard

Added by Walter Pate 7 months ago. Updated 6 months ago.

Status:In ProgressStart date:05/10/2021
Priority:HighDue date:
Assignee:Walter Pate% Done:

0%

Category:Web ScoreboardSpent time:31.50 h
Target version:Customer needs to fix

Description

Shawn at GSQMRC is wanting more information on setting up their webscoreboard and pointing it to OBS

GSQMRC_Logo.jpg (39.5 KB) Walter Pate, 05/12/2021 05:38 AM

logo2_text_SM.png (93.5 KB) Walter Pate, 05/12/2021 05:38 AM

Enhanced url for scoreboard settings.jpg (101 KB) Walter Pate, 05/12/2021 06:11 AM

History

#1 Updated by Walter Pate 7 months ago

Shawn, We are working on getting you a procedure on how to clean up up your webscoreboard install.
We would like you to use this Redmine link to communicate with us on issues that you are experiencing. The issue number is 423
The first thing that came to my mind was the updated WebScoreboard file we have on our Files section of Moscore.com. This file needs to be extracted to C:/ProgramData/Mosco/Moscore_QM/scoreboard
you can get that file here
http://www.moscore.com//media/scoreboard_test4.zip

Today I spent time going over the scorboard files and have written in some enhancements for your webscoreboard display.
I will send you these updates in a day or two after I compile some notes for you to follow for setup

#2 Updated by Walter Pate 7 months ago

  • Status changed from New to In Progress
  • Priority changed from Normal to High

hanged issue status From new to In Progress

#3 Updated by Walter Pate 7 months ago

first thing the user needs to do is update the Webscoreboard files to Version 4.
you can find the update file scoreboard_test4.zip here
http://www.moscore.com/index.php?option=com_phocadownload&view=category&id=1&Itemid=64
Place this file in the C:ProgramData/Mosco/Moscore_QM/ and extract the file

the following instructions requires the user to have a proper code editor so you can see the line numbers in the code. I have downloaded Microsofts free Visual Studio and installed the Community edition. be sure to choose the web development part of the install.

Next we will start with how to place a Footer Banner with the club logo on the web Scoreboard
The files edited will be in C:ProgramData/Mosco/Moscore_QM/Scoreboard directctory.
1.)Upload the GSQMRC_Logo.jpg and logo2_text_SM.png and place them in the scoreboard directory

2)edit the layout for a footer in layout.css file

The script will setup parameters to allow resizing of your webscoring page

copy this script and replace the lines in layout.css starting at around line 83

header {
font-size: 250%;
background-color: #10F450;
color: white;
}

footer {
position: absolute;
font-size: 250%;
background-color: #10F450;
color: white;
left: 0;
right: 0;
max-width: 100vw;
bottom: 0;
text-align: center;
}

footer, header {
Margin: 0 -500px;
padding: 0px 500px;
}

footer {
zoom: 0.9;
]
}

#4 Updated by Walter Pate 7 months ago

Next find this line in index.html(should be around line 72)

<footer data-hint="Static footer for whole page"></footer>

replace that line with
<footer>GSQMRC 2021 Races <img src="/attachments/download/168/GSQMRC_Logo.jpg" width=150> Live Scoring by Moscore QM<img height="40" src="/attachments/download/169/logo2_text_SM.png"></footer>

#5 Updated by Walter Pate 7 months ago

the Webscoreboard allows the user to change some display settings by entering an enhanced url in the Broadcast software source settings box
(see Enhanced url for scoreboard setting image )
this is explaine a little further at https://github.com/jamie-pate/moscore_sc_html/commit/038bcebbff952ded55b5a5d7d25060fa32fdd3a6

In the OBS sources window settings for the webscoreboard I entered the following
(note the ip address is for my router, the user should enter the ip address of the scoring computer. also text is case sensitive)

http://192.168.1.12/#?settings.showPanels=false

the user will be able to change the fon, color and size of text using this format. This procedure eliminates the user from having to change the code file settings.
return a message in this Issue if you are having troube setting your scoreboard display to your liking

#6 Updated by Walter Pate 7 months ago

Part 4
How to remove the 'Click to play ' text

with your code editor open the style.css file

around line 296 there should be a line that says content:'Click to play';

Edit this line (remove click to play) to read content: '';

#7 Updated by Walter Pate 6 months ago

Moscore WebScoreboard fix with new URL

Instead of modifying the Moscore WebScoreboard software to make size or color changes, the fix is
using a URL to make the changes in your browser of the Broadcasting computer

use the url example below on the computer that is running the OBS software

in the OBS settings enter it in the property settings where you put the link to Moscore
WebScoreboard settings
Note, Change the word 'localhost' to the [ ip address ]of the
Broadcasting computer

http://localhost:8081/#?settings.showFlags=true&settings.lines=11&settings.styleClasses=%5B'white'%5D&settings.fontFamily='SmallFonts'&settings.zoom=4&settings.lineheight=2&settings.fontSize='16px'

example: change settings.styleClasses=%5B'white'%5D to &setttings.style Classes=%5B'red'%5D

changes the color of the text from white to red    (options White, Red, or Green)

or change &settings.fontSize='16px' to &settings.fontSize='24px'

makes a total difference in the font size

or change &settings.zoom=4 to &settings.zoom=2
the scoreboard will shrink
Easy to edit without getting into the code.
Shawn, After looking at your Facebook broadcast, you may try to add a size setting which will give you a black scoreboard image at the top of your page. Try this url and change the size to fit your page as needed
http://localhost:8081/#?size=1800x75settings.showFlags=true&settings.lines=6&settings.styleClasses=%5B'white'%5D&settings.fontFamily='SmallFonts'&settings.zoom=4&settings.lineheight=2&settings.fontSize='26px'

Also available in: Atom PDF