MP Spectator Web Overlay

1:45 > ...and the engine flies away. Gone with the wind.

 

yeah Im sure they will change this eventually

 

Hey,
first off all, I love the Broadcast overlay. Its just perfect. But I have one question.
May it be able to use this overlay also on replayfiles? Is it able to implementate that?
Thanks

 

for the replay implementation (long term) I think it should be possible to create action replays while the race is being broadcast then the ability ton play them back during the broadcast would make much better streams and could make r3e very popular with leagues. the biggest thing that tends to make iracing streams look unprofessional and choppy is the very long screens they display while finding the point in the race that a incident happened. ideally a tool powerful enough to create a highlights reel during the race would mean much more professional easy to watch races.

 

Is there any documentation how i can adjust the overlay?

 

little adjustments make that overlay more sexy

 

Some DTM92 impressions with adjusted overlay.

 

I have created a dedicated server named "spectator overlay test", feel free to join. Im testing live the overlay. i hope some players join

thanks mates.

When the overlay is ready i will post the adjusted code.

 

@Tarik Userli Ooh offline now. I'm ready to do some random laps as long as it's is not Paul Ricard, Shanghai or Salzburgring as I don't have those tracks.

Lol nevermind I was blind!

 

@Flavourlicious Thanks mate!

 

I need one more to edit the compare module

 

Here are the 1st code:
put it in:
spectator\assets\components\widgets\focusedDriver\focusedDriver.generic.less

Code:

.driverInfoFocusedDriverGeneric()  {
    text-align: center;
    font-family: Oswald;
    color: #fff;
    .onCreation(-webkit-transform, translate(0, 120px), translate(0, 0), 0.5s);
    .inner {
        height: 65px;
        display: inline-block;
        position: relative;
    }
    .extra-info {
        position: absolute;
        top: 90%;
        left: 125px;
        z-index: -1;
        margin-top: -0px;
        font-family: Hel;
        ul {
            margin: 0;
            padding: 0;
            li {
                font-size: 20px;
                float: left;
                background: #000;
                padding: 7px 10px;
                margin-right: 10px;
                .gradient(#fff, lighten(#000, 20%), lighten(#000, 10%));
                border-radius: 0 0 10px 10px;
                color: #fff;
                height: 20px;
                position: relative;
                top: -42px;
                -webkit-transition: top 0.5s;
                &.active {
                    top: 0;
                }
                &.finished {
                    color: rgba(255, 255, 255, 1);

                    &.personal-best {
                        color: #00ff00;
                    }
                    &.global-best {
                        color: #f500f5;
                    }
                }
            }
        }
    }
    .best-time {
        font-size: 18px;
        background: #000;
        padding: 10px 10px;
        margin-right: 10px;
        .gradient(#fff, lighten(#000, 20%), lighten(#000, 10%));
        border-radius: 10px 10px 0 0;
        color: rgba(255, 255, 255, 0.5);
        height: 35px;
        font-family: Hel;
        z-index: 2;
        margin-bottom: -5px;
        position: absolute;
        color: #00ff00;
        right: 51px;
        bottom: 100%;
        -webkit-transition: top 0.5s;
    }
    .position, .name, .manufacturer, .flag-container {
        background: url(/focusedDriver/generic/bg.png);
        vertical-align: top;
        display: inline-block;
        height: 60px;
        line-height: 75px;
    }
    .position {
        width: 65px;
        font-size: 30px;
        text-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
        text-align: center;
        padding-left: 10px;
        line-height: 65px;
        &:after {
            content: '.';
        }
    }
    .name {
        background: url(/focusedDriver/generic/name-repeat.png);
        font-size: 30px;
        padding: 0 25px;
        min-width: 370px;
        color: #ffd700;
        line-height: 70px;
    }
    .manufacturer {
        background-position: -442px 0;
        width: 82px;
        position: relative;
        img {
            position: absolute;
            top: 12px;
            left: 25px;
            height: 40px;
        }
    }
    .flag-container {
        width: 55px;
        height: 55px;
        background-position: -55px 0;
        position: relative;
        .flag {
            width: 61px;
            height: 55px;
            background: #000;
            position: absolute;
            top: 5px;
            left: 0px;
        }
        &:after {
            display: block;
            content: '';
            width: 55px;
            height: 55px;
            background: #000;
            position: absolute;
            top: 5px;
            left: 0px;
            background: url(/focusedDriver/generic/bg.png) no-repeat -66px -5px;
        }
    }
}
.generic .focused-driver-info {
    .driverInfoFocusedDriverGeneric;
    position: fixed;
    bottom: 55px;
    left: 0;
    right: 0;
}

 

Maybe some GT action on another track?

 

ok, tell me what u want

 

ADAC GT on SPA! lol

But ADAC GT on Suzuka is a combo I've never really tried out so that would be fun. Maybe longer quali so people can see the server and join in.

 

Online

 

Joined, will be driving in a few minutes.

 

ok but i need to go in 30 mins Dedicated server still online.

This GT Cars looks awesome <3