Jump to content
Sign in to follow this  
Madwizard

TOP CP - Панель управления сервером и клиентом

Recommended Posts

Доброго врмени суток.
Как я писал ранее в теме, начинаю блог разработки. 

 

Задача, которую я попытаюсь решить

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

Техническая часть

1. node.js

2. electron.js

3. vue.js + vue router + vuex

4. bootstrap + свои стили

 

Основные модули

1. Панель управления сервером

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

2. Поиск аккаунта

В этом разделе, можно будет найти аккаунт, посмотреть персонажей (полная информация: статы, умения, инвентарь, банк, временный инвентарь)

3. UI конструктор

Здесь можно будет кастомизировать UI клиента, посматривать уже существующие окна-формы

4. NPC менеджер

Работа над всеми доступными НПС, добавления новых, редактирование, удаление

5. Менеджер монстров

Тот же функционал что и для NPC

6. Редактор карт

Можно будет редактировать расположение НПС и монстров. В планах еще сделать веб версию программки для создания карт.

7. Документация функций игры, которые будут использоваться в программе

8. Гайды по модулям

 

Дизайн программки

 

Screen Shot 2019-07-27 at 15.28.30.png

  • Like 1

Share this post


Link to post
Share on other sites

27.07.2019

Так как я не до конца разобрался со всеми тонкостями работы локаций, решил переключится на модуль более разобранный. И это UI Builder

Раньше я перерисовывал интерфейс для не открывшегося проекта Stories of Pirates. И должен признаться вам это тот еще геморрой.

Поэтому решил облегчить себе задачу, простым (для пользователей) способом.

 

При открытии этой страницы мы получим список файлов которые клиент использует для отрисовки интерфейса (изображение прикреплено)861633071_ScreenShot2019-07-27at15_33_53.png.17e0a6c274f986a2e723ca3abae95186.png

 

Далее при открытии файла мы получаем все формы которые в нем есть в виде списка с превьюшками и основной информации о форме:

- #id

- размер

- из скольки компонентов состоит

144028584_ScreenShot2019-07-27at15_35_10.png.77272b83d4628893a4bea0f96add4587.png

 

На данном этапе реализовано:
1. Сбор функций использующихся в файлах создания интерфейса

2. Парсер этих файлов

3. Создание миниатюр

 

На этом пока все. Далее планируется реализация редактора этих форм с импортом :)

 

п.с. Так же если у кого есть идеи по функционалу прошу не стесняться :) 

Share this post


Link to post
Share on other sites

27.07.2019

Работка над редактором интерфейса идет активненько :)

Значит отрефакторена существующая часть модуля работы с интерфейсом.

Добавлен поиск по файлам (простой поиск по имени файла, удобно когда работаешь над конкретным файлом).

Добавлены логи работы с файлами (конвертирование, наличие)

 

И самое вкусное на сегодня, это дизайн и частично реализованный функционал самого редактора:

1051917197_ScreenShot2019-08-03at20_31_56.png.bb07ce23c56ad5d49af21e088caad56d.png

 

Сверху навигация по компонентам.
1-ый квадратик это всегда настройки самой формы
Остальные это компоненты с соответствующим название типом


Справа sidebar со свойствами выбранного компонента или самой формы.

Отображаются все необходимые настройки выбранного елемента

 

По центру рабочая область.

Пока что реализована отрисовка формы на фоне окна игры, картинок и кнопок. Будет все динамически меняться. К примеру: изменили позицию, формачка подвинулась и т.д.

 

Это пока что альфа версия, конечно же все будет дописано, но уже с интейрфейсом работать одно удовольствие xD

п.с. создал Discord канал программки. Кому интересно поучаствовать заходите не стесняйтесь :) - https://discord.gg/JVN5Ubw

Edited by Madwizard
  • Like 3

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×