Skip to content

Commit 3219f80

Browse files
Cleanup for JavaScript major
* remove comments * fix broken doc link
1 parent 5b1edb3 commit 3219f80

File tree

4 files changed

+86
-71
lines changed

4 files changed

+86
-71
lines changed

README.md

Lines changed: 81 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,82 @@
1-
# Simple Web Serial
2-
_Work in progress!_
31

4-
Check out https://fmgrafikdesign.gitbook.io/simplewebserial/ for a project overview and installation guide.
2+
3+
# SimpleWebSerial
4+
5+
SimpleWebSerial helps you to connect a web application with your Arduino, in
6+
seconds. Get started now by taking a look at the [documentation](https://fmgrafikdesign.gitbook.io/simplewebserial/)! This is the Arduino library of the project. You can find the JavaScript part [here](https://github.com/fmgrafikdesign/SimpleWebSerialJS).
7+
8+
## What is this library?
9+
10+
This library allows you to connect your website in the browser with an Arduino microcontroller. This effectively means the real world can influence your web application, and vice versa. The library consists of two parts, the [JavaScript part](https://github.com/fmgrafikdesign/SimpleWebSerialJS) which runs in the browser, and the [Arduino part](https://github.com/fmgrafikdesign/simplewebserial-arduino-library) which is installed on your Arduino device. Together, they allow you to write simple, event-driven code both in JavaScript and on the Arduino, enabling two-way communication.
11+
12+
Under the hood, it uses the [Web Serial API](https://wicg.github.io/serial/). It handles repetitive setup steps and offers an event-driven style of listening to and sending data. The goal is to allow as many people as possible to explore the possibilities of connecting physical devices to web applications.
13+
14+
## Code Style Summary
15+
16+
This library employs an event-driven code style. You can register event listeners with callback functions, and send events to the other device. Here's a brief idea how working with the library looks like in the browser and on the Arduino:
17+
18+
### JavaScript
19+
```javascript
20+
// Import
21+
import { setupSerialConnection } from 'simple-web-serial';
22+
23+
// Set up the serial connection
24+
const connection = setupSerialConnection({ requestAccessOnPageLoad: true });
25+
26+
// React to incoming events
27+
connection.on('event-from-arduino', function(data) {
28+
console.log('Received event "event-from-arduino" with parameter ' + data)
29+
});
30+
31+
// Send named events to the Arduino with a number, string, array or json object
32+
connection.send('event-to-arduino', "Hello there, Arduino");
33+
```
34+
35+
### Arduino
36+
```cpp
37+
// Include the library
38+
#include <SimpleWebSerial.h>
39+
40+
// Create an instance of the library
41+
SimpleWebSerial WebSerial;
42+
43+
void setup() {
44+
// Initialize serial communication
45+
Serial.begin(57600);
46+
47+
// Define events to listen to and their callback
48+
WebSerial.on("event-to-arduino", eventCallback);
49+
50+
// Send named events to browser with a number, string, array or json object
51+
WebSerial.send("event-from-arduino", 123);
52+
}
53+
54+
void eventCallback(JSONVar data) {
55+
// Do something, even sending events right back!
56+
WebSerial.send("event-from-arduino", data);
57+
});
58+
59+
void loop() {
60+
// Check for new serial data every loop
61+
WebSerial.check();
62+
delay(5);
63+
}
64+
```
65+
66+
## Why this library?
67+
68+
The new [Web Serial API](https://wicg.github.io/serial/) is a great way to connect serial devices like the Arduino directly to your web application. It lets your website communicate with the real world, and opens up a lot of possibilities for web developers! However, working with it is cumbersome and very technical. You're left to deal with things like byte-arrays and parsing data. This library makes connecting your web application with an Arduino a breeze, and lets you get up and running in minutes.
69+
70+
## Who is this for?
71+
72+
This library is for creative minds and developers who like to experiment and create prototypes, but do not necessarily care how something works on the technical level.
73+
74+
Do you know your way around web development? Basic concepts like HTML, JavaScript? Then you can use this without problems.
75+
76+
Do you like experimenting with new web technologies, maybe learn a new thing or two? This library will give you an idea what's possible when we integrate websites with the real world.
77+
78+
## Getting Started
79+
80+
Get started by installing the JavaScript library and the Arduino library. You can find a quick setup in the [documentation](https://fmgrafikdesign.gitbook.io/simplewebserial/).
81+
82+
Alternatively you can check out the JavaScript repository and have a look at the examples folder. Be aware, you will need an Arduino for all of them, and some parts (LEDs, potentiometer etc) for most of them.

library.properties

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
name=Simple Web Serial
2-
version=0.1.5
2+
version=1.0.0
33
author=Fabian Mohr
4-
maintainer=Fabian Mohr,amazon@fmgrafikdesign.de
4+
maintainer=Fabian Mohr,dev@fmgrafikdesign.de
55
sentence=A library to simplify connecting Arduino to your web applications, using the Web Serial API.
66
paragraph=This library is aimed at web developers interested in connecting their web applications to the physical world, with an Arduino. Listen to and send events in JavaScript fashion, without worrying about parsing incoming serial data.
77
category=Communication
8-
url=https://app.gitbook.com/@fmgrafikdesign/s/simplewebserial/
8+
url=https://fmgrafikdesign.gitbook.io/simplewebserial/
99
architectures=*
1010
depends=Arduino_JSON

src/SimpleWebSerial.cpp

Lines changed: 2 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,10 @@ void SimpleWebSerial::check() {
3030
bufferIndex = BufferSize - 1;
3131
}
3232
}
33-
// When we receive the endMarker, terminate the string and set parseData to true
33+
// When we receive the endMarker, terminate the string and set parseData to true
3434
else {
35-
receivedChars[bufferIndex] = '\0'; // terminate the string
35+
receivedChars[bufferIndex] = '\0';
3636
parseData = true;
37-
// Serial.println(bufferIndex);
3837
bufferIndex = 0;
3938
}
4039
}
@@ -44,18 +43,11 @@ void SimpleWebSerial::check() {
4443
// It is to be assumed that receivedChars will be stringified JSON once it's complete.
4544
JSONVar parsed = JSON.parse(receivedChars);
4645

47-
// If I comment this out, JSON.typeof(parsed) is never undefined. Why?
48-
// Serial.println(receivedChars);
49-
50-
// Why is this only undefined when I print the received Chars? Nobody knows!
5146
if (JSON.typeof(parsed) == "undefined") {
5247
this->warn("Parsing input failed! Malformed data sent or buffer overflow.");
5348
return;
5449
}
5550

56-
//Serial.println(JSON.stringify(parsed));
57-
//Serial.println(JSON.typeof(parsed));
58-
5951
// Find out if it's an named event
6052
bool namedEvent = false;
6153
int isPureData = strcmp("_d", (const char *) parsed[0]);
@@ -70,48 +62,11 @@ void SimpleWebSerial::check() {
7062
}
7163

7264
if (parsed.length() > 1 && JSON.typeof(parsed[0]) == "string") {
73-
// Serial.println("Received array has more than 1 element and its first element is string. Assuming named event!");
74-
75-
// Parse object 1 level deep
76-
/*
77-
if(JSON.typeof(parsed[1]) == "object") {
78-
parsed[1] = JSON.parse(parsed[1]);
79-
Serial.println("Parsed received data because it was an object.");
80-
}
81-
*/
82-
8365
for (int i = 0; i < ARRAYSIZE(eventNames); i++) {
8466
if (eventNames[i][0] == '\0') continue;
8567

86-
//Serial.print("Comparing ");
87-
//Serial.print((const char *) parsed[0]);
88-
//Serial.print(" to ");
89-
//Serial.println(eventNames[i]);
90-
9168
int compare_result = strcmp(eventNames[i], (const char *) parsed[0]);
92-
//Serial.println(compare_result);
93-
//Serial.print("first character in eventNames:");
94-
//Serial.println(eventNames[_index][0]);
95-
96-
//Serial.print("first character in received event:");
97-
//Serial.println(eventName[0]);
98-
99-
// Serial.println(compare_result);
10069
if (compare_result == 0) {
101-
/*
102-
Serial.print("Found event named ");
103-
Serial.print(parsed[0]);
104-
Serial.println(" in registered eventNames");
105-
Serial.print("Trying to call callback with index ");
106-
Serial.println(i);
107-
*/
108-
//Serial.println((*callbacks[i]));
109-
110-
// (*callbacks[i])((JSONVar) parsed[1]);
111-
// (*_callback)();
112-
113-
//Serial.print("Calling callback with parameters: ");
114-
//Serial.println(parsed[1]);
11570
(*callbacks[i])(parsed[1]);
11671

11772
namedEvent = true;
@@ -123,33 +78,23 @@ void SimpleWebSerial::check() {
12378
Serial.print(parsed[0]);
12479
Serial.println("' in the registered eventNames");
12580
}
126-
12781
} else if (parsed.length() > 1 && JSON.typeof(parsed[0]) != "string"){
128-
//Serial.println("Received array has more than 1 element but its first element is not a string. Malformed data?");
12982
this->warn("Received array has more than 1 element but its first element is not a string. Malformed data?");
13083
} else {
13184
Serial.println("Received array has only 1 element.");
13285
}
133-
134-
// If it's a named event, find out its name
135-
136-
// Loop through registered eventNames
137-
13886
}
13987

14088
}
14189

14290
void SimpleWebSerial::on(const char *name, void (*callback)(JSONVar data)) {
143-
// TODO show warning if you're using more events than allowed. Check if you can do that w/ Arduino compiler
144-
14591
strcpy(eventNames[_index], name);
14692
callbacks[_index] = callback;
14793

14894
Serial.print(eventNames[_index]);
14995
Serial.print(" has been defined as an event with index ");
15096
Serial.println(_index);
15197

152-
// callbacks[_index](data);
15398
_index++;
15499
}
155100

@@ -161,7 +106,6 @@ void SimpleWebSerial::listEvents() {
161106
Serial.print("- ");
162107
Serial.println(eventNames[i]);
163108
}
164-
// Serial.println(eventName);
165109
}
166110

167111
void SimpleWebSerial::sendData(JSONVar data) {
@@ -184,12 +128,6 @@ void SimpleWebSerial::setCallback(void (*callback)()) {
184128
_callback = callback;
185129
}
186130

187-
void SimpleWebSerial::onData() {
188-
// look for the next valid integer in the incoming serial stream:
189-
190-
//(*_callback)();
191-
}
192-
193131
void SimpleWebSerial::warn(const char *message) {
194132
this->send("_w", message);
195133
}

src/SimpleWebSerial.h

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,6 @@ class SimpleWebSerial {
3131
SimpleWebSerial();
3232
void check(); // Makes the library check for serial data
3333
void on(const char* name, void (*callback)(JSONVar data)); // Event name, callback
34-
void onData(); // callback
3534
void sendEvent(const char* name); // Only event name
3635
void sendData(JSONVar data); // Only data
3736
void send(const char* name, JSONVar data); // Event name + data or just data

0 commit comments

Comments
 (0)