From: Wolfram Schneider Date: Mon, 1 Jul 2013 13:29:53 +0000 (+0000) Subject: refactor responsive web design X-Git-Tag: 0.9.1~396^2~1 X-Git-Url: http://git.indexdata.com/?p=mkws-moved-to-github.git;a=commitdiff_plain;h=3dafb677571fbbbca5e2121c269161ca5aee47cf refactor responsive web design --- diff --git a/experiments/spclient/index-mobile.html b/experiments/spclient/index-mobile.html index 201745a..b1821b7 100644 --- a/experiments/spclient/index-mobile.html +++ b/experiments/spclient/index-mobile.html @@ -7,61 +7,25 @@ MKWS demo client - - @@ -75,7 +39,7 @@ diff --git a/experiments/spclient/mkws.js b/experiments/spclient/mkws.js index d168a34..5dfe32e 100644 --- a/experiments/spclient/mkws.js +++ b/experiments/spclient/mkws.js @@ -560,15 +560,35 @@ function mkws_html_all(config) { '); mkws_html_switch(config); + if (mkws_config.use_service_proxy) mkws_service_proxy_auth(config.service_proxy_auth); + if (mkws_config.responsive_design) + mkws_responsive_design(); + domReady(); // on first page, hide the termlist $(document).ready(function() { $("#termlist").parent().hide(); } ); } +/* Responsive web design - change layout on the fly depending on + * the current screen size width/height. Required for mobile devices. + */ +function mkws_responsive_design () { + var timeout = null; + + $(window).resize( function(e) { + if (timeout) + clearTimeout(timeout); + timeout = setTimeout(function () { mkws_mobile_resize() }, 100); + }); + + // initial check after page load + $(document).ready(function() { mkws_mobile_resize() }); +} + function mkws_set_lang(mkws_config) { var lang = jQuery.parseQuerystring().lang || mkws_config.lang || ""; if (!lang || !mkws_locale_lang[lang]) { @@ -713,6 +733,29 @@ function mkws_html_lang(mkws_config) { $("#mkwsLang").html(data); } +function mkws_mobile_resize () { + debug("resize width: " + $(window).height() + ", width: " + $(window).width()); + var list = ["mkwsSwitch"]; + var obj; + // alert($(window).width()); + + if ($(window).width() <= 980) { + for(var i = 0; i < list.length; i++) { + $("#" + list[i]).hide(); + } + + $("#termlist").parent().hide(); + obj = $("#termlist").parent().html(); + $("#mkwsTermlist").html("
" + obj); + } else { + for(var i = 0; i < list.length; i++) { + $("#" + list[i]).show(); + } + $("#termlist").parent().show(); + $("#mkwsTermlist").html(""); + } +}; + /* locale */ function M(word) { var lang = mkws_config.lang;