Welcome to Geeklog, Anonymous Thursday, March 28 2024 @ 04:14 pm EDT

Geeklog Forums

GL 2.0.x theme development

Page navigation


Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
I'm liking the ability to decide which js files and libs are loaded in layout/themes/my theme/functions.php:
Text Formatted Code

/**
 * Return an array of JS libraries to be loaded
 */
function theme_js_libs_foley()
{
    return array(
    );
}

/**
 * Return an array of JS files to be loaded
 */
function theme_js_files_foley()
{
    global $_CONF;
    return array(
    );
}
 

BUT <- you knew that was coming Wink
Maybe we could return an array of arrays for header and footer ie.
Text Formatted Code

/**
 * Return an array of JS libraries to be loaded
 */
function theme_js_libs_foley()
{
    return array(
        'header' => array('jquery'),
        'footer' => array('jquerui')
    );
}

/**
 * Return an array of JS files to be loaded
 */
function theme_js_files_foley()
{
    global $_CONF;
    return array(
        'header' => array('my_theme/js/ie-fix.js', 'my_theme/js/modernizr.js'),
        'footer' => array('my_theme/js/jflickrfeed.js', 'my_theme/js/prettify.js')
    );
}
 


I know in the past I've preached all js in the footer for fast page loads, but in a dynamic content system like a blog/CMS it's almost impossible to keep out inline js. Easy to do in a static html pages, but not dynamic pages.
So now I'm always loading jquery and modernizr in the head and all others in the footer.
BUT with geeklog automatically including jquery in the footer for admin pages and the like, it overwrites the already included jquery and bombs any previously defined functionality.

Theme developers need fine control over js and css inclusion, and if geeklog needs a library like jquery for some of its functionality it needs to test for it first before overwriting a previously included version:
Text Formatted Code
<script>!window.jQuery && document.write(unescape('%3Cscript src="{site_url}/javascripts/jquery.min.js"%3E%3C/script%3E'))</script>

And theme developers need to be able to determine when and where to include their resources.

-s


FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
I think I see where you are going some what with your request and I have seen a few incidences where jquery may be needed in the head instead of the footer. Geeklog does keep track of when jquery and jquery ui is needed and plugins and themes can tell the scripts class when they wanted it to load but just not if it is in the header. For other javascript files it is up to the theme/plugin to tell it to load in the header or footer and it is left up to the theme/plugin to keep track if it has been loaded already or not. I guess if a plugins/themes share javascript libraries this will create difficulties (the same with css files).

