Giter VIP home page Giter VIP logo

lilybin's Introduction

LilyBin

Dependency status

LilyBin is a web-based LilyPond editor. See it live at http://lilybin.com.

Submit bugs and feature requests as GitHub issues.

Running LilyBin

Install Node.js and Docker.

Clone the repository and run npm install to download required node modules.

Run docker pull trevordixon/lilypond to fetch the Docker image containing the latest versions of LilyPond. (LilyBin uses Docker to compile scores in a sandboxed environment. It looks for a Docker image named trevordixon/lilypond and runs each compilation in a new container.)

The Dockerfile used to build that image is located at trevordixon/docker-lilypond.

Launch LilyBin with node server.js. Navigate to http://localhost:3001, and you should be presented with an editor pane and a successfully rendered score.

lilybin's People

Contributors

scottlinux avatar timothygu avatar trevordixon avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

lilybin's Issues

reset button

Hi,

I would appreciate a reset button near the preview one, that would delete the existing code for copy/paste a new one more easily.

Thx

Error handling on the client-side

Right now, if prepare_preview returns non-200, the error is ignored, and the spinner spins forever. It would also be good to know what files are generated, so that when the user clicks on say "Download MIDI" it can warn the user that it is not generated, falling back to #14.

Use new Amazon API Gateway to invoke Lambda functions

I set up an Amazaon API Gateway, so now we can do this to render scores:

jQuery.post('https://7icpm9qr6a.execute-api.us-west-2.amazonaws.com/prod/stable', JSON.stringify({
  body: "% LilyBin\n\\score{\n\t{\n\t\tc' c' d' e' f' f' f'2\n\t}\n\n\t\\layout{}\n\t\\midi{}\n}\n",
  key: "abcdefg"
}))

We almost don't need the EC2 instance after this! Then we can use S3 or GitHub pages to host the front end.

Saving documents to browser local storage

Here is an idea: all modern browsers support Local Storage API, so users can have their scores in browser before they will decide export it to Dropbox or Gist.

It don't meant to replace these two, but, for example in case if browser crashed, but document was not saved neither to Dropbox nor Gist, progress won't be lost.

In-window MIDI preview

Be nice to have the ability to listen to the MIDI in the browser window instead of having to separately download the file (similar to Frescobaldi or weblily)

Log events

It would be nice to know how many scores get compiled and how much time and memory is spent compiling. We ought to log more in general.

Undo button

there are times when I'm scratch-padding on lilybin.com and I remove code to test, only to forget that there is no quick easy way to get the code back (unless I remember to do a ctrl+x ctrl+v).
Every editor under the sun has an undo feature, maybe lilybin should too

Consider SVG as default output format.

One idea.

For me reloading of scores after save takes some time, I think it's not only processing on server-side, but also PDF rendering on client side... I found for me SVG representation of score actually does better job... It's natively supported, so opens noticeably quicker, and it looks a way nicer, lines are more crisp.

I must admit lilypond does not "gzip" output, but since it could be done on server-side it's also possible to optimize bandwidth usage, which will great for both client and server.

Here calculations based on my favorite score:

  • PDF — 176,845 bytes
  • PNG — 95,397 bytes
  • SVG ­— 302,864 bytes

  • PDF / gz — 91,855 bytes
  • PNG / gz — 91,572 bytes
  • SVG / gz28,050 bytes

PNG output was created with -fpng switch, SVG was created with -dbackend=svg switch.

I think switching to gzipped SVG will lead to lower bandwidth usage on server and client, easier for CPU on client side, much more crisp and nice for end users' eyes, thus improving performance and usability for end users.

Horizontal 2-finger-touch-scroll of the score is backwards

Here's a minor one: Horizontal scrolling of the score image using two-finger swipe/touch works backwards (on a mac laptop, OSX 10.8). It's the opposite of the usual expectation. Usually two-finger swipe to the right moves the image to the right, while here it goes left. The vertical dimension works as expected.

(P.S. nice work on LilyBin!)

Save file only if score was modified

Currently system responds on every Save file event. No matter was changed something or not. New snapshot is generated.

I think it's not necessary, just consumes resources, so additional check could be added: if score text was not modified, Save file button should be either disabled or just do nothing.

Can not render longer scores

When I try to render longer scores (more than one page), the pdf reader gets stuck on loading.

Seems to be 'Access-Control-Allow-Origin' problem:

XMLHttpRequest cannot load https://s3-us-west-2.amazonaws.com/lilybin-scores/swaj09.pdf?t=1452624473212. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.lilybin.com' is therefore not allowed access. The response had HTTP status code 403.

However, I could open the pdf file URL in a new tab.

Use browser-based Dropbox APIs

The current Dropbox integration doesn't work:

curl http://localhost:3001/dropbox_login
TypeError: object is not a function
   at /home/timothy_gu/LilyBin/server.js:93:49
   at Layer.handle [as handle_request] (/home/timothy_gu/LilyBin/node_modules/express/lib/router/layer.js:82:5)
   at next (/home/timothy_gu/LilyBin/node_modules/express/lib/router/route.js:110:13)
   at Route.dispatch (/home/timothy_gu/LilyBin/node_modules/express/lib/router/route.js:91:3)
   at Layer.handle [as handle_request] (/home/timothy_gu/LilyBin/node_modules/express/lib/router/layer.js:82:5)
   at /home/timothy_gu/LilyBin/node_modules/express/lib/router/index.js:267:22
   at Function.proto.process_params (/home/timothy_gu/LilyBin/node_modules/express/lib/router/index.js:321:12)
   at next (/home/timothy_gu/LilyBin/node_modules/express/lib/router/index.js:261:10)
   at /home/timothy_gu/LilyBin/node_modules/express-session/index.js:433:7
   at /home/timothy_gu/LilyBin/node_modules/connect-mongo/lib/connect-mongo.js:305:11

