I was just writing an email to let you know that I saw your post, but haven’t had time to look at the script.
1 Like
Oh, okay.
Fair enough. And thank you.
I haven’t done any lessons in a looooooooong time, so it’s not urgent. (Still digging myself out of a review pile ~~ I think the end is coming!)
How it looks currently:
Have you looked through the examples on the [github documentation]?
Hey! Updating it - without even switching to Hours Only - solved it!
You’re a master!
Ahh… getting rid of the horizontal lines (“draw vertical axis”) seems to be what broke it (at least this time around) time to un-// it back. Hmm… I guess I’ll #FFFFFF it.
Where can I play with the colours of the lines? I’m thinking of making the day markers the same light-grey as the hour/segment markers as well, instead of bright red. EDIT: Found colours around line 275-282 ish…
I did this:
'#timeline svg .grid .redtic {stroke:#d5d5d5;opacity:0.25;}'+ '#timeline svg .grid .max {stroke:#ffffff;opacity:0.2;}'+ '#timeline svg .boundary {fill:#000;opacity:0;}'+ '#timeline svg .resize_grip {fill:none;cursor:row-resize;}'+ '#timeline svg .resize_grip .light {stroke:#ffffff;}'+ '#timeline svg .resize_grip .shadow {stroke:#bbb;}'+ '#timeline svg text.redtic {fill:#000000;font-weight:bold;}'+
And this:
function update_slider_days() { var days = settings.days; var period = $('#timeline .range_days'); if (days <= 3) { period.text((days*24)+' hours'); } else { period.text(days.toFixed(3)+' days'); } }
Still can’t find the colour for the horizontal lines - unless those are not separate…
No… I looked at WK’s “api” page. And that was all… ^^;
Haven’t touched it since that day 8 days ago - but I was (trying to) work on it all day. ^^;
Found some elements of the Dashboard that I’m going to copy, and hopefully insert in the right place with the new information…
We’ll see if I can do it. But I have to focus on final papers for the next week or two… then I can try to teach myself and make this tiny script again. (Basically I want to have the median/average accuracy of all items at the top, and display it the same as the number of reviews and lessons.) If I can figure that out, it’d be neat. And I think some people would use it. *shrugs* (And clicking it would like to wkstats.com, rather than the reviews or lessons pages of WK.)
EDIT: Wow, that fetch v2 is huuuge. Wonder if I need it all (like the spoof API for testing section, for instance). I thought it’d just be 10-25 lines or something. Huuuuge!
The horizontal and vertical lines of the grid don’t have any classes to distinguish them, but you could add a class.
Under this section:
// Draw vertical graph tics (# of Reviews).
Add a ‘horizontal’ class:
grid += '<path class="horizontal '+tic_class+'" d="M'+graph.margin.left+','+y+'h'+graph.x_axis.width+'" />';
then add a rule to modify the color or visibility:
#timeline svg .grid path.major.horizontal,
#timeline svg .grid path.minor.horizontal
{fill:none;stroke:black; opacity:0.2;}
I’m not at my computer, so I can’t test this.
1 Like
If you’re trying to do it without WKOF, then yeah, it’s a lot of work to fetch all of the data, and tons more to store it so you don’t have to fetch it all every time.
The two timeline lines give me an “parsing error: unexpected character #” .
I looked at how the huge #timeline section was much earlier in the code, and tried to copy it.
// Draw vertical graph tics (# of Reviews). grid += '<path class="horizontal '+tic_class+'" d="M'+graph.margin.left+','+y+'h'+graph.x_axis.width+'" />'; '#timeline svg .grid path.major.horizontal,'+ '#timeline svg .grid path.minor.horizontal,'+ ''; {fill:none;stroke:black; opacity:0} var tic_class, y; graph.y_axis.max_reviews = Math.max(3, Math.ceil(max_reviews / inc_s) * inc_s);
I added the apostrophes and plus signs on either side of the #timeline lines… and the ‘’; at the end of those two lines…
And I made most of the timeline disappear. O.o
… Fully loaded. Collapsing the timeline hides it further.
I do have the yellow exclamation mark saying that both “none” and “black” are undefined/redundant.
\_( O.o ; )_/
And if I just wanted to input WKOF in it?
I had an extra comma in there.
It does the same thing (and without my added ‘apostrophes’, the script doesn’t load at all).
wkof.include('ItemData');
wkof.ready('ItemData')
.then(fetch_items)
.then(process_items);
function fetch_items() {
return wkof.get_items('assignments,review_statistics');
}
function process_items(items)
{
var reading_correct = 0, reading_incorrect = 0;
var meaning_correct = 0, meaning_incorrect = 0;
for (var idx = 0; idx < items.length; idx++) {
var item = items[idx];
var stats = item.review_statistics;
if (!stats) continue;
var itype = item.object;
if (itype !== 'radical') {
reading_correct += item.review_statistics.reading_correct;
reading_incorrect += item.review_statistics.reading_incorrect;
}
meaning_correct += item.review_statistics.meaning_correct;
meaning_incorrect += item.review_statistics.meaning_incorrect;
}
var total_correct = reading_correct + meaning_correct;
var total_incorrect = reading_incorrect + meaning_incorrect;
var average = 100 * total_correct / (total_correct + total_incorrect);
}
1 Like
Thank youuuu!
(I had grabbed the example for grabbing accuracy from the v2 API site itself, as it was the example which gave me the idea in the first place. XD)
Literally, this:
((meaning_correct + reading_correct) / (meaning_correct + reading_correct + meaning_incorrect + reading_incorrect)) * 100 })();
1 Like
Typing on tablet… ugh.
This time, I eliminated the apostrophe that shouldn’t have been there.
Oh, I agree… typing on a tablet is horrendous. All the more, thank you.
*copies this to try*
EDIT: nope, that doesn’t do it either. If I add back in the apostrophes and such, it loads without most of the timeline (as per the most recent screenshot above), without, the script fails to load at all.
Still gives me errors either way (red stopping error, “parsing error: unexpected character #”, or the “black/none undefined” with the yellow caution).
We can forget it for tonight. Don’t stress. *shrugs*
THE SEMICOLON!
… That’s probably it. Makes sense.
One last try. : D
EDIT: Nope, I’ve tried that already without even realizing. That was already in there from the last two attempts. So yeah.
Since you’re adding a line to the CSS section, which is one big string wrapped across multiple lines, you need to wrap it in:
‘<inserted_stuff>’+
e.g.:
‘#timeline svg … opacity:0.2;}’+
1 Like
Oh, the whole thing, not just the first two elements of it.
I was doing ‘#timeline blah’+
‘#timeline svg’+
other thing opacity;}
That gives the next line another parsing error: “unexpected token var” .
Maybe I insert it in the wrong place?
// Draw vertical graph tics (# of Reviews). grid += '<path class="horizontal '+tic_class+'" d="M'+graph.margin.left+','+y+'h'+graph.x_axis.width+'" />'; '#timeline svg .grid path.major.horizontal, #timeline svg .grid path.minor.horizontal {fill:none;stroke:black; opacity:0.2;}'+ var tic_class, y; graph.y_axis.max_reviews = Math.max(3, Math.ceil(max_reviews / inc_s) * inc_s);
In the forums, wrap your code in:
```javascript
insert code here
```
So it preserves formatting, and colorizes the code according to Javascript rules.
(The ` marks are back-ticks, by the way. Same key as ~ )
edit: oh my… now that I can see what you were doing as formatted code:
// Draw vertical graph tics (# of Reviews).
grid += '<path class="horizontal '+tic_class+'" d="M'+graph.margin.left+','+y+'h'+graph.x_axis.width+'" />';
'#timeline svg .grid path.major.horizontal, #timeline svg .grid path.minor.horizontal {fill:none;stroke:black; opacity:0.2;}'+
var tic_class, y;
graph.y_axis.max_reviews = Math.max(3, Math.ceil(max_reviews / inc_s) * inc_s); `
The CSS line should go along with all the other CSS stuff toward the top of the script.
Like this:
And then the part below:
I did “display:none;” for the horizontal lines, so I get this:
