Page MenuHomePhabricator

Setup basic application structure for Grant Metrics
Closed, ResolvedPublic5 Estimated Story Points

Description

Setup basic application structure for Grant Metrics. This includes -

  1. The directory structure
  2. The database
  3. Home page
    1. i18n will be done as part of making this
    2. Note there's a footer which will go into its own template.
    3. Note: No OAuth yet - that will come later after we're done with the bulk of the app since it adds an extra step for the testing phase. Clicking on OAuth leads to a "My Programs" page, which can be just a placeholder for this task.
  4. Readme for setting up the app locally
  5. Set up continuous integration/testing framework

Event Timeline

kaldari set the point value for this task to 5.
kaldari triaged this task as Medium priority.Oct 17 2017, 11:29 PM
MusikAnimal moved this task from Ready to In Development on the Community-Tech-Sprint board.
MusikAnimal subscribed.

I'm going to go ahead and get started on this, leaving out database-related things until T175767 is resolved.

I think I've got this pretty much done. I'm excited to show you what it looks like!

I've been trying to get the app to run on Toolforge, but it's one issue after another. Toolforge unfortunately runs on PHP 5.5.9, which puts our dependencies way out of date (including security vulnerabilities). I have 5.6 on my local so I've been guessing my way through making it work, and it's taking forever :/ I'm truly OK with Toolforge apart from this hassle. I can get a VPS instance up and running quickly, we just have to request it, and obviously all be in agreeance. If you really don't want to do VPS, just say so, and I'll try to figure out how to get a Docker container running with PHP 5.5.9 on my local. It's kind of upsetting we are forced to use an almost 4-year old version of PHP!

@MusikAnimal: You can run PHP 5.6 on ToolForge using Kubernetes. All you have to do is restart the webservice with a flag: https://wikitech.wikimedia.org/wiki/Help:Toolforge/Web#PHP.

The logo and icons are from FontAwesome. The cheatsheet is here. We should do a custom logo but that can come later. I had an idea for a custom logo that would look something like this...

Grant metrics icon?.png (568×550 px, 56 KB)

But it's totally up for debate and discussion and iterations and total changes. This just occurred to me when I put that FA icon in there.

I'm still working on making this work without the trailing slash, but here ya go! https://tools.wmflabs.org/grantmetrics/

On each page load you're shown a random featured Picture-Of-The-Day from Commons, just for fun :) I stole the idea from Earwig's copyvios tool. This I figure would only go here -- the homepage, before they login. It might get people excited about using the tool. It makes me want to use it, at least!

The font I randomly picked from https://fonts.google.com/. Feel free to find a better one, just make sure it has some sort of open license.

For everything else in this ticket:

Another thing -- the messages at the bottom don't match up with the mock. This is because there were similar messages in other repos that are already translated, so I just imported those. If we want to change the wording that's fine.

I'm still working on making this work without the trailing slash, but here ya go! https://tools.wmflabs.org/grantmetrics/

On each page load you're shown a random featured Picture-Of-The-Day from Commons, just for fun :) I stole the idea from Earwig's copyvios tool. This I figure would only go here -- the homepage, before they login. It might get people excited about using the tool. It makes me want to use it, at least!

The font I randomly picked from https://fonts.google.com/. Feel free to find a better one, just make sure it has some sort of open license.

For everything else in this ticket:

That's great! I set it up locally too without many hassles. I just got one error -

[Symfony\Component\Console\Exception\CommandNotFoundException]  
Command "doctrine:migrate" is not defined.

but I skipped that command because I figured we don't have any migrations right now and it seems to run flawlessly.

I'm not a fan of the background image. It takes about a couple of seconds to load the image, even on my decent internet speed. And it makes the UI look cluttered as opposed to the minimalistic look I'm going for. We could keep it depending on what @DannyH and @kaldari think of it.

Did you miss a "build" step in the README? I tried modifying some CSS but it doesn't show up in the browser.

Apart from that, I think this ticket is ready to be closed. Good work!

That's great! I set it up locally too without many hassles. I just got one error -

[Symfony\Component\Console\Exception\CommandNotFoundException]  
Command "doctrine:migrate" is not defined.

but I skipped that command because I figured we don't have any migrations right now and it seems to run flawlessly.

I updated the README, try php bin/console doctrine:migratations:migrate. There are some migrations but there's no interaction with the database yet, so yes everything should load without running them.

I'm not a fan of the background image. It takes about a couple of seconds to load the image, even on my decent internet speed. And it makes the UI look cluttered as opposed to the minimalistic look I'm going for. We could keep it depending on what @DannyH and @kaldari think of it.

Aww man, that was what I was so excited to show you! Again I was only proposing it here for the "splash" page, since there's not a whole lot going on here. Maybe you just don't like that image. Hit refresh, it randomizes! If we do one photo per day like https://tools.wmflabs.org/copyvios it should download faster because the server and your browser will cache it.

