Skip to content

Commit

Permalink
Halfway through main UI components
Browse files Browse the repository at this point in the history
  • Loading branch information
@TheJaredWilcurt
TheJaredWilcurt committed Aug 6, 2017
1 parent 0986b18 commit cea346a
Show file tree
Hide file tree
Showing 4 changed files with 47 additions and 79 deletions.
5 changes: 4 additions & 1 deletion _sass/_app.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,16 @@
h4
margin: -2px 0px 2px

#outputFolderIcon
.outputFolderIcon
top: -31px
left: -12px
background: #FFF
padding: 4px 0px 0px 6px
cursor: pointer

.folderPicker
padding-right: 31px

#button-badges .disabled
cursor: pointer
pointer-events: auto
Expand Down
54 changes: 33 additions & 21 deletions _scripts/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,16 +7,18 @@ var Vue = window.Vue;
var ugui = window.ugui;
var updateDonutChart = window.updateDonutChart;

// Load Settings later
// ugui.helpers.loadSettings(runApp);

var fs = require('fs-extra');
var path = require('path');
var base64Img = require('base64-img');
var appData = nw.App.dataPath;
var temp = path.join(appData, 'temp');


function reset () {
$('#results').empty();
app.badges.errors = 0;
app.badges.warnings = 0;
app.badges.notices = 0;
}

var app = new Vue({
el: '#pa11y',
Expand All @@ -25,7 +27,12 @@ var updateDonutChart = window.updateDonutChart;
outputFileName: 'google com',
outputType: false,
version: '2.0.0',
folderPicker: ''
folderPicker: '',
badges: {
errors: 0,
wargings: 0,
notices: 0
}
},
methods: {
prefillData: function () {
Expand Down Expand Up @@ -81,10 +88,26 @@ var updateDonutChart = window.updateDonutChart;
cleaned = cleaned.split('<').join(' ');
cleaned = cleaned.split('>').join(' ');
this.outputFileName = cleaned;
},
outputFolderIcon: function () {
this.$refs.outputFolderBrowse.click();
},
outputFolderSet: function (evt) {
this.folderPicker = evt.currentTarget.value;
this.outputFolderChanged();
},
outputFolderChanged: function () {
reset();
ugui.helpers.saveSettings();
}
}
});

// TODO: Load Settings later
// ugui.helpers.loadSettings(runApp);
// Prefill for now
app.prefillData();


$('.navbar-brand img').on('contextmenu', function (evt) {
evt.preventDefault();
Expand Down Expand Up @@ -161,10 +184,7 @@ var updateDonutChart = window.updateDonutChart;



function reset () {
$('#results').empty();
$('#button-badges .badge').html('0');
}


function successMessage (file, ext) {
var filetype = ext.toUpperCase();
Expand Down Expand Up @@ -197,16 +217,7 @@ var updateDonutChart = window.updateDonutChart;
$('#imageAltsModal').slideUp('slow');
});

$('#outputFolderIcon').click(function () {
$('#outputFolderBrowse').click();
});

$('#outputFolderBrowse').change(function () {
reset();
var userDir = $(this).val();
$('#folderPicker').val(userDir);
ugui.helpers.saveSettings();
});

if (ugui.args.badgeError.value == 'false') {
$('#button-badges .btn-danger').addClass('disabled');
Expand Down Expand Up @@ -623,9 +634,10 @@ var updateDonutChart = window.updateDonutChart;
badges.notices = badges.notices + 1;
}
}
$('#button-row .btn-danger span').text(badges.errors);
$('#button-row .btn-warning span').text(badges.warnings);
$('#button-row .btn-primary span').text(badges.notices);

app.badges.errors = badges.errors;
app.badges.warnings = badges.warnings;
app.badges.notices = badges.notices;

