기본 콘텐츠로 건너뛰기

11월, 2016의 게시물 표시

tutorial - radio button을 이용한 tree 구조 만들기

http://jsbin.com/cikuga/edit?html,css,output IE 호환을 위해 jQuery를 사용했다. 안해도 되지만 이 편이 그래도 좀 읽기 쉽지 않나 싶다. 접히고 펼쳐지는 트리구조를 만드는 데 있어 핵심 아이디어는 같은 깊이에 인접한(sibling ) 요소들끼리는 radio button을 사용하면 된다는 것이다. 가령 <input type="radio" name="group1"> <input type="radio" name="group1"> <input type="radio" name="group1"> 이렇게 했을 경우 같은 이름(name)을 가지고 있으므로 셋 중 하나만 radio 버튼이 들어오고 <input type="radio" name="group1"> <input type="radio" name="group2"> <input type="radio" name="group2"> <input type="radio" name="group2"> <input type="radio" name="group1"> <input type="radio" name="group1"> 이와 같이 구성하면 group2는 group2끼리 group1은 group1끼리 각각 구성할 수 있다. 따라서 각각의 radio button에 대한 id가 1   1-1   1-2 2   2-1     2-1-1     2-1-2 3 일 경우엔 1,2,3을 top 1-1, 1-2는 1 2-1은 2

Meteor DDP subscribe 처리 시 주의할 점

Meteor에서 logout 시 독특한 패턴으로 websocket이 날아오기 때문에 주의해야한다. 먼저 logout을 보내면 ["{\"msg\":\"method\",\"method\":\"logout\",\"params\":[],\"id\":\"3\"}"] 가입 되있던 모든 publish에 영향 받는 collection이 removed 된다. a["{\"msg\":\"removed\",\"collection\":\"users\",\"id\":\"ySWmTt329QeLQZTEc\"}"] 80 23:56:26.494 ......... a["{\"msg\":\"ready\",\"subs\":[\"CPSzK3DsirQq4fSmo\",\"87ojrAZZKFwu9LTeH\",\"5ynAG9oTZg7i3DMCs\",\"KZBaQRzyPiF33BoLz\",\"w3JwjFeWaFmxXiiaL\",\"ZM9oXYRjZ7cfSxvMY\",\"Q7XAmPJC35NjLdBYL\"]}"] 189 23:56:26.529 정체불명의 subs 가 array로 뭉텅 날아오고 a["{\"msg\":\"updated\",\"methods\":[\"3\"]}"] 46 23:56:26.530 logout method 에 대한 updated 와 a["{\"msg\":\"res

decaffeinate hack - Rx.js 를 import 해보자!

http://decaffeinate-project.org/repl 평소에 coffee를 좋아하지만 ecma6로 바꿔서 보여줘야 좋아하는 분들이 종종 있어서 decaffeinate를 쓰다보니 나름 console.log 만 띡 나오는게 꽤 쓰기 좋아서 자주 쓰는데. 쓰다보니 아쉬운 점이 외부 라이브러리를 불러올 수가 없어서 약간의 hack을 해보기로 했다. script = document.createElement('script') script.src = "//cdnjs.cloudflare.com/ajax/libs/rxjs/5.0.0-rc.2/Rx.js" x=document.getElementsByTagName('script')[0] x.parentNode.insertBefore script, x 단순하게 생각하면 이런 식 script tag을 하나 만들고 src를 Rx.js CDN 라이브러리로 지정하고 insertBefore를 사용해서 밀어넣으면 될거라고 생각했는데 repl.js?t=2015-03-09T08:30:22-07:00:7 Uncaught Error: module is not supported in the browser, you need a commonjs environment such as node.js/io.js, browserify/webpack etc 이런 오류가 난다. 보니까 의도적으로 decaffeinate에서 "module", "exports", "require" 이라는 말을 쓰면 저지하도록 되있더라   ["module", "exports", "require"].forEach(function(commonVar){     Object.defineProperty(window, commonVar, {       get: function () {         throw n

Bluestacks OS X를 android 개발용으로 쓰는 법

먼저 docker 를 설치했다면 꺼준다. 둘 다 가상화를 쓰는 시스템이라 충돌한다. vi ~/Library/Preferences/com.BlueStacks.AppPlayer.plist 로 들어가서 width 와 height 부분을 바꿔준다. <key>Width</key> <integer>420</integer> <key>Height</key> <integer>700</integer> 420x700 으로 바꾸면 720p 노트북에서 그럭저럭 볼만하다.