Did you miss a "build" step in the README? I tried modifying some CSS but it doesn't show up in the browser.

I thought in the dev environment it updated automatically, maybe not. Try php bin/console assetic:dump, and if you find you have to keep doing that, you can continually watch for changes with php bin/console assetic:watch

That's great! I set it up locally too without many hassles. I just got one error -

[Symfony\Component\Console\Exception\CommandNotFoundException]  
Command "doctrine:migrate" is not defined.

but I skipped that command because I figured we don't have any migrations right now and it seems to run flawlessly.

I updated the README, try php bin/console doctrine:migratations:migrate. There are some migrations but there's no interaction with the database yet, so yes everything should load without running them.

You sure that is spelled right? Shouldn't it be 'migrations' instead of 'migratations'?

I'm not a fan of the background image. It takes about a couple of seconds to load the image, even on my decent internet speed. And it makes the UI look cluttered as opposed to the minimalistic look I'm going for. We could keep it depending on what @DannyH and @kaldari think of it.

Aww man, that was what I was so excited to show you! Again I was only proposing it here for the "splash" page, since there's not a whole lot going on here. Maybe you just don't like that image. Hit refresh, it randomizes! If we do one photo per day like https://tools.wmflabs.org/copyvios it should download faster because the server and your browser will cache it.

I tried it a bunch of times. It just feels like old design. I'm a bigger of fan of minimalism and simplistic UIs. :)

Did you miss a "build" step in the README? I tried modifying some CSS but it doesn't show up in the browser.

I thought in the dev environment it updated automatically, maybe not. Try php bin/console assetic:dump, and if you find you have to keep doing that, you can continually watch for changes with php bin/console assetic:watch

Neither of those help. I wanted to change the font on the main page. Here's what I did -

  1. Downloaded the ttf file to the Resources/fonts.
  2. Swapped out all the references to OpenSans with the new font in Resources/assets/css/application.scss

I know there's a preprocessing step involved for Sass files but I'm not sure if I need to do that myself or it'll be handled for me? So far it doesn't seem like that happens. I've tried restarting the server a few times and it's not showing me my changes yet.

I updated the README, try php bin/console doctrine:migratations:migrate. There are some migrations but there's no interaction with the database yet, so yes everything should load without running them.

You sure that is spelled right? Shouldn't it be 'migrations' instead of 'migratations'?

Whoops, you are correct!

I'm not a fan of the background image. It takes about a couple of seconds to load the image, even on my decent internet speed. And it makes the UI look cluttered as opposed to the minimalistic look I'm going for. We could keep it depending on what @DannyH and @kaldari think of it.

Aww man, that was what I was so excited to show you! Again I was only proposing it here for the "splash" page, since there's not a whole lot going on here. Maybe you just don't like that image. Hit refresh, it randomizes! If we do one photo per day like https://tools.wmflabs.org/copyvios it should download faster because the server and your browser will cache it.

I tried it a bunch of times. It just feels like old design. I'm a bigger of fan of minimalism and simplistic UIs. :)

Bummer. I was sure you were going to love it! So there's no room for eye candy on the splash page? Otherwise we just have text and a button, and all that blank real estate.

I was also going to say we're unnecessarily fetching the image at full resolution, which we definitely shouldn't do. I can make it cap at your screen size.

Neither of those help. I wanted to change the font on the main page. Here's what I did -

  1. Downloaded the ttf file to the Resources/fonts.
  2. Swapped out all the references to OpenSans with the new font in Resources/assets/css/application.scss

I know there's a preprocessing step involved for Sass files but I'm not sure if I need to do that myself or it'll be handled for me? So far it doesn't seem like that happens. I've tried restarting the server a few times and it's not showing me my changes yet.

Bah, I see. So for fonts and vendor assets, you'll also need to update the assetic/assets block in config.yml. This is so that Symfony can preprocess them as needed, including versioning so we don't serve older, cached versions.

I'm not a fan of the background image. It takes about a couple of seconds to load the image, even on my decent internet speed. And it makes the UI look cluttered as opposed to the minimalistic look I'm going for. We could keep it depending on what @DannyH and @kaldari think of it.

Aww man, that was what I was so excited to show you! Again I was only proposing it here for the "splash" page, since there's not a whole lot going on here. Maybe you just don't like that image. Hit refresh, it randomizes! If we do one photo per day like https://tools.wmflabs.org/copyvios it should download faster because the server and your browser will cache it.

I tried it a bunch of times. It just feels like old design. I'm a bigger of fan of minimalism and simplistic UIs. :)

Bummer. I was sure you were going to love it! So there's no room for eye candy on the splash page? Otherwise we just have text and a button, and all that blank real estate.

Well, have you seen Google's home page? ;) Let's wait for Ryan and Danny's opinion of it though.

