function createSlider() {
include('header.php');
\CEOS\Slider\enqueueTransitions();
wp_enqueue_script('ceos-slider-transition-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/transition.js');
?>
<?php
$editID = null;
if(isset($_GET['edit']) && is_numeric($_GET['edit'])) {
$editID = $_GET['edit'];
}
$editObj = new \CEOS\Slider\Slider();
$editObj->loadFromDatabase($editID);
?>
<div class="ceos-slider admin-page create-slider-page">
<form id="create-slider-form" method="POST" action="<?= \CEOS\Slider\PLUGIN_PATH_URL ?>services/push_slider.php" enctype="multipart/form-data">
<section id="slider-main">
<header id="main-header">
<h2 id="page-title">
<label for="title"><?= __('Create new slider') ?></label>
</h2>
<div id="titlediv">
<input id="title" type="text" maxlength="127" name="title" value="<?= $editObj->getTitle() ?>">
</div>
<hr />
<div id="page-header-msg-wrap">
<?php include('header_msg.php') ?>
</div>
</header>
<div id="slider-content-wrap">
<h4 id="slider-content-title"><?= __('Items') ?></h4>
<div id="slider-content-controls">
<input id="slide-add" type="button" class="button button-primary" value="+">
</div>
<ul id="slider-content"></ul>
</div>
</section>
<section id="slider-controls">
<h4><?= __('Settings') ?></h4>
<input type="hidden" name="id" value="<?= $editObj->getID() ?>">
<input type="hidden" id="remove" name="remove" value="">
<input type="hidden" id="nonce" name="nonce" value="<?= wp_create_nonce(\CEOS\Slider\PLUGIN_PREFIX.'_editslider_'.get_current_user_id()) ?>">
<div id="slider-settings">
<div class="set-row">
<label class="main" for="opt-transition"><?= __('Transition') ?></label>
<select id="opt-transition" name="opt-transition">
<option value="none" <?= $editObj->getDefaultTransitionName() == 'none' ? 'selected' : '' ?>><?= __('None') ?></option>
<?php if(is_array($transitions)) : ?>
<?php foreach($transitions as $t) : ?>
<option value="<?= $t['name'] ?>" <?= $editObj->getDefaultTransitionName() == $t['name'] ? 'selected' : '' ?>><?= $t['title'] ?></option>
<?php endforeach ?>
<?php endif ?>
</select>
</div>
<div class="set-row">
<label class="main" for="opt-transition-dur"><?= __('Transition duration') ?></label>
<input type="number" min="0" step="0.1" id="opt-transition-dur" name="opt-transition-dur" value="<?= ($editObj->getDefaultTransitionDuration() ? $editObj->getDefaultTransitionDuration() / 1000 : 1) ?>">
<label for="opt-transition-dur"><?= __('sec') ?></label>
</div>
<div class="set-row">
<label class="main" for="opt-interval"><?= __('Slider interval') ?></label>
<input type="number" min="1" step="1" id="opt-interval" name="opt-interval" value="<?= ($editObj->getDefaultInterval() ? $editObj->getDefaultInterval() / 1000 : 7) ?>">
<label for="opt-interval"><?= __('sec') ?></label>
</div>
<div class="set-row">
<label class="main" for="opt-init-delay"><?= __('Initialization delay') ?></label>
<input type="number" min="0" step="1" id="opt-init-delay" name="opt-init-delay" value="<?= ($editObj->getInitializationDelay() ? $editObj->getInitializationDelay() / 1000 : 0) ?>">
<label for="opt-init-delay"><?= __('sec') ?></label>
</div>
<div class="set-row">
<label class="main" for="opt-initial-item"><?= __('Initial item') ?></label>
<input type="number" min="0" step="1" id="opt-initial-item" name="opt-initial-item" value="<?= ($editObj->getInitialItem() ? $editObj->getInitialItem() : 0) ?>">
</div>
<hr />
<div class="set-row">
<label class="main" for="opt-pause-mouseover"><?= __('Pause on mouse over') ?></label>
<input type="checkbox" id="opt-pause-mouseover" name="opt-pause-mouseover" value="1" <?= $editObj->getPauseOnMouseOver() ? 'checked' : '' ?>>
</div>
<div class="set-row">
<label class="main" for="opt-show-next-prev"><?= __('Show Next/Previous controls') ?></label>
<input type="checkbox" id="opt-show-next-prev" name="opt-show-next-prev" value="1" <?= $editObj->getShowNextPrev() ? 'checked' : '' ?>>
</div>
<div class="set-row">
<label class="main" for="opt-show-nav"><?= __('Show navigation controls') ?></label>
<input type="checkbox" id="opt-show-nav" name="opt-show-nav" value="1" <?= $editObj->getShowNavigation() ? 'checked' : '' ?>>
</div>
<div class="set-row">
<label class="main" for="opt-show-interval"><?= __('Show interval') ?></label>
<input type="checkbox" id="opt-show-interval" name="opt-show-interval" value="1" <?= $editObj->getShowInterval() ? 'checked' : '' ?>>
</div>
<div class="set-row">
<label class="main" for="opt-restart"><?= __('Restart when finished') ?></label>
<input type="checkbox" id="opt-restart" name="opt-restart" value="1" <?= $editObj->getRestart() ? 'checked' : '' ?>>
</div>
<hr />
<div class="set-row">
<h4><?= __('Proportions') ?></h4>
<div class="set-row">
<label class="main" for="opt-adaptative"><?= __('Adapt to actual area size') ?></label>
<input type="checkbox" id="opt-adaptative" name="opt-adaptative" value="1" <?= $editObj->getAdaptative() ? 'checked' : '' ?>>
</div>
<div class="set-row inner">
<span id="prop-width-wrap">
<label class="main" for="opt-max-width"><?= __('Width') ?></label>
<input type="number" id="opt-max-width" name="opt-max-width" min="0" step="1" value="<?= ($editObj->getWidth() ? $editObj->getWidth() : 1920) ?>">
<label>px</label>
</span>
<span id="prop-height-wrap">
<label class="main" for="opt-max-height"><?= __('Height') ?></label>
<input type="number" id="opt-max-height" name="opt-max-height" min="0" step="1" value="<?= ($editObj->getHeight() ? $editObj->getHeight() : 640) ?>">
<label>px</label>
</span>
</div>
<div class="set-row inner">
<label class="main" for="opt-aspect-ratio"><?= __('Aspect ratio') ?></label>
<input type="number" id="opt-aspect-ratio" name="opt-aspect-ratio" min="0" step="0.0001" value="<?= ($editObj->getAspectRatio() ? $editObj->getAspectRatio() : 0.33) ?>">
</div>
</div>
</div>
<hr />
<div id="slider-publish-controls">
<input id="send-form" type="submit" class="button button-primary" value="<?= __('Publish') ?>">
</div>
</section>
</form>
</div>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function (){
<?php
for($i = 0; $i < $editObj->countItems(); $i++) {
$item = $editObj->getItem($i);
print 'CEOS.Slider.fillItem({
id: "' . $item->getID() . '",
image: "' . $item->getImageSource() . '",
title: "' . $item->getTitle() . '",
desc: "' . $item->getDescription() . '",
url: "' . $item->getURL() . '",
interval: "' . $item->getInterval() . '",
transition: "' . $item->getTransitionName() . '",
transitionDuration: "' . $item->getTransitionDuration() . '"}); ';
}
?>
})
</script>
<?php include('footer.php');
}
/**
* Loads the slider which has the given ID. If the second parameter is
* set to TRUE, it will also print the slider in the position where the
* object was instantiated.
*/
function __construct($id = null, $print = true)
{
wp_enqueue_script('ceos-slider-functions-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/functions.js');
wp_enqueue_script('ceos-slider-animation-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/animation.js');
wp_enqueue_script('ceos-slider-slider-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/slider.js');
wp_enqueue_script('ceos-slider-slider-item-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/slider_item.js');
wp_enqueue_script('ceos-slider-timer-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/timer.js');
wp_enqueue_script('ceos-slider-transition-js', \CEOS\Slider\PLUGIN_PATH_URL . 'scripts/transition.js');
\CEOS\Slider\enqueueTransitions();
wp_enqueue_style('ceos-slider-style', \CEOS\Slider\PLUGIN_PATH_URL . 'style.css');
if (isset($id)) {
$this->sliderID = $id;
$this->sliderObject = new Slider();
$this->sliderObject->loadFromDatabase($id);
if ($print) {
$this->printSlider();
}
}
}
