srajan sohani's Blog
New file: World Editor

New file: World Editor

srajan sohani's photo
srajan sohani
·

3 min read

Overview

  • Added GitHub workflows for automatic blog generation and a job to say hello.
  • Created a new HTML page with a canvas, controls, and JavaScript code for drawing graphs.
  • Implemented a Graph class with methods for adding and removing points and segments, and for drawing the graph.
  • Created Point and Segment classes with methods for drawing and checking for equality.
  • Added CSS styles for the body, h1, and canvas elements.

File wise changes made

.github/workflows/commit-blog-generator.yml

  • Added a workflow that will automatically generate a blog post on push
  • Defined the workflow to use srajansohani/commit-blog-generator@v0.22 action
  • Provided the blog-domain and series-slug as parameters to the action
  • Set the HASHNODE_ACCESS_TOKEN and GITHUB_ACCESS_TOKEN as secrets

.github/workflows/hello.yml

  • Added a workflow that will greet the user on push or pull request.
  • Defined the workflow to use actions/hello-world-javascript-action@e76147da8e5c81eaf017dede5645551d4b94427b action
  • Provided who-to-greet as a parameter to the action

index.html

  • Added a basic HTML structure for the World Editor
  • Included necessary CSS and JavaScript files
  • Created a canvas element for drawing

js/math/graph.js

  • Created a Graph class to manage points and segments
  • Added methods to add, remove, and check for points and segments
  • Implemented drawing logic for the graph

js/primitives/point.js

  • Created a Point class to represent a point in 2D space
  • Added methods to check for equality and draw the point

js/primitives/segment.js

  • Created a Segment class to represent a line segment between two points
  • Added methods to check for equality, inclusion, and draw the segment

styles.css

  • Added a basic CSS stylesheet to style the page
  • Added a background color to the body and centered the text
  • Styled the h1 element with a white color and Arial font
  • Styled the canvas element with a specific background color

Summary

  • Added a new GitHub workflow .github/workflows/commit-blog-generator.yml that uses the srajansohani/commit-blog-generator action to automatically generate blog posts on push.
  • Added a new GitHub workflow .github/workflows/hello.yml that uses the actions/hello-world-javascript-action action to greet the user on push or pull request.
  • Created a new HTML file index.html that serves as a simple world editor with a canvas to draw points and segments.
  • Added a new JavaScript file js/math/graph.js that contains a class to represent a graph of points and segments.
  • Added a new JavaScript file js/primitives/point.js that contains a class to represent a point with methods for drawing and checking equality.
  • Added a new JavaScript file js/primitives/segment.js that contains a class to represent a segment between two points with methods for drawing and checking equality.
  • Added a new CSS file styles.css that contains styles for the world editor.
JavaScript