Замещения у 9-1, 10-1, 11-1 зимой 2016/2017

Игры

Wed, 15 Mar 2017 09:00:00 +0000

Вариации задания про FlabbyBird:

Другие игры учеников 239:

Волейбол (управление: Z, X, C и B, N, M)

Мини-задание 52. Flabby bird (дополнения)

Wed, 15 Mar 2017 09:00:00 +0000

Примеры

Несколько примеров:

Ниже предложены некоторые идеи для развития Задания 52.

Картинка вместо эллипса

Например окружность-птицу можно заменить на картинку. Можно взять любую, например одну из этих двух (осторожно! простой выбор!):

И теперь вместо отрисовки эллипса методом ellipse(...) вам надо делать по аналогии с этим примером. Обратите внимание, что вместо assets/moonwalk.jpg вам надо указать путь к картинке. В частности вы можете указать адрес одной из этих двух картинок (например http://polarnick239.github.io/static/flabby_bird/unicorn.png или то же самое, но с bird.png на конце, но давайте не будем строить иллюзий по поводу идеальности ровно одной картинки из этих двух).

Наклонять Единорога

Если в данный момент скорость направлена вниз - то игровой персонаж должен быть наклонен соответствующе (по часовой стрелке), если вверх - то наоборот. Соответственно можно рисовать картинку персонажа повернутой пропорционально текущей вертикальной скорости.

Рестарт игры

Если игрок врезался в стену - разумно показать очки игрока и потом начать игру заново, но уже хорошо будет, если просто игра начнется с начала. Обратите внимание что делать перезапуск игры очень просто. Ведь по сути текущее состояние игры определяется значениями глобальных переменных, которые вы выставляете в некоторые изначальные значения (например в setup или просто в место объявления переменной) и обновляете при каждом обновлении кадра.

Соответственно чтобы начать игру заново достаточно все значения глобальных переменных выставить обратно в значения которые были изначально.

Поддержка нескольких стен

Сделайте так, чтобы набегала не одна стена, а хотя бы две (а еще лучше - чтобы их число могло быть произвольным).

Смена времени суток

Достаточно циклически плавно менять цвет фона между темным и светлым, добавить туда ночную луну/звезды/солнце - и будет вполне реалистичная смена суток!

Мини-задание 239: brainfuck

Tue, 14 Mar 2017 09:00:00 +0000

Brainfuck - эзотерический язык программирования. Он не используется как удобный инструмент решения практических задач (ввиду своей неудобности и непрактичности), но решать простые задачи на нем может быть интересно и полезно - так же как решать любую головоломку. К тому же brainfuck является наглядным примером тьюринг-полного языка.

Описание и синтаксис

В этом языке нет переменных и функций, модель языка гораздо проще:

Есть большой массив 8-битных значений (т.е. каждый элемент от 0 до 255) - так называемая лента памяти. Есть указатель на ячейку памяти. При запуске программы он указывает на первую ячейку. Значения всех ячеек в момент запуска программы равны нулю.

Команды языка brainfuck:

> - сдвинуть указатель ячейки памяти вправо к следующей ячейке
< - сдвинуть указатель ячейки памяти влево к предыдущей ячейке
+ - увеличить значение текущей ячейки на 1
- - уменьшить значение текущей ячейки на 1
. - напечатать символ из текущей ячейки в соответствии с ASCII-таблицей
, - считать в текущую ячейку символ из консоли
[ - если значение текущей ячейки ноль, то перейти вперёд по тексту программы на команду, следующую за соответствующей ], иначе продолжить исполнение
] - если значение текущей ячейки не ноль, то вернуться назад на команду, следующую за соответствующей [, иначе продолжить исполнение

Интерпретаторы

Интерпретатор написать очень просто, их существует очень много. Например есть интерпретатор с визуализацией доступный из браузера. Или другой интепретатор тоже из браузера, но этот вычисляет быстро. Есть также интепретатор который требует установки, но обладает расширенным функционалом.

Как с этим жить

Давайте подумаем как напечатать тривиальный Hello world.

Для начала нам надо руководствуясь ASCII-таблицей понять, какие это символы в представлении ASCII-кодов:

Hello world = 72, 101, 108, 108, 111, 32, 119, 111, 114, 108, 100

P.S. Это можно делать не обязательно глазами и руками, а например с помощью онлайн-конвертера

Можно было бы напечатать огромное число операций + (и небольшое количество .) и напечатать заветный Hello world, но можно воспользоваться умножением и циклами:

                // H = 72 = 9*8
                // Давайте в первой ячейке положим число 9
+++++++++
[               // Этот блок кода будет выполняться пока в текущей ячейке не ноль (в данном случае текущая = первая)

                // И будем 9 раз увеличивать вторую ячейку на 8
                // Тогда во второй ячейке окажется 72 а это та буква которая нам нужна

    >           // Переходим ко второй ячейке
    ++++++++    // Увеличиваем ее на 8
    <           // Возвращаемся к первой ячейке
    -           // Уменьшаем ее на единицу ведь еще одна итерация прошла успешно
]
                // Раз мы пришли сюда значит цикл исполнился 9 раз значит во второй ячейке лежит 72 проверяем:
>               // Переходим ко второй ячейке
.               // Выводим символ

                // Дальше в том же духе

Заметим, что можно сэкономить, ведь при переходе от буквы e к l (т.е. от 101 к 108) достаточно увеличить значение всего лишь на 7, а третья и четвертая буквы совпадают.

Еще несколько примеров:

[-]             // Зануляет текущую ячейку

[->+<]          // Сдвигает переменную в соседнюю ячейку

[->+>+<<]
>>[-<<+>>]<<    // Копирует ячейку в сосденюю

[. [-]]         // Выводит текущую ячейку, если она не ноль (обратите внимание, что если ее не занулить, или не сдвинуть вместо этого указатель - то этот цикл зависнет)

Упражнение 1

Условие: Выведите Hello world

Упражнение 2

Условие: Выведите английский алфавит (заглавные буквы): ABCDEFGHIJKLMNOPQRSTUVWXYZ

Комментарии:

Обратите внимание, что английские буквы в ASCII-таблице - символы от 65 до 90 (26 символов).
Попробуйте минимизировать число инструкций (онлайн счетовод символов, пробелы в исходном коде за символы не считаются)
Посоревнуйтесь с друзьями у кого программа короче (у меня заняло 38 инструкций: ++++++++[->++++++++>+++<<]>+>++[<.+>-])

Упражнение 3

Условие: Пользователь вводит два символа - выведите наименьший

Комментарии:

Пример выводящий второй введенный символ: ,>,.
Пример выводящий первый введенный символ: ,>,<.
Придумайте сначала как сделать операцию Если текущая ячейка x == 0, то делаем А
Спойлер про предыдущий комментарий: пусть справа от текущей лежат 0 1 0, тогда подумайте что сделает инструкция [>]>>, заметьте что в случае если изначальная клетка была ноль, то указатель теперь на единице, если же изначально был не ноль - то теперь указатель на нуле
Спойлер2 итого чтобы сделать предложенную в комментарии выше операцию надо положить справа от текущей ячейки 0 1 0 и выполнить код [>]>> [ A ]

Упражнение 4

Условие: Пользователь вводит буквы одну за другой, пока не введет символ точки (код 46). Выведите введенные символы в алфавитном порядке (с повторениями)

Комментарии:

Попробуйте алгоритм ищем максимум, поднимаем его вверх или делаем n^2 сравнений соседей, если они в неправильном порядке - swap между собой или сортировкой подсчетом
Поймите сколько вам нужно было бы переменных, и оставьте между хранящамися на ленте символами зазор в столько ячеек, сколько вам нужно переменных
Пока вы будете реализовывать - постоянно будет оказываться что зазор надо было брать больше, так что удобнее брать зазор с запасом :)

Отправка решения

Если вы сделали второе/третье/четвертое упражнение, то можете отправить мне ваше решение письмом:

Пример темы письма: Brainfuck 16-1 Полярный Николай Упражнение 4 (в конце темы номер самого сложного упражнения, которое вы осилили)
Если ваше решение короче лучшего на данный момент - ваше решение будет выложено ниже
Исходный код можно прилагать либо файлом, либо прямо в тексте письма (желательно хоть как-то форматированный)

Лучшие результаты:

Ниже приведены самые короткие решения. (считаются только символы являющиеся корректными инструкциями, онлайн счетовод символов, интерпретатор, подобные задачки решают на codegolf)

P.S. По клику появляется исходный код

Упражнение 1 (Hello World)

Рекорды:

131 символов (11-1 Думпис Сергей)

+++++ ++++
[
>
+++++ +++
<
-
]
>
.
[-]
<
+++++ +++++
[
>
+++++ +++++
<
-
]
> + .
+++++ ++ . . 
+++ .

