ogt / boxchareditor Goto Github PK
View Code? Open in Web Editor NEWBox drawing character utility
Home Page: http://ogt.github.io/boxchareditor
License: MIT License
Box drawing character utility
Home Page: http://ogt.github.io/boxchareditor
License: MIT License
Sourced @oDesk for $100 - Job Completed Successfully
Add a type that uses ├
, ─
, │
, └
etc chars instead of the regular bar |
, dash -
and plus +
.
Note that in this case we have 11 chars (4 corner chars, 4 T chars and the +
|
, -
.)
List of chars
http://en.wikipedia.org/wiki/Box-drawing_character
┼ ─│
┌ ┐└ ┘
├ ┤┬ ┴
All the code should be included in a new file blocklines.js
that implements the update function.
You will extend the drawingengine.js
code below...
if (!model.type || model.type == 'simple') {
updateFunction = require('./simplelines.js');
}
//else if .... other types of chars
if (updateFunction) {
updateFunction(model,s,oldpos,newpos, brush);
}
to use the new block characters :
if (!model.type || model.type == 'simple') {
updateFunction = require('./simplelines.js');
}
else if (model.type == 'block') {
updateFunction = require('./blocklines.js');
}
if (updateFunction) {
updateFunction(model,s,oldpos,newpos, brush);
}
To simplify things I have put in this issue only single line drawing (introduction of the double line characters in the blocklines.js
is part of a separate issue #3 ).
You will also need to add a test file (similar to what exists now test/test1.js
for the simple
type). You should at least reproduce the existing 8 tests (with the new characters). You may need to add more to maintain the current 100% code coverage by the tests.
When testing the project from the web interface, entering block
in the type
fieldand then pressing the restart
button should switch to the new type. At that point I should be able to "draw" using the arrow keys. Attempting to create a double should have no effect - a single line would appear instead.
Follow the instructions in the README.md for making changes.
Budget : $100
Primary Skill : Nodejs
Required Skills : Nodejs, Javascript
Create an ACE editor extension that provides the equivalent functionality
I'm offering $60.00 on oDesk for someone to do this task: https://www.odesk.com/jobs/~01f9e0af301ef7c56a
Enhance the block
type to allow for the drawing of double lines (in addition to the 11 double line chars we have 16 additional mix (for the corners and Ts)) (Fonts 255X, 256X)
Note that this is not a different type, its an extension of the existing type block
,
similarly to the way we extended the simple time to use =
for horizontal lines instead of just dashes -
(issue #1 ).
This means that when the user presses Shift
, then the line drawn between point a and point b should be double. The chars described in Issue #2 for single line drawing are (should be) compatible (connect) with the chars below. Double line would be drawn both in the case of horizontal move as well as in the case of vertical move.
The only files that will be needed to change should be : ./lib/blocklines.js
, ./test/test_blocklines.js
and ./README.md
Make sure that you extend the tests to maintain 100% code coverage.
═ ║ ╒ ╓ ╔ ╕ ╖ ╗ ╘ ╙ ╚ ╛ ╜ ╝ ╞ ╟
╠ ╡ ╢ ╣ ╤ ╥ ╦ ╧ ╨ ╩ ╪ ╫ ╬
http://en.wikipedia.org/wiki/Box-drawing_character
Follow the instructions of Issue #2 for any additional information.
Budget : $60
Required Skills : Nodejs, Javascript
According to substack https://github.com/substack/ploy#scripts
Before any services are started, npm install . will be run on the deployed repo.
npm will handle the preinstall, install, and postinstall hooks.
postinstall is a good place to put bundle steps like browserify.
I think we should do that and possible take a look at other scripts in the Makefile
and bring them in the in the scripts object of package.json.. possibly completely eliminate the need for a makefile as suggested by https://twitter.com/substack/status/337310410657128448
Make type multiple choice - maintain the current "auto generation" of the model editor
I'm offering $60.00 on oDesk for someone to do this task: https://www.odesk.com/jobs/~01307bdb63e2197adf
Today in order to use anything that you draw with the boxchareditor you need to select with the mouse the area and then copy it. The problem with this approach is that the area selected is the corresponding html rows ... while often the area that you want to copy is defined based on a rectange .. similar to drawing editors.
So it would be nice to allow a similar functionality.
Now given that
the simplest implementation for this would be to add a current col, row display so as the user can see the current row and column of the cursor
and then add a
[select area]
from : [column] [row]
to : [column] [row]
which when pressed it will popup a text dialog box with all the enclosed from -> to pasted in it and selected.
[column] and [row] are text input boxes that display in grayed text column and row to explain what the user needs to input (the text disappear on click)
Budget : $60
Skills : node.js javascript
Change the drawing logic to use an editable text area instead of <p>
elements
The goal here is to allow someone to paste something and draw on top of it or draw and then add labels to boxes etc.
Cannot get tap to produce coverage information.
Ideally after confirming that all tests pass we should run the test coverage report and we should have a test that confirms that the tests are reaching a specific % of code coverage.
I'm offering $100.00 on oDesk for someone to do this task: https://www.odesk.com/jobs/~010a40f2355ca6dfb2
Allow someone to save the current drawing (model configuration + table)
boxchareditor/name/table
, boxchareditor/name/model
Budget : 100
Skills : node.js javascript
I'm offering $100.00 on oDesk for someone to do this task: https://www.odesk.com/jobs/~0173106a972325957c
Add a Paste Text button
[Paste Text]
[ ]
[ ]
[ ]
Pressing Paste Text will take the text in the text area and "paste" it in the current cursor position
(what should happen is that the past operation will do replace the corresponding cells of the grid and then will refresh the display giving the "illusion" of an actual paste.
The paste function should probably be added in the grid_utils.js
.
The grid_util paste function would take as inputs two-dimentional array a (row,col) position and a target grid on which the "pasting" will be applied to.
In this case the `index.html can do
target_grid = gridutils.paste(gridutils.fromstring(buffer), row , col, target_grid)
From UI perspective, the text area should be expandable.
We should probably right-trim the lines.
If the pasted text extends beyond the end of the grid we shouldn't get an error... the pasted should be appropriately truncated.
We will need to add test to ensure that overwriting text with lines works as expected.
Budget : 100
Skills : node.js javascript
make type multiple choice
Change the model type input to multiple choice
Maintain the current "auto generation" of the model editor
Find the fonts that do have the current model type chars (move type top of the model list)
Sourced @oDesk for $40 - Job Completed Successfully
Enhance the editor by allowing double lines to be drawn if ctrl is pressed '=' in horizontal movement - no change during in vertical movement.
For example someone should be able to draw a table like this
+====+=============+===================+
| | | |
+----+-------------+-------------------+
| | | |
| | | |
| | | |
+====+=============+===================+
Note that we still use the +
sign when a double horizontal line (===
) crosses a vertical line (|
)
You will probably need to
Ctrl
key in the keypressed
function (there is already a BRUSHDOUBLE
brush constant to use)simplelines.js
file to handle the case where there is =.There aren't any testing functions for now so you will need to test it manually yourself.
Budget : $40
Primary Skill : Javascript
Required Skills : Javascript, jQuery, HTML
Create an eclipse plugin that provides the equivalent functionality
I'm offering $120.00 on oDesk for someone to do this task: https://www.odesk.com/jobs/~012d414933e03d101e
Add a new type (call it org
) that uses the thin/thick characters instead of the single double line block drawing characters.
Note that in this case the default character is the thick. Pressing Ctrl
results in using the thin (thin is described as light in wikipedia, thick is described as heavy in wikipedia)
Also Note that several fonts (like the font used in github issues below do not have compatible fonts for the complete combination. Use the wikipedia font as the "standard".
─
━
│
┃
┌┍┎┏
┐┑┒┓
└┕┖┗
┘┙┚┛
┝┞┟┠┡┢┣
┥ ┦┧┨┩┪┫
┭ ┮ ┯ ┰ ┱ ┲ ┳
┵ ┶ ┷ ┸ ┹ ┺ ┻
┽ ┾ ┿ ╀ ╁ ╂ ╃
╄ ╅ ╆ ╇ ╈ ╉ ╊
╋ ┼
Make sure that you extend the tests to maintain 100% code coverage.
You will need to create a separate test file ./test/test_orglines.js
.
You should expect to change primarily the file
./lib/orglines.js
. The file ./lib/drawingengine.js
should only have a minimal modification to allow expand the type switch.
Also you will need to update the README.md file with at least an example usage of that type.
Follow the instructions of Issues #2, #3 for any additional information.
Question : You are coding a nodejs module. How do you export a single function?
Required Skills : node.js, javascript
Budget : $120
Create a sublime plugin that provides the equivalent functionality.
Try to find a sublime like font that displays well.
Seems that default browser courier fonts have lousy box characters...
Possible links here :
When switching from block to simple and vice versa and apply setting (as opposed to clear grid) things are not working as expected.
It seems for example that you cannot erase block lines while you are in simple mode.
You can't overwrite them either.
We probably should add tests for that mixed mode too.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.