Skip to content

Commit

Permalink
Examples improvements (#1919)
Browse files Browse the repository at this point in the history 
This PR makes some improvements to the examples website:

1. `fileExists` will now also check local files, so that newly added examples can be viewed.
    (Requires localhost)
1. `update` now uses `Prism.highlightAllUnder` instead of the self-constructed copy of it.
1. Some formatting.
  • Loading branch information
@RunDevelopment @mAAdhaTTah
RunDevelopment authored and mAAdhaTTah committed Jun 30, 2019
1 parent 922ec55 commit a16d4a2
Showing 1 changed file with 64 additions and 66 deletions.
130 changes: 64 additions & 66 deletions scripts/examples.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,63 +20,62 @@ var treePromise = new Promise(function (resolve) {

var languages = components.languages;

for (var id in languages) {
if (id === 'meta') {
continue;
}

(function (id) {
var language = languages[id];
var checked = false;

if (language.option === 'default') {
checked = true;
}
Promise.all(Object.keys(languages).filter(function (id) { return id !== 'meta'; }).map(function (id) {
var language = languages[id];

language.enabled = checked;
language.path = languages.meta.path.replace(/\{id}/g, id) + '.js';
language.examplesPath = languages.meta.examplesPath.replace(/\{id}/g, id) + '.html';
language.enabled = language.option === 'default';
language.path = languages.meta.path.replace(/\{id}/g, id) + '.js';
language.examplesPath = languages.meta.examplesPath.replace(/\{id}/g, id) + '.html';

fileExists(language.examplesPath).then(function (exists) {
$u.element.create('label', {
attributes: {
'data-id': id,
'title': !exists ? 'No examples are available for this language.' : ''
},
className: !exists ? 'unavailable' : '',
contents: [
{
tag: 'input',
properties: {
type: 'checkbox',
name: 'language',
value: id,
checked: checked && exists,
disabled: !exists,
onclick: function () {
$$('input[name="' + this.name + '"]').forEach(function (input) {
languages[input.value].enabled = input.checked;
});

update(id);
}
return fileExists(language.examplesPath).then(function (exists) {
return { id: id, exists: exists };
});
})).then(function (values) {
values.forEach(function (result) {
var id = result.id;
var exists = result.exists;
var language = languages[id];
var checked = language.enabled;

$u.element.create('label', {
attributes: {
'data-id': id,
'title': !exists ? 'No examples are available for this language.' : ''
},
className: !exists ? 'unavailable' : '',
contents: [
{
tag: 'input',
properties: {
type: 'checkbox',
name: 'language',
value: id,
checked: checked && exists,
disabled: !exists,
onclick: function () {
$$('input[name="' + this.name + '"]').forEach(function (input) {
languages[input.value].enabled = input.checked;
});

update(id);
}
},
language.title
],
inside: '#languages'
});
examples[id] = $u.element.create('section', {
'id': 'language-' + id,
'className': 'language-' + id,
inside: '#examples'
});
if (checked) {
update(id);
}
}
},
language.title
],
inside: '#languages'
});
}(id));
}
examples[id] = $u.element.create('section', {
'id': 'language-' + id,
'className': 'language-' + id,
inside: '#examples'
});
if (checked) {
update(id);
}
});
});


function fileExists(filepath) {
return treePromise.then(function (tree) {
Expand All @@ -85,6 +84,12 @@ function fileExists(filepath) {
return true;
}
}

// on localhost: The missing example might be for a new language
if (location.hostname === 'localhost' || location.hostname === '127.0.0.1') {
return getFileContents(filepath).then(function () { return true; }, function () { return false; });
}

return false;
});
}
Expand Down Expand Up @@ -150,11 +155,7 @@ function update(id) {
examples[id].innerHTML = buildContentsHeader(id) + contents;

loadLanguage(id).then(function () {
var elements = examples[id].querySelectorAll('code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code');

for (var i=0, element; element = elements[i++];) {
Prism.highlightElement(element);
}
Prism.highlightAllUnder(examples[id]);
});
});
} else {
Expand All @@ -166,10 +167,9 @@ function update(id) {
* Loads a language, including all dependencies
*
* @param {string} lang the language to load
* @type {Promise} the promise which resolves as soon as everything is loaded
* @returns {Promise} the promise which resolves as soon as everything is loaded
*/
function loadLanguage (lang)
{
function loadLanguage(lang) {
// at first we need to fetch all dependencies for the main language
// Note: we need to do this, even if the main language already is loaded (just to be sure..)
//
Expand Down Expand Up @@ -200,12 +200,10 @@ function loadLanguage (lang)
* Returns all dependencies (as identifiers) of a specific language
*
* @param {string} lang
* @returns {Array.<string>} the list of dependencies. Empty if the language has none.
* @returns {Array<string>} the list of dependencies. Empty if the language has none.
*/
function getDependenciesOfLanguage (lang)
{
if (!components.languages[lang] || !components.languages[lang].require)
{
function getDependenciesOfLanguage(lang) {
if (!components.languages[lang] || !components.languages[lang].require) {
return [];
}

Expand Down

0 comments on commit a16d4a2

Please sign in to comment.