# cube-hook
Hook based on existing cube-hook
My office recently moved locations, and that meant a new cube farm for me. Each cube has one shelf and one coat hook.
I want to add a few more shelves using the rack system built into the cubes. To start, I copied the hook.
# Sketching
OpenJsCad is a library and a website for displaying and editing 3D jscad files. The site does not have a sketch feature. However, one does exist for OpenSCAD.
Gitlab makes it easy to host so that you can find the editor at https://johnwebbcole.gitlab.io/OpenSCAD-polygon-editor/
The polygon editor allows you to load an image and the scale it to fit. You can then trace a polygon around the object. Note that you can use the spline tool to get beautiful curves.
# Use it in OpenJsCad
The polygon in the OpenSCAD code panel, can be copied into a file hook.jscad.
I turned the polygon into a function by adding const Hook = () =>
to the front.
const Hook = () => polygon([[-19,39],[-24,34],[-25,33],[-31,33],[-36,47/*1:0,0,0,0*/] ,[-36.68,47.76] ,[-37.57,48.32] ,[-38.53,48.69] ,[-39.59,48.91] ,[-40.65,48.99],[-41,49/*1:4,0,-3,-1*/] ,[-42,48.6] ,[-42.89,48.11] ,[-43.7,47.51] ,[-44.43,46.8],[-45,46],[-45,21/*1:0,0,0,0*/] ,[-44.64,20.03] ,[-44.23,19.04] ,[-43.78,18.06] ,[-43.29,17.11] ,[-42.74,16.14] ,[-42.19,15.3] ,[-41.52,14.41] ,[-40.78,13.63],[-40,13/*1:-3,2,3,-3*/] ,[-39.25,12.32] ,[-38.44,11.71] ,[-37.59,11.17] ,[-36.63,10.65] ,[-35.68,10.2] ,[-34.68,9.8] ,[-33.7,9.46] ,[-32.71,9.17],[-32,9],[-30,10],[-29,11],[-29,16],[-28,17],[-24,17],[-23,15],[-24,-20],[-24,-21],[-25,-22],[-29,-22/*1:0,0,0,0*/] ,[-30.03,-22.1] ,[-31.06,-22.33] ,[-32.04,-22.69] ,[-32.98,-23.19] ,[-33.82,-23.83],[-34,-24/*1:2,2,-2,-3*/] ,[-34.54,-24.9] ,[-35.01,-25.86] ,[-35.4,-26.86] ,[-35.69,-27.85] ,[-35.89,-28.87] ,[-36,-29.88],[-36,-30/*1:0,0,0,0*/] ,[-35.9,-31.03] ,[-35.67,-32.06] ,[-35.31,-33.04] ,[-34.81,-33.98] ,[-34.17,-34.82],[-34,-35/*1:-2,2,1,-2*/] ,[-33.47,-35.9] ,[-32.77,-36.65],[-32,-37],[-27,-37],[-26,-38],[-26,-39],[-26,-69],[-26,-71],[-24,-72],[-6,-72],[-5,-72],[-4,-71],[41,5/*1:0,0,0,0*/] ,[41.24,6.02] ,[41.38,7.08] ,[41.44,8.16] ,[41.42,9.22] ,[41.33,10.27] ,[41.16,11.29],[41,12/*1:1,-4,-1,2*/] ,[40.49,12.89] ,[39.91,13.75] ,[39.28,14.57] ,[38.61,15.35],[38,16/*1:0,0,0,0*/] ,[37.22,16.65] ,[36.34,17.23] ,[35.44,17.72] ,[34.47,18.15] ,[33.48,18.5] ,[32.5,18.74] ,[31.44,18.92] ,[30.3,19],[30,19/*1:5,0,-3,0*/] ,[28.96,18.96] ,[27.95,18.84] ,[26.94,18.65] ,[25.94,18.37] ,[25.01,18],[25,18],[23,16],[8,-8],[5,-11],[1,-11],[-2,-9],[-4,-6],[-4,35],[-4,37],[-6,39],[-7,40],[-17,40]]);
One nice feature of the OpenSCAD-polygon-editor is that you can copy the polygon
string back into the editor and modify it.
# Go 3D
To extrude, I'm using a jscad-utils function, poly2solid
and the fit function to size the object to the measured sizes.
var hook_shape = Hook();
var hook = util.poly2solid(hook_shape, hook_shape, params.thickness + delta).fit([40, 55, 0]);
And you can see the results!
# Now Playing
# Running
The jscad project cube-hook
uses gulp to create a dist/cube-hook.jscad
file and watches your source for changes. You can drag the dist/cube-hook.jscad
directory into the drop area on openjscad.org. Make sure you check Auto Reload
and any time you save, gulp creates the dist/cube-hook.jscad
file, and your model should refresh.
# start
npm start
or npm run start
will launch gulp, and create dist/cube-hook.jscad
. It also watches for file changes and recreates the dist file.
# clean
Deletes the dist
directory when you run npm run clean
.
# inject
Run gulp to combine the source files and inject the dependent libraries with npm run inject
. Libraries are found using a gulp plugin that looks for a jscad.json
file in a package. These files are combined and minimized before injecting into the dist file.
# build
Build the vuepress static site by running npm run build
. This script combines the readme with a vue-openjscad component to display a live view of the model. The baseUrl is set with the BASEPATH
environment variable. It defaults to /cube-hook/
. When hosted on GitLab, the .gitlab-ci.yml
CICD file uses this script to publish to GitLab Pages.
See the vue-openjscad package for information on modifying options like the grid or initial camera position.
# serve
Run vuepress in dev mode with npm run serve
. This script watches for file changes and hot reloads changes made to the README file. Changes to the model are not automatically reloaded; a manual reload is required.
# jscad-utils
The example project uses jscad-utils. These utilities are a set of utilities that make object creation and alignment easier. To remove it, npm uninstall --save jscad-utils
, and remove the
util.init(CSG);
line in cube-hook.jscad
.
# Other libraries
You can search NPM for other jscad libraries. Installing them with NPM and running gulp
should create a dist/cube-hook.jscad
will all dependencies injected into the file.
For example, to load a RaspberryPi jscad library and show a Raspberry Pi Model B, install jscad-raspberrypi using npm install --save jscad-raspberrypi
. Then return a combined BPlus
group from the main()
function.
main() {
util.init(CSG);
return RaspberryPi.BPlus().combine();
}
// ********************************************************
// Other jscad libraries are injected here. Do not remove.
// Install jscad libraries using NPM
// ********************************************************
// include:js
// endinject
# OpenJSCAD.org
If you publish the dist/cube-hook.jscad
file, you can open it directly in
openjscad.org by using the following URL:
http://openjscad.org/#
+ the url to your file.
# Gist
You can save your file to a GitHub gist and append the URL to the raw gist.
# Gitlab Snippet
If you save to a gitlab public snippet, you can open it using the following URL:
https://openjscad.org/#https://gitlab.com/snippets/1795323/raw.jscad
Make sure you change the snippet id to the correct value and add .jscad
at the end.
# License
ISC © John Cole