Jump to content

Digital signage


Recommended Posts

I wondered how much Frog is used for digital signage by other schools?

I am wondering whether Frog could provide a good solution for us, by using android devices (touchscreens and firesticks plugged into TVs), kiosk software and Frog, I think we could create a pretty powerful digital signage solution. I'm just musing at the moment, but it is something I think my SLT would go for, and would help our students with maps of school, information about upcoming events and changes, etc. 

Any thoughts.

Link to comment
Share on other sites

19 minutes ago, ADT said:

@Edd was looking into this.... a while back...

 

I made a post some time ago asking schools if they used FrogLearn for digital signage. I was going to construct something for our template server for schools to use but I believe @Graham Quince had already created something that can be modified by schools. Not entirely sure where he got to with this? @Graham Quince did your digital signage site come into fruition? I know alot of custom HTML was used (as you'd expect in this case) but I'll let Graham explain exactly what the end results were!

Link to comment
Share on other sites

There is an example of digital signage on our concept-demo site.  That used the notice board widget to add messages.   I know @gbligh uses iPads and Frog for digital signage.  

Basically, any Frog site set to Public on the web will load in without the Frog bar.  in terms of rotating the contents, the File Drop slideshow (or actually the new Image Carousel) can do that.  Alternatively you can get fancier effects with more HTML.  

I did try with Chosen Hill school to use a cheap TV stick, unfortunately it was so cheap, it would lose the WiFi details each time it was turned off.   It would be worth checking with the Amazon Fire sticks what you can program them to do on start up.   (For the cheap TV stick, I did download an Android app to load the web browser on startup.)

Link to comment
Share on other sites

2 hours ago, Graham Quince said:

There is an example of digital signage on our concept-demo site.  That used the notice board widget to add messages.   I know @gbligh uses iPads and Frog for digital signage.  

Basically, any Frog site set to Public on the web will load in without the Frog bar.  in terms of rotating the contents, the File Drop slideshow (or actually the new Image Carousel) can do that.  Alternatively you can get fancier effects with more HTML.  

I did try with Chosen Hill school to use a cheap TV stick, unfortunately it was so cheap, it would lose the WiFi details each time it was turned off.   It would be worth checking with the Amazon Fire sticks what you can program them to do on start up.   (For the cheap TV stick, I did download an Android app to load the web browser on startup.)

@Graham Quince How about a Raspberry pi? http://www.lifehacker.co.uk/2016/06/02/fullpageos-automatically-boots-your-raspberry-pi-into-a-full-page-web-kiosk-mode

Edited by paulmitchell1989
  • Like 1
Link to comment
Share on other sites

3 hours ago, Graham Quince said:

There is an example of digital signage on our concept-demo site.  That used the notice board widget to add messages.   I know @gbligh uses iPads and Frog for digital signage.  

Thanks Graham, where can I find this concept site, I couldn't see it in the Frog Store?

1 hour ago, paulmitchell1989 said:

This is a good idea, thank you for sharing. This would work better than FireSticks, as it mentions that it can open multiple tabs and rotate to them automatically, which sounds great. That could be a few 'published to the web' sites. 

As an aside, I'm floating two ideas 1) An interactive touch screen kiosk, 2) A digital student information screen, but I'm more interested in seeing if digital signage would work first before I go interactive touch screen. 

I am hoping that using Frog is more cost effective and easier to manage than many of the paid for or open source signage solutions.

 

  • Like 1
Link to comment
Share on other sites

30 minutes ago, deanmoulder said:

Thanks Graham, where can I find this concept site, I couldn't see it in the Frog Store?

This link http://concept-demo.frogos.net/app/os#!ds/signage shows you what you can do.  It's not shared on the FrogStore as it relies on the HTML widget.  Unfortunately any HTML code gets stripped out by the FrogStore.   I'm happy to help get this set up on your Frog though.

 

Graham

Link to comment
Share on other sites

  • 3 weeks later...

Hi Graham, how does the digital signage determine what to pull from the notice board widget? Is it done on a match by day basis or does it pull any notices posted to the notice board. One of the concepts we would like to deliver at our school would be have a button on the dashboard for teachers to press during registration which displays everything pertinent to that week only. Similar to your digital signage concept it would say what events were occurring but would also inform students as to what was for lunch on the day and any sports activities happening that week as well. It would be nice to integrate separate noticeboards if possible whereby one noticeboard holds digital signage postings and the other noticeboard is public for all. That way the digital signage could pull from the public one any information pertinent to that week and from the secondary noticeboard those items that do not necessarily need to be displayed such as lunch and sports events on the day. Not sure if this is possible but would love to trial your HTML code for digital signage if you would be willing to share with us.

Link to comment
Share on other sites

Hi @mhamilton,

The digital signage uses the notice widget's API and the particular notice widget's UUID to display the notices.  You're welcome to give it a go, although i think it needs a little work.  There is a setInterval in the code to reload the notices every hour.  I think you could quite easily incorporate more noticeboards into the one signage, it would just be a case of re-running the API call with a different UUID and removing the clear contents element.

<style>
    .html_code_news_slide {
        width:90%;
        padding:50px;
        font-size:40pt;
        line-height:40pt;
        margin-left:auto;
        margin-right:auto;
        border:1px solid #000000;
        margin-top:50px;
        background:rgba(255,255,255,0.8);
        border-radius:50px;
        min-height:500px;
    }
    
    .html_code_news_slide h2 {
      font-size:60pt;   
        line-height:60pt;
    }
</style>

<div class="html_code_news_slide"></div>

<script type="text/javascript">

(function() {
    var digitalSignageNotices = function() {
	    var noticesUUID = '5E2008FA2002841CAAAD8FD5068D290E15D53D5C204BBE78',
            $noticesContainer = $('.html_code_news_slide'),
            slide=0,
            now = Math.floor(new Date().getTime()/ 1000);

        Frog.Model.api('forum.gettopics', {
            parent: noticesUUID
        }).done(function(noticesResponse) {
            
            noticesResponse.data.topics.forEach(function(notice, index) {
                var startDate = notice.entry.start_date,
                    endDate = notice.entry.end_date,
                    title =  notice.entry.title,
                    content =  notice.entry.content;

                    if (startDate===false) {
                        startDate=0;
                    }
                    if (!endDate){
                        endDate=now+1000;
                    }
                // clear the container first
                $noticesContainer.html();

                if (now>=startDate && now<=endDate) {
                    $noticesContainer
                        .append($(
                                '<div class="newsSlide" id="news'+slide+'">'+
                                '<h2>'+title+'</h2>'+
                                content+
                                '</div>'
                            )
                    );
                    slide++;

                }
            });
           // Once all the slides are loaded, hide and cycle through them
            cycleThrough(slide);



        }).fail(function() {
            // these are not the results you are looking for.
        });

    };

    digitalSignageNotices();
    setInterval(digitalSignageNotices, 360000);

    var cycleThrough = function(slide) {
        var divs = $('div[id^="news"]').hide(),
            i = 0;
            (function cycle() {
                divs.eq(i).fadeIn(200)
                   .delay(10000)
                   .fadeOut(200, cycle);
                i = ++i % slide;
            })();
    };
})();

</script>

 

 

  • Like 1
Link to comment
Share on other sites

  • 3 months later...

Thanks Graham.  Just a note and not sure if there is a work around....  Added the new NoticeBoard with File upload widget (which is awesome as teacher can attach their forms to their post) but when using it with the Digital Signage it produces any spaces as %.  See Sample HERE. https://frog.warwick.bm/app/os?site=digitalsignage# 

Any ideas on how to avoid this or do I need to have a notices section without the uploads widget for this to work?

 

Thanks...

 

Link to comment
Share on other sites

Ah, i think you may be hitting the limitations of two different sets of code.

I've jumped onto your platform and added 

white-space: pre;

Into the CSS for the news block.  This has passed over the line breaks.  One thing i did spot, is that when not logged in, the noticeboard api does not return data.  If you set the site the noticeboard lives on to public on the web, it should get round this issue.

Link to comment
Share on other sites

  • 2 months later...

Sorry, i can't spot anything obvious.  I've gone through it and did notice the UUID of the notice board had changed, but even then it wasn't displaying the notices.  Best guess, the notice about absent students has got some text in it that's break the code.  It is due to expire today, so once it's gone, maybe the noticeboard will work again.

 

Link to comment
Share on other sites

  • 4 years later...

Apologies for the thread necromancy, but after several years it now appears that Digital Signage was someone else's idea, not mine, and therefore I've got the go ahead on this. I would like to do this with Frog and with as little overheads as possible and avoiding digital signage software if possible. 

I'm doing ok. I'm using a Windows mini PC that I am going to stick behind a TV to hide it.  It boots when powered up at the wall, logs in automatically, and launches Edge in full screen on the digital signage Frog site I've setup.  

I have two queries. Firstly, is it possible to load the site without the blue 'Cookie Notification' showing? And secondly, is there a better way than using the 'Kiosk' user profile in Windows to get the page to refresh periodically?

The Cookie Notification is a pain as the only way I have managed to get the screen to refresh is using the 'Kiosk' profile and this displays a message saying '30 seconds until your browser session refreshes'. When the page refreshes, the cookie notification appears again and takes a good chunk of the screen. I obviously can't be there to click the 'Ok' button whenever I want the screen to refresh.

As an aside, I've dabbled with using the shell: startup command and editng the properties in the Edge shortcut to use the 'Kiosk' command to auto launch the digital signage site, and this works, but I can't then use browser add ins, as my original plan was to use a browser add in to automatically refresh the page. 

I don't code, so I don't know how else to approach this, hopefully one of the sages here can help. 

 

Link to comment
Share on other sites

Hi Dean,

Sorry, I've been away (and hoped someone else would have responded - oh well)

We did use to offer a FrogCode widget which was a page changer, unfortunately this stopped working (and I couldn't figure out why). 

The Image Carousel is probably the best option these days.  Add the widget to a page and point it to the site's timeline.  Then any image you send to the site will appear.  (I'd suggest using PowerPoint to make the slides and the "save as image" option.

To hide the cookie warning, something like:

<style>
    .cookie-consent-footer {
        height: 0% !important;

    }
    
</style>

Should do the trick on an HTML widget on the site.

  • Like 1
Link to comment
Share on other sites

  • 2 weeks later...
On 26/09/2022 at 12:53, Graham Quince said:

Hi Dean,

Sorry, I've been away (and hoped someone else would have responded - oh well)

We did use to offer a FrogCode widget which was a page changer, unfortunately this stopped working (and I couldn't figure out why). 

The Image Carousel is probably the best option these days.  Add the widget to a page and point it to the site's timeline.  Then any image you send to the site will appear.  (I'd suggest using PowerPoint to make the slides and the "save as image" option.

To hide the cookie warning, something like:

<style>
    .cookie-consent-footer {
        height: 0% !important;

    }
    
</style>

Should do the trick on an HTML widget on the site.

Thanks for this, the Cookie Notification was still showing when I tested this, I copied the HTML code as it is above, did I perhaps do something wrong?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...