WinJS.UI.SplitView set closedDisplayMode to none for a small screen/mobile device

Question

I'm trying to change the closedDisplayMode value of a WinJS.UI.SplitView.

I would like to set it to none when the universal app i'm working on is used on a small screen/mobile device.

Obviously I can use MediaQueries to handle most presentation differences but as this property is set using javascript it would seem as if my options are limited.

I found this question on MSDN that asks the same question but the answer from one of the guys is to use media queries to set a CSS class, then at runtime, check if the splitview has the class. Unless he knows something that I don't; this is impossible.

Quite frankly I think the other answers are hacky as well. I could detect the device's resolution (as per one of the other answers) but what about high DPI devices that have DPI scaling?

Is there a better way of doing this that just isn't documented anywhere?

<div id="global_splitView" class="splitView" data-win-control="WinJS.UI.SplitView" data-win-options="{  shownDisplayMode : 'inline'}">

    <!-- Pane area -->
    <div class="splitView__bar">

        <div class="splitView__header">
            <button class="splitView__toggle win-splitviewpanetoggle" data-win-control="WinJS.UI.SplitViewPaneToggle" data-win-options="{ splitView: select('.splitView') }"></button>
            <div class="splitView__logo">
            </div>
        </div>

        <div class="group navigation">
        </div>
    </div>

    <!-- Content area -->
    <div class="splitView__content" id="contenthost" data-win-control="Application.PageControlNavigator" data-win-options="{home: '/pages/home/home.html'}">

    </div>    
</div>