Skip to content

Commit b3000c1

Browse files
committed
doc
1 parent d16ead1 commit b3000c1

File tree

5 files changed

+19
-15
lines changed

5 files changed

+19
-15
lines changed

resources/codex/md/background.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
# Background information #
22
This is the ~ec~ **Codex**, a comprehensive free resource aimed at two groups of people:
33

4-
**Beginners** can learn to code using English-like scripts, with no prior experience needed, no need to set up hosting or to download any software. Codex includes a comprehensive tutorial with many working examples.
4+
**Beginners** can learn to code using English-like scripts, with no prior experience needed, no need to set up hosting or to download any software. **Codex** includes a comprehensive tutorial with many working examples.
55

6-
**Experts** can leverage the ~ec~ technology to achieve better productivity. When the Codex is installed on a server it allows direct access by the owner of the site to all the site code, which can be developed and maintained on any PC or even a smartphone.
6+
**Experts** can leverage the ~ec~ technology to achieve better productivity. When the **Codex** is installed on a server it allows direct access by the owner of the site to all the site code, which can be developed and maintained on any PC or even a smartphone.
77

8-
~ec~ was originally developed as a WordPress plugin, to offer non-programmers a relatively painless way to customize aspects of their pages and add simple interactivity based on DOM manipulation. As it developed it became clear that it was capable of far more than mere tweaks and was soon employed as the engine behind several complete websites. Further development resulted in the Codex, a complete IDE for website coding and a tutorial for programmers, both novice and expert.
8+
~ec~ was originally developed as a WordPress plugin, to offer non-programmers a relatively painless way to customize aspects of their pages and add simple interactivity based on DOM manipulation. As it developed it became clear that it was capable of far more than mere tweaks and was soon employed as the engine behind several complete websites. Further development resulted in the **Codex**, a complete IDE for website coding and a tutorial for programmers, both novice and expert.
99

10-
~ec~ is written in vanilla JavaScript with no dependencies except those called for by optional plugins. The total package size is about 250kB so it forms a fairly minor addition to a web page. However, it implements a complete scripting language able to perform all the major functions required by any website, and its plugin architecture allows extra functionality to be added by anyone in a seamless manner.
10+
~ec~ is written in vanilla JavaScript with no dependencies except those called for by optional plugins. The total package size - with all features used - is about 250kB so it forms a fairly minor addition to a web page. However, it implements a complete scripting language able to perform all the major functions required by any website, and its plugin architecture allows extra functionality to be added by anyone in a seamless manner.
1111

1212
Sites built with ~ec~ need no JavaScript in their site logic, and because scripts are easy to understand it takes only a short time for a new programmer to become familiar with the language. This is great for productivity. For the same reason, maintenance of the site is made far easier than is otherwise commonly the case. Both these factors result in a drastic lowering of the overall TCO of the site.
1313

resources/codex/md/install.md

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
# Installing the EasyCoder Codex #
2-
The ~ec~ **Codex** is a complete integrated development system for coding websites. It can be run locally in your own computer or installed on your server; the only prerequisite is a recent copy of PHP.
2+
The ~ec~ **Codex** is a complete integrated development system for coding websites. It can be run locally in your own computer or installed on your server; the only prerequisite is a recent copy of PHP or Python 3, depending on which you want to use to run a local webserver.
33

4-
## Installation on a regular PC ##
4+
## Installation on a regular PC using PHP ##
55
First download the Codex archive into an empty folder.
66

77
Unzip the archive.
@@ -14,14 +14,17 @@ You should get confirmation that the PHP server started.
1414

1515
Now go to your browser and type ~code:localhost:8000~ into the address bar. Hit ~code:Enter~. The Codex should start up.
1616

17+
## Installation on a regular PC using Python 3 ##
18+
In this case, use the ~rest.py~ script to run a local webserver on any port you choose.
19+
1720
## Installation on a server ##
1821
Download the Codex archive into the root of your website.
1922

2023
Unzip the archive.
2124

2225
Type the URL of your server into your browser address bar and hit ~code:Enter~. The Codex should start up.
2326

