Adding CSS-Class to title under 2.0.18.X

phreak

Hi all,

What would be a smart way and most Garden framwork compatible to add the ID of every topic as a CSS class to every "Datalist Item" for the discussion list?
Has anyone a code snippet example for me.

<ul class="DataList Discussions"> <li class="Item Announcement topicid-76"></li> <li class="Item Announcement topicid-63"></li> <li class="Item Announcement topicid-29"></li> <li class="Item Announcement topicid-19"></li> <li class="Item Announcement topicid-4"></li> </ul>

Thanx for help,
phreak

Shadowdare

Here is an example plugin that will do the job.

/plugins/discussionlistidclass/class.discussionlistidclass.plugin.php

<?php if(!defined('APPLICATION')) exit();
// Define the plugin:
$PluginInfo['DiscussionListIDClass'] = array(
   'Name' => 'Discussion List ID Class',
   'Description' => 'Adds a CSS class with the discussion ID of each discussion in the discussions list.',
   'Version' => '1.0.0.0',
   'Author' => "Shadowdare"
);

class DiscussionListIDClassPlugin extends Gdn_Plugin {
   public function DiscussionsController_BeforeDiscussionName_Handler($Sender) {
      // Adds a CSS class with the discussion ID of each discussion in the discussions list.
      $Sender->EventArguments['CssClass'] .= ' Discussion_' . $Sender->EventArguments['Discussion']->DiscussionID;
   }
}

businessdad

@Shadowdare said:
Here is an example plugin that will do the job.

   public function DiscussionsController_BeforeDiscussionName_Handler($Sender) {
      // Adds a CSS class with the discussion ID of each discussion in the discussions list.
      $Sender->EventArguments['CssClass'] .= ' Discussion_' . $Sender->EventArguments['Discussion']->DiscussionID;
   }

Or you can just put the above in the theme hooks.

phreak

Hi @Shadowdare and @businessdad‌,

Thanx a lot for the code. Also the themehooks is promising short i decided to create it as a plugin. It works great but does only target the desktop theme of my forum.

I added the 'MobileFriendly' => TRUE option, what did not really help. Can you tell me how to extend this to the mobile theme?

Thanx for getting so pleased and sorry for my late returns but i tend to think and try before i answer

vrijvlinder

I think it is Because the mobile theme has theme hooks which is a theme plugin.

Maybe Just add the code in the themehooks file for the mobile theme.

hgtonight

@phreak said:

I added the 'MobileFriendly' => TRUE option, what did not really help. Can you tell me how to extend this to the mobile theme?

That is all you should need to do to whitelist the plugin on mobile. What does your entire plugin file look like?

Can you enable and disable your plugin without error?

peregrine

@vrijvlinder said:

I think it is Because the mobile theme has theme hooks which is a theme plugin.

Maybe Just add the code in the themehooks file for the mobile theme.

shouldn't matter. problem is either MobileFriendly was not added properly or he was viewing from a category is my hunch (which was not taken into account).

---

@Ph.....

you might have two issues - this solves both Probably. On to next person who can field further questions (not me). Code below worked for me when viewing within category, on mobile and in main discussion list, good luck!

you might be looking at a discussion thru categories. you need to add the categories controller as well.

    <?php if(!defined('APPLICATION')) exit();
    // Define the plugin:
    $PluginInfo['DiscussionListIDClass'] = array(
    'Name' => 'Discussion List ID Class',
    'Description' => 'Adds a CSS class with the discussion ID of each discussion in the discussions list.',
    'Version' => '1.0.0.1',
        'MobileFriendly' => TRUE,
       'Author' => "Community",
    );

    class DiscussionListIDClassPlugin extends Gdn_Plugin {


    // add the css class when primary discussion list  (non-category)
    public function DiscussionsController_BeforeDiscussionName_Handler($Sender) {
         $this->AttachDCssClass($Sender);
    }


    // add the css class when viewing discussion list  in category
    public function CategoriesController_BeforeDiscussionName_Handler($Sender) {
         $this->AttachDCssClass($Sender);
    }


    public function AttachDCssClass($Sender) {
        $Sender->EventArguments['CssClass'] .= " Discussion_" .  $Sender->EventArguments['Discussion']->DiscussionID;
    }   


}

vrijvlinder

Ok, then why when you mark it as mobile friendly False it still loads on mobile ? and there is a need to add if Is mobile return null?

peregrine

@vrijvlinder said:
Ok, then why when you mark it as mobile friendly False it still loads on mobile ? and there is a need to add if Is mobile return null?

When converting to boolean, the following values are considered FALSE:

* the boolean FALSE itself
* the integer 0 (zero)
* the float 0.0 (zero)
* the empty string, and the string "0"
* an array with zero elements
* an object with zero member variables (PHP 4 only)
* the special type NULL (including unset variables)
* SimpleXML objects created from empty tags

Every other value is considered TRUE (including any resources)

depends on how it is evaluated False and false may be considered TRUE

peregrine

'MobileFriendly' => FALSE, // not mobile
'MobileFriendly' => TRUE, // mobile

'MobileFriendly' => 'FALSE', // mobile because a FALSE string is actually true.
'MobileFriendly' => 'momma', // mobile because momma string is actually true

'MobileFriendly' => 'False', // mobile because 'False' string is actually true.

Shadowdare

The MobileFriendly is set to FALSE by default for plugins that don't set it manually.

The mobile theme in Vanilla 2.0.18.10 overrides the WriteDiscussion() function in the /themes/mobile/views/discussions/helper_functions.php file. It has the BeforeDiscussionName event that I used in my example code above, but the problem is that it's missing the following line which is present in the original template: $Sender->EventArguments['CssClass'] = &$CssClass;.

If you add that line above $Sender->FireEvent('BeforeDiscussionName'); in the /themes/mobile/views/discussions/helper_functions.php file of the mobile theme, the plugin should work.

peregrine

Shadowdare said:
The mobile theme in Vanilla 2.0.18.10 overrides the WriteDiscussion() function in the /themes/mobile/views/discussions/helper_functions.php file. It has the BeforeDiscussionName event that I used in my example code above, but the problem is that it's missing the following line which is present in the original template: $Sender->EventArguments['CssClass'] = &$CssClass;.

I tested the code I posted in vanilla 2.1b2 (but I didn't test it in 2.0.18.10)
http://vanillaforums.org/discussion/comment/204632/#Comment_204632

at least you know you won't have to change helper functions in 2.1b2 when you upgrade