| 11 | class AddPackage { |
| 12 | |
| 13 | async init($page) { |
| 14 | // Adding a `Add Package` command in command platte |
| 15 | let command = { |
| 16 | name: "packageAdder", |
| 17 | description: "Add Package", |
| 18 | exec: this.run.bind(this), |
| 19 | } |
| 20 | editorManager.editor.commands.addCommand(command); |
| 21 | // Initialising $page for plugin |
| 22 | $page.id = 'acode-plugin-package-adder'; |
| 23 | $page.settitle("Add Package"); |
| 24 | this.$page = $page; |
| 25 | // Adding custom styles to $page |
| 26 | this.$style = tag('style', { |
| 27 | textContent: style, |
| 28 | }); |
| 29 | // creating two div in $page |
| 30 | this.$plugPage1 = tag('div',{ |
| 31 | className: 'plugPage1 hide', |
| 32 | }); |
| 33 | this.$plugPage2 = tag('div',{ |
| 34 | className: 'plugPage2 hide', |
| 35 | }); |
| 36 | this.$page.append(this.$plugPage1); |
| 37 | this.$page.append(this.$plugPage2); |
| 38 | // searchbar div for search input and search button in $page first div |
| 39 | this.$searchBar = tag('div', { |
| 40 | className: "searchBar", |
| 41 | }); |
| 42 | // div for displaying packages lists |
| 43 | this.$mainlistCont = tag('div',{ |
| 44 | className: "mainlistCont", |
| 45 | }); |
| 46 | this.$plugPage1.append(this.$searchBar); |
| 47 | this.$plugPage1.append(this.$mainlistCont); |
| 48 | // input box for searching |
| 49 | this.$searchInput = tag('input', { |
| 50 | type: 'search', |
| 51 | className: 'searchInput', |
| 52 | placeholder: 'search packages(eg: vue)', |
| 53 | }); |
| 54 | // button for searching |
| 55 | this.$searchBtn = tag('button', { |
| 56 | textContent: 'Search', |
| 57 | }); |
| 58 | this.$searchBar.append(...[this.$searchInput,this.$searchBtn]); |
| 59 | this.$searchBtn.onclick = this.searchLib.bind(this); |
| 60 | this.pkgLists = tag('ul'); |
| 61 | this.$mainlistCont.append(this.pkgLists); |
| 62 | const headerDiv = tag('div',{ |
| 63 | className: "headerDiv", |
| 64 | }); |
| 65 | const mainDiv = tag('div',{ |
| 66 | className: "mainDiv", |
| 67 | }); |
| 68 | this.libName = tag('h2'); |
| 69 | this.versionSelector = tag('select'); |
| 70 | headerDiv.append(this.libName); |