CSS stylesheet to FCKEditor xml styles converter

Johnny vd Laar - February 12, 2009 - 15:21
Project:FCKeditor - WYSIWYG HTML editor
Version:6.x-2.x-dev
Component:Code
Category:feature request
Priority:normal
Assigned:Unassigned
Status:won't fix
Description

in our own websites we have made a small moderation in the way fckeditor supports xml styles. instead of using a fckeditor specific xml styles file we created a css to xml styles convertor.

the advantage is that you don't need to create a xml file and a stylesheet, only the stylesheet is enough.

the patch that i added is based on the last fckeditor 6.x-2.x dev of 29 jan. i never released patches before so please spank me if i made a mistake ;)

more information about the added feature + screenshots are on my blogpost:
http://www.internetunlimited.nl/en/blog/fckeditor-stylesheet-xml-styles-...

there is also a fckeditor module download there with the patch already applied, for easy testing. i hope this is ok as i don't want to start any forks etc?

AttachmentSize
fckeditor.patch7.39 KB

#1

wwalc - February 17, 2009 - 12:11
Status:needs review» needs work

Cool idea. Like anyone, I also like to automate stuff, however I do see a problem with this approach: there is no way to alter the result of this transformation.
So maybe it would be better to provide a tool that could generate this file on demand. We could place a link to this tool below this description:
"Define the location of fckstyles.xml file. It is used by the "Style" dropdown list available in the Default toolbar." in "CSS -> Predefined styles:".
Something like: "Generate fckstyles.xml based on the editor CSS defined above". What do you think?
This way, an administrator could download this file, correct/remove all styles that shouldn't be used and upload the final result into the right place.
It might take a little bit more time if someone have more than one theme enabled, but even in such case probably it would be better to use this tool anyway.

Some tips regarding code:

  • Use preg_match() instead of ereg().
  • Use the Coder module to check if the code is correctly formatted.
  • You can get the list of all stylesheets to load with this code:
    $files = array();
    foreach (drupal_add_css() as $media => $css) {
      if ($media != 'print') {
        foreach ($css['theme'] as $filepath => $preprocess) {
          $files[] = base_path() . $filepath;
        }
      }
    }

    (some themes do not use styles.css and almost all contain more than one css file).
  • Do not add styles for body tag (body.sidebar-left in Garland for example).
  • It would be nice to sort styles by name.

If possible, please create the next patch against the latest dev release (however I'll be happy with any patch :)). I don't mind that you have made the FCKeditor module with applied patch available, actually I have downloaded it to see how it works ;). However to make our life easier, please write somewhere near the download link that this is an experimental module based on the xxx version of the FCKeditor module and to see the current state of this feature, please visit this link: http://drupal.org/node/373393
This way it would be easier to deal with bug reports in the future.

#2

Johnny vd Laar - February 18, 2009 - 10:05

thanks for your feedback. I'll modify the code with your tips.

I'm not sure about the generate on demand as that introduces an extra step for people. If you don't want particular styles in the style list then you could just leave them out of the css file such that they don't end up in the styles list. Or am I missing your point here?

#3

wwalc - February 19, 2009 - 13:34

Oops actually you need the filesystem path of css stylesheets, so the following code should work better instead of calling drupal_add_css():

if (!empty($theme_info->stylesheets)) {
  $css_files = array();
  foreach ($base_theme_info as $base) {
    foreach ($base->stylesheets as $type => $stylesheets) {
      if ($type != "print") {
        foreach ($stylesheets as $name => $path) {
          if (file_exists($path)) {
            $css_files[$name] = $path;
          }
        }
      }
    }
  }
  if (!empty($theme_info->stylesheets)) {
    foreach ($theme_info->stylesheets as $type => $stylesheets) {
      if ($type != "print") {
        foreach ($stylesheets as $name => $path) {
          if (file_exists($path)) {
            $css_files[$name] = $path;
          }
          else if (!empty($css_files[$name])) {
            unset($css_files[$name]);
          }
        }
      }
    }
  }
}

($base_theme_info and $theme_info are global variables)

The generation on demand is an extra step, but on the other side we do not have to change css files into xml each time and a static xml file could be requested by FCKeditor.
The next thing that I took in mind is that not everybody use a custom theme, some people might just use a GPL theme and upgrade it from time to time.
If we ask them to modify anything in that theme, they will lose these changes each time they upgrade.
Another problem is that we would have to actually force people to move styles outside all css files (with the code above, we will parse all css files used by a theme).
The last thing - it's always easier to remove just some lines that we don't need from one file than modify lots of CSS files and not break anything.
So, it seems to me that downloading and correcting manually the fckstyles.xml file is the way to go, although as always I'm open for suggestions... what do you think?

#4

Johnny vd Laar - February 25, 2009 - 14:42

Well it's possible to use the theme css file, or a seperate css file just for the styles list. but i agree that it should be possible to just modify the fckstyles.xml

perhaps we can let it automatically generate a xml file and store it in the files folder such that people can modify it there

#5

wwalc - March 10, 2009 - 14:56

@Johnny vd Laar - any news on this? This really looks pretty interesting!

#6

Manuel_lucius - March 12, 2009 - 08:15

Same quetsion for me!

#7

Johnny vd Laar - March 19, 2009 - 15:17

sorry but i've been very busy with a number of deadlines. but I will try to find some time for this next week

#8

Johnny vd Laar - April 2, 2009 - 08:11

ok i've been busy with implementing the changes and I am fairly far with it.

one question:

if (!empty($theme_info->stylesheets)) {
  $css_files = array();
  foreach ($base_theme_info as $base) {
    foreach ($base->stylesheets as $type => $stylesheets) {
      if ($type != "print") {
        foreach ($stylesheets as $name => $path) {
          if (file_exists($path)) {
            $css_files[$name] = $path;
          }
        }
      }
    }
  }
  if (!empty($theme_info->stylesheets)) {
    foreach ($theme_info->stylesheets as $type => $stylesheets) {
      if ($type != "print") {
        foreach ($stylesheets as $name => $path) {
          if (file_exists($path)) {
            $css_files[$name] = $path;
          }
          else if (!empty($css_files[$name])) {
            unset($css_files[$name]);
          }
        }
      }
    }
  }
}

where did you want this to be implemented? as i didn't understand where to put it.

#9

wwalc - April 7, 2009 - 19:35

This code was just to help you to get the list of stylesheets that will be used by Drupal, from all these files you could create a single XML file (not every theme uses style.css and many of theme use more than one stylesheet, that's why a bit more complicated code is required to find the right files).

#10

Johnny vd Laar - April 8, 2009 - 10:28

ok it's more clear now. thank you!

#11

Johnny vd Laar - April 16, 2009 - 14:57

just as a heads up to people interested. i'm still going to finish this but i lack time to do this atm ;)

next week i'm prob still very busy but i hope to be able to free up a couple of hours the week after

#12

tazus - May 14, 2009 - 22:55

subscribed

#13

Johnny vd Laar - May 15, 2009 - 08:13
Status:needs work» needs review

ok it took me some time but I finished the patch :)

sorry for the long wait but I had a lot of project deadlines the last few weeks

the patch is made based on the last dev release of 14 may. I've modified my version as wwalc requested.

the styles file is now created based on the stylesheets of the current theme

but i'm still thinking about an extra option where it only uses a particular stylesheet (but I don't want to create too many settings for this), so perhaps someone has an advice about that...

AttachmentSize
fckeditor.patch 8.71 KB

#14

Johnny vd Laar - June 25, 2009 - 12:50

where these changes as you expected? or do you need any other modifications?

#15

Jorrit - October 10, 2009 - 08:53
Status:needs review» won't fix

This will not make it in a release any time soon, it's too much out of scope. Perhaps it can be made as a separate plugin module.

 
 

Drupal is a registered trademark of Dries Buytaert.