Перейти к публикации
VK сообщество TOPDeck.ru Twitch канал TOPDeck.ru YouTube канал TOPDeck.ru
Savior

magicspoiler.io

Рекомендованные сообщения

Всем привет,

 

В целях самообучения Angularjs, сделал веб приложение magicspoiler.io.

 

Обычный визульный спойлер, который представляет из себя одностраничное приложение (SPA).

Далеко не все готово, но основной функционал есть. Вещи, которые планирую реализовать, ниже, в списке TODO.

 

Основные "фишки":

 

  1. Высокая скорость (например, фильтры работают мгновенно, т.к. не происходит перехода на другие страницы);
  2. Оптимизация под мобильные устройства.

 

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

 

Надеюсь, кто-нибудь найдет сайт полезным и, по возможности, меня интересуют любые советы, предложения и детали вашего пользовательского опыта. Например, насколько хорошо и быстро все работает в мобильных сетях 3G/4G.

 

TODO:

 

  • Создать самому возможность оставлять комментарии или разобраться как прикрутить Disqus к SPA;
  • Разобраться с SEO для SPA;
  • Разработать поиск по сайту.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

 

Спасибо!

 

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

 

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Вроде баг:

в спойлере Origins при просмотре всех карт после базиков идет еще часть карт

 

 

 

24eW5.png

 

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Вроде баг:

в спойлере Origins при просмотре всех карт после базиков идет еще часть карт

 

 

 

24eW5.png

 

 

Это из набора. В сет входит, но в бустерах нету.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Вроде баг:

в спойлере Origins при просмотре всех карт после базиков идет еще часть карт

 

 

 

24eW5.png

 

 

 

 

Не настроил ещё сортировку. Думал сделать по редкости, но с базой данных mtgjson не выходит. Можно, конечно, задать всем картам свойство для сортировки (mythic rare - 1, rare -2 etc.). Сейчас показываю карты, как они идут в базе. Могу пока сделать по номеру карты.

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

 

Еду на неделю в Россию, поэтому добавлю все сеты и изменения только по приезде обратно.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

А в чём проблема с сортировкой? БД SQL?

 

БД нет, я беру данные из json файла. Проблема в том, что в rarity возможные значения 'Mythic Rare', 'Rare', 'Uncommon', 'Common'. По алфавиту они не сортируются. Как отсортировать их именно по определенному значению, я не знаю. Хотя, можно конечно прогонять data и показывать сперва все карты для которых 'rarity' = 'mythic rare', потом 'rare' etc. Надо будет поразмыслить над этим.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Savior

var rarityWeights = [];
rarityWeights["Common"] = 1;
rarityWeights["Uncommon"] = 2;
rarityWeights["Rare"] = 3;
rarityWeights["Mythic Rare"] = 4;

cards.sort(function(a, b) { return rarityWeights[b.rarity] - rarityWeights[a.rarity]; });

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

БД нет, я беру данные из json файла. Проблема в том, что в rarity возможные значения 'Mythic Rare', 'Rare', 'Uncommon', 'Common'. По алфавиту они не сортируются. Как отсортировать их именно по определенному значению, я не знаю. Хотя, можно конечно прогонять data и показывать сперва все карты для которых 'rarity' = 'mythic rare', потом 'rare' etc. Надо будет поразмыслить над этим.

Ну ты странный. Реализуй справочник весов и сортируй наздоровье.

 

PS

Не оно?

http://jsfiddle.net/VAKrE/105/

 

PPS

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

Изменено пользователем mrSadPanda

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

mrSadPanda запрос в БД более тяжелая операция, чем запрос текстового файла. Парсинг json'а производится на клиенте и не грузит сервер. Но для поиска это не особо пригодно, а вся ценность подобных сайтов именно в поиске.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

"запрос в БД более тяжелая операция, чем запрос текстового файла"

Более чем сомнительное утверждение. Смотря какой текстовый файл и смотря какой запрос. Выкачивать к себе текстовичок мегабайта на полтора каженный раз когда пользователь обновляет страницу, очевидно, не лучшее решение. Это я, конечно, в вакууме теоритизирую. Ровно также как, пожалуй, не стоит тащить из БД "ФинкельИграетВТоп4.avi"

 

"Парсинг json'а производится на клиенте и не грузит сервер"

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

mrSadPanda сжатый спойлер BFZ занимает 36 килобайт. И его конечно надо кешировать в localStorage, чего автор не делает почему-то. Для просмотра/фильтрации одного спойлера одного сета это вполне нормально. И клиент это точно не особо загрузит.

 

Для поиска по нескольким сетам при таком подходе конечно каши не сваришь, но если цель просто показывать спойлеры, а не делать подобие http://magiccards.info - то сойдет.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

А, ну в таком разрезе, конечно, проблемы нет. Но я предполагаю, что он там собирается делать базу всех карт МТГ, да еще и с картинками. Хотя картинки можно и просто на харде хранить...

 

 

Savior: (например, фильтры работают мгновенно, т.к. не происходит перехода на другие страницы);

Ну это у тебя там изи мод. Не нашел как сделать фильтр "CMC >=3 AND CMC < 5 AND Color IN ('red', 'blue') AND Set IN ('KtK', 'BfZ') "

Изменено пользователем mrSadPanda

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Я сделал спойлер в качестве практики, изучая фронт-енд, поэтому БД не реализовывал.

JSON должен кешироваться.

 

По поводу БД, я хотел попробовать изучить noSQL (mongoDB).

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Только веса лучше так объявить, наверное:

 

var rarityWeights = {
"Common": 1,
"Uncommon": 2,
"Rare": 3,
"Mythic Rare": 4
};

Изменено пользователем jdo

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Вернулся домой, немного покрапел над сайтом:

 

- Убрал темный фон и текс при наведении на карту,

- Отсортировал карты в спойлере по редкости,

- Добавил кастомный фильтр. Фильтрует карты по мере написания запроса. Можно писать любые ключевые слова (Например, "Angel" или "Devoid"),

- Добавил Oath of the Gatewatch и From the Vault: Angels.

 

Не могу найти где нормально можно скачать изображения Commander 2015. (Только 56 есть, как найду, добавлю все).

Oath of the Gatewatch буду обновлять, старые сеты добавлю по возможности.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Не могу найти где нормально можно скачать изображения Commander 2015. (Только 56 есть, как найду, добавлю все).

Там всего 56 карт(новых, остальное - репринты)

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.

×
×
  • Создать...