[WIP/Public beta] Apocalypse theme

Antechinus · January 11, 2015, 11:03:49 PM

Quote from: busterone on January 11, 2015, 09:41:03 PM
Ok, I have had a really weird occurrence, but I think I have a temp fix for it.
After applying the patch, I started getting a new error in the log for group_id being undefined. I tried adding a string into ThemeStrings.english.php to see if the error would go away- $txt['group_id'] = 'Group ID';
The errors still persisted. I took a wild chance and added the same to the default theme's Modifications.english.php and the errors stopped. go figure.

I have no idea what is going on there. Will wait and see if anyone else gets the same thing.

busterone · January 11, 2015, 11:11:09 PM

I spoke too soon.

On the test site, that worked for a few minutes (it seemed), Now the undefined index error is back.

Code Select

  http://www.testsite.busterone.net/index.php?topic=1.0   
8: Undefined index: group_id
File: /homepages/xx/xx/htdocs/busterone/testsite/Themes/Apocalypse_TK1/Display.template.php
Line: 247

I am baffled too, but it isn't important right now anyway, the jQuery conflict is. A few undefined errors can wait.

Antechinus · January 11, 2015, 11:28:43 PM

If worst comes to worst it's only a few pretty group names in a few places, so I can just remove it from the templates entirely. That'll fix it.

Antechinus · January 12, 2015, 12:13:52 AM

So here's a different trick. Chalky reckons that Firefox has terrible slow and jaggy scrolling with this theme, and that Chrome was fine. When I test it on my box, Firefox is fine on local or at her site, but Chrome is crap.

Dunno if she got them mixed up due to lack of coffee but I have a plan.

This stuff is usually due to elements that use fixed positioning. Obvious thing is to change fixed elements to absolute for jaggy browsers, which for this theme only requires a few bytes of CSS. That's not worth an extra file and extra http call, so I did this:

Code Select

<html xmlns="http://www.w3.org/1999/xhtml"', $context['right_to_left'] ? ' dir="rtl"' : '', ' id="html', $context['theme_variant'], '">
<head>

And this:

Code Select

/* @SCROLLING */
/* Scrolling variant, with absolute instead of fixed positioning for a */
/* few elements. This should fix any jaggy scrolling on some browsers. */
#html_scrolling #toplink, #html_scrolling #botlink,
#html_scrolling #upshrink, #html_scrolling #upper_section {
	position: absolute;
}
#html_scrolling #top_section {
	position: static;
}
@media screen and (max-width: 32em) /* Equates to 480 */
{
	#scrolling .main_menu_toggle {
		position: absolute;
	}
}

There ya go. Instant theme variant, all in one CSS file, with no images folder of its own, that changes layout instead of colours. Default variant is called "Fixed" at the moment. Second variant is called "Scrolling". If anyone has scrolling problems, select scrolling variant. Easy. Works.

Antechinus · January 12, 2015, 01:24:56 AM

Right, want me to fix that effing Who.template.php error, do you? Ok, it's fixed. Runs without errors now. There ya go.

Oh yeah, also splits the online list into a nice line of groovy blocks for members, just like the memberlist and buddies list (calls the same CSS of course) and a separate table below for guests.

Fixed.

DasVON · January 12, 2015, 02:18:39 AM

Awesome Theme ...

Release Date ??

Antechinus · January 12, 2015, 02:28:25 AM

Well Busterone and Chalky and Bryan have already been playing with the beta, and you're welcome to as well if you like. It might be better to leave it a couple of days before taking it live though, when it'll be nearer to RC. I've fixed some things and thrown in some more useful features. The existing beta is quite safe to run as a plaything though.

Chalky · January 12, 2015, 03:42:51 PM

Ok I'm here! Home from work, fed myself and cleaned the piggies. Looks like I have some catching up to do!

Quote from: Antechinus on January 11, 2015, 06:00:20 PM
w00t! Got the bastard! That who mod is calling jQuery too. Here's the page source for the in-topic pages. I've snipped most if it. The relevant line is 488 if you grab it from your own browser.

