Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Pokerealm Beta Template
02-23-2014, 05:51 AM (This post was last modified: 02-23-2014 08:55 PM by Yuuka Kazami.)
Post: #1
Pokerealm Beta Template
Hi, so I'm totally working on a completely new Pokerealm layout. My goal is to have it not suck Variant by the end of the summer, and be viable for usage (read: take over the main site layout) by the end of the year.

You can find the current beta template here: http://variant.pokerealm.com/beta/

What you see is actually pretty close to the final layout I have planned, because of the fact that this has been a work in progress for two years. As I've noted above, I'm expecting to spend another year working on it, because I'm pretty much just picking at the layout at this point.

The thing about this layout is that it's designed for articles and mobile devices, as opposed to the table-and-images-everywhere layout the current one has. Also, it doesn't use nearly as much Javascript, partially because CKC keeps complaining about it, and partially because Javascript really should only be used for interactive elements. I'm taking that to its logical conclusion so I probably will only use Javascript if I absolutely have to; most things will be PHP or just straight-up CSS. (The mobile devices thing doesn't actually work yet. I'll try my best to make the media queries work in the future.)

Due to the nature of HTML5 and CSS3, some browsers may not support it, like Internet Explorer 10 and lower. That's perfectly fine, since honestly, if you're still stuck on Windows XP, you should consider switching to Linux Mint or something. At the very least, download the newest Firefox and/or Google Chrome. On that vein, if you're using an iPod Touch or iPhone or iPad that doesn't run iOS 7, or an old device (like my Zune HD) that has terrible website rendering in general, consider getting an Android device or the Firefox OS. Seriously, you pretty much need the latest browsers. When it's out of beta, I'll consider the browser ecosystem and I may or may not build fallbacks to support the older browsers.

And then Cirrus and Markiss will completely ruin the code and I'll have a hell of a time trying to fix everything after beta. Woo!

Current things I have to work on are main page text, news text, and making it so that none of the pages default to a 404. Which, considering I technically have to remake all of the Pokemon threads just for the beta, is going to suck majorly. If anyone wants to help me make Pokemon pages when I get the template figured out, that would be glorious.

Questions, comments, suggestions, concerns all go in this thread, kthx.

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Add Thank You Quote this message in a reply
02-26-2014, 01:16 AM
Post: #2
RE: Pokerealm Beta Template
Very nice work, Variant! I like how the nav bar works and the HTML code looks pretty clean. The only thing I would suggest is you consider making it mobile-friendly. I was planning to do this for PR but got really busy and making the site mobile will take a bit of work. The fast and dirty way to do it is to use CSS media queries which are easy to learn about. We still have the old beta one you made with the main site at http://pokerealm.com/beta/. I like the external .txt file that holds all the news in it and hope something like that will be in the new one. A function that automatically shows in the news what pages were added would be very nice too, although that can just be done manually - I have had to do it before and it required some messy and hard-to-update code.
Visit this user's website Find all posts by this user
Quote this message in a reply
02-26-2014, 01:32 AM
Post: #3
RE: Pokerealm Beta Template
Well -- the mobile template works flawlessly in Chrome (and, by extension, the default browser) on my phone (in portrait, not in landscape yet). Firefox and Opera Mini have minor errors but I'll get to fixing them in the coming week. Ultimately the problem lies in the fact that I have a Galaxy Note II, with that gigantic screen -- anyone using any other phone, please take screenshots and send them to me! I'm interested in seeing how the website renders on other devices and I don't particularly trust those websites that offer the service. The biggest problem I can think of that I've tested right now is that the chat button wraps below. And yes I'm using media queries -- check the globals.css file in the styles folder! (They're crap and probably not the optimal way to do it but whatever.)

I'm going to be double-posting a lot in this thread. I'd planned on using the thread as a changelog anyway.

I had actually planned on making a quick and dirty "admin console" of sorts, that changed the data on most of the pages on the site without needing FTP access, but I'm not 100% certain I can pull it off. I don't have much confidence in my PHP skills since I haven't touched PHP since the time I made that beta. I can confirm that the news and tiers will be automated, though I'm not entirely sure how yet -- I'm leaning towards textfiles as that makes it easier to maintain on my part (I don't have a dedicated MySQL database and SQLite is weird to maintain).

I just drank an entire 2L bottle of Mountain Dew and am writing this in class so if I forgot anything I'll get to it later when I'm not so jittery weeeeeeeeeee

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Quote this message in a reply
02-28-2014, 09:54 PM (This post was last modified: 02-28-2014 09:57 PM by Yuuka Kazami.)
Post: #4
RE: Pokerealm Beta Template
It's been almost a week since the first post so I figured I'd do a changelog every week just to keep things working smoothly.

I'm considering turning the main page into the news page, so the news button links to the index page, but I'm not sure if that would be too redundant in regards to site layout. I'm also fairly certain that I'm going to make external links open in new tabs (but only external links).

