go.tools present hack

Go에 대해 Gree techtalk #6에서 이야기했습니다.그때 Gootools present를 사용했어요.
용도에 적합하지 않은 부분이 많기 때문에 하나의 예로 들자.
일반적인 풀이가 아니어서 아무 소용이 없을 수도 있으니 참고하세요.

의 목적

고의 좋은 발표 도구를 사용해서 즐기고 싶다

배경.

코드를 쓰면서 자료를 만들었기 때문에 시간이 별로 없어요

니코가 생방송으로 보낸 편지가 있어서 영상 보낸 사람과 동기화하고 싶어요

go.tools present 과제

1) 작은 문자 크기

2) 레이아웃을 자세히 지정할 수 없음

3) 웹 소켓의 동기화가 지원되지 않음

솔루션

present 코드를 변경하는 방법밖에 없으니까 그걸로 대응할게요.
이에 따라 Goo-talks.appspot.com 호스트 방법으로 사용할 수 없지만 어쩔 수 없어요.

질문 1) 작은 문자 크기

회사 내부를 향한 토크를 했을 때 글자 사이즈가 작다는 지적 수정이 있었기 때문이다.
cmd/present/static/styles.article를 만들다

-  font-size: 26px;
-  line-height: 36px;
+  font-size: 38px;
+  line-height: 42px;

h3 크기 변경

-  font-size: 30px;
+  font-size: 40px;

이번에는 오히려 글자가 너무 커서 입력할 수 없어 글자 크기를 줄이는 서식이 추가됐다.

질문 2) 배치를 자세히 지정할 수 없음

goo present는 이미지 파일을 다음 형식으로 표시할 수 있지만 레이아웃을 지정할 수는 없습니다.

  .image file.png _ _

어쩔 수 없었기 때문에 Align을 지정할 수 있도록 간단한 수정을 했습니다
cmd/present/templates/action.tmpl

   +  <img src="{{.URL}}"{{with .Height}} height="{{.}}"{{end}}{{with .Width}} width="{{.}}"{{end}} {{with .Align}} align="{{.}}"{{end}}>

diff -r ca10bbb8fab3 present/code.go
--- a/present/code.go   Tue Sep 16 16:24:52 2014 -0400
+++ b/present/code.go   Thu Sep 25 11:16:24 2014 +0900
@@ -238,6 +238,12 @@
                        res[i] = v
                case '$':
                        res[i] = "$"
+               case 'r':
+                       res[i] = "right"
+               case 'c':
+                       res[i] = "center"
+               case 'l':
+                       res[i] = "left"
                case '_':
                        if len(v) == 1 {
                                // Do nothing; "_" indicates an intentionally empty parameter.
diff -r ca10bbb8fab3 present/image.go
--- a/present/image.go  Tue Sep 16 16:24:52 2014 -0400
+++ b/present/image.go  Thu Sep 25 11:16:24 2014 +0900
@@ -17,6 +17,7 @@
        URL    string
        Width  int
        Height int
+       Align string
 }

 func (i Image) TemplateName() string { return "image" }
@@ -43,6 +44,16 @@
                if v, ok := a[1].(int); ok {
                        img.Width = v
                }
+       case 3:
+               if v, ok := a[0].(int); ok {
+                       img.Height = v
+               }
+               if v, ok := a[1].(int); ok {
+                       img.Width = v
+               }
+               if v, ok := a[2].(string); ok {
+                       img.Align = v
+               }
        default:
                return nil, fmt.Errorf("incorrect image invocation: %q", text)
        }

많은 배경 지정이 번거로움을 감안하여 1100x700의 그림을 준비하여 슬라이드&article을 배경으로 지정하였습니다.

질문 3) 웹 소켓의 동기화가 지원되지 않음

니코생 슬라이드로 수동 주유를 보여준다고 해서 불쌍해서 먼저 넣었어요.
조작원의 연결과 피조작측의 연결을 어떻게 판별할지 망설일 때, 어쨌든 먼저query parameter로 판별하도록 합니다.
열심히 할 때는 Oauty 같은 걸로 인증하는 게 좋은데 이 정도면 다른 도구가 돼요.

diff -r ca10bbb8fab3 cmd/present/local.go
--- a/cmd/present/local.go  Tue Sep 16 16:24:52 2014 -0400
+++ b/cmd/present/local.go  Thu Sep 25 11:19:26 2014 +0900
@@ -17,7 +17,11 @@
    "os"
    "runtime"
    "strings"
+   //"time"
+// "bytes"
+// "io"

+   "code.google.com/p/go.net/websocket"
    "code.google.com/p/go.tools/playground/socket"
    "code.google.com/p/go.tools/present"
 )
