Skip to content

Commit

Permalink
improve display of data
Browse files Browse the repository at this point in the history
  • Loading branch information
mike42 committed Feb 4, 2018
1 parent 13cf1fd commit a6dee34
Show file tree
Hide file tree
Showing 5 changed files with 121 additions and 9 deletions.
2 changes: 1 addition & 1 deletion README.md
@@ -1,4 +1,4 @@
# escpos-print-db browser
# escpos-printer-db browser

[![Build Status](https://travis-ci.org/receipt-print-hq/escpos-printer-db-browser.svg?branch=master)](https://travis-ci.org/receipt-print-hq/escpos-printer-db-browser)

Expand Down
52 changes: 44 additions & 8 deletions index.html
Expand Up @@ -13,6 +13,9 @@
</script>

<script type="text/template" id="encoding-template-detail">
<div class="right">
<a href="https://github.com/receipt-print-hq/escpos-printer-db/blob/master/data/encoding.yml" title="Suggest changes to <%= _.escape(name) %> on GitHub"><i class="material-icons blue-text text-darken-1">edit</i></a>
</div>
<h3>Encoding: <%= _.escape(name) %></h3>

<h4>Basic details</h4>
Expand All @@ -28,20 +31,44 @@ <h4>Basic details</h4>
</tr>
<tr>
<th>Python encode ID</th>
<td><%= _.escape(python_encode) %></td>
<td><%= _.isEmpty(python_encode) ? '&mdash;' : _.escape(python_encode) %></td>
</tr>
<tr>
<th>Iconv ID</th>
<td><%= _.escape(iconv) %></td>
<td><%= _.isEmpty(iconv) ? '&mdash;' : _.escape(iconv) %></td>
</tr>
</table>

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

<table class="striped compact">
<thead>
<tr>
<th>&nbsp;</th>
<% hex_chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F']; _.each(hex_chars, function(i) { %>
<th><%= _.escape(i) %></th>
<% }); %>
</tr>
</thead>
<tbody>
<% for (i = 0; i < 8; i++) { %>
<tr>
<th><%= _.escape(hex_chars[i + 8]) %></th>
<% for (j = 0; j < 16; j++) { %>
<% if(data[i][j] === ' ') { %>
<td>&nbsp;</td>
<% } else {%>
<td title="<%= _.escape(name) %> 0x<%= _.escape(hex_chars[i + 8]) %><%= _.escape(hex_chars[j]) %>: <%= _.escape(data[i][j]) %>"><%= _.escape(data[i][j]) %></td>
<% } %>
<% } %>
</tr>
<% } %>
</tbody>
</table>
<% } %>

<h4>Referenced in profiles</h4>
<h4>Used in profiles</h4>

