Replies

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

A month and a half is what I had been planning on when I went on hiatus, but it ended up being a year or 4, lol. But like it's always been, Subeta is also very addicting to be on.

omg, if it ends up being iFrames (completely unlikely) I'll feel completely silly. But I don't think it is.

On a different note, what do you do IRL?

Dec 30, 2017 8 years ago
Cinnamon_524
is actually pumpkin spice
User Avatar
Vaughnn

Subeta's going to end up getting half my paychecks before I learn any self restraint, heh. But the community is the best part, and that's completely free!

That's what the iFramanati WANT you to believe.

And I'm putting my degree to good use as a professional dog bather, haha. I was so burnt out after college I decided I needed a hands on job as a break. I love it so much that I might go to grooming academy in the next year. How about you? Are you still a student, or are you starting to get established?

Dec 30, 2017 8 years ago
February30th
User Avatar
Zamaradi Moyo

The most outstanding is during summer, I refuse to turn on the A/C in my house or car. I don't like the quasi thermal shock going in or coming out. Unless I have to be inside, I stay outside.

Eventually I learned to tolerate that they react differently, they feel heat when I feel cold. Etc...

Old, and obsolete.

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

I know the feeling, I haven't even been back a full month yet and I've already spent way too much money xD lol, no, I haven't been student for 5 years. I've been working as a graphic designer / front-end web developer for the past 4 years! It's been great fun so far and I've learned a ton of new things!

I see... It seems a bit strange to me, but as long as you can live with it, it's ok no?

Dec 30, 2017 8 years ago
February30th
User Avatar
Zamaradi Moyo

Its oddly cool in my house, even in 40+C. And currently the high is the summer low. I don't have much to complain about.

Old, and obsolete.

Dec 30, 2017 8 years ago
Bug
User Avatar
Segfault

It's iFrames, yeah. Source: I am the leader of the iFramanati.

JUST KIDDING.

SPOILER (click to toggle) It's PHP! I had a random idea one day like a week ago, thinking about how Subeta lets you import stylesheets. I'd host the CSS on my personal server (bug.bz) and then import them. So I was thinking, well, could my server dynamically generate that CSS?

This is the magic color-changing file: https://bug.bz/subeta/css/_mine/profile/cute_phs.css?

🐝 ☕ bug (he/him) | your friendly neighborhood code wrangler. stay in the loop! join and check out the latest admin post highlights

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

I already saw that file, but I don't get how you got it to generate new values. Do you feed it an array or something? I don't know anything about PHP, but how do you get your css file to work with PHP? I thought that it needed to be a .php to be able to use PHP, or am I wrong? Sorry for all the questions, but sometimes I feel like a newb. Please teach me sepai!

Dec 30, 2017 8 years ago
Bug
User Avatar
Segfault

Haha we all are newbs when it comes to some things, and that's okay! I was actually just going to ask you for some front-end help in fact. As you may have noticed I'm more of a back-end/systems person. We have a good opportunity to learn from one another.

SPOILER (click to toggle) It's essentially a PHP file with a .css extension. If you opened this file on my server, it looks like a typical PHP file. But it contains logic which generates the random CSS - very simple logic, just picking random color schemes from an array, and choosing a random image from a subdirectory to display. Importantly, it sends a content-type header of text/css so everyone will know to interpret this output as CSS and not HTML.

To make it work with a .css extension, I added a rule to Apache (the web server) telling it to use the PHP engine for this file. (Actually I used a regex so that it will apply to a specific subset of my CSS files.) I also had to add some configuration so that it doesn't cache this file on the server side, since CSS output is usually cached by the server.

At this point it's mostly done, but there were still two layers of caching to disable since my server exists behind Cloudflare (that's why it's HTTPS). But luckily Cloudflare makes it very easy to disable caching. I disabled the Cloudflare cache for this file, and configured it to send some extra info to the browser telling the browser not to cache it either. (It is up to the browser whether to obey this last command, but most browsers will.)

🐝 ☕ bug (he/him) | your friendly neighborhood code wrangler. stay in the loop! join and check out the latest admin post highlights

Dec 30, 2017 8 years ago
Treggify
is custom made
User Avatar
Weingart

I assumed had used PHP before seeing he said he did! So there's that! Smart implementation.

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

Oh, I see! I'd hoped it'd be something I could do without my own server, but alas :P It's very clever either way and thank you very much for explaining it to me ❤ And now I'm curious about what I can help you with? Feel free to message/comment/ping me at any time should you ever need my help!

Yes, it is indeed a very smart implementation! I'd love to start learning PHP, but I haven't the time between work and all my other projects >_<

Dec 30, 2017 8 years ago
Bug
User Avatar
Segfault

Well I threw together this new user profile and I was thinking about what you guys said on the other topic, about making it look nicer on mobile. I've always been a bit frightened of trying anything since the meta viewport tag isn't there, and eventually we're gonna put it there and that'll probably screw with things when we do haha. And I believe that tag is necessary because mobile devices can "lie" about their viewport, yeah? So even things like vh and vw may not be accurate (is what I speculate but I could be wrong)

I remember either you or mentioned something about using a media query that forces a 300% zoom (or something like that), could you please explain the reasoning behind that? Because if my phone is lying about how big the viewport is, then how can you case on if I'm using a phone (that's lying about the tiny screen) or just normal full-screen desktop?

