'2010/03'에 해당되는 글 3건

  1. 2010/03/17 귀차니스트 Textcube 에서 XQuared 에디터를 쓰면서 Hooriza님의 Codehilight 사용
  2. 2010/03/13 귀차니스트 Dovelet - (1)
  3. 2010/03/09 귀차니스트 Script Interpreter - boost::spirit

  안녕하세요 오늘은 수업이 끝난 후 간단한 삽질을 통하여 아주 예전에 해결하지 못했던 부분을 해결하여 이렇게 올려봅니다. 예전에 Xquared라는 Springnote에서 사용하는 편집기가 Textcube에서 사용이 가능하게 된 플러그인이 올라왔다고 얘기를 드린 적이 있었습니다. 그리하여 그 플러그인을 적용을 시켰었는데 기존에 사용하던 Hooriza님의 Codehilight 플러그인이 제대로 적용되지 않고 깨지는 문제점이 있었다고 알려드렸던 적도 있었죠.

  그런데 오늘 수업을 마치고 약간 삽질을 해봤습니다. 글은 몇 개 없는 블로그이지만 그래도 2년 정도 된 블로그다 보니 차근차근 글을 쓸 예정이고 해서 수정을 시도를 했었습니다. 그리고 기존에 시도했었던 소스를 웹상에 백업폴더로 저장을 해놓았기에 이를 참고하여 제대로 적용을 완료시켰습니다.

 

Hooriza 님의 Codehilight 플러그인의 호출점 수정

  먼저 Hooriza님의 플러그인에서 Editor에 Html코드를 삽입하는 호출점을 수정하여야 합니다.

ch_main.js (Language : html4strict)
  1. success : function(html) {
  2.     var code = "<br />" + html + "<br />";
  3.     try {
  4.         wnd.xed.insertCodeHilightHtml(code);
  5.         setTimeout(function() { window.close(); }, 10);
  6.     } catch(e) {
  7.         alert("객체를 삽입하는 도중에 에러가 발생하였습니다");
  8.         alert(code + ", " + e.description + ", " + e.source);
  9.     }            
  10. }

  위 코드에서 wnd.xed.insertCodeHilightHtml 이라는 부분이 수정된 부분입니다. 기존의 코드는 이와 같이 되어 있지 않고, Editor.InsertObject인가 그런 것으로 적혀져 있었죠. 그러다보니 없는 메소드를 호출하게 되고 try~catch구문에 걸려 에러메시지만 표시되는데 이와 같이 수정할 경우 뒤에서 만들어줄 insertCodeHilightHtml 함수를 호출하게 됩니다.

 

XQuared - Editor의 개체삽입함수 수정

  원래 XQuared에서 제공하는 Editor.js 파일의 에디터는 insertTemplate 이라는 함수를 제공합니다. 그런데 실제로 이 것을 사용하면 이상한 에러가 뜨면서 제대로 실행이 되지 않는 것을 알 수 있는데요. 그리하여 예전에 수정했었던 소스에서는 아래의 함수를 수동으로 추가를 시켜 주었습니다.

Editor.js (Language : html4strict)
  1. /**
  2.  * Inserts HTML template
  3.  * @TODO: Add selenium test
  4.  *
  5.  * @param {String} html Template string. It should have single root element
  6.  * @returns {Element} inserted element
  7.  */
  8. insertTemplate: function(html) {
  9.     return this.rdom.insertHtml(this._processTemplate(html));
  10. },
  11. /**
  12.  * Inserts HTML
  13.  * @TODO: Add selenium test
  14.  *
  15.  * @param {String} html Template string. It should have single root element
  16.  * @returns {Element} inserted element
  17.  */
  18. insertCodeHilightHtml: function(html) {
  19.     return this.rdom.insertCodeHilightHtml(html);
  20. }

  위 함수에서 insertCodeHilightHtml함수를 만듬과 동시에 내부의 함수에서 this.rdom.insertCodeHilightHtml이라는 멤버함수를 불러주는 까닭은 실제 내용을 처리하는 함수가 rdom에 존재하기 때문입니다. insertHtml이 기존에 문제가 있었기 때문에 새로 인터페이스를 만든 것이죠.

