Поиск по этому блогу

четверг, 10 октября 2013 г.

Справочник полезных рецептов для JavaScript


1. iScroll disable native vertical scroll 
Популярная JavaScript библиотека для скроллинга iScroll4 http://cubiq.org/iscroll-4 позволяет создавать прокручивающиеся экраны в том числе и на мобильных устройствах. Возникает одна проблема - блокируется нативный скрол по вертикали. Для того, чтобы нативный вертикальный скроллинг снова стал работать нужно сделать следующее - в конструкторе scroll объекта переопределить метод onBeforeScrollMove .
screen_scroller = new iScroll('content-scroll-wrapper', {
  snap: true,
  momentum: false,
  hScrollbar: false,
  vScrollbar: false,
  hScroll: true,
  vScroll: false,
  // здесь другие методы                  
  onBeforeScrollStart: function ( e ) {
    if ( this.absDistX > (this.absDistY + 5 ) ) {
      // user is scrolling the x axis, so prevent the browsers' native scrolling
      e.preventDefault();
    }
  }
});

Справочник полезных рецептов для jQuery


1. Как установить атрибут стиля по id.  (jquery set style attribute by id)

Есть кнопка у которой есть id (id = "invite_more"). Кнопке задан стиль с атрибутом display и значением этого атрибута равным none. Необходимо периодически менять значение этого атрибута.
<a id="invite_more" data-role="button" data-theme="c" 
data-inline="false" style="display: none">
Invite more friends</a>

Поменять значение атрибута стиля элемента с определенным id можно с помощью следующей конструкции.
$('#invite_more').css({ "display": 'block'});

2. Как загрузить содержимое HTML-файла в div (jquery load html into div) 

Есть div которому задан класс. В этот div необходимо загрузить HTML из другого файла.
<div class="played_players_vertical_component">

Для это необходимо воспользоваться функцией jquery - .load("имя файла"). Тут мы сначала находим наш div по его классу, а потом загружаем в него содержимое HTML-файла.
$(".played_players_vertical_component")
  .load("components/played_players_vertical.html");

четверг, 22 августа 2013 г.

Валидация с помощью регулярного выражения для плагина jquery.validate

Плагин для валидации полей ввода jQuery Validate не позволяет использовать регулярные выражения для проверки корректности ввода. Поэтому для того чтобы проверить введенный пользователем текст с помощью регулярного выражения необходимо сделать следующее.

1. Добавить метод для валидации, который будет проверять на соответствие регулярному выражению

jQuery.validator.addMethod(
    'regexp',
    function(value, element, regexp) {
        var re = new RegExp(regexp);
        return this.optional(element) || re.test(value);
    },
    "Please check your input." 
); 

2. После чего использовать добавленный метод следующим образом

$('#form').validate({
  rules: {
    reg_password: {
      required: true,
      minlength: 6,
      regexp: '^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'
    },
    ...
  },
  messages: {
    reg_password: {
      regexp: 'Пароль должен содержать 
        как минимум один числовой символ один буквенный символ'
    }
    ...
  }
});

Regex with at least 1 number and 1 character

Регулярное выражение, которое, например, может подойти для проверки сложности пароля. Такое выражение требует, чтобы пароль содержал как минимум один буквенный символ и один цифровой символ.

'^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'

понедельник, 19 августа 2013 г.

html5 круговой индикатор процесса

Круговой индикатор процесса который показывает процент заполнения. Установлен интервал в 42 секунды. Данный код можно просто скопировать и вставить себе в html документ, все будет работать.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script
 src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"
 type="text/javascript"></script>
<style>
.timer {
 position: relative;
 font-size: 200px;
 width: 1em;
 height: 1em;
 float: left;
}
 
.timer>.percent {
 position: absolute;
 top: 1.05em;
 left: 0;
 width: 3.33em;
 font-size: 0.3em;
 text-align: center;
}
 
.timer>#slice {
 position: absolute;
 width: 1em;
 height: 1em;
 clip: rect(0px, 1em, 1em, 0.5em);
}
 
.timer>#slice.gt50 {
 clip: rect(auto, auto, auto, auto);
}
 
.timer>#slice>.pie {
 border: 0.1em solid #c0c0c0;
 position: absolute;
 width: 0.8em; /* 1 - (2 * border width) */
 height: 0.8em; /* 1 - (2 * border width) */
 clip: rect(0em, 0.5em, 1em, 0em);
 -moz-border-radius: 0.5em;
 -webkit-border-radius: 0.5em;
 border-radius: 0.5em;
}
 
.timer>#slice>.pie.fill {
 -moz-transform: rotate(180deg) !important;
 -webkit-transform: rotate(180deg) !important;
 -o-transform: rotate(180deg) !important;
 transform: rotate(180deg) !important;
}
 
.timer.fill>.percent {
 display: none;
}
 
