MODX-клуб

@prisma-cms

@prisma-cms/front-editor Components

HTML Tag

Супер! Пояснения более чем нужны (по крайней мере для меня:)) Особенно в связке с запросами - выводом выборки...

Супер! Пояснения более чем нужны (по крайней мере

Да. скоро будут объяснения в том числе и по ним, потому что вчера этот механизм еще значительно улучшился и теперь доступен вывод вложенных объектов :)

Да. скоро будут объяснения в том числе и по ним, п

Супер)))

Query

Николай, всё-таки нужны разъяснения:(

2. Внутрь добавляю Connector

...И дальше вакуум  в понимании, что делать?

Николай, всё-таки нужны разъяснения:( 1. Добавляю Query query{ users { id username } } http://joxi.ru/LmG3nzDSwYbDNm 2. Внутрь добавляю Connector http://joxi.ru/4AkOlYeIoK155A ...И дальше вакуум  в понимании, что делать?

Николай, всё-таки нужны разъяснения:( 1. Добавляю

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

А там уже будем разбираться что не так.

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

Дима, не надо скриншотов. Делай свой поддомен, соз

Все, вижу, ты сделал поддомен. Вот на него и надо ссылаться. Но лучше на конкретный шаблон. Можно отдельные части шаблона сохранять: http://joxi.ru/MAjz7eNcjLZ9OA

1. Для запросов в Query Есть важный момент, который я забыл упомянуть, но видно в запросах:

Для простых списков, как у тебя, надо указывать псевдоним objects: Вот твой запрос: 

Для запросов с постраничностью надо указывать objectsConnection: 

2. Для того, чтобы фильтры работали, надо еще название запроса по названию выборки указывать, то есть как у тебя, то query users... Иначе фильтры не будут понимать для какого типа объекта формироваться. 

3. Обязательно указывать лимит first. Ты же не хочешь, чтобы у тебя на странице вывелось несколько тысяч пользователей ;) Это сделает браузер плакать. И надо это свойство передавать именно параметром, чтобы во-первых, можно было в свойствах коннектора его менять http://joxi.ru/RmzYKQaSY5GPRr, а во-вторых, чтобы постраничность работала.

4. Чтобы постраничность работала, надо так же добавить параметр skip.

query users{
  objects:users (
    first: 10
  ){
    id
    username
  }
}


query usersConnection (
  $first: Int = 10
  $skip:Int
){
  objectsConnection:usersConnection (
    first: $first
    skip: $skip
  ){
    aggregate {
      count
    }
    edges{
      node{
        id
        username
      }
    }
  }
}


Все, вижу, ты сделал поддомен. Вот на него и надо ссылаться. Но лучше на конкретный шаблон. Можно отдельные части шаблона сохранять: http://joxi.ru/MAjz7eNcjLZ9OA По твоему вопросу: 1. Для запросов в Query Есть важный момент, который я забыл упомянуть, но видно в запросах: Для простых списков, как у тебя, надо указывать псевдоним objects: Вот твой запрос: Для запросов с постраничностью надо указывать objectsConnection: 2. Для того, чтобы фильтры работали, надо еще название запроса по названию выборки указывать, то есть как у тебя, то query users... Иначе фильтры не будут понимать для какого типа объекта формироваться. 3. Обязательно указывать лимит first. Ты же не хочешь, чтобы у тебя на странице вывелось несколько тысяч пользователей ;) Это сделает браузер плакать. И надо это свойство передавать именно параметром, чтобы во-первых, можно было в свойствах коннектора его менять http://joxi.ru/RmzYKQaSY5GPRr, а во-вторых, чтобы постраничность работала. 4. Чтобы постраничность работала, надо так же добавить параметр skip.

Все, вижу, ты сделал поддомен. Вот на него и надо

Кстати, на случай, если ты вдруг не понял как редактировать мои примеры запросов, вот видео: https://youtu.be/t09vm8wBEUU

Кстати, на случай, если ты вдруг не понял как реда

Дима, в статью дописал ссылку на видео.

List View

Object View

Спасибо огромное! Разбираюсь!  

Не за что!

Николай, привет! Спасибо за новый видос - встало на место:) 

Пытаюсь понять, почему картинку не получается вытянуть:  https://linklib.prisma-cms.com/ 

Разбираю твой шаблон со слайдером проектов и там картинка должна вроде прилетать, но не прилетает (и в плэйграунде Image: null воззвращает). 

Можешь подсказать - куда копать?   

Николай, привет! Спасибо за новый видос - встало на место:) Пытаюсь понять, почему картинку не получается вытянуть:  https://linklib.prisma-cms.com/ Разбираю твой шаблон со слайдером проектов и там картинка должна вроде прилетать, но не прилетает (и в плэйграунде Image: null воззвращает). Можешь подсказать - куда копать?

