• Home
  • Blog
  • C# / Unity
  • C++ / Unreal Engine
  • Python strategy games
  • Python arcade games
  • Python other
  • Machine Learning
  • C
  • Scratch
  • Coding and electronics
  • How I learnt to code
  • Project Euler
  • Feedback
  James L.'s coding

James's blog

what I've been doing.

Some more contributions to Graphite

6/8/2022

0 Comments

 
I have recently made several improvements to Graphite, a vector (drawing with shapes instead of pixels) editor written in rust and available at editor.graphite.design/
​

Features
  • Add font menu previews and virtual scrolling #650 - Expanding on some previous work to add a font dropdown, this allows users to see the name of the font in the font so they can see what the font looks like without clicking to select it
  • Add the File > Export dialog and PNG/JPG downloading #629 - Allows the svg to be exported to a bitmap file by displaying it onto a canvas.
  • https://github.com/GraphiteEditor/Graphite/pull/720 - JPEG exports have a white background and embedded bitmap images no longer use deprecated xlink:href attribute.
  • Snapping system improvements and refactor #621 -  Add snapping to points of a shape as well as the existing snapping to bounding boxes
  • Improvements to the layer transform cage UX #589 -  Right click to abort whilst still dragging - required changes to the input system. Also aspect ratio is preserved at the start of a drag.
  • Migrate dialogs to Rust and add a New File dialog #623 - Generating the dialogs in rust code reduces the number different places needed to add a new dialog. The new file dialog allows users to choose a document size and a file name using this new system.
  • Draw the outlines of shapes on hover and selection #609 - This allows users to more easily see which layer they are about to select based on user feedback
Debugging tools
  • Improve message ordering to use a stack #707  -  The message ordering now uses a tree like structure
  • Log message tree #728 - use ASCII art to improve debuggability of previous code change (as shown below)
  • Prevent subsequent panics for already borrowed editor #689 - When part of the editor panicked (crashed) it would then cause other panics leading to people becoming confused over the source of the crash.
Picture
Bug fixes
  • Fix desynced UI #727 - The radiobuttons where not being triggered properly thanks to the new message sequencing
  • Fix IndexedDb in Firefox private browsing mode #721 - IndexDb which mfish is using for autosaving documents is not available in firefox private browsing mode and so was causing the editor to crash. This stops the crash and adds a dialog box warning users that their work will not be autosaved
  • Fix path overlays and pen tool click #720 - The path overlays were not being updated on selection change
  • Fix ctrl enter to commit text #675 - The ctrl enter shortcut was being sent to the textbox instead of to the text tool meaning that the shortcut no longer worked (thanks to Keavon for spotting this)
  • Fix hover outline #673 - The outline when hovering over a shape did not update when the document was moved and only when the mouse was moved
  • Restore the zoom to fit behaviour #641 - When zooming on an empty document a division by zero occurred
  • Keyboard menu/widget navigation #628 - Users can more easily tab through different menus as well as using the up and down arrows to use dropdown menus.




















0 Comments

Graphite - Font selection

21/4/2022

0 Comments

 
Picture
I have implemented font loading for Graphite, a work in progress vector editor written in the Rust programming language with Web Assembly. The system allows you to to choose any font or font variant (font style) from the large google fonts collection. View the code on GitHub.


Challenges with this MR included loading the list of fonts and variants from the google developer api, and parsing the json into typescript, having a shared font list for all of the font picking widgets and loading the loaded font file only once in Rust when there are multiple text layers with the same font.
0 Comments

Graphite - Embedded Bitmap Images

28/3/2022

0 Comments

 
Picture
I have implemented embedding bitmap images into the svg for Graphite, a work in progress vector editor written in the Rust programming language with Web Assembly. The system allows you to drag and drop a PNG or JPEG file from your file manager and then load it into the editor for use as a reference. View the code on GitHub.


Challenges with this MR included handling the file dropping, as well as making the svg performant when a large (several megabytes) image is being transformed around. This was achieved through blob urls so the image data is not stored in the svg node but seperatly in the browser, greatly increasing performance. However this meant I had to load all the blob urls for the images when loading a graphite document.
0 Comments

