위키낱말사전:JavaScript & CSS

도움말(색인) · FAQ · 자유게시판 · 질문방 · 편집실 · 위키문법

이 문서는 한국어 위키낱말사전에 쓰이는 다음의 자바스크립트 및 포맷에 관한 문제점 및 개선책을 위해 마련되었습니다. «Monobook»은 화면 구성을 위하여 쓰이는데, 사용자의 취향에 따라 바꿀 수 있습니다. 반면에 «Common»은 한국어 위키낱말사전의 모든 사용자에게 적용됩니다.

• MediaWiki:Common.js
• MediaWiki:Monobook.css
• MediaWiki:Common.css

p-cactions

• MediaWiki:Monobook.css
• 화면 맨 위의 위키낱말사전, 토론, 편집... 따위를 나타내는 칸.

 #p-cactions li {
	padding-top: 2px !important;
	background-color: #F1F1F1;
	}
 #p-cactions li.selected a {
	padding-top: 2px !important;
	background-color: #EEEEEE;
	}

• 문제점: 웹브라우저에 따라 달리 나타나며 칸의 크기 조절이 까다롭다.

#p-cactions li a -> #p-cactions li {...} --아흔(A-heun) 2008년 4월 19일 (토) 09:10 (UTC)

category pages

• MediaWiki:Common.css
• '분류'가 카테고리 페이지 첫머리에 나타나지 않도록 제거.

• 참조: 미디어위키 메시지

.ns-14 * h1.firstHeading { display: none !important; }

잘못된 스크립트: «.ns-15»을 같이 넣어서는 안된다.

InterProject

• MediaWiki:Common.js
• 위키프로젝트(백과, 책, 공용)으로 링크시키기
• 아래의 영어 위키낱말사전의 스크립트는 완벽하지 않은 것으로 보인다.

function Projectlinks() {
  var elements = new Array();
  var spans = document.getElementsByTagName('span');
  // filter for projectlinks
  for (var i=0, j=0; i<spans.length; i++) {
   if (spans[i].className == 'interProject') {
    elements[j] = spans[i].getElementsByTagName('a')[0];
     j++;
    }
   }
 // sort alphabetically
 function sortbylabel(a,b) {
  // get labels
  a = a.innerHTML.replace(/^.*<a[^>]*>(.*)<\/a>.*$/i,'$1');
  b = b.innerHTML.replace(/^.*<a[^>]*>(.*)<\/a>.*$/i,'$1');
  // return sort order
  if (a < b) return -1;
  if (a > b) return 1;
   return 0;
  }
  elements.sort(sortbylabel);
  // create navbox
  var sidebar_style = "background-color: #FFFFFC; color: #000000; font-size: 10pt;";
  var links_description = "위키백과에 수록된 낱말";
  if (j) {
    var plheader = document.createElement('h5');
        plheader.appendChild(document.createTextNode('위키 프로젝트'));
    var plbox = document.createElement('div');
        plbox.setAttribute('class','pBody');
        plbox.setAttribute("title", links_description);
   var pllist = document.createElement('ul');
   for (var i=0; i<elements.length; i++) {
    var plitem = document.createElement('li');
        plitem.appendChild(elements[i]);
        pllist.appendChild(plitem);
    }
    plbox.appendChild(plheader);
    plbox.appendChild(pllist);
    plbox.setAttribute("style", sidebar_style);
    document.getElementById("p-tb").appendChild(plbox);
   }
  }
 addOnloadHook(Projectlinks);

• 아래의 스크립트는 독일어 낱말사전 (참조: Bug 708)

 function $(ID) { return document.getElementById(ID); }
 document.write('<style type="text/css">#interProject, #sisterProjects {display: none; speak: none;} #p-tb .pBody {padding-right: 0;}<\/style>');
 function iProject() {
  if ($("interProject")) {
   var iProject = $("interProject").innerHTML;
   var interProject = document.createElement("div");
   var interProjectstyle = "margin-top: .1em; background-color:#006398;; font-size:10pt;";
   var interProjectdescription = "위키프로젝트의 낱말로 인터 링크 시키기"
   interProject.setAttribute("style", interProjectstyle)
   interProject.setAttribute("title", interProjectdescription)
   interProject.innerHTML = '<h5>위키 프로젝트<a href="/wiki/위키낱말사전:위키 프로젝트"><\/a><\/h5><div class="pBody" style = "background-color:#EEF9FF; font-size:10pt;">'+iProject+'<\/div>';
   $("p-tb").appendChild(interProject);
  }
 }
 addOnloadHook(iProject);