rdom/base.js (Language : html4strict)
  1. /**
  2.  * Inserts given html into current caret position
  3.  *
  4.  * @param {String} html HTML string
  5.  * @returns {Node} Inserted node. It could be different with given node.
  6.  */
  7. insertHtml: function(html) {
  8.     return this.insertNode(this.createElementFromHtml(html));
  9. },
  10. /**
  11.  * Inserts given html into current caret position
  12.  *
  13.  * @param {String} html HTML string
  14.  * @returns {Node} Inserted node. It could be different with given node.
  15.  */
  16. insertCodeHilightHtml: function(html) {
  17.     return this.insertNode(this.createCodeHilightHtml(html));
  18. }
rdom/base.js (Language : html4strict)
  1. /**
  2.  * Creates element from HTML string
  3.  *
  4.  * @param {String} html HTML string
  5.  * @returns {Element} Created element
  6.  */
  7. createElementFromHtml: function(html) {
  8.     var node = this.createElement("div");
  9.     node.innerHTML = html;
  10.     if(node.childNodes.length < 1) {
  11.         throw "Illegal HTML fragment";
  12.     }
  13.     return this.getFirstChild(node);
  14. },
  15. /**
  16.  * Creates element from HTML string
  17.  *
  18.  * @param {String} html HTML string
  19.  * @returns {Element} Created element
  20.  */
  21. createCodeHilightHtml: function(html) {
  22.     var node = this.createElement("div");
  23.     node.innerHTML = html;
  24.     return node;
  25. }

 두 번째 블럭에서 CodeHilightHtml을 수정함과 밑의 체크 구문을 제거한 것으로 createCodeHilightHtml함수를 만들었습니다. 이렇게 하면 제대로 JavaScript 함수 단에서의 호출문제는 제거가된 것인데요. 이렇게 하여 Textcube 에서 Hooriza 님 플러그인을 사용하게 된다면 FIELDSET, LEGEND가 제거되어 글을 작성 후 제대로 표시되지 않는 문제점이 존재합니다. 

 

Whitelist에 Html태그 추가

  Javascript함수를 하나씩 디버깅하여 추적을 해본 결과 해결방법을 찾게 되었습니다. 위 까지는 예전에 진행했었던 단계였던지라 이 번에 적을 것이 점심시간 후 시도했던 방법이라고 보시면 됩니다. 여기서는 xquared.js 파일을 열어서 해당 부분을 찾아봅시다.

xqurared.js (Language : html4strict)
  1. /**
  2.  * Pre-defined whitelist
  3.  */
  4. xq.predefinedWhitelist = {
  5. .
  6. .
  7. .

  이 부분을 찾으셨으면 아래로 내린 뒤, 아래 코드와 같이 해당 tag를 추가하면 됩니다.

xqurared.js (Language : html4strict)
  1. .
  2. .
  3. .
  4.    'var':         xq.commonAttrs.concat(),
  5.    'fieldset':      xq.commonAttrs.concat(),
  6.    'legend':            xq.commonAttrs.concat()
  7. };

  이렇게 추가하신 뒤, 사용하시면 짜잔 제대로 표시가 됩니다. 물론 var는 기존에 존재하던 것이라 fieldset, legend 부분만 추가하시면 되구요^^. 지금 남기는 이 글 또한 문제를 해결한 Editor로 글을 남기는 것이라 감회가 남다르네요.

크리에이티브 커먼즈 라이센스
Creative Commons License
2010/03/17 14:54 2010/03/17 14:54

댓글을 달아 주세요

Dovelet - (1)

Algorithm 2010/03/13 00:42 귀차니스트

  알고리즘 테스트 사이트 인 Dovelet.com 입니다.
문제가 엄청 쉬운 것도 있고 어려운 것도 있는 듯 해 보이는데요.. 어제 2시간 정도 오늘 한 5시간 정도 투자하여 쉬운 쪽의 문제를 많이 풀어보았습니다. 대략 70여 문제를 풀었는데.. 이제는 조금 지치네요.. 나중에 차근차근 진행을 해봐야 겠습니다.