.timer.fill>#slice>.pie {
 border: transparent;
 background-color: #c0c0c0;
 width: 1em;
 height: 1em;
}
</style>
<script type="text/javascript">
 var timer;
 var timerCurrent;
 var timerFinish;
 var timerSeconds;
 function drawTimer(percent){
  $('div.timer').html(
          '<div class="percent"></div><div id="slice"'+
   (percent > 50?' class="gt50"':'')+
   '><div class="pie"></div>'+
   (percent > 50?'<div class="pie fill"></div>':'')+'</div>');
  var deg = 360/100*percent;
  $('#slice .pie').css({
   '-moz-transform':'rotate('+deg+'deg)',
   '-webkit-transform':'rotate('+deg+'deg)',
   '-o-transform':'rotate('+deg+'deg)',
   'transform':'rotate('+deg+'deg)'
  });
  $('.percent').html(Math.round(percent)+'%');
 }
 function stopWatch(){
  var seconds = (timerFinish-(new Date().getTime()))/1000;
  if(seconds <= 0){
   drawTimer(100);
   clearInterval(timer);
  }else{
   var percent = 100-((seconds/timerSeconds)*100);
   drawTimer(percent);
  }
 }
    $(document).ready(function(){    
  timerSeconds = 42;
  timerCurrent = 0;
  timerFinish = new Date().getTime()+(timerSeconds*1000);
  timer = setInterval('stopWatch()',50);  
 });
</script>
</head>
<body>
 <div class="timer">
</body>
</html>


воскресенье, 14 июля 2013 г.

Вопросы на собеседовании Java программиста. Разница между final, finally и finalize()

final


final - это ключевое слово в Java

Переменная, обозначенная как final, инициализируется один раз и не может быть изменена. 

//переменная не может быть изменена
private final String str = "HELLO";  

Java класс объявленный как final не может быть унаследован (расширен). То есть класс не может иметь дочерних классов (классов наследников). 

public final class A {...}
// Не поддерживается
public class B extends A{...} 

Метод, объявленный как final не может быть переопределен. 

public final String toString() {  return "NULL"; }

finally


finally - это блок. Блок finally необязательный и используется совместно с блоком try/catch. Блок finally гарантированно всегда выполняется внезависимости от того было выброшено исключение в блок try или нет. Но блок finally полезен не только для обработки исключений, finally может быть использован для закрытия файлов или для освобождения других системных ресурсов таких, как соединения с базой данных. 

FileReader reader = null;
try {
  reader = new FileReader("someFile");
  //какие то вычисления или задачи    
} catch (IOException e) {
  //ловим исключение 
} finally {
  //выполнится всегда даже если случится исключение или ошибка
  reader.close();
}

finalize()


finalize() - это метод. finalize()  вызывается перед тем, как объект будет уничтожен сборщиком мусора. Вам вряд ли придется переопределять его.




понедельник, 1 июля 2013 г.

GAE MailService

Задача отправки писем на email зарегистрированным пользователем из приложения, которое работает на Google App Engine (GAE). Для реализации этой задачи нам понадобиться использовать следующие средства:

  • Шаблонизатор Freemaker для создания шаблона письма
  • QueueFactory для получения очереди задач и добавления в эту очередь задачи отправки письма
  • DeferredTask интерфейс будет реализовывать класс задачи которая будет отпарлять пиьсмо, для того чтобы мы могли добавить эту задачи в очередь
  • GAE MailService для создания и отправки письма

воскресенье, 9 июня 2013 г.

Отправка Push Notifications на iOS с Google App Engine при помощи библиотеки java-apns

Задача отправки уведомлений (Push Notifications) на iOS-устройства (iPhone, iPad и iPod Touch)
Наше web-приложение работает на сервере Google App Engine (GAE). До версии GAE 1.7.7 отправка уведомлений на iOS было проблемой, потому что оно осуществляется через сокеты которые стали доступны только с версии 1.7.7 .  Теперь можно отправлять используя сокеты. Для отправки необходимо подключить к проекту библиотеку java-apns (библиотека доступна на github https://github.com/notnoop/java-apns)

Maven dependency для подключения библиотеки к проекту
https://github.com/notnoop/java-apns/wiki/Installation
http://mvnrepository.com/artifact/com.notnoop.apns/apns/0.2.3

Для реализации отправки уведомлений на iOS необходимо сделать следующее 

1. Метод, который будет регистрировать iOS устройство
2. Метод, который будет удалять регистрационную ифнормацию об iOS-устройстве
3. Метод, который будет отправлять push notifications на мобильное устройство

вторник, 28 мая 2013 г.

Apache POI + Google App Engine + MS Excel generate files and send to user

В проекте понадобилось разработать метод, который собирал бы пользователей из базы и формировал файл Microsoft Excel и посылал его пользователю. Так как система работает на Google App Engine, то возникли некоторые трудности при отправке сформированного excel файла, так как на GAE не поддерживаются некоторые классы из java.io. Для формирования excel-файла был выбран фреймвор Apache POI. В этом посте я хочу написать о том, как написать REST-метод, который будет, используя библиотеку Apache POI, формировать excel-файл и отправлять его пользователю.

воскресенье, 26 мая 2013 г.

Java get tomorrow date


В тестовом методе понадобилось создавать объекты с датой, установленной на следующий день. Как в java получить завтрашнюю дату. Для этого необходимо использовать класс Calendar и его специальный метод add, который добавляет к установленной дате определенное количество дней (месяцев или лет )