1/** 2 * JavaScript functionalitiy for the media management popup 3 * 4 * @author Andreas Gohr <andi@splitbrain.org> 5 */ 6media = { 7 keepopen: false, 8 9 /** 10 * Attach event handlers to all "folders" below the given element 11 * 12 * @author Andreas Gohr <andi@splitbrain.org> 13 */ 14 treeattach: function(obj){ 15 if(!obj) return; 16 17 var items = obj.getElementsByTagName('li'); 18 for(var i=0; i<items.length; i++){ 19 var elem = items[i]; 20 21 // attach action to make the +/- clickable 22 var clicky = elem.getElementsByTagName('img')[0]; 23 clicky.style.cursor = 'pointer'; 24 addEvent(clicky,'click',function(event){ return media.toggle(event,this); }); 25 26 // attach action load folder list via AJAX 27 var link = elem.getElementsByTagName('a')[0]; 28 link.style.cursor = 'pointer'; 29 addEvent(link,'click',function(event){ return media.list(event,this); }); 30 } 31 }, 32 33 /** 34 * Attach the image selector action to all links below the given element 35 * also add the action to autofill the "upload as" field 36 * 37 * @author Andreas Gohr <andi@splitbrain.org> 38 */ 39 selectorattach: function(obj){ 40 if(!obj) return; 41 42 var items = getElementsByClass('select',obj,'a'); 43 for(var i=0; i<items.length; i++){ 44 var elem = items[i]; 45 elem.style.cursor = 'pointer'; 46 addEvent(elem,'click',function(event){ return media.select(event,this); }); 47 } 48 49 // hide syntax example 50 items = getElementsByClass('example',obj,'div'); 51 for(var i=0; i<items.length; i++){ 52 elem = items[i]; 53 elem.style.display = 'none'; 54 } 55 56 var file = $('upload__file'); 57 if(!file) return; 58 addEvent(file,'change',media.suggest); 59 }, 60 61 /** 62 * Creates a checkbox for keeping the popup on selection 63 * 64 * @author Andreas Gohr <andi@splitbrain.org> 65 */ 66 attachkeepopen: function(obj){ 67 if(!obj) return; 68 69 var cbox = document.createElement('input'); 70 cbox.type = 'checkbox'; 71 cbox.id = 'media__keepopen'; 72 if(DokuCookie.getValue('keepopen')){ 73 cbox.checked = true; 74 } 75 addEvent(cbox,'change',function(event){ return media.togglekeepopen(event,this); }); 76 77 var clbl = document.createElement('label'); 78 clbl.htmlFor = 'media__keepopen'; 79 clbl.innerHTML = LANG['keepopen']; 80 81 obj.appendChild(cbox); 82 obj.appendChild(clbl); 83 }, 84 85 /** 86 * Toggles the keep open state 87 * 88 * @author Andreas Gohr <andi@splitbrain.org> 89 */ 90 togglekeepopen: function(event,cb){ 91 if(cb.checked){ 92 DokuCookie.setValue('keepopen',1); 93 media.keepopen = true; 94 }else{ 95 DokuCookie.setValue('keepopen',''); 96 media.keepopen = false; 97 } 98 }, 99 100 /** 101 * Insert the clicked image into the opener's textarea 102 * 103 * @author Andreas Gohr <andi@splitbrain.org> 104 */ 105 select: function(event,link){ 106 var id = link.name.substr(2); 107 108 if(!opener){ 109 // if we don't run in popup display example 110 var ex = $('ex_'+id); 111 if(ex.style.display == ''){ 112 ex.style.display = 'none'; 113 }else{ 114 ex.style.display = ''; 115 } 116 return false; 117 } 118 opener.insertTags('wiki__text','{{'+id+'|','}}',''); 119 120 if(!media.keepopen) window.close(); 121 return false; 122 }, 123 124 /** 125 * list the content of a namespace using AJAX 126 * 127 * @author Andreas Gohr <andi@splitbrain.org> 128 */ 129 list: function(event,link){ 130 // prepare an AJAX call to fetch the subtree 131 var ajax = new sack(DOKU_BASE + 'lib/exe/ajax.php'); 132 ajax.AjaxFailedAlert = ''; 133 ajax.encodeURIString = false; 134 if(ajax.failed) return true; 135 136 cleanMsgArea(); 137 138 var content = $('media__content'); 139 content.innerHTML = '<img src="'+DOKU_BASE+'lib/images/loading.gif" alt="..." class="load" />'; 140 141 ajax.elementObj = content; 142 ajax.afterCompletion = function(){ media.selectorattach(content); }; 143 ajax.runAJAX(link.search.substr(1)+'&call=medialist'); 144 return false; 145 }, 146 147 148 /** 149 * Open or close a subtree using AJAX 150 * 151 * @author Andreas Gohr <andi@splitbrain.org> 152 */ 153 toggle: function(event,clicky){ 154 var listitem = clicky.parentNode; 155 156 // if already open, close by removing the sublist 157 var sublists = listitem.getElementsByTagName('ul'); 158 if(sublists.length){ 159 listitem.removeChild(sublists[0]); 160 clicky.src = DOKU_BASE+'lib/images/plus.gif'; 161 return false; 162 } 163 164 // get the enclosed link (is always the first one) 165 var link = listitem.getElementsByTagName('a')[0]; 166 167 // prepare an AJAX call to fetch the subtree 168 var ajax = new sack(DOKU_BASE + 'lib/exe/ajax.php'); 169 ajax.AjaxFailedAlert = ''; 170 ajax.encodeURIString = false; 171 if(ajax.failed) return true; 172 173 //prepare the new ul 174 var ul = document.createElement('ul'); 175 //fixme add classname here 176 listitem.appendChild(ul); 177 ajax.elementObj = ul; 178 ajax.afterCompletion = function(){ media.treeattach(ul); }; 179 ajax.runAJAX(link.search.substr(1)+'&call=medians'); 180 clicky.src = DOKU_BASE+'lib/images/minus.gif'; 181 return false; 182 }, 183 184 /** 185 * Prefills the wikiname. 186 * 187 * @author Andreas Gohr <andi@splitbrain.org> 188 */ 189 suggest: function(){ 190 var file = $('upload__file'); 191 var name = $('upload__name'); 192 if(!file || !name) return; 193 194 var text = file.value; 195 text = text.substr(text.lastIndexOf('/')+1); 196 text = text.substr(text.lastIndexOf('\\')+1); 197 name.value = text; 198 } 199 200} 201 202addInitEvent(function(){media.treeattach($('media__tree'));}); 203addInitEvent(function(){media.selectorattach($('media__content'));}); 204addInitEvent(function(){media.attachkeepopen($('media__opts'));}); 205
