Waiviogit / waivio

MIT License
8 stars 7 forks source link

New: Field: Menu #111

Open WaivioLabs opened 5 years ago

WaivioLabs commented 5 years ago

Поле Menu позволяет добавлять разделы меню на Object Page, такие как List и Page (в будущем еще Map, Feed, а также просто Web Link).

Добавление ссылок осуществляется либо поиском по имени (только этот тип объекта) или добавлением URL на объект этого типа (в зависимоти от выбранного типа поля). Разделение по типам ссылок предусмотрено потому, что раскрытие Maps будет не в колонке 2, а сразу будет менять обе колонки, в то время как Web Link будет перерисовывать весь экран.

74 - object menu - add

Принципиальное отличие от ссылок на стандартные объекты, состоит в том, что открытие этих ссылок (List, Page) происходит по принципу embed (открытие происходит внутри колонки, вместо перехода на новую страницу). Также переходы из пунктов List и Page на другие List или Page тоже осуществляются внутри колонки, при этом формируется bread crumbs path (хлебные крошки), точно так, как было реализовано в прототипе.

75 - object - menu - navigation

Сортировка списков по умолчанию делается по Rank, но если в объекте List есть поле Sorting, то используется Custom сортировка по умолчанию.

Теперь по поводу сортировки самого menu. Добавленные пункты меню вставляются перед Reviews, но порядок меню можно переделывать (последовательность стандартных меню не меняется, хотя новые пункты могут быть вставлены между стандартными полями).

76 - object - menu - sorting

WaivioLabs commented 5 years ago

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

Поэтому на данном этапе мы можем custom menu разместить в левой колонке. Так и сортировку будет делать существенно проще.

Причем первый пункт этого меню может сразу отображаться в средней колонке. Например, для объекта "Bitcoin" будет показан новостной поток, а для продукта "Camping Tent" будет показываться страница с подробным описанием товара.

image

Замечания:

  1. Если нет ни одного пункта меню, то в средней колонке продолжаем показывать Reviews.
  2. Сейчас мы прячем пункт About на desktop. Надо добавить еще одну проверку - на наличие хотя бы одного пункта меню. А можно и упростить - показывать пункт About всегда.
  3. На мобильном при переходе на страницу объект надо показывать About, а не Reviews, как это сделано сейчас.
WaivioLabs commented 5 years ago

В MENU в левой колонке, в дополнение к List и Page объектам, надо также добавить Button и News (который, кстати, куда-то пропал из списка полей). Сортировка меню должна распространяться на все четыре типа объектов в разделе меню.

image

Ссылки должны быть оформлены в виде кнопок в левой колонке:

image

WaivioLabs commented 5 years ago

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

Пример страницы - Product:

image

Пример страницы - About

image

Кнопки на страницах объектов специально сделаны слегка по другому нежели на Discover, Rewards, Account (Activity) страницах. Не выбранные кнопки имеют сервый цвет. В то время, как Button всегда оформлена ярко (при таком оформлении может и правильно, что button может быть только одна).

Центровка и кнопок и надписей в кнопках - по центру.