Oxford University Computing Challenge - Final

22/3/2022

1 Comment

 
Picture
I came second in the final round of the OUCC in my age category.  I would like to thank Mr Cronk for his support in organising this.
1 Comment

Oxford University Computing Challenge - First round

21/2/2022

0 Comments

 
Picture
​I scored 66 out of 66 on the first round of the Oxford Computing Challenge and have qualified for the final round.  Thank you to Mr Cronk for organising this.
0 Comments

Graphite - Colour Gradients

14/2/2022

0 Comments

 
Picture
I have implemented colour gradients for Graphite, a work in progress vector editor written in the Rust programming language with Web Assembly.  The colour gradient tool is a new tool based on the new overlays system by @Truedoctor that allow users to draw in gradients, edit the start and and points by dragging the handles and edit the colours by using the new properties panel on the right hand side which has been added by @mfish33. View the code on GitHub.


Challenges for this MR included mapping the graident start and end points correctly into gradient units as well as making it so all of the gradients went into one `<defs>` tag at the top of the svg.
0 Comments

Graphite - Transform Cage

10/2/2022

0 Comments

 
Picture
I have implemented the transformation cage for Graphite, a work in progress vector editor written in the Rust programming language with Web Assembly. The transformation cage expanded on TrueDoctor's work adding a bounding box for selected layers whilst in select mode to allow the edges of the box to be draggable to scale the selection; and to add some blue squares on the corners and the edges to provide visual hints.  I also added the ability to rotate the selection by dragging 40px from the edges, as requested by Keavon.
0 Comments

Graphite - Text Tool

1/2/2022

0 Comments

 
Picture
I have implemented the text tool for Graphite, a work in progress vector editor written in the Rust programming language with Web Assembly. Text is stored as a new type of layer that contains a string. When the user is editing the text, the string is rendered as an editable HTML div element for proper OS input handling. This was challenging as the behaviour for these editable DIVs changes in different browsers, with Chromium based browsers inserting extra new lines and not showing an insertion mark when the text input was empty, however Keavon helped me to debug these issues.

​When the text is not editable, it is rendered as a spline so that it can be edited. In order to do this, I used ttf-parser, the standard in Rust for parsing font files, which provides a query for glyphs as well as enabling you to get at their raw curve data,  as bezier curves so no work was needed to convert them to Graphite's svg based paths. I also used used RustyBuzz, a Rust port of HarfBuzz, in order to shape the text. Shaping involves finding the correct glyphs, including any ligatures specified by the font, common examples including 'ff' and 'fi', as well as computing the positions and advances of each glyph, taking into account kerning, which subtly moves glyphs, for example putting a V and A closer together - 'VA'. 
0 Comments

Graphite - Minor bug fixes

17/1/2022

