diff --git a/apps/common/main/lib/util/htmlutils.js b/apps/common/main/lib/util/htmlutils.js index 36a91080a5..ab885cfaf1 100644 --- a/apps/common/main/lib/util/htmlutils.js +++ b/apps/common/main/lib/util/htmlutils.js @@ -1,9 +1,19 @@ function checkScaling() { - var str_mq_150 = "screen and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.9), " + - "screen and (min-resolution: 1.5dppx) and (max-resolution: 1.9dppx)"; - if ( window.matchMedia(str_mq_150).matches ) { - document.body.classList.add('pixel-ratio__1_5'); + var matches = { + 'pixel-ratio__1_25': "screen and (-webkit-min-device-pixel-ratio: 1.25) and (-webkit-max-device-pixel-ratio: 1.49), " + + "screen and (min-resolution: 1.25dppx) and (max-resolution: 1.49dppx)", + 'pixel-ratio__1_5': "screen and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.74), " + + "screen and (min-resolution: 1.5dppx) and (max-resolution: 1.74dppx)", + 'pixel-ratio__1_75': "screen and (-webkit-min-device-pixel-ratio: 1.75) and (-webkit-max-device-pixel-ratio: 1.99), " + + "screen and (min-resolution: 1.75dppx) and (max-resolution: 1.99dppx)", + }; + + for (var c in matches) { + if ( window.matchMedia(matches[c]).matches ) { + document.body.classList.add(c); + break; + } } if ( !window.matchMedia("screen and (-webkit-device-pixel-ratio: 1.5)," + diff --git a/apps/common/main/lib/util/utils.js b/apps/common/main/lib/util/utils.js index ec6f0c9756..bedc085708 100644 --- a/apps/common/main/lib/util/utils.js +++ b/apps/common/main/lib/util/utils.js @@ -136,29 +136,56 @@ var utils = new(function() { scale = window.AscCommon.checkDeviceScale(); AscCommon.correctApplicationScale(scale); } else { - var str_mq_150 = "screen and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.9), " + - "screen and (min-resolution: 1.5dppx) and (max-resolution: 1.9dppx)"; + var str_mq_125 = "screen and (-webkit-min-device-pixel-ratio: 1.25) and (-webkit-max-device-pixel-ratio: 1.49), " + + "screen and (min-resolution: 1.25dppx) and (max-resolution: 1.49dppx)"; + var str_mq_150 = "screen and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.74), " + + "screen and (min-resolution: 1.5dppx) and (max-resolution: 1.74dppx)"; + var str_mq_175 = "screen and (-webkit-min-device-pixel-ratio: 1.75) and (-webkit-max-device-pixel-ratio: 1.99), " + + "screen and (min-resolution: 1.75dppx) and (max-resolution: 1.99dppx)"; var str_mq_200 = "screen and (-webkit-min-device-pixel-ratio: 2), " + "screen and (min-resolution: 2dppx), screen and (min-resolution: 192dpi)"; + if ( window.matchMedia(str_mq_125).matches ) { + scale.devicePixelRatio = 1.5; + } else if ( window.matchMedia(str_mq_150).matches ) { scale.devicePixelRatio = 1.5; } else + if ( window.matchMedia(str_mq_175).matches ) { + scale.devicePixelRatio = 1.75; + } else if ( window.matchMedia(str_mq_200).matches ) scale.devicePixelRatio = 2; else scale.devicePixelRatio = 1; } var $root = $(document.body); - if ( scale.devicePixelRatio < 1.5 ) { - $root.removeClass('pixel-ratio__1_5 pixel-ratio__2'); + var classes = document.body.className; + var clear_list = classes.replace(/pixel-ratio__[\w-]+/gi,'').trim(); + if ( scale.devicePixelRatio < 1.25 ) { + if ( /pixel-ratio__/.test(classes) ) { + document.body.className = clear_list; + } } else - if ( !(scale.devicePixelRatio < 1.5) && scale.devicePixelRatio < 2 ) { - $root.removeClass('pixel-ratio__2'); - $root.addClass('pixel-ratio__1_5'); + if ( scale.devicePixelRatio < 1.5 ) { + if ( !/pixel-ratio__1_25/.test(classes) ) { + document.body.className = clear_list + ' pixel-ratio__1_25'; + } + } else + if ( scale.devicePixelRatio < 1.75 ) { + if ( !/pixel-ratio__1_5/.test(classes) ) { + document.body.className = clear_list + ' pixel-ratio__1_5'; + } + } else + if ( !(scale.devicePixelRatio < 1.75) && scale.devicePixelRatio < 2 ) { + if ( !/pixel-ratio__1_75/.test(classes) ) { + document.body.className = clear_list + ' pixel-ratio__1_75'; + } } else { $root.addClass('pixel-ratio__2'); - $root.removeClass('pixel-ratio__1_5'); + if ( !/pixel-ratio__2/.test(classes) ) { + document.body.className = clear_list + ' pixel-ratio__2'; + } } me.zoom = scale.correct ? scale.zoom : 1;