Blank to theme on stage view

edited April 2020 in Development
Hey!
Recently I found a topic here on how to customize a stage live view. I'm trying to find a way to use my projector (default view) and another lyrics output (remote stage view) which I access through my streaming software. This is a custom stage view that has a transparent background, so I don't need to chroma key it.
But I'm quite limited. Because I copied the default stage view files and adapted to my needs (fonts, transparent background) I'm not able to "blank to theme". Even if I blank it, only my projector is affected, while my custom stage view stills display text. It's obvious because it's the way it's supposed to be (display text as a reference on the stage monitor).
I know that the remote main view and the stage view are different in their functionalities. But I'd like to know if there's a way to remove my text on my stage view when "blank to theme" is on.
Basically I wanted to create two different video outputs (analogic and web remote) to be controlled at the same time and with the same results. So if there's another way to do this, please let me know. Maybe trying to change the default remote main view to remove its background as well, idk.
There is no problem for me to code js or any other language, I just want to make it work!

Thanks in advance! Bless!

Comments

  • Here is the code I used is a custom stage view I built to do this functionality in OBS.  I bolded the sections you will need to add to your javascript code to make work.  If you want the entire part I built I would be happy to share.  I am just displaying the text of the songs or the text of the scripture.  Plus a little footer with song title or scripture title.

    updateSlide: function() {
      if (OpenLP.currentTheme || OpenLP.currentBlank)
      $("#currentslide").html("");
      else {
    // Show the current slide if displayed
    var slide = OpenLP.currentSlides[OpenLP.currentSlide];
    var text = "";
    text += slide["text"];
    // Show the Song or Scripture Title
    text += "<br /><div id='itemFooter'>" + OpenLP.itemFooter + "</div>";
    text = text.replace(/\n/g, "<br />");
    $("#currentslide").html(text);
    text = "";
      }
      },
      pollServer: function () {
        $.getJSON(
          "/api/poll",
          function (data, status) {
            if (OpenLP.currentItem != data.results.item ||
                OpenLP.currentService != data.results.service) {
              OpenLP.currentItem = data.results.item;
              OpenLP.currentService = data.results.service;
      OpenLP.currentTheme = data.results.theme;
      OpenLP.currentBlank = data.results.blank;
              OpenLP.loadSlides();
            }
            else if (OpenLP.currentSlide != data.results.slide) {
              OpenLP.currentSlide = parseInt(data.results.slide, 10);
              OpenLP.updateSlide();
            }
    else if (OpenLP.currentTheme != data.results.theme  ||
    OpenLP.currentBlank != data.results.blank) {
      OpenLP.currentTheme = data.results.theme;
      OpenLP.currentBlank = data.results.blank;
      OpenLP.updateSlide();
    }
          }
        );
      }
    }
  • Hi, thanks for the code.

    How can I remove the text, when I show pdfs, jpgs, pptx, video files? For example "video.mp4".

    I want to use this view only for song texts.

    Lukas
  • Hi,

    I am having the same issue trying to get rid of the song lyrics on the stage view after the song has completed. I tried to copy and paste the code above into the JS file but it doesn't seem to be removing the lyrics when I go blank to theme in OpenLP. Here's my full code:


    window.OpenLP = {

     loadService: function (event) {

      $.getJSON(

       "/api/service/list",

       function (data, status) {

        OpenLP.itemFooter = "";

        for (idx in data.results.items) {

         idx = parseInt(idx, 10);

         if (data.results.items[idx]["selected"]) {

           OpenLP.itemFooter = data.results.items[idx]["title"];

     if("" != data.results.items[idx]["notes"])

    OpenLP.itemFooter += " - " + data.results.items[idx]["notes"];

          break;

         }

        }

        OpenLP.updateSlide();

       }

      );

     },

     loadSlides: function (event) {

      $.getJSON(

       "/api/controller/live/text",

       function (data, status) {

        OpenLP.currentSlides = data.results.slides;

        OpenLP.currentSlide = 0;

        $.each(data.results.slides, function(idx, slide) {

         if (slide["selected"])

          OpenLP.currentSlide = idx;

        })

        OpenLP.loadService();

       }

      );

     },

    updateSlide: function() {

     if (OpenLP.currentTheme || OpenLP.currentBlank)

     $("#currentslide").html("");

     else {

    // Show the current slide if displayed

    var slide = OpenLP.currentSlides[OpenLP.currentSlide];

    var text = "";

    text += slide["text"];

    // Show the Song or Scripture Title

    text += "<br /><div id='itemFooter'>" + OpenLP.itemFooter + "</div>";

    text = text.replace(/\n/g, "<br />");

    $("#currentslide").html(text);

    text = "";

     }

     },

     pollServer: function () {

      $.getJSON(

       "/api/poll",

       function (data, status) {

        if (OpenLP.currentItem != data.results.item ||

          OpenLP.currentService != data.results.service) {

         OpenLP.currentItem = data.results.item;

         OpenLP.currentService = data.results.service;

     OpenLP.currentTheme = data.results.theme;

     OpenLP.currentBlank = data.results.blank;

         OpenLP.loadSlides();

        }

        else if (OpenLP.currentSlide != data.results.slide) {

         OpenLP.currentSlide = parseInt(data.results.slide, 10);

         OpenLP.updateSlide();

        }

    else if (OpenLP.currentTheme != data.results.theme ||

    OpenLP.currentBlank != data.results.blank) {

     OpenLP.currentTheme = data.results.theme;

     OpenLP.currentBlank = data.results.blank;

     OpenLP.updateSlide();

    }

       }

      );

     }

    }

    $.ajaxSetup({ cache: false });

    setInterval("OpenLP.pollServer();", 500);

    OpenLP.pollServer();

  • @cstjohn Do you see any errors while using the stage view? You can view the console on most browsers by pressing `ctrl + shift + J`.

  • Hi, no I don't see any errors - the lyrics just show as normal and then it doesn't change when I click blank to theme.

  • So if I look at the console, I do get some errors - they are the same whether or not I input the blank to theme code or not, though. The same code without that portion still gives these same errors.


  • @cstjohn Those are just warnings, they are safe to ignore. I tried out the code you pasted above and it works fine for me... Perhaps you're using the wrong file? To test, try add alert("Hello") at the top of the file and open the page again. You should get an alert box that says "Hello".

  • I did make a copy of the original stage view and then insert the code into it. Is there somewhere I need to change the file location either in OpenLP or in any of the CSS or any other files?

  • No, it should work where it is. Did the alert work?

  • No, I don't see an alert when I pull up the stage view on my computer after putting that code in. Do the files need to be named something specifically? How do I make sure I'm referencing the correct location?

  • The file should be linked in the HTML. What version of OpenLP are you using?

  • I have 2.4.6 - editing the file location in the HTML fixed it. I got the alert and the blank to theme also worked. Thank you for your help!

  • Nice! Great to hear you've got it working.

Sign In or Register to comment.