A possible solution to Canvas not supporting the web browser on mobile devices

bbelew
Community Contributor

As many of you know the mobile app, at least on iOS, is great when it works.   We've been running into app issues where multiple choice questions don't display, or the students are kicked out of quizzes, a known API issue I guess, or various other problems that manifest with the apps.    So what do our teachers do?  They switch over to the web interface, which also doesn't work correctly on the iPads.    We as i'm sure many others do as well, file support tickets to get the issues fixed.  We are told to use the app, because the web interface isn't supported on mobile devices.  We of course mention that the app also is broken, to which they reply use a computer.  Not really a solution for daily use of canvas in a 1:1 environment.

The issue we have with the web interface on mobile devices is the right side bar covers the content area.   Sometimes closing the left menu works, but it seems like with the majority of students that button will work sometimes and not others  ( new interface by the way ).  

To get around that I put in some javascript to add a "close right sidebar" option in the footer of the page.  Students can click that to toggle the visibility of the right sidebar.      Note this only works when viewing the device in landscape mode, and requires a double tap to make it hide.  But it seems to be a viable solution as a backup to the broken app.

function toggle_visibility(id) {

   var e = document.getElementById(id);

   if(e.style.display == 'block')

      e.style.display = 'none';

   else

      e.style.display = 'block';

}

var div = document.getElementById('footer-links');

div.innerHTML = div.innerHTML + "<a href='#' onclick=\"toggle_visibility('right-side-wrapper')\">Hide Right Side</a>";