Sådan benyttes komponenten CssCms klassen
Først skal du inkludere den fil der beskriver komponenten, som en klasse fil
<? require_once(HTML_PACKAGE_PATH.'/CssCms.php'); ?>
Dernæst kan du enten benytte komponenten som et taglib (statiske metoder):
<? CssCms::display($param1, $param2, $param3, ...); ?>
eller du kan lave en instance af komponenten og benytte metoderne direkte:
<? $object = new CssCms($param1, $param2, $param3, ...); print $object->getHtml(); ?>
Sådan vises komponenten CssCms klassen
Den fulde PHP kildekode for CssCms klassen
<?php/** * @package cms * @filesource * @see HTML_CMS_PAGE_PATH.'/CssCms.php' * @copyright (c) http://Finn-Rasmussen.com * @license http://Finn-Rasmussen.com/license/ myPHP License conditions * @author http://Finn-Rasmussen.com * @version 1.11 * @since 27-nov-2009 *//** * The required files */require_once(HTML_BASE_PAGE_PATH.'/Css.php');/** * Generates the CMS CSS * <code> * Usage: * $href = "cms.css"; * $css = new CssCms($href); * print $css->getHtml(); * Or: * CssCms::display($href); * </code> * @package cms */class CssCms extends Css { /** * Constructor * @param String $href The url to the css filename (i.e. cms.css) */ function __construct($href='') { parent::__construct($href != '' ? $href : CSS_FILE_NAME_CMS); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getToolbarA() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgToolbar a', CSS_NAME_DISPLAY=>CSS_DISPLAY_BLOCK, CSS_NAME_WIDTH=>'30px', CSS_NAME_HEIGHT=>'30px', CSS_NAME_OVERFLOW=>CSS_OVERFLOW_HIDDEN, CSS_NAME_BACKGROUND_REPEAT=>CSS_REPEAT_NO, CSS_NAME_TEXT_INDENT=>'-1000em', CSS_NAME_TEXT_DECORATION=>CSS_TEXT_DECORATION_NONE, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getToolbarHover() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgToolbar a:hover', CSS_NAME_BACKGROUND_POSITION=>'0 -30px', ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getToolbarActive() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgToolbar a:active', CSS_NAME_MARGIN_LEFT=>'2px', CSS_NAME_MARGIN_TOP=>'2px', CSS_NAME_BACKGROUND_POSITION=>'0 0', ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getCursor() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgSource .widgButtonHTML:hover', CSS_NAME_CURSOR=>CSS_CURSOR_POINTER, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getToolbar() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgToolbar', CSS_NAME_LIST_STYLE=>CSS_LIST_STYLE_NONE, CSS_NAME_WIDTH=>'100%', CSS_NAME_HEIGHT=>'48px', CSS_NAME_MARGIN=>'0', CSS_NAME_PADDING=>'0 0 0 2px', CSS_NAME_BORDER=>'1px solid #ccc', ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getToolbarHtml() { return array( CSS_NAME_STYLE_PROPERTY=>'* html .widgToolbar', CSS_NAME_WIDTH=>CSS_WIDTH_AUTO, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getToolbarLi() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgToolbar li', CSS_NAME_DISPLAY=>CSS_DISPLAY_INLINE, CSS_NAME_FLOAT=>CSS_LEFT, CSS_NAME_WIDTH=>'32px', CSS_NAME_HEIGHT=>'32px', CSS_NAME_MARGIN_TOP=>'9px', CSS_NAME_MARGIN_LEFT=>'7px', CSS_NAME_LINE_HEIGHT=>'30px', ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getIframe() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgIframe', CSS_NAME_CLEAR=>CSS_LEFT, CSS_NAME_WIDTH=>'100%', CSS_NAME_HEIGHT=>WIDGET_IFRAME_HEIGHT, CSS_NAME_BORDER_TOP_WIDTH=>'1px', CSS_NAME_PADDING=>'0', ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getEditor() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgContainer textarea.widgEditor', CSS_NAME_CLEAR=>CSS_LEFT, CSS_NAME_WIDTH=>'100%', CSS_NAME_HEIGHT=>WIDGET_TEXTAREA_HEIGHT, CSS_NAME_BORDER_TOP_WIDTH=>'1px', CSS_NAME_PADDING=>'0', ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getContainer() { return array( CSS_NAME_STYLE_PROPERTY=>'.widgContainer', ); } /** * Returns the css CMS components * @return String the complete css */ function getCustom() { $html = ''; $cr = ""; $tab = ""; if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $cr = "\r\n"; $tab = "\t"; } $html .= $this->getHeader($this->getClassName()); if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $html .= "/"."******************************************************************************\r\n"; $html .= " * STRUCTURE OF DYNAMICALLY CREATED ELEMENTS\r\n"; $html .= " ******************************************************************************\r\n"; $html .= " * <div id='ORIGINAL_IDWidgContainer' class='widgContainer'>\r\n"; $html .= " * <ul id='ORIGINAL_IDWidgToolbar' class='widgToolbar'>\r\n"; $html .= " * <li id='BUTTON_ID' class='widgEditButton'>\r\n"; $html .= " * <a></a>\r\n"; $html .= " * </li>\r\n"; $html .= " * <li class='widgEditSelect'>\r\n"; $html .= " * <select>\r\n"; $html .= " * </select>\r\n"; $html .= " * </li>\r\n"; $html .= " * </ul>\r\n"; $html .= " * <iframe id='ORIGINAL_IDWidgIframe' class='widgIframe'>\r\n"; $html .= " * </iframe>\r\n"; $html .= " * <textarea id='ORIGINAL_IDWidgTextarea' class='widgEditor'>\r\n"; $html .= " * </textarea>\r\n"; $html .= " * </div>\r\n"; $html .= " */\r\n"; } if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $html .= "/**\r\n"; $html .= " * TOOLBAR BUTTONS\r\n"; $html .= " */\r\n"; } // The CSS buttons to use $buttonHtml = new Images(WIDGET_BUTTON_HTML_GIF); $buttonBold = new Images(WIDGET_BUTTON_BOLD_GIF); $buttonItalic = new Images(WIDGET_BUTTON_ITALIC_GIF); $buttonLink = new Images(WIDGET_BUTTON_LINK_GIF); $buttonOrdered = new Images(WIDGET_BUTTON_ORDERED_GIF); $buttonUnordered = new Images(WIDGET_BUTTON_UNORDERED_GIF); $buttonEmpty = new Images(WIDGET_BUTTON_EMPTY_GIF); $buttonShadow = new Images(WIDGET_BUTTON_SHADOW_GIF); $buttonEdit = new Images(WIDGET_BUTTON_SHADOW_GIF); $buttonToolbar = new Images(WIDGET_BUTTON_SHADOW_GIF); $html .= $this->getImage(WIDGET_BUTTON_HTML , $buttonHtml->get('src')); $html .= $this->getImage(WIDGET_BUTTON_BOLD , $buttonBold->get('src')); $html .= $this->getImage(WIDGET_BUTTON_ITALIC , $buttonItalic->get('src')); $html .= $this->getImage(WIDGET_BUTTON_LINK , $buttonLink->get('src')); $html .= $this->getImage(WIDGET_BUTTON_ORDERED , $buttonOrdered->get('src')); $html .= $this->getImage(WIDGET_BUTTON_UNORDERED, $buttonUnordered->get('src')); $html .= $this->getImage(WIDGET_BUTTON_EMPTY , $buttonEmpty->get('src')); $html .= $this->getImage(WIDGET_BUTTON_SHADOW , $buttonShadow->get('src')); $html .= $this->getImage(WIDGET_BUTTON_EDIT , $buttonEdit->get('src'), CSS_REPEAT_NO); $html .= $this->getImage(WIDGET_TOOLBAR , $buttonToolbar->get('src'), CSS_REPEAT_NO); if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $html .= "/**$cr"; $html .= " * TOOLBAR links$cr"; $html .= " */$cr"; } $html .= $this->getCssArray($this->getToolbarA()); $html .= $this->getCssArray($this->getToolbarHover()); $html .= $this->getCssArray($this->getCursor()); $html .= $this->getCssArray($this->getToolbarActive()); if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $html .= "/**$cr"; $html .= " * TOOLBAR$cr"; $html .= " */$cr"; } $html .= $this->getCssArray($this->getToolbar()); $html .= $this->getCssArray($this->getToolbarHtml()); $html .= $this->getCssArray($this->getToolbarLi()); if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $html .= "/**$cr"; $html .= " * EDITING AREA$cr"; $html .= " */$cr"; } $html .= $this->getCssArray($this->getIframe()); $html .= $this->getCssArray($this->getEditor()); if (defined('DEBUG_LEVEL_SHOW_CSS') && DEBUG_LEVEL & DEBUG_LEVEL_SHOW_CSS) { $html .= "/**$cr"; $html .= " * EDITOR CONTAINER$cr"; $html .= " */$cr"; } $html .= $this->getCssArray($this->getContainer()); return $html; } /** * Display html * <code> * Usage: * $href = "cms.css"; * CssCms::display($href); * </code> * @static * @param String $href The url to the css file (i.e. cms.css) */ public static function display($href='') { $html = new CssCms($href); $html->addHtml(); }}?>
Den fulde HTML kildekode for CssCms klassen
<? <!-- DEBUG: CssCms --> <style type="text/css"> /*********************************************************** * * AUTOGENERATED file, DO NOT CHANGE OR EDIT, the full source code is here _____________________________________________________ ________| |________ \ | http://Finn-Rasmussen.com Phone (+45) 40 50 60 69 | / \ | Kongens Vænge 79, 3400 Hillerød, Denmark | / / |_____________________________________________________| \ /___________) (__________\ * * @version : 1.11 * @since : 06-Feb-2012 00:36:58 * @copyright : Copyright © 1999-2010 http://Finn-Rasmussen.com * * Email : Please, phone me for my email address * Web : http://Finn-Rasmussen.com * : This website was created by the myPHP taglib and CMS * : Download a free demo of the myPHP taglib here ... * : http://Finn-Rasmussen.com/myPHP/ * @domain : borebiller.info * @language : da * @webmaster : DEFAULT_CMS_LOGIN_USERNAME(+)borebiller.info * @file : /cache/files/borebiller.info-cms.css (Autocreated cache file) * @classname : CssCms ***********************************************************/ /****************************************************************************** * STRUCTURE OF DYNAMICALLY CREATED ELEMENTS ****************************************************************************** * <div id='ORIGINAL_IDWidgContainer' class='widgContainer'> * <ul id='ORIGINAL_IDWidgToolbar' class='widgToolbar'> * <li id='BUTTON_ID' class='widgEditButton'> * <a></a> * </li> * <li class='widgEditSelect'> * <select> * </select> * </li> * </ul> * <iframe id='ORIGINAL_IDWidgIframe' class='widgIframe'> * </iframe> * <textarea id='ORIGINAL_IDWidgTextarea' class='widgEditor'> * </textarea> * </div> */ /** * TOOLBAR BUTTONS */ .widgButtonHTML{ background-image : url('http://borebiller.info/images/widgEditor/button_html.gif'); } .widgButtonBold{ background-image : url('http://borebiller.info/images/widgEditor/button_bold.gif'); } .widgButtonItalic{ background-image : url('http://borebiller.info/images/widgEditor/button_italic.gif'); } .widgButtonLink{ background-image : url('http://borebiller.info/images/widgEditor/button_link.gif'); } .widgButtonOrdered{ background-image : url('http://borebiller.info/images/widgEditor/button_ordered.gif'); } .widgButtonUnordered{ background-image : url('http://borebiller.info/images/widgEditor/button_unordered.gif'); } .widgEmpty{ background-image : url('http://borebiller.info/images/widgEditor/button_empty.gif'); } .widgShadow{ background-image : url('http://borebiller.info/images/widgEditor/button_shadow.gif'); } li.widgEditButton{ background-image : url('http://borebiller.info/images/widgEditor/button_shadow.gif'); background-repeat : no-repeat; } .widgToolbar li.widgEditButton{ background-image : url('http://borebiller.info/images/widgEditor/button_shadow.gif'); background-repeat : no-repeat; } /** * TOOLBAR links */ .widgToolbar a{ display : block; width : 30px; height : 30px; overflow : hidden; background-repeat : no-repeat; text-indent : -1000em; text-decoration : none; } .widgToolbar a:hover{ background-position : 0 -30px; } .widgSource .widgButtonHTML:hover{ cursor : pointer; } .widgToolbar a:active{ margin-left : 2px; margin-top : 2px; background-position : 0 0; } /** * TOOLBAR */ .widgToolbar{ list-style : none; width : 100%; height : 48px; margin : 0; padding : 0 0 0 2px; border : 1px solid #ccc; } * html .widgToolbar{ width : auto; } .widgToolbar li{ display : inline; float : left; width : 32px; height : 32px; margin-top : 9px; margin-left : 7px; line-height : 30px; } /** * EDITING AREA */ .widgIframe{ clear : left; width : 100%; height : 600px; border-top-width : 1px; padding : 0; } .widgContainer textarea.widgEditor{ clear : left; width : 100%; height : 600px; border-top-width : 1px; padding : 0; } /** * EDITOR CONTAINER */ .widgContainer{ } /* DEBUG, Not cached, CSS Custom file : /cache/css/borebiller.info-cms.css */ </style> ?>
Her er 'klasse metoderne' for CssCms klassen:
Her er 'objekt variable' for CssCms klassen: