# chinesedict-js-demo

> Demo of the chinesedict-js module on App Engine

Latest version **0.0.2** (published 2018-12-10) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install chinesedict-js-demo
pnpm add chinesedict-js-demo
yarn add chinesedict-js-demo
bun add chinesedict-js-demo
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: no vulnerabilities; high maintenance score.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2018-12-10 |
| First published | 2018-12-09 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=8 |
| Dependencies | 1 |
| Unpacked size | 10.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 9 |
| Author | alexamies |
| Maintainers | alexamies |

## Links

- npm: https://www.npmjs.com/package/chinesedict-js-demo
- Repository: https://github.com/alexamies/chinesedict-js/demo
- npm.io page: https://npm.io/package/chinesedict-js-demo

## Dependencies (1)

- [express](https://npm.io/package/express.md) ^4.16.4

## Recent versions

- 0.0.2 (latest) — 2018-12-10
- 0.0.1 — 2018-12-09

## README

# Demo Application
You can use the chinesedict-js module on any web or application server. These
instructions explain how to a more complex example than the initial example
using the App Engine Standard [Node.js Runtime
Environment](https://cloud.google.com/appengine/docs/standard/nodejs/runtime),
which uses the [Express](https://expressjs.com/) web framework. Actually, the
demo only uses Express for static file serving but takes advantage of the
economical container-based serving environment provided by App Engine Standard.

## Prerequisites
Create a [Google Cloud Platform](https://cloud.google.com/) (GCP)
project and install the [gcloud](https://cloud.google.com/sdk/gcloud/) command
line tool.

Set a variable for the top level project directory:
```
CDICT_HOME=`pwd`
```

## Build the dictionary
Clone the chinesenotes.com project and set an environment variable for the
location:
```
cd $CDICT_HOME/..
git clone https://github.com/alexamies/chinesenotes.com.git
CNREADER_HOME=`pwd`/chinesenotes.com
```

This contains a tab separated variable (TSV) dictionary file
[words.txt](https://github.com/alexamies/chinesenotes.com/blob/master/data/words.txt)
that we will use for this demo. Change to the build directory and build the
JSON format of the dictionary file:
```
cd $CDICT_HOME/build
node gen_dictionary.js --topic "Buddhism" $CNREADER_HOME/data/words.txt
```

This generates a words.json file that can be copied to your web dist
directory created below.

## Build the Web Client
The static files are contained in the directory 'static'. Change to that
directory and build the client assets.
```
cd $CDICT_HOME/demo/static
npm install
```

Copy the relevant files into a dist directory:
```
mkdir dist
cp $CDICT_HOME/index.js dist/.
cp $CDICT_HOME/chinesedict.css dist/.
cp node_modules/dialog-polyfill/dialog-polyfill.js dist/.
cp node_modules/dialog-polyfill/dialog-polyfill.css dist/.
```

This creates the dist directory and writes the bundled JavaScript files there.
Copy the dictionary file to the dist directory:
```
cp $CDICT_HOME/build/words.json dist/.
```

## Run locally
Since the application code does not use any App Engine specific features it can
be run without change using Node.js.
```
cd $CDICT_HOME/demo
npm start
```

## Deploy to App Engine
Set the default GCP project:
```
GAE_APPLICATION=[Your project id]
gcloud config set project $GAE_APPLICATION
```

Deploy to App Engine:
```
gcloud app deploy
```

## Example with Highlighting of Proper Nouns Only
The example in [static/highlighting.html](static/highlighting.html) demonstrates
restricting highlighting of proper nouns only. The other words are clickable
but not highlighted. This prevents the user being presented with a page filled
with highlighted elements.

Build the whole Chinese Notes dictionary
```
cd $CDICT_HOME/build
node gen_dictionary.js $CNREADER_HOME/data/words.txt
node check_dictionary.js
cd $CDICT_HOME/demo
cp $CDICT_HOME/build/words.json $CDICT_HOME/demo/static/dist/words_all.json
npm start
```

The entire Chinese Notes / NTI Reader dictionary is large. It would be ideal to
serve it compressed.

---
_Source: https://npm.io/package/chinesedict-js-demo · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