• 문제점: 등록 사용자와 비등록 사용자에 따라 링크가 화면에 보이기도 하고 안 보이기도 한다. 이 경우에는 캐시에 문제가 있기 때문이며 대개 몇일 뒤에 이 문제가 사라진다.
• 태그 <a href='/wiki/위키낱말사전:위키 프로젝트'></a>는 portlet 색깔 때문에 달리 조정.

보기: 한국어, Korean --아흔(A-heun) 2008년 4월 19일 (토) 09:58 (UTC)

자유게시판 바탕색

• MediaWiki:Common.js

다음 스크립은 토론 페이지인 자유게시판의 바탕색을 토론 문서 바탕색인 연노랑으로 바꿉니다.

 function WiktionaryTalkpage() {
  if(document.title.search && (document.title.search("위키낱말사전:자유게시판") != -1 ))
   document.body.className = "ns-1";
 }
 addOnloadHook(WiktionaryTalkpage);

Pagecounter.js

• Programmer: w:de:User:LeonWeber
• 수록된 문서를 편집자가 검토하였는지 점검하는 스크립.

 var disable_counter = 0;
 var counter_factor = 500; 
  function pgcounter_setup() {
   if(disable_counter == 0) {
    var url = window.location.href;
    if(Math.floor(Math.random()*counter_factor)==42)  // the probability thing	{
     if(wgIsArticle==true || wgArticleId==0) {
      var pgcountNs = wgCanonicalNamespace;
      if(wgCanonicalNamespace=="") { pgcountNs = "0";	}
      var cnt_url = "http://pgcount.wikimedia.de/index.png?ns=" + pgcountNs + "&title=" + encodeURI(wgTitle) + "&factor=" + counter_factor + "&wiki=dewiki";
      var img = new Image(); 
      img.src = cnt_url;
     }
    }
   }
  }
 pgcounter_setup();

h1.firstHeading display none

• MediaWiki:Common.css

body.page-위키낱말사전_대문 h1.firstHeading { display: none !important;  }
body.page-위키낱말사전_자유게시판 h1.firstHeading { display: none !important;  }

« 위키낱말사전_자유게시판 »은 이 트릭이 통하지 않는 것으로 보인다. --아흔(A-heun) (토론) 2008년 8월 15일 (금) 12:35 (UTC)

• MediaWiki:Common.js

/* 대문 제목 숨기기 */
 var mpTitle = "위키낱말사전:대문";
 var isMainPage = (document.title.substr(0, document.title.lastIndexOf(" - ")) == mpTitle);
 var isDiff = (document.location.search && (document.location.search.indexOf("diff=") != -1 || document.location.search.indexOf("oldid=") != -1));
 if (isMainPage && !isDiff) {
  document.write('<style type="text/css">/*<![CDATA[*/ #lastmod, #siteSub, #contentSub, h1.firstHeading { display: none !important; } /*]]>*/</style>');
 }
 
/* 자유게시판 제목 숨기기 */
 var bbTitle = "위키낱말사전:자유게시판";
 var isBulletinboard = (document.title.substr(0, document.title.lastIndexOf(" - ")) == bbTitle);
 var isDiff = (document.location.search && (document.location.search.indexOf("diff=") != -1 || document.location.search.indexOf("oldid=") != -1));
 if (isBulletinboard && !isDiff) {
  document.write('<style type="text/css">/*<![CDATA[*/ #lastmod, #siteSub, #contentSub, h1.firstHeading { display: none !important; } /*]]>*/</style>');
 }

• 다른 트릭 (현재)

 function WiktionaryTalkpage() {
  if(document.title.search && (document.title.search("위키낱말사전:자유게시판") != -1 || document.title.search("위키낱말사전:게시판") != -1 || document.title.search("위키낱말사전:한글 맷돌") != -1)) {
  document.body.className = "ns-1";
  document.write('<style type="text/css">/*<![CDATA[*/ #lastmod, #siteSub, #contentSub, h1.firstHeading { display: none !important; } /*]]>*/</style>');
 }
 }
 addOnloadHook(WiktionaryTalkpage);

Pdf 파일에 icon 붙이기

영어 위키백과 w:en:MediaWiki:Common.css

필요할 경우 MediaWiki:Common.css에 추가. --아흔(A-heun) (토론) 2008년 8월 15일 (금) 12:44 (UTC)

 #bodyContent a[href$=".pdf"].external, 
 #bodyContent a[href*=".pdf?"].external, 
 #bodyContent a[href*=".pdf#"].external,
 #bodyContent a[href$=".PDF"].external, 
 #bodyContent a[href*=".PDF?"].external, 
 #bodyContent a[href*=".PDF#"].external {
 background: url(http://upload.wikimedia.org/wikipedia/commons/thumb/2/23/Icons-mini-file_acrobat.gif/15px-Icons-mini-file_acrobat.gif) center right no-repeat;
 padding-right: 1em;
 }