It might be easier to just use the Dropbox Drop-ins API, which eliminates all the session stuff.

Multiple simultaneous users makes site give errors

When we have 30+ people using the site at once, lilypond compiles fail with:
-error
-error 'killed'
-general unresponsiveness
-etc....

It would be great for lilybin to be able to handle that many at once, but if not maybe some sort of queue system so the user knows what's going on and can wait for a successful compile

Run LilyPond inside a container

When lilypond is invoked with --safe-mode, TeX and PostScript file output is disallowed, and lilypond-bin is invoked with --safe-mode, the user's Guile expressions are evaluated in a safe environment and file inclusion is not allowed.

Share should not give unsaved link

A couple of times last year, a student entered code to lilybin.com and clicked the share link and emailed me a link to: lilybin.com/
I know this is user stupidity, but I think if someone clicks the 'share' button, it should do a save and provide the link to the currently saved code

View compile log

Retroactively submitting a feature request that Timothy has already completed - thanks Timothy!

New button added to the right hand menu: "Show Lilypond Log". Tested and working in the Safari browser.

Currently, messages can be printed to the log by using

#(display "insert message here" (current-error-port))

TODO:

  • Make log window "sticky"
  • Pipe stdout to log

Add `composer` and `title` fields from score to website

I think it will make website more user friendly, if it would be able to extract title and composer fields from \header statement of a score and show it as part of the web page title tag.

At least browser history will show not a soulless addresses like lilybin.com/xyz, but soulless addresses with titles that speak for itself.

Expiration date

We should allow users to make a score expire once it is. Having the infrastructure in place to do this will also allow #25, since the Dropbox Savers API requires a URL to be present for the file to be stored.

LilyBin unstable version out of date

The current unstable version on LilyBin appears to be 2.19.38, a bit out of date.

I'm not sure if the update script is not running or something else?

Error messages are hidden

Error messages were showing last week. Now the error window only has the string "Connection failed: 0 error".

The console link also seems to show an empty log.

Switch to Bootstrap

I have to say that the LilyBin frontend as-is is pretty impressive without the use of any external style library. However, I think it is time to think about using a well-maintained responsive CSS framework like Bootstrap or even Materialize. The grid system in both frameworks might be a little bit easier to hack on and maintain than the current split bar approach, which TBH feels really last decade-ish. It will also make a responsive version easier.

Add github link

lilybin.com needs a link to this github project, perhaps in a small footer area.

Allow users to choose template from list

Is it possible to have list of most common used templates?

For example:

  • Treble Clef only;
  • Treble Clef + Guitar Tab;
  • Bass Clef only;
  • Bass Clef + Bass Guitar Tab;
  • Treble and Bass Clefs combined;

P.S. I trying to help you with pull requests, but I haven't succeed to make development environment work on Windows... But I still keep trying.

Lilybin on Android phone

Hi,

Thanks for this great tool, I can work with Lilypond everywhere. But i have a problem on my 5 inch Android phone with Chrome Browser : I've no access to the code panel because of the size of the preview panel that I cannot reduce . The best will be to have a button at right to hide/show preview panel and a button at left to hide/show dropbox panel.

Christophe

Clearer error message

It would be nice to be able to expand the "Error" message to show the actual error that Lilypond provides. That would save a lot of trouble.

Change footer for something more related to LilyBin

Hi,

I was thinking maybe it's possible to change footer with the line that has link to LIlyBin.com and says something about LilyBin itself, not only LilyPond.

Through I don't think it should be added to the template. The piece of code that creates such a footer a bit chunky, so template won't be so nice looking anymore...

Add github authentication

In #56 I've by mistake assumed that anonymous gists could be versioned. But apparently they are not.

I think it could be possible to add optional option to login using github OAuth2 protocol. The same way as for example, gitter and gitbook work now. This will enable users to get more control over their scores stored on github:

  • User will be always able to see list of his scores (since they will be linked to his account);
  • Scores will have revisions;
  • The user will be able to git push and git pull to and from gist and all the changes will be reflected in LilyBin.

Scaling: be able to handle a few simultaneous users

I'll put this out there again because of the flurry of new activity. It would be really nice to have the actual score compile to happen on a users machine, not the server. Better for lilybin.com (less CPU cycles) and better for users (faster). It would also deal with the scaleability problems we saw last year when I had a class of 50 trying to all click preview at the same time and having everything melt down

Do not block `PDF` preview when score is regenerated

Re-regeneration of large scores can take a long time. During this time PDF preview stays blocked and shows spinner.

It would be nicer if document won't be blocked completely. So user will be allowed to navigate through it, review different parts of it, search for errors, play it from sheet while he is waiting, etc.

Is it possible to replace spinner with another widget that will be informing user, that processing was started? For example it could be runner like the one that appears when PDF.js loads document itself.

Remove MongoDB dependency

MongoDB is way too heavy for our needs and complicates installation. Switch to either NeDB (easiest, almost API-compatible) or SQLite (more reliable?).

Disable `Preview` button if score is not changed

Preview button should be more smart, if score is not changed, update of preview is not needed too.

So it should stay disabled if preview should not be updated.

This will save server processing time (if no changes was made, there is no need to regenerate the same file), it will save client CPU, since there is no needs to re-render same document.

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.