Skip to content

Commit

Permalink
Responsive UI layout and CSS fixes (#948)
Browse files Browse the repository at this point in the history
  • Loading branch information
@saurori
saurori authored May 19, 2024
1 parent 1e5b782 commit c1c8014
Show file tree
Hide file tree
Showing 22 changed files with 609 additions and 535 deletions.
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,3 +30,5 @@ misc/rsyncToServers.sh
/results
other/wrapper/pyInstaller/windows/build
other/wrapper/pyInstaller/windows_console/build

**/.DS_Store
94 changes: 48 additions & 46 deletions core/ui-src/html/about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,50 +14,52 @@
~ limitations under the License.
-->

<div style="text-align: left; margin: auto; width: 800px">
Written by TheOtherP for the community.<br>

<br>
<h3>Program info</h3>
<b>Version:</b> {{simpleInfos.currentVersion}}<br>
<span ng-if="simpleInfos.packageInfo">
<b>Container version:</b> {{simpleInfos.packageInfo.version}}<br>
<b>Container release type:</b> {{simpleInfos.packageInfo.releaseType}}<br>
<b>Container author:</b> {{simpleInfos.packageInfo.author}}
</span>

<br>
<h3>Contact</h3>
If you have a question or a feature request I'd prefer you to create an issue on GitHub.<br>
You can <a href="{{ 'https://discord.gg/uh9W3rd' | dereferer}}">join the Discord channel</a>.<br>
If you absolutely must you can reach me via <a href="mailto:[email protected]">mail</a> but I really prefer any of the other ways.
<br><br>
Sources, bugs, enhancements: <a href="{{ 'https://github.com/theotherp/nzbhydra2/' | dereferer }}" target="_blank">https://github.com/theotherp/nzbhydra2</a>
<br><br>
<h3>Donations</h3>
You're welcome to donate:
<ul>
<li>Bitcoin via 1LPCUF9eKEXi58nHbxTbJyfxCJkcCXKzvm</li>
<li>Regular money via PayPal to [email protected]</li>
<li>Via <a href="{{'https://github.com/sponsors/theotherp' | dereferer}}">GitHub sponsors</a> which involves a recurring donation similar to Patreon.</li>

</ul>

Thanks to the handful of people who've already donated! I really appreciate the gesture.<br>
<br>
A special thanks go to
<br>
<a href="https://www.newsgroup.ninja/"><img src="static/img/ninja.png"></a>
<br>
and
<br>
<a href="https://www.newsdemon.com/"><img src="static/img/newsdemon.jpg"></a>
<br>
for sponsoring me.

<br><br>
<h3>License</h3>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at <a href="{{ 'http://www.apache.org/licenses/LICENSE-2.0' | dereferer }}">http://www.apache.org/licenses/LICENSE-2.0</a>
<div class="text-left row d-sm-flex justify-content-center">
<div class="col-xs-20 col-md-14">
Written by TheOtherP for the community.<br>

<br>
<h3>Program info</h3>
<b>Version:</b> {{simpleInfos.currentVersion}}<br>
<span ng-if="simpleInfos.packageInfo">
<b>Container version:</b> {{simpleInfos.packageInfo.version}}<br>
<b>Container release type:</b> {{simpleInfos.packageInfo.releaseType}}<br>
<b>Container author:</b> {{simpleInfos.packageInfo.author}}
</span>

<br>
<h3>Contact</h3>
If you have a question or a feature request I'd prefer you to create an issue on GitHub.<br>
You can <a href="{{ 'https://discord.gg/uh9W3rd' | dereferer}}">join the Discord channel</a>.<br>
If you absolutely must you can reach me via <a href="mailto:[email protected]">mail</a> but I really prefer any of the other ways.
<br><br>
Sources, bugs, enhancements: <a href="{{ 'https://github.com/theotherp/nzbhydra2/' | dereferer }}" target="_blank">https://github.com/theotherp/nzbhydra2</a>
<br><br>
<h3>Donations</h3>
You're welcome to donate:
<ul>
<li>Bitcoin via 1LPCUF9eKEXi58nHbxTbJyfxCJkcCXKzvm</li>
<li>Regular money via PayPal to [email protected]</li>
<li>Via <a href="{{'https://github.com/sponsors/theotherp' | dereferer}}">GitHub sponsors</a> which involves a recurring donation similar to Patreon.</li>

</ul>

Thanks to the handful of people who've already donated! I really appreciate the gesture.<br>
<br>
A special thanks go to
<br>
<a href="https://www.newsgroup.ninja/"><img src="static/img/ninja.png"></a>
<br>
and
<br>
<a href="https://www.newsdemon.com/"><img src="static/img/newsdemon.jpg"></a>
<br>
for sponsoring me.

<br><br>
<h3>License</h3>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at <a href="{{ 'http://www.apache.org/licenses/LICENSE-2.0' | dereferer }}">http://www.apache.org/licenses/LICENSE-2.0</a>
</div>
</div>
192 changes: 97 additions & 95 deletions core/ui-src/html/bugreport.html
View file
Original file line number Diff line number Diff line change
@@ -1,103 +1,105 @@
<div style="text-align: left; margin: auto; width: 800px">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Bugreport / Debug infos</h3>
</div>
<div class="panel-body">
So you found a bug? Ideally <a href="https://github.com/theotherp/nzbhydra2/issues/new" target="_blank">raise
an issue on github</a>. If you don't have an account create one ;-) I prefer GitHub issues for communication. Otherwise
<a
href="mailto:[email protected]">send me a mail</a>.<br>
<b>But</b> please read this first:<br>
Don't just tell me what the problem is. If you just post an exception from the console or say "x does not
work" I probably won't be willing or able to help. Remember you want something
from
me.<br>
<ul>
<li>
Tell me what you expect to happen and what actually happens
</li>
<li>
If hydra doesn't even start, tell me your OS and how you start it.
</li>
<li>
If the website looks weird tell me what browser you use. If you use a reverse proxy post your config
and your base URL setting.
</li>
<li>
If the GUI behaves strangely or doesn't react as it should check the browser console for errors.
</li>
</ul>
Tell me anything that might help. If you do all that I will do my best to help you and improve NZBHydra.

<br><br>
If possible provide the log and your settings. Here you can get anonymized versions of both to be
posted:<br>

<div class="btn-group" uib-dropdown>
<button id="split-button" type="button" class="btn btn-primary" ng-click="downloadDebuggingInfos()">Create and download debug infos
</button>
<button type="button" class="btn btn-primary" uib-dropdown-toggle>
<span class="caret"></span>
<span class="sr-only">Split button!</span>
</button>
<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="split-button">
<li role="menuitem"><a href="#" ng-click="uploadDebuggingInfos()">Create and upload debug infos to file share</a></li>
<div class="text-left row d-sm-flex justify-content-center">
<div class="col-xs-20 col-md-14">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Bugreport / Debug infos</h3>
</div>
<div class="panel-body">
So you found a bug? Ideally <a href="https://github.com/theotherp/nzbhydra2/issues/new" target="_blank">raise
an issue on github</a>. If you don't have an account create one ;-) I prefer GitHub issues for communication. Otherwise
<a
href="mailto:[email protected]">send me a mail</a>.<br>
<b>But</b> please read this first:<br>
Don't just tell me what the problem is. If you just post an exception from the console or say "x does not
work" I probably won't be willing or able to help. Remember you want something
from
me.<br>
<ul>
<li>
Tell me what you expect to happen and what actually happens
</li>
<li>
If hydra doesn't even start, tell me your OS and how you start it.
</li>
<li>
If the website looks weird tell me what browser you use. If you use a reverse proxy post your config
and your base URL setting.
</li>
<li>
If the GUI behaves strangely or doesn't react as it should check the browser console for errors.
</li>
</ul>
Tell me anything that might help. If you do all that I will do my best to help you and improve NZBHydra.

<br><br>
If possible provide the log and your settings. Here you can get anonymized versions of both to be
posted:<br>

<div class="btn-group" uib-dropdown>
<button id="split-button" type="button" class="btn btn-primary" ng-click="downloadDebuggingInfos()">Create and download debug infos
</button>
<button type="button" class="btn btn-primary" uib-dropdown-toggle>
<span class="caret"></span>
<span class="sr-only">Split button!</span>
</button>
<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="split-button">
<li role="menuitem"><a href="#" ng-click="uploadDebuggingInfos()">Create and upload debug infos to file share</a></li>
</ul>
</div>
<span>
<img src="static/img/spinner.gif" ng-show="isBackupCreationAction">
<span ng-bind-html="debugInfosUrl" style="margin-left: 10px"></span>
</span>
<br>
<button class="btn btn-default" ng-click="logThreadDump()" style="margin-top: 15px">Log thread dump</button>
<br>
<a href="actuator/heapdump" target="_blank">
<button class="btn btn-default" style="margin-top: 15px">Create heap dump <span class="glyphicon glyphicon-question-sign" tooltip-placement="auto top"
uib-tooltip="Will not work on J9 based JREs (and possibly others as well)."></span></button>
</a>
</div>
<span>
<img src="static/img/spinner.gif" ng-show="isBackupCreationAction">
<span ng-bind-html="debugInfosUrl" style="margin-left: 10px"></span>
</span>
<br>
<button class="btn btn-default" ng-click="logThreadDump()" style="margin-top: 15px">Log thread dump</button>
<br>
<a href="actuator/heapdump" target="_blank">
<button class="btn btn-default" style="margin-top: 15px">Create heap dump <span class="glyphicon glyphicon-question-sign" tooltip-placement="auto top"
uib-tooltip="Will not work on J9 based JREs (and possibly others as well)."></span></button>
</a>
</div>
</div>

<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">CPU usage <span class="glyphicon glyphicon-question-sign" tooltip-placement="auto top"
uib-tooltip="Enable the logging marker 'Performance' for this graph to show data."></span></h3>
</div>
<div class="panel-body">
<chart>
<nvd3 options="cpuChart.options" data="cpuChart.data" api="api" config="cpuChart.config"></nvd3>
</chart>
</div>
</div>

<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Debug SQL execution</h3>
</div>
<div class="panel-body">
You may want to take a look at the settings to make sure there's nothing in there you wouldn't want me to
see.
<br><br><br>
You can use the input box below to execute any SQL query against the database. You will likely never need
this but it allows me to ask you to execute a query when I try to solve a bug.
<br>
<textarea class="form-control" rows="5" data-ng-model="foo.sql"></textarea>
<button class="btn btn-default" ng-click="executeSqlQuery()">Query</button>
<button class="btn btn-default" ng-click="executeSqlUpdate()">Execute</button>
<textarea class="form-control" rows="10" data-ng-model="foo.csv"></textarea>

<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">CPU usage <span class="glyphicon glyphicon-question-sign" tooltip-placement="auto top"
uib-tooltip="Enable the logging marker 'Performance' for this graph to show data."></span></h3>
</div>
<div class="panel-body">
<chart>
<nvd3 options="cpuChart.options" data="cpuChart.data" api="api" config="cpuChart.config"></nvd3>
</chart>
</div>
</div>
</div>

<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Misc</h3>

<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Debug SQL execution</h3>
</div>
<div class="panel-body">
You may want to take a look at the settings to make sure there's nothing in there you wouldn't want me to
see.
<br><br><br>
You can use the input box below to execute any SQL query against the database. You will likely never need
this but it allows me to ask you to execute a query when I try to solve a bug.
<br>
<textarea class="form-control" rows="5" data-ng-model="foo.sql"></textarea>
<button class="btn btn-default" ng-click="executeSqlQuery()">Query</button>
<button class="btn btn-default" ng-click="executeSqlUpdate()">Execute</button>
<textarea class="form-control" rows="10" data-ng-model="foo.csv"></textarea>
</div>
</div>
<div class="panel-body">
<a href="internalapi/debuginfos/endpoints" target="_blank">
<button class="btn btn-default">List HTTP endpoints</button>
</a>

<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Misc</h3>
</div>
<div class="panel-body">
<a href="internalapi/debuginfos/endpoints" target="_blank">
<button class="btn btn-default">List HTTP endpoints</button>
</a>
</div>
</div>
</div>

</div>
</div>
10 changes: 5 additions & 5 deletions core/ui-src/html/config/indexer-config.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,20 +14,20 @@
~ limitations under the License.
-->

<div class="row">
<div>

<div class="btn-group" style="margin-bottom: 30px; margin-left: auto; margin-right: auto; float:none !important;">
<button class="btn btn-info" ng-click="showPresetSelection()">
<span class="glyphicon glyphicon-plus" style="margin-right: 10px"></span>Add new indexer
</button>
</div>


<div ng-repeat="entry in model | orderBy: ['-state', '-score', 'name'] : false track by entry.name">
<div class="row">
<div style="margin-left: auto; margin-right: auto; float:none !important;">
<indexer-input indexer="entry" model="model" on-click="showBox"></indexer-input>
</div>
</div>
</div>
</div>
</div>
Loading

0 comments on commit c1c8014

Please sign in to comment.