Dotclear

Changeset 2658:0686a9a71a3f for themes


Ignore:
Timestamp:
02/13/14 14:13:01 (11 years ago)
Author:
franck <carnet.franck.paul@…>
Branch:
default
Message:

New utility lib for theme configuration, applied to ductile theme, addresses #904

Location:
themes/ductile
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • themes/ductile/_config.php

    r2581 r2658  
    7878); 
    7979 
    80 function adjustFontSize($s) 
    81 { 
    82      if (preg_match('/^([0-9.]+)\s*(%|pt|px|em|ex)?$/',$s,$m)) { 
    83           if (empty($m[2])) { 
    84                $m[2] = 'em'; 
    85           } 
    86           return $m[1].$m[2]; 
    87      } 
    88  
    89      return null; 
    90 } 
    91  
    9280$font_families = array( 
    9381     // Theme standard 
    … …  
    117105 
    118106     return isset($font_families[$c]) ? '<span style="position:absolute;top:0;left:32em;">'.$font_families[$c].'</span>' : ''; 
    119 } 
    120  
    121 function adjustColor($c) 
    122 { 
    123      if ($c === '') { 
    124           return ''; 
    125      } 
    126  
    127      $c = strtoupper($c); 
    128  
    129      if (preg_match('/^[A-F0-9]{3,6}$/',$c)) { 
    130           $c = '#'.$c; 
    131      } 
    132  
    133      if (preg_match('/^#[A-F0-9]{6}$/',$c)) { 
    134           return $c; 
    135      } 
    136  
    137      if (preg_match('/^#[A-F0-9]{3,}$/',$c)) { 
    138           return '#'.substr($c,1,1).substr($c,1,1).substr($c,2,1).substr($c,2,1).substr($c,3,1).substr($c,3,1); 
    139      } 
    140  
    141      return ''; 
    142 } 
    143  
    144 function computeContrastRatio($color,$background) 
    145 { 
    146      // Compute contrast ratio between two colors 
    147  
    148      $color = adjustColor($color); 
    149      if (($color == '') || (strlen($color) != 7)) return 0; 
    150      $background = adjustColor($background); 
    151      if (($background == '') || (strlen($background) != 7)) return 0; 
    152  
    153      $l1 = (0.2126 * pow(hexdec(substr($color,1,2))/255,2.2)) + 
    154           (0.7152 * pow(hexdec(substr($color,3,2))/255,2.2)) + 
    155           (0.0722 * pow(hexdec(substr($color,5,2))/255,2.2)); 
    156  
    157      $l2 = (0.2126 * pow(hexdec(substr($background,1,2))/255,2.2)) + 
    158           (0.7152 * pow(hexdec(substr($background,3,2))/255,2.2)) + 
    159           (0.0722 * pow(hexdec(substr($background,5,2))/255,2.2)); 
    160  
    161      if ($l1 > $l2) { 
    162           $ratio = ($l1 + 0.05) / ($l2 + 0.05); 
    163      } else { 
    164           $ratio = ($l2 + 0.05) / ($l1 + 0.05); 
    165      } 
    166      return $ratio; 
    167 } 
    168  
    169 function contrastRatioLevel($ratio,$size,$bold) 
    170 { 
    171      if ($size == '') { 
    172           return ''; 
    173      } 
    174  
    175      // Eval font size in em (assume base font size in pixels equal to 16) 
    176      if (preg_match('/^([0-9.]+)\s*(%|pt|px|em|ex)?$/',$size,$m)) { 
    177           if (empty($m[2])) { 
    178                $m[2] = 'em'; 
    179           } 
    180      } else { 
    181           return ''; 
    182      } 
    183      switch ($m[2]) { 
    184           case '%': 
    185                $s = (float) $m[1] / 100; 
    186                break; 
    187           case 'pt': 
    188                $s = (float) $m[1] / 12; 
    189                break; 
    190           case 'px': 
    191                $s = (float) $m[1] / 16; 
    192                break; 
    193           case 'em': 
    194                $s = (float) $m[1]; 
    195                break; 
    196           case 'ex': 
    197                $s = (float) $m[1] / 2; 
    198                break; 
    199           default: 
    200                return ''; 
    201      } 
    202  
    203      $large = ((($s > 1.5) && ($bold == false)) || (($s > 1.2) && ($bold == true))); 
    204  
    205      // Check ratio 
    206      if ($ratio > 7) { 
    207           return 'AAA'; 
    208      } elseif (($ratio > 4.5) && $large) { 
    209           return 'AAA'; 
    210      } elseif ($ratio > 4.5) { 
    211           return 'AA'; 
    212      } elseif (($ratio > 3) && $large) { 
    213           return 'AA'; 
    214      } 
    215      return ''; 
    216 } 
    217  
    218 function contrastRatio($color,$background,$size='',$bold=false) 
    219 { 
    220      if (($color != '') && ($background != '')) { 
    221           $ratio = computeContrastRatio($color,$background); 
    222           $level = contrastRatioLevel($ratio,$size,$bold); 
    223           return 
    224                '<span style="position:absolute;top:0;left:23em;">'. 
    225                sprintf(__('ratio %.1f'),$ratio). 
    226                ($level != '' ? ' '.sprintf(__('(%s)'),$level) : ''). 
    227                '</span>'; 
    228      } 
    229      return ''; 
    230107} 
    231108 
    … …  
    398275 
    399276               $ductile_user['blog_title_w'] = (integer) !empty($_POST['blog_title_w']); 
    400                $ductile_user['blog_title_s'] = adjustFontSize($_POST['blog_title_s']); 
    401                $ductile_user['blog_title_c'] = adjustColor($_POST['blog_title_c']); 
     277               $ductile_user['blog_title_s'] = dcThemeConfig::adjustFontSize($_POST['blog_title_s']); 
     278               $ductile_user['blog_title_c'] = dcThemeConfig::adjustColor($_POST['blog_title_c']); 
    402279 
    403280               $ductile_user['post_title_w'] = (integer) !empty($_POST['post_title_w']); 
    404                $ductile_user['post_title_s'] = adjustFontSize($_POST['post_title_s']); 
    405                $ductile_user['post_title_c'] = adjustColor($_POST['post_title_c']); 
     281               $ductile_user['post_title_s'] = dcThemeConfig::adjustFontSize($_POST['post_title_s']); 
     282               $ductile_user['post_title_c'] = dcThemeConfig::adjustColor($_POST['post_title_c']); 
    406283 
    407284               $ductile_user['post_link_w'] = (integer) !empty($_POST['post_link_w']); 
    408                $ductile_user['post_link_v_c'] = adjustColor($_POST['post_link_v_c']); 
    409                $ductile_user['post_link_f_c'] = adjustColor($_POST['post_link_f_c']); 
    410  
    411                $ductile_user['post_simple_title_c'] = adjustColor($_POST['post_simple_title_c']); 
     285               $ductile_user['post_link_v_c'] = dcThemeConfig::adjustColor($_POST['post_link_v_c']); 
     286               $ductile_user['post_link_f_c'] = dcThemeConfig::adjustColor($_POST['post_link_f_c']); 
     287 
     288               $ductile_user['post_simple_title_c'] = dcThemeConfig::adjustColor($_POST['post_simple_title_c']); 
    412289 
    413290               $ductile_user['blog_title_w_m'] = (integer) !empty($_POST['blog_title_w_m']); 
    414                $ductile_user['blog_title_s_m'] = adjustFontSize($_POST['blog_title_s_m']); 
    415                $ductile_user['blog_title_c_m'] = adjustColor($_POST['blog_title_c_m']); 
     291               $ductile_user['blog_title_s_m'] = dcThemeConfig::adjustFontSize($_POST['blog_title_s_m']); 
     292               $ductile_user['blog_title_c_m'] = dcThemeConfig::adjustColor($_POST['blog_title_c_m']); 
    416293 
    417294               $ductile_user['post_title_w_m'] = (integer) !empty($_POST['post_title_w_m']); 
    418                $ductile_user['post_title_s_m'] = adjustFontSize($_POST['post_title_s_m']); 
    419                $ductile_user['post_title_c_m'] = adjustColor($_POST['post_title_c_m']); 
     295               $ductile_user['post_title_s_m'] = dcThemeConfig::adjustFontSize($_POST['post_title_s_m']); 
     296               $ductile_user['post_title_c_m'] = dcThemeConfig::adjustColor($_POST['post_title_c_m']); 
    420297          } 
    421298 
    … …  
    583460'<p class="field picker"><label for="blog_title_c">'.__('Color:').'</label> '. 
    584461form::field('blog_title_c',7,7,$ductile_user['blog_title_c'],'colorpicker'). 
    585 contrastRatio($ductile_user['blog_title_c'],'#ffffff', 
     462dcThemeConfig::contrastRatio($ductile_user['blog_title_c'],'#ffffff', 
    586463     (!empty($ductile_user['blog_title_s']) ? $ductile_user['blog_title_s'] : '2em'), 
    587464     $ductile_user['blog_title_w']). 
    … …  
    600477'<p class="field picker"><label for="post_title_c">'.__('Color:').'</label> '. 
    601478form::field('post_title_c',7,7,$ductile_user['post_title_c'],'colorpicker'). 
    602 contrastRatio($ductile_user['post_title_c'],'#ffffff', 
     479dcThemeConfig::contrastRatio($ductile_user['post_title_c'],'#ffffff', 
    603480     (!empty($ductile_user['post_title_s']) ? $ductile_user['post_title_s'] : '2.5em'), 
    604481     $ductile_user['post_title_w']). 
    … …  
    612489'<p class="field picker"><label for="post_simple_title_c">'.__('Color:').'</label> '. 
    613490form::field('post_simple_title_c',7,7,$ductile_user['post_simple_title_c'],'colorpicker'). 
    614 contrastRatio($ductile_user['post_simple_title_c'],'#ffffff', 
     491dcThemeConfig::contrastRatio($ductile_user['post_simple_title_c'],'#ffffff', 
    615492     '1.1em',  // H5 minimum size 
    616493     false). 
    … …  
    623500'<p class="field picker"><label for="post_link_v_c">'.__('Normal and visited links color:').'</label> '. 
    624501form::field('post_link_v_c',7,7,$ductile_user['post_link_v_c'],'colorpicker'). 
    625 contrastRatio($ductile_user['post_link_v_c'],'#ffffff', 
     502dcThemeConfig::contrastRatio($ductile_user['post_link_v_c'],'#ffffff', 
    626503     '1em', 
    627504     $ductile_user['post_link_w']). 
    … …  
    630507'<p class="field picker"><label for="post_link_f_c">'.__('Active, hover and focus links color:').'</label> '. 
    631508form::field('post_link_f_c',7,7,$ductile_user['post_link_f_c'],'colorpicker'). 
    632 contrastRatio($ductile_user['post_link_f_c'],'#ebebee', 
     509dcThemeConfig::contrastRatio($ductile_user['post_link_f_c'],'#ebebee', 
    633510     '1em', 
    634511     $ductile_user['post_link_w']). 
    … …  
    649526'<p class="field picker"><label for="blog_title_c_m">'.__('Color:').'</label> '. 
    650527form::field('blog_title_c_m',7,7,$ductile_user['blog_title_c_m'],'colorpicker'). 
    651 contrastRatio($ductile_user['blog_title_c_m'],'#d7d7dc', 
     528dcThemeConfig::contrastRatio($ductile_user['blog_title_c_m'],'#d7d7dc', 
    652529     (!empty($ductile_user['blog_title_s_m']) ? $ductile_user['blog_title_s_m'] : '1.8em'), 
    653530     $ductile_user['blog_title_w_m']). 
    … …  
    666543'<p class="field picker"><label for="post_title_c_m">'.__('Color:').'</label> '. 
    667544form::field('post_title_c_m',7,7,$ductile_user['post_title_c_m'],'colorpicker'). 
    668 contrastRatio($ductile_user['post_title_c_m'],'#ffffff', 
     545dcThemeConfig::contrastRatio($ductile_user['post_title_c_m'],'#ffffff', 
    669546     (!empty($ductile_user['post_title_s_m']) ? $ductile_user['post_title_s_m'] : '1.5em'), 
    670547     $ductile_user['post_title_w_m']). 

  • themes/ductile/_public.php

    r2581 r2658  
    314314                    # Main font 
    315315                    $selectors = 'body, .supranav li a span, #comments.me, a.comment-number'; 
    316                     self::prop($css,$selectors,'font-family',$s['body_webfont_family']); 
     316                    dcThemeConfig::prop($css,$selectors,'font-family',$s['body_webfont_family']); 
    317317               } 
    318318          } 
    … …  
    332332                    # Secondary font 
    333333                    $selectors = '#blogdesc, .supranav, #content-info, #subcategories, #comments-feed, #sidebar h2, #sidebar h3, #footer'; 
    334                     self::prop($css,$selectors,'font-family',$s['alternate_webfont_family']); 
     334                    dcThemeConfig::prop($css,$selectors,'font-family',$s['alternate_webfont_family']); 
    335335               } 
    336336          } 
    … …  
    370370          # Blog description 
    371371          $selectors = '#blogdesc'; 
    372           if (isset($s['subtitle_hidden'])) self::prop($css,$selectors,'display',($s['subtitle_hidden'] ? 'none' : null)); 
     372          if (isset($s['subtitle_hidden'])) dcThemeConfig::prop($css,$selectors,'display',($s['subtitle_hidden'] ? 'none' : null)); 
    373373 
    374374          # Main font 
    375375          $selectors = 'body, .supranav li a span, #comments.me, a.comment-number'; 
    376           if (isset($s['body_font'])) self::prop($css,$selectors,'font-family',self::fontDef($s['body_font'])); 
     376          if (isset($s['body_font'])) dcThemeConfig::prop($css,$selectors,'font-family',self::fontDef($s['body_font'])); 
    377377 
    378378          # Secondary font 
    379379          $selectors = '#blogdesc, .supranav, #content-info, #subcategories, #comments-feed, #sidebar h2, #sidebar h3, #footer'; 
    380           if (isset($s['alternate_font'])) self::prop($css,$selectors,'font-family',self::fontDef($s['alternate_font'])); 
     380          if (isset($s['alternate_font'])) dcThemeConfig::prop($css,$selectors,'font-family',self::fontDef($s['alternate_font'])); 
    381381 
    382382          # Inside posts links font weight 
    383383          $selectors = '.post-excerpt a, .post-content a'; 
    384           if (isset($s['post_link_w'])) self::prop($css,$selectors,'font-weight',($s['post_link_w'] ? 'bold' : 'normal')); 
     384          if (isset($s['post_link_w'])) dcThemeConfig::prop($css,$selectors,'font-weight',($s['post_link_w'] ? 'bold' : 'normal')); 
    385385 
    386386          # Inside posts links colors (normal, visited) 
    387387          $selectors = '.post-excerpt a:link, .post-excerpt a:visited, .post-content a:link, .post-content a:visited'; 
    388           if (isset($s['post_link_v_c'])) self::prop($css,$selectors,'color',$s['post_link_v_c']); 
     388          if (isset($s['post_link_v_c'])) dcThemeConfig::prop($css,$selectors,'color',$s['post_link_v_c']); 
    389389 
    390390          # Inside posts links colors (hover, active, focus) 
    391391          $selectors = '.post-excerpt a:hover, .post-excerpt a:active, .post-excerpt a:focus, .post-content a:hover, .post-content a:active, .post-content a:focus'; 
    392           if (isset($s['post_link_f_c'])) self::prop($css,$selectors,'color',$s['post_link_f_c']); 
     392          if (isset($s['post_link_f_c'])) dcThemeConfig::prop($css,$selectors,'color',$s['post_link_f_c']); 
    393393 
    394394          # Style directives 
    … …  
    407407          # Blog title font weight 
    408408          $selectors = 'h1, h1 a:link, h1 a:visited, h1 a:hover, h1 a:visited, h1 a:focus'; 
    409           if (isset($s['blog_title_w'])) self::prop($css_large,$selectors,'font-weight',($s['blog_title_w'] ? 'bold' : 'normal')); 
     409          if (isset($s['blog_title_w'])) dcThemeConfig::prop($css_large,$selectors,'font-weight',($s['blog_title_w'] ? 'bold' : 'normal')); 
    410410 
    411411          # Blog title font size 
    412412          $selectors = 'h1'; 
    413           if (isset($s['blog_title_s'])) self::prop($css_large,$selectors,'font-size',$s['blog_title_s']); 
     413          if (isset($s['blog_title_s'])) dcThemeConfig::prop($css_large,$selectors,'font-size',$s['blog_title_s']); 
    414414 
    415415          # Blog title color 
    416416          $selectors = 'h1 a:link, h1 a:visited, h1 a:hover, h1 a:visited, h1 a:focus'; 
    417           if (isset($s['blog_title_c'])) self::prop($css_large,$selectors,'color',$s['blog_title_c']); 
     417          if (isset($s['blog_title_c'])) dcThemeConfig::prop($css_large,$selectors,'color',$s['blog_title_c']); 
    418418 
    419419          # Post title font weight 
    420420          $selectors = 'h2.post-title, h2.post-title a:link, h2.post-title a:visited, h2.post-title a:hover, h2.post-title a:visited, h2.post-title a:focus'; 
    421           if (isset($s['post_title_w'])) self::prop($css_large,$selectors,'font-weight',($s['post_title_w'] ? 'bold' : 'normal')); 
     421          if (isset($s['post_title_w'])) dcThemeConfig::prop($css_large,$selectors,'font-weight',($s['post_title_w'] ? 'bold' : 'normal')); 
    422422 
    423423          # Post title font size 
    424424          $selectors = 'h2.post-title'; 
    425           if (isset($s['post_title_s'])) self::prop($css_large,$selectors,'font-size',$s['post_title_s']); 
     425          if (isset($s['post_title_s'])) dcThemeConfig::prop($css_large,$selectors,'font-size',$s['post_title_s']); 
    426426 
    427427          # Post title color 
    428428          $selectors = 'h2.post-title a:link, h2.post-title a:visited, h2.post-title a:hover, h2.post-title a:visited, h2.post-title a:focus'; 
    429           if (isset($s['post_title_c'])) self::prop($css_large,$selectors,'color',$s['post_title_c']); 
     429          if (isset($s['post_title_c'])) dcThemeConfig::prop($css_large,$selectors,'color',$s['post_title_c']); 
    430430 
    431431          # Simple title color (title without link) 
    432432          $selectors = '#content-info h2, .post-title, .post h3, .post h4, .post h5, .post h6, .arch-block h3'; 
    433           if (isset($s['post_simple_title_c'])) self::prop($css_large,$selectors,'color',$s['post_simple_title_c']); 
     433          if (isset($s['post_simple_title_c'])) dcThemeConfig::prop($css_large,$selectors,'color',$s['post_simple_title_c']); 
    434434 
    435435          # Style directives for large screens 
    … …  
    451451          # Blog title font weight 
    452452          $selectors = 'h1, h1 a:link, h1 a:visited, h1 a:hover, h1 a:visited, h1 a:focus'; 
    453           if (isset($s['blog_title_w_m'])) self::prop($css_small,$selectors,'font-weight',($s['blog_title_w_m'] ? 'bold' : 'normal')); 
     453          if (isset($s['blog_title_w_m'])) dcThemeConfig::prop($css_small,$selectors,'font-weight',($s['blog_title_w_m'] ? 'bold' : 'normal')); 
    454454 
    455455          # Blog title font size 
    456456          $selectors = 'h1'; 
    457           if (isset($s['blog_title_s_m'])) self::prop($css_small,$selectors,'font-size',$s['blog_title_s_m']); 
     457          if (isset($s['blog_title_s_m'])) dcThemeConfig::prop($css_small,$selectors,'font-size',$s['blog_title_s_m']); 
    458458 
    459459          # Blog title color 
    460460          $selectors = 'h1 a:link, h1 a:visited, h1 a:hover, h1 a:visited, h1 a:focus'; 
    461           if (isset($s['blog_title_c_m'])) self::prop($css_small,$selectors,'color',$s['blog_title_c_m']); 
     461          if (isset($s['blog_title_c_m'])) dcThemeConfig::prop($css_small,$selectors,'color',$s['blog_title_c_m']); 
    462462 
    463463          # Post title font weight 
    464464          $selectors = 'h2.post-title, h2.post-title a:link, h2.post-title a:visited, h2.post-title a:hover, h2.post-title a:visited, h2.post-title a:focus'; 
    465           if (isset($s['post_title_w_m'])) self::prop($css_small,$selectors,'font-weight',($s['post_title_w_m'] ? 'bold' : 'normal')); 
     465          if (isset($s['post_title_w_m'])) dcThemeConfig::prop($css_small,$selectors,'font-weight',($s['post_title_w_m'] ? 'bold' : 'normal')); 
    466466 
    467467          # Post title font size 
    468468          $selectors = 'h2.post-title'; 
    469           if (isset($s['post_title_s_m'])) self::prop($css_small,$selectors,'font-size',$s['post_title_s_m']); 
     469          if (isset($s['post_title_s_m'])) dcThemeConfig::prop($css_small,$selectors,'font-size',$s['post_title_s_m']); 
    470470 
    471471          # Post title color 
    472472          $selectors = 'h2.post-title a:link, h2.post-title a:visited, h2.post-title a:hover, h2.post-title a:visited, h2.post-title a:focus'; 
    473           if (isset($s['post_title_c_m'])) self::prop($css_small,$selectors,'color',$s['post_title_c_m']); 
     473          if (isset($s['post_title_c_m'])) dcThemeConfig::prop($css_small,$selectors,'color',$s['post_title_c_m']); 
    474474 
    475475          # Style directives for small screens 
    … …  
    515515          return isset(self::$fonts[$c]) ? self::$fonts[$c] : null; 
    516516     } 
    517  
    518      protected static function prop(&$css,$selector,$prop,$value) 
    519      { 
    520           if ($value) { 
    521                $css[$selector][$prop] = $value; 
    522           } 
    523      } 
    524517} 
Note: See TracChangeset for help on using the changeset viewer.

Sites map