Telescope is the service ( from client or server ) works for render view ( md / code / image... ) via fetching URL.
It's awesome that we can see any file on the internet. And telescope provides three ways (html/image/pdf) to display the view.
So you can write the markup as follows.
<!--https://telescopejs.github.io/ is the client side's service without any dynamic server-->
<iframe src="https://telescopejs.github.io/?q=picidaejs/picidaejs" frameborder="0" width="100%" height="400px"></iframe>- ✈ Supports client and server side.
- 🍻 Multiply styles.
- 😊 The service server side supports output the view via image or pdf.
- 🍫 The code supports specified line range.
- 👍 More features is waiting for you to discover...
Hackernoon and Medium has the similar view via rendering gist snippet. We can use telescope service to preview or generate the image / pdf easily!
git clone https://github.com/telescopejs/telescope.git
cd telescope
# If you are in china, should set PUPPETEER_DOWNLOAD_HOST to speed the installation of puppeteer.
PUPPETEER_DOWNLOAD_HOST=https://npm.taobao.org/mirrors npm install
# server side, default port 8002
npm start
# or client side, default port 9999
npm run client
# build the assert of client side on `public/`
npm run client:buildMeanwhile, telescope requires chrome libraries.
You should ensure the dependencies of chrome that you had installed,
because I use the headless Chrome browser puppeteer to generate snapshot and pdf.
Open http://localhost:9999 after setup the service on port 9999.
- The accepted query string table (server side accepted too)
| name | type | description |
|---|---|---|
q |
string | the fetching url, e.g. picidaejs/picidaejs/master/src/index.js picidaejs/picidaejs |
style |
string | the view style, please see https://telescopejs.github.io/?debug=true |
hlStyle |
string | the code's highlight style, please see https://telescopejs.github.io/?debug=true |
range |
number|[start, end] | the code's range, e.g. ?range=10 ?range=[10] ?range=[10, 20] ?range=[-20, -15] |
And specially, debug=true is accepted on client side for debug.
Temporary outside service http://23.106.151.229:8002/
- Please try the path name below
/telescopejs/telescope
/img/telescopejs/telescope
/img/telescopejs/telescope/master/package.json?hlStyle=school-book
/pdf/telescopejs/telescope
/pdf/telescopejs/telescope/master/package.json
If you want to customize yourself own telescope, Please write your plugin or style.
MIT imcuttle