━━━━ ◇ ━━━━
DEVELOPMENT

아보카도 에디션 - 구글 캘린더 연동 스케쥴 페이지

1. 시작에 앞서

구글의 장점은 역시 구글 그 자체가 이 시대에 가장 거대한 플랫폼이라는 점이라고 생각한다. 

그 어떤 라이브러리가 구글API와의 연동을 지원하지 않겠어...

아이폰을 사용하면서도 아이폰 내장 캘린더를 사용하는 것이 아니라 아이폰 캘린더 앱에 구글 캘린더를 연동시켜 사용하는 것이 훨씬 편리하다. 애플놈들이 그리 호락호락 넘겨줄 리가 없는데도. 

 

구글 API를 사용하면서 단 한번도 안 되는 거 아닌가? 라는 걱정을 해본 적이 없다.

뭐든 보여주고 뭐든 가져가게 해준다. 네이버 캘린더처럼 꽁꽁 싸매는 것이 아니라. 

...요즘은 또 아슬아슬하긴 하지만.

 

구글 캘린더 자체에서 제공하는 iframe 코드는 못생겼다.

보기에도, 관리하기에도, 보안에도 좋을지 몰라도. 

 

애초에 내가 외형을 신경쓰지 않았다면 개인 홈페이지 작업을 시작하지도 않았을테고 디자인도 글도 그림도 코딩도 하는 놀러오세요 휘핑크림 카페 떡볶이가 맛있어요 밤에 와인바를 여는 이 되지 않았을 것이다...

 

괜찮은 라이브러리를 찾아 며칠간 docs를 뜯어보고 열어보고 적용해보고 해봄. 

...물론 FullCalendar만. 나를 계속 피말리게 한 건 따로 있고. ToolTip이라고.

 

FullCalendar는 version update가 될 때마다 휙휙 바뀌어서 Fullcalendar측에서 제공하는 문서가 아닌 다른 게시글들은 다 쓰지도 못하는 코드들이 되어버렸다. 스택 오버플로우나 다른 블로그에서 본 함수를 실행시키면 undefined라고 해버리니... 저기요 그거 1년전엔 당신 함수였거든요!?

 

 

 

 

 

 

2. 적용 페이지

 

 

 

FullCalendar/Avocado Edition

 

 

 

 

 

 

 

이번에도 슬쩍 아보카도 에디션과 그누보드를 열고 mysql에게 노크해서 자리 좀 내어달라고 했다. 추가하는 것 자체는 상관 없는데 후에 새로 에디션을 설치할 때도 사용할 수 있게 mysql 설치 파일도 고치는 건 좀 귀찮단 말이지... 하지만 css파일 열어가면서 하나하나 찾으면서 또 이게 무슨 색이고 무슨 색이고 찾는 것보단 한번 일 이렇게 하는 게 낫다. 

물론 이렇게 말할 수 있는 건 결국 다 했기 때문이다. 

 

할때만 해도 너무 하기 싫어서 평생 갠홈 색 안 고치고 말지 하고 땡깡부렸음. 

 

 

 

 

 

 

3. 옵션-ToolTip

 

 

 

 

지옥의 tooltip. 내가 하고 싶은 건 어? 마우스 올리면 information 뜨고! 치우면 사라지고! 

 

1. 온갖 모든 Fullcalendar 자료에서 나오는 tooltip의 경우 지금의 Fullcalender.v5에서 지원하지 않음. 

2. 그래서 또 Tippy.js를 써서 가져오려고 하니 이제 또 html서식이 적용이 안됨. 

3. 그 와중에 mouseover 이벤트 함수 이름도 또 바뀌어서 한창 docs 들여다봄 

 

그래도 어떻게든 해결했음. 어떻게든 사람은 방법을 떠올리게 되고...... 하지만 tooltip theme custom을 한창 들여다보고 뒤집고 하다가 태생적인 한계를 깨닫고 원색으로 밀어버린 건 아마 죽기 전에도 누워있다가 빌어먹을 Tippy 내가 졌다고 생각마라! 이럴 것 같다... 내가 하고 싶었던 건 header를 분리해서 색을 따로 넣는 거였는데........ 이것 또한 Tippy의 태생적인.... 뭐시기겠지... 일부만 색칠할 수 있게....

 