> >
+++++ +++
[ > ++++ < -]
> .
<<<

+++++ +++ .
----- ---.
+++.
----- -.
----- --- .

Упражнение 2 (Алфавит)

Рекорды:

35 символов: +++++++++++++[>++>+++++<<-]>[>.+<-] (11-1 Вирачев Арсений)
36 символов: +++++++++++++[>+++++>++<<-]>>[<.+>-] (10-1 Олейник Иван)
36 символов: +++[>++++<-]>+[>++>+++++<<-]>[>.+<-] (11-1 Думпис Сергей)

Упражнение 3 (Минимум)

Рекорды:

33 символов (11-1 Кохась Дмитрий)

+>>>,>,<<<<[>>>->->+>+[<]<<]>>>>.

155 символов (11-1 Вирачев Арсений)

+>>+>
,
[
   >+>+<<-
]

>>>>+
>

,
[
   >+>+<<-
]
>>>>+

<<<<<<<<<<<<
[
  >>>>>
  [>]>>[
    <<<.<<<<->>>>>>>
  >]
  <<<<<<<<
  -
  [>]>>[
    >>>>>>>>
    [>]>>[
      <<<.<<<<<<<<<->>>>>>>>>>>>
    >]
    <<<
    -
    <<<<<
    -
    <<<
  >]
  <<<
  +
]

Упражнение 4 (Сортировка)

116 символов (10-1 Олейник Иван)

>>,[>>,]<<
[
[<<]>>>>
[<<
[>+<<+>-]>>
[>+<<<<[->]>[<]>>-]<<<
[[-]>>[>+<-]>>[<<<+>>>-]]>>
[[<+>-]>>]<
]<<
[>>+<<-]<<
]>>>>
[.>>]

3092 символа!!! С комментариями!!! (11-1 Вирачев Арсений)

//формат глобально такой: 
//Адрес 0: 1 если надо сделать ещё итерацию(и) вычитания единицы
//1) Дальше много фблоков вида
//2) (флаг начала/конца массива (0=начало/конец))010
//3) число
//4) (число для уменьшения)010
//5) (флаг вывода числа (1=выведено))010
//6) (вспомогательный флаг)010

//В самом конце вводим точку (46) и устанавливаем для неё флаг вывода в 1 и флаг конца в 0

+> //записываем в первую ячейку 1 (это нужно потом)
>>+ //делаем нулевой фиктивный блок 0010 0 0010 1010 0010
>>>>>+
>>+ //флаг вывода = 1
>>+
>>>>+
>>

//вводим остальные числа

+ //1 в начале блока
[
  >>+>
  ,
  [ //делаем 1010aaa
    >+>+>+
    <<<-
  ]
  >>>
  //вычитаем 46=7*7 минус 3 из последней a
  >+++++++
  [
    -
    <-------
    >
  ]
  <+++
  //делаем 1010aa(a минус 46)010
  >>+
  >>>>>>>>>+<<<<<<<<<<< //пихаем 1 в начало следующего блока
  [>]>>[ //если a=46
    >>>>>>>>>->>+<< <<<<<<<<< //пихаем 0010 в начало следующего блока
    <<<<<<<<- //делаем флаг конца=0
    >>>>>>>>
  >]
  <<<
  [-] //обнуляем место где было a минус 46
  >+
  >-
  >>>+
  >>>>+
  >> //перешли в начало следующего блока
]
<<<<<<<<+ //устанавливаем флаг вывода последнего символа (точки) в 

1
<<<<<<<<< //в начало последнего (фиктивного) блока
<<<<<<<<<<<<<<<<< //17 назад (начало последнего блока)

//теперь осталось посортить :)

[ //возвращаемся к нулевому блоку
  <<<<<<<<<<<<<<<<< //17 назад (начало предыдущего блока)
]
< //адрес=0 (там лежит 1)

[
  > //в начало нулевого блока
  >>>>>>>>>>>>>>>>> //в начало первого блока
  [ //цикла пока не дойдём до последнего блока
    >>>>>
    [>]>>[ //если текущее уменьшенное число = 0
      >>
      [>]>>[ //если флаг вывода = 0
        <<<<<<<. //выводим
        >>>>>+ //флаг вывода = 1
        >>
      >]
      <<<<<
    >]
    >
    [>]>>[ //если флаг вывода = 0
      <<<<<<- //уменьшаем
      >>>>>>>>+ //вспомогательные флаг = 1
      <<
    >]
    >>>>> //в начало следующего блока
  ]
  <<<<<<<<<<<<<<<<< //17 назад (начало последнего блока)
  [
    >>>>>>>>>>>>>>>>> //17 вперёд
    -
    [>]>>[ //если есть следующий блок (не фиктивный)
      >>>>>>>>>>> //вспомогательный флаг следующего блока
      [ //обнуляем этот флаг если он не = 0
        -
        <<<<<<<<<<<<<<<<< //17 назад (вспомогательный флаг данного 

блока)
        [>]>>[ //если он = 0
          <<+ //устанавливаем его
          >>
        >]
        >>>>>>>>>>>>>> //17 минус 3 вперёд
      ]
      <<<<<<<<<<<
    >]
    <<<+
    
    <<<<<<<<<<<<<<<<< //17 назад (начало данного блока)
    <<<<<<<<<<<<<<<<< //17 назад (начало предыдущего блока)
  ]
  //мы в начале нулевого блока
  //в вспомогательном флаге первого блока сейчас логическое ИЛИ
  //всех вспомогательных флагов
  //остальные вспомогательные флаги равны 0 
  
  <-> //обнуляем нулевую ячейку

  >>>>>>>>>>>>>>>>> //17 вперёд
  >>>>>>>>>>>>> //вспомогательный флаг первого блока
  [ //если там 1
    <<<<<<<<<<<<< //возвращаемся к адресу 0
    <<<<<<<<<<<<<<<<< //17 назад 
    <+ //ставим туда 1
    > //теперь опять обратно
    >>>>>>>>>>>>>>>>> //17 вперёд
    >>>>>>>>>>>>> //вспомогательный флаг первого блока
    - //обнуляем его
  ]
  <<<<<<<<<<<<< //начало первого блока
  <<<<<<<<<<<<<<<<< //17 назад 
  < //возвращаемся к адресу 0
]

Тутор: упаковка программы

Mon, 13 Mar 2017 09:00:00 +0000

Может быть желательно запаковать программу в один файл так, чтобы программа работала по двойному клику мышки. Это нужно например в случае когда вы сделали игру/программу и захотели поделиться ею с друзьями. А т.к. им может быть неудобно/долго/сложно компилировать программу самим, то хочется отправлять уже готовое приложение.

В общем случае в реальном мире это делается относительно сложно с помощью сборочных инструментов вроде Ant, Maven или Gradle. Но нам подойдет и более простой способ - с помощью встроенной в Intellij IDEA функциональности.

0) Нужен готовый проект

Для того чтобы было что запаковывать в приложение нужен проект открытый в Intellij IDEA, который можно запустить. Т.е. в этом проекте есть main функция, которая будет являться точкой входа в приложение, т.е. будет запускаться в момент двойного клика по запакованной программе.

Дальше будет предполагаться что класс в котором определена желаемая main функция называется Monoceros.

1) Настройка упаковки в пакет

File->Project Struture->Artifacts
Зеленый плюсик сверху-слева -> JAR -> From modules with dependencies...
Справа от Main Class нажав на три точки нужно выбрать класс Monoceros
Убедиться, что выбран вариант extract to the target JAR
Нажать Ok
Еще раз нажать Ok

2) Компиляция пакета

Теперь можно собирать пакет приложения:

Build -> Build Artifacts...
Выбираете нужный артефакт, и жмете Build

Теперь в подпапке проекта out/artifacts/<ArtifactName>_jar/ лежит упакованный jar файл. Его можно запустить на любом компьютере, на котором установлена Java-машина (она же JVM, она же JRE).

3) Запуск jar-пакета

Двойного клика должно быть достаточно. Но зависит от операционной системы, так что если не будет работать на вашей - напишите мне.

4) Если несколько main-функций

Есть несколько вариантов что делать, если у вас есть несколько main-функций. По сути это означает что у вас есть несколько программ. Например сервер и клиент. Самый простой вариант - выполнить эту инструкцию два раза для каждого класса, в котором есть main-функция, тогда будет несколько jar-пакетов.

Если вдруг не запускается

Запустите терминал (как это сделать - гуглится по windows N how to run command prompt, где N - ваша версия ОС). Вероятно почти везде сработает открыть главное меню (пуск или меню-плитка), там запустить программу Выполнить, в ней ввести cmd и нажать Enter.

В появившемся черном текстовом окне перейдите в папку где находится <ArtifactName>.jar:

Например если файл находится по пути C:\A\B\C\<ArtifactName>.jar то надо выполнить две команды:

C:
cd A\B\C

Теперь надо запустить явным образом jar-файл (то же самое происходит при двойном клике):

java -jar <ArtifactName>.jar

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

Преимущество явного запуска из консоли в том, что ошибки приложения будут видны в консоли (аналогично тому, как они были видны в консоли среды разработки).

Мини-задание 52. Flabby bird

Wed, 08 Mar 2017 09:00:00 +0000

В этом мини-задании будет реализована игра Flabby bird на базе библиотеки из задания про фракталы.

Должна получиться игра аналогичная этой.

Предполагается, что перед этим заданием было выполнено и полностью понято задание про фракталы.

1) Обновление состояния

Тривиальная заготовка с фоном цвета неба и линией нарисованной по центру под углом:

function setup() {
    createCanvas(640, 480);     // Указываем размер холста
    background(54, 187, 205);   // Указываем цвет фона
}

function draw() {
    translate(320, 240);        // Смещаем центр системы координат в центр экрана
    rotate(PI/6);               // Поворачиваем систему координат вокруг ее текущей точки отсчета
    line(-50, 0, 50, 0);        // Рисуем линию в текущей системе координат
}

Игра предполагает что птица летит, а значит требуется обновлять состояние мира с некоторой периодичностью. В используемой библиотеке есть функция frameRate(N); с единственным аргументом - желаемое число кадров в секунду. Ее вызов на этапе настройки игры (внутри функции setup) приведет к тому, что draw будет вызываться в секунду столько раз, сколько сказано в вызове функции frameRate.

Чтобы проверить это предлагается вращать линию в центре холста. Для увеличения угла наклона от отрисовки к отрисовке потребуется глобальная переменная:

var angle = 0;

function draw() {
    ...
    angle = angle + PI/30;
    rotate(angle);
    ...
}

P.S. альтернативный пример обновления состояния.

Чтобы очищать экран от отрисовки к отрисовке - надо перенести вызов background из функции setup (которая вызывается один раз при запуске программы) в функцию draw.

Теперь отрезок вращается.

2) Состояние и отрисовка птички

Птица немного сложнее вращающегося отрезка. Подумаем из чего состоит описание состояния птицы:

Высота положения птицы
Вертикальная скорость птицы

Еще для определения гравитации потребуется константа ускорения свободного падения:

var birdHeight = 240.0;
var birdVerticalSpeed = 0.0;

var gravityAcceleration = 1.0;

Создайте функцию отрисовки положения птицы drawBird, которая на основе значения birdHeight нарисует круг (что-то вроде ellipse(0, 0, 20, 20);), который представляет нашу условную птицу. И вызовите эту функцию из функции draw.

3) Управление птицей

Хочется как-то управлять происходящим - нажатием кнопки/мышки придавать птице толчек вверх.

В документации обработка нажатия кнопок описана здесь.

Достаточно наряду с setup() и draw() реализовать функцию обработки нажатия кнопки keyPressed():

function keyPressed() {
    var spaceKeyCode = 32;          // Это кодовое число соответствующее кнопке пробел
    if (keyCode === spaceKeyCode) { // Есть специальная переменная keyCode, в которой хранится код нажатой кнопки. Пусть птица поднимается выше только когда нажимается пробел
        birdHeight -= 10;           // Выше птица - меньше координата, т.к. в системе координат графики y-ось направлена вниз
    }
}

Но заметим, что на самом деле положение птицы в этой функции мы не должны менять. Обновление положения происходит с каждым кадром, поэтому давайте заведем функцию updateBird() и будем вызывать ее при каждом выполнении draw:

function updateBird() {
    birdHeight = birdHeight + birdVerticalSpeed;
    birdVerticalSpeed += gravityAcceleration;
}

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

Чем же мы управляем, если не высотой птицы? Нажатие пробела должно приводить к “толчку” птицы вверх, птица начинает лететь вверх когда ее скорость направлена вверх. Т.е. нажатие пробела должно влиять на значение birdVerticalSpeed.

4) Препятствия

Надо сделать так, чтобы одна за другой справа набегали стены с дырами. Для упрощения реализуем сначала так, чтобы на экране была видна ровно одна стена.

Она описывается:

Размер дыры в стене, в которую хочет проскочить птица
Высота дыры в стене
Координата стены по x-оси

Заводим для этих параметров аналогично описанию птицы глобальные переменные (вида var someName = 239;).

Теперь надо реализовать отрисовку стены в функции drawWall():

Воспользуемся функцией rect(fromX, fromY, width, height). Первые два аргумента - координаты начала прямоугольника. Последние два аргумента - знаковые ширина и высота прямоугольника. Т.е. указав положительную высоту прямоугольник будет рисоваться “вниз” от начальных координат (т.к. система координат так ориентирована), указав же отрицательную высоту - прямоугольник будет рисоваться “вверх” от начальных координат.

P.S. Чтобы не смешать изменения системы координат отрисовки птицы и отрисовки стены пригодятся push() и pop() использованные в прошлом задании.

Итак рисование стены было сделано. Теперь необходимо двигать стену. Для этого надо реализовать updateWall(), который будет уменьшать координату стены по x-оси, но кроме этого: когда стена пройдет весь экран необходимо создать новую случайную стену.

Чтобы создать новую случайную стену полезен вызов Math.random(), который вернет случайное число от 0.0 до 1.0.

Итого updateWall() принимает приблизительно такой вид:

function updateWall() {
    if (x < ...) {          // Если координата x стены вышла за пределы экрана
        nextWallX = ...;    // крайнее правое положение
        nextHoleY = 50.0 + Math.random() * 240.0;
    } else {
        nextWallX -= wallSpeed; // двигаем стену влево
    }
}

5) Коллизии

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

6) Развитие

Можно добавить следующие вспомогательные вещи:

Счет
Перезапуск игры при коллизии
Сделать эллипс немного вытянутым и рисовать его под углом пропорциональным вертикальной скорости (скорость вниз - эллипс смотрит вниз, скорость вверх - эллипс смотрит вверх)
Больше одной стены

5) Отправка задания

Отправляйте в приложении к письму .js файл который вы редактировали. Если gmail не возволит вам отправить js файл из соображений безопасности - то переименуйте расширение файла в что-нибудь вроде .js_:

Тему письма называйте правильно, например: Задание 52 16-1 Полярный Коля

Задание 61. Бот для телеграмма

Sun, 05 Mar 2017 09:00:00 +0000

Задание: реализовать программу-бота для телеграмма, которая будет отвечать на запросы пользователя (обычного человека, использующего телеграмм) и предоставлять для него полезную информацию.

Тема-пример этой статьи Бот-эхо:

Бот отвечает таким же сообщением, какое пользователь отправил
Бот шлет Привет! Как дела? в 22:39 каждый день

Тема на оценку Бот-Remembrall:

Боту можно отправить сообщение о чем-то важном, например 20:00 загамать в доту, 5 марта сделать дз по информатике
Бот предупредит о важном событии в указанное время (или за день до даты)
Придумать какую-нибудь дополнительную полезную функциональность
Опционально Напоминание может содержать геотег (метку на карте)
Опционально Предупреждать за N минут до звонка (N - настраиваемое)
Опционально Да что угодно!

Альтернативные темы:

Генератор мемов (пользователь выбирает картинку и указывает текст для наложения)
Оповещатель о новых сообщениях в vkontakte
Выдаватель новых/случайных анекдотов/новостей из указанной пользователем группы vkontakte

Другие темы возможны по согласованию со мной.

В инструкции описано как сделать бота на Java, но Python для данной задачи на мой взгляд подходит лучше, так что любой другой язык для этого задания разрешен. Здесь есть ссылки для многих языков.

Дедлайн:

TBA

1) Про ботов

Общая идея в том, что вы регистрируете своего бота в телеграмме, затем запускаете программу, которая будет определять логику бота. Эта программа подключиться к серверам телеграмма, и если кто-то отправит сообщение вашему боту - сервера телеграмма оповестят об этом вашу программу. Программа соответственно может сообщать серверам телеграмма о том, какие действия совершает бот, например отправка овтетного сообщения.

2) Регистрация бота

Чтобы ваша программа-бот могла взаимодействовать с серверами телеграмма - ее нужно зарегистрировать, т.е. получить для нее идентификатор, чтобы сервера телеграмма могли понимать с кем они работают.

Для этого надо открыть https://telegram.me/botfather и нажать SEND MESSAGE, это откроет BotFather в установленном Телеграмме.

Теперь надо попросить у него выдать для нас идентификатор (и сделать это с уважением):

/start
/newbot
Указать имя бота, например PolarNickTestBot
Указать username оканчивающийся на _bot, например polar_nick_test_bot
В ответ вам будет выслан HTTP API (в дальнейшем ключ бота), что-то вроде 332239602:AAHGJSrMvTxVm239c3JJzHaz239mXyEE9tI

3) Библиотека Telegram API

Все взаимодействие с серверами телеграмма обернуто в нескольких удобных библиотеках, в рамках данной статьи предлагается использовать данную библиотеку - TelegramBots.

Создайте пустой проект, назвав его например TelegramEcho.

Скачайте отсюда файл telegrambots-<версия>-jar-with-dependencies.jar.

Теперь эту библиотеку надо подключить к проекту:

File->Project Structure->Libraries
Зеленый плюсик сверху слева -> Java
Указать скачанный файл, нажать Ok

4) Простой echo-bot

Создаем какой-нибудь класс и пишем в нем main-функцию - точку входа в приложение:

public static void main(String[] args) {

Наследуем наш класс от TelegramLongPollingBot. Например:

public class MyTelegramBot extends TelegramLongPollingBot {

Не забываем все ошибки Cannot resolve symbol решать через Alt+Enter->Import class.

В данном случае появится в том числе ошибка Class must either be declared abstract or implement abstract method.... Надо реализовать эти методы, по аналогии с тем как мы это делали при обработки нажатия кнопок/движения мышек/получения сообщений в задании 41 (Alt+Enter -> Implement methods).

В main-функции надо инициализировать библиотеку и запустить наш бот:

        ApiContextInitializer.init();
        TelegramBotsApi telegramBotsApi = new TelegramBotsApi();
        try {
            telegramBotsApi.registerBot(new MyTelegramBot());
        } catch (TelegramApiException e) {
            e.printStackTrace();
        }

Теперь надо действительно реализовать те абстрактные методы, которые нам достались в наследство. Два из них заполняются тривиально - теми значениями, которые вы указали или получили на шаге 2 (в процессе регистрации бота):

    @Override
    public String getBotUsername() {
        return "polar_nick_test_bot"; // Username вашего бота, второе значение которое вы указывали при регистрации
    }

    @Override
    public String getBotToken() {
        return "332339602:AAHGJSrMvTxVm0iCc3JJzHazToqmXyEE9tI"; // Ключ бота, который был выдан в конце регистрации
    }

Осталось делать что-нибудь, когда бот получает сообщения. Это делается в onUpdateReceived:

        Message message = update.getMessage();                   // Получаем текст входящего сообщения
        System.out.println("New message: " + message.getText()); // Пишем в консоль о том, какое сообщение было получено

Но просто записывать в консоль полученное сообщение не интересно. Давайте ответим пользователю этим же сообщением в ответ:

        SendMessage sendMessage = new SendMessage();            // Создаем объект, в котором опишем сообщение, которое хотим послать в ответ
        sendMessage.setChatId(message.getChatId().toString());  // Укажем, что отправить это сообщение следует в чате, из которого мы получили сообщение
        sendMessage.setText("Echo: " + message.getText());      // Укажем текст сообщения
        try {
            sendMessage(sendMessage);                           // Отправим сообщение
        } catch (TelegramApiException e) {
            e.printStackTrace();                                // Это обработка исключительных ситуаций - на случай если что-то пойдет не так
        }

Еще например можно было бы отправлять это сообщение как “ответ” на входящее сообщение:

sendMessage.setReplyToMessageId(message.getMessageId());

5) Дополнительные материалы

Взаимодействие с vkontakte: для этого есть библиотека, которая оборачивает взаимодействие с API. С помощью этой библиотеки можно написать бота для vkontakte.

Забор информации с произвольного сайта: для этого надо выкачивать соответствующую html-страницу, и из нее извлекать информацию. Помочь может например библиотека jsoup. Примеры работы с этой библиотеки можно нагуглить, например это.

6) Отправка задания

ВАЖНО Обратите внимание, что API-ключ бота дает доступ и контроль над ботом. Поэтому если кто-то получит доступ к этому ключу - он сможет перехватить контроль над ботом. Поэтому при отправки кода мне или кому-либо еще - обязательно удалите API-ключ бота из исходников.

Отправляйте выполненное задание ввиде zip-архива src папки, и пожалуйста:

Тему письма называйте правильно, например: Задание 61 16-1 Полярный Коля
Правильно названный zip-архив (или 7zip), внутри которого папка src с .java файлами, пример названия: 61_16_1_polyarniy_nikolay.zip

Мини-задание 51. Фрактальные деревья

Wed, 01 Mar 2017 09:00:00 +0000

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

Задание является адаптацией данного видео на тему использования библиотеки p5.js для рисования фрактальных деревье. Здесь есть перечень всех доступных функций.

Получить оценку за данное задание можно только на уроке.

0) Поднятие окружения

Скачайте архив библиотечки отсюда и разархивируйте его в какую-нибудь папку.

Там куда вы разархивировали библиотечку зайдите в подпапку p5-zip/empty-example. Откройте sketch.js любым текстовым редактором, например Intellij IDEA (в ней можно нажать File->Open и указать этот файл):

function setup() {

}

function draw() {
  
}

Первая функция исполняется в начале работы приложения, вторая функция - исполняется для отрисовки каждого кадра.

Простой рабочий пример может выглядеть так:

function setup() {
    createCanvas(640, 480);   // Указываем размер холста на котором будем рисовать
    background(50, 50, 100);  // Указываем цвет фона
}

function draw() {
    var x = 100;                           // Пример того, как можно объявить переменную, вместо типа перед названием переменной всегда пишется var - от слова variable (в переводе - переменная)
    var ellipseColor = color(255, 255, 0); // Создаем переменную хранящую цвет
    fill(ellipseColor);                    // Указываем цветом заливки - цвет из переменной ellipseColor
    ellipse(320, 240, 200, 100);           // Рисуем эллипс с центром в точке (320, 240) и размером 200x100
}

Чтобы увидеть результат - достаточно открыть p5-zip/empty-example/index.html в браузере (например дважды кликнув по этому файлу). По мере редактирования sketch.js чтобы увидеть новый результат - достаточно обновить страничку в браузере (Ctrl+R или F5).

1) Функции

Допустим мы хотим сделать функцию “нарисовать человечка”:

function setup() {
    createCanvas(640, 480);   // Указываем размер холста на котором будем рисовать
    background(50, 50, 100);  // Указываем цвет фона
}

function draw() {
    drawHuman(320, 240);      // Рисуем человечка вызовом функции, которая объявлена ниже
}

function drawHuman(x, y) {
    translate(x, y);          // Смещаем начало отсчета координат из текущего положения (верхний левый угол) на x пикселей вправо и y пикселей вниз
    ellipse(0, -40, 20, 20);  // Голова относительно текущей системы координат в точке (0, -40), т.е. на 40 пикселей выше чем (x, y) и с диаметром 20
    line(0, -30, 0, 30);      // Тело идет от нижней точки головы (0, -30) до точки (0, 30)
    line(0, -20, -20, -10);   // Рука слева
    // Доделайте эти вызовы:
    // line(...); // Рука справа
    // line(...); // Нога слева
    // line(...); // Нога справа
}

Доделайте функцию drawHuman, чтобы получился человечек.

Если добавить после вызова translate вызов rotate(PI / 4), то текущая система координат повернется на 45 градусов по часовой стрелке, а значит и дальнейшая отрисовка человечка в этой системе приведет к тому, что человечек повернулся на эти же 45 градусов по часовой стрелке.

Убедитесь что вы поняли, как работает translate и rotate. Что будет если отрисовка частей человечка не симметрична относительно точки (0, 0)? Как он будет крутиться в таком случае?

2) Фрактал

Давайте теперь нарисуем такое дерево-фрактал:

Функция отрисовки такого дерева - рекурсивная, она должна делать следующее:

функция рисует корневую ветку длины N. В точке где кончается эта ветка функция вызывает отрисовку двух других деревьев:

Одно повернуто на 45 градусов по часовой стрелке с длиной первой ветки N/2
Второе повернуто на 45 градусов против часовой стрелки с длиной первой ветки N/2

2.1) Правые ветки фрактала

Давайте сначала нарисуем более простую вещь - загогулину-веточку:

Функция отрисовки такой веточки тоже рекурсивная. Она делает следующее: отрисовывает веточку длины N, двигает систему координат в конец этой ветки, поворачивает систему координат на 45 градусов и вновь вызвает себя для отрисовки на этот раз в два раза более короткой веточки:

function setup() {
    createCanvas(640, 480);
    background(50, 50, 100);
}

function draw() {
    translate(320, 460);      // Сдвигаем систему координат так, чтобы точка отсчета совпадала с корнем дерева-веточки
    drawBranch(200);          // Провоцируем отрисовку, длина первой ветки должна быть 200
}

var coeff = 0.5;              // Эта константа используется ниже - это коэффициент, во сколько раз очередная ветка короче предыдущей

function drawBranch(length) {
    line(0, 0, 0, -length);         // Рисуем ветку переданной длины из центра текущей системы координат вверх данной длиной

    translate(0, -length);          // Двигаем систему координат так, чтобы точка отсчета совпала с концом нарисованной ветки
    rotate(PI / 4);                 // Поворачиваем систему координат
    if (length > 1) {
        drawBranch(length * coeff); // Провоцируем рекурсивную отрисовку более короткой ветки
    }
}

2.2) Интерактивная ветка фрактала

Давайте сделаем интерактивным изменение угла наклона каждой очередной ветки и то, во сколько раз она уменьшается:

Сначала надо открыть текстовым редактором index.html и заменить эту строчку:

  <!--<script language="javascript" src="libraries/p5.dom.js"></script>-->

На такую:

  <script language="javascript" src="libraries/p5.dom.js"></script>

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

Для этого достаточно доделать код до следующего:

var slider; // Переменная в которой хранится интерактивный объект-ползунок

function setup() {
    createCanvas(640, 480);
    background(50, 50, 100);
    slider = createSlider(0, 2 * PI, PI / 6, 0.01); // Создаем ползунок с аргументами: минимальное и максимальное значения, значение по умолчанию, и шаг изменения значения
}

function draw() {
    translate(320, 460);
    drawBranch(200);
}

var coeff = 0.5;

function drawBranch(length) {
    line(0, 0, 0, -length);

    translate(0, -length);
    rotate(slider.value()); // Вместо того чтобы всегда поворачивать на 45 градусов - поворачиваем на значение, которое в данный момент выбрано ползунком
    if (length > 1) {
        drawBranch(length * coeff);
    }
}

Теперь у нас есть ползунок, который указывает градус поворота от ветки к ветке.

Но есть проблема - старое положение всех веток оставляет след, который хотелось бы очистить - очистка происходит вызововм background, который у нас вызывается только в setup, так что достаточно перенести его вызов из setup в первую строчку метода draw.

2.3) Сам фрактал

Заметьте, что сам фрактал отличается от этой ветки лишь тем, что каждый очередной раз порождается не одна ветка - а две.

Это значит что нам надо вызвать рекурсивную функцию не один раз после поворота по часовой стрелке на 45 градусов, но два раза - один после поворота по часовой стрелке, второй - после поворота против часовой стрелки. Например так:

function drawFractal(length) {
    line(0, 0, 0, -length);

    translate(0, -length);
    
    if (length > 1) {
        rotate(PI / 2);
        drawFractal(length * coeff);

        rotate(-PI / 2);
        drawFractal(length * coeff);
    }
}

Но это внезапно не работает. Почему? Потому что когда мы делаем второй поворот системы координат - она уже модифицированна внутренними поворотами первого рекурсивного вызова, а нам хотелось бы восстановить изначальное (на момент текущего вызова функции) состояние системы координат. Для сохранения и восстановления состояния есть метод push и pop соответственно:

        push();                      // Сохраняем текущую систему координат
        rotate(PI / 2);
        drawFractal(length * coeff);
        pop();                       // Восстанавливаем последнее сохранение системы координат

        push();                      // Сохраняем
        rotate(-PI / 2);
        drawFractal(length * coeff);
        pop();                       // Восстанавливаем

2.4) Развитие фрактала

Теперь можно поиграть со следующими вещами:

Добавьте ползунок для определения значения coeff (коэффициент изменения длины ветки)
Как можно сделать дерево не симметричным? Например сделать поворот системы координат не на angle и -angle, а на angle+delta и -angle+delta.

Задание 41. Многопользовательские чат и рисовалка

Tue, 14 Feb 2017 09:00:00 +0000

Это задание является последней частью мультиплеерного Paint.

Как более простой вариант многопользовательского приложения ниже описано как сделать чат. Для получения четверки достаточно отправить многопользовательский чат.

Сделав чат по предложенной инструкции, вы по аналогии сможете сделать мультиплеерный Paint (взяв готовую рисовалку и добавив в ней функционал отправки отрезков как сообщений). Для получения пятерки необходимо сделать многопользовательский пейнт.

Обратите внимание, что несмотря на то, что клиент и сервер - являются двумя разными программами, удобно их реализовывать в рамках одного проекта. Например можно это сделать в двух разных классах (это могут быть классы ChatClient и ChatServer) с двумя main-функциями.

P.S. Игнорируйте строчки вроде synchronized (lock) { ...someCode... } внутри StreamWorker. Считайте что это то же самое, что и просто { ...someCode... }.

P.P.S. Обратите внимание, что несмотря на то, что клиент к чату можно скопировать из кода ниже - это не значит что в нем не надо разбираться. Если вы в нем не разберетесь - будет сложно реализовать сервер чата и еще сложнее - многопользовательскую рисовалку. С кодом класса StreamWorker тоже стоит разобраться.

Дедлайн:

10-1: 16 марта
11-1: 16 марта

0) Про чат

В этом задании рассматриваются две программы: сервер и клиент.

В помощь вам предложена простая библиотечка, которая возьмет на себя задачу создания потока на каждого подключенного клиента, и задачу получения/отправки сообщений от этого/этому клиенту. Аналогично эту библиотечку удобно использовать для клиента, чтобы получать оповещения о входящих сообщениях со стороны сервера. Ниже подробно изложено, как на основе этого сделать чат. После чата аналогично, но уже самостоятельно, вам надо будет сделать мультиплеерную рисовалку.

Задача клиента: подключиться к серверу и отправлять ему сообщения которые вводит пользователь в консоли. При получении сообщения от сервера - печатать его в консоль.

Задача сервера: ожидать подключений новых клиентов. С помощью библиотеки обрабатывать поступающие от клиентов сообщения - т.е. пересылать эти сообщения всем клиентам.

1) Библиотечка

Обрабатывающий потоки данных класс должен как-то оповещать о событиях (новых сообщениях). Раньше мы уже использовали KeyListener и MouseListener для обработки событий нажатия кнопок и мышки. В данном случае используется аналогичный механизм, но абстрактный класс MessageListener подходящий под наши нужды выглядит например так:

public abstract class MessageListener {

    public abstract void onMessage(String text);

    public abstract void onDisconnect();

    public void onException(Exception e) {
        e.printStackTrace();
    }

}

Создаете новый класс (правый клик по src, там New->Java Class) с названием MessageListener и копируете в этот файл приведенный выше код.

Класс StreamWorker, который будет заниматься тем, чтобы получать новые сообщения из входного потока данных (поток может быть как от клиента, так и от сервера):

import java.io.*;
import java.net.SocketException;

public class StreamWorker implements Runnable, Closeable {

    private final BufferedReader in;    // Входной поток данных
    private final PrintWriter out;      // Выходной поток данных
    // private  - означает, что до этого поля нельзя дотянуться извне, ведь напрямую с ним никто другой кроме данного класса работать не должен
    // final    - означает, что этот объект всегда будет один и тот же (почти то же самое, что и const), т.е. что это финальный объект

    private final List<MessageListener> listeners = new ArrayList<>(); // Зарегистрированные обработчики входящих собщений
    
    private final Object outputLock = new Object();   // Не обращайте внимания, эти два объекта
    private final Object listenerLock = new Object(); // используются в synchronized-блоках

    public StreamWorker(InputStream input, OutputStream output) {
        this.in = new BufferedReader(new InputStreamReader(input));
        this.out = new PrintWriter(output, true); // true - флаг autoFlush, он приводит к тому, что буфер будет отправляться сразу - на каждое сообщение
    }

    public void addListener(MessageListener listener) {
        this.listeners.add(listener);
    }

    // Это метод, который StreamWorker обязался реализовать в связи с реализацией интерфейса Runnable (т.к. выше написано StreamWorker implements Runnable)
    // В этом методе StreamWorker ждет поступления новых сообщений, и каждое новое сообщение передает обработчику входящих сообщений
    @Override
    public void run() {
        try {
            String s;
            // Пока входящее сообщение не отсутствует - читаем сообщения одно за другим
            while ((s = in.readLine()) != null) {
                // Отдаем полученное сообщение на обработку
                synchronized (listenerLock) {
                    for (MessageListener listener : listeners) {
                        listener.onMessage(s);
                    }
                }
            }
        } catch (SocketException e) {
            if (e.getMessage().equals("Connection reset")) {
                // Если случившаяся исключительная ситуация - разрыв соединения, то вызываем соответствующую обработку события
                synchronized (listenerLock) {
                    for (MessageListener listener : listeners) {
                        listener.onDisconnect();
                    }
                }
            } else {
                // Иначе - просто обрабатываем ошибку
                synchronized (listenerLock) {
                    for (MessageListener listener : listeners) {
                        listener.onException(e);
                    }
                }
            }
        } catch (IOException e) {
            // Провоцируем обработку случившейся исключительной ситуации (например клиент разорвал соединение)
            synchronized (listenerLock) {
                for (MessageListener listener : listeners) {
                    listener.onException(e);
                }
            }
        }
    }

    // Этот метод запускает цикл в методе run(), который будет считывать входящие сообщения и отдавать их на обработку в listeners
    public void start() {
        Thread thread = new Thread(this, "StreamWorker");
        thread.start();
    }

    // Это метод отправки сообщения
    public void sendMessage(String text) {
        synchronized (outputLock) {
            out.println(text);
        }
    }

    // Это метод, реализовать который StreamWorker обязуется в связи с реализацией интерфейса Closeable (т.к. выше написано StreamWorker implements Closeable)
    // Общая идея что Closeable = "закрываемый" как например файл. В нашем случае StreamWorker просто закрывает оба потока данных
    @Override
    public void close() throws IOException {
        in.close();  // Закрываем входной поток
        out.close(); // Закрываем выходной поток
    }
}

Создаете новый класс (правый клик по src, там New->Java Class) с названием StreamWorker и копируете в этот файл приведенный выше код.

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

2.1) Клиент чата

Теперь на базе скопированного обработчика входящих сообщений (почтальона) достаточно просто можно реализовать клиент.

Создайте класс ChatClient. Т.к. это будет исполняемая программа - надо определить точку входа - создать main-функцию внутри класса ChatClient:

    public static void main(String[] args) throws IOException {
        // TODO
    }

На этапе запуска программы разумно создать объект типа ChatClient и вызвать у него метод start (который мы тут же и реализуем):

    public static void main(String[] args) throws IOException {
        ChatClient chatClient = new ChatClient();
        chatClient.start();
    }
    
    public void start() throws IOException {
        // TODO
    }

Теперь устанавливаем соединение с сервером аналогично тому как это было сделано в предыдущем задании:

    public void start() throws IOException {
        Socket socket = new Socket(...);
        // TODO
    }

Для получения и отправки сообщений серверу можно воспользоваться StreamWorker, дав ему входной и выходной поток данных - полученных от установленного соединения с сервером, и запустив его:

StreamWorker postman = new StreamWorker(socket.getInputStream(), socket.getOutputStream());
postman.start();

Аналогично тому как обрабатывались нажатия кнопок в змейке и движения мышки в рисовалке нужно подписаться на обработку сообщений у почтальона (StreamWorker):

Наследовать ChatClient от MessageListener
Реализовать (через Alt+Enter) методы: onMessage, onDisconnect
Добавить текущий объект как обработчик входящих сообщений к “почтальону”: postman.addListener(this)

Теперь предыдущий кусок кода становится таким:

StreamWorker postman = new StreamWorker(socket.getInputStream(), socket.getOutputStream());
postman.addListener(this);
postman.start();

// TODO: считываем сообщения из консоли и отправляем их

Чтобы отправлять сообщения можно воспользоваться методом sendMessage(String text):

StreamWorker postman = new StreamWorker(socket.getInputStream(), socket.getOutputStream());
postman.addListener(this);
postman.start();

BufferedReader in = new BufferedReader(new InputStreamReader(System.in));
String userInput = in.readLine();
while (userInput != null) {
    postman.sendMessage(userInput);
    userInput = in.readLine();
}

2.2) Сервер чата

Сервер на базе предложенной библиотечки получается из примерно следующих набросков кода:

// Создаем серверный сокет - швейцара, который будет пускать в наш чат долгожданных гостей
ServerSocket server = new ServerSocket(port);

while (true) {
    // Дожидаемся очередного гостя
    Socket client = server.accept();
    // Создаем почтальона, который будет ожидать входящие сообщения от данного пользователя, и оповещать о них нас - сервер
    StreamWorker postman = new StreamWorker(client.getInputStream(), client.getOutputStream());
    postman.addListener(this);
    // Поток, следящий за входными строчками от этого клиента запускается:
    postman.start();
    // Запоминаем почтальона, выделенного данному клиенту в перечне всех почтальонов
    postmans.add(postman);
}

Соответственно примерно так может выглядить обработка входящего сообщения:

// Пробегаем по всем почтальонам
for (int i = 0; i < postmans.size(); i++) {
    StreamWorker postman = postmans.get(i);
    // Шлем полученное сообщение каждому клиенту (включая клиента являющегося оригинальным отправителем):
    postman.sendMessage(text);
}

Чат готов!

3) Многопользовательская рисовалка

Теперь вам предлагается аналогичным образом сделать многопользовательскую программу для рисования:

Каждое сообщение в многопользовательской рисовалке будет описывать отрезок. Соответственно сообщение имеет вид:

Segment x0 y0 x1 y1

Где:

Segment - фиксированная строка, она указывает тип сообщения (в данном задании достаточно одного вида сообщений, но это задел на развитие рисовалки)
x0 y0 - пара целых чисел через пробел, описывающих координаты начала отрезка
x1 y1 - пара целых чисел через пробел, описывающих координаты конца отрезка

В случае если вы хотите добавить имя/идентификацтор пользователя в сообщение, то его вид может стать например таким:

Segment UserId x0 y0 x1 y1

В случае если вы хотите добавить цвет к отрезку:

Segment x0 y0 x1 y1 r g b

Где r g b - три числа в диапазоне от 0 до 255 (включительно).

3.1) С точки зрения клиента:

Клиент может рисовать непрерывные (пока кнопка зажата) линии движениями мышки (как в Задании 39 - Пункт 6)
Клиент отправляет на сервер сообщения, описывающие новые нарисованные отрезки
Клиент получает сообщения об отрезках и отображает их по мере рисования другими пользователями

3.2) С точки зрения сервера:

Постоянно ожидать подключения новых пользователей
Когда клиент присылает новый отрезок - рассылать его всем пользователям
Помнить о всех отрезках, накопившихся с момента запуска сервера
Когда новый клиент подключается - в первую очередь отправить ему все отрезки, которые были нарисованы с момента запуска сервера

4) Отправка задания

Отправляйте выполненное задание ввиде zip-архива src папки, и пожалуйста:

Тему письма называйте правильно, например: Задание 41 16-1 Полярный Коля
Правильно названный zip-архив (или 7zip), внутри которого папка src с .java файлами, пример названия: 41_16_1_polyarniy_nikolay.zip

5) Частые проблемы

Ситуация: При запуске сервера выводится исключение java.net.BindException: Address already in use (Bind failed)

Это означает что слушать по такому порту сервер не смог, т.к. этот порт уже кем-то занят. Скорее-всего вы забыли остановить запущенный ранее сервер (нажать красную квадратную стоп-кнопку).

Ситуация: При запуске клиента не устанавливается соединение с исключением java.net.ConnectException: Connection refused: connect

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

Задание 40. Простой echo-сервер

Wed, 25 Jan 2017 09:00:00 +0000

Это задание является вторым из трех частей мультиплеерного Paint. В результате получится программа в которой пользователи сервера и клиента рисуют и видят общую картину.

Важно Обратите внимание, что в данном задании есть три части:

Разминка (пункт 0) - работа с консолью, это подзадание делать и отправлять не обязательно, но оно должно существенно упростить выполнение остальной части задания
Сервер
Клиент

Несмотря на то, что сервер и клиент две программы - их можно создавать в одном проекте. Например можно создать классы MainServer и MainClient, где в каждом классе будет своя main-функция. Чтобы запустить какую-то одну из них - можно нажать правой кнопкой на класс, в котором она объявлена и там Run.

Дедлайн:

9-1: когда-нибудь не скоро
10-1: 26 февраля
11-1: 26 февраля

Это задание является вводным в сетевое взаимодействие. Когда вы открываете этот сайт, играете в мультиплеерную игру, используете мессенджер и т.п. - происходит взаимодействие вашего устройства с другими устройствами посредством интернета. Т.е. программа которую вы используете отправляет очень много сообщений серверу (различного содержания: это может быть текст вашего сообщения или координаты вашего персонажа в игровом мире). Так же используемая программа получает много сообщений от других устройств: в случае чата - это входящие сообщения, в случае игры - координаты остальных игроков.

В этом задании рассматриваются две простые программы: сервер и клиент.

Задача клиента: подключиться к серверу и отправлять ему сообщения которые вводит пользователь, получать на них ответ и отображать текст ответа пользователю. (т.е. после запуска программы пользователь может вводить сообщения в консоль строчка за строчкой)

