Added example

Author: graham-trott

easycoder/easycoder-min.js

@@ -3504,7 +3504,9 @@ const EasyCoder = {
 		this.reportError({
 			message: `Line ${(lino >= 0) ? lino : ``}: ${message}`
 		}, this.program);
-		this.program.aborted = true;
+		if (this.program) {
+			this.program.aborted = true;
+		}
 	},
 	nonNumericValueError: function (lino) {
 		this.runtimeError(lino, `Non-numeric value`);

easycoder/easycoder.js

@@ -1979,7 +1979,8 @@ const EasyCoder_Browser = {
 					const styleName = compiler.getValue();
 					let type = `setStyle`;
 					let symbolName = ``;
-					if (compiler.tokenIs(`of`)) {
+					token = compiler.getToken();
+					if (token === `of`) {
 						if (compiler.nextToken() === `body`) {
 							type = `setBodyStyle`;
 						} else if (compiler.isSymbol()) {
@@ -2007,6 +2008,20 @@ const EasyCoder_Browser = {
 							}
 						}
 					}
+					else if (token === `to`) {
+						const styleValue = compiler.getNextValue();
+						if (styleValue) {
+							compiler.addCommand({
+								domain: `browser`,
+								keyword: `set`,
+								lino,
+								type: `setHeadStyle`,
+								styleName,
+								styleValue
+							});
+							return true;
+						}
+					}
 				} else if (token === `default`) {
 					if (compiler.nextTokenIs(`of`)) {
 						if (compiler.nextIsSymbol()) {
@@ -2121,7 +2136,8 @@ const EasyCoder_Browser = {
 					targetId = program.getValue(symbol.value[symbol.index]);
 					target = document.getElementById(targetId);
 				}
-				program.getValue(command.value).split().forEach(function(item) {
+				program.getValue(command.value).split(` `).forEach(function(item) {
+					target.classList.remove(item);
 					target.classList.add(item);
 				});
 				break;
@@ -2233,6 +2249,23 @@ const EasyCoder_Browser = {
 					break;
 				}
 				break;
+			case `setHeadStyle`:
+				const headStyleName = program.getValue(command.styleName);
+				const headStyleValue = program.getValue(command.styleValue);
+				var style = document.createElement('style');
+				style.innerHTML = `${headStyleName} ${headStyleValue}`;
+				for (let i = 0; i < document.head.childNodes.length; i++) {
+					let node = document.head.childNodes[i];
+					if (node.tagName === `STYLE`) {
+						let data = node.innerHTML;
+						if (data.indexOf(`${headStyleName} `) === 0) {
+							document.head.removeChild(node);
+							break;
+						}
+					}
+				}	
+				document.head.appendChild(style);
+				break;
 			case `setBodyStyle`:
 				const bodyStyleValue = program.getValue(command.styleValue);
 				switch (command.styleName.content) {

easycoder/easycoder.zip

@@ -319,6 +319,14 @@ const EasyCoder_Json = {
 				if (content.domain.endsWith(`/`)) {
 					content.domain = content.domain.substr(0, content.domain.length - 1);
 				}
+				n = content.domain.indexOf(`/`);
+				if (n > 0) {
+					content.path = content.domain.substr(n + 1);
+					content.domain = content.domain.substr(0, n);
+				}
+				else {
+					content.path = ``;
+				}
 				targetRecord.value[targetRecord.index] = {
 					type: `constant`,
 					numeric: false,

easycoder/plugins/browser.js

@@ -67,7 +67,9 @@ const EasyCoder_VFX = {
 			const image = document.createElement(`img`);
 			targetRecord.animation[targetRecord.index].image = image;
 			container.appendChild(image);
+			image.style[`display`] = `none`;
 			image.style[`position`] = `absolute`;
+			image.style[`max-width`] = `none`;
 			return command.pc + 1;
 		}
 	},
@@ -122,7 +124,7 @@ const EasyCoder_VFX = {
 			if (compiler.tokenIs(`the`)) {
 				type = compiler.nextToken();
 			}
-			if ([`url`, `specification`, `spec`].includes(type)) {
+			if ([`url`, `specification`, `spec`, `opacity`].includes(type)) {
 				if (compiler.nextTokenIs(`of`)) {
 					if (compiler.nextIsSymbol()) {
 						const symbolRecord = compiler.getSymbolRecord();
@@ -148,15 +150,15 @@ const EasyCoder_VFX = {
 			const command = program[program.pc];
 			let targetRecord = program.getSymbolRecord(command.target);
 			let container = targetRecord.element[targetRecord.index];
-			let animation = targetRecord.animation[targetRecord.index];
+			let animation;
 			switch (command.type) {
 				case `url`:
 					let url = program.getValue(command.value);
 					animation.image.setAttribute(`src`, url);
 					break;
 				case `specification`:
 				case `spec`:
-					let animation = targetRecord.animation[targetRecord.index];
+					animation = targetRecord.animation[targetRecord.index];
 					let spec = JSON.parse(program.getValue(command.value));
 					animation.spec = spec;
 					animation.step = spec.steps;
@@ -198,14 +200,19 @@ const EasyCoder_VFX = {
 						animation.top = animation.topS;
 						animation.width = animation.widthS;
 						let image = animation.image;
-						image.setAttribute(`src`, spec.url);
 						image.style.left = `-${animation.left}px`;
 						image.style.top = `-${animation.top}px`;
 						image.style.width = `${animation.width}px`;
+						image.setAttribute(`src`, spec.url);
 					} else {
 						program.runtimeError(command.lino, `Unknown animation type '${spec.type}'`);
 						return 0;
 					}
+				case `opacity`:
+					animation = targetRecord.animation[targetRecord.index];
+					let image = animation.image;
+					image.style.opacity = command.value;
+					break;
 			}
 			return command.pc + 1;
 		}
@@ -239,6 +246,7 @@ const EasyCoder_VFX = {
 			animation.left = animation.leftS;
 			animation.top = animation.topS;
 			animation.width = animation.widthS;
+			animation.image.style.display = `inline-block`;
 			return command.pc + 1;
 		}
 	},

easycoder/plugins/json.js

@@ -13,7 +13,9 @@ const EasyCoder = {
 		this.reportError({
 			message: `Line ${(lino >= 0) ? lino : ``}: ${message}`
 		}, this.program);
-		this.program.aborted = true;
+		if (this.program) {
+			this.program.aborted = true;
+		}
 	},
 	nonNumericValueError: function (lino) {
 		this.runtimeError(lino, `Non-numeric value`);

easycoder/plugins/vfx.js

@@ -2136,7 +2136,8 @@ const EasyCoder_Browser = {
 					targetId = program.getValue(symbol.value[symbol.index]);
 					target = document.getElementById(targetId);
 				}
-				program.getValue(command.value).split().forEach(function(item) {
+				program.getValue(command.value).split(` `).forEach(function(item) {
+					target.classList.remove(item);
 					target.classList.add(item);
 				});
 				break;
@@ -2253,6 +2254,16 @@ const EasyCoder_Browser = {
 				const headStyleValue = program.getValue(command.styleValue);
 				var style = document.createElement('style');
 				style.innerHTML = `${headStyleName} ${headStyleValue}`;
+				for (let i = 0; i < document.head.childNodes.length; i++) {
+					let node = document.head.childNodes[i];
+					if (node.tagName === `STYLE`) {
+						let data = node.innerHTML;
+						if (data.indexOf(`${headStyleName} `) === 0) {
+							document.head.removeChild(node);
+							break;
+						}
+					}
+				}	
 				document.head.appendChild(style);
 				break;
 			case `setBodyStyle`:

js/easycoder/Main.js

@@ -4,6 +4,4 @@ Here are some ~ec~ contact options:
 
 1. Email to [info@easycoder.software](mailto:info@easycoder.software)
 
-1. Contact the author on [Fleep Messenger](mailto:graham.trott@fleep.io).
-
 1. Join our [Slack channel](https://join.slack.com/t/easycoder-software/shared_invite/enQtNTU5ODEwOTQ5NTU0LWQ1NWVkOTUxOGQ3NzJmNDI1ZGRlOTdmMjc1NDAxMGIwMTFjODg1ZDJhODEzMzUzODc2MDNlZWU4NmYyZWRlOWI).

js/plugins/browser.js

@@ -209,6 +209,11 @@
             "syntax": "filter {array} with {function}",
             "description": "This is a generalized filter function that will extract wanted values from a JSON array using a function supplied in the script. In the following description, refer to the example above.%0a%0aThe filter function is called once for every element in the array, each with the element. This is always called ~m:a~ and is supplied as a named argument in the array variable. The function does whatever is needed in the context and places the result value (true or false) into a ~m:v~ argument.%0a%0aSee also ~l:sort~ and ~l:append~.",
             "examples": "  variable Items%0a  variable A%0a  variable V%0a    %0a  put empty into Items%0a  append `fish` to Items%0a  append `cabbage` to Items%0a  append `sugar` to Items%0a  append `beef` to Items%0a  append `potatoes` to Items%0a  filter Items with MyFilter%0a  alert Items%0a  exit%0a%0aMyFilter:%0a  put arg `a` of Items into A%0a  if the length of A is greater than 5%0a    set V%0a    else clear V%0a  set arg `v` of Items to V%0a  stop"
+        },
+        "CORE": {
+            "syntax": "Core variables and commands",
+            "description": "The ~m:core~ package contains all the basic stuff required of any programming language: variables, control structures, values and conditionals. With these it's possible to write and run simple command-line programs.\n\nThe other packages all provide features related to specific areas of programming, such as for browsers, storage, comms and special things like maps and text editors.",
+            "examples": ""
         }
     },
     "values": {