24-
If you need help, join our Slack channel by clicking here.
27+
If you need help, join our [Slack channel](https://join.slack.com/t/easycoder-software/shared_invite/enQtNTU5ODEwOTQ5NTU0LWQ1NWVkOTUxOGQ3NzJmNDI1ZGRlOTdmMjc1NDAxMGIwMTFjODg1ZDJhODEzMzUzODc2MDNlZWU4NmYyZWRlOWI).
2528

2629
## Script strategies ##
2730
There are two main strategies for using ~ec~ scripts, as follows:
@@ -62,6 +65,8 @@ becomes
6265

6366
~pre:attach Button to `ec-button`~
6467

68+
where ~code:ec-button~ is the id of an element that already exists in your HTML.
69+
6570
The most common use of this strategy is probably where an existing page is being retrofitted with ~ec~ script.
6671

6772
### Script from your server ###
@@ -85,7 +90,7 @@ Here's what the simplest form of this page looks like:
8590
<pre id="easycoder-script">
8691

8792
variable Script
88-
rest get Script from &#96;/resources/scripts/myscript&#96;
93+
rest get Script from &#96;/resources/ecs/myscript.ecs&#96;
8994
run Script
9095
stop
9196

@@ -95,8 +100,8 @@ stop
95100

96101
</html>~
97102

98-
Here the script (~code:myscript~) is located in the ~code:{site root}/resources/scripts~ directory. When you write scripts in Codex, put them in this directory, allowing you to directly maintain your site code from any computer (including a smartphone).
103+
Here the script (~code:myscript.ecs~) is located in the ~code:{site root}/resources/ecs~ directory. When you write scripts in Codex, put them in this directory, allowing you to directly maintain your site code from any computer (including a smartphone). The downloaded package includes a file called ~scripted.html~, which is a script editor with which you can edit files in the ~ecs~ directory. You will have to set up an encrypted password in ~code:properties.txt~; it's probably best to contact us for details of this unless you feel like diving into the ~code:rest.php~ REST server.
99104

100105
If you can deal with the CORS issues you can use a complete URL to retrieve your script from a remote site, as in
101106

102-
~pre:rest get Script from &#96;https://mysite.com/myscripts/home&#96;~
107+
~pre:rest get Script from &#96;https://mysite.com/myscripts/home.ecs&#96;~

resources/codex/md/step16.md

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
# Using Google Maps #
2-
32
One of the strengths of ~ec~ is the way it can be extended using plugins. These are JavaScript code modules that provide extra language features to users of the system. EasyCoder comes with a number of these, available on demand, so I'll demonstrate how to use one of the more interesting ones.
43

54
Google Maps are one of the most spectacular features to be found on any website. They provide a vast range of features and require very little effort to include on the page. That said, it takes some effort to learn how to do it, and we've taken away that effort by building our own ~ec~ plugin to handle maps for you. Currently it's a little basic but we hope to add more features as time goes by. Click here to load the map script:
@@ -10,7 +9,7 @@ The script builds a page using the full space available, then divides it into a
109

1110
In the variable list you'll see ~code:gmap Map~. This is part of the new functionality available with the plugin loaded, as are the commands later that make reference to the ~code:Map~.
1211

13-
The map itself requires a div to place it in, then you can create the map using a very small set of commands. The first thing to add to the map is an 'API key' provided by Google to authorize the use of a map on this website. You can get your own API key by registering as a Google developer and requesting your key on the appropriate page. (Unfortunately it's beyond the scope of these notes to describe how to do it.) This particular key is one that restricts usage to pages on a limited range of websites, of which this is one. (The ~code:reverse~ part is to prevent GitHub detecting that an API key has been given, causing it to issue security warnings.)
12+
The map itself requires a div to place it in, then you can create the map using a very small set of commands. The first thing to add to the map is an 'API key' provided by Google to authorize the use of a map on this website. You can get your own API key by registering as a Google developer and requesting your key on the appropriate page. (Unfortunately it's beyond the scope of these notes to describe how to do it.) This particular key is one that restricts usage to pages on a limited range of websites, of which this is one. (The ~code:reverse~ part is to prevent GitHub issung regular security warnings that an API key has been written to the public repository that serves this website.)
1413

1514
There are only 3 items of information needed to set up a map; ~code:latitude~, ~code:longitude~ and ~code:zoom~. Experiment with each of these to discover how they work; try to get a map displaying your own home.
1615

resources/codex/md/step8.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ The rectangle is set to occupy 9% of the container's width and to have a border
1111

1212
Don't be put off by the apparent complexity of CSS. It's well worth spending some time reading up on it, but in the end you just have to try things out. The great thing about using the ~ec~ editor is you can experiment until you succeed in making it work.
1313

14-
So far, we have a gray rectangle in a larger box. The next command is ~code:wait 2 seconds~, which does just that. You can use wait to pause a script for any number of millis (milliseconds), ticks (100ths of a second), seconds or minutes.
14+
So far, we have a gray rectangle in a larger box. The next command is ~code:wait 2 seconds~, which does just that. You can use ~code:wait~ to pause a script for any number of ~code:millis~ (milliseconds), ~code:ticks~ (100ths of a second), ~code:seconds~ or ~code:minutes~. In all cases the final ~code:s~ is optional.
1515

1616
Now for the animation itself. We use a variable ~code:Angle~ to count from 0 to 360. This is the number of degrees in a circle. If you're not mathematically inclined, try to visualize a clock with a second hand going around it. It's a rather odd second hand that stretches right across the clock from one edge to the other. If you were to look at the clock edge-on you wouldn't see the rotary movement; the second hand would just appear to get longer and shorter as it journeys around the dial. The mathematical sine function tells us the apparent length of the second hand at any point in its progression around the dial. In our example the diameter of the clock is 200 pixels (so the radius is 100 pixels) and the apparent length, seen end-on, varies from 0 to 200 pixels. (Exactly the same principle applies to the length of the day as the seasons change. So you see, maths can be useful.)
1717

resources/codex/md/tools.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ The mechanism for requesting a plugin is very simple. Suppose you want to includ
88

99
~pre:load plugin `gmap`~
1010

11-
In this example the plugin is a standard ~ec~ one but you can also load third-party plugins from any URL (if you deal with CORS issues).
11+
In this example the plugin is a standard ~ec~ one but you can also load third-party plugins from any URL if you deal with CORS issues.
1212

1313
Once the plugin is loaded it is available to any script that needs it (but not the one that loaded it). Here, any script that includes map commands can be loaded and compiled, as in
1414

15-
~pre:rest get Script from `/resources/scripts/myscript`
15+
~pre:rest get Script from `/resources/ecs/myscript.ecs`
1616
run Script~
1717

1818
(This is the simplest form, that assumes you don't need to communicate with the script once it's running.)

0 commit comments

Comments
 (0)