five minutes of funk, ljk.kr

var locked = 0;

function show(imagenr)
{
    if (locked) return;
    var i;
    var image;
    var el;
  var e = document.getElementById('ratetext');
  var StateMSG;

    for (i=1; i<=imagenr; i++) {
        image = 'image' + i;
        el = document.getElementById(image);
        el.src="star1.gif";
    }

  switch (imagenr) {
   case 1:
    StateMSG = "20점";
    break
   case 2:
    StateMSG = "40점";
    break
   case 3:
    StateMSG = "60점";
    break
   case 4:
    StateMSG = "80점";
    break
   case 5:
    StateMSG = "100점";
    break
   default:
    StateMSG = "";
  }
  e.innerHTML = StateMSG;
}

function noshow(imagenr)
{
    if (locked) return;
    var i;
    var image;
    var el;
 

    for (i=1; i<=imagenr; i++) {
        image = 'image' + i;
        el = document.getElementById(image);
        el.src="star0.gif";
    }
}

function lock(imagenr)
{
    show(imagenr);
    locked = 1;
}

function mark(imagenr)
{
    //show(imagenr);
    //locked = 1;
    lock(imagenr);

    var e = document.getElementById('ratetext');
   

    /* store rating on server */
    var xmlhttp;
    try {
        xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {
        // todo
    }
    //var qs = "UccPointProcess.asp?rate=" + imagenr; 
    //xmlhttp.open("GET", qs);
 
  xmlhttp.open("GET", "point_.asp?rate=" + imagenr,true);
  xmlhttp.onreadystatechange=function() {
   if (xmlhttp.readyState==4) {
    e.innerHTML = xmlhttp.responseText;
   }
  }
  xmlhttp.send(null)
}

<DIV id=rating align=center>
   <SPAN>
    <IMG id=image1 onmouseover=show(1) onclick=mark(1) onmouseout=noshow(1) src="star0.gif">
    <IMG id=image2 onmouseover=show(2) onclick=mark(2) onmouseout=noshow(2) src="star0.gif">
    <IMG id=image3 onmouseover=show(3) onclick=mark(3) onmouseout=noshow(3) src="star0.gif">
    <IMG id=image4 onmouseover=show(4) onclick=mark(4) onmouseout=noshow(4) src="star0.gif">
    <IMG id=image5 onmouseover=show(5) onclick=mark(5) onmouseout=noshow(5) src="star0.gif">
   </SPAN>
   <br/><SPAN id=ratetext>평가하기</SPAN>
 </DIV>

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

Posted by web20korea

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

Posted by web20korea

Ajax ( Asynchronous JavaScript and XML )

 ◈ 대화식 웹 어플리케이션의 제작을 위해 아래와 같은 조합을 이용하는 웹 개발 기법이다.
  - HTML (또는 XHTML) 과 CSS , DOM, 자바스크립트 , XML, XSLT, XMLHttpRequest
 ◈ Ajax는 자체가 하나의 특정한 기술을 말하는 것이 아니며, 함께 사용하는 기술의 묶음을 지칭하는 용어이다.
 ◈ Ajax 어플리케이션은 실행을 위한 플랫폼으로 위에서 열거한 기술들을 지원하는 웹 브라우저를 이용한다, 이것을 지원하는 브라우저로는 모질라 파이어폭스, 인터넷 익스플로러, 오페라, 사파리 등이 있다, 단, 오페라는 현재 XSL 포맷팅 객체와 XSLT 변환을 지원하지 않는다.

Website in  Ajax

 ◈ maps.google.com
  - Ajax로 구현된 가장 대표적인 사이트

 ◈ naver.com
  - 국내검색 포탈 네이버(엠파스 등)

 ◈  ohpy.com
  - 국내커뮤니티 사이트

테스트 구현 예제

 ◈ 회원가입 시 ID등의 체크
  - 아이디등의 중복검색 및 기존의 유요성검사부분의 사용자편의반영 기술

 ◈ 정보의 수정단계
  - 새로고침과 전체폼구분없이 개별적으로 수정가능한 기술

 ◈ 하위글 직접참조방식의 트리검색
  - 뼈대만 구현(방식만.)

 ◈ Ajax Search
  - 검색포탈 및 타 커뮤니티 사이트와 동일한 주제별(지정) 관련 단어검색

Thank you

 ◈ Outro
  - 지금까지 대략적으로 Ajax 및 Web2.0에 관한 보고를 마치겠습니다.
  - 작성하지 못한 몇몇 시도중인 기술들과 참고되어지는 여러 기술들을 미루어볼때, Web2.0환경과 Ajax, XML등의 수렴은 기존의 패러다임에서 좀더 틀을 벗어날 수 있는 기회가 될것이라고 저는 생각하며, 앞으로 저에게 주어진 기회로인한 지식들을 좀더 구체화 및 현실화시켜가면서 보다 실용적인 기술을 구현할 수 있었으면 좋겠습니다.
   - 이외에도 수많은 변화속의 웹프로그램 및 웹디자인 환경에서 서로 연대감있고 전문가적인 시각에서 여러가지 의견을 모아 나간다면 인터넷 시대를 살아가는 보다 멋진 사람들이모인 XXXXXX이 될것이라고 생각합니다.


이 글은 오픈소스 혹은 개발자의 측면만이 아닌 웹에 익숙치 않은 클라이언트도 대상에 포함되어진 내용입니다.

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

Posted by web20korea

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

Posted by web20korea

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

Posted by web20korea