jQuery. How to lock screen while loading

Для того, чтобы в jQuery заблокировать экран, например, пока выполняется какая-то логика или загружаются данные с сервера, можно использовать специальный плагин

jQuery Block UI

Заблокировать страницу

$.blockUI();

Разблокировать страницу

$.unblockUI();

Помимо это есть варианты блокировки с опциями (затенение экрана и добавление текста)

Если этот плагин используется в связке с библиотекой require.js, тогда его подключать нужно так

requirejs.config({
    "baseUrl": "js/lib",
    paths: {
        'jquery': ['jquery-1.9.1.min'],
        'jquery-mobile': ['jquery.mobile-1.3.2.min'],
        'iscroll': ['iscroll'],
        'iscroll-lite': ['iscroll-lite'],
        'jquery-form': ["jquery.form"],
        'jquery-validity': ["jquery.validity.min"],
        'jquery-blockui':["jquery.blockUI"],
 
 ...
 
        'facebook-helper': ['../helper/facebook-helper'],
        "components": ["../components"]
    },
    shim: {
        'jquery-mobile': ['jquery'],
        'jquery-form': ["jquery"],
        'jquery-validity': ["jquery"],
        'jquery-blockui':["jquery"]
    }
 
});

Теперь пример, тут вызывается серверный POST-метод и пока мы ждем ответа от сервера, мы блокируем экран, а когда получаем ответ разблокируем его.

define(["jquery", "jquery-blockui"], function ($, settings) {
    var apiClient = {
 
        callPost: function (methodName, requestData, callback) {
            require(['utils'], function (utils) {
                console.info("Call server method: name='" + 
                methodName + "' requestData='" + 
                requestData + "' apiUrl='" + settings.apiUrl + "'");
                $.blockUI({ css: {
                    border: 'none',
                    padding: '15px',
                    backgroundColor: '#000',
                    '-webkit-border-radius': '10px',
                    '-moz-border-radius': '10px',
                    opacity: .5,
                    color: '#fff'
                } });
                $.ajax({url: settings.apiUrl + methodName, type: "post", 
                  data: requestData, success: function (data) {
 
                        if (data.serviceData && data.serviceData.error) {
                            $(document).ajaxStop($.unblockUI);
                            console.warn(data.serviceData.message);
                            utils.popup(data.serviceData.message)
                            // some logic invoke
                        } else {
                            callback(data);
                            utils.hideLoading();
                            $(document).ajaxStop($.unblockUI);
                        }
                    }, error: function (jqXHR, textStatus, errorThrown) {
                        $(document).ajaxStop($.unblockUI);
                        utils.popup("Oops...an error occurred. 
                          Please try again in a few seconds.");
                        console.info("Error:" + textStatus);
                        console.info("Error:" + errorThrown);
                    },
                        contentType: "application/json"
                    }
                )
            });
        }
 
...
 
});

Блокируем экран с затемнением

$.blockUI({ 
  css: {
    border: 'none',
    padding: '15px',
    backgroundColor: '#000',
    '-webkit-border-radius': '10px',
    '-moz-border-radius': '10px',
    opacity: .5,
    color: '#fff'
  } 
});

Разблокируем экран

$(document).ajaxStop($.unblockUI);

jQuery. How to handle page refresh

Для того, чтобы в jQuery обработать событие обновления страницы необходимо сделать следующее.

$(window).bind('beforeunload',function(){
 
  //Your logic here
 
  return 'Are you sure you want to leave?';
 
});

Работающий пример

NYRBY - будь в курсе!

На днях поставил себе новое приложение – NYRBY. Ребята разработчики на странице приложения (ссылка - https://play.google.com/store/apps/details?id=com.nyrby&hl=ru) пишут, что оно умное. Решил проверить, кто умнее )

Завел себе аккаунт, добавил пару друзей.

 

Так вот, нирби за один день узнало, где я живу, и начала мне показывать новости от моих соседей!

Магия одним словом )

Посмотрим, что будет дальше. 

Google Guava Splitter Example

Разобрать строку в GWT можно с помощью библиотеки Guava. Вот пример как это сделать.

Описание библиотеки на Wikipedia

Скачать библиотеку Guava

Пример использования Guava

String str = "This;is test;string with;semicolons";
Iterable<String> result = Splitter.on(";").trimResults() 
    .omitEmptyStrings() 
    .split(str); 
StringBuilder sb = new StringBuilder(); 
for (String s : result) { 
  sb.append(s + "\n"); 
} 
System.out.print(sb.toString()); 

Результат работы