Николай, привет! Спасибо за новый видос - встало н

крутейшая штука. то, чего давно не хватало. я аж воспылал

крутейшая штука. то, чего давно не хватало. я аж в

я про документацию если что

К сожалению, там пока не получится картинку вывести. Дело в том, что там Image - это объект. Нужный нам путь - это его свойства path. Его мы можем вывести: http://joxi.ru/EA4KnbqcoxKyB2

Но картинку по этому пути мы не получим, нам надо еще путь добавить. К примеру, если путь uploads/lazy/eacfd9b91eabfc21a38dbf51d733bec0.jpg, то полный путь будет, к примеру /images/thumb/uploads/lazy/eacfd9b91eabfc21a38dbf51d733bec0.jpg или /images/big/uploads/lazy/eacfd9b91eabfc21a38dbf51d733bec0.jpg

А этого пока не получится сделать, потому что я еще не добавил функционал склеивания переменных.

Дима, привет! К сожалению, там пока не получится картинку вывести. Дело в том, что там Image - это объект. Нужный нам путь - это его свойства path. Его мы можем вывести: http://joxi.ru/EA4KnbqcoxKyB2 Но картинку по этому пути мы не получим, нам надо еще путь добавить. К примеру, если путь uploads/lazy/eacfd9b91eabfc21a38dbf51d733bec0.jpg, то полный путь будет, к примеру /images/thumb/uploads/lazy/eacfd9b91eabfc21a38dbf51d733bec0.jpg или /images/big/uploads/lazy/eacfd9b91eabfc21a38dbf51d733bec0.jpg А этого пока не получится сделать, потому что я еще не добавил функционал склеивания переменных.

Дима, привет! К сожалению, там пока не получится к

Олег, я рад, что ты оценил :)

Понял, спасибо!

Дима, не за что!

Language router

EditableObject

Фактически, это что-то похожее на одноимённый компонент из React Native. То есть, он тоже выполняет ту же функцию вывода массива объектов.

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

Фактически, это что-то похожее на одноимённый компонент из React Native. То есть, он тоже выполняет ту же функцию вывода массива объектов. Николай, у меня вопрос по шаблонизации. Как-то можно шаблонизировать сайт на Призме не используя визуальный редактор шаблонов, а в идеале вообще отключив его? Об этом есть (будет) статья?

Фактически, это что-то похожее на одноимённый комп

Павел, для этого можно тогда просто свой фронт использовать, ведь здесь сервер и фронт живут своей жизнью. Но если хочется именно использовать призму, то вероятно наилучший способ - это использовать @prisma-cms/boilerplate и изменить метод renderWrapper(), прописав свою логику. Так будет и полностью свое оформление, и унаследована основная логика и контексты.

Напомню, что @prisma-cms/boilerplate изначально планировалась как заготовка, используемая для старта проекта и дальнейшего его самостоятельного развития, так что в ней по идее можно делать что хочется.

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

Павел, для этого можно тогда просто свой фронт использовать, ведь здесь сервер и фронт живут своей жизнью. Но если хочется именно использовать призму, то вероятно наилучший способ - это использовать @prisma-cms/boilerplate и изменить метод renderWrapper(), прописав свою логику. Так будет и полностью свое оформление, и унаследована основная логика и контексты. Напомню, что @prisma-cms/boilerplate изначально планировалась как заготовка, используемая для старта проекта и дальнейшего его самостоятельного развития, так что в ней по идее можно делать что хочется. Но вообще, отказываться от фронт-редактора не стоит. На самом деле ты скорее всего пока не понял его основных фишек (в принципе, я их еще особо не раскрывал). Фронтовый редактор при правильном подходе должен решить ряд очень важных задач и быть в целом полезным. Но я согласен, что в нынешнем виде он не совсем удобен и проще писать свой код привычным способом. Но этот недостаток решается добавлением своих собственных компонентов в него (расширение списка используемых в нем модуле). Я сейчас напишу статейку про это.

Павел, для этого можно тогда просто свой фронт исп

@prisma-cms/front-editor

Добавление кастомных компонентов в @prisma-cms/front-editor

Написал статью про добавление кастомных компонентов.

Написал статью про добавление кастомных компоненто

Как сбросить кеш всех шаблонов

