| 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 | } |
|---|
| 10 | set_editor( editor ){ |
|---|
| 11 | this.editor = editor /* Globalx[part].editor */ |
|---|
| 12 | } |
|---|
| 13 | |
|---|
| 14 | async setup(top_sel){ |
|---|
| 15 | console.log("SideMenu setup menu_sel=" + this.menu_sel) |
|---|
| 16 | let content = `<ul id="${this.menu_id}"></ul>` |
|---|
| 17 | $(top_sel).append( content ) |
|---|
| 18 | this.get_filelist_async( this.num , this.part , (text) => { |
|---|
| 19 | console.log("SideMenu setup text=" + text) |
|---|
| 20 | let str = text |
|---|
| 21 | let obj |
|---|
| 22 | if( str.match( /{.*}/ ) === null ){ |
|---|
| 23 | obj = {} |
|---|
| 24 | console.log("sidemenu setup 1 num=" + this.num + " part=" + this.part) |
|---|
| 25 | } |
|---|
| 26 | else { |
|---|
| 27 | obj = JSON.parse( str ) |
|---|
| 28 | console.log("sidemenu setup 2 num=" + this.num + " part=" + this.part + " str="+str) |
|---|
| 29 | } |
|---|
| 30 | console.log( "sidemenu setup this.num=" + this.num + " this.part=" + this.part ) |
|---|
| 31 | Globalx.storagex.change_cache( obj, this.num , this.part ) |
|---|
| 32 | |
|---|
| 33 | this.make_menu_item_list( obj , Globalx[this.part].key) |
|---|
| 34 | $( this.menu_sel ).menu({ |
|---|
| 35 | classes: { |
|---|
| 36 | "ui-menu": "highlight" |
|---|
| 37 | } |
|---|
| 38 | }) |
|---|
| 39 | }) |
|---|
| 40 | } |
|---|
| 41 | |
|---|
| 42 | async get_filelist_async( num , part , func){ |
|---|
| 43 | if( part == "setting" ){ |
|---|
| 44 | console.log( "get_filelist_async START part="+ part) |
|---|
| 45 | } |
|---|
| 46 | let realData = Globalx.storagex.get_filelist( num , part ) |
|---|
| 47 | |
|---|
| 48 | if( part == "setting" ){ |
|---|
| 49 | console.log( "get_filelist_async 2 part=" + part) |
|---|
| 50 | } |
|---|
| 51 | if( realData === undefined || realData === null ){ |
|---|
| 52 | if( part == "setting" ){ |
|---|
| 53 | console.log( "get_filelist_async 3 part=" + part) |
|---|
| 54 | } |
|---|
| 55 | await Globalx.remotex.get_filelist_from_remote( num, part, func ) |
|---|
| 56 | if( part == "setting" ){ |
|---|
| 57 | console.log( "get_filelist_async 4 part=" + part) |
|---|
| 58 | } |
|---|
| 59 | } |
|---|
| 60 | else{ |
|---|
| 61 | const obj = Globalx.storagex.get_filelist( num , part ) |
|---|
| 62 | this.make_menu_item_list( obj , Globalx[this.part].key) |
|---|
| 63 | $( this.menu_sel ).menu({ |
|---|
| 64 | classes: { |
|---|
| 65 | "ui-menu": "highlight" |
|---|
| 66 | } |
|---|
| 67 | }) |
|---|
| 68 | } |
|---|
| 69 | } |
|---|
| 70 | |
|---|
| 71 | menu_action( item_name , up_flag = false ) { |
|---|
| 72 | if( Globalx[this.part].key != '/' ){ |
|---|
| 73 | |
|---|
| 74 | } |
|---|
| 75 | let part = this.part |
|---|
| 76 | let jsondata = Globalx.storagex.get_filelist( Globalx.num , part) |
|---|
| 77 | |
|---|
| 78 | Globalx[part].key_indicate_file = false; |
|---|
| 79 | if( up_flag ){ |
|---|
| 80 | this.set_globalx_item_name(part, "") |
|---|
| 81 | Globalx[part].editor.getSession().setValue( "" ); |
|---|
| 82 | $( this.textarea_sel ).val( "" ); |
|---|
| 83 | if( Globalx[part].key != '/' ){ |
|---|
| 84 | let array = Globalx[part].key.split("/") |
|---|
| 85 | array.pop() |
|---|
| 86 | if( array.length > 1 ){ |
|---|
| 87 | Globalx[part].key_type = false; |
|---|
| 88 | this.set_globalx_item_name( part, array[array.length - 1] ) |
|---|
| 89 | |
|---|
| 90 | Globalx[part].key = array.join('/') |
|---|
| 91 | $( Globalx[part].menu_sel ).empty() |
|---|
| 92 | } |
|---|
| 93 | else { |
|---|
| 94 | Globalx[part].key = '/' |
|---|
| 95 | this.set_globalx_item_name( part, "" ) |
|---|
| 96 | } |
|---|
| 97 | } |
|---|
| 98 | } |
|---|
| 99 | else{ |
|---|
| 100 | if( Globalx[part].key == '/' ){ |
|---|
| 101 | Globalx[part].key = Globalx[part].key + item_name |
|---|
| 102 | } |
|---|
| 103 | else{ |
|---|
| 104 | Globalx[part].key = Globalx[part].key + '/' + item_name |
|---|
| 105 | } |
|---|
| 106 | } |
|---|
| 107 | this.set_globalx_item_name(part, item_name) |
|---|
| 108 | |
|---|
| 109 | const bookmark_cb = $( this.bookmark_op_sel ) |
|---|
| 110 | if( Globalx[part].bookmarks.indexOf( Globalx[part].key ) >= 0 ){ |
|---|
| 111 | bookmark_cb.prop('checked', true) |
|---|
| 112 | } |
|---|
| 113 | else{ |
|---|
| 114 | bookmark_cb.prop('checked', false) |
|---|
| 115 | } |
|---|
| 116 | |
|---|
| 117 | $( Globalx[part].key_sel ).val( Globalx[part].key ) |
|---|
| 118 | |
|---|
| 119 | $( this.menu_sel ).empty() |
|---|
| 120 | |
|---|
| 121 | this.make_menu_item_list(jsondata, Globalx[part].key) |
|---|
| 122 | |
|---|
| 123 | if( jsondata !== undefined && jsondata[Globalx[part].key] !== undefined ){ |
|---|
| 124 | if( jsondata[Globalx[part].key].length == 0 ){ |
|---|
| 125 | Globalx[part].key_indicate_file = true; |
|---|
| 126 | Globalx.remotex.get_content( this.num, this.part, Globalx[part].key , (content) => { |
|---|
| 127 | //console.log("content=" + content) |
|---|
| 128 | Globalx[part].editor.getSession().setValue( content ); |
|---|
| 129 | $( Globalx[part].textarea_sel ).val( content ); |
|---|
| 130 | }); |
|---|
| 131 | } |
|---|
| 132 | } |
|---|
| 133 | } |
|---|
| 134 | |
|---|
| 135 | make_menu_item_list( realData , key){ |
|---|
| 136 | let content = null |
|---|
| 137 | let ary = realData[ key ] |
|---|
| 138 | |
|---|
| 139 | let name = '..(Up)' |
|---|
| 140 | content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu" onclick="menu_action( '${this.part}', '${this.name}', true)">${name}</div></li>`; |
|---|
| 141 | // content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu" onclick="this.menu_action_2">${name}</div></li>`; |
|---|
| 142 | $( this.menu_sel ).append(content); |
|---|
| 143 | |
|---|
| 144 | if( ary !== undefined ){ |
|---|
| 145 | ary.map( ( item_name ) => { |
|---|
| 146 | content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu" onclick="menu_action( '${this.part}', '${item_name}' , false)">${item_name}</div></li>`; |
|---|
| 147 | // content = `<li class="ui-menu-item"><div class="ui-menu-item-wrapper hasmenu" onclick="this.menu_action_2">${item_name}</div></li>`; |
|---|
| 148 | $( this.menu_sel ).append(content); |
|---|
| 149 | }) |
|---|
| 150 | } |
|---|
| 151 | } |
|---|
| 152 | |
|---|
| 153 | set_globalx_item_name( item_name ) { |
|---|
| 154 | Globalx[this.part].item_name = item_name |
|---|
| 155 | let dl = $( '#download' ) |
|---|
| 156 | dl.attr('download' , Globalx[this.part].item_name) |
|---|
| 157 | dl.removeAttr('href') |
|---|
| 158 | } |
|---|
| 159 | |
|---|
| 160 | contextmenux0( menu_sel ) { |
|---|
| 161 | $( menu_sel ).contextmenu({ |
|---|
| 162 | delegate: ".hasmenu", |
|---|
| 163 | menu: [ |
|---|
| 164 | {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"}, |
|---|
| 165 | {title: "----"}, |
|---|
| 166 | {title: "More", childern: [ |
|---|
| 167 | {title: "Sub 1", cmd: "sub1"}, |
|---|
| 168 | {title: "Sub 2", cmd: "sub1"} |
|---|
| 169 | ]} |
|---|
| 170 | ], |
|---|
| 171 | select: (event, ui) => { |
|---|
| 172 | alert("select " + ui.cmd + " on " + ui.target.text()); |
|---|
| 173 | } |
|---|
| 174 | }); |
|---|
| 175 | } |
|---|
| 176 | } |
|---|