feat: helper functions for spi/i2c/usart signals

Author: urish

src/arduino-uno-element.ts

@@ -1,6 +1,6 @@
 import { customElement, html, LitElement, property, svg } from 'lit-element';
 import { pinsFemalePattern } from './patterns/pins-female';
-import { analog, ElementPin } from './pin';
+import { analog, ElementPin, i2c, spi, usart } from './pin';
 
 @customElement('wokwi-arduino-uno')
 export class ArduinoUnoElement extends LitElement {
@@ -10,14 +10,14 @@ export class ArduinoUnoElement extends LitElement {
   @property() ledPower = false;
 
   readonly pinInfo: ElementPin[] = [
-    { name: 'A5.2', x: 87, y: 9, signals: [analog(5), { type: 'i2c', signal: 'SCL' }] },
-    { name: 'A4.2', x: 97, y: 9, signals: [analog(4), { type: 'i2c', signal: 'SDA' }] },
+    { name: 'A5.2', x: 87, y: 9, signals: [analog(5), i2c('SCL')] },
+    { name: 'A4.2', x: 97, y: 9, signals: [analog(4), i2c('SDA')] },
     { name: 'AREF', x: 106, y: 9, signals: [] },
     { name: 'GND.1', x: 115.5, y: 9, signals: [{ type: 'power', signal: 'GND' }] },
-    { name: '13', x: 125, y: 9, signals: [{ type: 'spi', signal: 'SCK' }] },
-    { name: '12', x: 134.5, y: 9, signals: [{ type: 'spi', signal: 'MISO' }] },
-    { name: '11', x: 144, y: 9, signals: [{ type: 'spi', signal: 'MOSI' }, { type: 'pwm' }] },
-    { name: '10', x: 153.5, y: 9, signals: [{ type: 'spi', signal: 'SS' }, { type: 'pwm' }] },
+    { name: '13', x: 125, y: 9, signals: [spi('SCK')] },
+    { name: '12', x: 134.5, y: 9, signals: [spi('MISO')] },
+    { name: '11', x: 144, y: 9, signals: [spi('MOSI'), { type: 'pwm' }] },
+    { name: '10', x: 153.5, y: 9, signals: [spi('SS'), { type: 'pwm' }] },
     { name: '9', x: 163, y: 9, signals: [{ type: 'pwm' }] },
     { name: '8', x: 173, y: 9, signals: [] },
     { name: '7', x: 189, y: 9, signals: [] },
@@ -26,8 +26,8 @@ export class ArduinoUnoElement extends LitElement {
     { name: '4', x: 217.5, y: 9, signals: [] },
     { name: '3', x: 227, y: 9, signals: [{ type: 'pwm' }] },
     { name: '2', x: 236.5, y: 9, signals: [] },
-    { name: '1', x: 246, y: 9, signals: [{ type: 'usart', signal: 'TX' }] },
-    { name: '0', x: 255.5, y: 9, signals: [{ type: 'usart', signal: 'RX' }] },
+    { name: '1', x: 246, y: 9, signals: [usart('TX')] },
+    { name: '0', x: 255.5, y: 9, signals: [usart('RX')] },
     { name: 'IOREF', x: 131, y: 191.5, signals: [] },
     { name: 'RESET', x: 140.5, y: 191.5, signals: [] },
     { name: '3.3V', x: 150, y: 191.5, signals: [{ type: 'power', signal: 'VCC', voltage: 3.3 }] },
@@ -39,8 +39,8 @@ export class ArduinoUnoElement extends LitElement {
     { name: 'A1', x: 217.5, y: 191.5, signals: [analog(1)] },
     { name: 'A2', x: 227, y: 191.5, signals: [analog(2)] },
     { name: 'A3', x: 236.5, y: 191.5, signals: [analog(3)] },
-    { name: 'A4', x: 246, y: 191.5, signals: [analog(4), { type: 'i2c', signal: 'SCL' }] },
-    { name: 'A5', x: 255.5, y: 191.5, signals: [analog(5), { type: 'i2c', signal: 'SDA' }] },
+    { name: 'A4', x: 246, y: 191.5, signals: [analog(4), i2c('SCL')] },
+    { name: 'A5', x: 255.5, y: 191.5, signals: [analog(5), i2c('SDA')] },
   ];
 
   render() {

src/pin.ts

@@ -2,17 +2,17 @@ export type PinSignalInfo =
   | {
       type: 'i2c';
       signal: 'SDA' | 'SCL';
-      bus?: number;
+      bus: number;
     }
   | {
       type: 'spi';
       signal: 'SCK' | 'MOSI' | 'MISO' | 'SS';
-      bus?: number;
+      bus: number;
     }
   | {
       type: 'usart';
       signal: 'RX' | 'TX';
-      bus?: number;
+      bus: number;
     }
   | {
       type: 'power';
@@ -50,5 +50,23 @@ export interface ElementPin {
   description?: string;
 }
 
-/** Helper function for creating analog PinSignalInfo objects */
-export const analog = (channel: number) => ({ type: 'analog', channel } as PinSignalInfo);
+/** Helper function for creating PinSignalInfo objects */
+export const analog = (channel: number): PinSignalInfo => ({ type: 'analog', channel });
+
+export const i2c = (signal: 'SCL' | 'SDA', bus = 0): PinSignalInfo => ({
+  type: 'i2c',
+  signal,
+  bus,
+});
+
+export const spi = (signal: 'SCK' | 'MOSI' | 'MISO' | 'SS', bus = 0): PinSignalInfo => ({
+  type: 'spi',
+  signal,
+  bus,
+});
+
+export const usart = (signal: 'RX' | 'TX', bus = 0): PinSignalInfo => ({
+  type: 'usart',
+  signal,
+  bus,
+});

src/pushbutton-element.ts

@@ -1,4 +1,5 @@
 import { css, customElement, html, LitElement, property } from 'lit-element';
+import { ElementPin } from './pin';
 
 const SPACE_KEY = 32;
 
@@ -7,6 +8,13 @@ export class PushbuttonElement extends LitElement {
   @property() color = 'red';
   @property() pressed = false;
 
+  readonly pinInfo: ElementPin[] = [
+    { name: '1.l', x: 2, y: 9, signals: [] },
+    { name: '2.l', x: 2, y: 36, signals: [] },
+    { name: '1.r', x: 65, y: 36, signals: [] },
+    { name: '2.r', x: 65, y: 9, signals: [] },
+  ];
+
   static get styles() {
     return css`
       button {

src/ssd1306-element.ts

@@ -1,5 +1,6 @@
 // Reference: https://cdn-learn.adafruit.com/assets/assets/000/036/494/original/lcds___displays_fabprint.png?1476374574
 import { customElement, html, LitElement, property, SVGTemplateResult } from 'lit-element';
+import { ElementPin, i2c } from './pin';
 
 type CanvasContext = CanvasRenderingContext2D | null | undefined;
 @customElement('wokwi-ssd1306')
@@ -19,6 +20,17 @@ export class SSD1306Element extends LitElement {
   private canvas: HTMLCanvasElement | null | undefined = void 0;
   private ctx: CanvasContext = null;
 
+  readonly pinInfo: ElementPin[] = [
+    { name: 'DATA', x: 36.5, y: 12.5, signals: [i2c('SDA')] },
+    { name: 'CLK', x: 45.5, y: 12.5, signals: [i2c('SCL')] },
+    { name: 'DC', x: 54.5, y: 12.5, signals: [] },
+    { name: 'RST', x: 64.5, y: 12.5, signals: [] },
+    { name: 'CS', x: 74.5, y: 12.5, signals: [] },
+    { name: '3V3', x: 83.5, y: 12.5, signals: [{ type: 'power', signal: 'VCC', voltage: 3.3 }] },
+    { name: 'VIN', x: 93.5, y: 12.5, signals: [{ type: 'power', signal: 'VCC' }] },
+    { name: 'GND', x: 103.5, y: 12, signals: [{ type: 'power', signal: 'GND' }] },
+  ];
+
   constructor() {
     super();
     this.imageData = new ImageData(this.screenWidth, this.screenHeight);