Задача сервера: ожидать подключения клиента и отвечать на все входящие сообщения тем же текстом, который прислал клиент.

Ачивка TypicalBackendDeveloper: ожидать подключения многих клиентов и при получении входящего сообщения - высылать полученный текст всем подключенным клиентам (т.е. например клиент 1 отправил текст “A”, клиент 2 отправил текст “Б”, тогда сервер каждое из этих сообщений отправит этим двум клиентам, и каждый клиент увидит как свое сообщение, так и сообщения остальных клиентов).

0) Про работу с потоками данных

Обмен данными по сети происходит почти так же, как и работа с файлами или консолью. Поэтому сначала для практики надо решить простую “псевдо-олимпиадную” задачку.

Здесь написано о том, как это делается.

Условие задачи:

В консоль вводят команды. Одна строка - одна команда. Перечень поддерживаемых команд:

sum a1 a2 a3 ... (произвольное количество целых чисел через пробел - поэтому поможет tokenizer.hasMoreTokens()) - выводит сумму чисел
print sdmasda sfa 412451 251 (сначала название команды print, затем после пробела произвольный текст) - выводит всю строку без изменений, следующую за print через пробел
exit - завершает исполнение программы

Пример:

Вход:

sum 1 2 3 4 5
sum 239
print Hello world!
sum -1 3 214 1
print 1 2
exit

Выход:

15
239
Hello world!
217
1 2

1) Сетевое взаимодействие

Представьте что у каждого компьютера есть несколько тысяч виртуальных разъемов. Это так называемые порты - они обладают значениями от 0 до 65536 (рекомендую для использования любой из пространства 1024—49151, например 2391). Они позволяют установить соединение между двумя компьютерами (т.е. сообщения будут идти между одним из портов первого компьютера через интернет к порту второго компьютера).

Чтобы в интернете или локальной сети можно было обращаться к другим компьютерам - у каждого есть свой адрес, так называемый ip-адрес. Это уникальный идентификатор имеющий вид a.b.c.d, где каждая буква - число от 0 до 255 (например: 5.18.192.135).

Если есть компьютер А с ip-адресом ipA и есть компьютер Б с ip-адресом ipB, то чтобы А смог общаться с Б - им нужно установить связь. Для этого компьютер А стучится (пытается установить соединение) по адресу ipB в конкретный порт, например в нашем случае пусть это будет порт 2391.

Чтобы соединение успешно установилось - необходимо чтобы на компьютере Б была запущена программа-сервер, которая ожидает подключающихся клиентов по порту 2391.

Итого если на компьютере Б с адресом ipB запущена программа, которая ожидает подключение клиентов по порту 2391, и есть компьютер А, на котором запустилась программа, которая пытается установить соединение с компьютером по адресу ipB и порту 2391 - то будет установлено двустороннее соединение, по которому можно обмениваться информацией.

2) Простой сервер

Итак нам нужно написать программу которая ожидает подключения клиентов по порту 2391 и когда клиент подключается - начинает ему отвечать зеркальными сообщениями (т.е. вести себя как эхо).

В Java есть специальный класс Socket, который представляет “разъем”/”сокет” соединения, т.е. один из концов канала обмена сообщениями.

Нам нужно начать ожидать подключающихся клиентов. Т.е. нам нужно поставить на выбранный порт (например 2391) швейцара, который будет ждать гостей, и когда кто-нибудь придет - установит надежное соединение между нашим сервером и гостем-клиентом для дальнейшего общения.

В Java таким швейцаром является специальный класс ServerSocket.

Создаем его в main-функции:

ServerSocket serverDoorMan = new ServerSocket(port);

Обратите внимание на параметр конструктора - нужно указать порт (т.е. номер двери выходящей наружу - на улицу), на котором наш сервер (швейцар/привратник) ожидает подключающихся клиентов. Так как порт уже может быть занят другим сервером (швейцаром), то этот конструктор может упасть с исключением IOException, об этом IDEA вам подскажет ошибкой Unhandled exception: java.io.IOException, мы просто явно пробросим эту ошибку наружу - пусть наша программа упадет (это делается через клик по этому конструктору -> Alt+Enter -> Add exception to method signature). Об этой же ошибке упомянуто в конце в секции “частые проблемы”.

Теперь надо сказать швейцару ждать гостей (accept = принимать/ожидать):

Socket socketToClient = serverDoorMan.accept();

Функция accept() приостанавливает исполнение программы до первого подключения клиента по этому порту (первого человека который придет в гости).

Когда клиент подключится и соответственно соединение будет установлено - эта функция вернет сокет который описывает установленное соединение (т.е. объект класса Socket), поэтому результат исполнения функции accept надо сохранить в переменную типа Socket - например логично назвать такую переменную socketToClient, т.к. это сокет соединения с клиентом.

У Socket (объект в переменной socketToClient) уже можно получить входной и выходной поток (через методы getInputStream и getOutputStream) - они обладают тем же типом, что и System.in и System.out. Поэтому о том, как считывать из входного потока (который возвращает getInputStream - т.е. это поток данных которые идут от клиента к серверу) и как писать в выходной поток (т.е. в результат getOutputStream - т.е. в поток данных от сервера к клиенту) в пункте 0 предложена условная задача на понимание этого (единственная разница - вторым аргументом в конструктор PrintWriter нужно передать true - это включит автоматическую отправку буфера на каждое сообщение).

Когда клиент закроет канал - метод readLine() класса BufferedReader вернет null - и тогда сервер должен будет вернуться обратно на стадию ожидания нового клиента - т.е. опять вызвать метод accept(). (т.е. швейцар опять вернулся на свою позицию ожидания гостей)

Но как и при работе с файлами - сокет соединения с клиентом надо закрывать, т.е. после того как readLine() вернул null - требуется вызвать метод close() у объекта класса Socket, который представляет соединение с клиентом (т.е. то, что вернул метод accept()).

3) Простой клиент

Итак нам нужно написать программу которая подключается по порту 2391 к компьютеру с каким-то ip-адресом и шлет ему сообщения + получает на них ответы.

Мы сервер и клиент будем запускать на одном и том же компьютере, и для подобного случая есть зарезервированный специальный ip адрес - 127.0.0.1 (так же известный как localhost), поэтому можно считать что сервер всегда существует по такому адресу.

В Java есть специальный класс Socket, который представляет “разъем”/”сокет” соединения, т.е. один из концов канала обмена сообщениями. Для того чтобы инициировать соединение с сервером - надо создать сокет с адресом сервера к которому мы стучимся (127.0.0.1) и портом на котором нас ожидает сервер (2391). Здесь рпяит возникнет Unhandled exception: java.io.IOException, которая обсуждалась выше (конструктор ServerSocket) и ниже (в Частых проблемах).

Создаем такой сокет в main-функции:

String host = "127.0.0.1";
int port = 2391;
Socket socketToServer = new Socket(host, port);

Как и у сервера код работающий с потоками такой же как и при работе с консольным вводом-выводом. Методы получения потоков у socketToServer такие же как и у socketToClient, который обсуждался выше. Только теперь getInputStream - канал от сервера к нам (т.е. к клиенту), а getOutputStream - от нас к серверу:

Т.е. теперь достаточно в цикле слать сообщения серверу через выходной поток получаемый через метод getOutputStream и печатать в консоль получаемые через getInputStream- поток ответные сообщения.

P.S. не забудьте вызвать метод close() у сокета соединения.

4) Сервер чата (добровольное)

Теперь мы хотим чтобы сервер пересылал все входящие сообщения всем подключенным клиентам.

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

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

Этот пункт добровольный - на ачивку, поэтому инструкция не подробная.

5) Тестирование и отправка задания

Чтобы протестировать - вам надо сначала запустить сервер, а затем клиент. Переключаться между их консолями можно нажимая мышкой на вкладки в нижней части IDE.

Отправляйте выполненное задание ввиде zip-архива src папки, и пожалуйста:

Тему письма называйте правильно, например: Задание 40 16-1 Полярный Коля
Правильно называнный zip-архив (или 7zip), внутри которого папка src с .java файлами, пример названия: 40_16_1_polyarniy_nikolay.zip

6) Частые проблемы

Ситуация: При запуске сервера выводится исключение java.net.BindException: Address already in use (Bind failed)

Ситуация: Не компилируется с исключением Unhandled exception: java.io.IOException

Это означает что вызов может упасть с исключением по работе с IO, т.е. с Input-Output (т.е. ввод-вывод). Чтобы начало компилироваться - достаточно пробросить эту ошибку наружу, т.к. такая прблема в нашем случае должна приводить к падению программы. Подробнее об этом написано выше рядом с описанием вызова конструтора ServerSocket.

Ситуация: При запуске клиента не устанавливается соединение с исключением java.net.ConnectException: Connection refused: connect

