| 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 |
|---|
| 9 | this.full_download_url_sel = `#${part}-down-url` |
|---|
| 10 | this.partial_download_url_sel = `#${part}-partial-down-url` |
|---|
| 11 | } |
|---|
| 12 | |
|---|
| 13 | set_editor( editor ){ |
|---|
| 14 | this.editor = editor /* Globalx[part].editor */ |
|---|
| 15 | } |
|---|
| 16 | |
|---|
| 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({ |
|---|
| 37 | classes: { |
|---|
| 38 | "ui-menu": "highlight" |
|---|
| 39 | } |
|---|
| 40 | }) |
|---|
| 41 | } |
|---|
| 42 | } |
|---|
| 43 | |
|---|
| 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 | |
|---|
| 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 ) |
|---|
| 72 | this.setup_menu( obj ) |
|---|
| 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( "" ); |
|---|
| 84 | |
|---|
| 85 | let words = Globalx[part].item_name.split('.') |
|---|
| 86 | let base = words[0] |
|---|
| 87 | $( this.textarea_sel ).val( "" ); |
|---|
| 88 | this.set_anchor_url( part, base, "", "" , "full") |
|---|
| 89 | this.set_anchor_url( part, base, "", "" , "partial") |
|---|
| 90 | |
|---|
| 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 ){ |
|---|
| 132 | let words = item_name.split('.') |
|---|
| 133 | let base = words[0] |
|---|
| 134 | if( jsondata[Globalx[part].key].length == 0 ){ |
|---|
| 135 | Globalx[part].key_indicate_file = true; |
|---|
| 136 | console.log("Globalx[" + part + "].key_indicate_file = " + Globalx[part].key_indicate_file) |
|---|
| 137 | let url = Globalx.output_url_listx[base].full |
|---|
| 138 | console.log( "item_name="+item_name ) |
|---|
| 139 | console.log( "base="+base ) |
|---|
| 140 | console.log( "url="+url ) |
|---|
| 141 | $( Globalx[part].download_url_sel ).val( Globalx[part].key ) |
|---|
| 142 | $( Globalx[part].download_url_sel ).attr('href' , url ) |
|---|
| 143 | $( Globalx[part].download_partial_url_sel ).val( Globalx[part].key + "(parial)" ) |
|---|
| 144 | url = url + ".tmp" |
|---|
| 145 | $( Globalx[part].download_partial_url_sel ).attr('href' , url ) |
|---|
| 146 | Globalx.remotex.get_content( this.num, this.part, Globalx[part].key , (content) => { |
|---|
| 147 | Globalx[part].editor.getSession().setValue( content ); |
|---|
| 148 | $( Globalx[part].textarea_sel ).val( content ); |
|---|
| 149 | }); |
|---|
| 150 | |
|---|
| 151 | this.set_anchor_down_url( base, Globalx.output_url_listx[base].full, item_name , "full" ) |
|---|
| 152 | this.set_anchor_down_url( base, Globalx.output_url_listx[base].partial, item_name , "partial" ) |
|---|
| 153 | } |
|---|
| 154 | else{ |
|---|
| 155 | this.set_anchor_url( part, base, "", "" , "full") |
|---|
| 156 | this.set_anchor_url( part, base, "", "" , "partial") |
|---|
| 157 | } |
|---|
| 158 | } |
|---|
| 159 | } |
|---|
| 160 | |
|---|
| 161 | make_menu_item_list( realData , key){ |
|---|
| 162 | let content = null |
|---|
| 163 | let item = null |
|---|
| 164 | let ary = realData[ key ] |
|---|
| 165 | |
|---|
| 166 | let name = '..(Up)' |
|---|
| 167 | content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu">${name}</div></li>`; |
|---|
| 168 | $( this.menu_sel ).append(content); |
|---|
| 169 | item = $( this.menu_sel ).children().last() |
|---|
| 170 | item.on('click' , () => { |
|---|
| 171 | this.menu_action( key , true ) |
|---|
| 172 | } ) |
|---|
| 173 | |
|---|
| 174 | if( ary !== undefined ){ |
|---|
| 175 | ary.map( ( item_name ) => { |
|---|
| 176 | content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu">${item_name}</div></li>`; |
|---|
| 177 | $( this.menu_sel ).append(content); |
|---|
| 178 | item = $( this.menu_sel ).children().last() |
|---|
| 179 | item.on('click' , () => { |
|---|
| 180 | this.menu_action( item_name ) |
|---|
| 181 | } ) |
|---|
| 182 | }) |
|---|
| 183 | } |
|---|
| 184 | } |
|---|
| 185 | |
|---|
| 186 | set_globalx_item_name( part , item_name ) { |
|---|
| 187 | Globalx[part].item_name = item_name |
|---|
| 188 | let dl = $( Globalx[ part ].download_sel ) |
|---|
| 189 | dl.attr('download' , Globalx[part].item_name) |
|---|
| 190 | dl.removeAttr('href') |
|---|
| 191 | } |
|---|
| 192 | |
|---|
| 193 | set_anchor_url( part, base, href, text , kind){ |
|---|
| 194 | if( href === undefined ){ |
|---|
| 195 | href = "" |
|---|
| 196 | } |
|---|
| 197 | if( text === "" ){ |
|---|
| 198 | Globalx[part].sidemenu.set_anchor_down_url( base, href, text , kind) |
|---|
| 199 | } |
|---|
| 200 | else{ |
|---|
| 201 | let words = text.split('.') |
|---|
| 202 | let base = words[0] |
|---|
| 203 | if( Globalx.output_url_listx[base] !== undefined ){ |
|---|
| 204 | Globalx[part].sidemenu.set_anchor_down_url( base, href, text , kind) |
|---|
| 205 | } |
|---|
| 206 | } |
|---|
| 207 | } |
|---|
| 208 | |
|---|
| 209 | set_anchor_down_url( base, href, text , kind ){ |
|---|
| 210 | let sel = null |
|---|
| 211 | if( href === undefined ){ |
|---|
| 212 | href = "" |
|---|
| 213 | } |
|---|
| 214 | if( href === "" ){ |
|---|
| 215 | text = "" |
|---|
| 216 | } |
|---|
| 217 | if( text !== "" ){ |
|---|
| 218 | if( kind == "full" ){ |
|---|
| 219 | Globalx.output_url_listx[base].full = href |
|---|
| 220 | } |
|---|
| 221 | else{ |
|---|
| 222 | Globalx.output_url_listx[base].partial = href |
|---|
| 223 | } |
|---|
| 224 | } |
|---|
| 225 | if( kind === "full" ){ |
|---|
| 226 | sel = this.full_download_url_sel |
|---|
| 227 | if( text !== "" ){ |
|---|
| 228 | text = "Full HTML:" + text |
|---|
| 229 | } |
|---|
| 230 | } |
|---|
| 231 | else{ |
|---|
| 232 | sel = this.partial_download_url_sel |
|---|
| 233 | if( text !== "" ){ |
|---|
| 234 | text = "Partial HTML:" + text |
|---|
| 235 | } |
|---|
| 236 | } |
|---|
| 237 | |
|---|
| 238 | $( sel ).attr( "href" , href ) |
|---|
| 239 | $( sel ).text( text ) |
|---|
| 240 | } |
|---|
| 241 | |
|---|
| 242 | contextmenux0( menu_sel ) { |
|---|
| 243 | $( menu_sel ).contextmenu({ |
|---|
| 244 | delegate: ".hasmenu", |
|---|
| 245 | menu: [ |
|---|
| 246 | {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"}, |
|---|
| 247 | {title: "----"}, |
|---|
| 248 | {title: "More", childern: [ |
|---|
| 249 | {title: "Sub 1", cmd: "sub1"}, |
|---|
| 250 | {title: "Sub 2", cmd: "sub1"} |
|---|
| 251 | ]} |
|---|
| 252 | ], |
|---|
| 253 | select: (event, ui) => { |
|---|
| 254 | alert("select " + ui.cmd + " on " + ui.target.text()); |
|---|
| 255 | } |
|---|
| 256 | }); |
|---|
| 257 | } |
|---|
| 258 | } |
|---|
| 259 | |
|---|