Cirrus or Markiss: is a file-uploading script legal on the terms of service of the webhost? I was planning on adding an admin-only file-uploading service on the Files section. Not 100% sure how I'd implement it but that was in my plan.

I've also been thinking about ways to create the Tiers and Pokemon pages. I'm also pretty convinced that we'd need all six generations for NFE but at the same time Gen 1 NFE kind of sucks a lot. (And everyone knows Gen 2 and 3 are the worst Pokemon generations ever.) That being said, when I make the tiers, Pokemon with only the one NFE in their evolution line will be in the middle tier and Pokemon with two NFEs in their evolution line will be in high and low tiers (with the obvious exceptions of the starter bugs). I'm not good at tiering purposes so we can fix that when the site is more complete.

Should I make the Pokemon pages similar to the current implementation, the old beta implementation, or should I try to make something entirely different?

Finally, I have absolutely no idea how I would implement a search function. I'm considering placing it in the header bar, but then I don't know how I could show it on a mobile site.

Code:
This week's Changelog:
- posted this thread, managed to get the navbar to actually work
- implemented a media query for smartphones; work started on landscape orientation
- fixed a slight mobile error where the page background wouldn't load on scroll

yeah, I didn't really do much this week

Things to work on:
- admin console of sorts
- news editing (via databases? flatfiles? leaning towards YAML)
- tiers (use tables, you nincompoop!) and the actual Pokemon pages
- file uploader?
- chat -- links to xat? or even an irc client? if we can make a webscript for Pokemon Online chat via web, that would be lovely


I will try to edit these above ideas whenever I get home. Questions, comments, suggestions, considerations, concerns, go in this thread.

