ВЕБ МОРДА

[NEXT]

St@rz
Коль вы уже начали творить фейс, возьмите на вооружение следующую идею красоты
Плитки фейса на десктопе двигаються и переворачиваются при наведении мыши, но планшеты и мобильники на это не способны. Значит в мобильном варианте плитки нужно принудительно заставить двигаться, переворачиваться раз в 5 -10 секунд, хаотично

[St@rz]

Сообщение от NEXT

St@rz
...заставить двигаться, переворачиваться раз в 5 -10 секунд, хаотично

Ок. Спасибо. Возьму на заметку.
Пока что с передачей переменной разбираюсь что бы сохранять изменения. А то перенос выполняется нормально, но при обновлении страницы всё встает на свои места. Стараюсь обойтись без PHP. И выравнивание кнопок по ячейкам или координатной сетке добавить.

[St@rz]

Пока не нашел решения как сохранять результат перетаскивания кнопок в меню.
В связи с этим предлагаю пока отойти от динамических настроек и добавить несколько статических:

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

Пока что сделать эти настройки просто с помощью галочек или т.п.

Еще несколько мыслей.

Использовать два размера кнопок.
Квадрат придется убрать. Так как иначе, при включении кнопок в список, будут пустые места.



Кнопка квадрат выше кнопки половина квадрата. Остается пустое место над кнопками.

Вид когда ширина страницы помещает все кнопки в один ряд. Когда ширина страницы меньше те кнопки которые не вошли уйдут на второй, третий... ряд. При просмотре меню с мобильного телефона все кнопки встанут в один столбик. Как я предлагал использовать <ul data-role="listview" data-type="group"><li>.

Вариант с двумя размерами кнопок.



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

Размер кнопок использовать 256 Х 512 пикселей или 256 Х 255 (квадратную кнопку сделать уже чтобы был просвет между ними и в паре они по ширине не выходили за пределы широкой кнопки по габаритам). Возможно ошибаюсь и стоит использовать чуть более меньший размер.

Внешний вид отображения кнопки берут из модулей.

Варианты внешнего вида остальных окон я предложу позже. После одобрения выложу код.

[dimasinnet]

Сообщение от St@rz

Пока не нашел решения как сохранять результат перетаскивания кнопок в меню.

а нет возможности там создать так называемую виртуальную сетку, ну чтоб кнопка скажем могла иметь положения по горизонтали только скажем 5px(на зазор к примеру)+ширина маленькой кнопки(т.к. большую нужно перетакивать на половинку) и т.д. а по вертикали 5px+высота кнопки.

или не сетку а разрешить размещение этих кнопок в диапазоне таком кратном ее размеру?
или чтоб вообще красиво, потянул ее, если она ушла на 50% больше начального состояния по одной из осей, то дать ей координаты от начальной + ее размер. да и вообще так правильней, а то по первому варианту пиксели не поймаешь рукой
или это чушь я написал?

[dimasinnet]

А так http://www.intrahouse.ru/ коммерческая...

[azh122]

Сообщение от mebitek

На роутер можно что угодно поставить.

Можно но не нужно. Время отклика может сильно расстроить.
Я вообще сторонник с роутера убрать все лишнее, оставив на нем только веб морду (без всякого медиа) и общение с внешним миром (смс/письмо отослать). В общем так что бы если роутер вдруг отвалился, на локальную работоспособность это не повлияло.

[stD]

а вот эта ваша "морда" уже работает в реале? взаимодействует с оборудованием?

Это http://www.intrahouse.ru/ не моё. В сети нашёл.

[stD]

Дык, а на чём остановились, что качать?

[uni]

Пока не нашел решения как сохранять результат перетаскивания кнопок в меню.

~95 кило для jquery-1.11.0.min.js и можно работать с сервером не перегружая страничку. Такая вот цена вопроса.

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

Простой вариант странички запроса без перегрузки cgi выглядит так:

<script src=" /modules/schoolbell/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$.get( "/cgi-bin/modules/schoolbell/test.cgi", { name: "John", time: "2pm" },
    function( data ) {
        alert( data );
    });
</script>

Скрипт выглядит так:

#!/bin/sh
echo "Content-type: text/html; charset=utf-8"
echo

if [ -n "$QUERY_STRING" ] ; then

    # Декодирование запроса.
    query=$(echo "$QUERY_STRING" | echo -e $(sed 's/+/ /g; s/%/\\x/g'))
    
    name=$(echo "$query" | sed -n 's/^.*name=\([^&]*\).*$/\1/p')
    time=$(echo "$query" | sed -n 's/^.*time=\([^&]*\).*$/\1/p')
    
    echo "{\"name\":\"$name\", \"time\":\"$time\"}"
    
fi

Здесь при загрузке странички вызывается скрипт запросом GET с двумя параметрами, результатом работы скрипта является строка в JSON формате, который можно потом распарсить при помощи объекта JSON, получив конкретные значения параметров.

Далее прикрепляем всё это дело к событиям и работа будет происходить в фоне, незаметно для пользователя. С помощью библиотеки запросов jQuery можно существенно упростить кодирование на стороне клиента. Думаю, что это стоит 95 кило.

[uni]

Ещё может пригодиться использовать POST запрос вместо GET.

Пример тестовой странички (изменён только метод):

<script src="/modules/schoolbell/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
    $.post( "/cgi-bin/modules/schoolbell/test.cgi", { name: "John", time: "2pm" }, 
        function(data){ alert( data ); } );
</script>

Пример разбора запроса в скрипте (взято отсюда):

#!/bin/sh

echo "Content-type: text/html; charset=utf-8"
echo

if [ "$REQUEST_METHOD" = POST ]; then
        
    read -n $CONTENT_LENGTH query
        
    # Декодирование запроса.
    query=$(echo "$query" | echo -e $(sed 's/+/ /g; s/%/\\x/g'))
    
    name=$(echo "$query" | sed -n 's/^.*name=\([^&]*\).*$/\1/p')
    time=$(echo "$query" | sed -n 's/^.*time=\([^&]*\).*$/\1/p')
    
fi

echo -en "Status: 200 OK\r\n\r\n"
echo "length [$CONTENT_LENGTH]"
echo "{\"name\":\"$name\", \"time\":\"$time\"}"