mattburchett/webglmapview
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Design improvements with CHANGELOG

Browse Source
This commit is contained in:
Robert L 2018-01-16 15:06:17 -05:00
parent 3aee2be44a
commit 85f8eb162a
4 changed files with 57 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
CHANGELOG.md Normal file
View File

@ -0,0 +1,19 @@
#Change Log
**V0.6.1** *(1-16-2018)*
* Moved CHANGELOG over to read CHANGELOG.md from project and parse the markdown in Javascript. Is it overkill? Sure. Do I care? No
* Some design tweaks to improve space usage throughout sidebar, and other things
**V0.6** *(1-9-2018)*
* Simple websocket client. (Thanks to grapenut@M\*U\*S\*H )
* Best on tablet or desktop I would guess. Mobile might be iffy
**V0.5** *(6/14/2017)*
* Addition of changelog
* Improve responsiveness of design. Could be better.
**V0.2-0.4**
* Additional features that I cannot recall
**V0.1**
* Initial Release

24
index.htm
View File

@ -11,10 +11,12 @@
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Raleway:400,700,700i" rel="stylesheet">
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="styles/styles.css" rel="stylesheet">
<link href="styles/ansi.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.8.6/showdown.min.js" crossorigin="anonymous"></script>
<script src="js/GUI.Utils.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
@ -68,8 +70,9 @@
<select id="pointb" name="Point_B">
<!-- Options will generated in code -->
</select>
<label for="speed">Travel Speed</label>
<input type="text" id="speed" value="14">
<br /> <br />
<label for="speed">Travel Speed</label> <br />
<input type="text" id="speed" value="14"> <br />
<select id="speedunit" name="Speed Unit">
<option value='WF'>Warp Factor</option>
<option value='PC/s'>PC/s</option>
@ -113,16 +116,15 @@
</div>
<div class="wvg-tools" id="Info">
<span> This tool was designed by Frey @ ATSMUSH. It is based on MapView for ATS with data used from the Navcomp MUSHClient plugin with permission. </span>
<span> Change Log :<br/>
<p>
<b>1-9-2018</b>: <i> Add simple websocket based client to desktop & tablet version (for now until I can figure mobile out). Thanks to grapenut@M*U*S*H for the client code and all others on the PennMUSH dev team involved in adding websockets to the codebase. </i>
</p>
<p>
<b>6-14-2017</b>: <i> Improve resposiveness in design. It wasn't scaling down well, should be better now. Not glorious, but better. Also, this changelog was added.</i>
</p>
<span id="changelog_container">
<!-- Silly stuff gets put here on JS execution -->
</span>
<span><a href="https://goo.gl/7uDYCW">Issue Tracker</a></span>
<div id="info_footer">
<span class="toolsep"></span>
<span> This tool was designed by Frey @ ATSMUSH. It is based on MapView for ATS with data used from the Navcomp MUSHClient plugin with permission. </span>
<span><a href="https://goo.gl/7uDYCW">Issue Tracker</a> <i class="fa fa-ellipsis-h" aria-hidden="true"></i> <a href="https://github.com/roblevesque/webglmapview">Project Page</a></span>
</div>
</div>
</div>
<div class="reset-container"><span class="reset-button"> Reset </span></div>

13
js/GUI.Utils.js
View File

@ -81,6 +81,19 @@ $(document).ready(function() {
}
});
$(".client-term-container").resize(function() { width = $(this).width(); $("#client").css({'width' : '100%'}); $("#client-term-output").css({'margin-right' : '0px !important', 'padding-right' : '0 !important'}) })
$.ajax({
url: 'CHANGELOG.md',
type: 'get',
async: 'true',
success: function(text) {
var converter = new showdown.Converter(),
html = converter.makeHtml(text);
$("#changelog_container").html(html);
}
});
// Websocket client startup
startup();
});

16
styles/styles.css
View File

