Алексей

Хочешь сразу на все платформы и дёшево (и достаточно простой проект), готов к тому что функционал может быть порезан из-за невозможности реализации? ReactNative

Много бабла и нужно бескомпромиссное качество - только native.

Думаю, этих двух предложений хватит чтоб говорить с заказчиком =)

1. Если совсем js и html - phonegap в помощь
2. Если хочется чего-то поприличнее, с нативным интерфейсом, но тоже на js - https://www.nativescript.org/
Из Вашего списка требований оба всё умеют, но есть вопрос с циферкой на иконке. С NS точно можно реализовать, но тут проще Swift выучить
3. Выучить Swift - посмотрите на документацию swiftbook.ru/doc он по синтаксису очень на ES6 похож (а ещё больше на TypeScript). Мне этот путь не кажется таким сложным, после того как я документацию глазами пробежал.

По-поводу Хакинтоша - слышал что сборка от Niresh самая безгеморная в установке. Если поставите - напишите в коммент как оно. С выкладкой в AppStore проблем быть не должно - на прошлой работе iOS'еры на Хакинтошах сидели - плакали, но кактус ели.

Сам с этим не работал, так что не ругайте.
Есть такой пример: www.bdcc.co.uk/Gmaps/ll_grat_v3_demo.htm

Судя по коду, если ничего не упустил, нужно подключить GoogleMaps и эту библиотеку: www.bdcc.co.uk/Gmaps/v3_ll_grat.js

и добавить следующий код:

var map;
var grid;

function initialize() {
    map = new google.maps.Map(document.getElementById('map_div'), {
        center: new google.maps.LatLng(51, -1),
        zoom: 10,
        maxZoom: 21,
        mapTypeId: google.maps.MapTypeId.SATELLITE,
        panControl: false,
        draggableCursor: "default",
        streetViewControl: true
    });

    grid = new Graticule(map, true);
}

По-поводу определения на какой квадрат кликнули - получайте из GoogleMaps API координаты клика в latitude/longitude и сопоставляйте с координатами сетки.

//объявляем глобальную переменную - можно где нибудь в index.html или где удобно с языком по-умолчанию:
SYSTEM = {
    lang: ru
}

var template = Handlebars.compile(templateTpl);

//Наряду с переменными передаваемыми в шаблон, передаём объект с переводами
var  lang: = {
        ru: {
             name: "Имя"
        },
        en: {
             name: "Name"
        }
}

var data = {
    myVar1: '',
    myVar2: ''
}

var templateData = $.extend({}, {lang: lang[SYSTEM.lang]}, data);
this.$el.append(template(templateData));

Темлейт:

<div>
    <span>{{lang.name}}</span>
    <span>{{myVar1}}</span>
    <span>{{myVar2}}</span>
</div>

Меняем язык и вызываем перерисовку страницы - что-то типа:

SYSTEM.lang = 'en';
Backbone.history.navigate(window.location, {trigger:true});

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

Не дерево, но граф.
Вот вам песочница с готовым примером(по-другому ссылка не вставилась):

http://cpettitt.github.io/project/dagre-d3/latest/demo/interactive-demo.html?graph=%2F*%20Example%20*%2F%0Adigraph%20%7B%0A%20%20%20%20%2F*%20Note%3A%20HTML%20labels%20do%20not%20work%20in%20IE%2C%20which%20lacks%20support%20for%20<foreignObject>%20tags.%20*%2F%0A%20%20%20%20node%20%5Brx%3D5%20ry%3D5%20labelStyle%3D"font%3A%20300%2014px%20%27Helvetica%20Neue%27%2C%20Helvetica"%5D%0A%20%20%20%20edge%20%5BlabelStyle%3D"font%3A%20300%2014px%20%27Helvetica%20Neue%27%2C%20Helvetica"%5D%0A%20%20%20%20yourvirtualnode%20%5Bshape%3Dcircle%2Cwidth%3D.01%2Cheight%3D.01%2Clabel%3D""%5D%0A%20%20%20%20%0A%09"Отец%20жены"%20->%20"Жена"%3B%0A%09"Мать%20жены"%20->%20"Жена"%3B%0A%09"Отец%20мужа"%20->%20"Муж"%3B%0A%09"Мать%20мужа"%20->%20"Муж"%3B%0A%09%0A%20%20%20%20"Муж"%20->%20yourvirtualnode%20%5Barrowhead%3Dnone%5D%0A%20%20%20%20"Жена"%20->%20yourvirtualnode%20%5Barrowhead%3Dnone%5D%0A%20%20%20%20%0A%20%20%20%20yourvirtualnode%20->%20"Ребёнок%201"%0A%20%20%20%20yourvirtualnode%20->%20"Ребёнок%202"%0A%20%20%20%20yourvirtualnode%20->%20"Ребёнок%203"%0A%7D%0A%20%20

Описание синтаксиса смотреть тут: www.graphviz.org/content/dot-language
Сама либа на D3: https://github.com/cpettitt/dagre-d3
И ещё одна реализация: https://github.com/mdaines/viz.js

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

По второй части - вот Вам готовая статья как с помощью d3 нарисовать турнирное дерево - на мой взгляд, самое простое и толковое решение на js - www.d3noob.org/2014/01/tree-diagrams-in-d3js_11.html

Кладёте textarea внутрь div c overflow: hidden и шириной меньше textarea на 20px (а в идеале, если буквы вылезают за край, подсчитать ширину динамически)

$(window).resize(function(){
//code...
});

Я бы сделал по-простому. Берём картинку с карой офиса, а над ней сверху рисуем прозрачные SVG-элементы по форме комнат. При клике на элемент (в режиме админа) он меняет цвет на нужный.
Snap.svg в помощь, хотя тут можно и без него

Недавно для себя открыл jQuery Audit (https://chrome.google.com/webstore/detail/jquery-a...)

После установки искать здесь:

Backbone и не мучайте себе мозг. Поймёте на нём основные концепции(а это поначалу самое сложное) и поймёте чего Вам хватает, а чего нет - а там уж достаточно прокачаетесь чтобы суметь самому выбрать что дальше лучше изучать.

Для JS - RequireJS

Для CSS подобный код в index.html:

<script>
function createLink(src){
                var link = document.createElement("link");
                link.type = "text/css";
                link.rel = "stylesheet";
                link.href = src + '?v=' + SYSTEM.cssVersion;
                document.querySelector("head").appendChild(link);
            }

            createLink('css/main.css');
            createLink('vendor/select2/dist/css/select2.css');
</script>

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

А чем вам обычный jQuery не подходит?

По ajax получаете json и делаете обычный .append()/.html()

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

Если совем не запариваться то что-то вроде этого: jsfiddle.net/Murmurianez/dxrt6nwx/1

www.tutorialspoint.com/codingground.htm