Mirror: issues receiving data from Android


#1

Hi!
Looks like my Mirror doesn’t display the data I send with my android app.
The onDataDisplayed android log works fine even so the data I send through my app doesn’t show up (bluetooth and location enabled).
I can properly switch from a template to another using my app, so I can’t understand where the problem is.

I’m currently using compile 'com.estimote:display-sdk:0.1.6'
The HTML code is very simple:

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <script src="jquery-3.1.1.min.js"></script>
  <link rel="stylesheet" type="text/css" href="css/styles.css">

  <script>
    mirror.init();
    mirror.listen(Mirror.Events.USER_DATA, {
      ondata: function (event) {
        const receivedData = event.data;
        document.getElementById("pollname").innerText = receiveData.pollname;
        document.getElementById("pattern").innerText = receiveData.pattern;
        document.getElementById("candidate1").innerText = receiveData.candidate1;
        document.getElementById("candidate2").innerText = receiveData.candidate2;
        document.getElementById("candidate3").innerText = receiveData.candidate3;
        document.getElementById("candidate4").innerText = receiveData.candidate4;
        document.getElementById("candidate5").innerText = receiveData.candidate5;
        pollid = receiveData.pollid;
      },
      ondisconnect: function (event) {
        mirror.selectTemplate(null);
      }
    });

  </script>
</head>

<body>
  <div id="page">
    <div class="container">
      <span id="pollname">pollname</span>
      <div class="text">
        <div id="description">description</div>
        <span id="pattern">pattern</span>
        <div>
          candidate1: <span id="candidate1">candidate1</span>
        </div>
        <div>
          candidate2: <span id="candidate2">candidate2</span>
        </div>
        <div>
          candidate3: <span id="candidate3">candidate3</span>
        </div>
        <div>
          candidate4: <span id="candidate4">candidate4</span>
        </div>
        <div>
          candidate5: <span id="candidate5">candidate5</span>
        </div>
      </div>
    </div>
  </div>
</body>

</html>

Are there other informations I can share with you?
Thanks in advance!


#2

I seems that there is a typo:

const receivedData = event.data;

and should be:

const receiveData = event.data;

You can use:

mirror.redirectConsoleToPopup()

to redirect console messages to on screen popup (more info here).
Please tell me if it fixed the issue.


#3

Yeah you fixed it!
mirror.redirectConsoleToPopup() didn’t know that, it’d have helped me a lot! Good to know.
Sometimes when I load a new template with an index.html file only, the mirror shows me a black screen. What could it be?

Thanks a lot for fixing the issue!


#4

By default Mirror uses black background. Change it in CSS or HTML. You can also change text color to something brighter.