Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Robot Arm Element - Adds robot arm to storyboard. #119

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

yepher
Copy link
Contributor

@yepher yepher commented Jan 14, 2022

Adds robot arm

@yepher
Copy link
Contributor Author

yepher commented Jan 14, 2022

I'm not exactly sure how to handle the frame since the robot arm has a fairly wide range of movement.

Is there a way to define the "marching ants" frame independent of the robot arm frame?

Copy link
Collaborator

@urish urish left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Amazing!

Added some comments / questions.

Also, what is the valid range of angles for each joint? Can we clamp the input angles to make sure we never draw an invalid configuration? (We already have utils/clamp.ts with a simple clamp() function)

Regarding the bounding box - is it currently bit enough to contain the entire valid range of movement?

];

render() {
/* eslint-disable prettier/prettier */
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When I let VS code format the SVG it becomes un-readable and I hate the warnings. But if you really want it to wrap all those lines I can remove it.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, prettier SVG formatting isn't that great.

But when the choice is between not-so-pleasing but consistent SVG formatting or getting the indentation wrong by the next developer who works on this code, I prefer the former.

Also, prettier should automatically format the code whenever you commit anyway. Didn't it?

*/
@property() jointColor = '#111111';

readonly pinInfo: ElementPin[] = [
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We also need GND/VCC pins (they are not currently used in the simulation, but we do want the schematic to look as close as possible to reality)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok, will add the two pins. I was cheating since I knew they had no function.

<path transform="translate(-1.27)" d="m1-36c-19.63 0-36.04 16.39-36.04 36s16.41 36 36.04 36 98.75-9 113.12-10c14.38-1 26.03-11 26.03-26s-11.65-24-26.03-26c-14.37-2-93.49-10-113.12-10z" fill="${this.armColor}" stroke="${this.jointColor}" stroke-miterlimit="10" stroke-width="2"/>

<!-- Elbow -->
<g transform="translate(113) rotate(${this.elbowAngle})">
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

extracting the different values from this will probably make the code a bit tidies. i.e. at the start of the function:

const {elbowAngle, wristAngle, ...} = this;

Then you can use the variables directly, without repeating this. every time

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The more I modify SVG the harder it is to update the SVG if I want to add/remove stuff from it. When it become invalid SVG it is a lot harder to update


export default {
title: 'Robot Arm',
component: 'wokwi-robot-arm',
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about wokwi-robotic-arm? Not being a native English speaker, I'm not sure if there's an actual difference, so I'd love to hear the thoughts of someone whose a native English speaker.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Works for me

@urish
Copy link
Collaborator

urish commented Jan 14, 2022

Also:

  1. Let's use a slider for the angle controls and a color picker for the colors in storybook?
    See the wokwi-rgb-led story for an example for both

  2. Is there a reason you went with yellow as the default color for the robotic arm?

@yepher
Copy link
Contributor Author

yepher commented Jan 14, 2022

I guess I accidently delete this somewhere along the way. I will add it back in:


argTypes: {
    sholderAngle: { control: { type: 'number', min: 260, max: 360, step: 1 } },
    elbowAngle: { control: { type: 'number', min: 0, max: 135, step: 1 } },
    wristAngle: { control: { type: 'number', min: 0, max: 120, step: 1 } },
    gripperAngle: { control: { type: 'number', min: 270, max: 360, step: 1 } },
    gripperColor: { control: { type: 'color' } },
    armColor: { control: { type: 'color' } },
    jointColor: { control: { type: 'color' } },
  },
  args: {
    sholderAngle: 270,
    elbowAngle: 82,
    wristAngle: 80,
    gripperAngle: 270,
  },

As for yellow, I figured a big heavy dangerous piece of equipment like this robotic arm should be yellow :) Actually I just randomly picked yellow.

@urish
Copy link
Collaborator

urish commented Jan 14, 2022

I guess I accidently delete this somewhere along the way. I will add it back in:

"range" type seems more convenient than "number" for the angles (at least for me)

As for yellow, I figured a big heavy dangerous piece of equipment like this robotic arm should be yellow :)

haha :) google images show that it's either metallic or black combined with either blue, yellow, light gray, or orange (or sometimes just plain black).

So I guess yellow isn't a bad choice. I thought either metallic or purple could be fun (it's the dominant color in Wokwi), though I've no strong opinion here. Yellow is good too.

@yepher
Copy link
Contributor Author

yepher commented Feb 6, 2022

I was not quite sure how to apply the clamp function since this is an output device.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants