Skip to content

Commit

Permalink
implement more printer and encoding view stuff
Browse files Browse the repository at this point in the history
  • Loading branch information
mike42 committed Nov 25, 2017
1 parent 2c1e443 commit b78a7fd
Show file tree
Hide file tree
Showing 8 changed files with 307 additions and 37 deletions.
4 changes: 2 additions & 2 deletions gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ var STYLE_SRC = 'src/styles/*.scss';
gulp.task('images', function() {
return gulp.src(IMG_SRC)
.pipe(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))
.pipe(gulp.dest('dist/img'));
.pipe(gulp.dest('dist/img'))
.pipe(livereload());
});

Expand All @@ -51,7 +51,7 @@ gulp.task('styles', function() {
.pipe(autoprefixer('last 2 version'))
.pipe(rename({suffix: '.min'}))
.pipe(cssnano())
.pipe(gulp.dest('dist/css'));
.pipe(gulp.dest('dist/css'))
.pipe(livereload());
});

Expand Down
182 changes: 156 additions & 26 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,24 +8,157 @@
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="dist/css/main.min.css" media="screen,projection" />

<script type="text/template" id="profile-template-row-tr">
<tr>
<td><a href="#profiles/<%= _.escape(id) %>"><%= _.escape(name) %></a></td>
</tr>
<script type="text/template" id="encoding-template-row">
<a class="collection-item blue-text" href="#encodings/<%= _.escape(id) %>"><%= _.escape(name) %></a>
</script>

<script type="text/template" id="encoding-template-detail">
<h3>Encoding: <%= _.escape(name) %></h3>

<h4>Basic details</h4>

<table class="bordered">
<tr>
<th>Name</th>
<td><%= _.escape(name) %></td>
</tr>
<tr>
<th>Internal ID</th>
<td><%= _.escape(id) %></td>
</tr>
<tr>
<th>Python encode ID</th>
<td><%= _.escape(python_encode) %></td>
</tr>
<tr>
<th>Iconv ID</th>
<td><%= _.escape(iconv) %></td>
</tr>
</table>

<% if(data !== null) { %>
<h4>Data</h4>
<pre><% _.each(data, function(line) { %><%= _.escape(line) %><br /><% }); %></pre>
<% } %>

<h4>Referenced in profiles</h4>

<div class="collection">
<% _.each(profiles, function(profile) { %>
<a class="collection-item blue-text" href="#profiles/<%= _.escape(profile.id) %>"><%= _.escape(profile.name) %></a>
<% }); %>
</div>
</script>

<script type="text/template" id="profile-template-row">
<a class="collection-item blue-text" href="#profiles/<%= _.escape(id) %>"><%= _.escape(name) %></a>
</script>

<script type="text/template" id="profile-template-detail">
<table>
<h3><%= _.escape(name) %></h3>

<%= _.escape(notes) %>

<h4>Basic information</h4>

<table class="bordered">
<tr>
<td>
<%= _.escape(name) %>
</td>
<th>Name</th>
<td><%= _.escape(name) %></td>
</tr>
<tr>
<th>Vendor</th>
<td><a href="#vendors/<%= _.escape(vendor_name_to_id(vendor)) %>"><%= _.escape(vendor) %></a></td>
</tr>
<tr>
<th>Media width (mm)</th>
<td><%= _.escape(media.width.mm) %></td>
</tr>
<tr>
<th>Media width (pixels)</th>
<td><%= _.escape(media.width.pixels) %></td>
</tr>
</table>

<h4>Fonts</h4>

<table class="bordered">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Columns</th>
</tr>
</thead>
<tbody>
<% _.each(fonts, function(font) { %>
<tr>
<td><%= _.escape(font.key) %></td>
<td><%= _.escape(font.val.name) %></td>
<td><%= _.escape(font.val.columns) %></td>
</tr>
<% }); %>
</tbody>
</table>

<h4>Colors</h4>
<table class="bordered">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<% _.each(colors, function(color) { %>
<tr>
<td><%= _.escape(color.key) %></td>
<td><%= _.escape(color.val) %></td>
</tr>
<% }); %>
</tbody>
</table>

<h4>Feature support</h4>

<table class="bordered">
<% _.each(features, function(feature) { %>
<tr>
<th><%= _.escape(feature.key) %></th>
<td>
<%= _.escape(notes) %>
<% if (feature.val) { %>
<i class="material-icons green-text text-darken-1">check</i>
<% } else { %>
<i class="material-icons red-text text-darken-1">clear</i>
<% } %>
</td>
</tr>
<% }); %>
</table>

<h4>Text code pages</h4>

