import { display, generate } from "facesjs";
// Generate a random face
const face = generate();
// Display in a div with id "my-div-id"
display("my-div-id", face);
import { display, generate } from "facesjs";
// Generate a random face
const face = generate();
// Display in a div with id "my-div-id"
display("my-div-id", face);
Let's say I want to add a random face to every div with class "face". With this API have to generate ids. With an API that returns a root element it's trivial and it's not duplicating work (inserting elements into the DOM) that already exists.
Taking a selector would not be much better because it would again be duplicating work and make it harder to customize usage.
Taking a parent element for it to insert into would also be a poor API because it makes it harder to insert next to a sibling.
A good API would be one of
const face = generate()
someElem.appendChild(face);
const face = generate()
someElem.appendChild(face.domElement);
const face = generate()
someElem.appendChild(face.html()); // assumes it can render to something else tooTo extend the documentation example, wouldn't you just have "my-div-id-sibling" already and call
display("my-div-id", face);
display('my-div-id-sibling", someOtherFace);
document.querySelectorAll('classIWantFacesIn').forEach(elem => {
const face = generate();
elem.id = `face-${crypto.randomUUID()}`; // this line should not be needed
display(elem.id, face);
});
document.querySelectorAll('classIWantFacesIn').forEach(elem => {
const face = generate();
elem.appendChild(face.domElement);
});
A nice thing about the current API is the face objects can be trivially serialized to JSON, which I need do in the application I originally wrote the library for.
Also the `display` function works with a DOM element as the first argument too, in which case you don't need to make up an ID. That's how I use it.
That being said, the API might not be perfect, but you should at least appreciate that it's been stable since v1 in 2015!
That said, I wouldn't have spoken up if someone hadn't claimed the API was good. Any one who makes a useful library that provides useful functionality people want is great!
> it's been stable since v1 in 2015!
That's awesome!
Consider...
// insert after every link
document.querySelectorAll('a.funny').forEach(elem =>
const face = generate();
const parentForFace = document.createElement('span');
elem.appendChild(parentForFace);
display(parentForFace);
});
// insert after every link
document.querySelectorAll('a.funny').forEach(elem =>
const face = generate();
elem.after(face.domElement);
});
I absolutely am looking for an excuse to use faces.js somewhere.
What you see now is already after another contributor came through and redid all my artwork. You don't want to know what it looked like back before then lol