| [29] | 1 | class SideMenu { |
|---|
| 2 | constructor (num , part){ |
|---|
| 3 | this.part = part |
|---|
| 4 | this.num = num |
|---|
| 5 | this.menu_sel = Globalx[part].menu_sel |
|---|
| 6 | this.menu_id = Globalx[part].menu_id |
|---|
| 7 | this.textarea_sel = Globalx[part].textarea_sel |
|---|
| 8 | this.bookmark_op_sel = Globalx[part].bookmark_op_sel |
|---|
| [66] | 9 | this.full_download_url_sel = `#${part}-down-url` |
|---|
| 10 | this.partial_download_url_sel = `#${part}-partial-down-url` |
|---|
| [29] | 11 | } |
|---|
| [66] | 12 | |
|---|
| [29] | 13 | set_editor( editor ){ |
|---|
| 14 | this.editor = editor /* Globalx[part].editor */ |
|---|
| 15 | } |
|---|
| 16 | |
|---|
| [41] | 17 | display_menu( text ) { |
|---|
| 18 | let str = text |
|---|
| 19 | let obj |
|---|
| 20 | if( str.match( /{.*}/ ) === null ){ |
|---|
| 21 | console.log("sidemenu 1 num="+ this.num + " part="+ this.part +" str="+str) |
|---|
| 22 | obj = {} |
|---|
| 23 | } |
|---|
| 24 | else { |
|---|
| 25 | console.log("sidemenu 2 num="+ this.num +" part="+ this.part +" str="+str) |
|---|
| 26 | obj = JSON.parse( str ) |
|---|
| 27 | } |
|---|
| 28 | Globalx.storagex.change_cache( obj, this.num , this.part ) |
|---|
| 29 | |
|---|
| 30 | this.setup_menu(obj) |
|---|
| 31 | } |
|---|
| 32 | |
|---|
| 33 | setup_menu(obj){ |
|---|
| 34 | this.make_menu_item_list( obj , Globalx[this.part].key) |
|---|
| 35 | if( Globalx[this.part].menu === null ){ |
|---|
| 36 | Globalx[this.part].menu = $( this.menu_sel ).menu({ |
|---|
| [29] | 37 | classes: { |
|---|
| 38 | "ui-menu": "highlight" |
|---|
| 39 | } |
|---|
| 40 | }) |
|---|
| [41] | 41 | } |
|---|
| [29] | 42 | } |
|---|
| 43 | |
|---|
| [41] | 44 | menu_init( top_sel ){ |
|---|
| 45 | $( top_sel ).empty() |
|---|
| 46 | let content = `<ul id="${this.menu_id}"></ul>` |
|---|
| 47 | $( top_sel ).append( content ) |
|---|
| 48 | } |
|---|
| 49 | |
|---|
| 50 | async setup( top_sel ){ |
|---|
| 51 | this.menu_init( top_sel ) |
|---|
| 52 | this.get_filelist_async( this.num , this.part , (text) => { |
|---|
| 53 | this.display_menu(text) |
|---|
| 54 | } ) |
|---|
| 55 | } |
|---|
| 56 | |
|---|
| 57 | async update( top_sel ){ |
|---|
| 58 | this.menu_init( top_sel ) |
|---|
| 59 | await Globalx.remotex.update_filelist( this.num, this.part, (text) => { |
|---|
| 60 | this.display_menu(text) |
|---|
| 61 | } ) |
|---|
| 62 | } |
|---|
| 63 | |
|---|
| [29] | 64 | async get_filelist_async( num , part , func){ |
|---|
| 65 | let realData = Globalx.storagex.get_filelist( num , part ) |
|---|
| 66 | |
|---|
| 67 | if( realData === undefined || realData === null ){ |
|---|
| 68 | await Globalx.remotex.get_filelist_from_remote( num, part, func ) |
|---|
| 69 | } |
|---|
| 70 | else{ |
|---|
| 71 | const obj = Globalx.storagex.get_filelist( num , part ) |
|---|
| [41] | 72 | this.setup_menu( obj ) |
|---|
| [29] | 73 | } |
|---|
| 74 | } |
|---|
| 75 | |
|---|
| 76 | menu_action( item_name , up_flag = false ) { |
|---|
| 77 | let part = this.part |
|---|
| 78 | let jsondata = Globalx.storagex.get_filelist( Globalx.num , part) |
|---|
| 79 | |
|---|
| 80 | Globalx[part].key_indicate_file = false; |
|---|
| 81 | if( up_flag ){ |
|---|
| 82 | this.set_globalx_item_name(part, "") |
|---|
| 83 | Globalx[part].editor.getSession().setValue( "" ); |
|---|
| [66] | 84 | |
|---|
| [67] | 85 | let words = Globalx[part].item_name.split('.') |
|---|
| 86 | let base = words[0] |
|---|
| [29] | 87 | $( this.textarea_sel ).val( "" ); |
|---|
| [67] | 88 | this.set_anchor_url( part, base, "", "" , "full") |
|---|
| 89 | this.set_anchor_url( part, base, "", "" , "partial") |
|---|
| [66] | 90 | |
|---|
| [29] | 91 | if( Globalx[part].key != '/' ){ |
|---|
| 92 | let array = Globalx[part].key.split("/") |
|---|
| 93 | array.pop() |
|---|
| 94 | if( array.length > 1 ){ |
|---|
| 95 | Globalx[part].key_type = false; |
|---|
| 96 | this.set_globalx_item_name( part, array[array.length - 1] ) |
|---|
| 97 | |
|---|
| 98 | Globalx[part].key = array.join('/') |
|---|
| 99 | $( Globalx[part].menu_sel ).empty() |
|---|
| 100 | } |
|---|
| 101 | else { |
|---|
| 102 | Globalx[part].key = '/' |
|---|
| 103 | this.set_globalx_item_name( part, "" ) |
|---|
| 104 | } |
|---|
| 105 | } |
|---|
| 106 | } |
|---|
| 107 | else{ |
|---|
| 108 | if( Globalx[part].key == '/' ){ |
|---|
| 109 | Globalx[part].key = Globalx[part].key + item_name |
|---|
| 110 | } |
|---|
| 111 | else{ |
|---|
| 112 | Globalx[part].key = Globalx[part].key + '/' + item_name |
|---|
| 113 | } |
|---|
| 114 | } |
|---|
| 115 | this.set_globalx_item_name(part, item_name) |
|---|
| 116 | |
|---|
| 117 | const bookmark_cb = $( this.bookmark_op_sel ) |
|---|
| 118 | if( Globalx[part].bookmarks.indexOf( Globalx[part].key ) >= 0 ){ |
|---|
| 119 | bookmark_cb.prop('checked', true) |
|---|
| 120 | } |
|---|
| 121 | else{ |
|---|
| 122 | bookmark_cb.prop('checked', false) |
|---|
| 123 | } |
|---|
| 124 | |
|---|
| 125 | $( Globalx[part].key_sel ).val( Globalx[part].key ) |
|---|
| 126 | |
|---|
| 127 | $( this.menu_sel ).empty() |
|---|
| 128 | |
|---|
| 129 | this.make_menu_item_list(jsondata, Globalx[part].key) |
|---|
| 130 | |
|---|
| 131 | if( jsondata !== undefined && jsondata[Globalx[part].key] !== undefined ){ |
|---|
| [67] | 132 | let words = item_name.split('.') |
|---|
| 133 | let base = words[0] |
|---|
| [29] | 134 | if( jsondata[Globalx[part].key].length == 0 ){ |
|---|
| 135 | Globalx[part].key_indicate_file = true; |
|---|
| [67] | 136 | let url = Globalx.output_url_listx[base].full |
|---|
| [68] | 137 | |
|---|
| [36] | 138 | $( Globalx[part].download_url_sel ).val( Globalx[part].key ) |
|---|
| 139 | $( Globalx[part].download_url_sel ).attr('href' , url ) |
|---|
| 140 | $( Globalx[part].download_partial_url_sel ).val( Globalx[part].key + "(parial)" ) |
|---|
| 141 | url = url + ".tmp" |
|---|
| 142 | $( Globalx[part].download_partial_url_sel ).attr('href' , url ) |
|---|
| [29] | 143 | Globalx.remotex.get_content( this.num, this.part, Globalx[part].key , (content) => { |
|---|
| 144 | Globalx[part].editor.getSession().setValue( content ); |
|---|
| 145 | $( Globalx[part].textarea_sel ).val( content ); |
|---|
| 146 | }); |
|---|
| [66] | 147 | |
|---|
| [67] | 148 | this.set_anchor_down_url( base, Globalx.output_url_listx[base].full, item_name , "full" ) |
|---|
| 149 | this.set_anchor_down_url( base, Globalx.output_url_listx[base].partial, item_name , "partial" ) |
|---|
| [29] | 150 | } |
|---|
| [66] | 151 | else{ |
|---|
| [67] | 152 | this.set_anchor_url( part, base, "", "" , "full") |
|---|
| 153 | this.set_anchor_url( part, base, "", "" , "partial") |
|---|
| [66] | 154 | } |
|---|
| [29] | 155 | } |
|---|
| 156 | } |
|---|
| 157 | |
|---|
| [68] | 158 | make_menu_item_list( obj , key){ |
|---|
| [29] | 159 | let content = null |
|---|
| [36] | 160 | let item = null |
|---|
| [68] | 161 | let ary = obj[ key ] |
|---|
| [29] | 162 | |
|---|
| 163 | let name = '..(Up)' |
|---|
| [36] | 164 | content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu">${name}</div></li>`; |
|---|
| [29] | 165 | $( this.menu_sel ).append(content); |
|---|
| [41] | 166 | item = $( this.menu_sel ).children().last() |
|---|
| [36] | 167 | item.on('click' , () => { |
|---|
| 168 | this.menu_action( key , true ) |
|---|
| 169 | } ) |
|---|
| [29] | 170 | |
|---|
| 171 | if( ary !== undefined ){ |
|---|
| 172 | ary.map( ( item_name ) => { |
|---|
| [36] | 173 | content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu">${item_name}</div></li>`; |
|---|
| [29] | 174 | $( this.menu_sel ).append(content); |
|---|
| [41] | 175 | item = $( this.menu_sel ).children().last() |
|---|
| [36] | 176 | item.on('click' , () => { |
|---|
| 177 | this.menu_action( item_name ) |
|---|
| 178 | } ) |
|---|
| [29] | 179 | }) |
|---|
| 180 | } |
|---|
| 181 | } |
|---|
| 182 | |
|---|
| [41] | 183 | set_globalx_item_name( part , item_name ) { |
|---|
| 184 | Globalx[part].item_name = item_name |
|---|
| 185 | let dl = $( Globalx[ part ].download_sel ) |
|---|
| 186 | dl.attr('download' , Globalx[part].item_name) |
|---|
| [29] | 187 | dl.removeAttr('href') |
|---|
| 188 | } |
|---|
| 189 | |
|---|
| [67] | 190 | set_anchor_url( part, base, href, text , kind){ |
|---|
| 191 | if( href === undefined ){ |
|---|
| 192 | href = "" |
|---|
| 193 | } |
|---|
| 194 | if( text === "" ){ |
|---|
| 195 | Globalx[part].sidemenu.set_anchor_down_url( base, href, text , kind) |
|---|
| 196 | } |
|---|
| 197 | else{ |
|---|
| 198 | let words = text.split('.') |
|---|
| 199 | let base = words[0] |
|---|
| 200 | if( Globalx.output_url_listx[base] !== undefined ){ |
|---|
| 201 | Globalx[part].sidemenu.set_anchor_down_url( base, href, text , kind) |
|---|
| 202 | } |
|---|
| 203 | } |
|---|
| 204 | } |
|---|
| 205 | |
|---|
| 206 | set_anchor_down_url( base, href, text , kind ){ |
|---|
| [66] | 207 | let sel = null |
|---|
| 208 | if( href === undefined ){ |
|---|
| 209 | href = "" |
|---|
| 210 | } |
|---|
| [67] | 211 | if( href === "" ){ |
|---|
| 212 | text = "" |
|---|
| 213 | } |
|---|
| 214 | if( text !== "" ){ |
|---|
| 215 | if( kind == "full" ){ |
|---|
| 216 | Globalx.output_url_listx[base].full = href |
|---|
| 217 | } |
|---|
| 218 | else{ |
|---|
| 219 | Globalx.output_url_listx[base].partial = href |
|---|
| 220 | } |
|---|
| 221 | } |
|---|
| [66] | 222 | if( kind === "full" ){ |
|---|
| 223 | sel = this.full_download_url_sel |
|---|
| 224 | if( text !== "" ){ |
|---|
| 225 | text = "Full HTML:" + text |
|---|
| 226 | } |
|---|
| 227 | } |
|---|
| 228 | else{ |
|---|
| 229 | sel = this.partial_download_url_sel |
|---|
| 230 | if( text !== "" ){ |
|---|
| 231 | text = "Partial HTML:" + text |
|---|
| 232 | } |
|---|
| 233 | } |
|---|
| 234 | |
|---|
| 235 | $( sel ).attr( "href" , href ) |
|---|
| 236 | $( sel ).text( text ) |
|---|
| 237 | } |
|---|
| 238 | |
|---|
| [29] | 239 | contextmenux0( menu_sel ) { |
|---|
| 240 | $( menu_sel ).contextmenu({ |
|---|
| 241 | delegate: ".hasmenu", |
|---|
| 242 | menu: [ |
|---|
| 243 | {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"}, |
|---|
| 244 | {title: "----"}, |
|---|
| 245 | {title: "More", childern: [ |
|---|
| 246 | {title: "Sub 1", cmd: "sub1"}, |
|---|
| 247 | {title: "Sub 2", cmd: "sub1"} |
|---|
| 248 | ]} |
|---|
| 249 | ], |
|---|
| 250 | select: (event, ui) => { |
|---|
| 251 | alert("select " + ui.cmd + " on " + ui.target.text()); |
|---|
| 252 | } |
|---|
| 253 | }); |
|---|
| 254 | } |
|---|
| 255 | } |
|---|
| [36] | 256 | |
|---|