Вообще, кеш смарти-шаблонов должен сбрасываться при общем сбросе сайта из админки, то есть стандартная кнопка в админке есть Управление -> Очистить кеш или горячими клавишами в админке Ctrl+Shift+U. На это плагин навешен соответствующий. В крайнем случае попробуйте жесткий метод - удалить папки cache и compiled в компоненте http://joxi.ru/v29OdyEiZONNRr. Жестче нет сброса. 

Если не поможет, то скорее всего это уже вопрос кеширования на уровне MODX. Вполне кто-нибудь мог собственную логику кеширования прописать.

Вообще, кеш смарти-шаблонов должен сбрасываться при общем сбросе сайта из админки, то есть стандартная кнопка в админке есть Управление -> Очистить кеш или горячими клавишами в админке Ctrl+Shift+U. На это плагин навешен соответствующий. В крайнем случае попробуйте жесткий метод - удалить папки cache и compiled в компоненте http://joxi.ru/v29OdyEiZONNRr. Жестче нет сброса. Если не поможет, то скорее всего это уже вопрос кеширования на уровне MODX. Вполне кто-нибудь мог собственную логику кеширования прописать.

Вообще, кеш смарти-шаблонов должен сбрасываться пр

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

1) В первую очередь, это то, что он кушает много ресурсов процессора. Вот я кликаю на каком-то компоненте, у меня открывается слева панель с непонятными фреймами и 1.4 гигагерцовый процессор моей двенашки начинает мучаться. Не пойму, с чем это связано, но это заметно на прокрутке этого блока слева.

2) Я не совсем понимаю его интерфейс, в первую очередь вот этот выплывающий сайд слева. Что он делает, для чего он? Кнопочки на компонентах, что означает та или иная, ну и т.д.

P.S. Кстати, а почему кнопка "Редактировать шаблон" отображается у всех, включая не-админов?

Фишка с редактором шаблонов классная. Учитывая, что у приложений и сайтов зачастую большинство компонентов на странице переиспользуемые, то визуально размещать их куда удобнее. Только тут есть несколько моментов, которые меня очень смущают и заставляют задуматься о выпиливании этого инструмента: 1) В первую очередь, это то, что он кушает много ресурсов процессора. Вот я кликаю на каком-то компоненте, у меня открывается слева панель с непонятными фреймами и 1.4 гигагерцовый процессор моей двенашки начинает мучаться. Не пойму, с чем это связано, но это заметно на прокрутке этого блока слева. 2) Я не совсем понимаю его интерфейс, в первую очередь вот этот выплывающий сайд слева. Что он делает, для чего он? Кнопочки на компонентах, что означает та или иная, ну и т.д. P.S. Кстати, а почему кнопка "Редактировать шаблон" отображается у всех, включая не-админов?

Фишка с редактором шаблонов классная. Учитывая, чт

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

1. React dev tools. На гитхабе не мало issue создано на счет низкой производительности. Скорее всего он использует в работе deep clone + lodash или типа того. react context позволяет передавать любые объекты, в том числе и классы компонентов. И вот так как в @prisma-cms в контекстах довольно много всякого, dev tools становится очень грустным и жутко тормозит. По этой причине он у меня давно уже отключен.

2. Довольно неоптимальный базовый класс компонентов фронт-редактора. Как я и говорил в статье, там не просто this.props используется, а своя костыльная логика, и скорее всего он так же дает лишней нагрузки (но по большей степени только в режиме редактирования. В обычном режиме там особой потери нет). Но повторюсь, когда логика устаканится, займусь его перепиливанием.

3. Работа со строками. Вот глянь вот эту статью: https://habr.com/ru/post/449368/. Уверен, в итоге придется и на этот счет серьезно прошерстить код.

В общем, да, проблемы с производительностью есть, но как и говорил, позже буду их обязательно решать, уверен, можно будет значительно поправить производительность. Сейчас же в режиме редактирования (тем более в dev-режиме, а не в production mode), надо и памяти не мало (в dev надо рассчитывать на гиг-два на вкладку), и процессор помощнее. У меня core i7 и 14Gb оперативы, относительно комфортно себя ощущаю.

На счет непонятных фреймов: вот здесь я писал, что отдельные части шаблонов можно сохранять в самостоятельные сущности и потом использовать на странице. Все их можно увидеть на странице /templates. Вот в редакторе в левой панели они и выводятся. Это для того, чтобы можно было вставить уже готовые блоки на странице. Это такой своего рода minecraft - создаешь отдельные небольшие куски, их можно использовать в формировании более крупных шаблонов, те еще и так далее. При чем там есть важная особенности при вставке: если просто кликнуть какой-либо готовый шаблон, то будет на странице вставлен весь его код (то есть скопирован). А если кликнуть кнопку "Вставить с ID (Insert with ID)" http://joxi.ru/D2PeVyqhqY6KZA, то будет вставлена ссылка на этот шаблон. То есть можно в нескольких частях страницы и на разных страницах повставлять ссылки на готовый шаблон, а потом редактировать в одном месте, и везде будет выводиться актуальный код. (это частичный ответ и на пункт 2 твоего вопроса).

