inexorabletash / jslogo Goto Github PK
View Code? Open in Web Editor NEWLogo in JavaScript
Home Page: https://calormen.com/jslogo
License: Other
Logo in JavaScript
Home Page: https://calormen.com/jslogo
License: Other
The default pen width and units of length feel more fine-grained than makes sense to me. For example FD 10
draws a line shorter than the turtle itself.
When I type the command "forward" or "fd" then space the cursor goes back to the beginning of the word "forward".
All other commands that I have tried work ok.
I have my www folder:
/jslogo
/CodeMirror
/polyfill
I tried 2 separate web servers
TO and DEFINE only take required arguments. Should support TO [] [] ...
If one would like to just use the logo scripts without other integration like togetherjs or codemirror, how does one do that without reverse-engineering a good chunk of your code?
Example pls.
Only the "named-procedure" template form is supported
Other forms include:
Otherwise figures that extend past the bounds of the screen look funky.
Hello,
I want translate Logo's command to Polish language in JsLogo, but I have problem with Polish characters ( ążćńół ), example forward in Polish means naprzód. I replace forward in jslogo and I get error that this command is incorrect in jslogo. I'm afraid that it's caused by the fact that JavaScript encodes incorrectly characters.
Is way to fix it?
Thanks
Save code in textarea to localstorage? (So people can keep their work around)
Great work :)
Have an amazing week!
David
Possibly due to resize events from ???
No reliable repro yet.
Most (All?) data selectors also work for strings in addition to lists but the reference only shows lists as being supported. If this is really the case, consider updating the reference.
We should move the various turtle state gathering/application into a getstate() / setstate() method pair on turtle itself.
The turtle operations don't seem to be documented in Reference at all. I think a page specifically for those instructions would be useful, ideally with images. Examples:
FD 100
RT 90 ; maybe display [FD 20 RT 90] so that you get a sense of where it was pointing and where it ended up?
LT 45
BK 100
SETCOLOR "BLUE ; display [SETCOLOR "BLUE FD 100]
PENWIDTH 5 ; with FD displayed
There's probably some drawing commands I'm missing. I've been doing some turtle drawing with my daughter, and this would be helpful. Showing a diagram of degrees might also be helpful (with 30, 45, 60, and 90 being specifically interesting). Also units of length.
While I personally appreciate the "spaceship from Asteroids" aesthetic, making the turtle look like a turtle might be more appealing for kids.
Most implementations seem to use an opaque box turtle - very round shell with stubby limbs, head and tail. I think this would make it difficult to distinguish the orientation and the position of the pen. Also, box turtles are slow and boring.
So how about a stylized outline of a sea turtle? Sea turtles are aerodynamic and cool.
Something like this but just an outline: http://www.clker.com/clipart-turtle-outline-3.html
Allow assigning localize
property to LogoInterpreter
instance, call it from __()
if set.
The save hook tries to persist the definition of functions. Built-ins don't have serializable definitions, so trying to use the savehook from COPYDEF
results in badness.
We probably need a new type of serialization for aliases.
Need a flood-fill implementation that works well with antialiased lines.
// Not Supported: case
// Not Supported: cond
... so it doesn't overlay the links.
Also, make it RTL friendly.
"no history entries" or something
http://www.mathcats.com/gallery/15wordcontest.html
Procedures that are missing:
RESET
SETSCRUNCH
SETSCREENCOLOR
SETSC
DEFINE
Instead of passing it to LogoInterpreter
constructor, allow assigning ondefine
property to instance.
Parser: needs to treat anything between |...|
as "special"
There is a typo in line 1693 of logo.js
Andy
Primarily for localization
Basically, have def(name, func)
pass name
through __()
While not an in-depth effort, I spent about 30 minutes with a couple 9-year-olds. We made stars.
Some thoughts:
An iterative approach seemed best, expanding or adjusting the routine bit by bit. So the big editor worked better (instead of hitting up each time so we could edit/refine the last set of commands). Also an implied cs
would have been nice (I put it in, but it's just boilerplate then). And cs
doesn't reset the pencolor, which detracted a bit from the sense of reset.
The command print "a\nb
prints anb
in a single line.
TO x :Y print :Y END
x "foo
will get "Don't know about variable Y"
Fix should be to change line 934 from:
scope.set(inputs[i], {value: arguments[i]});
to:
scope.set(inputs[i].toLowerCase(), {value: arguments[i]});
Per comment on line 84, re: StringMap: "TODO: Allow case-sensitive and case-insensitive lookup ... Right now, callers must do case folding."
Make procedure calls async. Simple procedures would be implemented via this transform:
// old
function sum(a, b) {
return a + b;
}
function div(a, b) {
if (b === 0)
throw new Error("Division by zero");
return a / b;
}
// new
function sum(_, a, b) {
_(a + b);
}
function div(a, b) {
if (b === 0)
_(undefined, new Error("Division by zero");
_(a / b);
}
Task list:
_(result, error)
or _.result(r)
and _.error(e)
or ...?interpreter.run()
calls with a setTimeout() for nowinterpreter.run()
def()
make all the built-in first-order functions asyncprompt()
calls to use HTML UI instead of blocking browser UIIn order to facilitate program sharing is it possible to have the textarea expanded by default? Some people won't see the expansion icon and they'll get errors when pasting programs on one line.
Otherwise is it possible to have a #expanded extension/anchor of the URL that if present will automatically expand the textarea?
It's add two links:
You can find them in 'Extras' after add code.
after code:
<li><a id="savelibrary" href="#">Download Library</a>
<li><a id="screenshot" href="#">Download Drawing</a>
add:
<li><a id="deletehistory" href="#">Delete history</a>
<li><a id="deletelibrary" href="#">Delete library</a>
a) after code:
var savehook;
var historyhook;
add:
var deletehistory;
var deletelibrary;
b) after code:
tx.objectStore('history').openCursor().onsuccess = function(e) { ... };
add:
deletehistory = function() {
var tx = db.transaction('history', 'readwrite').objectStore("history");
tx.openCursor().onsuccess = function(event) {
var cursor = event.target.result;
if (cursor) {
cursor.delete();
cursor.continue();
}
};
};
deletelibrary = function() {
var tx = db.transaction('procedures', 'readwrite').objectStore("procedures");
tx.openCursor().onsuccess = function(event) {
var cursor = event.target.result;
if (cursor) {
cursor.delete();
cursor.continue();
}
};
};
c) after code:
$('#screenshot').addEventListener('click', function() { ... };
add:
$('#deletehistory').addEventListener('click', function() {
var c = confirm("Are you sure?");
if (c == true) {
deletehistory();
var div = document.getElementById('history');
while(div.firstChild){
div.removeChild(div.firstChild);
}
}
});
$('#deletelibrary').addEventListener('click', function() {
var c = confirm("Are you sure?");
if (c == true) {
deletelibrary();
var div = document.getElementById('library');
while(div.firstChild){
div.removeChild(div.firstChild);
}
}
});
This is tricky since the Logo procedures are compiled to JavaScript functions, and JavaScript (as of ES5) can't yield/sleep to let the display update.
Several approaches are possible:
All of the above suffer from not working well with interactivity i.e. popping up an alert or prompt in the middle of execution (which is supported by JavaScript in the browser).
More radical approaches:
Ditch it and rely on page reload?
Place Run/Clear side by side?
"it would be cool if" you could rotate the turtle out of the plane and suddenly it's drawing a line towards you.
This would nifty if the turtle was constrained to a 3D cuboid (vs. a 2D rectangle), but perspective allowed a "near" turtle's tracks to render outside of the canvas area, as if it was hovering above the web page.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.