diff --git a/js/toolbar.js b/js/toolbar.js
index fb6115faa0..1557734eeb 100644
--- a/js/toolbar.js
+++ b/js/toolbar.js
@@ -12,6 +12,9 @@ let WRAP = true;
const $j = jQuery.noConflict();
class Toolbar {
+ /**
+ * @constructor
+ */
constructor() {
this.stopIconColorWhenPlaying = "#ea174c";
this.language = localStorage.languagePreference;
@@ -21,11 +24,15 @@ class Toolbar {
this.tooltipsDisabled = false;
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderLogoIcon(onclick) {
const logoIcon = docById("mb-logo");
if (this.language === "ja") {
- logoIcon.innerHTML =
- '
';
+ logoIcon.innerHTML = '';
}
logoIcon.onmouseenter = () => {
@@ -41,6 +48,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderPlayIcon(onclick) {
const playIcon = docById("play");
const stopIcon = docById("stop");
@@ -51,6 +63,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderStopIcon(onclick) {
const stopIcon = docById("stop");
@@ -60,6 +77,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderNewProjectIcon(onclick) {
const newProjectIcon = docById("new-project");
@@ -68,6 +90,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderLoadIcon(onclick) {
const loadIcon = docById("load");
@@ -76,7 +103,10 @@ class Toolbar {
};
}
- // let wrapTurtleTooltipData = "Wrap Turtle Off";
+ /**
+ * @public
+ * @returns {void}
+ */
renderWrapIcon() {
const wrapIcon = docById("wrapTurtle");
let wrapButtonTooltipData = "Turtle Wrap Off";
@@ -103,6 +133,19 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} html_onclick
+ * @param {Function} doSVG_onclick
+ * @param {Function} svg_onclick
+ * @param {Function} png_onclick
+ * @param {Function} wave_onclick
+ * @param {Function} ly_onclick
+ * @param {Function} abc_onclick
+ * @param {Function} mxml_onclick
+ * @param {Function} blockartworksvg_onclick
+ * @returns {void}
+ */
renderSaveIcons(
html_onclick,
doSVG_onclick,
@@ -112,7 +155,8 @@ class Toolbar {
ly_onclick,
abc_onclick,
mxml_onclick,
- blockartworksvg_onclick) {
+ blockartworksvg_onclick
+ ) {
const saveButton = docById("saveButton");
const saveButtonAdvanced = docById("saveButtonAdvanced");
let saveHTML;
@@ -136,13 +180,13 @@ class Toolbar {
saveButton.onclick = () => {
//html_onclick();
saveHTML = docById("save-html-beg");
- console.debug(saveHTML);
+ // console.debug(saveHTML);
saveHTML.onclick = () => {
html_onclick();
};
savePNG = docById("save-png-beg");
- console.debug(savePNG);
+ // console.debug(savePNG);
svgData = doSVG_onclick(
canvas,
logo,
@@ -165,12 +209,12 @@ class Toolbar {
};
}
} else {
- console.debug("ADVANCED MODE BUTTONS");
+ // console.debug("ADVANCED MODE BUTTONS");
saveButton.style.display = "none";
saveButtonAdvanced.style.display = "block";
saveButtonAdvanced.onclick = () => {
saveHTML = docById("save-html");
- console.debug(saveHTML);
+ // console.debug(saveHTML);
saveHTML.onclick = () => {
html_onclick();
@@ -178,15 +222,8 @@ class Toolbar {
saveSVG = docById("save-svg");
savePNG = docById("save-png");
- console.debug(savePNG);
- svgData = doSVG_onclick(
- canvas,
- logo,
- turtles,
- canvas.width,
- canvas.height,
- 1.0
- );
+ // console.debug(savePNG);
+ svgData = doSVG_onclick(canvas, logo, turtles, canvas.width, canvas.height, 1.0);
// if there is no mouse artwork to save then grey out
if (svgData == "") {
@@ -241,11 +278,16 @@ class Toolbar {
};
}
}
-
+ /**
+ * @public
+ * @param {} planet
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderPlanetIcon(planet, onclick) {
const planetIcon = docById("planetIcon");
const planetIconDisabled = docById("planetIconDisabled");
-
+ console.log(planet);
if (planet) {
planetIcon.onclick = () => {
docById("toolbars").style.display = "none";
@@ -259,12 +301,16 @@ class Toolbar {
}
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderMenuIcon(onclick) {
const menuIcon = docById("menu");
const auxToolbar = docById("aux-toolbar");
menuIcon.onclick = () => {
- if (auxToolbar.style.display == "" ||
- auxToolbar.style.display == "none") {
+ if (auxToolbar.style.display == "" || auxToolbar.style.display == "none") {
onclick(false);
auxToolbar.style.display = "block";
menuIcon.innerHTML = "more_vert";
@@ -278,6 +324,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderRunSlowlyIcon(onclick) {
const runSlowlyIcon = docById("runSlowlyIcon");
if (_THIS_IS_MUSIC_BLOCKS_ && beginnerMode && language === "ja") {
@@ -290,6 +341,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderHelpIcon(onclick) {
const helpIcon = docById("helpIcon");
@@ -298,6 +354,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderModeSelectIcon(onclick) {
if (_THIS_IS_MUSIC_BLOCKS_) {
const begIcon = docById("beginnerMode");
@@ -314,6 +375,11 @@ class Toolbar {
}
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderRunSlowlyIcon(onclick) {
const runSlowlyIcon = docById("runSlowlyIcon");
if (_THIS_IS_MUSIC_BLOCKS_ && beginnerMode && this.language === "ja") {
@@ -326,6 +392,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderRunStepIcon(onclick) {
const runStepByStepIcon = docById("runStepByStepIcon");
if (_THIS_IS_MUSIC_BLOCKS_ && beginnerMode && this.language === "ja") {
@@ -337,13 +408,22 @@ class Toolbar {
docById("stop").style.color = this.stopIconColorWhenPlaying;
};
}
-
+ /**
+ * @public
+ * @param {Function} analytics_onclick
+ * @param {Function} openPlugin_onclick
+ * @param {Function} delPlugin_onclick
+ * @param {Function} setScroller
+ * @param {Function} _setupBlocksContainerEvents
+ * @returns {void}
+ */
renderAdvancedIcons(
analytics_onclick,
openPlugin_onclick,
delPlugin_onclick,
setScroller,
- _setupBlocksContainerEvents) {
+ _setupBlocksContainerEvents
+ ) {
const displayStatsIcon = docById("displayStatsIcon");
const loadPluginIcon = docById("loadPluginIcon");
const delPluginIcon = docById("delPluginIcon");
@@ -380,14 +460,11 @@ class Toolbar {
}
}
- // let scrollEnabled = false;
- // renderEnableHorizScrollIcon(setScroller, _setupBlocksContainerEvents) {
- // let enableHorizScrollIcon = docById('enableHorizScrollIcon');
- // enableHorizScrollIcon.onclick = () => {
- // setScroller();
- // _setupBlocksContainerEvents();
- // }
- // }
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderMergeIcon(onclick) {
const mergeWithCurrentIcon = docById("mergeWithCurrentIcon");
@@ -396,6 +473,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderRestoreIcon(onclick) {
const restoreIcon = docById("restoreIcon");
@@ -404,6 +486,11 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderChooseKeyIcon(onclick) {
const chooseKeyIcon = docById("chooseKeyIcon");
docById("chooseKeyDiv").style.display = "none";
@@ -412,11 +499,20 @@ class Toolbar {
};
}
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
renderJavaScriptIcon(onclick) {
docById("toggleJavaScriptIcon").onclick = () => onclick();
}
+ /**
+ * @param {Object} languageBox
+ */
renderLanguageSelectIcon(languageBox) {
+ console.log(languageBox);
const languageSelectIcon = docById("languageSelectIcon");
languageSelectIcon.onclick = () => {
const enUS = docById("enUS");
@@ -516,8 +612,13 @@ class Toolbar {
};
};
}
-
+ /**
+ * Initializes the toolbar
+ * @param {boolean} mode
+ * @returns {void}
+ */
init(mode) {
+ console.log(mode);
let strings;
let strings_;
if (_THIS_IS_MUSIC_BLOCKS_) {
@@ -556,11 +657,7 @@ class Toolbar {
["save-abc", _("Save sheet music as ABC"), "innerHTML"],
["save-ly", _("Save sheet music as Lilypond"), "innerHTML"],
["save-mxml", _("Save sheet music as MusicXML"), "innerHTML"],
- [
- "save-blockartwork-svg",
- _("Save block artwork as SVG"),
- "innerHTML"
- ],
+ ["save-blockartwork-svg", _("Save block artwork as SVG"), "innerHTML"],
["new-project", _("Confirm"), "innerHTML"],
["enUS", _("English (United States)"), "innerHTML"],
["enUK", _("English (United Kingdom)"), "innerHTML"],
@@ -647,11 +744,7 @@ class Toolbar {
["save-html", _("Save project as HTML"), "innerHTML"],
["save-svg", _("Save mouse artwork as SVG"), "innerHTML"],
["save-png", _("Save mouse artwork as PNG"), "innerHTML"],
- [
- "save-blockartwork-svg",
- _("Save block artwork as SVG"),
- "innerHTML"
- ],
+ ["save-blockartwork-svg", _("Save block artwork as SVG"), "innerHTML"],
["new-project", _("Confirm"), "innerHTML"],
["enUS", _("English (United States)"), "innerHTML"],
["enUK", _("English (United Kingdom)"), "innerHTML"],
@@ -741,12 +834,22 @@ class Toolbar {
belowOrigin: true // Displays dropdown below the button
});
}
-
+ /**
+ * @public
+ * @param {Object} jquery
+ * @returns {void}
+ */
disableTooltips = (jquery) => {
+ console.log(jquery);
jquery(".tooltipped").tooltip("remove");
this.tooltipsDisabled = true;
- }
+ };
+ /**
+ * @public
+ * @param {Function} onclick
+ * @returns {void}
+ */
closeAuxToolbar = (onclick) => {
if (auxToolbar.style.display === "block") {
onclick(false);
@@ -755,5 +858,5 @@ class Toolbar {
menuIcon.innerHTML = "menu";
docById("toggleAuxBtn").className -= "blue darken-1";
}
- }
+ };
}