사각형 넓이 구하기
삼각형 넓이 구하기
네 수의 평균
두수의 교환
섭씨온도를 화씨온도로 변환
몫과 나머지 구하기
거스름 돈
손해 본 금액
퓨 즈
대소 판별하기
분수 크기 비교
수영장 가는 날
윤 년
중위수
삼각형 성립 조건
사주 팔자
해킹 회사
팀 구성
지하 차도
점수 맞추기
등차/등비 수열
축소 복사
조건 연산자
오버랩
달의 날수(switch 예제)
별 출력
순차 출력
구구단
7 개 합
끼리끼리 합
홀 수
순차 합
팩토리얼 구하기
순차 합II
최대 값
최소 값
달에서 무게
화학 실험
최대,최소값 출력
복리법
가장 부지런한 농부
약수 출력
3*n+1
완전 수
학 점
완전수,부족수,과잉수
총합,최대,최소
최대공약수,최소공배수
소수(prime number)
서로 소
중간 수
speed limit
세자리수 곱셈
수 추측하기
number steps
두 수의 연결
직각 삼각형 (별)
역 직각 삼각형I (별)
역 직각 삼각형II (별)
E 출력(별)
거울에 비친 E(별)
네모(별)
F 출력(별)
T 출력(별)
H 출력(별)
쾌걸 조로 (별)
삼각형 (별)
다이아몬드 (별)
54321
b54321
주사위 던지기 I
주사위 던지기 II
완전수 출력

어려운 문제는 푸는데 시간이 조금씩 걸릴 듯 하네요.. 차근차근 계속해서 풀어볼 생각입니다. 다들 한 번 풀어보시길 바랍니다.^^;

풀어본 문제 중 하나를 적어보도록 하겠습니다.

프로그램 명: center1
제한시간: 1 초
1 부터 n-1 까지의 합이 n+1,n+2,... 의 합과 같을 때 n 을 중간수라 한다.
예를 들어 , 4 는 1+2+3=6 이고 5 부터 차례대로 더해갈 때 5+6=11 이므로 4 는 중간수가 될 수 없다.

6 은 1+2+3+4+5=15 이고 7+8=15 이므로 6 은 중간수이다.

정수 하나를 입력으로 받아 중간수 인지를 판별하는 프로그램을 작성하시오.

입력

10,000 이하의 자연수가 입력으로 주어진다.

출력

중간수이면 O , 아니면 X 를 출력한다.

입출력 예

입력

6

출력

O

입력

10

출력

X

보충 설명

35 는 중간수
  • 1 + 2 + ... + 34 = 595
  • 36 + 37 + ... + 49 = 595
크리에이티브 커먼즈 라이센스
Creative Commons License
2010/03/13 00:42 2010/03/13 00:42

댓글을 달아 주세요

Script Interpreter - boost::spirit

Programming 2010/03/09 02:57 귀차니스트

  이번에는 boost에 존재하는 spirit을 사용하여 간단한 스크립트 언어의 Interpreter를 만들어보게 되었습니다. 예전에 IPangYa 를 비롯하여 PangCal 프로그램을 만들 때 잠시 사용하였던 라이브러리를 다시 사용하게 되었는데요, 예전엔 문법적인 체크만 했었는데 이번엔 그래도 파서라는 이름에 맞게 인터프리터를 만들어보게 되었네요.

문법

명령문 -> if, while, 변수선언문, 변수대입문

if -> if(판별식) { 명령문 } else { 명령문 }

while -> while(판별식) { 명령문 }

판별식 -> 수식 비교연산자 수식

비교연산자 -> == != < >

변수선언문 -> var 변수이름

변수대입문 -> set 변수이름 = 수식

수식 =  +, -, *, /

 = (), 숫자, var:변수이름

 

예시

변수선언

ex) var abc

    abc 변수를 선언

변수대입

ex) set abc=100

    abc 변수에 100을 대입

if

ex) if(1==1) { 명령문 }

          1 1의 값이 동일할 때 명령문 실행

    if(var:a==var:b) { 명령문 }

변수a 값과 변수b 값이 동일할 때 명령문 실행

    if(a==b) { 명령문 }

변수a 값과 변수b 값이 동일할 때 명령문 실행

    else { 명령문 }

추가적으로 뒤에 붙을 수 있음

while

ex) while(a<1000) { 명령문 }

