Closed mpogue2 closed 6 years ago
It's really super annoying to have to edit Lyrics as .TXT or by hand as .HTM ...adding the "SUPER ANNOYING" label to this one. I have code that did this, but it should be re-written, I think.
I was prepping for a hoedown for the last couple of days. The lack of a built-in Lyrics editor was a major pain point for me.
I am currently using Kompozer (free on Mac OS X), and cut/pasting from other lyrics that I already had prepared. It still got it wrong sometimes, and I had to hand-edit the HTML source. After I saved a change, I had to go back to SquareDesk, choose another song, and choose the original song again, to get the lyrics reloaded. PAINFUL. This process worked, but it was time-consuming and error-prone.
I really wanted to be able to: 1) open an existing HTML cuesheet 2) edit the title section 3) edit the body freely (mostly cut/copy/paste) 4) highlight and set/unset the lyrics spans (), maybe with just a simple button (it should work exactly like a rich text editor's existing Bold, Italic, Underline buttons) 5) same as item 4 above, except for setting the HEADER (used for "OPENER", etc.) 6) save (don't overwrite the existing cue sheet) 7) Have the new cuesheet appear in the Lyrics dropdown immediately, as the new default
I think this would have saved me about an hour of prep time overall.
Okay, this seems pretty easy. A few questions:
Just started hooking up signals and throwing a few controls up in the editablelyrics
branch. Bold and Italic work.
I love it already! Suggestions: italics button should be like the Bold button (small roundish, italic I on it).
My answers to your questions:
We could do an "unlock to edit button", but I think more people are familiar with the "*" when edited, then use SAVE to save it, or SAVE AS to give it a new name. Default directory for Save As should be the original cue sheet's directory. When saved, it should add itself to the dropdown, if it matches the usual RegEx. This makes it consistent with the Playlist change I just made, too. (Saved Playlist is a Playlist that shows up in the MRU list. The Lyrics Dropdown is our MRU equivalent for Lyrics cue sheets that match.)
2) The more I think about it, the more I think that Automatic section finding should be done just by regex. Any line of text that contains (case-insensitive) OPENER is an opener line. User can select HEADER style for them, if they want, by highlighting and clicking HEADER. Auto-scrolling should pay attention to the text (e.g. Opener), but it should look at text, not at formatting, IMHO. So, I don't think we need any special editor features for Auto-sections yet.
Later on, we might consider a "fix it up nice" button, that auto-detects Opener, Middle Break, Closer, Figure
I think format should follow SquareView exactly, so that resulting cue sheets can be pushed back to SqView (we're all in this together!). If users want Bold and Italic I'm also OK with that, but I don't think we need a CALLS style, because it's not the SquareView standard. Calls are just
. SqView only has: {lyrics, hdr, title, artist, label}. Everything else (including calls) is {body}. I believe that all SqView spans are done with , no actual spans or divs. This is semantic tagging, and all presentation styling (color, size, etc.) is done just with the CSS file (yellow background, bold title, blue artist & label, red header, black on pink for lyrics), so let's keep that standard, I think.Furthermore, and this may be controversial, if a user wants to muck around with text sizes, or tables, or or...I think that stuff is best done with an external html editor.
Ok, that's my 2 cents...
Hmmm...testing out that stuff from item 3 above doesn't currently work. Make one word bold and the next word not. Selecting both will remove the bold formatting right now...
Okay: 674011e6f6d107170684432a7dc4c70542bcc93f
This defaults to the current music path, and then remembers the location you saved stuff. With the base name of the current song file. This is wrong, but at least it's something to fix (though the fix might just be to save the default music path)
Yes. I really like this. We're going to have to be smart about "closer" and what sort of headings we search for it in. I need to do some poking around about how to get text in and out of the control. And the "heading" button isn't working because I don't yet know how to do semantic markup and my attempt at just changing font size crashed.
The buttons should react to whatever type of text the caret is in. This makes marked stuff that crosses boundaries a little weird, but I think the behavior I just uploaded works.
Oh, and:
and it'd be nice to designate a section where we can change out figures, once the figure management gets better.
On your auto-format thing: We should be able to copy and paste from a ceder.net cuesheet and get gold. That's the standard.
Today's productivity brought to you by long waits on paying work processes...
Header button now takes the current selection and wraps it in
tags. Not the right thing, but again, something to fix.Last save path is saved and loaded.
I realize that we're going to have to deal with issues of when something has been saved and when it hasn't. It's way too easy to quit without saving, but we don't just want to save over the original cuesheets.
And all this goodness is in fd84cd7da0cdb68290d4e11fee1220acc881d22e in the editablelyrics branch. And I'm off to Palm Springs for the IAGSDC convention tomorrow.
Is there a way for us to increase the number of these: "Today's productivity brought to you by long waits on paying work processes..."??? :-) Awesomely productive!
OK, here's what I found so far:
This is already feeling like it will save me a LOT of time.
I have some ideas for the Quit-without-saving question:
a) if filename was "MP123 - foo bar.html", on Quit should save the current version as "MP123 - foo bar.edited.html", in the same directory. If that file already exists, use "MP123 - foo bar.edited.2.html". That way, the work isn't lost. It will show up in the DropDown list, and so editing can continue, if desired. When done editing, the user can just save it under the original "MP123 - foo bar.html" name (in which case the edited version goes away), or under some other "final" name, in which case the ".edited
Don't know what to tell you about the B and I buttons, they're identical here. Maybe work your magic in designer?
Header button is just wrapping things in an
Initial save directory... I did make a final change to try to save and restore it. Once you save once in the app, is it staying that way while the app is open?
We should be re-loading the cue sheet after we save it. I beat this one pretty hard, don't know what's going on, will dig, I guess.
Dan
b) control-z should work (does on my platform), and Lyrics->Revert Changes would be a matter of re-loading the current cuesheet (ie: trivial).
I just sent you email... I have fixes for the I button, it's a workaround for a Mac OS X bug. I have a quick fix for the header -- I looked at what SqView is doing, and I'd like to match... Should I commit these small changes, or should I just send to you?
Or I could also branch, if you want to look them over before integrating...
Control Z needs to be pressed twice to revert a change to Header span. That was my problem....so I guess it does work!
Initial Save Directory: no, once I Save, it does not remember that new location the next time.
OK, I pushed 770046be681968de4ae165cbaa4fc3132de66aec , which fixes the Italics button on Mac OS X, makes some esthetic changes to the button sizes, and also changes from <H1> to <p CLASS="hdr"> as per SqView convention. If you prefer something else, we can always revert...
Copy/paste do paste in the copied text, but it's the wrong size on Mac OS X (too small).... Oh, interesting. When I save it, the font size fixes itself. How strange!
On my machine, the lastCuesheetSavePath is always "." -- I'm not sure how it got that way. I also think it should be saved to Settings as soon as the Save is done, rather than when the window closes. There is similar code in on_actionSave_Playlist_triggered() that does this path remembering, so feel free to copy that, just change the key...
We have both default_dir (for File > Open) and default_playlist_dir (for Playlist > Load...) persisted by your magic macros right now...
And, here's the info on the SqView convention for spans: Header: <p CLASS="hdr"> ... </p> Lyrics: <font CLASS="lyrics"> ... </font> Title: <font CLASS="title"> ... </font> Label: <font CLASS="label"> ... </font> Artist: <font CLASS="artist"> ... </font>
re: the DropDown not matching the QTextEdit contents after saving -- I think it IS reloading the contents. It's the DropDown that has not been updated to match.
Also, a feature request: I am now thinking that the DropDown would be nice if it were sorted. I saved my test edits as "RIV123 - Summer Sounds 1.html", "RIV123 - Summer Sounds 2.html",etc and in the dropdown list they all show up in random order.
Another thought: maybe there should be a "Save" button as well as a "Save As..." button? Both buttons would be active only if changes were actually made. There is lots of room in the new editing toolbar...
And menu items to match: Lyrics > Save, Lyrics > Save As..., Lyrics > Revert Changes. I'm not sure where the Bold, Italic, Header, Lyrics should go as menu items. Edit menu, or Lyrics menu?
Even with it just starting to work, and with minimal features, this is SO useful already. Oh, how much time I wasted on Komposer on Friday and Saturday! And, do you know what Jim O is telling people do (it involves manually editing and inserting spaces by hand, using a Windows-only program)?
It's horrifying to me how much time callers have been spending on getting the lyrics edited so they can be usable, using multiple programs. I'm looking forward to this feature!
One more feature request: when in the Compact View, I think the toolbar for editing should also disappear. That way, the look is very clean for use at a festival or hoedown, and the size of the pane is maximized.
As mentioned OOB, please patch as you see fit!
Dropdown list should be sorted in relevant priority order, but... we may want to relook at that now that we're doing fancier stuff.
Okay, compact view hides the editing toolbar now. 630ae7114d3e79b2a7b5f4658425d74c9793a8e8
And fixed the cuesheet load after save. 06ba70e0744a132542c3ac9e0237ff2c00cec262
Bug: Start the app, double click "Summer Sounds", Lyrics shows *, go to Lyrics tab, and Dropdown is loaded with songs, but nothing in the editing pane. Select a different dropdown entry, and editing pane fills in. Go back to the initial dropdown entry, and pane fills in. So, it's just that first load that doesn't work...
Load after Save is fixed, though! And Compact View is nice -- very clean!
Hmmm....there's a more fundamental problem with the current QTextEdit method, I think. I was playing around with the lyrics editor, and if you look directly at the Save... output, it is a huge inline CSS expansion of the input HTML + stylesheet that was used. But, I think what we need is the original HTML separate from the stylesheet that was used, so that the user can still change the stylesheet and get a different result for all files. The way it is right now, once an HTML file is edited, the style sheet that we used internally is essentially applied to that HMTL file forever....
Example original:
<body>
<p class="hdr">(16 beat intro)</p>
<p class="hdr">OPENER (Basic)</p>
<span style="font-weight: bold;">Circle left!</span><br>
<span class="lyrics">Listen to the music of the carousel<br>
The ting-a-ling-a-ling of the ice cream bell</span><br>
Do an Allemande Left your Corner, Turn a Right hand 'round your own<br>
And the Men Star Left and you roll it, roll it around you run<br>
Turn the Partner Right, then you go Left Allemande<br>
Swing a little girl and you Promenade the land<br>
<span class="lyrics">Here...come...summer sounds, the summer sounds I love</span><font class="lyrics"><br>
</font><br>
Example Saved Output from QTextEdit:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html><head><meta name="qrichtext" content="1" /><title>Summer Sounds</title><style type="text/css">
p, li { white-space: pre-wrap; }
</style></head><body style=" font-family:'.SF NS Text'; font-size:13pt; font-weight:400; font-style:normal;" bgcolor="#ffffe0">
<p style=" margin-top:12px; margin-bottom:12px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px; line-height:100%; background-color:#ffffe0;"><span style=" font-family:'Verdana'; font-size:x-large; color:#ff0000; background-color:#ffffe0;">(16 beat intro) V 10</span></p>
<p style=" margin-top:12px; margin-bottom:12px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px; line-height:100%; background-color:#ffffe0;"><span style=" font-family:'Verdana'; font-size:x-large; color:#ff0000; background-color:#ffffe0;">OPENER (Basic)</span><span style=" font-family:'Verdana'; font-size:large; color:#000000;"> </span><span style=" font-family:'Verdana'; font-size:large; font-weight:600; color:#000000;">Circle left!</span><span style=" font-family:'Verdana'; font-size:large; color:#000000;"><br /></span><span style=" font-family:'Verdana'; font-size:large; color:#000000; background-color:#ffc0cb;">Listen to the music of the carousel<br />The ting-a-ling-a-ling of the ice cream bell</span><span style=" font-family:'Verdana'; font-size:large; color:#000000;"><br />Do an Allemande Left your Corner, Turn a Right hand 'round your own<br />And the Men Star Left and you roll it, roll it around you run<br />Turn the Partner Right, then you go Left Allemande<br />Swing a little girl and you Promenade the land<br /></span><span style=" font-family:'Verdana'; font-size:large; color:#000000; background-color:#ffc0cb;">Here...come...summer sounds, the summer sounds I love<br /></span><span style=" font-family:'Verdana'; font-size:large; color:#000000;"><br /></span></p>
I tried running HTML Tidy on it, and tidy was able to factor out all of the spans to a single CSS block, but then we'd need to pattern match the extracted CSS block against the original style sheet that we used. That's not simple. Example output from tidy (it's much closer to the original):
<STYLE type="text/css">
body {
background-color: #FFFFE0;
}
body.c7 {font-family:'.SF NS Text'; font-size:13pt; font-weight:400; font-style:normal;}
p.c6 {margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;}
span.c5 {font-family:'Verdana'; font-size:large; color:#000000; background-color:#ffc0cb;}
span.c4 {font-family:'Verdana'; font-size:large; color:#000000;}
span.c3 {font-family:'Verdana'; font-size:large; font-weight:600; color:#000000;}
p.c2 {margin-top:12px; margin-bottom:12px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px; line-height:100%; background-color:#ffffe0;}
span.c1 {font-family:'Verdana'; font-size:x-large; color:#ff0000; background-color:#ffffe0;}
</STYLE>
....
<BODY class="c7">
<P class="c2"><SPAN class="c1">(16 beat intro) V 10</SPAN></P>
<P class="c2"><SPAN class="c1">OPENER (Basic)</SPAN> <SPAN class="c3">Circle left!</SPAN><SPAN class="c4"><BR></SPAN><SPAN class="c5">Listen to the music of
the carousel<BR>
The ting-a-ling-a-ling of the ice cream bell</SPAN><SPAN class="c4"><BR>
Do an Allemande Left your Corner, Turn a Right hand 'round your own<BR>
And the Men Star Left and you roll it, roll it around you run<BR>
Turn the Partner Right, then you go Left Allemande<BR>
Swing a little girl and you Promenade the land<BR></SPAN><SPAN class="c5">Here...come...summer sounds, the summer sounds I love<BR></SPAN><SPAN class=
"c4"><BR></SPAN></P>
<P class="c2"><SPAN class="c1">FIGURE 1 (Basic, corner progression)</SPAN></P>
<P class="c6"><SPAN class="c4">(HEADS) Star Thru, Pass Thru<BR>
Right And Left Thru<BR>
(you) Veer Left and Bend the Line and make a line you do<BR>
Pass Thru Wheel and Deal<BR>
Centers Star Thru<BR>
Pass Thru Cloverleaf<BR>
(New Center Two) Square Thru 3/4<BR>
Turn Corner By the Left<BR>
All The Way Around and PROMENADE THE SET<BR>
<BR></SPAN><SPAN class="c5">Here...come...summer sounds, the summer sounds I love<BR></SPAN></P>
Compare that to the original cuesheet.css file:
body, p, font { font-family: Verdana; font-size: large; font-weight: Normal; line-height: 100%; background: #FFFFE0; color: #000000; }
.lyrics { font-family: Verdana; font-size: large; font-weight: Normal; color: #000000; background-color: #FFC0CB;}
.hdr { font-family: Verdana; font-size: x-large; font-weight: Normal; color: #FF0000;}
.title { font-family: Verdana; font-size: x-large; font-weight: Bold; color: #000000;}
.artist { font-family: Verdana; font-size: medium; font-weight: Normal; color: #0000FF;}
.label { font-family: Verdana; font-size: medium; font-weight: Normal; color: #0000FF;}
So, .lyrics == .c5, etc.
I'm not quite sure how to approach fixing this. I'd like to make minimal changes to the HTML file, if possible, so that the CSS file can still be used to customize presentation.
By the way, HTML tidy is available as C source code and designed to be used as in library form, if we do need to go down that path. I was looking at tidy as a possible way to clean up bad HTML on the input side.
And, one other thing I learned in playing around is that the SqView cuesheets use
This worked for me:
sed 's/<l>//g' summer.html | sed 's=<\l>==g' | tidy -i -w 160 -u -b -c > summer2.html
I wish we could get meta information about the contents of the buffer out in some other way than just toHtml()
. We might need to parse the HTML in-memory and rewrite it. I'd like to reduce it to something super simple and semantic.
Does it look like the CSS is copied in from the cuesheet verbatim? If we could just load the CSS files and do a htmlString.replace(cssFileContents,referenceToCssFile)
, that might help.
Oh, ugh, no: The style is per tag, not in a block at the top. The editor is throwing away all the semantic meaning.
So we can use reading the document into the text editor as our "HTML Tidy", but coming back out we need to figure out how to do something with it. Especially since we're going to need to be able to automagically replace choreography in it on the fly.
Oh, ugh, no: The style is per tag, not in a block at the top. The editor is throwing away all the semantic meaning.
So we can use reading the document into the text editor as our "HTML Tidy", but coming back out we need to figure out how to do something with it. Especially since we're going to need to be able to automagically replace choreography in it on the fly.
Fixed the issue with the cuesheet not loading with 302e5cfa7aa417b42f800bda9fc2ff536743f346 and merged the master branch back in.
Lyrics->Revert Edits added in 572efa931db874488fcac97437f9618aa86a37a8
Thinking about saveability... I think we may need to track cuesheets in the database, and add a checkbox or toggle that says "always overwrite this file with the current changes". Still thinking on this...
Yes, semantic meaning is lost. But all is not lost! I've been thinking (always a dangerous thing :-)...I do think that because many of the semantic tags are non overlapping that I can infer the semantics from the presentation styles at the back end, especially with a little careful processing on the front end going in. Yes it involves using tidy to help and non-greedy regexes. I will take a whack at this over the long weekend and see if I can solve it.
I am ok with some transformations that simplify and regularize the HTML. But I do want to retain the semantic info.
It's more complex than that. We already tell it which CSS to use, but then it translates it on the way in to eliminate the semantics leaving just inline CSS. I think I can get around this...stay tuned!
Dan, editable lyrics branch is not compilable right now. Did you forget to commit changes to main window.h and mainwindow.ui?
Yep, I think that's the problem...so, I have created a branch one commit back from that one, where I am now playing with HTML-TIDY.
It is so cool! I haven't gotten to the hard part yet (preserving semantic markup), but I am getting more comfortable with the tidy API (setup to affect Mac OS X only so far). The output HTML is so much easier to read.
Example of tidied-up HTML (same input file as above):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META content="text/html; charset=utf-8" http-equiv="content-type">
<TITLE>
Summer Sounds
</TITLE>
<LINK href="cuesheet2.css" rel="STYLESHEET" type="text/css">
</HEAD>
<BODY>
<P class="hdr">
(16 beat intro)
</P>
<P class="hdr">
OPENER (Basic)
</P><SPAN style="font-weight: bold;">Circle left!</SPAN><BR>
<SPAN class="lyrics">Listen to the music of the carousel<BR>
The ting-a-ling-a-ling of the ice cream bell</SPAN><BR>
Do an Allemande Left your Corner, Turn a Right hand 'round your own<BR>
And the Men Star Left and you roll it, roll it around you run<BR>
Turn the Partner Right, then you go Left Allemande<BR>
Swing a little girl and you Promenade the land<BR>
<SPAN class="lyrics">Here...come...summer sounds, the summer sounds I love</SPAN><FONT class="lyrics"><BR></FONT><BR>
<P class="hdr">
FIGURE 1 (Basic, corner progression)
</P>(HEADS) Star Thru, Pass Thru<BR>
Check out 662fa2aad86dc9da46447e64fdcd000ebe2e9acb . So far, I am successfully recovering the semantics for hdr and lyrics. More tomorrow, but I think the methodology is sound. On input, I tidy to fix problems. On output, I tidy again, get rid of cruft, regex replace the presentation stuff with semantic stuff, and tidy one final time before writing.
Currently assumes that semantics do not overlap, e.g. can't be both header and title at the same time. The editor will need to enforce this (somehow?). I'll worry about that problem shortly.
We can probably also enforce that there's only one title span, one author span, one label span in the document (take first, delete the rest?).
The cuesheet might also need to distinguish artist and label by slight imperceptible color difference, so the semantics can be extracted at Save time. I can live with requiring that. :-)
Whoops. Fixed.
OK, I think I have the semantic recovery stuff working, as of 4bca2e51544955c09d1436688daa90af2b19db36 .
As long as the colors are distinct in the /lyrics/cuesheet2.css global style file, QTextEdit will retain them, and the original semantics can be recovered. I have tested round-tripping several times on Mac OS X, with no loss of semantic information.
Dependency on html-tidy, which canonicalizes the tags, making it possible to use QRegExp to modify the HTML. Might already be on your system? (or you might have to build it). For MAC OS X, like libbass, I built it in a subdirectory (checked into the repository), and copied over the DLLs to the test123 directory (checked in as binary), where they are built into the .app file at build time.
Couple of things I did not get to:
OK, I think this demonstrates that the semantic stuff can be recovered...wanna try it on Linux, and see if you like it? Or maybe you can see a better way to do this? I'm agnostic as to how we solve this, just excited that it appears to be solvable.
Here's what the prototype looks like on Mac OS X:
Can store them inside the MP3 file (ID3 unsynchronized lyrics)? Or, in the Sqlite DB?