تماشای این درس نیاز به اشتراک حرفه‌ای دارد.

Adding HTML Rendering Test0:00

Okay, so the final thing I want to do for this initial draft is provide an option to convert what you see here into some kind of formatted HTML, even if it's just a string of anchor tags. So this would be wrapped in an anchor tag that links to a particular timestamp. Who knows, that might be useful. So let's give it a shot. We'll add a new test, and how about it renders the lines as HTML, or really just a series of anchor tags. Okay, load a transcription, and we're going to grab lines, or why don't we add another one, like HTML lines.

Maybe it's just rendered as paragraphs. I don't know. I may remove this, but at least for an exercise for a tutorial, it's okay. Maybe this would link to the current time, and then we would grab this right here. So it would be something like that. And then the next one would be right here. Yes, something along those lines. So let's run our assertion, assertEquals the expected from the result, and let's just inline that. Okay, let's give it a run.

Implementing htmlLines Method1:58

inline that. Okay, let's give it a run. Of course it fails, because there is no method html lines. All right, so down here, method html lines. Let's run the test again. And of course, null is being returned, but we are now expecting this HTML here. So we could start by returning the lines, but really we need to map over them, shouldn't we? So array_map over each of the lines. So remember, that would be a line object here.

So array_map over each of the lines. So remember, that would be a line object here. For each of the lines, we're going to return HTML here. Now, I'm going to start by putting it here, but then later we're going to move it to where it's more appropriate. So yeah, we could do something like this, lineBody, and let's see, this lines. All right, let's have a look. array does not match expected type string, that's because we need to implode it. So implode, and give it another shot. And it fails.

So implode, and give it another shot. And it fails. So here's what we expected on the left, and on the right, we do have our anchor tags, but notice how we want the separator to be a new line. Let's fix that. And run it again. All right, getting a little bit closer. Now we just have to add on the time here. So notice here how transcription is sort of like a micromanager. Oh, just let me do it.

So notice here how transcription is sort of like a micromanager. Oh, just let me do it. You can't do it right, I will take care of it. We don't want that. We want line to be responsible for things like this. So I'm going to bring our test to green, and then we're going to refactor to put this logic on the line object. But first, yeah, we want the time to be equal to, and let's see, line timestamp. That's not quite right, though. So if we give this a run, notice we're getting that full thing.

Parsing Timestamp with Regex4:04

That's not quite right, though. So if we give this a run, notice we're getting that full thing. So really, we just want the initial portion. So here's what I usually do. When I need to work with regular expressions, I will copy the related text, and then I will open this in regexr.com. Okay, so now I can quickly prepare this. We're using PCRE, and what we want to grab, like I said, is this portion here. So we're going to look for two digits, then a colon, then two more digits, and a colon. And then two more digits, and then a period.

We don't have time to talk about regular expressions, but nonetheless, it is an important tool in your belt. So with that, now, beginning time, and I'm going to use preg_match. And we'll paste this in, and we're working with the $timestamp. So again, notice how much of a micromanager we're being here. $matches. And yeah, notice now, if I var_dump our $matches, and we give this a run, here's the $matches. So the first item has everything, and the second item includes what we had in parentheses. So that's what I want. $matches[1].

There we go. That's what I like to see. So let's run everything. Ah, it failed. Which one is wrong? It discards irrelevant lines. Oh yeah, yeah, of course, because this is still the old test where we expected four lines, but now we have two lines of Line objects. So that can be adjusted. Okay, so now we run the full suite, and we're at green.

Refactoring to Line Method7:31

This is getting kind of messy. And again, we have transcription being a micromanager when it should instead delegate to line. It would be nice if I could just say right here, return line. And what if it was as simple as, like, toHTML or toAnchorTag? That's perfectly fine. We're telling line, get me the representation of you if you were an anchor tag. And of course, right now, it's going to fail, because there is no toAnchorTag method. And actually, real quick, let's get rid of any of our dumps we have. All right, run it again. There we go.

All right, run it again. There we go. Okay. So now we have a new method here: toAnchorTag. We run it. And of course, it fails, because we're not returning anything there. Okay. So I should be able to take this, switch over to line, paste it in, reformat, and then we're going to grab this timestamp and this body.

So I should be able to take this, switch over to line, paste it in, reformat, and then we're going to grab this timestamp and this body. Give it a run. Aha! It works. So now I can move in responsibilities around. I can even do a little bit more here. Let's see if I can use string interpolation. Yeah, and that still passes. I could even move this, if I wanted to, to, like, beginning timestamp.

And actually, why don't we put this below? Okay. So let's go back to transcription. This can now even be a little simpler. I'm going to bring it back to an arrow function. And let's see. We map over all of the lines. And for each one, we convert the line to an anchor tag, and then we implode them. And let's see. Can I get away with inlining this?

Manual Usage in Playground9:51

Not too bad. Pretty decent. Okay. So why don't we play around with this now? And what I'll do is require. We're going to delete all of this. But just to test it out. If you're using this package, you would have some kind of VTT file. And let's see. Where is that?

And let's see. Where is that? That would be go up a level in a test. Of course, in your project, it would be in a public directory or something like that. And let's just call it path. Then you would say transcription_load($path). And if we begin by var_dumpping that, let's give it a run. php source playground. And if I expand this, here's what we get. You get a Transcription object that contains the lines.

And if I expand this, here's what we get. You get a transcription object that contains the lines. Now, you could convert it to a string. And if you give that a run, there you go. We might even want to separate those. I thought we already did this. Maybe not. Yeah. And we have our file. Next, we could instead grab the lines.

And we have our file. Next, we could instead grab the lines. And now we have an array of line objects, which is more likely what you would want. And you could then use that. You might have something like this in your php. You say foreach $lines as $line. Then we're going to render them. For now, I'm just going to do var_dump($line) and give me the body. Or even $line timestamp. Then a colon.

TDD a New FeatureRegular Expressions

دوست دارید گاهی خبرهای Laracasts را ایمیل کنیم؟