IP 방문자 설문 조사

이 스크립은 현재 영어, 독일어, 이탈리아어 낱말사전에서 실험 중

• en:User:Conrad.Irwin/feedback.js
• de:MediaWiki:If-anon-feedback.js
• it:MediaWiki:feedback.js

목적은 IP 방문자에게 낱말사전에 수록된 문서의 질에 대한 설문 조사

독일어 낱말사전의 스크립은 IP 방문자와 등록 사용자를 세분화 시킨 것

var fb_comment_url =  wgScript+
  "?title=Wiktionary:Feedback"+
  "&action=edit&section=new"+
  "&preload=Wiktionary:Feedback%2Fpreload"+
  "&editintro=Wiktionary:Feedback%2Fintro"+
  "&preloadtitle="+
   encodeURIComponent("[[:"+wgPageName.replace('_', ' ')+"]]");
var pn= wgPageName.replace(/_/g,' ');
var fb_thanks = "감사합니다!";       // 감사의 말
var fb_comment = "의견이 있으세요?"; // 댓글

var fb_questions = new Array();

fb_questions[0] = 
["이 낱말의 내용은",
  ['우수한 편',
   '괜찮은 편',
   '부족한 편',
   '틀린 점이 있음',
   '나쁜 편',]         // 추가 질문 가능
];

var fb_options;
var fb_text;
var fb_sent = false;
var fb_sent2= false;

function fb_init(){
  var index = Math.floor(Math.random()*(fb_questions.length)); 
  fb_text = fb_questions[index][0];
  fb_options = fb_questions[index][1]; 
  fb_buildBox();
}

function fb_buildBox(){
  var sidebar = document.getElementById('column-one');
  if(!sidebar) return false;
  
  var list = newNode('ul',{'id':'fb_list'});
  
  for(var i=0;i<fb_options.length;i++){
    list.appendChild( 
      newNode('li',
        newNode('a',{'click':fb_click,'id':""+i},fb_options[i]) 
      )
    );
  }
  sidebar.insertBefore(    
    newNode('div',{'class':"portlet",'id':"p-feedb"},
      newNode('a',{'name':"feedback"}),
      newNode('h5',"feedback"),
      newNode('div',{'class':"pBody"},
        newNode('p',{'style':'font-size: 90%'},fb_text),
        list,
        newNode('p',{'style':'font-size: 80%'},
          newNode('a',{'href':fb_comment_url},fb_comment)
        )
      )
    ),
document.getElementById('p-search').nextSibling
  );
}
$(fb_init);
function fb_click(e){
  var fb = false;
  var fbi = false;
  
  try{
    fb = e.target.childNodes[0].nodeValue;
    fbi = e.target.getAttribute('id');
  }catch(e){ try{
    fb = window.event.srcElement.childNodes[0].nodeValue;
    fbi = window.event.srcElement.getAttribute('id');
  } catch(e){ }}
  
  if(fb){
    fb_send(fb);
    fb_send2(fb,fbi);
  }
  
  var list = document.getElementById('fb_list');
  
  list.parentNode.insertBefore(
    newNode('p',fb_thanks),list
  );
  list.parentNode.removeChild(list);
  
  return false;  
}
  //Send to ~cmackenzie -> 서버에서 설문 집계
function fb_send(string){
  if(fb_sent) return false;
  fb_sent=true;
  
  var wiki = wgServer.replace(/https?:\/\/([^\.]*)\.([^\.]*)\.org/,"$1$2").replace(/pedia$/,'');
  
  var page = wgPageName;
  if(wgPageName == 'Special:Search'){
    var sb = document.getElementById('lsearchbox');
    if(sb) page+='/'+sb.value;
  }
  var url = "http://tools.wikimedia.de/~cmackenzie/feedback.php"+
    "?fb_wiki="+wiki+
    "&fb_page="+encodeURI(page)+
    "&fb_revid="+encodeURI(wgCurRevisionId)+
    "&fb_comment="+encodeURI(string);

  document.body.appendChild(
    newNode('iframe',{'src':url,'style':'display:none'})
); 
}
//Send to ~daveross  -> 서버에서 설문 집계
function fb_send2(string,indx){
  if(fb_sent2) return false;
  fb_sent2  =true;
  var lang = wgServer.replace(/^https?:\/\/([^\.]*).*$/,"$1");
  var wiki = wgServer.replace(/https?:\/\/[^\.]*\.([^\.]*)\.org/,"$1");
  
  var page = wgPageName;
  if(wgPageName == 'Special:Search'){
    var sb = document.getElementById('lsearchbox');
    if(sb) page+='/'+sb.value;
  }
  
  var url = 'http://tools.wikimedia.de/~daveross/feedback.php'
          + '?mode=submit'
          + '&lang='+encodeURI(lang)
          + '&wiki='+encodeURI(wiki)
          + '&page='+encodeURI(page)
          + '&revid='+encodeURI(wgCurRevisionId)
          + '&comment='+encodeURI(string)
          + '&comment_index='+encodeURI(indx*1+1);

  document.body.appendChild(
    newNode('iframe',{'src':url,'style':'display:none'})
  );

}