Code Select Expand
<script type="text/javascript"> var jquery_url = "//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"; var atwho_url = "http://chalkcat.com/Themes/default/scripts/jquery.atwho.js"; var smf_sessid = "787d868b008335e583bb754a37a2cef8"; var smf_sessvar = "e7f851d41bbe"; </script> <script type="text/javascript" src="http://chalkcat.com/Themes/default/scripts/mentions.js"></script> <link rel="stylesheet" type="text/css" href="http://chalkcat.com/Themes/default/css/mentions.css" /><script type="text/javascript" src="http://chalkcat.com/Themes/default/scripts/postbitmenu.js"></script><div id="postbitmenu_71217" class="postbitmenu"><div class="catbg">Michael</div><div class="pbm_item windowbg"><a href="http://chalkcat.com/index.php?action=profile;u=25" rel="nofollow">View Michael's profile</a></div><div class="pbm_item windowbg"><a href="http://chalkcat.com/index.php?action=pm;sa=send;u=25" rel="nofollow">Send a personal message to Michael</a></div><div class="pbm_item windowbg"><a href="http://chalkcat.com/index.php?action=emailuser;sa=email;msg=71217" rel="nofollow">Send an email to Michael</a></div><div class="pbm_item windowbg"><a href="http://chalkcat.com/index.php?action=profile;area=showposts;u=25" rel="nofollow">View Michael's posts</a></div><div class="pbm_item windowbg"><a href="http://chalkcat.com/index.php?action=buddy;u=25;e7f851d41bbe=787d868b008335e583bb754a37a2cef8">Add Michael to Buddy List</a></div></div> </div> </div> <div id="footer_section"> <a href="#skipnav_top" id="toplink" title="Top"><span>Top</span>↑</a> <ul class="smf_footer_links wrapper"> <li class="copyright"> <span class="smalltext" style="display: inline; visibility: visible; font-family: Verdana, Arial, sans-serif;"><a href="http://chalkcat.com/index.php?action=credits" title="Simple Machines Forum" target="_blank" class="new_win">SMF 2.0.9</a> | <a href="http://www.simplemachines.org/about/smf/license.php" title="License" target="_blank" class="new_win">SMF © 2014</a>, <a href="http://www.simplemachines.org" title="Simple Machines" target="_blank" class="new_win">Simple Machines</a><br /><a href="http://www.createaforum.com" target="_blank">Simple Audio Video Embedder</a> </span></li> <li><a id="button_xhtml" href="http://validator.w3.org/check?uri=referer" target="_blank" class="new_win" title="Valid XHTML 1.0!">XHTML</a></li> <li><a id="button_wap2" href="http://chalkcat.com/index.php?wap2">WAP2</a></li> <li class="theme_author"><a href="http://custom.simplemachines.org/themes/index.php?action=profile;u=129726" target="_blank" class="new_win">Apocalypse theme</a></li> </ul> </div> <script type="text/javascript"><![CDATA[ // Create the news lines toggle. var smfNewsFadeToggle = new smc_Toggle({ bToggleEnabled: true, bCurrentlyCollapsed: false, aSwappableContainers: [ 'newslines_container' ], aSwapImages: [ { sId: 'newsupshrink', srcExpanded: smf_images_url + '/collapse.png', altExpanded: 'Hide news', srcCollapsed: smf_images_url + '/expand.png', altCollapsed: 'Show news' } ], oThemeOptions: { bUseThemeSettings: true, sOptionName: 'collapse_newslines', sSessionVar: 'e7f851d41bbe', sSessionId: '787d868b008335e583bb754a37a2cef8' }, oCookieOptions: { bUseCookie: false, sCookieName: 'newsupshrink' } }); var oMainHeaderToggle = new smc_Toggle({ bToggleEnabled: true, bCurrentlyCollapsed: true, aSwappableContainers: [ 'inner_section', ], aSwapImages: [ { sId: 'upshrink', srcExpanded: smf_images_url + '/upshrink.png', altExpanded: 'Shrink or expand the header.', srcCollapsed: smf_images_url + '/upshrink2.png', altCollapsed: 'Shrink or expand the header.' } ], oThemeOptions: { bUseThemeSettings: true, sOptionName: 'collapse_header', sSessionVar: 'e7f851d41bbe', sSessionId: '787d868b008335e583bb754a37a2cef8' }, oCookieOptions: { bUseCookie: false, sCookieName: 'upshrink' } }); var oFooterContentToggle = new smc_Toggle({ bToggleEnabled: true, bCurrentlyCollapsed: false, aSwappableContainers: [ 'footer_content', ], aSwapImages: [ { sId: 'footerupshrink', srcExpanded: smf_images_url + '/upshrink.png', altExpanded: 'Hide footer', srcCollapsed: smf_images_url + '/upshrink2.png', altCollapsed: 'Show footer' } ], oThemeOptions: { bUseThemeSettings: true, sOptionName: 'collapse_footer', sSessionVar: 'e7f851d41bbe', sSessionId: '787d868b008335e583bb754a37a2cef8' }, oCookieOptions: { bUseCookie: false, sCookieName: 'footerupshrink' } }); // Begin jQuery section. $.fn.ready(function() { // Smooth scroll to top. $("a[href=#skipnav_top]").on("click", function(e) { e.preventDefault(); $("html,body").animate({scrollTop:0}, 1000); }); // Smooth scroll to bottom. $("a[href=#bot]").on("click", function(e) { e.preventDefault(); $("html,body").animate({scrollTop:$(document).height()}, 1000); }); $('#main_menu_hide').hide(); $("#main_menu_show").on("click", function(e) { e.preventDefault(); $('div.menu_closed').addClass('menu_open'); $('#main_menu_show').hide(); $('#main_menu_hide').show(); }); $("#main_menu_hide").on("click", function(e) { e.preventDefault(); $('div.menu_open').removeClass('menu_open'); $('#main_menu_hide').hide(); $('#main_menu_show').show(); }); }); // ]]></script> <a id="bot"></a> </body></html>

W00t!!! Which file is that?

Quote from: Antechinus on January 11, 2015, 06:32:15 PM
Ok, thinking about this a bit. You have two mods that want to call jQuery, and you want to run those site-wide of course. It'd also be good if this theme could be open slather since the more feedback the better.

So, best option for your site looks to be editing index.template.php so this theme doesn't call jQ at all, and the jQ stuff this theme wants to run is called after one of the mods has pulled the library in. This should work.

The trick is going to be figuring out which mod tries to call what on which pages, and where in what templates, so all bases are covered. Once that's figured out it should be easy to have this theme running nicely with your mods.

My gut is telling me that the best option is likely to be disabling the who mod's call for jQ 1.11 down the bottom of the template, and editing the Fancybox mod to call jQ 1.11 up in head. This should cover everyone, providing Fancybox is happy with jQ 1.11 instead of its original jQ 1.8. If it's working now, then it's obviously fine, so this plan is gonna work.

We can tee up a time when we both have brains and time, then I can throw edited files at you if you like.

I'll be here for another couple of hours now if you want to start chucking things at me or after about 4.30pm GMT tomorrow, Thursday or Friday.

My members are now playing with it but most of them aren't used to change so for now they're mostly missing the mods that I haven't installed on it yet

Antechinus · January 12, 2015, 03:46:13 PM

ROFL @ members. Ok, cool. I'm awake now. Just been browsing a bit before brain was up to making coffee. Will grab coffee and start with the files. Already got them edited.

Chalky · January 12, 2015, 04:04:14 PM

Excellent!!

A couple of things have come up already. Two of my members report slow and jumpy scrolling on Chrome v. 39.0.2171.95 m, I do now also but not as slow and jumpy as on my Firefox.

"Quote" button goes to quick reply rather than full reply and I can't find a setting to change that.

In the "member options" area, turning off Quick Reply does not hide Quick Reply - it's still there.

Chalky · January 12, 2015, 04:14:30 PM

Just so we don't forget I've had to undo this edit because my Fancybox had stopped working (I was only checking the mobile menu at the time, not Fancybox

)

Quote from: Antechinus on January 10, 2015, 06:23:31 PM
Ok, I grabbed a copy of the Fancybox mod and that's calling jQ 1.8.1 from a local source. This is going to cause problems with any jQ stuff when running Apocalypse.

1.8.1 is out of date now anyway, and with any luck Fancybox should work just fine with later versions of jQ. Suggestion is to open Subs-FancyBox.php and comment out the call for jQ there, on Line 31.

Note that you have to do a slight syntax change as well as the basic // by moving the ' after = to Line 32.

Code (Find) Select Expand
$context['insert_after_template'] .= ' <script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.min.js"></script> <script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.mousewheel-3.0.6.pack.js"></script>

Code (Replace) Select Expand
$context['insert_after_template'] .= //<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.min.js"></script> '<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.mousewheel-3.0.6.pack.js"></script>

ETA: Oh and once you've done that, you should be able to uncomment the Superclick menu on Line 122 and it should work.

Antechinus · January 12, 2015, 04:51:06 PM

Ok this is getting towards the stage where a TK2 is in order.

The theme on local now has an admin switch for turning the theme's call for jQuery on and off, which would save you commenting it out. Would also be a good way to test stuff. Other good thing about it is if Google CDN is ever blocked for any reason, you'll be able to switch the theme straight to one of the other options so everything will keep working.

So I'll give you another copy of index.template.php and Settings.template.php to get that running. The new setting is just a dropdown/select near the top of the theme settings.

The mod files I've edited are Sources/core/Subs-FancyBox.php and Sources/Mentions.php. These are the only two that want to call jQuery, AFAICT. The first one is called first, up in the "// Output any remaining HTML headers. (from mods, maybe?)" thingy that doesn't tell you what it's actually doing. Second one is called at the bottom of the template via hooks.

What I think is that if the call for jQ in the first one is updated to call the latest version, and the call for jQ in the second one is removed, and the theme's call for jQ is switched off, then there should only be one functioning call to the library, which should suffice to run everything without conflicts. So, that's how I've edited the Sources files.

Code (/core/Subs-FancyBox.php) Select

	$context['insert_after_template'] .= '
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
	<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.mousewheel-3.0.6.pack.js"></script>
	<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.fancybox.pack.js"></script>
	<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/helpers/jquery.fancybox-buttons.js"></script>';

Code (Mentions.php) Select

	$context['insert_after_template'] .= '
		<script type="text/javascript">
			var atwho_url = "' . $settings['default_theme_url'] . '/scripts/jquery.atwho.js";
			var smf_sessid = "' . $context['session_id'] . '";
			var smf_sessvar = "' . $context['session_var'] . '";
		</script>
		<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/mentions.js"></script>
		<link rel="stylesheet" type="text/css" href="' . (file_exists($settings['theme_dir'] . '/css/mentions.css') ? $settings['theme_url'] : $settings['default_theme_url']) . '/css/mentions.css" />';

This should be a good solution because it will work site-wide on any of your themes. If I just stopped the mods calling jQ it'd work on Apocalypse, but not on the other themes that don't call jQ by default.

There have been other changes as well. I've added a second variant which people can select to fix the jaggy scrolling on some browsers. It just changes the fixed elements to absolute so they scroll with the page. That can be selected in profile. Can make a more nifty changer later. The variants required images folders, but the contents are the same as the images of the same name in the main images folder, so if there are any corruption on extraction issues just overwrite the variant images again.

Also fixed the z-index issue with the drop menu content sitting over the top bar, and a few other things. With your ecl notice, it was sitting behind the top bar of this theme. I checked out the source for it and it doesn't seem to have a z-index specified, AFAICT. I've kept all this theme's z-index stuff under 88, so if you throw 99 at your ecl CSS it should be front and centre.

Had an idea about pagination.css too. Since it's being forced anyway, I suggest you use that file to hold any small personal tweaks you want, like the change in admin group colour on Display.template.php that I noticed. If you keep them in pagination.css they'll be easy to find and edit, will override the earlier declarations in index.css, and they won't get overwritten by theme updates.

~~Anyway files attached. Feel free to look through them and ask questions.~~ Redundant attachments removed.

Antechinus · January 12, 2015, 05:02:07 PM

Quote from: Chalky on January 12, 2015, 04:14:30 PM
Just so we don't forget I've had to undo this edit because my Fancybox had stopped working (I was only checking the mobile menu at the time, not Fancybox )

Quote from: Antechinus on January 10, 2015, 06:23:31 PM
Ok, I grabbed a copy of the Fancybox mod and that's calling jQ 1.8.1 from a local source. This is going to cause problems with any jQ stuff when running Apocalypse.

1.8.1 is out of date now anyway, and with any luck Fancybox should work just fine with later versions of jQ. Suggestion is to open Subs-FancyBox.php and comment out the call for jQ there, on Line 31.

Note that you have to do a slight syntax change as well as the basic // by moving the ' after = to Line 32.

Code (Find) Select Expand
$context['insert_after_template'] .= ' <script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.min.js"></script> <script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.mousewheel-3.0.6.pack.js"></script>

Code (Replace) Select Expand
$context['insert_after_template'] .= //<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.min.js"></script> '<script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/fancybox/jquery.mousewheel-3.0.6.pack.js"></script>

ETA: Oh and once you've done that, you should be able to uncomment the Superclick menu on Line 122 and it should work.

Bugger. Just looked online and FancyBox won't run with up to date jQuery.

What's more making it work by using jQuery's no conflict mode to load two versions would require a rewrite of the mod anyway, due to the necessary loading order.

If a rewrite of the mod is going to be required any effing way, it'd make more sense to load up FancyBox 2, which will run with up to date jQ.

Antechinus · January 12, 2015, 05:25:05 PM

Ok, for the moment, since I'm trying to debug a theme rather than debug out of date mods, it'll have to be no FancyBox on this theme. IMO the menu working is more important than FancyBox working. This theme will expand attached images on the page anyway, without opening a pop-up window. They'll just fit in however much horizontal space is available, scaled to fit.

Antechinus · January 12, 2015, 05:42:32 PM

****** I hate hooks. Give me template edits any day of the week. At least you can control the bastards rather than having crap forced everywhere.

busterone · January 12, 2015, 05:59:45 PM

I don't use FancyBox on my site. I don't have any jQuery mods either, but I used the zip for chalky minus the subs stuff.
I believe you nailed the scrolling issue. I haven't had any scroll issues myself running Win 8.1 64 bit, with IE or FF. I am experimenting with 64 bit Waterfox since Mozilla has been dragging their feet for a 64bit FF. It has shown no lag for me either. I suspect some of that is the broadband speed into my house as well.
Some of my users had reported earlier today and last night that they noticed an occasional scroll lag and some text input lag while typing in a post. I just used the new templates and will await some response. So far, only one of the earlier ones to report it says that they see no lag now, so I await some more input, but it looks good so far.

Antechinus · January 12, 2015, 06:06:04 PM

Ok, thanks to Arantor I now know how to disable FancyPox on this theme only, without borking it anywhere else. Will sort a new file for it.

(I really do not want to have to write a whole Fancybox 2 integration in the next ten minutes

)

Chalky · January 12, 2015, 06:09:14 PM

Quote from: Antechinus on January 12, 2015, 06:06:04 PM
Ok, thanks to Arantor I now know how to disable FancyPox on this theme only, without borking it anywhere else. Will sort a new file for it.

(I really do not want to have to write a whole Fancybox 2 integration in the next ten minutes )

Ah bless you!! Thank you

Antechinus · January 12, 2015, 06:26:40 PM

Oh bugger, forgot the other one would need conditionals for this too.

With this one and the previous one loaded, all other themes should be running the way they were originally. Apocalypse should have Fancybox disabled, but Mentions working, and no jQ conflicts if the theme settings to call jQ is enabled.

Redundant attachments removed.

Antechinus · January 12, 2015, 06:28:46 PM

Bugger. Typo in Line 88 due to dodgey mouse. Here.

Redundant attachments removed.

News:

[WIP/Public beta] Apocalypse theme