Jump to content
Sign in to follow this  
Chewett

Add X of Y creatures to HTML5 page

Recommended Posts

Ann. 3397 - [2015-03-30 03:06:36 - Stage 12] - Permalink - Posted By Chewett
Your current number of creatures, and maximum recruitable are now visible on the HTML5 creature page. This has not been backported to the Flash one since we are moving towards only using the HTML5 one.

Share this post


Link to post
Share on other sites

I'm not certain why your's is showing up with nice spacing below that text, but in Opera Classic, there is no room between the bottom of the text and the top of the creature icons. Adding 20px to the base of the absolute positioning used by the elements should provide the correct spacing.

 

I've attached screenshots of what it looks like currently, what it looks like with 20px spacing (ignore the first column, I was seeing what it looked like with 40px spacing), and a highlighted version showing exactly where the top of the element is with 20px spacing.

Share this post


Link to post
Share on other sites
I am using google chrome, latest.

As I said >>This is a known issue but will be fixed in the future when I have finalised work on HTML5 interface.

Its not being fixed now is because im going to have to adjust how it works out the "length" of the page a couple times, and I dont want to waste time doing it each and every single time I modify it all.

Share this post


Link to post
Share on other sites

Well, how about we change it so that it doesn't do absolute positioning then?

 

Some jQuery code to achieve the desired effect:

// Now, on to the main changes.
// First we replace all of the absolute positioned pieces with relative positioned versions.
// The creature holders are inline-block so that they flow appropriately.
$('div[id^="div_allcreatures_holder_"]').attr('style', 'display: inline-block; height: 128px; vertical-align: top;');
$('#div_allbckpids_holder').attr('style', 'text-align: center');

// There is an outermost div that is aligning the content to center by default,
// we need it to align left for things to look right.
$('body > table > tbody > tr > td > div[align="center"]').attr('align', 'left');

// We could just put a div around all the creature holders and set a left margin on that,
// but it's a pain to do via jQuery, so we do it this way instead.
$('div[id^="div_allcreatures_holder_"]').each(function(i, elem)
{
	if (i % 4 == 0)
		elem.style.marginLeft = "8px";
});

// Now we get to remove the padding lines that are added by the current code to
// account for the size of the normal content.
$('body > p:has(> br)').remove();

// Add a blank line after the creature capacity info.
$('#div_allcreatures_holder_1').before('<br />');

And, if you are running that code to test what it looks like, you'll also have to recalculate the size of the pagecontent frame:

// And, lastly, we re-calculate the pagecontent size, because we've changed it.
// This doesn't need to be done in the actual changes.
var pagecontent_ifrm = parent.document.getElementById('pagecontent');
pagecontent_ifrm.style.height = 800; //reset
pagecontent_ifrm.style.height = document.body.scrollHeight; //orig

Share this post


Link to post
Share on other sites

Simply put, we are probably not going to use absolute positioning.

 

The code just needs some cleaning, its a throwback from the old old old days. Its never been properly changed and made nice with new stuff.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Forum Statistics

    15,832
    Total Topics
    173,490
    Total Posts
  • Recently Browsing

    No registered users viewing this page.

  • Upcoming Events

    No upcoming events found
  • Recent Event Reviews

×
×
  • Create New...