Uploaded image for project: 'CiviCRM'
  1. CiviCRM
  2. CRM-5103 Implement contact subtype
  3. CRM-5305

Contact type and subtype icons - provide defaults using css classes and allow admins to specify their own icons for subtypes

    Details

    • Type: Sub-task
    • Status: Done/Fixed
    • Priority: Minor
    • Resolution: Fixed/Completed
    • Affects Version/s: 3.0
    • Fix Version/s: 3.1
    • Component/s: Core CiviCRM
    • Labels:
      None

      Description

      1. Replace all rendering of contact type icons with css classes assigned to an "icon" div.
      1.1 For base (parent) types:
      <div class="icon {$contact_type.name}-icon"></div>

      Example - replace this:
      <img alt="Individual" src="/dgg/drupal6/sites/all/modules/civicrm/i/contact_ind.gif"/>

      ... with this:

      <div class="icon Individual-icon"></div>

      NOTE: Use contact_type.name NOT contact_type.label for the contact type class so translations don't affect the css classes.

      1.2 For subtypes where contact_type.image_URL is null (no custom icon has been defined) we use a generic subtype class so that the default subtype icon for that subtype is used:

      <div class="icon {$parent.contact_type.name}-subtype-icon"></div>

      Example for a subtype of Organization:

      <div class="icon .Organization-subtype-icon"></div>

      2. Expose the image_URL field in the contact_type table in CRM_Admin_Form_ContactType - to allow admins to optionally provide an alternate URL to for that type's "icon". Field label in the form s/b "Contact Type Icon URL". (I think we can allow them to do this for any "parent/basic" type - i.e. Organization" - as well as for subtypes they create.)

      WHEN a specific image_URL is defined for a contact_type, the actual contact_type name is used as the class AND a style attribute is added to the markup for the div icon as follows:

      <div class="icon {$contact_type.name}-icon" style="background:url({$contact_type.image_URL})"></div>

      EXAMPLE - IF contact_type.label = Student and image_URL = /mysite/sites/all/modules/civicrm/i/student_icon.png:

      <div class="icon Student-icon" style="background:url('/mysite/sites/all/modules/civicrm/i/student_icon.png')"></div>

      NOTE: The civicrm.css modifications and associated css "sprite" file to support the default classes for basic types and generic subtypes have already been committed by Kyle J.

      ================
      This change needs to be implemented for the following pages:

      A. All selectors which have contact type icon (Find Contacts, Find Contributions, etc.)

      • I think these instances all use CRM_Contact_BAO_Contact_Utils::getImage(), which invokes CRM_Contact_BAO_Contact_Utils::getImage to get the HTML markup. We should be able to modify that function to return the <div> with it's appropriate class and optional style attribute instead of the <img /> tag.

      B. Contact view and contact edit - replace <img> in setTitle with the div markup described above.

      C. Recent Items - this is partially implemented, but subtype and subtype override support needs to be added here.

        Attachments

          Activity

            People

            • Assignee:
              neha.saraph Neha Kulkarni
              Reporter:
              dgg David Greenberg
            • Votes:
              0 Vote for this issue
              Watchers:
              0 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Time Tracking

                Estimated:
                Original Estimate - Not Specified
                Not Specified
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 3 days, 1 hour
                3d 1h