A gathering place for Vindictus players of any region or server to get together and discuss the game.


    March 2019

    Shippuu
    Shippuu
    Forum Coder
    Server :
    • NA East

    IGN : Shippuu
    Posts : 258
    Joined : 2015-12-17

    March 2019 Empty March 2019

    Post by Shippuu on Sat Mar 02, 2019 12:21 pm

    March 2


    Sorry, I've only just realized a permissions issue where guests/members could not view Dev Log images. This was not intended, but weirdly nobody reported it to me. It has been fixed.
    Shippuu
    Shippuu
    Forum Coder
    Server :
    • NA East

    IGN : Shippuu
    Posts : 258
    Joined : 2015-12-17

    March 2019 Empty Re: March 2019

    Post by Shippuu on Fri Mar 08, 2019 3:25 pm

    March 8


    To my dumbfounded surprise, I could not find anything online about anyone that has tried to tackle these font/element scaling issues before. I found "professional guidelines" on how to handle "responsive font scaling", but the only accurate descriptors I can think for those guidelines are that they are horseshit or short-sighted. I will get into why I feel this way, but first I should explain why the font size is such a big deal in the first place. Today's log, and likely the next few, may get rather technical, as fair warning.

    As previously mentioned in a February log, my current v4 CSS is defined in the unit of pixels. Pixels are the best unit for absolutely controlling the size of objects, but they do not scale at all. This causes issues with odd aspect ratios or very dense screens, such as a 4k monitor. The unit I have chosen to move to is called an "em". Rather than being a pixel, it is actually based on the size of a capital M. The implications of this are significant; it means that I can define sizes based on how big the font is.

    You might think that's pretty useless, but consider this: the element around the text is scaled by the size of the text. This means that problems like words wrapping to extra lines and etc issues simply don't happen, they will always be in exactly the same places at any size. Additionally, when the font size of the page is increased to adapt to a different screen size, everything else will automatically scale accordingly. So everything comes down to scaling the size of the text to match the screen size, and the rest falls into place from there.

    Now we loop back to the challenge of determining how to scale the font size by screen size. The professionals say to use a unit called vw to scale font size, as a multiplier of sorts. Every 1 vw unit is 1% of the width of the viewport (to simplify, the visible page). If every monitor in the world was a 16:9 monitor, this would be completely fine. But what if a page designed this way encountered an ultrawide monitor? These have an aspect ratio of 21:9, and you will end up with text scaled for a 1440p monitor, even though you are on a 1080p monitor. It is inherently flawed.

    I've had to improvise my own solution to this, and it is unfortunately still rather half-baked. It looks good on 1080p and up, but I don't know whether to make text bigger or smaller at lower resolutions. They have fewer pixels to show content, but are physically smaller. The problem from 1080p and up, however, is at least simple enough. Rather than rely on the width of the monitor, due to the previously mentioned flaw, I have decided to scale by the height of the monitor.

    My implementation uses JavaScript instead of CSS, so it is conceptually flawed from the beginning. However, it allows me to use the actual screen size rather than the size of the browser to calculate font sizes. This has two benefits. Firstly, it eliminates having to deal with the height lost from the header of the browser itself, which results in a 1011 pixel tall page on my 1080p monitor. Secondly, it allows the page to be resized within a monitor without causing funky inappropriate rescaling.

    With these changes, let's go back to the example from the end of February, of the 1080p monitor and the 4k monitor, both having the same physical size. The 1080p monitor will use a 14px font size and scale everything based on this, to look exactly as it did before. The 4k monitor will recalculate the font size to 28px, and everything on the page will scale based on that size. As a result, the screen will look exactly the same on both monitors.

    Unfortunately, I've only completed this conversion for the page frame itself, though it allowed me to fix some long-lasting issues with the page height being incorrect. The actual content of the Armory is still all in pixels.

    I've been made aware literally while writing this Dev Log that high resolution displays tend to automatically upscale content based on their pixel density, which took some of the urgency out of this conversion. I do, however, feel it still needs to be done. Having more control of the sizing of the site is not a bad thing.

    Even in the worst case scenario that I find out this didn't have to be done at all, it will still cover a standing suggestion made to me before about making the site more usable for people with vision issues. Scaling everything by font size means that when I add a font size setting to theme options, that will allow users to make the Armory larger or smaller based on their preferences.
    Shippuu
    Shippuu
    Forum Coder
    Server :
    • NA East

    IGN : Shippuu
    Posts : 258
    Joined : 2015-12-17

    March 2019 Empty Re: March 2019

    Post by Shippuu on Sun Mar 17, 2019 4:28 am

    March 17


    It's been 9 days since the last log, and I debated whether to wait till I had something to share, or to just make one today. I figured it would be good to dispel any misconceptions on any work ethic I might be assumed to have. I haven't done anything on the Armory in the last 9 days. Ingame stuff stole my focus, as did the internet.

    I am in the midst of converting the window system now, but I've got nothing to share since I'm only just starting it. Except that my cool idea of using image sprites to make the Armory load faster is proving to be a temporary headache for scaling.
    Shippuu
    Shippuu
    Forum Coder
    Server :
    • NA East

    IGN : Shippuu
    Posts : 258
    Joined : 2015-12-17

    March 2019 Empty Re: March 2019

    Post by Shippuu on Mon Mar 18, 2019 10:34 am

    March 18


    My procrastination has paid off, apparently. I tested several of the ideas I've had over the last week, and pretty much all of them have worked. In conjunction with the image sprites issue being resolved, I am now suddenly much further along than I expected to be.

    The site background and header, the window system, and the Gear tab now all rescale seamlessly. The implementation is dramatically different than what my last Dev Log detailed, but also dramatically simpler.

    I have thrown out the entire function that measured screen size and aspect ratio to calculate the font sizes, everything except the actual part that sets a final font size. Instead, the user will be given full control over the rescaling multiplier, either via an input box or a slider (undecided for now). It will be placed in the main Settings window, which does not yet exist to show. You will be able to input values between 0.5 and 3.0, effectively allowing you to use the Armory at any size between 50% of normal, and 300% of normal.

    I still have several tabs to go through and convert piece by piece before I can call this phase done, but it has also forced my hand on some decisions I have been putting off committing to. The current build actually has a somewhat functional Titles tab and Skills tab. The problem is that these were the first two modules to be created in v4, and they were from before I developed the tricks I now use in the other modules. As a result, their code is comparatively sloppy, and is still quite complex to work with.

    Once I finish converting the CSS for the modules I am happy with (the Gear tab, Item List tab, Overview tab, and Gear Parameters Prompt), I will begin refactoring the code behind the Skills tab and the Titles tab, and probably overhaul their CSS too. If I do decide to redo the CSS, I will definitely take "Before" screenshots of each. It would be a neat comparison between early v4 designs vs the current.
    Shippuu
    Shippuu
    Forum Coder
    Server :
    • NA East

    IGN : Shippuu
    Posts : 258
    Joined : 2015-12-17

    March 2019 Empty Re: March 2019

    Post by Shippuu on Fri Mar 22, 2019 2:21 pm

    March 22


    At this point, the only active modules that need unit conversion are the Gear Parameters Prompt, the Item List tab, and the login menu. I have decided that I do intend to remake the Titles module and refactor the Skills module. Additionally, I need to refactor my code for handling scrollable tables and content panels. Pretty much anything that is even slightly inconveniencing me is up on the chopping block, to save myself the most time in the long run.

    The Titles module is a mess in almost every way. I like the visual look for selecting title regions, but everything else is even visually a mess. The code is even worse still. The design of the Skills module is 100% fine, but it is using the same old code style as the Titles module, so it needs the same corrective work.

    The problem I have with my tables and panels is more nitpicky. Individually, they work completely fine; they just happen to be completely separate classes. All tables are panels, but they are completely unique classes, sharing no code or functions. It is wasteful, and means when I change something, I have to change it in two locations.

    I've started drafting out a very long, very thorough guide thread about damage calculation in 2019. This isn't eating into actual Armory coding time yet, but it is for the short-term a higher priority. I really feel like a collection of modern information is needed, with how many years old most of the current sources are.
    Shippuu
    Shippuu
    Forum Coder
    Server :
    • NA East

    IGN : Shippuu
    Posts : 258
    Joined : 2015-12-17

    March 2019 Empty Re: March 2019

    Post by Shippuu on Fri Mar 29, 2019 6:52 pm

    March 29


    I am on track to finish this rescaling by the end of the month, even with my slacking and some serious distraction while I tried to round up another Dragon Soul set ingame. The Item List module has been adapted over, and the item tooltip CSS is very nearly fully converted.

    I have a few loose ends in places to clean up, but none of these will take any serious amount of time at all. My first task for April will be to almost completely scrap and redo the Titles module. I have been asking in Discord in places about opinions for how to organize titles, and I believe I have my basic game plan mostly figured out for this.

    Despite my initial assumption, categorizing titles by location will be the default behavior, but there will also be an option to categorize by title type. In addition, I will be adding a few more categorization types too, for people looking to quickly pick up stats or title count. In my manually built title data, I will be recording a rating for their difficulty and estimated time required. What this means is that you will be able to do things like view only "Fast" titles that give stats, or some other combination of conditions.

    Handling title data is definitely going to be the biggest logistical and design challenge of the v4 Armory, so if this takes all of April, I don't think I will feel bad about it. The final number of titles to have to work with is probably around 1500 nowadays. Numbers that high are difficult to sift through even as a user, let alone as the server having to process each of. Shared titles only make it all the nuttier.

    Instead of overwriting the old Titles module, I am going to create a second Titles module, and develop it entirely separately. This way, I can take literal side by side images of the 2018 and 2019 versions. That should allow me to show actual images in April, instead of just doing only blocks of text.
    Sponsored content

    March 2019 Empty Re: March 2019

    Post by Sponsored content


      Current date/time is Sat Apr 20, 2019 5:41 am