Ситуация: Подсвечивает красным код с ошибкой “Unhandled exception: java.io.IOException”

Это означает, что данная строка кода может кинуть исключительную ситуацию. Исключение называется IOException, т.к. IO - InputOutput, т.е. исключение связанное с потоком данных. Например в случае работы с файлом это может быть - “файл не найден”, а в случае работы по сети - “соединение было разорвано”. Ее можно либо обработать (например напечатав в консоль “проблемы с соединением”) с помощью блока try-catch (Alt+Enter, затем Surround with try/catch), либо пробросить дальше из этого метода, чтобы смог обработать тот, кто вызвал метод, в котором мы сейчас находимся (Alt+Enter, затем Add exception to method signature).

Задание 39. Простой программа рисования

Tue, 24 Jan 2017 09:00:00 +0000

Это задание является первым из трех частей мультиплеерного Paint. В результате получится программа в которой пользователи сервера и клиента рисуют и видят общую картину.

Дедлайн:

9-1: когда-нибудь не скоро
10-1: 21 февраля
11-1: 21 февраля

В данной программе можно будет рисовать: сначала кружки в месте где кликнула мышка, затем линии там, где мышка прошла с нажатой кнопкой.

1) Создаем окно

Создаем класс MainFrame, который как и в самом начале задания отрисовки змейки (в задании 32) является окном, а значит должен быть отнаследован от JFrame (т.е. class MainFrame extends JFrame {).

В конструкторе MainFrame нам достаточно указать какой-нибудь разумный размер окна, попросить окно принять этот размер (pack()), сказать что мы хотим завершать исполнение программы по нажатию на крестик и сделать окно видимым (все это аналогично тому, что мы делали в задании 32):

setPreferredSize(new Dimension(800, 600));
pack();
setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
setVisible(true);

Итак, добавим точку входа (main-функцию), и наше окошко уже появляется при запуске:

public static void main(String[] args) {
    MainFrame frame = new MainFrame();
}

2) Рисуем примитивы

Чтобы что-нибудь нарисовать - надо переопределить метод определяющий то, как JFrame отрисовывается - это метод void paint(Graphics g):

    @Override
    public void paint(Graphics g) {
    }

Теперь внутри этого метода обращаясь к Graphics g можно рисовать различные примитивы.

Например можно нарисовать линию:

g.drawLine(100, 200, 500, 250);

Или овал (drawOval), или прямоугольник (drawRect). Поэкспериментируйте с разными фигурами: чтобы увидеть перечень всех функций которые поддерживает Graphics нужно написать g. и нажать Ctrl+Space - IDE покажет вам перечень функций.

Заметьте, что теперь фон окна иногда не чисто серого цвета, а как бы прозрачный - т.е. показывает то, что было на его месте до того как он отрисовался. Это вызвано тем, что раньше JFrame при отрисовке исполнял свой старый метод paint(...), который в частности заливал серым цветом все окно, теперь же мы переопределили этот метод, а следовательно код очистки окошка перестал исполняться. Но есть возможность не целиком заменить старый метод, а расширить его - для этого достаточно в начале реализации paint(...) добавить вызов super.paint(g). Здесь super это почти как this - только родительская часть текущего объекта, поэтому таким образом можно вызвать родительскую (т.е. JFrame) реализацию paint.

Чтобы изменить цвет - перед вызовом очередного draw... достаточно вызвать g.setColor(new Color(255, 0, 0));.

Сложнота: Чтобы изменить толщину штрихов - нужно преобразовать Graphics к Graphics2D и затем вызвать метод setStroke():

Graphics2D g2d = (Graphics2D) g;
g2d.setStroke(new BasicStroke(10));

3) Обрабатываем клики мышки

Чтобы обрабатывать нажатия мышки надо заявить себя “слушателем мышки”, реализовать методы которые обрабатывают события и зарегистрировать себя как “официального слушателя мышки в этом окне”:

Добавить implements MouseListener в объявлении MainFrame, чтобы получилось public class MainFrame extends JFrame implements MouseListener {
Кликнуть в подсвеченном красным implements, затем нажать Alt+Enter и выбрать Implement methods
Добавить в конструктор MainFrame вызов addMouseListener(this); (что зарегистрирует нас как обработчика событий мышки)

Теперь можно например в mouseClicked обрабатывать клики мышки в окне. Чтобы получить координаты мышки надо у аргумента функции обработки события (void mouseClicked(MouseEvent e)) вызвать метод getX() и getY(), т.е. e.getX() и e.getY().

4) Рисуем овалы в местах кликов мышкой

Давайте заведем списки координат где кликнула мышь. Объявим мы их как поля MainFrame:

ArrayList<Integer> xs = new ArrayList<>();
ArrayList<Integer> ys = new ArrayList<>();

Теперь в методе mouseClicked достаточно добавлять (методом add) координаты очередного клика к этим массивам.

Чтобы отрисовать эти клики - надо в методе paint перебрать все сохраненные на данный момент координаты кликов и отрисовать их, например вот так:

for (int i = 0; i < xs.size(); ++i) {
    g.drawOval(xs.get(i), ys.get(i), 10, 10);
}

Если теперь запустить и протестировать - мышкой рисовать овалы не получается. Почему? Под отладчиком оказывается что метод mouseClicked отрабатывает нажатия, но после этого paint банально не вызывается.

Дело в том, что отрисовка окна происходит не постоянно, а лишь тогда когда что-то изменилось, например окно изменило размер, или было развернуто на весь экран, или само приложение поняло, что отображаемое в окошке изменилось - а это как раз наш случай, ведь мы приняли решение добавить к отрисовке новый эллипс. Чтобы оповестить окно о том, что ему пора перерисоваться - надо вызвать метод repaint(), что спровоцирует вызов метода paint (т.е. надо сообщить о том, что окно требуется перерисовать. А делать это надо в тот момент, когда мы это поняли - т.е. в методе обработки клика мышью).

5) Обрабатываем движения мышью

Это опять про “великих обработчиков”. Все то же самое что и про обработку кликов мышью в пункте 3, разве что реализовывать надо интерфейс MouseMotionListener. В результате получается что-то подобное:

public class MainFrame extends JFrame implements MouseListener, MouseMotionListener {

А так же:

После Alt+Enter добавятся переопределения методов mouseDragged и mouseMoved
Регистрация нашего объекта как слушателя движений мышью вызовом addMouseMotionListener(this); в конструкторе MainFrame

6) Задание на пятерку - контуры движений мыши

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

7) Двойная буферизация (добровольное, необязательное)

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

Чтобы это поправить, надо включить двойную буферизацию:

1) Указать число буферов для стратегии буферизации - createBufferStrategy(2); (например вызвав в конце конструирования окна)

2) В методе paint удалить вызов super.paint(g)

3) В самом начале метода paint написать следующий код:

BufferStrategy bufferStrategy = getBufferStrategy();        // Обращаемся к стратегии буферизации
if (bufferStrategy == null) {                               // Если она еще не создана
    createBufferStrategy(2);                                // то создаем ее
    bufferStrategy = getBufferStrategy();                   // и опять обращаемся к уже наверняка созданной стратегии
}
g = bufferStrategy.getDrawGraphics();                       // Достаем текущую графику (текущий буфер)
g.setColor(getBackground());                                // Выставялем цвет в цвет фона
g.fillRect(0, 0, getWidth(), getHeight());                  // Зачищаем все окно фоновым цветом

4) В самом конце метода paint написать следующий код:

g.dispose();                // Освободить все временные ресурсы графики (после этого в нее уже нельзя рисовать) 
bufferStrategy.show();      // Сказать буферизирующей стратегии отрисовать новый буфер (т.е. поменять показываемый и обновляемый буферы местами)

8) Отправка задания

Отправляйте выполненное задание ввиде zip-архива src папки, и пожалуйста:

Тему письма называйте правильно, например: Задание 39 16-1 Полярный Коля
Правильно называнный zip-архив (или 7zip), внутри которого папка src с .java файлами, пример названия: 39_16_1_polyarniy_nikolay.zip

9) Частые проблемы

Ситуация: Окошко маленькое

Либо вы указали маленький размер окна в пикселях (нормальный размер - это например 640x480), либо что-то упустили в условии (например место где указывается размер окна или вызов pack()).

Ситуация: Окно прозрачное/за ним мусор/остается мусор с предыдущих отрисовок

Вы упустили в условии вызов родительской реализации paint().

Ситуация: Окно мерцает

Это из-за отсутствия двойной буферизации. Меня устраивает если окно мигает в процессе рисования мышью или в процессе изменения размера окна, но не в состоянии “окно не двигается и изображение статично”. Опционально это можно пофиксить, как это фиксить - 7 пункт условия (не обязательный).