• Как определить местоположение пользователя, не спрашивая разрешение на геолокацию?

    Конечно, самый удобный способ узнать, где торчит пользователь, использовать свойство navigator.geolocation. Правда, при этом браузер обязательно спросит его разрешения. Лично я почти всегда отказываюсь, только если зашел на проверенные сайты строительных супермаркетов или дискаунтеров типа Ситилинк. Значит, этот способ будет работать с малой эффективностью - данное окошко вызывает подозрение, и, впрочем, оно подозрительное и есть. Как избавиться?

    1. Нельзя, это часть интерфейса браузера.
    2. Попап выводится в тот момент, когда вы из своего кода вызываете Geolocation.getCurrentPosition() или Geolocation.watchPosition(), если данная страница еще не получила разрешение/отказ.
    3. 3. В вышеупомянутые методы вы передаете два коллбека, на успех и на ошибку. Определить, какую кнопку юзер нажал можно только косвенно исходя из результата.
    4. Дело в том, что спецификация определяет только API, доступное программисту из JS, а как это выглядит со стороны пользователя - личные фантазии браузерописателей. Где-то попап, где-то галочки в настройках, где-то надо с бубном сплясать. Поэтому никаких гарантий про кнопки дать нельзя.
    5. Если navigator.geolocation является false, значит у пользователя не поддерживается геолокация (например, старый браузер или еще что-то).

    Так что делать?? Неужели все-таки придется напрягать пользователя окошком подтверждения? Есть еще один вариант.

    API Yandex Maps позволяет определять координаты пользователя, используя свои сервисы. Код довольно простой. Подключаем Yandex Api со своим ключом, и пишем в коде:

    var location = ymaps.geolocation.get();

    // Асинхронная обработка ответа.
    location.then( function(result) {
    // Добавление местоположения на карту.
    myMap.geoObjects.add(result.geoObjects)
    }, function(err) {
    console.log(′Ошибка: ′ + err)
    } );

    В свойстве result.geoObjects.position - координаты местонахождения пользователя.

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

    P.S. Практика показала, что это все полная херня. Точности никакой. А иногда Яндекс может "зашвырнуть" пользователя из Самарской области в Казахстан...



  • Unity3D: Вводная в синтаксис

    Представлен систаксис на Javascript

    Игровой объект


    Создание нового игрового объекта с именем MyObject.

    var myObject = new GameObject("MyObject");

    Созданный объект будет доступен по ссылку myObject.

    Поиск объекта по его имени.

    var myObject = GameObject.Find("MyObject");



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

    var myObject = GameObject.FindWithTag("MyTag");



    Возвращает список всех объектов с указанным тегом:

    var objectList = GameObject.FindGameObjectsWithTag("MyTag");



    Проверка на наличие у объекта требуемого тега. Возвращает true, если у указанного объекта имеется тег MyTag:

    var isCompare = GameObject.CompareTag("MyTag");



    Уничтожение объекта:

    Destroy(myObject);



    Уничтожение объекта через минуту, после его создания:

    Destroy(myObject, 60);


    Продолжение под катом



  • Клонирование объекта в Javascript

    Метод Object.assign() используется для копирования значений всех собственных перечисляемых свойств из одного или более исходных объектов в целевой объект. После копирования он возвращает целевой объект.

    Метод Object.assign() копирует из исходных объектов в целевой объект только перечисляемые и собственные свойства. Он использует внутренний метод [[Get]]на исходных объектах и внутренний метод [[Set]] на целевом объекте, так что он также вызывает геттеры и сеттеры. Именно поэтому он присваивает свойства вместо простого копирования или определения новых свойств. Это поведение может сделать метод непригодным для вливания новых свойств в прототип, если вливаемые исходные объекты содержат геттеры. Вместо него для копирования в прототипы определений свойств, включая признак их перечисляемости, следует использовать методы Object.getOwnPropertyDescriptor()и Object.defineProperty().

    Копируются свойства типов как String, так и Symbol.

    В случае возникновения ошибки, например, когда свойство является незаписываемым, возбуждается исключение TypeError, а целевой объект targetостаётся неизменным.

    Обратите внимание, что метод Object.assign() не выкидывает исключения, если в качестве исходных значений выступают null или undefined.


    Пример: клонирование объекта

    var obj = { a: 1 };
    var copy = Object.assign({}, obj);
    console.log(copy); // { a: 1 }

    Пример: слияние объектов

    var o1 = { a: 1 };
    var o2 = { b: 2 };
    var o3 = { c: 3 };
    var obj = Object.assign(o1, o2, o3);
    console.log(obj); // { a: 1, b: 2, c: 3 }
    console.log(o1); // { a: 1, b: 2, c: 3 }, изменился и сам целевой объект.

    Больше информации тут



  • Правильная обработка касаний экрана при разработке мобильного приложения на Javascript

    Проблем с этим, на самом деле, много. А в интернете, что очень странно, информации довольно мало.

    Поясню ситуацию, чтобы было понятнее... Имеется 2 div-а. Один вложен в другой и больше родителя размерами. Внутренний div имеет свойство draggable (Jquery UI), чтобы можно было его "перетаскивать" внутри родительского div-а.

    Встала задача - получить координаты нажатия на внутренний div. Функция $( "#inner" ).click() с задачей справляется, но есть подводные камни, особенно для мобильных устройств:

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

    Как убрать синее выделение элемента при касании экрана?

    Для начала напишем следующие строчки в CSS-файл нашего приложения:

    {
      -webkit-tap-highlight-color: rgba(2552552550);
      -webkit-focus-ring-color: rgba(2552552550);
      outline: none;
      -moz-user-select: -moz-none;
      -o-user-select: none;
      -khtml-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      -webkit-text-size-adjust: none;
    }

    В код программы добавляем:

    if (document.addEventListener) {
      document.addEventListener("touchstart"function () {
      }, true);

    }

    Если нажимаемые элементы - кнопки, добавляем для них такие стили:

    .some_button:focus.some_button:focus:active {
      background-color: rgba(0000);
    }

    Лично мне такое решение помогло.

    Долгое время отклика при касании экрана на мобильных устройствах

    К сожалению, перепробовав кучу JQuery-плагинов, я убедился в том, что адекватное время отклика дает только слушатель tap, который входит в комплект JQuery Mobile. Также является большим плюсом то, что он не мешает событию drag-а. Так как мне для моих приложений не нужны все встроенные функции JQM, я использую кнопку Custom Download, которая позволяет скачать только те компоненты, которые мне нужны. Сжатая версия библиотеки, включающей в себя только средства обработки touch-событий, "весит" всего 8 килобайт.

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

    var screenWidth = $( document ).width(); // ширина экрана
    var screenHeight = $( document ).height(); // высота экрана
    var outerPosition = $( "#outer" ).offset(); // координаты родительского контейнера относительно координат экрана
    var innerPosition = $( "#inner" ).position(); // координаты вложенного контейнера относительно родителя
    var touchCoords = false; // координаты касания
    var realTouchCoords = false; // расчетные координаты касания относительно координат вложенного контейнера
    $( "#inner" ).on( "tap", function( e ) {
      e.preventDefault();
      e.stopPropagation();
      touchCoords = {
        x: e.pageX,
        y: e.pageY
      };
      var left, top;
      if ( innerPosition.left < 0 ) {
        left = Math.abs( innerPosition.left ) + ( touchCoords.x - outerPosition.left );
      } else if ( innerPosition.left > 0 ) {
        left = touchCoords.x - innerPosition.left - outerPosition.left;
      } else {
        left = touchCoords.x - outerPosition.left;
      }
      if ( innerPosition.top < 0 ) {
        top = Math.abs( innerPosition.top ) + ( touchCoords.y - outerPosition.top );
      } else if ( innerPosition.top > 0 ) {
        top = touchCoords.y - innerPosition.top - outerPosition.top;
      } else {
        top = touchCoords.y - outerPosition.top;
      }
      realTouchCoords = {
        x: left,
        y: top
      };
    } );

    Вот такие танцы с бубном... Зато проблема решена. Если кто-нибудь знает способ попроще, напишите мне, не сочтите за труд! Всем удачи и пока!



Загрузка...

Войти на сайт

Регистрация