텍스트 영역의 텍스트 서식을 지정하는 코드 단추를 어떻게 구현합니까?

Question

그래서 내 블로그에 StackOverflow 자신의 MarkdownSharp을 사용하고 있습니다. 이제 코드 버튼을 정확히 여기에 구현하고 싶습니다. 그 버튼이 눌려 졌을 때 발생하는 자바 스크립트를 찾을 수없는 것 같습니다. 누구든지 클릭 할 때 실행되는 코드 나 ctrl + k를 누르면 코드 조각을 알 수 있습니까? 사전에 http://www.codetunnel.com/codebutton.jpg

감사 :

다음은 내가 말하는 겁니다 어떤 버튼을 모르는 경우를 대비 스크린 샷입니다!

UPDATE

나는 SO의 wmd.js 파일과 unminified 그것의 소스를 복사. 그런 다음 메모장에서 특정 핵심 텍스트를 검색했습니다. 이 파일의 변수 이해하기 불가능하다, 혼자 읽게하지만이를 발견했다 : 나는 텍스트없이 버튼을 클릭하면에 텍스트 "여기에 코드를 입력"을 삽입 강조된 것을 깨달았을 때

c.doCode = function (v, u) { 
    var w = /\S[ ]*$/.test(v.before); 
    var s = /^[ ]*\S/.test(v.after); 
    if ((!s && !w) || /\n/.test(v.selection)) { 
     v.before = v.before.replace(/[ ]{4}$/, function (x) { 
      v.selection = x + v.selection; 
      return "" 
     }); 
     var t = 1; 
     var r = 1; 
     if (/\n(\t|[ ]{4,}).*\n$/.test(v.before)) { 
      t = 0 
     } 
     if (/^\n(\t|[ ]{4,})/.test(v.after)) { 
      r = 0 
     } 
     v.skipLines(t, r); 
     if (!v.selection) { 
      v.startTag = " "; 
      v.selection = "enter code here" 
     } else { 
      if (/^[ ]{0,3}\S/m.test(v.selection)) { 
       v.selection = v.selection.replace(/^/gm, " ") 
      } else { 
       v.selection = v.selection.replace(/^[ ]{4}/gm, "") 
      } 
     } 
    } else { 
     v.trimWhitespace(); 
     v.findTags(/`/, /`/); 
     if (!v.startTag && !v.endTag) { 
      v.startTag = v.endTag = "`"; 
      if (!v.selection) { 
       v.selection = "enter code here" 
      } 
     } else { 
      if (v.endTag && !v.startTag) { 
       v.before += v.endTag; 
       v.endTag = "" 
      } else { 
       v.startTag = v.endTag = "" 
      } 
     } 
    } 
}; 

내가 그것을 발견 편집자. 그런 다음 해당 텍스트를 검색하여 해당 스 니펫을 발견했습니다. 머리 또는 꼬리를 만들 수있는 사람은 누구입니까?

코드 버튼을 원한다면 전체 편집기를 원하지 않습니다. 나는 나머지를 덜 걱정할 수있다.

Answer 1

그래서 많이 검색 한 결과 필자는 편집자를 완전히 찾았으며 모두 주석을 달았습니다. 그것은 어려운 형사 작업 이었지만 나는 그것을 작동 시켰고 지금 나의 사이트는 완전한 일하는 WMD 편집기를 가지고있다. 내 블로그에 내 경험을 역사에 :

http://www.CodeTunnel.com/blog/post/30/finding-and-implementing-the-wmd-editor

난 내 자신의 저장소에 소스를 업로드하고 AJAX를 통해로드 형태로 멋지게 연주를 수정 계획을 가지고있다.

내가 원하는 것은 코드 버튼 이었지만,이 편집기는 매우 간단하고 대부분의 기능이 마음에 들었으므로 링크 된 블로그 게시물에서 설명하는 약간의 조정만으로 모든 것을 구현했습니다.

command.doCode = function (chunk, postProcessing, useDefaultText) { 

    var hasTextBefore = /\S[ ]*$/.test(chunk.before); 
    var hasTextAfter = /^[ ]*\S/.test(chunk.after); 

    // Use 'four space' markdown if the selection is on its own 
    // line or is multiline. 
    if ((!hasTextAfter && !hasTextBefore) || /\n/.test(chunk.selection)) { 

     chunk.before = chunk.before.replace(/[ ]{4}$/, 
      function (totalMatch) { 
       chunk.selection = totalMatch + chunk.selection; 
       return ""; 
      }); 

     var nLinesBefore = 1; 
     var nLinesAfter = 1; 


     if (/\n(\t|[ ]{4,}).*\n$/.test(chunk.before) || chunk.after === "") { 
      nLinesBefore = 0; 
     } 
     if (/^\n(\t|[ ]{4,})/.test(chunk.after)) { 
      nLinesAfter = 0; // This needs to happen on line 1 
     } 

     chunk.addBlankLines(nLinesBefore, nLinesAfter); 

     if (!chunk.selection) { 
      chunk.startTag = " "; 
      chunk.selection = useDefaultText ? "enter code here" : ""; 
     } 
     else { 
      if (/^[ ]{0,3}\S/m.test(chunk.selection)) { 
       chunk.selection = chunk.selection.replace(/^/gm, " "); 
      } 
      else { 
       chunk.selection = chunk.selection.replace(/^[ ]{4}/gm, ""); 
      } 
     } 
    } 
    else { 
     // Use backticks (`) to delimit the code block. 

     chunk.trimWhitespace(); 
     chunk.findTags(/`/, /`/); 

     if (!chunk.startTag && !chunk.endTag) { 
      chunk.startTag = chunk.endTag = "`"; 
      if (!chunk.selection) { 
       chunk.selection = useDefaultText ? "enter code here" : ""; 
      } 
     } 
     else if (chunk.endTag && !chunk.startTag) { 
      chunk.before += chunk.endTag; 
      chunk.endTag = ""; 
     } 
     else { 
      chunk.startTag = chunk.endTag = ""; 
     } 
    } 
}; 

나는 내가 찍은되지 않아 파일에 다른 코드에 따라 얼마나 많은이 기능의 확실하지 않다 :

여기에 코드 버튼의 조각이다, 내 특정 질문에 대답하려면 그것을 검사 할 시간이지만 코드 단추 작업을 수행하는 것은 분명히 청크입니다.

완성 된 제어

http://www.CodeTunnel.com/WMDEditor.jpg http://www.CodeTunnel.com/WMDEditor.jpg

나는/누군가가 찾아 볼 정확한 코드를 게시하거나이 기능을 가지고 통합하는 올바른 소스 코드 파일에 대한 포인터를 제공하고 싶습니다