Skip to content
Switch branches/tags
Go to file

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time


Daily comic strip gallery with mobile/touch support.

Intended for daily comic strips and based on the current date. Specify a start date for the earliest comic, and browse through all strips up to current day.

Supports touch gestures (swipe & shake) and the following keyboard shortcuts:

previous date next date R random comic T today's comic

daily-glry is based on glry and requires date-fns.


$ npm install daily-glry --save


Place some basic HTML on your page:

<figure id="figure">
  <div class="loading">LOADING</div>
  <div class="error">STRIP MISSING</div>

  <nav class="navigation">
    <button class="prev"></button>
    <button class="rand">Random</button>
    <button class="next"></button>
    <button class="today">Today</button>
    <button class="share">Share</button>

Initialize the gallery with a minimal set of options like this:

import DailyGlry from 'daily-glry';

const dailyGlry = new DailyGlry({
  dateMin: new Date(2014, 1, 22),
  host: '',
  extension: '.png',
  onOutOfRange: function () {
    alert('No more comics until tomorrow.');

The only required option is host which should be the base domain and folder of your comics. This will be used to load the daily comic file. The current year and date will be appended to host like this:


The available options and their defaults are as follows:

  target: '#figure',
  host: null,
  hashFormat: 'YYYY-MM-DD',
  nameFormat: 'YYYY/YYYYMMDD',
  extension: '.png',
  onOutOfRange: false

You can change the filename and hash format with nameFormat/hashFormat using this syntax.

If a date outside the specified range is called, you can call custom logic by passing a function to onOutOfRange.

All the options available in glry can also be used.

Shake support (optional)

If you include the great plugin shake.js, shaking your device will load a random comic same as pressing R.

Just install the plugin and include it:

$ npm install shake.js --save
import Shake from 'shake.js';

const myShakeEvent = new Shake({
  threshold: 15, // optional shake strength threshold
  timeout: 1000 // optional, determines the frequency of event generation



Daily comic strip gallery with mobile/touch support.




No packages published