wp/wp-content/plugins/codecanyon-3027163-content-timeline-responsive-wordpress-plugin/pages/content_timeline_edit.php
<div class="wrap">
<?php
$title = '';
$settings = array(
'scroll-speed' => '500',
'easing' => 'easeOutSine',
'hide-years' => false,
'cat-type' => 'months',
'number-of-posts' => '30',
// style
'line-width' => '920',
'item-width' => '240',
'item-open-width' => '490',
'item-margin' => '20',
'item-height' => '360',
'read-more' => 'button',
'close-text' => 'Close',
'hide-line' => false,
'line-style' => 'light',
'hide-nav' => false,
'nav-style' => 'light',
'shdow' => 'show',
'button-hover-color' => '#1986ac',
'node-desc-color' => '#1986ac',
// item & open item
'item-back-color' => '#ffffff',
'item-background' => '',
'item-open-back-color' => '#ffffff',
'item-open-background' => '',
'item-image-height' => '150',
'item-image-border-width' => '5',
'item-image-border-color' => '#1986ac',
'item-open-image-height' => '150',
'item-open-content-padding' => '10',
'item-open-image-border-width' => '5',
'item-open-image-border-color' => '#1986ac',
// item fonts
'item-header-line-height' => '24',
'item-header-font-size' => '24',
'item-header-font-type' => 'regular',
'item-header-font-color' => '#2d2d2d',
'item-text-line-height' => '12',
'item-text-font-size' => '12',
'item-text-font-type' => 'regular',
'item-text-font-color' => '#4d4d4d',
// item open fonts
'item-open-header-line-height' => '24',
'item-open-header-font-size' => '24',
'item-open-header-font-type' => 'regular',
'item-open-header-font-color' => '#2d2d2d',
'item-open-text-line-height' => '12',
'item-open-text-font-size' => '12',
'item-open-text-font-type' => 'regular',
'item-open-text-font-color' => '#4d4d4d'
);
global $wpdb;
if(isset($_GET['id'])) {
global $wpdb;
$timeline = $wpdb->get_results('SELECT * FROM ' . $wpdb->base_prefix . 'ctimelines WHERE id='.$_GET['id']);
$timeline = $timeline[0];
$pageName = 'Edit timeline';
}
else {
$pageName = 'New timeline';
}
$title = $timeline->name;
foreach(explode('||',$timeline->settings) as $val) {
$expl = explode('::',$val);
$settings[$expl[0]] = $expl[1];
}
?>
<input type="hidden" id="plugin-url" value="<?php echo $this->url; ?>"/>
<h2><?php echo $pageName; ?>
<a href="<?php echo admin_url( "admin.php?page=contenttimeline" ); ?>" class="add-new-h2">Cancel</a>
</h2>
<div class="form_result"></div>
<form name="post_form" method="post" id="post_form">
<input type="hidden" name="timeline_id" id="timeline_id" value="<?php echo $_GET['id']; ?>" />
<div id="poststuf">
<div id="post-body" class="metabox-holder columns-2" style="margin-right:300px; padding:0;">
<div id="post-body-content">
<div id="titlediv">
<div id="titlewrap">
<label class="hide-if-no-js" style="visibility:hidden" id="title-prompt-text" for="title">Enter title here</label>
<input type="text" name="timeline_title" size="30" tabindex="1" value="<?php echo $title; ?>" id="title" autocomplete="off" />
</div>
</div>
<h2 class="alignleft" style="padding:0 0 10px 0;">Items</h2>
<a id="tsort-add-new" class="alignleft button button-highlighted" style="display:block; padding:3px 15px; margin:4px 10px;" href="#">+ Add New item</a>
<div class="clear"></div>
<ul id="timeline-sortable">
<?php
if ($timeline->items != '') {
$explode = explode('||',$timeline->items);
$itemsArray = array();
foreach ($explode as $it) {
$ex2 = explode('::', $it);
$key = substr($ex2[0],0,strpos($ex2[0],'-'));
$subkey = substr($ex2[0],strpos($ex2[0],'-')+1);
$itemsArray[$key][$subkey] = $ex2[1];
}
foreach ($itemsArray as $key => $arr) {
$num = substr($key,4);
?>
<li id="<?php echo $key; ?>" class="sortableItem">
<div class="tsort-plus">+</div>
<div class="tsort-header">Item <?php echo $num; ?> <small><i>- <?php echo $arr['item-title']; ?></i></small> <a href="#" class="tsort-delete"><i>delete</i></a></div>
<div class="tsort-content">
<div class="tsort-dataid">
<input type="checkbox" id="<?php echo $key; ?>-start-item" name="<?php echo $key; ?>-start-item" class="tsort-start-item alignright" <?php if($arr['start-item']) echo 'checked="checked"'; ?> />
<label for="<?php echo $key; ?>-start-item" class="alignright">Start item </label>
<span class="timeline-help">? <span class="timeline-tooltip">Argument by which are elements organised (date - dd/mm/yyyy, Category - full category name). Different field is used for different categorizing type.</span></span>
<label for="<?php echo $key; ?>-dataid">Date</label>
<input style="margin-left:5px;" id="<?php echo $key; ?>-dataid" name="<?php echo $key; ?>-dataid" value="<?php echo $arr['dataid']; ?>" type="text" class="data_id" />
<label style="margin-left:5px;" for="<?php echo $key; ?>-categoryid">Category</label>
<input style="margin-left:5px;" id="<?php echo $key; ?>-categoryid" name="<?php echo $key; ?>-categoryid" value="<?php echo $arr['categoryid']; ?>" class="category_id" type="text"/>
<label style="margin-left:5px;" for="<?php echo $key; ?>-node-name">Title of the timeline node (optional)</label>
<input style="margin-left:5px;" id="<?php echo $key; ?>-node-name" name="<?php echo $key; ?>-node-name" value="<?php echo $arr['node-name']; ?>" type="text" />
</div>
<div class="tsort-item">
<h3 style="padding-left:0;"><span class="timeline-help">? <span class="timeline-tooltip">Base item content (image, title and content).</span></span>Item Options</h3>
<div class="tsort-image"><img id="<?php echo $key; ?>-item-image" src="<?php echo(($arr['item-image'] != '') ? $this->url . '/timthumb/timthumb.php?src=' . $arr['item-image'] . '&w=258&50' : $this->url . '/images/no_image.jpg'); ?>" /><a href="#" id="<?php echo $key; ?>-item-image-change" class="tsort-change">Change</a>
<input id="<?php echo $key; ?>-item-image-input" name="<?php echo $key; ?>-item-image" type="hidden" value="<?php echo $arr['item-image']; ?>" />
<a href="#" id="<?php echo $key; ?>-item-image-remove" class="tsort-remove">Remove</a>
</div>
<input class="tsort-title" name="<?php echo $key; ?>-item-title" value="<?php echo $arr['item-title']; ?>" type="text" />
<div class="clear"></div>
<textarea class="tsort-contarea" name="<?php echo $key; ?>-item-content"><?php echo $arr['item-content']; ?></textarea>
<table style="width:100%;">
<tr>
<td style="width:120px;"><span class="timeline-help">? <span class="timeline-tooltip">"PrittyPhoto"(Lightbox) URL, it can be image, video or site url. LEAVE IT EMPTY TO DESPLAY FULL SIZED IMGAE.</span></span><label for="<?php echo $key; ?>-item-prettyPhoto">PrettyPhoto URL</label></td>
<td><input class="tsort-prettyPhoto" name="<?php echo $key; ?>-item-prettyPhoto" value="<?php echo $arr['item-prettyPhoto']; ?>" type="text" style="width:100%;" /></td>
</tr>
</table>
</div>
<div class="tsort-itemopen">
<h3 style="padding-left:0;"><span class="timeline-help">? <span class="timeline-tooltip">Opened item content (image, title and content).</span></span>Item Open Options</h3>
<div class="tsort-image"><img id="<?php echo $key; ?>-item-open-image" src="<?php echo(($arr['item-open-image'] != '') ? $this->url . '/timthumb/timthumb.php?src=' . $arr['item-open-image'] . '&w=258&50' : $this->url . '/images/no_image.jpg'); ?>" /><a href="#" id="<?php echo $key; ?>-item-open-image-change" class="tsort-change">Change</a>
<input id="<?php echo $key; ?>-item-open-image-input" name="<?php echo $key; ?>-item-open-image" type="hidden" value="<?php echo $arr['item-open-image']; ?>" />
<a href="#" id="<?php echo $key; ?>-item-open-image-remove" class="tsort-remove">Remove</a>
</div>
<input class="tsort-title" name="<?php echo $key; ?>-item-open-title" value="<?php echo $arr['item-open-title']; ?>" type="text" />
<div class="clear"></div>
<textarea class="tsort-contarea" name="<?php echo $key; ?>-item-open-content"><?php echo $arr['item-open-content']; ?></textarea>
<table style="width:100%;">
<tr>
<td style="width:120px;"><span class="timeline-help">? <span class="timeline-tooltip">"PrettyPhoto"(Lightbox) URL, it can be image, video or site url. LEAVE IT EMPTY TO DESPLAY FULL SIZED IMGAE.</span></span><label for="<?php echo $key; ?>-item-open-prettyPhoto">PrettyPhoto URL</label></td>
<td><input class="tsort-prettyPhoto" name="<?php echo $key; ?>-item-open-prettyPhoto" value="<?php echo $arr['item-open-prettyPhoto']; ?>" type="text" style="width:100%;" /></td>
</tr>
</table>
<label for="<?php echo $key; ?>-desable-scroll">Desable Scroll </label>
<input type="checkbox" id="<?php echo $key; ?>-desable-scroll" name="<?php echo $key; ?>-desable-scroll" <?php if($arr['desable-scroll']) echo 'checked="checked"'; ?> />
</div>
</div>
</li>
<?php
}
} ?>
</ul>
<div class="clear"></div>
<div id="style_preview">
</div>
</div>
<div id="postbox-container-1" class="postbox-container">
<div class="postbox">
<h3 class='hndle' style="cursor:auto"><span>Publish</span></h3>
<div class="inside">
<div id="save-progress" class="waiting ajax-saved" style="background-image: url(<?php echo esc_url( admin_url( 'images/wpspin_light.gif' ) ); ?>)" ></div>
<input name="preview-timeline" id="preview-timeline" value="Preview" class="button button-highlighted" style="padding:3px 25px" type="submit" />
<input name="save-timeline" id="save-timeline" value="Save timeline" class="alignright button button-primary" style="padding:3px 15px" type="submit" />
<img id="save-loader" src="<?php echo $this->url; ?>images/ajax-loader.gif" class="alignright" />
<br class="clear" />
</div>
</div>
<div id="side-sortables" class="meta-box-sortables ui-sortable">
<div id="bla1" class="postbox" >
<div class="handlediv" title="Click to toggle"><br /></div>
<h3 class='hndle'><span>General Options</span></h3>
<div class="inside">
<table class="fields-group misc-pub-section">
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Transition speed (default 500px).</span></span>
<label for="scroll-speed" >Scroll Speed</label>
</td>
<td>
<input id="scroll-speed" name="scroll-speed" value="<?php echo $settings['scroll-speed']; ?>" size="5" type="text">
<span class="unit">ms</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Transition easing function (default 'easeOutSine').</span></span>
<label for="easing" >Easing</label>
</td>
<td>
<select name="easing">
<?php
$easingArray = array('easeInQuad', 'easeOutQuad','easeInOutQuad','easeInCubic','easeOutCubic','easeInOutCubic','easeInQuart','easeOutQuart','easeInOutQuart','easeInQuint','easeOutQuint','easeInOutQuint','easeInSine','easeOutSine','easeInOutSine','easeInExpo','easeOutExpo','easeInOutExpo','easeInCirc','easeOutCirc','easeInOutCirc','easeInElastic','easeOutElastic','easeInOutElastic','easeInBack','easeOutBack','easeInOutBack','easeInBounce','easeOutBounce','easeInOutBounce');
foreach ($easingArray as $item) {
echo '
<option value="'.$item.'" '.(($item == $settings['easing']) ? 'selected="selected"' : '').'>'.$item.'</option>';
}
?>
</select>
</td>
</tr>
</table>
<div class="misc-pub-section timeline-pub-section">
<h3 style="margin-top:0; background:transparent;"><span class="timeline-help">? <span class="timeline-tooltip">Options for categorizing your posts.</span></span>Chronological Options</h3>
<table class="fields-group">
<tr class="field-row">
<td>
<label for="hide-years">Hide Years</label>
</td>
<td>
<input id="hide-years" name="hide-years" value="true" type="checkbox" <?php echo (($settings['hide-years']) ? 'checked="checked"' : '');?> />
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Organize posts by date or some other criteria.</span></span>
<label for="cat-type">Type</label>
</td>
<td>
<select id="cat-type" name="cat-type">
<option value="months" <?php echo (($settings['cat-type'] == 'months') ? 'selected="selected"' : ''); ?> >Months</option>
<option value="categories" <?php echo (($settings['cat-type'] == 'categories') ? 'selected="selected"' : ''); ?>>Categories</option>
</select>
<?php
?>
</td>
</tr>
<tr class="cat-display">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Number of posts per category/month (default 30).</span></span>
<label for="number-per-cat">Number of posts</label>
</td>
<td>
<input id="number-of-posts" name="number-of-posts" value="<?php echo $settings['number-of-posts']; ?>" size="5" type="text">
</td>
</tr>
<tr class="cat-display">
<td colspan="2" style="width:100%;">
<h4 style="margin:0 0 5px 0; font-size:14px; border-bottom:1px solid #dddddd;">Categories:</h4>
<?php
$post_types=get_post_types('','names');
$categories = array();
foreach ($post_types as $post_type ) {
if (!in_array($post_type, array('page', 'attachment', 'revision', 'nav_menu_item'))) {
$newCats = get_categories(array('type' => $post_type));
foreach ($newCats as $post_cat) {
if (!in_array($post_cat, $categories)) {
array_push($categories, $post_cat);
}
}
}
}
$catString = '';
foreach ($categories as $category) {
$catString .= $category->name . '||';
echo '
<label for="cat-name-'.$category->term_id.'">'.$category->name.'</label>
<input class="cat-name" name="cat-name-'.$category->term_id.'" value="'.$category->name.'" type="checkbox" '.(($settings['cat-name-'.$category->term_id]) ? 'checked="checked"' : '').'>';
}
if($catString != '') {
echo '<input type="hidden" id="categories-hidden" value="'.substr($catString,0,strlen($catString)-2).'" />';
}
?>
</td>
</tr>
<tr class="cat-display">
<td colspan="2" style="width:100%">
<a href="#" id="cat-check-all" class="button button-highlighted alignleft" style="padding:3px 25px" >Chech all</a>
<a href="#" id="cat-uncheck-all" class="button button-highlighted alignright" style="padding:3px 25px" >Unchech all</a>
<div class="clear"></div>
</td>
</tr>
</table>
</div>
</div>
</div><!-- /GENERAL OPTIONS -->
<div id="bla2" class="postbox" >
<div class="handlediv" title="Click to toggle"><br /></div>
<h3 class='hndle'><span>Global Styling Options</span></h3>
<div class="inside">
<table class="fields-group misc-pub-section">
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Width of the line element (default 920px).</span></span>
<label for="line-width" >Timeline Width</label>
</td>
<td>
<input id="line-width" name="line-width" value="<?php echo $settings['line-width']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Space between two items. If negative items overlap. (default 20px).</span></span>
<label for="item-margin" >Item Margin</label>
</td>
<td>
<input id="item-margin" name="item-margin" value="<?php echo $settings['item-margin']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Height of Item and Open item elements (default 360px).</span></span>
<label for="item-height" >Item Height</label>
</td>
<td>
<input id="item-height" name="item-height" value="<?php echo $settings['item-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Read more button ('Button' : adds read more button, 'Whole Item' : makes the entire item clickable, 'None' : Items don't open).</span></span>
<label for="read-more">Read more</label>
</td>
<td>
<select name="read-more" id="read-more">
<option value="button" <?php if($settings['read-more'] == 'button') echo 'selected="selected"'; ?>>Button</option>
<option value="whole-item" <?php if($settings['read-more'] == 'whole-item') echo 'selected="selected"'; ?>>Whole Item</option>
<option value="none" <?php if($settings['read-more'] == 'none') echo 'selected="selected"'; ?>>None</option>
</select>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Text of the 'Close' element in open item (default 'Close').</span></span>
<label for="close-text" >Close button text</label>
</td>
<td>
<input id="close-text" name="close-text" value="<?php echo $settings['close-text']; ?>" size="20" type="text">
</td>
</tr>
<tr>
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Hover color of 'Read More' and 'Close' buttons.</span></span>
<label for="button-hover-color">Button hover color</label>
</td>
<td>
<input id="button-hover-color" name="button-hover-color" value="<?php echo $settings['button-hover-color']; ?>" type="text" style="background:#<?php echo $settings['button-hover-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="button-hover-color-picker" class="cw-color-picker" rel="button-hover-color"></div>
</div>
</td>
</tr>
<tr>
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Color of description bar that appears when you hover date on the timeline.</span></span>
<label for="node-desc-color">Node description color</label>
</td>
<td>
<input id="node-desc-color" name="node-desc-color" value="<?php echo $settings['node-desc-color']; ?>" type="text" style="background:#<?php echo $settings['node-desc-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="node-desc-color-picker" class="cw-color-picker" rel="node-desc-color"></div>
</div>
</td>
</tr>
<tr class="field-row">
<td>
<label for="hide-line">Hide Timeline</label>
</td>
<td>
<input id="hide-line" name="hide-line" value="true" type="checkbox" <?php echo ($settings['hide-line'] ? 'checked="checked"' : '' ); ?>>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Color scheme of timeline element (default 'Light').</span></span>
<label for="line-style">Line Style</label>
</td>
<td>
<select name="line-style">
<option value="light" <?php echo (($settings['line-style'] == 'light') ? 'selected="selected"' : '' ); ?>>Light</option>
<option value="dark" <?php echo (($settings['line-style'] == 'dark') ? 'selected="selected"' : '' ); ?>>Dark</option>
</select>
</td>
</tr>
<tr class="field-row">
<td>
<label for="hide-nav">Hide Navigation</label>
</td>
<td>
<input id="hide-nav" name="hide-nav" value="true" type="checkbox" <?php echo ($settings['hide-nav'] ? 'checked="checked"' : '' ); ?>>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Color scheme of nav elements (default 'Light').</span></span>
<label for="line-style">Nav Style</label>
</td>
<td>
<select name="nav-style">
<option value="light" <?php echo (($settings['nav-style'] == 'light') ? 'selected="selected"' : '' ); ?>>Light</option>
<option value="dark" <?php echo (($settings['nav-style'] == 'dark') ? 'selected="selected"' : '' ); ?>>Dark</option>
</select>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Shadow under elements (default 'show').</span></span>
<label for="shadow">Shadow</label>
</td>
<td>
<select name="shadow">
<option value="show" <?php echo (($settings['shadow'] == 'show') ? 'selected="selected"' : '' ); ?>>Show</option>
<option value="on-hover" <?php echo (($settings['shadow'] == 'on-hover') ? 'selected="selected"' : '' ); ?>>Show On Hover</option>
<option value="hide" <?php echo (($settings['shadow'] == 'hide') ? 'selected="selected"' : '' ); ?>>Hide</option>
</select>
</td>
</tr>
</table>
</div>
</div><!-- /GLOBAL STYLING OPTIONS -->
<div id="bla3" class="postbox" >
<div class="handlediv" title="Click to toggle"><br /></div>
<h3 class='hndle'><span>Item Styling Options</span></h3>
<div class="inside">
<table class="fields-group misc-pub-section">
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Width of items (default 240px).</span></span>
<label for="item-width" >Width</label>
</td>
<td>
<input id="item-width" name="item-width" value="<?php echo $settings['item-width']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Height of images (Width is strached to element width).</span></span>
<label for="item-image-height" >Image Height</label>
</td>
<td>
<input id="item-image-height" name="item-image-height" value="<?php echo $settings['item-image-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-image-border-width" >Image Border Width</label>
</td>
<td>
<input id="item-image-border-width" name="item-image-border-width" value="<?php echo $settings['item-image-border-width']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr>
<td>
<label for="item-image-border-color">Image Border Color</label>
</td>
<td>
<input id="item-image-border-color" name="item-image-border-color" value="<?php echo $settings['item-image-border-color']; ?>" type="text" style="background:#<?php echo $settings['item-image-border-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="item-image-border-color-picker" class="cw-color-picker" rel="item-image-border-color"></div>
</div>
</td>
</tr>
</table>
<div class="misc-pub-section timeline-pub-section">
<h3 style="margin-top:0; background:transparent;"><span class="timeline-help">? <span class="timeline-tooltip">Font-family is inharited from your theme default fonts for H2 and default text.</span></span>Fonts</h3>
<table class="fields-group">
<tr class="field-row">
<td>
<label for="item-header-line-height" >Title Line Height</label>
</td>
<td>
<input id="item-header-line-height" name="item-header-line-height" value="<?php echo $settings['item-header-line-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-header-font-size" >Title Font Size</label>
</td>
<td>
<input id="item-header-font-size" name="item-header-font-size" value="<?php echo $settings['item-header-font-size']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-header-font-type" >Title Font Type</label>
</td>
<td>
<select name="item-header-font-type">
<option value="regular" <?php echo (($settings['item-header-font-type'] == 'regular') ? 'selected="selected"' : '' ); ?>>Regular</option>
<option value="thick" <?php echo (($settings['item-header-font-type'] == 'thick') ? 'selected="selected"' : '' ); ?>>Thick</option>
<option value="bold" <?php echo (($settings['item-header-font-type'] == 'bold') ? 'selected="selected"' : '' ); ?>>Bold</option>
<option value="bold-italic" <?php echo (($settings['item-header-font-type'] == 'bold-italic') ? 'selected="selected"' : '' ); ?>>Bold-Italic</option>
<option value="italic" <?php echo (($settings['item-header-font-type'] == 'italic') ? 'selected="selected"' : '' ); ?>>Italic</option>
</select>
</td>
</tr>
<tr>
<td>
<label for="item-header-font-color">Title Color</label>
</td>
<td>
<input id="item-header-font-color" name="item-header-font-color" value="<?php echo $settings['item-header-font-color']; ?>" type="text" style="background:#<?php echo $settings['item-header-font-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="item-header-font-color-picker" class="cw-color-picker" rel="item-header-font-color"></div>
</div>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-text-line-height" >Text Line Height</label>
</td>
<td>
<input id="item-text-line-height" name="item-text-line-height" value="<?php echo $settings['item-text-line-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-text-font-size" >Text Font Size</label>
</td>
<td>
<input id="item-text-font-size" name="item-text-font-size" value="<?php echo $settings['item-text-font-size']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-text-font-type" >Text Font Type</label>
</td>
<td>
<select name="item-text-font-type">
<option value="regular" <?php echo (($settings['item-text-font-type'] == 'regular') ? 'selected="selected"' : '' ); ?>>Regular</option>
<option value="thick" <?php echo (($settings['item-text-font-type'] == 'thick') ? 'selected="selected"' : '' ); ?>>Thick</option>
<option value="bold" <?php echo (($settings['item-text-font-type'] == 'bold') ? 'selected="selected"' : '' ); ?>>Bold</option>
<option value="bold-italic" <?php echo (($settings['item-text-font-type'] == 'bold-italic') ? 'selected="selected"' : '' ); ?>>Bold-Italic</option>
<option value="italic" <?php echo (($settings['item-text-font-type'] == 'italic') ? 'selected="selected"' : '' ); ?>>Italic</option>
</select>
</td>
</tr>
<tr>
<td>
<label for="item-text-font-color">Text Color</label>
</td>
<td>
<input id="item-text-font-color" name="item-text-font-color" value="<?php echo $settings['item-text-font-color']; ?>" type="text" style="background:#<?php echo $settings['item-text-font-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="item-text-font-color-picker" class="cw-color-picker" rel="item-text-font-color"></div>
</div>
</td>
</tr>
</table>
</div>
<div class="misc-pub-section timeline-pub-section">
<h3 style="margin-top:0; background:transparent;"><span class="timeline-help">? <span class="timeline-tooltip">Base item background options.</span></span>Background</h3>
<label>Color:</label>
<input id="item-back-color" name="item-back-color" value="<?php echo $settings['item-back-color']; ?>" type="text" style="background:#<?php echo $settings['item-back-color']; ?>;">
<div class="cw-color-picker-holder">
<div id="item-back-color-picker" class="cw-color-picker" rel="item-back-color"></div>
</div>
<label>Image:</label>
<div class="cw-image-select-holder">
<input id="item-background-input" name="item-background" type="hidden" value="<?php echo $settings['item-background']; ?>" />
<a href="#" id="item-background" class="cw-image-upload" style="<?php echo 'background: url(' . (($settings['item-background'] != '') ? $settings['item-background'] : $this->url . '/images/no_image.jpg') . ');'; ?>"></a>
<small>Click on image to change, or <a href="#" class="remove-image">remove image</a></small>
</div>
</div>
</div>
</div><!-- /ITEM STYLING OPTIONS -->
<div id="bla4" class="postbox" >
<div class="handlediv" title="Click to toggle"><br /></div>
<h3 class='hndle'><span>Styling Options</span></h3>
<div class="inside">
<table class="fields-group misc-pub-section">
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Width of open items (default 490px).</span></span>
<label for="item-open-width" >Width</label>
</td>
<td>
<input id="item-open-width" name="item-open-width" value="<?php echo $settings['item-open-width']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Padding of open items content.</span></span>
<label for="item-open-content-padding" >Content Padding</label>
</td>
<td>
<input id="item-open-content-padding" name="item-open-content-padding" value="<?php echo $settings['item-open-content-padding']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<span class="timeline-help">? <span class="timeline-tooltip">Height of images (Width is strached to element width).</span></span>
<label for="item-open-image-height" >Image Height</label>
</td>
<td>
<input id="item-open-image-height" name="item-open-image-height" value="<?php echo $settings['item-open-image-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-open-image-border-width" >Image Border Width</label>
</td>
<td>
<input id="item-open-image-border-width" name="item-open-image-border-width" value="<?php echo $settings['item-open-image-border-width']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr>
<td>
<label for="item-open-image-border-color">Image Border Color</label>
</td>
<td>
<input id="item-open-image-border-color" name="item-open-image-border-color" value="<?php echo $settings['item-open-image-border-color']; ?>" type="text" style="background:#<?php echo $settings['item-open-image-border-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="item-open-image-border-color-picker" class="cw-color-picker" rel="item-open-image-border-color"></div>
</div>
</td>
</tr>
</table>
<div class="misc-pub-section timeline-pub-section">
<h3 style="margin-top:0; background:transparent;"><span class="timeline-help">? <span class="timeline-tooltip">Font-family is inharited from your theme default fonts for H2 and default text.</span></span>Fonts</h3>
<table class="fields-group">
<tr class="field-row">
<td>
<label for="item-open-header-line-height" >Title Line Height</label>
</td>
<td>
<input id="item-open-header-line-height" name="item-open-header-line-height" value="<?php echo $settings['item-open-header-line-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-open-header-font-size" >Title Font Size</label>
</td>
<td>
<input id="item-open-header-font-size" name="item-open-header-font-size" value="<?php echo $settings['item-open-header-font-size']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-open-header-font-type" >Title Font Type</label>
</td>
<td>
<select name="item-open-header-font-type">
<option value="regular" <?php echo (($settings['item-open-header-font-type'] == 'regular') ? 'selected="selected"' : '' ); ?>>Regular</option>
<option value="thick" <?php echo (($settings['item-open-header-font-type'] == 'thick') ? 'selected="selected"' : '' ); ?>>Thick</option>
<option value="bold" <?php echo (($settings['item-open-header-font-type'] == 'bold') ? 'selected="selected"' : '' ); ?>>Bold</option>
<option value="bold-italic" <?php echo (($settings['item-open-header-font-type'] == 'bold-italic') ? 'selected="selected"' : '' ); ?>>Bold-Italic</option>
<option value="italic" <?php echo (($settings['item-open-header-font-type'] == 'italic') ? 'selected="selected"' : '' ); ?>>Italic</option>
</select>
</td>
</tr>
<tr>
<td>
<label for="item-open-header-font-color">Title Color</label>
</td>
<td>
<input id="item-open-header-font-color" name="item-open-header-font-color" value="<?php echo $settings['item-open-header-font-color']; ?>" type="text" style="background:#<?php echo $settings['item-open-header-font-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="item-open-header-font-color-picker" class="cw-color-picker" rel="item-open-header-font-color"></div>
</div>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-open-text-line-height" >Text Line Height</label>
</td>
<td>
<input id="item-open-text-line-height" name="item-open-text-line-height" value="<?php echo $settings['item-open-text-line-height']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-open-text-font-size" >Text Font Size</label>
</td>
<td>
<input id="item-open-text-font-size" name="item-open-text-font-size" value="<?php echo $settings['item-open-text-font-size']; ?>" size="5" type="text">
<span class="unit">px</span>
</td>
</tr>
<tr class="field-row">
<td>
<label for="item-open-text-font-type" >Text Font Type</label>
</td>
<td>
<select name="item-open-text-font-type">
<option value="regular" <?php echo (($settings['item-open-text-font-type'] == 'regular') ? 'selected="selected"' : '' ); ?>>Regular</option>
<option value="thick" <?php echo (($settings['item-open-text-font-type'] == 'thick') ? 'selected="selected"' : '' ); ?>>Thick</option>
<option value="bold" <?php echo (($settings['item-open-text-font-type'] == 'bold') ? 'selected="selected"' : '' ); ?>>Bold</option>
<option value="bold-italic" <?php echo (($settings['item-open-text-font-type'] == 'bold-italic') ? 'selected="selected"' : '' ); ?>>Bold-Italic</option>
<option value="italic" <?php echo (($settings['item-open-text-font-type'] == 'italic') ? 'selected="selected"' : '' ); ?>>Italic</option>
</select>
</td>
</tr>
<tr>
<td>
<label for="item-open-text-font-color">Text Color</label>
</td>
<td>
<input id="item-open-text-font-color" name="item-open-text-font-color" value="<?php echo $settings['item-open-text-font-color']; ?>" type="text" style="background:#<?php echo $settings['item-open-text-font-color']; ?>;">
<div class="cw-color-picker-holder" style="left:-70px;">
<div id="item-open-text-font-color-picker" class="cw-color-picker" rel="item-open-text-font-color"></div>
</div>
</td>
</tr>
</table>
</div>
<div class="misc-pub-section timeline-pub-section">
<h3 style="margin-top:0; background:transparent;"><span class="timeline-help">? <span class="timeline-tooltip">Open item background options.</span></span>Background</h3>
<label>Color:</label>
<input id="item-open-back-color" name="item-open-back-color" value="<?php echo $settings['item-open-back-color']; ?>" type="text" style="background:<?php echo $settings['item-open-back-color']; ?>;">
<div class="cw-color-picker-holder">
<div id="item-open-back-color-picker" class="cw-color-picker" rel="item-open-back-color"></div>
</div>
<label>Image:</label>
<div class="cw-image-select-holder">
<input id="item-open-background-input" name="item-open-background" type="hidden" value="<?php echo $settings['item-open-background']; ?>" />
<a href="#" id="item-open-background" class="cw-image-upload" style="<?php echo 'background: url(' . (($settings['item-open-background'] != '') ? $settings['item-open-background'] : $this->url . '/images/no_image.jpg') . ');'; ?>"></a>
<small>Click on image to change, or <a href="#" class="remove-image">remove image</a></small>
</div>
</div>
</div>
</div><!-- /ITEM OPEN STYLING OPTIONS -->
</div>
</div>
<div id="postbox-container-2" class="postbox-container">
<div id="normal-sortables" class="meta-box-sortables ui-sortable"></div>
</div>
<br class="clear"/>
</div>
</div>
</form>
</div>