[1] | 1 | var gObj = {title:'',url:''}, gEditCancel = {}, gReorderingLi = null; |
---|
| 2 | |
---|
| 3 | var myrules = { |
---|
| 4 | '#app .item_icon' : function(el){ |
---|
| 5 | el.onclick = function(ev){ |
---|
| 6 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'); |
---|
| 7 | if (el.hasClassName('collapsed_icon')) { |
---|
| 8 | expandItem(li); |
---|
| 9 | reorderDisplaying(li,true); |
---|
| 10 | } |
---|
| 11 | else { |
---|
| 12 | collapseItem(li); |
---|
| 13 | reorderDisplaying(li, false); |
---|
| 14 | }; |
---|
| 15 | Event.stop(ev); |
---|
| 16 | return false; |
---|
| 17 | } |
---|
| 18 | }, |
---|
| 19 | '#app .reorder' : function(el){ |
---|
| 20 | el.onclick = function(ev){ |
---|
| 21 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), |
---|
| 22 | ul = li.getElementsByTagName('UL')[0]; |
---|
| 23 | if (getChildLis(ul).length > 1){ |
---|
| 24 | isCollapsed(li)?expandItem(li):''; |
---|
| 25 | gReorderingLi = li; |
---|
| 26 | Element.addClassName(li, 'childsort'); |
---|
| 27 | disableScreen('rootMenu', li); |
---|
| 28 | }; |
---|
| 29 | Event.stop(ev); |
---|
| 30 | return false; |
---|
| 31 | } |
---|
| 32 | }, |
---|
| 33 | '#app .tabslist li div.deleteHover' : function(el){ |
---|
| 34 | if (el.attachEvent){ |
---|
| 35 | if (!el.hovers) el.hovers = {}; |
---|
| 36 | if (el.hovers['hover']) return; |
---|
| 37 | el.hovers['hover'] = true; |
---|
| 38 | el.attachEvent('onmouseover', function(){el.className += ' hover';}); |
---|
| 39 | el.attachEvent('onmouseout', function(){el.className = el.className.replace((new RegExp('\\s+hover')),'');}); |
---|
| 40 | } |
---|
| 41 | }, |
---|
| 42 | '#app .delete' : function(el){ |
---|
| 43 | el.onclick = function(ev){ |
---|
| 44 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), path = $F(li.getElementsByTagName('INPUT')[0]), |
---|
| 45 | ul = Event.findElement(ev, 'UL'), |
---|
| 46 | parentLi = ul.parentNode.parentNode; |
---|
| 47 | new Ajax.Request('qpdm_delete', |
---|
| 48 | {parameters:'submenu_path='+path, |
---|
| 49 | onSuccess:function(request) { |
---|
| 50 | new Effect.Fade(li, {duration: 0.7, afterFinish: function(){ |
---|
| 51 | Element.update(ul.parentNode, request.responseText); |
---|
| 52 | reorderDisplaying(parentLi, true); |
---|
| 53 | Behaviour.apply(); |
---|
| 54 | }}); |
---|
| 55 | }, |
---|
| 56 | onFailure: function(request) {window.alert(getMes(request.responseText));} |
---|
| 57 | } |
---|
| 58 | ); |
---|
| 59 | Event.stop(ev); |
---|
| 60 | return false; |
---|
| 61 | } |
---|
| 62 | }, |
---|
| 63 | // '#app .tabslist dt.collapsibleHeader' : function(el){el.onclick = toggleCollapsible;}, |
---|
| 64 | '.tabslist li span' : function(el){ |
---|
| 65 | el.onclick = function(ev){ |
---|
| 66 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), |
---|
| 67 | inputs = li.getElementsByTagName('INPUT'); |
---|
| 68 | gEditCancel[inputs[0].value] = [inputs[2].value, inputs[3].value]; |
---|
| 69 | Element.classNames(li).set('childedit'); |
---|
| 70 | inputs[2].focus(); |
---|
| 71 | Event.stop(ev); |
---|
| 72 | return false; |
---|
| 73 | } |
---|
| 74 | }, |
---|
| 75 | '.tabslist input.editsave' : function(el){ |
---|
| 76 | el.onclick = function(ev){ |
---|
| 77 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), |
---|
| 78 | inputs = li.getElementsByTagName('INPUT'), path = inputs[0].value, |
---|
| 79 | title = $F(inputs[2]); |
---|
| 80 | if (/[^\s]/.test(title)) { |
---|
| 81 | new Ajax.Request('qpdm_edit', |
---|
| 82 | {parameters:'submenu_path='+path+'&'+Form.serialize(Event.findElement(ev, 'FORM')), |
---|
| 83 | onSuccess: function(request){ |
---|
| 84 | Element.classNames(li).set(''); |
---|
| 85 | li.id = 'tabslist_'+title; |
---|
| 86 | li.getElementsByTagName('SPAN')[0].update(title); |
---|
| 87 | Behaviour.apply(); |
---|
| 88 | }, |
---|
| 89 | onFailure: function(request){window.alert(getMes(request.responseText));} |
---|
| 90 | } |
---|
| 91 | ); |
---|
| 92 | } |
---|
| 93 | else window.alert('Name is required!'); |
---|
| 94 | Event.stop(ev); |
---|
| 95 | return false; |
---|
| 96 | } |
---|
| 97 | }, |
---|
| 98 | '.tabslist input.editcancel' : function(el){ |
---|
| 99 | el.onclick = function(ev){ |
---|
| 100 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), |
---|
| 101 | inputs = li.getElementsByTagName('INPUT'); |
---|
| 102 | Element.classNames(li).set(''); |
---|
| 103 | values = gEditCancel[inputs[0].value]; |
---|
| 104 | inputs[2].value = values[0]; |
---|
| 105 | inputs[3].value = values[1]; |
---|
| 106 | Event.stop(ev); |
---|
| 107 | return false; |
---|
| 108 | } |
---|
| 109 | }, |
---|
| 110 | '#app li input.acttitle' : function(el){ |
---|
| 111 | el.onfocus = function(ev){ |
---|
| 112 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'); |
---|
| 113 | Element.classNames(li).add('childadd'); |
---|
| 114 | Event.stop(ev); |
---|
| 115 | return false; |
---|
| 116 | }; |
---|
| 117 | }, |
---|
| 118 | '#app li .buttonadd' : function(el){ |
---|
| 119 | el.onclick = function(ev){ |
---|
| 120 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), lis=[], |
---|
| 121 | inputs = li.getElementsByTagName('INPUT'), form = Event.findElement(ev, 'FORM'); |
---|
| 122 | if ($F(inputs[1])){ |
---|
| 123 | new Ajax.Request('qpdm_add', |
---|
| 124 | {parameters:'num='+getChildLis(li.parentNode).length+'&'+Form.serialize(form), |
---|
| 125 | onSuccess: function(request){ |
---|
| 126 | var parentLi = Event.findElement(ev, 'UL').parentNode.parentNode; |
---|
| 127 | new Insertion.Before(li, request.responseText); |
---|
| 128 | Element.removeClassName(li, 'childadd'); |
---|
| 129 | Form.reset(form); |
---|
| 130 | reorderDisplaying(parentLi, true); |
---|
| 131 | Behaviour.apply(); |
---|
| 132 | }, |
---|
| 133 | onFailure: function(request){window.alert(getMes(request.responseText));} |
---|
| 134 | } |
---|
| 135 | ); |
---|
| 136 | } |
---|
| 137 | else window.alert('Title is required!'); |
---|
| 138 | Event.stop(ev); |
---|
| 139 | return false; |
---|
| 140 | } |
---|
| 141 | }, |
---|
| 142 | '#app li .buttoncancel' : function(el){ |
---|
| 143 | el.onclick = function(ev){ |
---|
| 144 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'); |
---|
| 145 | Element.removeClassName(li, 'childadd'); |
---|
| 146 | Form.reset(Event.findElement(ev, 'FORM')); |
---|
| 147 | Event.stop(ev); |
---|
| 148 | return false; |
---|
| 149 | } |
---|
| 150 | } |
---|
| 151 | // '#generated_tabs' : function(el){ |
---|
| 152 | // el.onclick = function(ev){new Ajax.Request('qpt_setproperty', {parameters:'generated_tabs='+el.checked});} |
---|
| 153 | // } |
---|
| 154 | }; |
---|
| 155 | |
---|
| 156 | Behaviour.register(myrules); |
---|
| 157 | |
---|
| 158 | var globalHandlers = { |
---|
| 159 | onCreate: function(){Element.addClassName('app', 'working');}, |
---|
| 160 | onComplete: function() {if(Ajax.activeRequestCount == 0) Element.removeClassName('app', 'working');} |
---|
| 161 | }; |
---|
| 162 | |
---|
| 163 | Ajax.Responders.register(globalHandlers); |
---|
| 164 | |
---|
| 165 | function removeHandlers(el, cur) { |
---|
| 166 | var el = el?el:'rootMenu'; |
---|
| 167 | getChildLis(el).each(function(item){item!=cur?item.getElementsByTagName('SPAN')[0].onclick='':'';}); |
---|
| 168 | }; |
---|
| 169 | |
---|
| 170 | function getMes(txt) { |
---|
| 171 | try { |
---|
| 172 | message = (/Error Value\s*<\/dt>\s*<dd>(.*?)<\/dd>/i).exec(txt)[1]; |
---|
| 173 | } |
---|
| 174 | catch(e) { |
---|
| 175 | message = txt; |
---|
| 176 | }; |
---|
| 177 | return message; |
---|
| 178 | }; |
---|
| 179 | |
---|
| 180 | function collapseItem(item) { |
---|
| 181 | var img = document.getElementsByClassName('item_icon', item)[0], |
---|
| 182 | ul = document.getElementsByClassName('tabslist', item)[0]; |
---|
| 183 | if (img && ul){ |
---|
| 184 | shiftClasses(img, 'expanded_icon', 'collapsed_icon'); |
---|
| 185 | shiftClasses(ul, 'showLevel', 'hideLevel'); |
---|
| 186 | return true; |
---|
| 187 | } |
---|
| 188 | else return false; |
---|
| 189 | }; |
---|
| 190 | |
---|
| 191 | function expandItem(item) { |
---|
| 192 | var img = document.getElementsByClassName('item_icon', item)[0], |
---|
| 193 | ul = document.getElementsByClassName('tabslist', item)[0]; |
---|
| 194 | if (img && ul){ |
---|
| 195 | shiftClasses(img, 'collapsed_icon', 'expanded_icon'); |
---|
| 196 | shiftClasses(ul, 'hideLevel', 'showLevel'); |
---|
| 197 | return true; |
---|
| 198 | } |
---|
| 199 | else return false; |
---|
| 200 | }; |
---|
| 201 | |
---|
| 202 | function isCollapsed(item) { |
---|
| 203 | var ul = document.getElementsByClassName('tabslist', item); |
---|
| 204 | return (ul[0] && Element.hasClassName(ul[0], 'hideLevel')); |
---|
| 205 | }; |
---|
| 206 | |
---|
| 207 | function initLightbox (li) { |
---|
| 208 | var objBody = document.getElementsByTagName("body").item(0), |
---|
| 209 | objOverlay = document.createElement("div"), |
---|
| 210 | objLi = document.createElement("li"); |
---|
| 211 | objOverlay.setAttribute('id', 'overlay_modal'); |
---|
| 212 | objLi.setAttribute('id', 'overlay_li'); |
---|
| 213 | objOverlay.className = "overlay_alert"; |
---|
| 214 | objLi.className = "overlay_li childsort"; |
---|
| 215 | objOverlay.style.display = 'none'; |
---|
| 216 | objLi.style.display = 'none'; |
---|
| 217 | objOverlay.style.position = 'absolute'; |
---|
| 218 | objLi.style.position = 'absolute'; |
---|
| 219 | objOverlay.style.zIndex = 5000; |
---|
| 220 | objLi.style.zIndex = 10000; |
---|
| 221 | objOverlay.style.width = '100%'; |
---|
| 222 | objLi.style.width = '100%'; |
---|
| 223 | Element.update(objLi, li.innerHTML); |
---|
| 224 | objBody.insertBefore(objOverlay, objBody.firstChild); |
---|
| 225 | li.parentNode.appendChild(objLi); |
---|
| 226 | }; |
---|
| 227 | |
---|
| 228 | function disableScreen(overElement, li) { |
---|
| 229 | initLightbox(li); |
---|
| 230 | var objOverlay = $('overlay_modal'), objLi = $('overlay_li'), |
---|
| 231 | ul = objLi.getElementsByTagName('UL')[0]; |
---|
| 232 | Position.clone(overElement, objOverlay); |
---|
| 233 | Position.clone(li, objLi); |
---|
| 234 | objOverlay.style.display = 'block'; |
---|
| 235 | objLi.style.display = 'block'; |
---|
| 236 | ul ? Sortable.create(ul, {handle: 'drag-handle'}) : ''; |
---|
| 237 | Event.observe(document.getElementsByClassName('cancel', objLi)[0], 'click', onReorderingCancel, false); |
---|
| 238 | Event.observe(document.getElementsByClassName('save', objLi)[0], 'click', onReorderingSave, false); |
---|
| 239 | return li; |
---|
| 240 | }; |
---|
| 241 | |
---|
| 242 | function enableScreen(ev) { |
---|
| 243 | var ev = ev?ev:window.event, objOverlay = $('overlay_modal'), objLi = $('overlay_li'); |
---|
| 244 | Event.stopObserving(Event.element(ev), 'click', onReorderingCancel, false); |
---|
| 245 | Event.stopObserving(Event.element(ev), 'click', onReorderingSave, false); |
---|
| 246 | Sortable.destroy(objLi.getElementsByTagName('UL')[0]); |
---|
| 247 | if (objOverlay) Element.remove(objOverlay); |
---|
| 248 | if (objLi) Element.remove(objLi); |
---|
| 249 | }; |
---|
| 250 | |
---|
| 251 | function getChildLis(el) { |
---|
| 252 | return $A($(el).childNodes).findAll(function(item){return (item.tagName=='LI'&&!Element.hasClassName(item,'addItem'))}) |
---|
| 253 | }; |
---|
| 254 | |
---|
| 255 | function reorderDisplaying(el, expand) { |
---|
| 256 | var div = el.getElementsByTagName('DIV')[0], |
---|
| 257 | lis = getChildLis(el.getElementsByTagName('UL')[0]).length;; |
---|
| 258 | if (expand && lis>1) Element.addClassName(div, 'reorderHover'); |
---|
| 259 | else Element.removeClassName(div, 'reorderHover'); |
---|
| 260 | }; |
---|
| 261 | |
---|
| 262 | function shiftClasses(el, from, to) { |
---|
| 263 | Element.removeClassName(el, from); |
---|
| 264 | Element.addClassName(el, to); |
---|
| 265 | }; |
---|
| 266 | |
---|
| 267 | function onReorderingCancel(ev) { |
---|
| 268 | var ev = ev?ev:window.event, ul = gReorderingLi.getElementsByTagName('UL')[0]; |
---|
| 269 | if (ul) { |
---|
| 270 | Element.removeClassName(gReorderingLi, 'childsort'); |
---|
| 271 | enableScreen(ev); |
---|
| 272 | }; |
---|
| 273 | Event.stop(ev); |
---|
| 274 | return false; |
---|
| 275 | }; |
---|
| 276 | |
---|
| 277 | function onReorderingSave(ev) { |
---|
| 278 | var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI'), |
---|
| 279 | path = li.getElementsByTagName('INPUT')[0].value, |
---|
| 280 | ul = li.getElementsByTagName('UL')[0], params = '', |
---|
| 281 | ulOrigin = gReorderingLi.getElementsByTagName('UL')[0]; |
---|
| 282 | $A(getChildLis(ul)).each(function(i){ |
---|
| 283 | var val = i.getElementsByTagName('INPUT')[1].value; |
---|
| 284 | params += val?'&idxs='+val:''; |
---|
| 285 | }); |
---|
| 286 | new Ajax.Request('qpdm_reorder', |
---|
| 287 | {method: 'post', |
---|
| 288 | parameters: 'submenu_path='+path+params, |
---|
| 289 | onSuccess: function(request){ |
---|
| 290 | new Effect.Highlight(ulOrigin, {duration: 0.7, afterFinish: function(){ |
---|
| 291 | Element.removeClassName(gReorderingLi, 'childsort'); |
---|
| 292 | Element.update(ulOrigin.parentNode, request.responseText); |
---|
| 293 | enableScreen(ev); |
---|
| 294 | Behaviour.apply();}}); |
---|
| 295 | }, |
---|
| 296 | onFailure: function(request){window.alert(getMes(request.responseText));}, |
---|
| 297 | } |
---|
| 298 | ); |
---|
| 299 | Event.stop(ev); |
---|
| 300 | return false; |
---|
| 301 | } |
---|