We should probably get a detailed feature request going with your ideas including examples. We should also get Dengen involved since he works a lot more on the theme stuff than I do (and I haven't done much dynamic stuff either). Dengen developed the Deniem theme included with Geeklog 2.0.0.

In your other message you mentioned you are basing your new theme on the Geeklog's 2.0.0 professional theme. Currently only Deniem and Modern Curve themes support the new theme features. If $_CONF['supported_version_theme'] is not set to the appropriate version by the themes function.php file then an older theme version is assumed and COM_createHTMLDocument will just call COM_siteHeader and COM_siteFooter directly and return the results.

Tom
One of the Geeklog Core Developers.
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
We should probably get a detailed feature request going

done http://project.geeklog.net/tracking/view.php?id=1459

If $_CONF['supported_version_theme'] is not set

Text Formatted Code
$_CONF['supported_version_theme'] = '2.0.0';

did the trick on my other question, thanks.

-s


FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
Okay so we want the ability to specify if jquery and jquery ui is loaded in the header (currently it can only be loaded in the footer).

What rules should we follow?

- jquery and then jquery ui will always be specified first (either in the header or footer) followed by javascript files
- I guess if jquery is loaded in the header then jquery ui can be loaded in the header or footer
- If jquery is specified to be loaded in the footer by a plugin/theme and then something else specifies it in the header it will default to the header
- If jquery ui is specified to load in the header while jquery is loaded in the footer then move jquery to the header


I don't really see the need for the function theme_js_libs_foley(). The plugin/theme can tell the scripts class to load what it wants, if the class gets multiple requests for the same thing it only specifies the library once.

Also do we want/need function theme_js_files_foley() and function theme_css_files_foley() or should the theme/plugin keep track of what they loaded or not already? Also when these functions are called not all of the javascript files and css files maybe in the list yet since other plugins, blocks, etc.. could yet still add to the lists.

Are we missing anything else?

Thoughts

Tom
One of the Geeklog Core Developers.
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
I don't really see the need for the function theme_js_libs_theme_name()

I think it is still relevant, for adding entire libraries and like my example above, header=> or footer=>

I think that once jquery or any file is specified in the header, it should cancel out any call in the footer.

Basically compile a list of js for the header and one for the footer -> compare and create a unique array for header -> array diff for footer.


Also do we want/need function theme_js_files_foley() and function theme_css_files_foley()

As a theme/plugin developer we should use these as we need, if I add the css/js directly to my templates, or do I utilize the scripts class or both.

CSS is another issue - if not included in the correct order one can overwrite another.
Case would be if my theme had its own jqueryui theme and geeklog included it's default jqueryui theme after it would overwrite the theme's.

I have already been struggling w/ these issues.
In my new theme, I have emptied the site's /javascript/jquery.min.js since there is no way of stopping geeklog from including it in the footer on contribute/admin pages - so an empty file is harmless.

-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
Basically compile a list of js for the header and one for the footer -> compare and create a unique array for header -> array diff for footer.


Okay I see where you are going.

CSS is another issue - if not included in the correct order one can overwrite another.
Case would be if my theme had its own jqueryui theme and geeklog included it's default jqueryui theme after it would overwrite the theme's.


Hmm... I see the problem. Along with including function theme_css_files_foley I guess when you add a css file we should allow for the option to include a position for it.
One of the Geeklog Core Developers.
 Quote

Status: offline

dengen

Site Admin
Admin
Registered: 05/03/07
Posts: 37
Location:Japan
Quote by: suprsidr


And theme developers need to be able to determine when and where to include their resources.



I agree with suprsidr.
Therefore, I think we need to improve the scripts class.

However, I do not know why we should define the following functions.

function theme_config_foley()
function theme_css_foley()
function theme_js_libs_foley()
function theme_init_foley()

dengen
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
However, I do not know why we should define the following functions.

function theme_config_foley()
function theme_css_foley()
function theme_js_libs_foley()
function theme_init_foley()

I'm not hating having separate places in layout/foley/functions.php to organize resources and settings its actually kind of handy.
Plus the latter 3 functions give the scripts class a hook.

-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

dengen

Site Admin
Admin
Registered: 05/03/07
Posts: 37
Location:Japan
My idea is as follows.

Text Formatted Code
$_SCRIPTS->registJavaScriptLibrary(
   array(
       array(
           'library'  => 'jquery',
           'location' => 'header',
           'priority' => '1000'
       ),
       array(
           'library'  => 'jqueryui',
           'location' => 'footer',
           'priority' => '1000'
       )
   )
);


$_SCRIPTS->registJavaScriptFile(
   array(
       array(
           'file'     => '/layout/' . $_CONF['theme'] . '/js/ie-fix.js',
           'location' => 'header',
           'priority' => '100'
       ),
       array(
           'file'     => '/layout/' . $_CONF['theme'] . '/js/modernizr.js',
           'location' => 'header',
           'priority' => '100'
       ),
       array(
           'file'     => '/layout/' . $_CONF['theme'] . '/js/jflickrfeed.js',
           'location' => 'footer',
           'priority' => '100'
       ),
       array(
           'file'     => '/layout/' . $_CONF['theme'] . '/js/prettify.js',
           'location' => 'footer',
           'priority' => '100'
       )
   )
);


dengen
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
That is fine.
Same type of inclusion for css?

Also where do these calls to the $_SCRIPTS class get executed?
This is why function theme_js_libs_theme_name came about.
Themes and plugins should have the same access to the $_SCRIPTS class.

BUT the issue before was that we needed these defined before calls to siteHeader/siteFooter so if we want this to be dynamic the site needs to be built body first ie.
Body -> Header -> Footer
or does that screw up autotags?

-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

dengen

Site Admin
Admin
Registered: 05/03/07
Posts: 37
Location:Japan
Same type of inclusion for css?

Maybe it is as follows.

Text Formatted Code
$_SCRIPTS->registCssFile(
    array(
        array(
            'file'       => '/layout/' . $_CONF['theme'] . '/style.css',
            'attributes' => array('media' => 'all'),
            'priority'   => '1000'
        ),
        array(
            'file'       => '/layout/' . $_CONF['theme'] . '/print.css',
            'attributes' => array('media' => 'print'),
            'priority'   => '1'
        ),
    )
);



Also where do these calls to the $_SCRIPTS class get executed?
This is why function theme_js_libs_theme_name came about.

These methods are called in the layout/theme/functions.php.
Also we're possible to use function theme_js_libs_theme_name().

Themes and plugins should have the same access to the $_SCRIPTS class.

$_SCRIPTS is an instance of the scripts class.
And $_SCRIPTS is created in the lib-common.php.
Themes and plugins have the same access to $_SCRIPTS.

BUT the issue before was that we needed these defined before calls to siteHeader/siteFooter so if we want this to be dynamic the site needs to be built body first ie.
Body -> Header -> Footer
or does that screw up autotags?

Sorry. I could not understand your explanation.
In the plugin code, I think if you call methods of $_SCRIPTS before calling the function COM_createHTMLDocument(), there is no problem.

dengen
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
BUT the issue before was that we needed these defined before calls to siteHeader/siteFooter so if we want this to be dynamic the site needs to be built body first ie.
Body -> Header -> Footer
or does that screw up autotags?


With COM_createHTMLDocument the body is created first but the problem is autotags and blocks. Autotags can be included in template files and Blocks can be generated near the end of the process. Both Autotags and Blocks can add to the scripts class (javascript/css) if they need to.
One of the Geeklog Core Developers.
 Quote

Status: offline

dengen

Site Admin
Admin
Registered: 05/03/07
Posts: 37
Location:Japan
Quote by: Laugh

With COM_createHTMLDocument the body is created first but the problem is autotags and blocks. Autotags can be included in template files and Blocks can be generated near the end of the process. Both Autotags and Blocks can add to the scripts class (javascript/css) if they need to.


Thank you for your commentary. I understand this problem.
For Blocks, I think we can resolve by modifying the function COM_createHTMLDocument().
But for Autotags that are included in templates, I think we are hard to resolve.

dengen
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
So here I am trying to over-ride the outdated fckeditor w/ ckeditor from within my new theme.
Even though I have total control of my theme, I cannot abolish that old turd.

Can we not upgrade 2.0 w/ ckeditor? it is far easier to use and configure.

-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
I would like to see something new but I have never really looked much at the editors before.

We have discussed this about 2 years ago on the mailing list and I believe there was a licensing issue (something with the file browser), I am not sure if that is a problem now though.

I believe Ben released a plugin that allowed the integration of the CKEditor and Mystrak-kk did some work with TinyMCE (from http://mystral-kk.net/filemgmt/visit.php?lid=35)

Why don't you bring up this issue in the mailing list? I don't have time to tackle something like this now but maybe someone else will or offer a patch.

Tom

One of the Geeklog Core Developers.
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
That was not really my point.
1n 1.8.x and before, the inclusion of the fckeditor.js and the call to initialize was in the adv editor templates.
And replacing those w/ whichever editor I wanted was easy.

But now it appears the scripts class is including everything and no way of stopping it.
If I turn off adv editor in config, the adv editor templates are no longer called.

So this would likely render Ben's plugin useless.

It seems we are losing the ability to customize and control geeklog.

-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
this is how easy ckeditor is:
Text Formatted Code

<script type="text/javascript" src="{layout_url}/js/ckeditor/ckeditor.js"></script>
<script type="text/javascript">
    CKEDITOR.replace( 'introtext');
    CKEDITOR.replace( 'bodytext');
</script>
 


-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
But now it appears the scripts class is including everything and no way of stopping it.
If I turn off adv editor in config, the adv editor templates are no longer called.


Sounds like we need further modification of the scripts class then.

I am thinking of a config option accessible to the plugins and theme that disables the loading of the fckeditor javascript file. Would that work? This would disable it for the entire site.

Tom
One of the Geeklog Core Developers.
 Quote

Status: offline

Laugh

Site Admin
Admin
Registered: 09/27/05
Posts: 1468
Location:Canada
Around line 88 remove the fckeditor from the scripts class and then add to lib-common.php around line 460

Text Formatted Code

// Check to see if advanced editor is needed
if ($_CONF['advanced_editor'] && $_USER['advanced_editor']) {
    if (!isset($_CONF['fckeditor_enabled'])) {
        $_CONF['fckeditor_enabled'] = true;
    }
    if ($_CONF['fckeditor_enabled'] == true) {
        $_SCRIPTS->setJavaScriptFile('fckeditor','/fckeditor/fckeditor.js');
    }
}
 


I haven't tested it but it should work. If you like the solution I will add it to Geeklog 2.0.0

Tom
One of the Geeklog Core Developers.
 Quote

Status: offline

suprsidr

Forum User
Full Member
Registered: 12/29/04
Posts: 555
Location:Champaign, Illinois
That would partially work

There are also storyeditor_fckeditor.js, submitcomment_fckeditor.js....
and the problem here is inconsistency, some of these are called by the scripts class and some in templates.

I don't think we need a separate file for each editor.
using jQuery we can just test for the existence of each editor field.
I'm actually in the middle of rewriting these editor files for ckeditor - I'm going to combine them into a common file.

If we could set the editor file url in config then I'd just swap mysite.com/fckeditor/fckeditor.js with mine in theme/functions.php ie.
$_CONF['adv_editor_path'] = /layout/foley/js/ckeditor/ckeditor.js;
$_CONF['adv_editor_js'] = /layout/foley/js/adv-editor.js;

or can overwrite the forced one in scripts in theme/functions.php
$_SCRIPTS->setJavaScriptFile('fckeditor','/layout/foley/js/ckeditor/ckeditor.js'Wink;
$_SCRIPTS->setJavaScriptFile('adv-editor','/layout/foley/js/adv-editor.js'Wink;

-s
FlashYourWeb and Your Gallery with the E2 XML Media Player for Gallery2 - http://www.flashyourweb.com
 Quote

Page navigation

All times are EDT. The time is now 04:14 pm.

  • Normal Topic
  • Sticky Topic
  • Locked Topic
  • New Post
  • Sticky Topic W/ New Post
  • Locked Topic W/ New Post
  •  View Anonymous Posts
  •  Able to post
  •  Filtered HTML Allowed
  •  Censored Content