Also, I don't like the current standard tier names, and copying other people is boring and dumb and stupid, so I'm going to be using my old beta names.
  • Overpowered
  • High Tier
  • Borderline
  • Middle Tier
  • Basic Tier
  • Low Tier
  • Bottom Tier (I might change this to Junk Tier or something that doesn't start with B)
dealwithit.jpg

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Quote this message in a reply
04-14-2014, 07:17 PM (This post was last modified: 04-15-2014 10:58 PM by Yuuka Kazami.)
Post: #5
RE: Pokerealm Beta Template
>post every week
>last post was about six weeks ago

welp

I honestly haven't worked on this for six weeks. My FTP access is being really slow so that doesn't help matters. So, let's see what I did yesterday.

Code:
This week's Changelog
- tiers page implemented (and like 1% complete) - junk tier confirmed
- mobile site layout 90% complete - the general layout's confirmed but I need to fix up the rest of the beta to match
- minor fixes in the most random of places
- removed footer

Things to do
- get the tiers to work the way I want them to (because they reeeally aren't) preferably without using JavaScript
- pretty much everything I mentioned in the previous post
- get a working footer :v
- set up an RSS feed for the news section, since apparently I'm making a really bad pseudo-blogging platform for it
- fix up the CSS for the news page to make it pretty
- new end goal: make the entire site mobile, web app capable, and available for offline browsing (which will be a lot of work)

edit: I'm feeling ambitious. If you guys have any features you want me to add, let me know! Post in the thread or something. I'll try my best to work on it.

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Quote this message in a reply
04-17-2014, 11:24 PM
Post: #6
RE: Pokerealm Beta Template
keep this up variant! i like the one youve made so far and a new layout for the site would be very helpful. I tried looking at a few pages from my 3DS and it was much harder to read than on a computer :/

"Y'know...Someday we adults are gonna have to hand this world off to this little scamp and the rest of his generation. But what kinda world are we adults gonna make? What kinda world do we wanna pass to these kids? If we haven't even figured that out ourselves, we're never gonna get anywhere. So are we gonna make a world where everyone can coexist together? Or, after all, is it gonna be a world that we claim by force? One that we fight and scrabble over..." -Team Aqua Archie

Click if you give a damn.
Find all posts by this user
Quote this message in a reply
04-26-2014, 01:59 AM (This post was last modified: 04-26-2014 02:10 AM by Yuuka Kazami.)
Post: #7
RE: Pokerealm Beta Template
I meant to reply to this sooner, but I didn't, sorry. I'm not really focusing on the 3DS browser, as it is entirely Variant, but I am focusing on the Wii U browser in terms of support. One of the goals is to make it fast enough and readable enough for most devices, so I'm trying not to use very much JavaScript and instead relying on server-side processing.

On an entirely related note, I'm probably going to have to end up changing most of the layout; I'm considering (instead of having that massive Pokerealm text) using the Pokerealm logo I made that I keep forgetting exists. What I want to do is have a theming thing that relies on either cookies or localstorage but I'm also trying to turn the whole thing into a web-app-capable NFE Pokedex that looks nice on phones.

On the note of phones, the iPhone renders this poorly. Yet another thing I have to fix.


A big goal I want to do is have an aesthetically-appealing and mobile-friendly damage calculator but I don't remember any of the PHP code in the old damage calculator, and I don't have any of it stored as an old backup. So Cirrus, you have to work on that with me some time.

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Quote this message in a reply
07-25-2014, 08:34 AM
Post: #8
RE: Pokerealm Beta Template
I got the tiers done, but I'm fairly certain that the way I did it is easily the most inefficient way and has the potential to overload the server, so please for the love of all that is holy don't refresh more than once. I'm hoping that I can make it better in the future.

http://variant.pokerealm.com/beta/tiers/g6/

I mostly focused on getting everything in the right place, and threw some placeholder Pokemon in random spots. This is in no way the final tier listing, although I'm probably going to keep the names. For the record, every Pokemon that has two evolutions to go to be Fully Evolved is in either MT or LT, and every Pokemon that has one evolution to go to be Fully Evolved is in HT, with the minor exceptions of Combusken (OP), Wooper (UU), the bug Pokemon (LT), and Magikarp, Feebas, and Petilil (OP). There are probably some others I missed.

I took it directly from the official Pokerealm Gen VI tier list, so if there's any wrong Pokemon let me know. I've already had to fix countless errors (Inkay's ability, adding Gible, Nuzleaf and Seedot having "Wicked Theif" [sic] instead of Pickpocket, etc.)

Also, if you didn't notice, the bar at the top is...kind of different. Mobile browsers can now have the drop-down menu work nearly perfectly (if you're on a smartphone; if you're on a flip phone, get a better phone), although the chat drop-down menu is borked a bit. Also, there's no link to the home page because I'm trying to get an SVG image into the right corner and having that linkable. It's not working out so well.

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Quote this message in a reply
07-26-2014, 08:41 PM
Post: #9
RE: Pokerealm Beta Template
I like the idea of putting them all on one page. the name "chat" for the tab is a little misleading I think. maybe change it to Social? or community?

Im also hoping we can add a banner to the top or something in the background at the top. It looks great otherwise!

"Y'know...Someday we adults are gonna have to hand this world off to this little scamp and the rest of his generation. But what kinda world are we adults gonna make? What kinda world do we wanna pass to these kids? If we haven't even figured that out ourselves, we're never gonna get anywhere. So are we gonna make a world where everyone can coexist together? Or, after all, is it gonna be a world that we claim by force? One that we fight and scrabble over..." -Team Aqua Archie

Click if you give a damn.
Find all posts by this user
Quote this message in a reply
07-27-2014, 10:17 AM (This post was last modified: 07-27-2014 10:22 AM by Yuuka Kazami.)
Post: #10
RE: Pokerealm Beta Template
(07-26-2014 08:41 PM)Markiss Wrote:  I like the idea of putting them all on one page. the name "chat" for the tab is a little misleading I think. maybe change it to Social? or community?

Unfortunately, that's non-negotiable, for one simple reason.

I can't really fit anything else. Blush

The way I coded the navigation bar is probably the worst possible way, but it works nearly flawlessly, so I'm not really complaining.

I don't know what you mean by 'putting them all on one page'. Could you clarify?

(Incidentally, if anyone's colorblind: on mouse rollover, 'news' is blue, 'tiers' are green, 'files' is purple, 'chat' is red. Could someone with red-green colorblindness verify that the tiers and chat tabs look different on rollover? Or, really, any kind of colorblindness.)

(07-26-2014 08:41 PM)Markiss Wrote:  Im also hoping we can add a banner to the top or something in the background at the top. It looks great otherwise!

The banner isn't a priority, I'm afraid, since my ultimate goal is to make the website use as little Javascript and images as possible. In the end, though, when it's getting closer to complete, I'll try to make it so that a banner can be implemented in the gray area, although the hardest part is having it scale auto-magically depending on the browser's aspect ratio.

The reason why there isn't one, right now, is that it's kind of tricky to implement into a browser without Javascript. I'm not generally averse to using it, but I just don't see a need to use Javascript for content-related things. Also, things like the 3DS browser probably can't handle too much Javascript (admittedly, the 3DS browser can't really handle anything, but eh) and rather than determine what the proper amount of Javascript would be to make the site work without having it lag, I just decided to not use any.

[Image: Th135Yuuka.gif]
(かざ)()(ゆう)()
I am indeed one who dabbles in flowers.
Is there anything I can help you with?
The hunched shoulders of a man defeated in battle... This is man's true pathos. This truly is dandyism. - Viscount Orloff, Pokémon X and Y
Formerly known as: VMU, 7, Variant
Visit this user's website Find all posts by this user
Quote this message in a reply
Post Reply 


Forum Jump:


User(s) browsing this thread: 1 Guest(s)