// JSON
if (app.outputType === 'json') {
Expand Down
2 changes: 1 addition & 1 deletion _style/style.css
View file

Large diffs are not rendered by default.

65 changes: 9 additions & 56 deletions index.htm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,40 +21,10 @@
// COMMAND LINE ARGUMENT UI BINDINGS //
// //
/////////////////////////////////////////////////////////////////
// The order of these arguments controls the order they will //
// be sent out to the command line. If you place a name inside //
// double parenthesis like ((cows)) it will automatically be //
// replaced by the value of the element in the #argsForm with //
// a matching data-argName="cows". //
// //
// Input tags with a type of "file" will also automatically be //
// parsed into several sub-arguments for your ease of use such //
// as path, name, ext, size, lastModifiedDate, etc. //
// //
// If you need the value of an element parsed for you supply a //
// definition. Consult the UGUI documentation for detailed //
// information and instructions on how this feature works. //
/////////////////////////////////////////////////////////////////
-->

<cmd executable="pa11y">
<!--
<arg>((url))</arg>
<arg>((output))</arg>
<arg>((outputcsv))</arg>
<arg>((outputhtml))</arg>
<arg>((outputjson))</arg>
<arg>((outputmd))</arg>

<arg>((standardsection))</arg>
<arg>((standardwcaga))</arg>
<arg>((standardwcagaa))</arg>
<arg>((standardwcagaaa))</arg>
<arg>((folderPicker))</arg>
-->
</cmd>

</head>
Expand All @@ -68,24 +38,6 @@
<!-- Change the class form dev to prod when you're ready to distribute your application. -->
<body role="document" class="prod">







<!--
/////////////////////////////////////////////////////////////////
// //
// NAVIGATION //
// //
/////////////////////////////////////////////////////////////////
// Top bar navigation. Some parts are only visible when in dev //
// mode. Be sure to change the body class to prod before you //
// distribute your app. //
/////////////////////////////////////////////////////////////////
-->

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
Expand All @@ -104,7 +56,7 @@
<ul class="nav navbar-nav">
<li><a href="#about">About</a></li>
<li><a href="#exit">Exit</a></li>
<!--
<!--
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">File <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
Expand All @@ -125,7 +77,8 @@
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Help <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
</ul>
</li> -->
</li>
-->
</ul>
</div><!--/.nav-collapse -->
</div>
Expand Down Expand Up @@ -217,9 +170,9 @@ <h3>
</div>
<div class="col-xs-6 col-s-6 col-md-6 col-l-6">
<label for="folderPicker">Output Folder:</label>
<input id="folderPicker" type="text" class="form-control" v-model="folderPicker" required="required" />
<span id="outputFolderIcon" class="glyphicon glyphicon-folder-open pull-right" title="Browse"></span>
<input type="file" id="outputFolderBrowse" nwdirectory="nwdirectory" nwworkingdir="..." class="hide" />
<input class="form-control folderPicker" v-model="folderPicker" @change="outputFolderChanged" type="text" id="folderPicker" required="required" />
<span class="glyphicon glyphicon-folder-open pull-right outputFolderIcon" title="Browse" @click="outputFolderIcon"></span>
<input class="hide" @change="outputFolderSet" type="file" id="outputFolderBrowse" ref="outputFolderBrowse" nwdirectory="nwdirectory" nwworkingdir="..." />
</div>


Expand All @@ -237,13 +190,13 @@ <h3>
<div class="col-xs-12 col-s-12 col-md-12 col-l-12 text-left" style="vertical-align: middle">
<span id="button-badges">
<button class="btn btn-sm btn-danger" type="button" value="true" data-argName="badgeError">
Errors <span class="badge">0</span>
Errors <span class="badge">{{ badges.errors }}</span>
</button>
<button class="btn btn-sm btn-warning" type="button" value="true" data-argName="badgeWarning">
Warnings <span class="badge">0</span>
Warnings <span class="badge">{{ badges.warnings }}</span>
</button>
<button class="btn btn-sm btn-primary" type="button" value="true" data-argName="badgeNotice">
Notices <span class="badge">0</span>
Notices <span class="badge">{{ badges.notices }}</span>
</button>
</span>
<button type="submit" id="run" class="btn btn-primary pull-right">Run!</button>
Expand Down

0 comments on commit cea346a

Please sign in to comment.