@@ -91,6 +95,48 @@
    }
    http.Handle("/static/", http.FileServer(http.Dir(basePath)))

+   connections := make(map[int]*websocket.Conn)
+
+   http.Handle("/slave", websocket.Handler(func(ws *websocket.Conn) {
+       fmt.Printf("w: %s\n", ws.RemoteAddr().String())
+       id := len(connections)
+       connections[id] = ws
+
+       for {
+           var in []byte
+           if err := websocket.Message.Receive(ws, &in); err != nil {
+               delete(connections, id)
+               return
+           }
+
+           for _, con := range connections {
+               websocket.Message.Send(con, string(in))
+               fmt.Printf("Send: %s\n", string(in))
+           }
+       }
+   }))
+   http.Handle("/master", websocket.Handler(func(ws *websocket.Conn) {
+           key := ws.Request().URL.Query().Get("master")
+           if key != "%%PUT YOUR KEY HERE%%" {
+               fmt.Printf("master is not same: %s\n", key)
+               return
+           }
+
+           fmt.Printf("accept master connection\n")
+           for {
+               var in []byte
+               if err := websocket.Message.Receive(ws, &in); err != nil {
+                   return
+               }
+
+               for _, con := range connections {
+                   websocket.Message.Send(con, string(in))
+                   fmt.Printf("Send: %s\n", string(in))
+               }
+           }
+       }))
+
+
    if !ln.Addr().(*net.TCPAddr).IP.IsLoopback() &&
        present.PlayEnabled && !*nativeClient {
        log.Print(localhostWarning)
diff -r ca10bbb8fab3 cmd/present/static/slides.js
--- a/cmd/present/static/slides.js  Tue Sep 16 16:24:52 2014 -0400
+++ b/cmd/present/static/slides.js  Thu Sep 25 11:19:26 2014 +0900
@@ -9,6 +9,21 @@
 var PM_TOUCH_SENSITIVITY = 15;

 var curSlide;
+var masterws;
+var slavews;
+
+var urlParams;
+(window.onpopstate = function () {
+    var match,
+        pl     = /\+/g,  // Regex for replacing addition symbol with a space
+        search = /([^&=]+)=?([^&]*)/g,
+        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
+        query  = window.location.search.substring(1);
+
+    urlParams = {};
+    while (match = search.exec(query))
+        urlParams[decode(match[1])] = decode(match[2]);
+})();

 /* ---------------------------------------------------------------------- */
 /* classList polyfill by Eli Grey
@@ -204,6 +219,9 @@
   if (curSlide > 0) {
     curSlide--;

+    if (masterws) {
+      masterws.send("{\"page\": " + curSlide + "}")
+    }
     updateSlides();
   }
 };
@@ -212,10 +230,19 @@
   if (curSlide < slideEls.length - 1) {
     curSlide++;

+    if (masterws) {
+        masterws.send("{\"page\": " + curSlide + "}")
+    }
     updateSlides();
   }
 };

+function gotoSlide(slide) {
+    curSlide = slide;
+    updateSlides();
+};
+
+
 /* Slide events */

 function triggerEnterEvent(no) {
@@ -495,6 +522,21 @@
   } else {
     document.addEventListener('DOMContentLoaded', handleDomLoaded, false);
   }
+
+  // websocket slide control
+  if (urlParams["master"]) {
+      masterws = new WebSocket("ws://" + window.location.host +  "/master?master=" + urlParams["master"])
+  }
+
+  slavews = new WebSocket("ws://" + window.location.host +  "/slave")
+  slavews.onmessage = function(msg) {
+      d = JSON.parse(msg.data)
+      if (d) {
+          gotoSlide(d.page)
+      } else {
+          console.log("AREEE")
+      }
+  }
 }

 // If ?debug exists then load the script relative instead of absolute

힘이 낮은 것은 사람들의 호감을 끄는 것이다.이것도 전날에 뒀어요.

기타

QoS 관련 애니메이션도 전날 관전 포인트가 됐다.Flash + Create.js + iframe.
보면 알 수 있듯이 애니메이션 능력은 없지만 QoS는 이해하기 쉽잖아요.
네가 먼저 놓아줘서 다행이다.채워봤습니다.
create.제이스가 뱉은 파일을 가지고 놀아서 iframe로 도망가기 귀찮아요.
학과별 발표키트를 미리 알아본 적이 없어서 그런 느낌이 들어요.
파워포로 찰칵찰칵 하기보다 생각할 게 적어져 편집이 수월하다.
이날aws에서nacl와playground가 유효한 상태로 편지를 보낼 것입니다.활동 끝나고 플레이그라운드 님께서...
무효로 자신의 서버에 놓으면 끝입니다.
이러면 pdf로 쓰면 너무 좋아요.
끝맺다