diff --git a/build.sh b/build.sh old mode 100644 new mode 100755 index c75c59ffae7e06b28f0d0fe85fa76e538dc79958..6f9dda787fe447a8eaaf87d05d22449b53a01709 --- a/build.sh +++ b/build.sh @@ -1 +1 @@ -ng build --prod --output-path /usr/share/nginx/html/ +ng build --prod --output-path /var/www/html diff --git a/src/app/config.ts b/src/app/config.ts index 7da9eb5e97c870d2e0567e5d38bb8863989f25dc..6605129aa7c3726fc6da65de99cd3758738fa7b3 100644 --- a/src/app/config.ts +++ b/src/app/config.ts @@ -1,11 +1,18 @@ export interface IConfig { legendUrl: string; legendClass: string; - showLeftSidebar: boolean; + showOverview: boolean; + showFooter: boolean; + showQuery: boolean; + showFilter: boolean; } export const defaultConfig: IConfig = { legendUrl: 'https://exbio.wzw.tum.de/covex/assets/leg1.png', legendClass: 'legend', - showLeftSidebar: true, + showOverview: true, + showQuery: true, + showFilter: true, + + showFooter: false, }; diff --git a/src/app/pages/explorer-page/explorer-page.component.html b/src/app/pages/explorer-page/explorer-page.component.html index d5dea32548e3ae11bd8ad1e057e2c411518bcf79..20277a7cde59f919d312073f397a9762d5b05ff4 100644 --- a/src/app/pages/explorer-page/explorer-page.component.html +++ b/src/app/pages/explorer-page/explorer-page.component.html @@ -16,9 +16,9 @@ <div class="covex left-window"> <div> - <div *ngIf="myConfig.showLeftSidebar" class="covex sidebar bar-left"> + <div class="covex sidebar bar-left"> - <div class="card bar-large"> + <div *ngIf="myConfig.showOverview" class="card bar-large"> <header class="card-header"> <p class="card-header-title"> <span class="icon"> @@ -35,21 +35,25 @@ <div *ngIf="collapseOverview"> <div class="card-content"> <nav class="level" *ngIf="proteinData"> + + <!-- TO DO : CHANGE THIS LATER + <div class="level-item has-text-centered"> + <div> + <p class="heading">Viral<br>Proteins</p> + <p class="title"> {{ proteinData.effects.length }}</p> + </div> + </div> + --> + <div class="level-item has-text-centered"> <div> - <p class="heading">Viral<br>Proteins</p> - <p class="title"> {{ proteinData.effects.length }}</p> - </div> - </div> - <div class="level-item has-text-centered"> - <div> - <p class="heading">Host<br>Proteins</p> + <p class="heading">Proteins</p> <p class="title">{{ proteinData.proteins.length }}</p> </div> </div> <div class="level-item has-text-centered"> <div> - <p class="heading">Virus-Host<br>Interactions</p> + <p class="heading">Interactions</p> <p class="title">{{ proteinData.edges.length }}</p> </div> </div> @@ -58,7 +62,7 @@ </div> </div> - <div class="card bar-large"> + <div *ngIf="myConfig.showQuery" class="card bar-large"> <header class="card-header"> <p class="card-header-title"> <span class="icon"> @@ -85,12 +89,12 @@ </div> </div> - <div class="card bar-large"> + <div *ngIf="myConfig.showFilter" class="card bar-large"> <header class="card-header"> <p class="card-header-title"> <span class="icon"> <i class="fas fa-filter" aria-hidden="true"></i> - </span> Filter Viral Proteins + </span> Filter Proteins </p> <a (click)="collapseBaitFilter = !collapseBaitFilter" data-action="collapse" class="card-header-icon is-hidden-fullscreen" aria-label="more options"> @@ -141,7 +145,7 @@ </div> </div> - <footer class="card-footer toolbar"> + <footer *ngIf="myConfig.showFooter" class="card-footer toolbar"> <button (click)="toCanvas()" class="button is-primary is-rounded has-tooltip" data-tooltip="Take a screenshot of the current network."> <span class="icon"> diff --git a/src/index.html b/src/index.html index dc44c866756a20c6f24919349b09f30bdfdf6b53..1ae2bfca9302f84f9e9581cede46220e065ed0b9 100644 --- a/src/index.html +++ b/src/index.html @@ -18,16 +18,32 @@ .my-legend-2 { width: 10%; } + .my-legend-1{ + width: 10%; + + + } </style> <button onclick="setNetwork('netexp1')">Set Network 1</button> <button onclick="setNetwork('netexp2')">Set Network 2</button> <button onclick="changeConfig()">Hide sidebar</button> + <div style="border: 3px solid red"> <network-expander id="netexp1" config='{"legendClass": "my-legend-1"}' onload="init1()"></network-expander> </div> -<div style="border: 3px solid red"> + + + <br> + <br> + <br> +<!-- + <div style="border: 3px solid red"> <network-expander id="netexp2" config='{"legendUrl": "https://i.pinimg.com/originals/ff/72/80/ff72801189f650f11672915cda0f1bdf.png", "legendClass": "my-legend-2"}'></network-expander> </div> +--> + + + <script> function init1() { document.getElementsByClassName('my-legend-1')[0].onclick = function() {this.remove()};