Git Product home page Git Product logo

bloodaxe980 / rackdesigner Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 294 KB

An app for designing a modular synthesizer rack. Use it to visualize the angles for your case and gauge the volume of space the case will consume.

Home Page: https://www.buymeacoffee.com/RackDesigner

License: MIT License

CSS 11.31% HTML 20.10% JavaScript 68.59%
2d buchla bx case design eurorack modular moog rack serge synthesizer tool

rackdesigner's People

Contributors

bloodaxe980 avatar

Stargazers

 avatar

Watchers

 avatar

rackdesigner's Issues

Update angles

Presently, when a user updates the angle of a row the angle is not correctly updating automatically. The angle can be forced to update if a user adds another row to the drawing. The user would then have to remove the extra row from the drawing to have the correct display.

Scale drawing

Fix function to scale the drawing to fit the window. The "Fit Window" option should be able to scale the drawing up if it is too small to fill the canvas and, more importantly, scale the drawing down to fit inside the canvas. The function should check the size of the drawing against the size of the canvas. If the drawing is either too wide or too tall for the canvas, the scale function should reduce it to fit in both the horizontal and vertical. If the drawing is too small to fill the canvas the function should scale the drawing up until the drawing is within the canvas size -20 on the height or the width.

Negative Angle and rail interference

If a user inputs a negative angle for a panel, there is a high probability that the rails will interfere with one another. I would like to calculate the amount of padding needed to alleviate any rail interference and add the necessary length to the panel with negative angle. It would be nice to differentiate this extra space with a bold line for that segment before the actual panel is drawn.

Front panel vertical or prow

fix function for the angle of the front panel. function should calculate a new starting position for the first X of the drawing. In the original program the origin of the drawing x,y was set to 0, 0. When calculating the start of a Prow front the starting x location needs to move.

Themes

Themes, colors for page text and background, cookies:

Function to fill 3D view HP with random gen modules

Function should utilize the rack format i.e. Buchla, Eurorack etc. for the minimum horizontal module width. The function should fill the total hp of the rack with modules of varied width up to the full hp of the case. Heights for the modules depends upon the row height. Modules should contain properly sized jacks dependent upon the format. Knobs should not be larger than the hp of the module being drawn. knobs, sliders and jacks should not overlap. Module color can be randomized and can include pictures for variety. This function may contain an option to set one photo for the background of the entire rack. See threejs.org for more information.

Screw hole locations

For Units other than 1 or 3, the screw hole location are not calculated properly. Consequently, the drawing shows screw holes in 1U or 3U locations for 2U and 4U panels.

Input Fields to Update Drawing

When users update the input fields for the rows they must press the ENTER key to submit each update for the drawing. See about updating onBlur when the field loses focus.

Save Table to CSV

The table contains input textboxes which have no associated values. When the CSV file is saved, the only values that are saved are those directly contained in the cells.

Open CSV file to Table

Current function does not work as expected. Desired outcome is that a CSV file ignore header fields and read values to table as innerHTML and subsequent children as child.value if needed.

3D Views

Function to duplicate the drawing for material thickness and two more times for the other case side. Separation of the two sides to be set by horizontal position (hp). Functionality to adjust hp dependent upon synth format. Include new function to calculate the over all width of the case. Include function to allow for differing material thickness for the side of the case. Display the rail width of the case in inches/mm display the overall width including left and right case sides. See threejs.org for more information.

Case back location

Hold back of case to correct position in drawing when angle exceeds 90 degrees. If the angle of the panels exceeds 90 degrees, the back of the case moves left and can intersect with the panels given too much panel rotation.

Print / Save Designs

Whereas most browsers have the functionality to print/save PDF this is probably a non-issue.

Material List and Pricing

Incorporate material list and prices. i.e. lumber, screws, glue, rails, inserts, nuts, etc. to allow users to build their own price list and source material for the building of their rack. Simple DB functionality to add Material Item, Cost, Quantity and Source (web site or store location.) See https://github.com/6pac/SlickGrid

It is not necessary to have the 3D functionality before incorporating a material list. The calculations for the size of the size of a side, thickness of material, hp of the rack and such can be incorporated before full 3D functionality is available.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.