/* DOM abbreviation function */
function newNode(tagname){

  var node = document.createElement(tagname);
  
  for( var i=1;i<arguments.length;i++ ){
    
    if(typeof arguments[i] == 'string'){ //Text
      node.appendChild( document.createTextNode(arguments[i]) );
      
    }else if(typeof arguments[i] == 'object'){ 
      
      if(arguments[i].nodeName){ //If it is a DOM Node
        node.appendChild(arguments[i]);
        
      }else{ //Attributes (hopefully)
        for(var j in arguments[i]){
          if(j == 'class'){ //Classname different because...
            node.className = arguments[i][j];
            
          }else if(j == 'style'){ //Style is special
            node.style.cssText = arguments[i][j];
            
          }else if(typeof arguments[i][j] == 'function'){ //Basic event handlers
            try{ node.addEventListener(j,arguments[i][j],false); //W3C
            }catch(e){try{ node.attachEvent('on'+j,arguments[i][j],"Language"); //MSIE
            }catch(e){ node['on'+j]=arguments[i][j]; }}; //Legacy
          
          }else{
            node.setAttribute(j,arguments[i][j]); //Normal attributes
          
          }
        }
      }
    }
  }
  
  return node;
}

검토 버전

«검토 버전 (Stable versions)»은 현재 독일어 위키백과에서 전면적으로 실시하고 있다. 독일어 위키낱말사전은 자바 스크립으로 실험 중.

문제점: 스크립을 쓰지 않고 서버에서 관리가 되도록 하기 위해서는 MediaZilla에 신청하여 허가를 받아야 한다.

• 참조:
• http://www.mediawiki.org/wiki/Extension:FlaggedRevs
• http://de.labs.wikimedia.org/wiki/Hauptseite
• http://tools.wikimedia.de/~aka/cgi-bin/reviewcnt.cgi?lang=german
• http://en.wikipedia.org/wiki/Wikipedia:Why_stable_versions

--아흔(A-heun) (토론) 2008년 8월 15일 (금) 13:36 (UTC)

Portlet Links

• 프로그래머: 미상
• Mediawiki:Common.js (필요하면 추가)
• Portlet 을 나름대로 바꾸고자 할 때

• 참조: Mediawiki:Sidebar

 function addPortletLink(portlet, href, text, id, tooltip, accesskey, nextnode) {
  var node = document.getElementById(portlet);
  if ( !node ) return null;
   node = node.getElementsByTagName( "ul" )[0];
   if ( !node ) return null;
     var link = document.createElement( "a" );
     link.appendChild( document.createTextNode( text ) );
     link.href = href;
     var item = document.createElement( "li" );
     item.appendChild( link );
     if ( id ) item.id = id;
      if ( accesskey ) {
       link.setAttribute( "accesskey", accesskey );
       tooltip += " ["+accesskey+"]";
      }
     if ( tooltip ) {
      link.setAttribute( "title", tooltip );
     }
     if ( accesskey && tooltip ) {
      updateTooltipAccessKeys( new Array( link ) );
     }
     if ( nextnode && nextnode.parentNode == node )
      node.insertBefore( item, nextnode );
     else
      node.appendChild( item );
 return item;
 }

Searchbox

• Mediawiki:Common.css (필요하면 추가)
• 찾기 상자의 버튼 조절

 #search-box .searchboxGoButton {
	display: none;
	}
 #search-box .searchboxSearchButton {
	position: relative; left: -5px;
	}
 #search-box table {
	background-color: transparent;
	}

Imagemap inline

• Mediawiki:common.css
• 문제점1: 그림에 링크를 거는 태그 «Imagemap»을 쓸 경우 같은 줄에 글을 계속 쓸 수가 없다. 때문에 «.imagemap-inline »으로 이 문제를 해결한다. 결과가 그리 신통치 않은 것으로 보인다.
• 문제점2: Imagemap을 쓸 경우 «position: absolute»를 제외하고 layer 조절이 불가능하다.

• 참조: 미디어위키 ImageMap extension