Commit 9f90a73a authored by Hermann Mayer's avatar Hermann Mayer

Implemented a generic modal builder (with a PHP Action and a switchable JS…

Implemented a generic modal builder (with a PHP Action and a switchable JS Class). Ported icons and editor builder to use this new modal builder. Implemented initial Sidebar Controller.
parent 4370a109
......@@ -42,6 +42,42 @@ class EditorController extends Controller
));
}
/**
* modalAction
*
* @param mixed $name
* @param array $buttons
* @param mixed $label
* @param mixed $body
* @param mixed $enableJS
* @access public
* @return void
*/
public function modalAction($name, $buttons = array(), $label = null, $body = null, $enableJS = false)
{
$reqBtn = array(
'id' => '',
'class' => '',
'icon' => '',
'value' => ''
);
$validBtns = array();
// Fill every button in a valid and required struct
foreach ($buttons as $button) {
$validBtns[] = array_merge($reqBtn, $button);
}
return $this->render('JityHomepageBundle:Editor:modal.html.twig', array(
'name' => $name,
'enableJS' => $enableJS,
'buttons' => $validBtns,
'label' => $label,
'body' => $body,
));
}
/**
* iconsAction
*
......
<?php
namespace Jity\HomepageBundle\Controller;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
use Jity\HomepageBundle\Entity\Sidebar;
use Jity\HomepageBundle\Entity\Section;
use Jity\HomepageBundle\Form\SidebarType;
/**
* Sidebar controller.
*
*/
class SidebarController extends Controller
{
/**
* Lists all Sidebar entities.
*
*/
public function indexAction()
{
$em = $this->getDoctrine()->getManager();
$entities = $em->getRepository('JityHomepageBundle:Sidebar')->findAll();
return $this->render('JityHomepageBundle:Sidebar:index.html.twig', array(
'entities' => $entities,
));
}
/**
* Finds and displays a Sidebar entity.
*
*/
public function showAction($id)
{
$em = $this->getDoctrine()->getManager();
$entity = $em->getRepository('JityHomepageBundle:Sidebar')->find($id);
if (!$entity) {
throw $this->createNotFoundException('Unable to find Sidebar entity.');
}
$deleteForm = $this->createDeleteForm($id);
return $this->render('JityHomepageBundle:Sidebar:show.html.twig', array(
'entity' => $entity,
'delete_form' => $deleteForm->createView(),
));
}
/**
* Displays a form to create a new Sidebar entity.
*
*/
public function newAction()
{
$entity = new Sidebar();
// -----------------------------------
$section1 = new Section();
$section1
->setTitle('Folgen')
->setContent('Dies ist Test-Inhalt. Im Moment hat dies hier noch keinen Effekt.')
;
$entity->addSection($section1);
$section2 = new Section();
$section2
->setTitle('Sektion 51')
->setContent('Auch diese Sektion ist ein Dummy. Die Entwicklung ist noch im Gange.')
;
$entity->addSection($section2);
// -----------------------------------
$form = $this->createForm(new SidebarType(), $entity);
return $this->render('JityHomepageBundle:Sidebar:new.html.twig', array(
'entity' => $entity,
'form' => $form->createView(),
));
}
/**
* Creates a new Sidebar entity.
*
*/
public function createAction(Request $request)
{
$entity = new Sidebar();
$form = $this->createForm(new SidebarType(), $entity);
$form->bind($request);
if ($form->isValid()) {
$em = $this->getDoctrine()->getManager();
$em->persist($entity);
$em->flush();
return $this->redirect($this->generateUrl('author_sidebar_show', array('id' => $entity->getId())));
}
return $this->render('JityHomepageBundle:Sidebar:new.html.twig', array(
'entity' => $entity,
'form' => $form->createView(),
));
}
/**
* Displays a form to edit an existing Sidebar entity.
*
*/
public function editAction($id)
{
$em = $this->getDoctrine()->getManager();
$entity = $em->getRepository('JityHomepageBundle:Sidebar')->find($id);
if (!$entity) {
throw $this->createNotFoundException('Unable to find Sidebar entity.');
}
$editForm = $this->createForm(new SidebarType(), $entity);
$deleteForm = $this->createDeleteForm($id);
return $this->render('JityHomepageBundle:Sidebar:edit.html.twig', array(
'entity' => $entity,
'edit_form' => $editForm->createView(),
'delete_form' => $deleteForm->createView(),
));
}
/**
* Edits an existing Sidebar entity.
*
*/
public function updateAction(Request $request, $id)
{
$em = $this->getDoctrine()->getManager();
$entity = $em->getRepository('JityHomepageBundle:Sidebar')->find($id);
if (!$entity) {
throw $this->createNotFoundException('Unable to find Sidebar entity.');
}
$deleteForm = $this->createDeleteForm($id);
$editForm = $this->createForm(new SidebarType(), $entity);
$editForm->bind($request);
if ($editForm->isValid()) {
$em->persist($entity);
$em->flush();
return $this->redirect($this->generateUrl('author_sidebar_edit', array('id' => $id)));
}
return $this->render('JityHomepageBundle:Sidebar:edit.html.twig', array(
'entity' => $entity,
'edit_form' => $editForm->createView(),
'delete_form' => $deleteForm->createView(),
));
}
/**
* Deletes a Sidebar entity.
*
*/
public function deleteAction(Request $request, $id)
{
$form = $this->createDeleteForm($id);
$form->bind($request);
if ($form->isValid()) {
$em = $this->getDoctrine()->getManager();
$entity = $em->getRepository('JityHomepageBundle:Sidebar')->find($id);
if (!$entity) {
throw $this->createNotFoundException('Unable to find Sidebar entity.');
}
$em->remove($entity);
$em->flush();
}
return $this->redirect($this->generateUrl('author_sidebar'));
}
private function createDeleteForm($id)
{
return $this->createFormBuilder(array('id' => $id))
->add('id', 'hidden')
->getForm()
;
}
}
......@@ -70,11 +70,11 @@ Hat Ihnen diese Seite gefallen? Teilen Sie sie doch mit Ihren
Freunden und Bekannten über Googles Soziales Netzwerk oder über Facebook.
</p>
<p>
<a href="https://plus.google.com/share?url={{ url(app.request.attributes.get("_route"))|url_encode }}&hl=de" class="btn btn-danger">
<a href="https://plus.google.com/share?url={{ app.request.uri|url_encode }}&hl=de" class="btn btn-danger">
<img src="{{ asset("bundles/jityhomepage/img/glyphicons_386_google_plus.png") }}" />
Google+
</a>
<a href="http://www.facebook.com/sharer.php?u={{ url(app.request.attributes.get("_route"))|url_encode }}&t=Hermann+Mayer" class="btn btn-primary">
<a href="http://www.facebook.com/sharer.php?u={{ app.request.uri|url_encode }}&t=Hermann+Mayer" class="btn btn-primary">
<img src="{{ asset("bundles/jityhomepage/img/glyphicons_390_facebook.png") }}" />
Facebook
</a>
......
<?php
namespace Jity\HomepageBundle\Form;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;
class SectionType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('title', null, array(
'label' => 'Titel'
))
->add('content', null, array(
'attr' => array(
'rows' => '6',
'class' => 'span4',
'data-target' => '#editor_modal',
'data-toggle' => 'modal'
),
'label' => 'Inhalt'
))
->add('group', 'entity', array(
'class'=>'Jity\HomepageBundle\Entity\Group',
'property' => 'name',
'label' => 'Sichtbar für Gruppe'
))
;
}
public function setDefaultOptions(OptionsResolverInterface $resolver)
{
$resolver->setDefaults(array(
'data_class' => 'Jity\HomepageBundle\Entity\Section'
));
}
public function getName()
{
return 'jity_homepagebundle_sectiontype';
}
}
<?php
namespace Jity\HomepageBundle\Form;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;
use Jity\HomepageBundle\Form\SectionType;
/**
* SidebarType
*
* @uses AbstractType
* @version $id$
* @author Hermann Mayer <hermann.mayer92@gmail.com>
*/
class SidebarType extends AbstractType
{
/**
* buildForm
*
* @param FormBuilderInterface $builder
* @param array $options
* @access public
* @return void
*/
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('name')
->add('sections', 'collection', array(
'type' => new SectionType(),
'label' => 'Verbundene Sektionen',
'label_attr' => array(
'class' => 'form_embedded_label'
)
))
;
}
/**
* setDefaultOptions
*
* @param OptionsResolverInterface $resolver
* @access public
* @return void
*/
public function setDefaultOptions(OptionsResolverInterface $resolver)
{
$resolver->setDefaults(array(
'data_class' => 'Jity\HomepageBundle\Entity\Sidebar'
));
}
/**
* getName
*
* @access public
* @return void
*/
public function getName()
{
return 'jity_homepagebundle_sidebartype';
}
}
......@@ -18,6 +18,10 @@ JityHomepageBundle_author_category:
resource: "@JityHomepageBundle/Resources/config/routing/category.yml"
prefix: /author/category
JityHomepageBundle_author_sidebar:
resource: "@JityHomepageBundle/Resources/config/routing/sidebar.yml"
prefix: /author/sidebar
JityHomepageBundle_user:
resource: "@JityHomepageBundle/Resources/config/routing/user.yml"
prefix: /user
......
author_sidebar:
pattern: /
defaults: { _controller: "JityHomepageBundle:Sidebar:index" }
author_sidebar_show:
pattern: /{id}/show
defaults: { _controller: "JityHomepageBundle:Sidebar:show" }
author_sidebar_new:
pattern: /new
defaults: { _controller: "JityHomepageBundle:Sidebar:new" }
author_sidebar_create:
pattern: /create
defaults: { _controller: "JityHomepageBundle:Sidebar:create" }
requirements: { _method: post }
author_sidebar_edit:
pattern: /{id}/edit
defaults: { _controller: "JityHomepageBundle:Sidebar:edit" }
author_sidebar_update:
pattern: /{id}/update
defaults: { _controller: "JityHomepageBundle:Sidebar:update" }
requirements: { _method: post }
author_sidebar_delete:
pattern: /{id}/delete
defaults: { _controller: "JityHomepageBundle:Sidebar:delete" }
requirements: { _method: post }
......@@ -117,7 +117,7 @@ footer {
h1, h2, h3, h4, h5, h6 {
font-family: 'Source Sans Pro', sans-serif;
font-weight: 600;
font-weight: 200;
}
.alert {
......@@ -205,15 +205,20 @@ p {
background-image: url("/bundles/jityhomepage/img/glyphicons-halflings-white.png") !important;
}
legend {
legend, .form_embedded_label {
color: #89827B;
border-color: #B54718;
/* font-weight: bold; */
font-family: 'Source Sans Pro', sans-serif;
font-weight: 300;
font-size: 26px;
}
.form_embedded_label {
border-bottom: 1px solid #B54718;
margin-bottom: 20px;
padding-bottom: 8px;
}
textarea, input[type="text"], input[type="password"], input[type="datetime"],
input[type="datetime-local"], input[type="date"], input[type="month"],
input[type="time"], input[type="week"], input[type="number"], input[type="email"],
......@@ -351,3 +356,43 @@ hr {
background-color: #2C2A28;
}
.sortable {
border-top: 2px solid #722C0F;
background-color: #181818;
border-radius: 6px 6px 6px 6px;
margin-top: 30px;
padding: 20px;
position: relative;
}
.sortable .dragbar {
cursor: pointer;
position: absolute;
top: 0;
left: 0;
width: 15px;
height: 100%;
border-radius: 6px 0px 0px 6px;
background-color: #0F0F0F;
border-right: 1px solid #282624;
}
.sortable .controllpanel {
position: absolute;
top: 0;
right: 0;
width: 100px;
height: 33px;
border-radius: 6px 6px 6px 6px;
padding: 5px;
padding-left: -5px;
background-color: #0F0F0F;
border-left: 1px solid #282624;
border-bottom: 1px solid #282624;
}
.sortable .controllpanel .btn {
margin-left: 5px;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -21,7 +21,7 @@
Navigationen
</a>
<a href="{{ path('home') }}" class="btn btn-danger">
<a href="{{ path('author_sidebar') }}" class="btn btn-danger">
<i class="icon-list icon-white"></i>
Sidebars
</a>
......
<div class="modal hide fade" id="editor_modal" tabindex="-1" role="dialog" aria-labelledby="editor_label" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="editor_label">{{ title|raw }}</h3>
</div>
<div class="modal-body">
{% render 'JityHomepageBundle:Editor:modal' with {
'name': 'editor',
'label': title|raw,
'enableJS': false,
'buttons': [
{
'id': 1,
'class': 'btn-primary',
'icon': 'icon-ok',
'value': 'Änderung speichern'
},
],
'body': '
<div id="editor"></div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="$('#editor_modal').modal('hide');"><i class="icon-pencil icon-white"></i> Änderung speichern</button>
</div>
</div>
',
} %}
<script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
......
<div class="modal hide fade" id="icons_modal" tabindex="-1" role="dialog" aria-labelledby="icons_label" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="icons_label">Auswahl der Icons</h3>
</div>
<div class="modal-body">
<div id="icons">
{% render 'JityHomepageBundle:Editor:modal' with {
'name': 'icons',
'label': 'Auswahl der Icons',
'enableJS': false,
'buttons': [
{
'id': 1,
'class': 'btn-primary',
'icon': 'icon-share-alt',
'value': 'Abbrechen'
},
],
'body': '
<ul class="the-icons clearfix">
<li><i class="icon-white icon-glass"></i> icon-glass</li>
<li><i class="icon-white icon-music"></i> icon-music</li>
<li><i class="icon-white icon-search"></i> icon-search</li>
<li><i class="icon-white icon-envelope"></i> icon-envelope</li>
<li><i class="icon-white icon-heart"></i> icon-heart</li>
<li><i class="icon-white icon-star"></i> icon-star</li>
<li><i class="icon-white icon-star-empty"></i> icon-star-empty</li>
<li><i class="icon-white icon-user"></i> icon-user</li>
<li><i class="icon-white icon-film"></i> icon-film</li>
<li><i class="icon-white icon-th-large"></i> icon-th-large</li>
<li><i class="icon-white icon-th"></i> icon-th</li>
<li><i class="icon-white icon-th-list"></i> icon-th-list</li>
<li><i class="icon-white icon-ok"></i> icon-ok</li>
<li><i class="icon-white icon-remove"></i> icon-remove</li>
<li><i class="icon-white icon-zoom-in"></i> icon-zoom-in</li>
<li><i class="icon-white icon-zoom-out"></i> icon-zoom-out</li>
<li><i class="icon-white icon-off"></i> icon-off</li>
<li><i class="icon-white icon-signal"></i> icon-signal</li>
<li><i class="icon-white icon-cog"></i> icon-cog</li>
<li><i class="icon-white icon-trash"></i> icon-trash</li>
<li><i class="icon-white icon-home"></i> icon-home</li>
<li><i class="icon-white icon-file"></i> icon-file</li>
<li><i class="icon-white icon-time"></i> icon-time</li>
<li><i class="icon-white icon-road"></i> icon-road</li>
<li><i class="icon-white icon-download-alt"></i> icon-download-alt</li>
<li><i class="icon-white icon-download"></i> icon-download</li>
<li><i class="icon-white icon-upload"></i> icon-upload</li>
<li><i class="icon-white icon-inbox"></i> icon-inbox</li>
<ul class="the-icons clearfix">
<li><i class="icon-white icon-glass"></i> icon-glass</li>
<li><i class="icon-white icon-music"></i> icon-music</li>
<li><i class="icon-white icon-search"></i> icon-search</li>
<li><i class="icon-white icon-envelope"></i> icon-envelope</li>
<li><i class="icon-white icon-heart"></i> icon-heart</li>
<li><i class="icon-white icon-star"></i> icon-star</li>
<li><i class="icon-white icon-star-empty"></i> icon-star-empty</li>
<li><i class="icon-white icon-user"></i> icon-user</li>
<li><i class="icon-white icon-film"></i> icon-film</li>
<li><i class="icon-white icon-th-large"></i> icon-th-large</li>
<li><i class="icon-white icon-th"></i> icon-th</li>
<li><i class="icon-white icon-th-list"></i> icon-th-list</li>
<li><i class="icon-white icon-ok"></i> icon-ok</li>
<li><i class="icon-white icon-remove"></i> icon-remove</li>
<li><i class="icon-white icon-zoom-in"></i> icon-zoom-in</li>
<li><i class="icon-white icon-zoom-out"></i> icon-zoom-out</li>
<li><i class="icon-white icon-off"></i> icon-off</li>
<li><i class="icon-white icon-signal"></i> icon-signal</li>
<li><i class="icon-white icon-cog"></i> icon-cog</li>
<li><i class="icon-white icon-trash"></i> icon-trash</li>
<li><i class="icon-white icon-home"></i> icon-home</li>
<li><i class="icon-white icon-file"></i> icon-file</li>
<li><i class="icon-white icon-time"></i> icon-time</li>
<li><i class="icon-white icon-road"></i> icon-road</li>
<li><i class="icon-white icon-download-alt"></i> icon-download-alt</li>
<li><i class="icon-white icon-download"></i> icon-download</li>
<li><i class="icon-white icon-upload"></i> icon-upload</li>
<li><i class="icon-white icon-inbox"></i> icon-inbox</li>
<li><i class="icon-white icon-play-circle"></i> icon-play-circle</li>
<li><i class="icon-white icon-repeat"></i> icon-repeat</li>
<li><i class="icon-white icon-refresh"></i> icon-refresh</li>
<li><i class="icon-white icon-list-alt"></i> icon-list-alt</li>
<li><i class="icon-white icon-lock"></i> icon-lock</li>
<li><i class="icon-white icon-flag"></i> icon-flag</li>
<li><i class="icon-white icon-headphones"></i> icon-headphones</li>
<li><i class="icon-white icon-volume-off"></i> icon-volume-off</li>
<li><i class="icon-white icon-volume-down"></i> icon-volume-down</li>
<li><i class="icon-white icon-volume-up"></i> icon-volume-up</li>
<li><i class="icon-white icon-qrcode"></i> icon-qrcode</li>
<li><i class="icon-white icon-barcode"></i> icon-barcode</li>
<li><i class="icon-white icon-tag"></i> icon-tag</li>
<li><i class="icon-white icon-tags"></i> icon-tags</li>
<li><i class="icon-white icon-book"></i> icon-book</li>
<li><i class="icon-white icon-bookmark"></i> icon-bookmark</li>
<li><i class="icon-white icon-print"></i> icon-print</li>
<li><i class="icon-white icon-camera"></i> icon-camera</li>
<li><i class="icon-white icon-font"></i> icon-font</li>
<li><i class="icon-white icon-bold"></i> icon-bold</li>
<li><i class="icon-white icon-italic"></i> icon-italic</li>
<li><i class="icon-white icon-text-height"></i> icon-text-height</li>
<li><i class="icon-white icon-text-width"></i> icon-text-width</li>
<li><i class="icon-white icon-align-left"></i> icon-align-left</li>
<li><i class="icon-white icon-align-center"></i> icon-align-center</li>
<li><i class="icon-white icon-align-right"></i> icon-align-right</li>
<li><i class="icon-white icon-align-justify"></i> icon-align-justify</li>
<li><i class="icon-white icon-list"></i> icon-list</li>
<li><i class="icon-white icon-play-circle"></i> icon-play-circle</li>
<li><i class="icon-white icon-repeat"></i> icon-repeat</li>
<li><i class="icon-white icon-refresh"></i> icon-refresh</li>
<li><i class="icon-white icon-list-alt"></i> icon-list-alt</li>
<li><i class="icon-white icon-lock"></i> icon-lock</li>
<li><i class="icon-white icon-flag"></i> icon-flag</li>
<li><i class="icon-white icon-headphones"></i> icon-headphones</li>
<li><i class="icon-white icon-volume-off"></i> icon-volume-off</li>
<li><i class="icon-white icon-volume-down"></i> icon-volume-down</li>
<li><i class="icon-white icon-volume-up"></i> icon-volume-up</li>
<li><i class="icon-white icon-qrcode"></i> icon-qrcode</li>
<li><i class="icon-white icon-barcode"></i> icon-barcode</li>
<li><i class="icon-white icon-tag"></i> icon-tag</li>
<li><i class="icon-white icon-tags"></i> icon-tags</li>
<li><i class="icon-white icon-book"></i> icon-book</li>
<li><i class="icon-white icon-bookmark"></i> icon-bookmark</li>
<li><i class="icon-white icon-print"></i> icon-print</li>
<li><i class="icon-white icon-camera"></i> icon-camera</li>
<li><i class="icon-white icon-font"></i> icon-font</li>
<li><i class="icon-white icon-bold"></i> icon-bold</li>
<li><i class="icon-white icon-italic"></i> icon-italic</li>
<li><i class="icon-white icon-text-height"></i> icon-text-height</li>
<li><i class="icon-white icon-text-width"></i> icon-text-width</li>
<li><i class="icon-white icon-align-left"></i> icon-align-left</li>
<li><i class="icon-white icon-align-center"></i> icon-align-center</li>
<li><i class="icon-white icon-align-right"></i> icon-align-right</li>
<li><i class="icon-white icon-align-justify"></i> icon-align-justify</li>
<li><i class="icon-white icon-list"></i> icon-list</li>
<li><i class="icon-white icon-indent-left"></i> icon-indent-left</li>
<li><i class="icon-white icon-indent-right"></i> icon-indent-right</li>
<li><i class="icon-white icon-facetime-video"></i> icon-facetime-video</li>
<li><i class="icon-white icon-picture"></i> icon-picture</li>
<li><i class="icon-white icon-pencil"></i> icon-pencil</li>
<li><i class="icon-white icon-map-marker"></i> icon-map-marker</li>
<li><i class="icon-white icon-adjust"></i> icon-adjust</li>