'분류 전체보기'에 해당되는 글 107건
- 2014.01.27 cordova 3.X 사용방법정리
- 2014.01.18 도플광어의 backbone.js 강좌 - 2. model part2
- 2014.01.01 누군가와 같이 가는길.txt
- 2013.11.25 dunio 사용법
- 2013.10.26 웹스톰 우석대학교 라이센스키
- 2013.10.24 html5 스프라이트툴 프리미엄 버전
- 2013.09.14 html5 스프라이트툴 2
- 2013.09.14 html5 게임엔진 라이브러리모듈
- 2013.08.12 자바스크립트의 apply,call 그리고 bind
- 2013.04.30 아이폰으로 주파수분석해보기 - 1
cordova 3.X 에서는 커멘트라인 툴의 사용 순서가 매우 중요합니다.
1. 프로잭트 생성
2. 플랫폼 추가
3. 플러그인 추가
4. 플랫폼별 프로잭트 준비(prepare)
위 순서를 꼭지키셔야 제데로 프로잭트 생성이 됩니다.
1. 프로잭트 생성
cordova create myapp com.gbox.myapp myapp
프로 잭트 생성후 생선된 myapp폴더로 이동합니다.
2. 플랫폼 추가
안드로이드와 아이폰을 추가합니다.
cordova platform add ios android
3. 플러그인 추가
로그출력과 디바이스 정보를 얻어오는 플러그인을 추가 하도록 하겠습니다.
cordova plugin add org.apache.cordova.console org.apache.cordova.device
4. prepare
www/index.html 파일을 다음과 같이 수정합니다.
<!DOCTYPE html>
<html>
<head>
<title>Device Properties Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for device API libraries to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// device APIs are available
//
function onDeviceReady() {
var element = document.getElementById('deviceProperties');
element.innerHTML = 'Device Model: ' + device.model + '<br />' +
'Device Cordova: ' + device.cordova + '<br />' +
'Device Platform: ' + device.platform + '<br />' +
'Device UUID: ' + device.uuid + '<br />' +
'Device Version: ' + device.version + '<br />';
console.log('hello console');
}
</script>
</head>
<body>
<p id="deviceProperties">Loading device properties...</p>
</body>
</html>
그런후에 다음 명령을 실행합니다.
cordova prepare
ios 로 싱행시키려면 xcode 로 myapp/platforms/ios/myapp.xcodeproj 파일을 엽니다. 그리고 run을 합니다.
android 로 실행시키려면 platform/android 을 adt 로 엽니다.
'html5' 카테고리의 다른 글
| How to make cordova 3.X plugin (only android) (0) | 2014.06.08 |
|---|---|
| querySelector 팁 몇가지 (0) | 2014.04.05 |
| 도플광어의 backbone.js 강좌 - 2. model part2 (0) | 2014.01.18 |
| 자바스크립트의 apply,call 그리고 bind (0) | 2013.08.12 |
| 도플광어의 Backbone.js 강좌 1. 모델 (0) | 2012.11.08 |
이전 강좌에서 모델객체를 상속받아 객체를 초기화하고 기본적인 기능을 전반적으로 다뤄 보았습니다. 강좌를 쓴 시점이 저도 백본을 막 도입해서 쓴 시기라서 제데로 이해를 하지못하고 쓴부분이 있어서 하나 하나 다시 집어 보며 자세히 다시 써볼 계획입니다.
이번에는 백본오브잭트의 멤버에 접근하는 기초적인 방법에 대해서 자세히 알아보도록 하겠습니다.
백본으로 만든 오브잭트의 멤버에 접근하기 위해서는 get,set 함수를 사용할 수 있습니다.
var Person = Backbone.Model.extend({
initialize: function() {
console.log('wellcome');
console.log(this.attributes.name);
//console.log(this.name);
}
});
Person 은 변수이지만 동시에 객체를 선언하는 클래스입니다. 자바스크립트는 프로토타입방식의 객체지향언어이기때문에 이와같이 클래스 기반 언어와는 다른 특징이 있습니다.
백본의 Model.extend 함수로 백본모델로부터 상속받은 프로토타입핑클래스오브잭트(객체를 찍어낼수있는 객체 개념 정도?)를 만들수 있습니다.
var person = new Person({name: 'tom', age: 37, children: ['lyn']});
Person을 가지고 인스턴스 오브잭트를 만들었습니다. person 은 Person의 인스턴스 입니다.
console.log(person.get('name'));
console.log(person.attributes.name);
get('name') 또는 attributes.name 로 값을 읽을 수 있습니다. 두 문장은 완전히 같은 일을 합니다.
person.attributes.job = 'js developer'
person.set('job','js developer');
set 함수로 값을 써넣을 수 있습니다.
person.name = 'tommy' 와 같이 값을 직접 넣을수도있지만 그렇게 되면 백본에 의해서 관리 밭을 수 없습니다.
예를 들어 이렇게 되면 name 이라는 멤버를 다루기 위해서 set,get 함수를 사용할 수 없습니다.(물론 person에 붙어서 존재는 합니다.)
그리고
attributes 로 직접 접근하는 것보다는 get,set 을 써서 간접적으로 접근하는 편이 좀더 유연하게 코드를 관리할거같습니다.
'html5' 카테고리의 다른 글
| querySelector 팁 몇가지 (0) | 2014.04.05 |
|---|---|
| cordova 3.X 사용방법정리 (0) | 2014.01.27 |
| 자바스크립트의 apply,call 그리고 bind (0) | 2013.08.12 |
| 도플광어의 Backbone.js 강좌 1. 모델 (0) | 2012.11.08 |
| jquery mobile 터치감 개선 시키기 (0) | 2012.11.04 |
(사진출처 : https://twitter.com/RheaStrike)
인생은 앞이 잘 보이지 않는 험난한길을 걸어 가는것과 같다.
밤처럼 어둡고 낮처럼 피곤하며 겨울처럼 춥다.
그럴때 누군가 함께 가지고 손을내민다.
때론 그손길을따라 길을 걷기도 하지만 이내 더욱어둡고 추운 인생의 구렁텅이로 가는길이라는 걸알게된다.
그사람이 나쁜게 아니라 생각없이 따라간 내가 나쁜것이다.
그동안 수업료는 많이 냈다.
앞으론 정말 정신줄놓지말자...
그리고
내가 본 빛을 향해 좀 더 어른처럼 꿋꿋이 걸어가자
'광어생각' 카테고리의 다른 글
| 지난 10년을 돌이켜 보며 (0) | 2019.02.18 |
|---|---|
| 절차적프로그래밍과 객체지향프로그래밍 한줄요약 (0) | 2016.08.04 |
| html5와 구원에 대하여 #1 (1) | 2016.01.06 |
듀이노는 아두이노를 노드로 제어하기 위한 클라이언트 프래임웍입니다.
듀이노에는 가상머신 코드가 구현 되어 있습니다. 사실 노드용 라이브러리를 사용하는것보다는 이 코드 체계만 그대로 사용하는편이 더 낫습니다.
시리얼포트로 직접 명령코드를 날려 사용하면 됩니다.
다운로드 받은후 src/du.ino 파일을 아두이노에 올려 사용합니다.
코드 정리
명령어는 다음과 같습니다.
00pinMode01digitalWrite02digitalRead03analogWrite04analogRead97ping98servo99debug
한번에 9~11바이트 단위로 명령어가 전달됩니다.
!로 시작 하고 그다음 2바이트는 명령어코드 그다음 2바이트는 핀번호 다음 3바이트는 입력값(0~255)입니다.
디지털의 경우는 0이면 low, 0이상이면 high입니다.
마지막은 마침표로 명령어가 끝났다는것을 알립니다.
void loop() {while(Serial.available() > 0) {char x = Serial.read();if (x == '!') index = 0; // startelse if (x == '.') process(); // endelse messageBuffer[index++] = x;}}
.표 까지 씨리얼포트에서 값을 얻어온 다음 process() 에서 전송받은 문자열을 해석합니다.
다음은 가장 핵심이 되는 process함수의 소스 부분입니다.
-------------------
/** Deal with a full message and determine function to call*/void process() {index = 0;strncpy(cmd, messageBuffer, 2);cmd[2] = '\0';strncpy(pin, messageBuffer + 2, 2);pin[2] = '\0';if (atoi(cmd) > 90) {strncpy(val, messageBuffer + 4, 2);val[2] = '\0';strncpy(aux, messageBuffer + 6, 3);aux[3] = '\0';} else {strncpy(val, messageBuffer + 4, 3);val[3] = '\0';strncpy(aux, messageBuffer + 7, 3);aux[3] = '\0';}if (debug) {Serial.println(messageBuffer);}int cmdid = atoi(cmd);// Serial.println(cmd);// Serial.println(pin);// Serial.println(val);// Serial.println(aux);switch(cmdid) {case 0: sm(pin,val); break;case 1: dw(pin,val); break;case 2: dr(pin,val); break;case 3: aw(pin,val); break;case 4: ar(pin,val); break;case 97: handlePing(pin,val,aux); break;case 98: handleServo(pin,val,aux); break;case 99: toggleDebug(val); break;default: break;}}
------------------
98 서보의 경우 val 값은 서보 명령어가 되고 aux 값이 데이터 값이 됩니다.
서보를 포함 핑,디버그 등 90번대 이상명령어의 경우는
cmd(2)pin(2)val(2)aux(3)
9 바이트 명령어가 됩니다.
서보의 val 값의 종류는 아래와 같습니다.
00: detach
01: attach
02:write
03:read
서보 다루기 예>
9번 포트 제어
!980901000. 포트 깨우기(attach)
!980902045. 45 각도로 이동
!980900000. 포트 잠자기(detach)
99 디버거는 처음명령어코드 중간 val(빨간 배경) 값만 사용됩니다.
디버거 켜기 !990011000.
디버거 끄기 !990000000.
pinMode 의 경우는 0이면 OUTPUT, 0이 아니면 INPUT 입니다.
구현 함수는 다음과 같습니다.
/** Set pin mode*/void sm(char *pin, char *val) {if (debug) Serial.println("sm");int p = getPin(pin);if(p == -1) { if(debug) Serial.println("badpin"); return; }if (atoi(val) == 0) {pinMode(p, OUTPUT);} else {pinMode(p, INPUT);}}
예>
!0113001.
! : 시작
01 : digitalWrite
13 : 핀번호
001 : high
. : 명령 종료
'컨버젼스' 카테고리의 다른 글
| node.js 로 raspberry sound system 만들기 (0) | 2014.05.02 |
|---|---|
| how to arduino wifi-shield firmware upgrade (for macOS 10.9) (0) | 2014.04.22 |
| 아이폰으로 주파수분석해보기 - 1 (0) | 2013.04.30 |
| pc 또는 맥에서 아두이노 BT Shiled 세팅하기 (2) | 2013.01.17 |
| node.js 용 opencv 와 camera 모듈 설치하기 (0) | 2012.11.20 |
내용을 보시려면 비밀번호를 입력하세요.
내용을 보시려면 비밀번호를 입력하세요.
tinyEditor v0.2
'etc > 수업 보조 자료' 카테고리의 다른 글
| 웹스톰 우석대학교 라이센스키 (0) | 2013.10.26 |
|---|---|
| html5 스프라이트툴 프리미엄 버전 (0) | 2013.10.24 |
| html5 게임엔진 라이브러리모듈 (0) | 2013.09.14 |
| Mingw에 맞게 eclipse 세팅하기 (0) | 2011.03.17 |
| cube 그리기 (0) | 2010.06.08 |
내용을 보시려면 비밀번호를 입력하세요.
씨언어로 객체지향을 하던때가 있었습니다. 방법은 간단 했습니다.
함수의 첫번째 인자로 스트럭쳐 객체를 넣어주고 두번째 인자부터는 그 함수의 실제 인자 값을 넣어주는 것입니다.
사실 이방법은 씨뿐만 아니라 어셈블러 심지어 코볼이나 포트란에서도 비슷하게 썻었습니다.
자바스크립트의 함수도 기본적으로 그기능을 지원 해주는 함수객체의 멤버들이 있습니다.
apply
call
이 두가지 함수들은 서로 비슷한기능을 합니다. 다만 차이가 있다면 인자전달 방식을 배열로 해주는 apply 와 직접 해주는 call이 있습니다.
object.foo(인자들,..,...)
과
foo.call(object,인자들,..,...)
두개는 서로 완전히 일치합니다.
<script>
var x = 10;
function foo() {
console.log(this.x);
}
foo();
var obj = {x:12};
foo.apply(obj); //12가 출력 됩니다.
var obj2 = {x:18}
foo.call(obj2); //18 가 출력 됩니다.
</script>
다음으로 인자들을 넘겨주는 예를 알아보도록 하겠습니다.
<script>
var name = 'bill';
function foo(msg,msg2) {
console.log(msg + ' ' + msg2);
console.log(this.name);
}
foo('normal call','default');
var obj = {
name : 'steve'
}
foo.call(obj,'call function','object'); //인자를 그냥 전달합니다.
foo.apply(obj,['apply function','object']); //인자를 배열형태로 전달 합니다.
</script>
그럼 call이나 apply같은 건 왜 쓰일까요?
평소에는 쓸이유가 거의 없지만 객체를 상속받았을때 부모클래스의 함수를 호출하고 싶을때 응용할 수 있습니다.
show : function {
superclass.show.call(this);
}
bind 에 대해서 알아보도록 합시다.
기본적으로 핸들러로 호출되는 람다함수들의 this는 전역객체이기 때문에
타이머라든지 이밴트 핸들러의 콜백함수로 호출이될때도 특정 객체와 연결하여 this를 유지 하고싶을때 bind 함수를 사용해서 해결할 수 있습니다.
fun.bind(object,arg1,....argn)
<script>
var a = 'global this'
function test() {
this.a = 'that this';
function test2() {
console.log(this.a);
}
var _test2 = test2.bind(this);
//global this 가 찍힌다.
test2();
setTimeout(test2,1);
//아래 2개는 모두 같은 결과
//test2.apply(this);
//_test2();
//that this 가 찍힌다.
//타이머같은 콜백 함수로도 응용 가능함
setTimeout(_test2,1);
}
var obj = new test();
</script>
bind 는 인자로 넘겨준 객체에 연결된 새로운 함수객체를 반환한다.
콜백 함수를 특정 객체와 연결하고 싶을 때 사용한다.
처음에 호출된 test2 에서 사용된 this는 전역 객체 이지만 두번째 bind를 통해서 만들어진 _test2 에 있는 this 는 test 함수로컬 객체가 된다.
참고 :
call ,apply 에 관한글
bind 에 관한글
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
'html5' 카테고리의 다른 글
| cordova 3.X 사용방법정리 (0) | 2014.01.27 |
|---|---|
| 도플광어의 backbone.js 강좌 - 2. model part2 (0) | 2014.01.18 |
| 도플광어의 Backbone.js 강좌 1. 모델 (0) | 2012.11.08 |
| jquery mobile 터치감 개선 시키기 (0) | 2012.11.04 |
| 백본(Backbone.js) 강좌를 시작하며... (0) | 2012.10.28 |
내용을 보시려면 비밀번호를 입력하세요.