0 Comments

 
I have recently made several improvements to Graphite, a vector (drawing with shapes instead of pixels) editor written in rust and available at editor.graphite.design/
  • Reverse layer panel entries #489 - Keavon requested that the layer panel show the layer on top (rendered last) at the top of the layer panel. This required reversing the order of the layers when submitting them to the layer panel and resolving the issues with the moving of layers due to the indexes being reversed
  • Add cursors and hints to global viewport navigation #487 - extends on the work by Asyncth to add the custom cursors to the global navigation (using Ctrl + MMb for rotate / shift + MMB for zoom and MMB for pan in any tool other than navigate). This also cleared the hints list (at the bottom showing possible inputs for the tool) when using the global navigation as the tool cannot be interacted with whilst navigating. Required refactoring to correctly restore the tool cursor and hints after navigation ended.
  • Do not transform layers when transforming a parent folder #481 - Fixes a bug where transformations where not applied when the parent folder and the layer were selected at the same time (gif in MR)
  • Fix rotation input #472 - mfish had accidentally caused the display for the document rotation to be clamped between 0 and 1 due to TypeScript silently using default values when undefined is passed to a function.
  • Migrate to using MoveSelectedLayersTo #469 - Large refactor to change the way layer movements where specified (previously by giving a new neighbour to the place to insert the layers) to allow inserting layers into empty folders via dragging in the layer tree. I also had to fix the insert index code as the old method was corrupted when moving layers down the tree. I also fixed a bug with some of the layers being moved being deselected as well as the dragging in the tree only applying to one layer.
  • Refine navigate tool zoom #461 - As requested by Keavon, zoom with navigate tool is relative to the mouse position and snaps to increments whilst holding ctrl.
  • Resize panels #443 - allows the boundaries between panels to be dragged. This taught me a lot about flex boxes and event bubbling (the resize event was not triggered causing black areas and a corrupted ruler).
  • Fix one item folders #442 - Fix a typo that caused the layer inside folders with one child not to be displayed.
  • Add navigate tool #441 - Expand on my previous work adding global navigation to add a specific navigate tool with similar functionality but more accessable key binds
  • Add cut, copy, and paste to the Edit menu #440 - bind the buttons in the dropdown to the relevant messages.
  • Remove transformations from LayerData #439 - Move the position, rotation and scale attributes from the layerdata and to the movement handler.
  • Populate layer entry cache #437 - Fix a bug where the layer tree would not be loaded when loading a previously saved document.
  • Update intoiter syntax #436 - Rust 2021 is stable!
  • Remove snap rotate from layerdata #435 - Move the snap rotate for the document navigation away from the layerdata.
  • Drag to rearrange layers in the layer panel #434 - Major MR allowing the layers to be dragged in the tree
  • Snap while dragging with select tool #433 - Builds on previous work on snapping to snap whilst dragging with the select tool
  • Fix console error caused by the Pen Tool #432 - Fix error with overlays when switching documents
  • Fix line centering #431 - Centring with alt whilst using the line tool caused incorrect behaviour that required careful planning to resolve to make it also work with snapping.
  • Fix Ctrl+scroll wheel zoom point relative to the mouse position #429 - I had accidentally multiplied by 2 when adjusting the translation so that the cursor remained over the same document position when zooming.
  • Fix new document position #421
0 Comments

Graphite - Snapping

26/11/2021

0 Comments

 
Picture
I have implemented snapping for graphite, a work in progress vector editor written in the Rust programming language with Web Assembly. Snapping is quite an important feature of a vector editor as it allows users much more precision when drawing shapes and moving shapes around. One of the main challenges I had was caching the snap targets in a sensible place as TrueDoctor requested the tools did not have mutable access to the document so that they could be multi-threaded later.  I also implemented the toggle functionality with the magnet option in the toolbar at the top. The functionality is available on the master branch build of graphite at editor.graphite.design/ The code changes are available at ​github.com/GraphiteEditor/Graphite/pull/386/files
0 Comments

Graphite - Rulers

28/10/2021

0 Comments

 
Picture
I have made the rulers functional for graphite, a work in progress vector editor written in the Rust programming language with Web Assembly. This was a smaller MR (merge request) with the main challenge being to dynamically adjust the distance between the major numbered lines so that the increments where round numbers. I achieved this through base 2 logarithms, a function which I had not previously come across. This allows the interval to double or half as many times as necessary for the current zoom, whilst maintaining a sensible gap of 51-100px between each number. I also had some issues with the modulus function not working correctly on negative numbers in javascript which took quite a bit of debugging to track down. This emphasized for me the value of planning things out on paper. The functionality is avaliable on the master branch build of graphite at editor.graphite.design/ The canvas can be moved with the middle mouse button, space plus left mouse button drag or with the scrollbars after drawing a shape.
0 Comments

Graphite - Transforming layers with shortcuts

30/8/2021

0 Comments

 
Picture
I added a way to transform layers with the mouse by pressing the 'G', 'R' or 'S' keys to grab, rotate and scale the selected layers in a similar fashion to blender. I made shift slow the transformation speed by a tenth and ctrl to snap the transformation to intervals. I also allowed users to type in the value for the transformation with the number keys if they wanted a specific value and constrain their transformation to one axis with the 'x' and 'y' keys. You can try the build at https://714e13e8.graphite-master.pages.dev. This was one of my bigger PRs (Collaborating with pull requests - GitHub) at about 550 lines of code available at github.com/GraphiteEditor/Graphite/pull/356/files.
​
I worked closely with @Keavon to refine the UX with things like reversing an operation if you switch directly to a new transform operation, removing the negative when all numbers are deleted and ignoring presses to decimal point when there is already a decimal point.
0 Comments

