Before I realised I should probably make the source code of my projects public (instead of just dumping tens of hours into them and forgetting about them), I made a bunch of cool things that I've never shared with anyone.

Today I've discovered another gem I've made back in August of 2015 (according to file timestamps). I've actually pushed the source code to my GitHub sometime later and successfully forgot about it. To give myself some closure, I'm going to immortalise Auth-chan in this blog post, and forget about her again.

Auth-chan assistant

First of all: here's the online demo and here's the source code on GitHub. Note that the online demo corresponds to the code in the v1.0 folder.

Here I could have several paragraphs explaining who Auth-chan is and what she does. OR I could just show you one of these wonderful screencaps:

Make sure to check out the online demo to see Auth-chan in her fully-animated glory.

Unfortunately I did not produce any documentation (classic me) and I can't recall much about her, but looking at the source code of the example page I can see that the Auth-chan had quite a few features. For example, here's the part setting up the first popup in the demo (added linebreaks for readability):

// Demo #1
var steps1 = [];
steps1.push({
    type: 'text',
    subtype: 'short',
    size: 'medium',
    authchan: false,
    text: 'I\'m here to help your users to fill out forms or help '
        + 'them understand how something works.'
});
steps1.push({
    type: 'text',
    subtype: 'medium',
    size: 'medium',
    authchan: 'shy',
    text: 'I\'m still being developed so sometimes I might not live '
       + 'up to your expectations... Please don\'t get mad if I do!'
});
steps1.push({
    type: 'text',
    subtype: 'short',
    size: 'small',
    authchan: 'ok',
    text: 'Thanks for listening! You can now close this popup.'
});

var Authchan1 = new window.Authchan({
    skipFarewell: true,
    submitOnClose: false
}, steps1);

document.getElementById('demo-1').addEventListener('click', function (event) {
    event.preventDefault();
    Authchan1.open();
});

Apparently you could specify emotions and animations for Auth-chan, as well as the type of speech bubble she's going to use. The second part looks somewhat cool too, she could actually deal with user input:

// Demo #2
var steps2 = [];
steps2.push({
    type: 'text',
    subtype: 'short',
    size: 'small',
    authchan: 'kawaii',
    text: 'I\'m going to ask you a couple of questions.'
});
steps2.push({
    type: 'input',
    subtype: 'text',
    name: 'name',
    placeholder: 'Type here',
    size: 'small',
    authchan: false,
    text: 'Please tell me your name:'
});
steps2.push({
    type: 'textarea',
    subtype: 'medium',
    name: 'opinion',
    placeholder: 'Type here',
    size: 'medium',
    authchan: 'shy',
    text: 'What is your opinion of Auth-chan?'
});

var Authchan2 = new Authchan({
    skipIntroduction: true,
    submitCallback: function (data) {
        var fragment = document.createDocumentFragment();
        var h2 = document.createElement('h2');
        h2.innerHTML = 'Results';
        fragment.appendChild(h2);
        var p = document.createElement('p');
        p.innerHTML = 'Auth-chan says your name is <b>' + data.name
                    + '</b> and your opinion of her is as follows:';
        fragment.appendChild(p);
        var blockquote = document.createElement('blockquote');
        blockquote.innerText = data.opinion;
        fragment.appendChild(blockquote);

        var button = document.getElementById('demo-2');
        button.parentNode.insertBefore(fragment, button);
    },
    closeButtonText: 'View Answers'
}, steps2);

document.getElementById('demo-2').addEventListener('click', function (event) {
    event.preventDefault();
    Authchan2.open();
});

I won't go into detail but I'll say that although I disagree with some implementation and API design choices, I definitely think Auth-chan was an interesting programming exercise. Good job, past me.