<div class="collection">
<% _.each(profiles, function(profile) { %>
Expand All @@ -65,10 +92,13 @@ <h3>Vendor: <%= _.escape(name) %></h3>
</script>

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

<script type="text/template" id="profile-template-detail">
<div class="right">
<a href="https://github.com/receipt-print-hq/escpos-printer-db/blob/master/data/profile/<%= _.escape(id) %>.yml" title="Suggest changes to <%= _.escape(name) %> on GitHub"><i class="material-icons blue-text text-darken-1">edit</i></a>
</div>
<h3><%= _.escape(name) %></h3>

<%= _.escape(notes) %>
Expand Down Expand Up @@ -181,11 +211,14 @@ <h4>Text code pages</h4>
<nav class="blue lighten-1" role="navigation">
<div class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo"><i class="material-icons">folder</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="#">Browse</a></li>
<li><a href="#">Home</a></li>
</ul>

<ul id="nav-mobile" class="side-nav">
<li><a href="#">Browse</a></li>
<li><a href="#">Home</a></li>
<li><a href="#profiles">Printer profiles</a></li>
<li><a href="#encodings">Text encodings</a></li>
<li><a href="#vendors">Printer vendors</a></li>
</ul>
<a href="#" data-activates="nav-mobile" class="button-collapse"><i class="material-icons">menu</i></a>
</div>
Expand Down Expand Up @@ -230,7 +263,7 @@ <h5 class="center">Localised</h5>
<div class="icon-block">
<h2 class="center blue-text"><i class="material-icons">code</i></h2>
<h5 class="center">Open source</h5>
<p class="light">This data was by the open source POS community, to help improve their own printing experience.</p>
<p class="light">This data was collected by the open source POS community, to help improve their own printing experience.</p>
<p class="light">By contributing to this database, you can improve software compatibility for the printers that you use.</p>
<p class="center">
<a class="btn waves-effect waves-light blue" href="https://github.com/receipt-print-hq/escpos-printer-db">Get involved</a>
Expand Down Expand Up @@ -258,6 +291,9 @@ <h5 class="center">Vendor independent</h5>
</div>

<div id="page-profiles" class="container hide">
<div class="right">
<a href="https://github.com/receipt-print-hq/escpos-printer-db/blob/master/doc/add-your-printer.md" title="Add your printer"><i class="material-icons blue-text text-darken-1">add</i></a>
</div>
<h3>Printer profile list</h3>
<div class="collection" id="profile-list"></div>
</div>
Expand Down
5 changes: 5 additions & 0 deletions src/styles/main.scss
Expand Up @@ -53,3 +53,8 @@
html {
overflow-y: scroll;
}

/* Compact table */
.compact td, .compact th {
padding: 5px 5px;
}
55 changes: 55 additions & 0 deletions tools/generate_iconv.php
@@ -0,0 +1,55 @@
#!/usr/bin/env php
<?php
/**
* PHP script to generate representation of a code page as a small brick of text, so that the characters used in escpos-php can be viewed on the web.
*/

/**
* From CodePage.php in escpos-php.
*/
class CodePage
{
/**
* The input encoding for generating character maps with iconv.
*/
const INPUT_ENCODING = "UTF-8";

/*
*
* Given an iconv encoding name, generate a 128-character UTF-8 string, containing code points 128-255.
*
* This string is used to map UTF-8 characters to their location in this code page.
*
* @param string $iconvName
* Name of the encoding
* @return string 128-character string in UTF-8.
*/
public static function generateEncodingMap($iconvName)
{
// Start with array of blanks (" " indicates unknown character).
$charMap = array_fill(0, 128, " ");
// Loop through 128 code points
for ($char = 128; $char <= 255; $char ++) {
// Try to identify the UTF-8 character that would go here
$utf8 = @iconv($iconvName, self::INPUT_ENCODING, chr($char));
if ($utf8 == '') {
continue;
}
if (iconv(self::INPUT_ENCODING, $iconvName, $utf8) != chr($char)) {
// Avoid non-canonical conversions (no known examples)
continue;
}
// Replace the ' ' with the correct character if we found it
$charMap[$char - 128] = $utf8;
}
// Join into a 128-character string and return.
$charMapStr = implode("", $charMap);
assert(mb_strlen($charMapStr, self::INPUT_ENCODING) == 128);
return $charMapStr;
}
}

$enc = $argv[1];
echo CodePage::generateEncodingMap($enc);

?>
16 changes: 16 additions & 0 deletions tools/import_database.py
Expand Up @@ -2,6 +2,7 @@
import json
import os
import requests
import subprocess

# Will load from filename if available, otherwise URL will be hit for latest DB
CAP_URL = "https://raw.githubusercontent.com/receipt-print-hq/escpos-printer-db/master/dist/capabilities.json"
Expand Down Expand Up @@ -40,6 +41,21 @@ def produce_encoding(encoding_id, db_data, profile_keys):
{'id': x,
'name': db_data['profiles'][x]['name']
} for x in profile_keys if encoding_id in db_data['profiles'][x]['codePages'].values()]
# Convert 'data' to list of characters
if 'data' in db_data['encodings'][encoding_id]:
enc['data'] = [list(x) for x in db_data['encodings'][encoding_id]['data']]
elif 'iconv' in db_data['encodings'][encoding_id]:
# Call out to some recycled code to generate the encoding list now
dir_path = os.path.dirname(os.path.realpath(__file__))
encoding = db_data['encodings'][encoding_id]['iconv']
script = dir_path + "/generate_iconv.php"
# Gets 128-char UTF-8 string showing the upper-half of the code page
enc_str = subprocess.check_output([script, encoding]).decode("utf-8")
if len(enc_str) == 128:
# Chop into list of 16-character strings
enc_list = [ enc_str[i:i+16] for i in range(0, 128, 16) ]
# Chop into list of 16-item arrays, one entry per char
enc['data'] = [list(x) for x in enc_list]
return enc

def dict_to_list(inp_obj):
Expand Down

0 comments on commit a6dee34

Please sign in to comment.