Graphite - Scroll bars

17/8/2021

0 Comments

 
Picture
I recently made the scrollbar functional in graphite - an open source drawing program for the web. This built on TrueDoctor's work of finding the bounding box of artwork.

The scrollbars where difficult to implement because they needed to allow users to scroll infinitly far by reserving a space at the end of the scrollbar whilst also not just sharply stopping as they reached a certain point but slowing down the position change as it got further up the track (as specified by Keavon).

My initial approach with this caused some strange issues like the going back over the artwork when the scrollbar was dragged very far or when zoomed out very far (thanks to Keavon and TrueDoctor for finding these problems).  My initial implementation also caused the scrollbar to stop when the artwork was inside the viewport which combined poorly with the dragging mechanism.

This taught me about planning things out on paper as well as responding to feedback.
0 Comments

Open source contributions - Graphite

13/7/2021

0 Comments

 
I have recently been learning Rust, a programming language similar to C and C++ in speed and syntax but with an emphasis on memory safety; for example handling if a variable is None. I found Graphite whilst looking on a Rust newsletter (gamedev.rs/news/020/#graphite). Graphite is a new vector editor built using Rust. The master branch can be found on the web thanks to WASM, which is a portable binary-code format for executable programs similar to assembly except it can be run on all architectures.
Picture
Above is a screenshot of the current master of graphite (editor.graphite.design/). The source code is available at their GitHub repository github.com/GraphiteEditor/Graphite. I have made several contributions available github.com/GraphiteEditor/Graphite/pulls?q=author%3A0hypercube+is%3Amerged including
  • ⬠ Add polygon drawing tool - this allows the user to draw hexagons and other shapes (once the UI is implemented)
  • 🎨 Add colours in Rust - This allowed the frontend to specify the current colour which was then stored with any new shapes that where drawn and added into the svg that is displayed for the user.
  • Add preview for rectangles / shapes / lines - This build upon TrueDoctor's work on adding a preview when dragging a rectangle and applied it to the other tools
  • Add a movable canvas with matrices - This gives all layers a matrix transform and adds the TransformLayer operation. This also allows the user to move the document around with Middle mouse button drag. I found the following guide useful when learning about matrices https://docs.rainmeter.net/tips/transformation-matrix-guide/
  • Navigation - This built upon my previous PR in adding the ability to zoom and rotate the viewport with a series of shortcuts as well as the widgets at the top.  This was the first time I'd used the vue framework so I'd like to thank Keavon for the support.
  • Allow transforming layers - A bugfix adding the ability to transform layers as well as just folders as I'd used the wrong function in the matrices PR.
  • Unmount working on select - Another small bugfix that fixed a problem where when selecting layers with the select tool then layers could not be nudged around or changed visibility until a new shape was drawn
I'm finding that working on a large codebase with other more experienced programmers is helping me mature as a programmer and I'd like to thank TrueDoctor and Keavon for being so supportive.
I was really pleased to receive the following feedback from one of my code reviewers who congratulated me on 'the awesome work you did on this, it's so nicely polished and I hope you're proud of your work on this feature.'
0 Comments

BAFTA YGD 2021 finalist

15/6/2021

0 Comments

 
I'm delighted to announce that my game, Runaway Trains, has made it through to the finals of the BAFTA Young Game Designer - Game Making competition.  

The list of finalists is available at: 

lINK TO LIST OF FINALISTS
And the BAFTA page for Runaway Trains is here:
LINK TO BAFTA'S PAGE FOR RUNAWAY TRAINS
0 Comments

Haskell & Rust

15/4/2021

0 Comments

 
Picture
I have been learning Haskell with the Programming in Haskell book along with an online video course. I chose to learn a functional language because it gives me a different approach to programming which is very valuable. Whilst programs in Haskell can be beautiful and concise, it is very hard to get your head around writing it as it uses some completely different programming paradigms to something like C++.
Picture
I have also been learning Rust, a relatively new programming language with a focus on safety and speed. It has no runtime and it can reach speeds of C whilst maintaining type safety. To achieve this safety, it has no Null, it also has variables as non mutable and it only allows one mutable pointer to a data structure. This means it can catch the most common crashes at compile time.
Although to begin with it felt like I was battling the compiler, I now recognise how useful it is. To learn rust I have been using The Book - doc.rust-lang.org/book/
0 Comments

OUCC - First Place

23/3/2021

0 Comments

 
Picture
I am very excited to have won the Oxford Computing challenge 2021 (Intermediate). I would like to thank Mr Cronk and the OUCC for continuing to run this competition in these difficult times.
0 Comments

Runaway Trains

22/3/2021

0 Comments

 
Picture
I have now completed runaway trains, a game made in UE4 for the YGD competition. In the game, you control the points to a model railway and have to stop the trains from crashing.
0 Comments

Oxford University Computing Challenge

11/3/2021

0 Comments

 
I am really pleased to say that I have qualified for the finals of the OUCC.  I would like to thank my teachers for organising this.

​
Picture
0 Comments

TensorFlow in Practice

26/6/2020

0 Comments

 
I've passed the TensorFlow in Practice course at Coursera that is taught by Andrew Ng and Laurence Moroney.  There were four courses, each of which lasted four weeks, and each week had a coding challenge that I had to pass to progress.  I really enjoyed the course and thought the teaching was excellent.
Picture
0 Comments

Water the Crops - artwork

18/5/2020

0 Comments

 
My artwork for Water the Crops was featured in section 3 of "BAFTA Young Game Designers Initiative Impact Report": https://www.bafta.org/sites/default/files/uploads/ygd19impactreport.pdf.
0 Comments

Machine Learning

12/4/2020

0 Comments

 
I've joined the Coursera course "Introduction to TensorFlow for Artificial Intelligence, Machine Learning, and Deep Learning".   I enjoyed the Udemy course on Unreal Engine/C++ and found it a good way to learn.
0 Comments

Unreal Engine C++ Developer course

11/4/2020

0 Comments

 
I've finished the Udemy course "Unreal Engine C++ Developer". 

It took me about a year because I did two big side projects  whilst I was doing the course, VR 10 pin bowling and another VR game, Glass Goes in Green. 

I thought the course was excellent.  Udemy have kept it up to date.  The lectures (about 50 hours) are good: they teach, but they also make you do plenty of the work yourself. 

Here is a screenshot of the final project in the coarse, Testing Grounds:
Picture
And here is the certificate:
Picture

0 Comments

Oxford Computing Challenge - Finals

2/4/2020

0 Comments

 
Picture
I am very excited to say that I won the final of the Oxford Computing Challenge 2020 (Junior) with a score of 70 out of 78.  I would like to thank Mr C. for organising this and OCC for running the final in very difficult times.  
0 Comments

Oxford Computing Challenge

21/3/2020

0 Comments

 
Picture

​I scored 66 out of 66 on the first round of the Oxford Computing Challenge and have qualified for the final 20.  Thank you to Mr C. for organising this.
0 Comments
<<Previous
    Advert:

    Author

    I am doing lots of projects every projects all the time and I can't put them all on the website so I've made a blog.

    Archives

    August 2022
    April 2022
    March 2022
    February 2022
    January 2022
    November 2021
    October 2021
    August 2021
    July 2021
    June 2021
    April 2021
    March 2021
    June 2020
    May 2020
    April 2020
    March 2020
    September 2019
    June 2019
    May 2019
    April 2019
    March 2019
    February 2019
    January 2019
    November 2018
    August 2018
    July 2018
    June 2018
    May 2018
    April 2018
    March 2018
    February 2018
    January 2018
    December 2017
    November 2017
    October 2017

    Categories

    All

Proudly powered by Weebly
  • Home
  • Blog
  • C# / Unity
  • C++ / Unreal Engine
  • Python strategy games
  • Python arcade games
  • Python other
  • Machine Learning
  • C
  • Scratch
  • Coding and electronics
  • How I learnt to code
  • Project Euler
  • Feedback