Merhaba arkadaşlar, nasıl ihtiyacım oldu ben de bilmiyorum ama bir css kalıtım sınıfı hazırladım. css doğru kullanıldığında zaten object oriented bir dildir. fakat bunu css kodlarken değil css i uygularken yapmak zorundaydık bu da her eleman için kalıtımı tekrar yazmamızı gerektiriyor. Bu da bizim alıştığımız object oriented yapısından farklı  hatta kimi programcı css’in object oriented olduğunu bile bilmez.  kalıtım sadece propertyler için  bu da sahip objenin stilinden gelir.  color:inherit;  gibi bir açıklamayla içerisinne konulan elemanın rengini alabiliyor.

Css de bir selector için yazdığınız stilden bir stil daha türettiniz mi hiç ?

Elbette bu css’te mümkün değil . ama linq’den beridir bişeyler parse ededudurken aklıma csste kalıtım geldi. ve bunun için de ufak bir sınıf yazdım. stilden stil türetme + cache mekanizması bizi hem fazla css kodlardan  kurtarıyor hem de karşıya sıkıştırılmış olarak göndermemizi sağlıyor. örnek bir inheritance örneği veremek istersek

0
1
2
3
4
.tablo
{
   font-size:12px;
   color:yellow;
}

şimdi bu sınıftaki propertyleri tekrar içermesini istediğimiz stili yazalım

0
1
2
3
4
5
6
7
8
9
10
11
.turetilmis-tablo
{
   based-on:'.tablo';  /* bu satırda .tablo stilinden türediğimiz belirttik */
   font-size:13px; /*  overriding (: */
   background-color:blue;  /*  diğer propertylere ek olarak bir de background-color ekledik*/
}
.turetilmis-diger-tablo
{
   based-on:'.turetilmis-tablo';  /* turetilmis-tablo stilinin tüm elemanlarını getirdik */
   background-color:red;  /*background-color değerini override edip polimorphizm sağladık(: */
   border:1px solid;  /*ek bir ozellik daha */
}

bu işlemlerden anladığımız gibi. ilk önce sarı yazı rengi olan bir stil yaptık ve burdan kalıtımın onemli hususlarını işledik. şimdi cıktımıza bakalım.

0
1
2
3
4
5
6
7
8
9
10
11
12
.turetilmis-tablo
{
   color:yellow;
   font-size:13px;
   background-color:blue;
}
.turetilmis-diger-tablo
{
   color:yellow;
   font-size:13px;
   background-color:red;
   border:1px solid;
}

kalıtım uygulanmış değil mi? (:

şimdi sınıfımızın kullanımıı gosterelim. dosyamızın adı inheritance.css olsun

0
1
2
3
4
5
6
<?php
    include 'D3Css.php';
    header("Content-Type: text/plain");
    $css = new D3Css('inheritance.css',true,'.');
    $css->compressed=false; 
    echo $css;
?>

bizim için iişlenecek inheitance.css ve sıkıştırılmadan ( compressed=fase ) saklanacak. artık yorumlama ile uğraşmayacağız.

sınıf henüz onaylanmamış. yayınlandığında buraya link vereceğim. şimdilik kodları veriyorum,

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
<?php
    /**
    * @name D3Css Css Inheritance and compressor.
    * @version 1.1
    * @author Tufan Baris YILDIRIM
    * @link http://www.tufyta.com/css-inheritance
    * ---------------------------------------------------
    * v1.1
    * -----
    *  -  cache mechanism added.
    *       - class can run without original file if output is cached.
    * v1.0
    * -----
    * This class can rewrite your css files and evulate inheritance.
    */
    class D3Css
    {
        /**
        * output will be one-line if compressed is true
        *
        * @var mixed
        */
        public  $compressed = true;
        /**
        * set cache folder for  write css output.
        *
        * @var mixed;
        */
        public  $cache_folder;
 
        /**
        * Cache file name
        *
        * @var mixed
        */
        public  $cache_file;
        /**
        * css file
        *
        * @var mixed
        */
        public $file;
        /**
        * Selector with properties.
        *
        * @var mixed
        */
        private $blocks = array();
        /**
        * Keep Selector Referances
        *
        * @var mixed
        */
        private $referances = array();
 
        /**
        * constructor method
        * Create an D3Css object by given file url or css string
        *
        * @param mixed $file_or_css_string
        * @param mixed $file
        * @return D3Css
        */
        public function __construct($file_or_css_string,$file=false,$cache_folder=null)
        {
 
            if ($file)
            {
                (is_file($file_or_css_string) || is_file($this->cache_file = $cache_folder.'/'.md5($file_or_css_string).'.css')) || trigger_error($file_or_css_string.' file not found.!');
                $this->file = $file_or_css_string;
            }
 
            if (isset($cache_folder))
            {
                if (!is_dir($cache_folder))
                    trigger_error($cache_folder.' is not a dir. ',E_USER_ERROR);
                else
                    $this->cache_folder = $cache_folder;
            }
            else
            {
                // get file conent if file is true else parse given string directly
                $this->parse_blocks($file ? file_get_contents($file_or_css_string) : $file_or_css_string);
            }
        }
 
        /**
        * @name Css Cleaner
        * @since 1.0
        * Remove
        *   - Multiline Comments
        *   - Single line comments
        *   - redudent characters,spaces and newlines.
        * @param mixed $css
        * @return mixed
        */
        private function clean_css($css)
        {
            // remove comments
            $css = preg_replace('/(\/\*.*?\*\/|\n|\t|\/\/.*?\n)/sim','', $css);
 
            // remove redudent characters and newlines.
            $css = preg_replace('/\s?(,|{|:){1}\s?/sim','\\1', $css);
 
            return $css;
        }
 
        /**
        * @name Main Parser Method
        * @since 1.0
        * Parce blocks , generate $blocks and $referances array.
        * @param mixed $string
        */
        private function parse_blocks($string)
        {
            preg_match_all('/(?<selectors>[^\{\}]+)\{(?<declerations>[^\{\}]+)\}/im',$this->clean_css($string),$matches);
 
            // delete unnecessary elements
            $matches = array('selectors' => $matches['selectors'],'declerations' => $matches['declerations']);
 
            // delete css string
            unset($string);
 
            $blocks = array();
 
            foreach( $matches['selectors'] as $index => $selector )
            {
                // $blocks[$selector=trim($selector)] =  $matches['declerations'][$index];
                preg_match_all('/(?<properties>[^:]+)(\s*):(?<values>[^;]+);?/im',$matches['declerations'][$index],$submatches);
 
                $blocks[$selector=trim($selector)] = array_combine(
                $properties = array_values(array_map('trim',$submatches['properties'])),
                array_values(array_map('trim',$submatches['values']))
                );
 
                // Referances avaliabilty.
                if(in_array('based-on',$properties))
                {
                    if(!in_array($base_class_name = str_replace("'",'',$blocks[$selector]['based-on']),$avaliable_classes = array_keys($blocks))
                    && !in_array($base_class_name,$avaliable_referances = array_keys($referances))) // checking referances for full inheritance yeah.
 
                        trigger_error('classes can not be declared before their base classes (may be Circular Referance)',E_USER_ERROR);
 
                    elseif (is_array($base_class=$blocks[$base_class_name]) || is_array($base_class = $referances[$base_class_name]))
                    {
                        // evulating inheritance  and overriting
                        $blocks[$selector] = array_merge($base_class,$blocks[$selector]);
                    }
 
                    // delete based-on property from class
                    unset($blocks[$selector]['based-on']);
                }
 
                // Delete submatches after use.
                unset($submatches);
 
                // Extract Referances. ex:  [&amp;body] and [&amp;td] will be referanced to  [body,td]
                if(count($selectors=explode(',',$selector))>1)
                {
                    foreach ( $selectors as $subselector )
                    {
                        $referances[trim($subselector)] = &$blocks[$selector];
                    }
                }
 
                // unset element after parse
                unset( $matches['selectors'][$index] ,$matches['declerations'][$index]);
            }
 
            $this->blocks=$blocks;
            $this->referances=$referances;
        }
 
        /**
        * @name Property Imploder.
        * @since 1.0
        * @param mixed $value
        * @param mixed $property
        */
        private function implode_properties(&$value,$property)
        {
            // Implote properties add tab if compressed false.
            $value = ($this->compressed ? '':"\t") . $property . ':' . $value . ';';
        }
 
        /**
        * Block Imploder
        * @since 1.0
        * @param mixed $properties
        * @param mixed $block_name
        */
        private function implode_blocks(&$properties,$block_name)
        {
            $concanated = "";
 
            if(is_array($properties))
            {
                // Implode all properties as  property_name : value;
                array_walk($properties,array(&$this,'implode_properties'));
                // Implode blocks after their properties imploded
                $concanated = implode(!$this->compressed ? "\r\n" : '',$properties);
            }
 
            // add newlines if compressed false.
            if ($this->compressed)
                $properties = $block_name . '{' . $concanated . '}';
            else
                $properties = $block_name . " {\r\n" . $concanated . "\r\n}\r\n";
        }
 
        /**
        * @name Output writer
        * @since 1.0
        * Write or return output css code blocks
        * @param mixed $return
        * @return string
        */
        public function output($return=false)
        {
            if (!isset($this->cache_folder))
            {
                $blocks = $this->blocks;
                if (array_walk($blocks,array(&$this,'implode_blocks')))
                {
                    $output = implode($this->compressed ? ' ':"\r\n",$blocks);
                }
                else
                {
                    trigger_error('output failed.!',E_USER_ERROR);
                }
                unset($blocks);
            }
            else
            {
                if(is_file($this->cache_file))
                {
                    $output = file_get_contents($this->cache_file);
                }
                elseif(is_file($this->file))
                {
                    $this->__construct($this->file,true);
 
                    $cf = $this->cache_folder;
                    $this->cache_folder=null;
                    file_put_contents($this->cache_file,$output = $this->output(true));
                    $this->cache_folder = $cf;
 
                }
                else
                {
                    trigger_error('Cache cannot be created.',E_USER_ERROR);
                }
            }
 
            if ($return)
                return $output;
            else
                echo $output;
        }
 
        /**
        * @name String Caster.
        * @since 1.0
        */
        public function __toString()
        {
            return $this->output(true);
        }
 
        /**
        * @name Destructor
        * @since 1.0
        * Unset used vars
        */
        public function __descructor()
        {
            unset($this->blocks,$this->referances);
        }
 
    }
?>

2 Responses to “css inheritance”

  1. yine harikalar yapmışşınız elinize saglık

  2. Hocam Yine süper iş çıkartmışsınız :)

Leave a Reply

(required)

(required)


− four = 2

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

© 2012 Tufan Suffusion theme by Sayontan Sinha