I can make an example to show what I mean if this is really unclear.

🐝 ☕ bug (he/him) | your friendly neighborhood code wrangler. stay in the loop! join and check out the latest admin post highlights

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

Instead of asking for the viewport, I ask for the device-width, see the following (max-device-width: 600px) { body { zoom: 300%; } /all your mobile code/ } Since this asks the device-width, it shouldn't trigger on a desktop that simply resized the window. I picked 600px after some experimenting with different devices. It's probably not perfect and it hasn't been tested on all devices*, but it's a workaround to tide us over for until the viewport tag is here.

*it seems to work on my WileyFox Swift 2+ and on iPhone 5 up till X

Why you should not use this for production Ideally you want your layout to be responsive according to viewport, not according to device-width, so that the layout scales down when you resize your browser-window on desktop too (like when you put two windows next to each other). Responsive design should not care for the device with which the user views the website. For some reason it doesn't work like I expected (when I use 400 as a max-device-width is doesn't trigger, despite all my test-cases having a device-width of less than 400), even though the viewport tag tells the browser that the viewport width should be the device-width. Or maybe I misunderstood that, lol. I haven't had the motivation to look further into it.

Dec 30, 2017 8 years ago
Bug
User Avatar
Segfault

Ah I see, I think I was partly confused because I thought you were talking about viewport rather than device-width. My bad for not reading more carefully the first time.

That is probably the best workaround we have, but browsers are dropping support for this soon because /device-width">device-width is deprecated.

I wish we could just slap the meta tag onto Subeta's header, but... that kills everything on mobile since it was coded without it XD

🐝 ☕ bug (he/him) | your friendly neighborhood code wrangler. stay in the loop! join and check out the latest admin post highlights

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

No problem! I'm not sure if I was clear the first time around xD

Seriously? Crap, that's bad, I didn't know they were dropping support... Not a strange decision, since the viewport is more important, but yeah. I hope that the mobile browsers will support it until Subeta's more responsive =P

I get that slapping a meta tag onto the header would probably kill mobile, but don't most users use the separate mobile version if they're using a portable device? Right now the normal version of Subeta doesn't work on mobile, either way. Unless you're using iPad or a phablet, because it's such a big site. What is the biggest issue with making Subeta's design responsive?

Dec 30, 2017 8 years ago
Cinnamon_524
is actually pumpkin spice
User Avatar
Vaughnn

I take a five hour shift and Bug's all ready recruiting Hongske into the iFramanati! (I used to own one of those Warrior fansites, where's my invitation?).

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar
Dec 30, 2017 8 years ago
Cinnamon_524
is actually pumpkin spice
User Avatar
Vaughnn

for the Warrior Cats series by Erin Hunter. It was a popular thing back in the mid-2000's till about 2012-2013 to run one, and a lot of people (especially bloggers) got their start in more serious web design from doing it.

Dec 30, 2017 8 years ago
Hongske
is lost in space
User Avatar

I've never heard of that series before, but I can imagine the scenario. Though I don't have an equivalent, because my first serious web design was at my current job xD

Dec 30, 2017 8 years ago
Cinnamon_524
is actually pumpkin spice
User Avatar
Vaughnn

do you work for a company, or are you more independent? If you don't mind me asking!

Dec 30, 2017 8 years ago
Bug
User Avatar
Segfault

Nooo we hate the mobile version and we want to kill it. But we can't just kill it because people who use it then get upset since the desktop site isn't responsive yet XD And there's actually a large percentage of users who use the desktop site on mobile just cuz the mobile version is so broken on its own. (For example: me)

Quote
What is the biggest issue with making Subeta&;s design responsive?
Oh boy. I... I'm not even sure how to answer that ahaha. Can I just say "legacy code"?

One of the biggest problems for us is actually the parts of the site layout that you see on every single page: the header and sidebar. These have been around for so long that they're actually extremely hard-coded. If you inspect the elements in the header navigation, you'll see what I mean. For instance, instead of making rounded borders on these buttons with CSS, we have little graphics that make up the borders. Instead of CSS gradients/backgrounds, we have background images. Further, these depend on the site theme (the themes you can toggle in your preferences) rather than being defined in a single file.

On the JS side, the header navigation is coded with Prototype.js, which makes it impossible to remove that dependency completely from ANY page on the website that has the header. This is a problem because it gets in the way of rewriting things to Bootstrap. This is because Prototype overwrites the show and hide functions, and uses preventDefault in them, so it interferes with a lot of Bootstrap components in a way that can't be overwritten. So while we have Bootstrap now and are trying to use it, we actually cannot use it completely until Prototype is entirely removed, and we cannot do that without doing a MAJOR rewrite of the header, sidebar, bookmarks, footer - which is a pretty big and difficult project in itself.

On top of that, there is the small problem that we actually don't want to make changes that are too jarring, to be considerate to our users. Unfortunately some of this we are just not going to be able to avoid, as much as we want to make the transition as smooth as possible.

🐝 ☕ bug (he/him) | your friendly neighborhood code wrangler. stay in the loop! join and check out the latest admin post highlights

Please log in to reply to this topic.