By John Bryan on

With "aggregated CSS cache" on a collection of ".css" files build up in "\files\css\" with long alphanumeric names.

Are these files create 1 per session?

Or are they created 1 per user?

How in PHP can I identify which is the current cached CSS file?

Can anyone point me to relevant code for the CSS cache creation?

There is a good reason for this question in regards to module development. I am think of creating a mechanism so that the TinyMCE module can dynamically configure itself (or other not-quite WYSIWYG editors) so that is loading the current total CSS for the user/site.

Cheers

⋅ Categories: Drupal 5.x

Comments

John Bryan’s picture

John Bryan commented

"drupal_get_css" returns the location of the current aggregated CSS (including users theme selection) or a list of applicapble CSS files as a HTML <STYLE command string. The TinyMCE module to could(?) be made to call this function and parse the CSS path(s) everytime it is launched.

In the longer term an optional parameter could be added to "drupal_get_css" so that instead of a formatted HTML retur it could return just the CSS file/file-list. Therefore removing the need for stipping out un-needed HTML.

This could obviously be applied to other editors and could be a first tiny step towards a Drupal/3rd-party-editor interface.

Will probable experiment later this week.

/**
* Returns a themed representation of all stylesheets that should be attached to the page.
* It loads the CSS in order, with 'core' CSS first, then 'module' CSS, then 'theme' CSS files.
* This ensures proper cascading of styles for easy overriding in modules and themes.
*
* @param $css
* (optional) An array of CSS files. If no array is provided, the default stylesheets array is used instead.
* @return
* A string of XHTML CSS tags.
*/
function drupal_get_css($css = NULL) {
..
..
if ($is_writable && $preprocess_css) {
$filename = md5(serialize($types)) .'.css';
$preprocess_file = drupal_build_css_cache($types, $filename);
$output .= '

@import "'. base_path() . $preprocess_file .'";

'. "\n";
}
..}

/**
* Aggregate and optimize CSS files, putting them in the files directory.
*
* @param $types
* An array of types of CSS files (e.g., screen, print) to aggregate and compress into one file.
* @param $filename
* The name of the aggregate CSS file.
* @return
* The name of the CSS file.
*/
function drupal_build_css_cache($types, $filename)

Regards

John Bryan
www.ALT2.com
Application Integration Specialists
Tel: UK 08700 3456-31

John Bryan’s picture

John Bryan commented

Module function where TinyMCE is launched...

tinymce_process_textarea

which fetched config info via..

tinymce_config
..
..
if ($settings['css_setting'] == 'theme') {
$css = $themepath . 'style.css';
if (file_exists($css)) {
$init['content_css'] = $host . $css;
}
}
else if ($settings['css_setting'] == 'self') {
$init['content_css'] = str_replace(array('%h', '%t'), array($host, $themepath), $settings['css_path']);
}
..

Changing the 'theme' branch to call and parse the output from drupal_get_css should enhance CSS style inheritance.

Now if only I can get TinyMCE to work in the first place before I hack it:-

- Shows "Current Theme" style list from theme but does not seem to format according to the theme.
- Tiny font size

Regards

John Bryan
www.ALT2.com
Application Integration Specialists
Tel: UK 08700 3456-31

John Bryan’s picture

John Bryan commented

Got TinyMCE working with normal font size by adding the following to the current theme's style.css:-

body.mceContentBody {
font-size: 1.0em;
}

This is an improvement on the usual reccomendations as it does not set an explicit size, just uses the existing, and does not use the "important" attribute so does not over-ride the users browser settings. i.e. this way it is disability access compliant and best practise compliant.

Also a bodge (not an end solution) added ", body.mceContentBody" to instances of ".content" & ".node" in the CSS so that TinyMCE displays the same as the viewed result.

The real solution will be to get TinyMCE's inline java window to include the "content" & "node" div statements. currently it outputs and operates within:-

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>blank_page</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body class="mceContentBody">

</body>
</html>

Presumably if I can get it to operate within the following instead it will not need the bodging from above:-

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>blank_page</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body class="mceContentBody">
<div class="node">
<div class="content">

</div>
</div>
</body>
</html>

So my next task is to identify where this (x)html page wrapper is generated.

Regards

John Bryan
www.ALT2.com
Application Integration Specialists
Tel: UK 08700 3456-31

djsdjs’s picture

djsdjs commented

It loads the editor very slowly.

Also I was hoping that Geshi highlighting would automatically be available in the editor and it is not.

In fckeditor.module

find

    if (!empty($custom_style) && is_string($custom_style)) {
      $element['#suffix'] .=  $js_id.".Config['EditorAreaCSS'] = '".$custom_style."';";
    }

and add an else so it looks like this:

    if (!empty($custom_style) && is_string($custom_style)) {
      $element['#suffix'] .=  $js_id.".Config['EditorAreaCSS'] = '".$custom_style."';";
    }
    else {
      $element['#suffix'] .=  $js_id.".Config['EditorAreaCSS'] = '".drupal_get_css."';";
    }

Adding it as an else statement allows it to be overridden in the module's admin settings.

It doesn't do what I hoped and is too slow, but I thought I'd post what I found.

D.