변수a 값이 1000보다 작을 동안 명령문 실행

  위와 같은 문법을 지원하는 스크립트 언어 입니다. 사실 너무 간단한 스크립트 언어라 어떻게 이름을 지정할 것도 없지만요^^; 사용은 무척 쉽게 되었습니다. 사실 boost::spirit에 존재하는 함수에서 abstract parser tree를 만들어주기 때문에 해당 트리를 기반으로 평가함수를 실행하면 되기 때문이죠^^. 이번에는 C Interpreter를 만들어보려고 하고 있습니다. C++ 은 template가 있어서 그 부분은 불가능 할 것 같고 차라리 C 를 만들어보기로 했습니다. 이 부분은 완성이 천천히 진행이 될 것 같군요. 아래는 제가 만들었던 스크립트 언어의 룰입니다.

Identifier = token_node_d[(alpha_p >> *alnum_p)];
Message = '"' >> token_node_d[*(anychar_p - '"')] >> '"';
Program = *Expression;
Expression = discard_node_d[space_p] | IfExpression
| WhileExpression
| VarExpression
| CallExpression
| NumericExpression
| AssignExpression;

AssignExpression = str_p("set")
>> token_node_d[+space_p]
>> LValue
>> discard_node_d[*space_p]
>> '='
>> discard_node_d[*space_p]
>> RValue;

RValue = NumericExpression
| Message
| Identifier;

LValue = Identifier;

ComparisonOperator = str_p("==") | str_p("!=") | str_p("<") | str_p(">");

BooleanExpression = (RValue
>> discard_node_d[*space_p]
>> ComparisonOperator
>> discard_node_d[*space_p]
>> RValue);

IfExpression = str_p("if")
>> discard_node_d[*space_p]
>> '('
>> discard_node_d[*space_p]
>> BooleanExpression
>> discard_node_d[*space_p]
>> ')'
>> discard_node_d[*space_p]
>> '{'
>> discard_node_d[*space_p]
>> Program
>> discard_node_d[*space_p]
>> '}'
>> !( discard_node_d[*space_p]
>> "else"
>> discard_node_d[*space_p]
>> '{'
>> discard_node_d[*space_p]
>> Program
>> discard_node_d[*space_p]
>> '}');

WhileExpression = str_p("while")
>> discard_node_d[*space_p]
>> '('
>> discard_node_d[*space_p]
>> BooleanExpression
>> discard_node_d[*space_p]
>> ')'
>> discard_node_d[*space_p]
>> '{'
>> discard_node_d[*space_p]
>> Program
>> discard_node_d[*space_p]
>> '}';

VarExpression = str_p("var")
>> token_node_d[+space_p]
>> Identifier
>> *( discard_node_d[*space_p]
>> discard_node_d[ch_p(',')]
>> discard_node_d[*space_p]
>> Identifier);

CallExpression = str_p("call")
>> token_node_d[+space_p]
>> Identifier
>> discard_node_d[*space_p]
>> '('
>> discard_node_d[*space_p]
>> !Arguments
>> discard_node_d[*space_p]
>> ')';

Arguments = RValue
>> *( discard_node_d[*space_p]
>> discard_node_d[ch_p(',')]
>> discard_node_d[*space_p]
>> RValue);

CallVal = str_p("var:") >> Identifier;

NumericExpression = Term
>> *(   (ch_p('+') >> Term)
|   ('-' >> Term));

Term = Factor
>> *(   ('*' >> Factor)
|   ('/' >> Factor));

Factor =   int_p
|CallVal
|   '(' >> NumericExpression >> ')'
|   ('-' >> Factor)
|   ('+' >> Factor);

 위와 같은 룰로 구성이 되어있습니다.  앞으로 C Interpreter를 구성하게 된다면 여러모로 여기저기 붙여서 써먹을 일이 많을 듯합니다^^. 아마 제가 제작하는 OS에도 사용이 가능하게 될지도 모르겠네요^^; 가능했으면 좋겠는데.. 그럼 직접 적은 글은 별로 없는 영양가 없는 포스팅을 줄이도록 하겠습니다. 다음에 뵙겠습니다.
크리에이티브 커먼즈 라이센스
Creative Commons License
2010/03/09 02:57 2010/03/09 02:57

댓글을 달아 주세요