@ -1,4 +1,7 @@
body { margin: 0; overflow:hidden;}
a { color: #3641a0;}
a:visited { color: #87899b; }
a:hover { color: #0019ff;}
canvas { width: 75%; height: 100% ;}
.reset-button {margin: 0; padding: 0; padding: 0.25em 0.25em; color: #AAA; font-size: 1.0em;}
.menu-button { position: fixed; right: 0.1vw; top: 0; z-index: 5; color:white; background-color:#003133; padding: 0px; font-weight: bold; font-size:2.5vh; }
@ -19,7 +22,7 @@ canvas { width: 75%; height: 100% ;}
.wvg-navbar li { width:auto; height: 100%; float: left; padding-top: 0.25vh; padding-bottom: 0.25vh; padding-left: 0.5vw; padding-right: 0.5vw; margin: 0; border: 0; text-decoration: none;}
.wvg-tablink { height: 100%; border: 0; margin: 0; padding: 0; font-weight: bold; text-align: center; font-family: 'Raleway', sans-serif; color:#67989A; font-size: 1.0em; }
.wvg-tab-active { background-color: #0D4A4D; color: #003133; }
.wvg-tools { width: 100%; height: 98%; background: #333; display: none; color: #AAA; padding-top: 2vh; padding-left:1vw; padding-right: 2.5vw;}
.wvg-tools { width: 100%; height: 98%; background: #333; display: none; color: #AAA; padding-top: 2vh; padding-left:0.1vw; padding-right: 0.25vw;}
.wvg-tools select, .wvg-tools input {
width: 12vw;
padding: 5px;
@ -35,7 +38,7 @@ canvas { width: 75%; height: 100% ;}
}
.wvg-tools input { background: #333; width: 11.4vw; }
.wvg-tools span { text-align: center; color: #FFF; font-family: 'Raleway', sans-serif; display: block; padding-right: 3vw; font-size: 1.0em; }
.wvg-tools span { text-align:center; color: #FFF; font-family: 'Raleway', sans-serif; display: block; font-size: 1.0em; }
.wvg-tools span label { font-weight: bold;}
.wvg-first { display: block; }
#wrapper { height: inherit; width: 100%; }
@ -92,8 +95,8 @@ input[type=radio]:checked + label:before {
text-decoration: none;
}
.tool-header { font-weight: bold; padding-top: 0.75em; display: block; }
#route_output {font-size: 1.25vh; height: 30%; padding-top: 1vh; width: 90%;}
.toolsep { margin-right: 1vw; padding:0; padding-top: 1vh; padding-bottom: 2.5vh; border-bottom: 1px #AAA solid; height: 1vh; display: block; width: 64%;}
#route_output {margin: 0 auto; font-size: 1.25vh; height: 30%; padding-top: 1vh; width: 100%; overflow: auto;}
.toolsep { margin: 0 auto; padding:0; padding-top: 1vh; padding-bottom: 2.5vh; border-bottom: 1px #AAA solid; height: 1vh; display: block; width: 64%;}
.calc_data { padding-top: 2.5vh; font-size: 1.5vh; font-family: 'Open Sans', sans-serif;}
#client {
@ -165,6 +168,11 @@ input[type=radio]:checked + label:before {
#client-term-resize i { margin: 0 auto; width: 2vw;}
#changelog_container h1 { text-align: center; font-size: 1.0em; }
#changelog_container { height: 80%; text-align: left; font-size: 0.75em; padding-right: 0.3vw; overflow: hidden;}
#changelog_container::parent {text-align: left;}
#info_footer {padding-bottom:0.9vh; font-size: 0.60em; position: fixed; bottom: 5vh;}
@media only screen and (max-width: 1290px) { #client-tab-desc { display: none; } }
@media only screen and (max-width: 900px) { .wvg-navbar { height: 6vh; font-size: 1.25em;} .wvg-controls { width: 65%;} .wvg-navbar li { padding-left: 1vw; padding-right: 2vw; padding-top: 2.0vh;} .wvg-tools span, .select-route-map {width: 95%;}