<table class="bordered">
<thead>
<tr>
<th>ID</th>
<th>Encoding</th>
</tr>
</thead>
<tbody>
<% _.each(codePages, function(codePage) { %>
<tr>
<td><%= _.escape(codePage.key) %></td>
<td>
<% if (codePage.val !== 'Unknown') { %>
<a class="collection-item blue-text" href="#encodings/<%= _.escape(codePage.val) %>"><%= _.escape(codePage.val) %></a>
<% } else { %>
Unknown
<% } %>
</td>
</tr>
<% }); %>
</tbody>
</table>
</script>
</head>
Expand Down Expand Up @@ -110,34 +243,31 @@ <h5 class="center">Vendor independent</h5>
</div>
</div>

<div id="page-profiles" class="hide">
<table>
<tbody id="profile-tbody">

</tbody>
</table>
<div id="page-profiles" class="container hide">
<h3>Printer profile list</h3>
<div class="collection" id="profile-list"></div>
</div>

<div id="page-profile" class="hide">
<div id="profileTemplateDetail">

</div>
<div id="page-profile" class="container hide">
<div id="profileTemplateDetail"></div>
</div>

<div id="page-vendors" class="hide">
Vendor list
<div id="page-vendors" class="container hide">
<h3>Printer vendor list</h3>
<div class="collection" id="vendor-list"></div>
</div>

<div id="page-vendor" class="hide">
<div id="page-vendor" class="container hide">
Vendor
</div>

<div id="page-encodings" class="hide">
Encoding list
<div id="page-encodings" class="container hide">
<h3>Text encoding list</h3>
<div class="collection" id="encoding-list"></div>
</div>

<div id="page-encoding" class="hide">
Encoding
<div id="page-encoding" class="container hide">
<div id="encodingTemplateDetail"></div>
</div>

<footer class="page-footer blue hide" id="page-footer">
Expand Down
93 changes: 93 additions & 0 deletions src/scripts/encodings.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
/* Text encodings */
var encoding_model = Backbone.Model.extend({
urlRoot: 'dist/data/encodings/',
url: function() {
return Backbone.Model.prototype.url.call(this) + '.json';
},

defaults: {
name: '',
data: null,
iconv: null,
python_encode: null
}
});

var encoding_collection = Backbone.Collection.extend({
url: 'dist/data/encodings/index.json',
model: encoding_model
});


var EncodingDetailView = Backbone.View.extend({
template: _.template($('#encoding-template-detail').html()),
el: 'div#encodingTemplateDetail',

initialize: function(options) {
_.bindAll(this, 'render');
},

render: function() {
this.$el.html(this.template(this.model.toJSON()));
return this;
}
});

var EncodingRowView = Backbone.View.extend({
template : _.template($('#encoding-template-row').html()),
tagName : 'tr',

initialize : function(options) {
_.bindAll(this, 'render');
},

render : function() {
this.$el.html(this.template(this.model.toJSON()));
return this;
}
});

var EncodingListView = Backbone.View.extend({
collection: null,
el: 'div#encoding-list',

initialize: function(options) {
this.collection = options.collection;
},

render: function() {
var element = this.$el;
element.empty();

this.collection.forEach(function(item) {
var itemView = new EncodingRowView({
model: item
});
element.append(itemView.template(itemView.model.toJSON()));
});
return this;
}
});

function showEncodingDetail(results) {
tabTo('encoding');
var encodingView = new EncodingDetailView({
model: results
});
encodingView.render();
}

function doLoadEncodings(page) {
var encodings = new encoding_collection();
encodings.fetch({
success: function(results) {
var db = new EncodingListView({
collection: encodings
});
db.render();
},
error: function(model, response) {
handleFailedRequest(response);
}
});
}
21 changes: 19 additions & 2 deletions src/scripts/navigation.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,19 +3,22 @@ var currentPage = 'default';

function tabTo(tab) {
if(tab !== currentPage) {
console.log(currentPage + " to " + tab);
console.log("Navigation: from " + currentPage + " to " + tab);
$('#page-' + currentPage).addClass('hide');
$('#page-' + tab).removeClass('hide');
if(currentPage === 'default') {
$('#page-footer').removeClass('hide');
}
currentPage = tab;
window.scrollTo(0,0);
}
}

var AppRouter = Backbone.Router.extend({
routes : {
"encodings/:id" : "loadEncoding",
"profiles/:id" : "loadProfile",
"vendors/:id" : "loadVendor",
"*actions" : "defaultRoute"
}
});
Expand All @@ -36,6 +39,20 @@ app_router.on('route:loadProfile', function(id) {
});
});

app_router.on('route:loadEncoding', function(id) {
var encoding = new encoding_model({
id : id
});
encoding.fetch({
success : function(results) {
showEncodingDetail(results);
},
error : function(model, response) {
handleFailedRequest(response);
}
});
});

app_router.on('route:defaultRoute', function(actions) {
switch (actions) {
case 'profiles':
Expand All @@ -44,7 +61,7 @@ app_router.on('route:defaultRoute', function(actions) {
break;
case 'encodings':
tabTo('encodings');
//doLoadEncodings();
doLoadEncodings();
break;
case 'vendors':
tabTo('vendors');
Expand Down
Loading

0 comments on commit b78a7fd

Please sign in to comment.