I was also going to say we're unnecessarily fetching the image at full resolution, which we definitely shouldn't do. I can make it cap at your screen size.

Neither of those help. I wanted to change the font on the main page. Here's what I did -

  1. Downloaded the ttf file to the Resources/fonts.
  2. Swapped out all the references to OpenSans with the new font in Resources/assets/css/application.scss

I know there's a preprocessing step involved for Sass files but I'm not sure if I need to do that myself or it'll be handled for me? So far it doesn't seem like that happens. I've tried restarting the server a few times and it's not showing me my changes yet.

Bah, I see. So for fonts and vendor assets, you'll also need to update the assetic/assets block in config.yml. This is so that Symfony can preprocess them as needed, including versioning so we don't serve older, cached versions.

That still didn't work. There still seems to be a missing build step. I edited the config.yml but it didn't pick up my changes. Even after a server restart. (Also, adding all this in README would be so helpful).

This isn't really a great time to figure out special look-and-feel features. We're making a basic v1 that we can show to users for feedback and testing. Discussing image resolution is taking time away from building the actual thing. :)

That still didn't work. There still seems to be a missing build step. I edited the config.yml but it didn't pick up my changes. Even after a server restart. (Also, adding all this in README would be so helpful).

Are you getting an error? Typically after changing the config you would run php bin/console c:c (where c:c is short for cache:clear), but again the dev environment should do this automatically. You could try doing that and then dumping the assets with php bin/console assetic:dump. Also check the network log in your browser, and make sure the font is being downloaded. If it's getting a 404, there might be a typo in the config (like I did here). I will definitely add more to the README.

The config way of setting fonts admittedly isn't that great, just a means to keep the assets all in one place. If you want to quickly try different fonts, try adding <link href="https://fonts.googleapis.com/css?family=Foo+bar" rel="stylesheet"> to base.html.twig, then in application.scss add font-family: 'Foo bar', sans-serif; to the body.

This isn't really a great time to figure out special look-and-feel features. We're making a basic v1 that we can show to users for feedback and testing. Discussing image resolution is taking time away from building the actual thing. :)

Totally, I tend to get carried away with these things! I intentionally didn't spend much time on the random background image thing, so it's no loss if it gets ditched.

I was talking to Ryan about the statistics aspect, in particular calculating the retention. That will be the most challenging, I think. I'm wondering if it makes sense to work on that first, and build the web app around it? That way we can prioritize the core functionality, and force the little frontend guy inside of me to calm down =P Regardless of our approach, the whole backend workflow will need to be duplicated in our test suite (with mocked/fake data). If we can get all of that to pass, the remaining interface part should be fun and games.

That still didn't work. There still seems to be a missing build step. I edited the config.yml but it didn't pick up my changes. Even after a server restart. (Also, adding all this in README would be so helpful).

Are you getting an error? Typically after changing the config you would run php bin/console c:c (where c:c is short for cache:clear), but again the dev environment should do this automatically. You could try doing that and then dumping the assets with php bin/console assetic:dump. Also check the network log in your browser, and make sure the font is being downloaded. If it's getting a 404, there might be a typo in the config (like I did here). I will definitely add more to the README.
The config way of setting fonts admittedly isn't that great, just a means to keep the assets all in one place. If you want to quickly try different fonts, try adding <link href="https://fonts.googleapis.com/css?family=Foo+bar" rel="stylesheet"> to base.html.twig, then in application.scss add font-family: 'Foo bar', sans-serif; to the body.

Hmm, I didn't get any error. Not sure what's going on. I'll try messing with it later today and let you know.

This isn't really a great time to figure out special look-and-feel features. We're making a basic v1 that we can show to users for feedback and testing. Discussing image resolution is taking time away from building the actual thing. :)

Totally, I tend to get carried away with these things! I intentionally didn't spend much time on the random background image thing, so it's no loss if it gets ditched.

I was talking to Ryan about the statistics aspect, in particular calculating the retention. That will be the most challenging, I think. I'm wondering if it makes sense to work on that first, and build the web app around it? That way we can prioritize the core functionality, and force the little frontend guy inside of me to calm down =P Regardless of our approach, the whole backend workflow will need to be duplicated in our test suite (with mocked/fake data). If we can get all of that to pass, the remaining interface part should be fun and games.

What about the retention seems challenging? I didn't think it was more than a complex DB query. From the specs page -

Number of new editors retained. For the this metric, "retention" is defined as those who make at least one edit, in any Wikimedia project (in any namespace), between 7 days after the event and the time that the report is run.

Basically checking if there was any edit from the user's account in that time frame.

Another thing -

... the definition of "retention" is likely to change in the medium-term -- it takes 5 edits instead of 1, or 30 days instead of 14. Any definition that involves a number should not be hard-coded.

So we need these as config variables.