...

...

...

이거 포스트 쓰다가 생각했는데 background color를 내가 혹시 gradient로 주면 원하는 이미지가 되지 않을까? 

하지만 하지 않는다. 절대로. 난... 하지 않을 것이다... 이미 충분히 맘에 들어... 진짜임 거울 보고 스스로를 좀 세뇌하고 오겠음 

 

그리고 또 삽질을 했던 건 이거. 

 

견련론 스케쥴 (duration) / 하이미라 (all-day) 스케쥴 표현 방식의 차이. 

 

난 너무 하이미라처럼 표시를 하고 싶은데 (사실 구글 캘린더의 저런 모양에 익숙해져 있고) 그런데 계속해서 2pm 견련론처럼 떠서... 너무 화가 나서 머리를 쾅쾅 책상에 박았는데 포기를 하니 마음이 좀 나아졌다. 

 

그리고 숫자 표시 포멧을 좀 입맛따라 바꿨더니 보기도 좋고. (사실 구글 캘린더나 윈도우10 내장 캘린더를 따라간 감이 없지않아 있지만.) 

 

툴팁 적용을 하기 전의 시험적인 calendar 적용은 이미 이 티스토리에 자동봇 스케쥴 페이지로 구현을 해봤고. 티스토리... 좋아... css 파일을 건들 수 있다는 점에서... js도 넣을 수 있다는 점에서... 포스타입과 다른 자유로움... 포스타입에다가 iframe으로라도 넣고 싶어서 거의 기어다녔는데 포기했던 과거를 떠올림... 거의 유사 github.io가 아닌가... (내가 좀 늦은 거겠지만...) 브런치도 괜찮다는데... 

 

 

 

 

 

 

4. 옵션-List

 

 

 

 

여기도 툴팁을 적용해두긴 했다. 뭘 넣고 뺄지 무척이나 고민했던 기억이 난다. list도 저번주, 다음주 일정으로 돌릴 수 있는데 그러면 그 위의 GridView와 일정이 어긋나서... 너무 고민을 하다가 아예 이번주 일정만 뜨게 했던 것 같다. 

 

사실 이것도 정확히는 내 티알 일정보단 커미션 스케쥴 리스트업을 하고 싶었는데... 자동봇의 경우 nn일동안 지속되는 all-day 스케쥴이기 때문에 내가 원했던 것은 이번주 일정 : 커미션A / 커미션B 였는데 정작 나오는 건 이번주 일정: 커미션A(월) / 커미션A(화) / 커미션A(수)... 였기 때문에...

 

...역시 스스로 타협을 잘 봐야 할듯. 

 

 

 

 

 

 

5. 앞으로의 과제

캘린더의 경우 그누보드 자체 기능인 내용(content)에서 구현을 하는데 페이지같은 경우에는 멤버 접근 설정이 어렵네... 메뉴에 간단하게 표현하고 싶어서 조금 꼼수를 써서 옮겨뒀는데... content의 DB table을 좀 바꾸고 바꾸는 김에 겸사겸사 멤버란도 비슷하게 허가된 자만 접근 가능하게끔... 해봅시다. 

 

아무튼 애매하게 눈만 높아져가지고 css 하는데 시간 다 잡아먹음 

 

그리고 차근차근 구현중인 아보카도 에디션 미니룸 스킨... 기능적인 것은 (드래그 및 드롭, 자동 위치 저장 등...) 전부 어 이게 되네? 했으니 차근차근 코딩하는 일만 남았음 그게 손을 단순히 놀려야 하는 건데 너무 힘들어서 그런 거지... 아자아자 닥쳐오는 것들 어떻게든 쳐내고 있다 난 할 수 있다 파이팅!!!! 

 

COMMENT