>> Кнопочки на компонентах, что означает та или иная, ну и т.д.

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

На счет производительности: есть такое понятие как преждевременная оптимизация. Вот здесь я ее пока избегаю. Весь этот функционал - сплошной эксперимент. Когда я его начинал, у меня были идеи и потребности, но до сих пор нет окончательной мысли как это будет выглядеть в конечном итоге. Нет смысла оптимизировать то, что постоянно меняется и переделывается. Но несколько причин проблемы с производительностью мне известны: 1. React dev tools. На гитхабе не мало issue создано на счет низкой производительности. Скорее всего он использует в работе deep clone + lodash или типа того. react context позволяет передавать любые объекты, в том числе и классы компонентов. И вот так как в @prisma-cms в контекстах довольно много всякого, dev tools становится очень грустным и жутко тормозит. По этой причине он у меня давно уже отключен. 2. Довольно неоптимальный базовый класс компонентов фронт-редактора. Как я и говорил в статье, там не просто this.props используется, а своя костыльная логика, и скорее всего он так же дает лишней нагрузки (но по большей степени только в режиме редактирования. В обычном режиме там особой потери нет). Но повторюсь, когда логика устаканится, займусь его перепиливанием. 3. Работа со строками. Вот глянь вот эту статью: https://habr.com/ru/post/449368/. Уверен, в итоге придется и на этот счет серьезно прошерстить код. В общем, да, проблемы с производительностью есть, но как и говорил, позже буду их обязательно решать, уверен, можно будет значительно поправить производительность. Сейчас же в режиме редактирования (тем более в dev-режиме, а не в production mode), надо и памяти не мало (в dev надо рассчитывать на гиг-два на вкладку), и процессор помощнее. У меня core i7 и 14Gb оперативы, относительно комфортно себя ощущаю. На счет непонятных фреймов: вот здесь я писал, что отдельные части шаблонов можно сохранять в самостоятельные сущности и потом использовать на странице. Все их можно увидеть на странице /templates. Вот в редакторе в левой панели они и выводятся. Это для того, чтобы можно было вставить уже готовые блоки на странице. Это такой своего рода minecraft - создаешь отдельные небольшие куски, их можно использовать в формировании более крупных шаблонов, те еще и так далее. При чем там есть важная особенности при вставке: если просто кликнуть какой-либо готовый шаблон, то будет на странице вставлен весь его код (то есть скопирован). А если кликнуть кнопку "Вставить с ID (Insert with ID)" http://joxi.ru/D2PeVyqhqY6KZA, то будет вставлена ссылка на этот шаблон. То есть можно в нескольких частях страницы и на разных страницах повставлять ссылки на готовый шаблон, а потом редактировать в одном месте, и везде будет выводиться актуальный код. (это частичный ответ и на пункт 2 твоего вопроса). >> Кнопочки на компонентах, что означает та или иная, ну и т.д. Для этого я и сделал отдельный сайт, чтобы описать все основные компоненты фронт-редактора. В ближайшем будущем прям в кнопки добавлю ссылки на статьи, описывающие эти элементы. И для этого я и примеры привожу, чтобы было видно на более локальных шаблонах что как работает. Постепенно документация будет на каждый элемент. Ну а так, вопросы задавайте или экспериментируйте :) И смотрите исходный код компонентов. Подключенные компоненты перечислены здесь, оттуда можно найти путь до кода каждого компонента в отдельности, чтобы изучить непосредственно его код.

На счет производительности: есть такое понятие как

>> P.S. Кстати, а почему кнопка "Редактировать шаблон" отображается у всех, включая не-админов?

Это я оставил специально, чтобы было видно редактор. А то итак не понятно что это такое, еще и видно не будет :) Но это отключается. В вызов RootConnector передай параметр clonable={false}. Тогда выводиться будет только для судо и для создателя шаблона.

>> P.S. Кстати, а почему кнопка "Редактировать шаблон" отображается у всех, включая не-админов? Забыл тебе ответить :) Это я оставил специально, чтобы было видно редактор. А то итак не понятно что это такое, еще и видно не будет :) Но это отключается. В вызов RootConnector передай параметр clonable={false}. Тогда выводиться будет только для судо и для создателя шаблона.

@prisma-cms/front-1.17.0 Значительно улучшена производительность

Кастомные условия поиска в @prisma-cms