Angus' Events Plugin 📅

[j.jaffeux (Joffrey Jaffeux)]

이 문제를 재현해 보겠습니다.

[Canapin (Coin-coin le Canapin)]

캘린더 페이지가 로드된 후 자바스크립트를 실행하는 방법은 무엇인가요?

---

수정: 제 상황을 설명드리겠습니다.
다음과 같은 다색 이벤트가 필요하다는 요청을 받았습니다:

플러그인의 포크를 만들고 싶지 않아서, 다음 코드를 사용하여 일부 구현했습니다.
색상은 이벤트 태그와 관련되어 있으며 기본 카테고리 색상을 대체합니다.

이벤트 HTML에 태그 목록을 다음과 같이 추가했습니다: data-tags="{{event.topic.tags}}"

<script type="text/x-handlebars" data-template-name="javascripts/components/events-calendar-event">
<div class="{{event.classes}}" data-tags="{{event.topic.tags}}" {{action 'selectEvent' event.topic.url}} style="{{event.listStyle}}">
  {{#unless event.allDay}}
    <span style='{{event.dotStyle}}'>{{d-icon 'circle'}}</span>
  {{/unless}}
  {{#if event.time}}
    <span class="time">{{event.time}}</span>
  {{/if}}
  {{#if event.title}}
    <span class="title" style="{{event.titleStyle}}">{{replace-emoji event.title}}</span>
  {{/if}}
</div>

{{#if showEventCard}}
  {{events-calendar-card topic=event.topic selectEvent="selectEvent"}}
{{/if}}
</script>

스트라이프 패턴을 생성합니다:

<script type="text/discourse-plugin" version="0.8.23">
api.onPageChange((url, title) => {
    // tags colors
    let colors = {muni: "#91D0B5", road: "#8ABBE2", freestyle: "#CFB3D3"};

    let events = document.getElementsByClassName("event");
    for (var i = 0; i < events.length; i++) {
        let event = events[i];
        let gradient = "";
        let tags = event.getAttribute("data-tags").split(",");
        for (j = 1; j <= tags.length; j++) {
            gradient +=
                ", " +
                colors[tags[j - 1]] +
                " " +
                j * 8 +
                "px, " +
                colors[tags[j - 1]] +
                " " +
                (j * 8 + 8) +
                "px";
        }
        event.style.background = "repeating-linear-gradient(-45deg" + gradient + ")";
    }
});
</script>

그리고 CSS를 조금 추가했습니다.

결과:
태그 2개인 이벤트:

태그 3개인 이벤트:

제가 겪는 문제는 제 자바스크립트가 페이지 변경 시 실행되는데, 캘린더가 동적으로 콘텐츠를 로드하기 때문에 이전/다음 달의 이벤트에는 스트라이프 색상이 적용되지 않는다는 것입니다.

10월에 있으면서 "다음"을 두 번 클릭하여 12월로 이동하면 다음과 같이 표시됩니다:

이 때문에 캘린더 콘텐츠가 로드되었을 때 제 JS가 실행되기를 원합니다.

[Canapin (Coin-coin le Canapin)]

다른 방법을 시도하여 /assets/javascripts/discourse/lib/date-utilities.js.es6 파일의 eventsForDay 함수를 수정함으로써 줄무늬 효과를 구현했습니다:

다음 줄을:

let tStyle = `width:calc((100%*${daysInRow}) - ${buffer}px);background-color:#${topic.category.color};`;

아래 내용으로 교체했습니다:

let tStyle = `width:calc((100%*${daysInRow}) - ${buffer}px);`;

그리고 다음 코드를 추가했습니다:

if (topic.tags.length > 0) {
  let colors = {muni: "#91D0B5", road: "#8ABBE2", freestyle: "#CFB3D3"};
  let gradient = "";
  for (let i = 1; i <= topic.tags.length; i++) {
    gradient +=
      ", " +
      colors[topic.tags[i - 1]] +
      " " +
      i * 8 +
      "px, " +
      colors[topic.tags[i - 1]] +
      " " +
      (i * 8 + 8) +
      "px";
  }
   attrs['listStyle'] += `background:repeating-linear-gradient(-45deg ${gradient});`;
}

이 방식은 제가 원하는 효과를 훨씬 더 깔끔하게 구현해 줍니다. 하지만 플러그인의 포크를 만들어야 하는 번거로움 없이 이 함수나 파일을 오버라이드하는 방법을 알지 못합니다…

[GuidoD (Guido Drehsen)]

플러그인이 최신 Discourse 버전과 호환되지 않는 것 같습니다.
재빌드 로그 파일 내용:

1: from /var/www/discourse/lib/plugin/instance.rb:417:in block in notify_after_initialize' /var/www/discourse/plugins/discourse-events/plugin.rb:190:in block in activate!': uninitialized constant #Class:0x0000562a2a10fa90::SCOPES
Did you mean? Sprockets (NameError)

** 호환되지 않는 플러그인 **

/var/www/discourse/plugins/discourse-events에 있는 플러그인 오류로 인해 Discourse 빌드가 불가능합니다.

해당 플러그인을 제거한 후 다시 빌드해 보시기 바랍니다!

[GuidoD (Guido Drehsen)]

Discourse의 문제였으며 플러그인의 문제는 아닌 것 같습니다.
최신 Discourse 베타 버전에서는 플러그인이 다시 작동합니다.

[mentalstring (Paulo)]

현재 최신 안정판 Discourse를 최신 events 플러그인과 함께 다시 빌드할 수 없다는 것을 확인했습니다.

불행히도 tests-passed로 전환할 수 없습니다. 이 유형의 문제를 피하기 위해 정확히 stable 브랜치를 선택한 것이기 때문입니다. 이 문제를 조사하고 있는 사람이 있을까요?

v2.5.2(이전에 작동하던 버전)로 다시 빌드해 보았지만 동일한 오류로 실패하므로, 문제가 어디에 있는지 정확히 알 수 없습니다. 컨테이너를 가리킬 수 있는 특정 커밋(플러그인 또는 stable Discourse의)이 있을까요?

[fzngagan (Faizaan Gagan)]

당사의 지원 정책은 discourse_docker의 기본 설정이 해당 버전이기 때문에, 최신 tests-passed 버전의 discourse와의 호환성을 보장하는 것입니다. 다만, Pavilion 계열 플러그인을 사용하는 사용자 중 discourse의 stable 브랜치를 사용하는 사용자가 얼마나 되는지 파악하고 싶습니다.

또한, 가까운 시일 내에 이벤트 플러그인을 비추천(deprecate)하고, 대신 discourse 팀의 이벤트 플러그인을 사용할 예정입니다.

[mentalstring (Paulo)]

개발자들이 Discourse의 미래를 위해 호환성을 유지해야 한다는 점은 이해합니다. 그건 당연한 일이지요. 하지만 플러그인에 안정적인 브랜치가 없다면, 사용자가 안정적인 환경을 구축하려고 할 때, 자신들이 사용하지 않는 베타 버전 때문에 설정이 깨지는 상황이 발생하게 됩니다.

호환성을 깨뜨린 커밋에 대해 팁이 있을까요? 해당 커밋을 기반으로 작업해 볼 수 있지만, 어떤 변경 사항이 이런 문제를 일으켰는지는 모르겠습니다.

추가로: 이 문제로 어려움을 겪고 임시 해결책이 필요한 분들을 위해, 이 커밋이 원인으로 보입니다.

[fzngagan (Faizaan Gagan)]

Webcal API 키 관련 문제가 발생했으나, 현재 해결되었습니다.

리포트해 주셔서 감사합니다 @md-misko

[GuidoD (Guido Drehsen)]

다시 한번 이 플러그인이 최신 discourse 릴리스 2.6.0.beta5 ( 2bb7676ba4 )와 호환되지 않는 것으로 보입니다.
이번에는 사이트에 접속하면 단순히 빈 페이지만 표시됩니다. 하지만 지난번과 달리 admin/upgrade를 사용할 때 오류는 발생하지 않았습니다.
플러그인을 비활성화하고 컨테이너를 재빌드한 후 Discourse는 다시 정상적으로 작동하고 있습니다.

[JadeNorthrup]

안녕하세요, 이 Events 플러그인이 이 페이지처럼 게시글 상단에 “캘린더에 추가” 링크를 생성하나요?

https://community.namati.org/t/asia-pacific-justice-for-all-webinar-series/78084

또한, 2021년 현재 이 Pavilion Events 플러그인과 공식 Calendar 플러그인 중 어떤 것을 사용해야 하는지에 대한 여러분의 의견은 어떤가요?

주요 관심사는 캘린더에서 주제별 뷰를 쉽게 집계하는 방법을 찾는 것이며, 또한 사용자가 개별 이벤트를 자신의 Google / .ics 캘린더에 추가할 수 있는 기능도 갖추고 싶습니다.

감사합니다.

[angus (Angus McLeod)]

안녕하세요,

@JadeNorthrup

또한, 2021년 현재 이 Pavilion Events 플러그인과 공식 Calendar 플러그인 중 어떤 것을 사용하는 것이 좋다는 의견이 있나요?

OP(원문)에서 언급했듯이

Discourse 팀이 만든 새로운 Discourse Calendar 플러그인의 이벤트 기능이 사용자에게 적합한지 잠시 고려해 보시기 바랍니다. 필요에 부합한다면 해당 플러그인 사용을 권장합니다. 이 플러그인을 사용해야 하는 경우는 이미 Discourse Calendar를 먼저 고려해 본 경우에만 해야 합니다.

가능하다면 Discourse Calendar 플러그인을 사용하시기를 권장합니다. 우리는 해당 플러그인으로 충족되지 않는 특정 사용 사례에 대해서만 이 플러그인을 지원합니다. 다행히도 Calendar 플러그인에는 언급하신 두 가지 기능이 모두 포함되어 있습니다.

@JadeNorthrup

이 Events 플러그인은 이 페이지처럼 게시물 상단에 “캘린더에 추가” 링크를 생성하나요?

네, 맞습니다. 그것이 바로 이 플러그인의 기능입니다. 하지만 aforementioned 대로, Discourse Calendar에 적합한 사용 사례가 있는 것으로 보이므로, 해당 플러그인 사용을 제안합니다.

내부적으로도 우리는 이 플러그인 대신 Discourse Calendar 플러그인을 사용하여 멤버들의 이벤트를 관리하고 있습니다. 일부 클라이언트를 위한 특정 사용 사례에 대해서는 지원을 제공하며, 혹시 특정 사용 사례가 있으시면 말씀해 주시면 좋지만, 그 외에는 없습니다.

[JadeNorthrup]

Angus님, 감사합니다. 조언을 모두 읽었고, 해당 Legal Empowerment Network 커뮤니티를 설정하는 데 직접 관여하신 것 같아서 특별히 여쭤본 거예요. 커뮤니티가 잘 운영되고 있어서 좋았거든요. 하지만 공식 캘린더 플러그인을 추천해 주신다니 기쁩니다. 그쪽을 한번 살펴보겠습니다.

[JackALaing]

공식 Discourse 캘린더 플러그인에는 주제 목록에 있는 “Agenda” 필터와 유사한 기능이 없다는 내 이해가 맞나요? 주제 내 이벤트 날짜 기준으로 주제 목록을 정렬하는 기능은 제가 가장 중요하게 생각하는 주요 사용 사례 중 하나입니다. 이벤트 관리보다는 프로젝트 관리(주제를 작업으로 취급하고 그에 따라 일정표를 작성하는 방식)에 더 중점을 두고 있습니다.

[T.C_MacNevin]

이런 것도 추가해 보는 걸 고려하고 있어요. 혹시 해결책을 생각해 보셨나요?

제 생각은 이렇습니다: 각 이벤트는 토픽을 고정하는 것과 같은意义上的 '답글’로 취급되어야 합니다. ‘이벤트 추가’ 버튼은 해당 토픽의 모든 이벤트를 나열하는 드롭다운 메뉴로 변경됩니다.

[fzngagan (Faizaan Gagan)]

확인해서 다시 말씀드리겠습니다.

[fzngagan (Faizaan Gagan)]

이 플러그인에 대한 새로운 기능을 개발하지 않습니다. discourse-calendar 플러그인의 공식 이벤트(Official Events) 기능을 대신 사용하기 위해 이 기능을 비활성화(deprecated)했습니다.

[fzngagan (Faizaan Gagan)]

공식 플러그인에는 아직 어젠다 스타일의 주제 목록이 없는 것 같습니다.

[downey (Michael Downey)]

Pavilion 에 있던 내용이 이전된 새 링크가 있는지 아시는 분 계신가요?

이 플러그인이 제한된 카테고리에서 실행될 때 다음이 표시됩니다:

… 하지만 문서 링크가 깨져 있어 404 오류가 발생합니다. 해당 사이트와 이 사이트에서도 찾아보았지만, 이 사용자 안내가 다른 곳에 있는지 몰랐습니다.

[fzngagan (Faizaan Gagan)]

어떤 이유로든 해당 주제를 폐쇄된 카테고리로 옮긴 상태입니다. 공개 카테고리로 되돌려야 합니다. 논의한 후 곧 알려드리겠습니다.

p.s.
페이지가 이제 복구되었을 것입니다.