Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Examples improvements #1919

Merged
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
130 changes: 64 additions & 66 deletions scripts/examples.js
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