Reusable user interface in PHP? - php

For most of my projects I make an administration interface, which has the same design for every project. The design of the header, the footer, the topbar, the leftmenu, the css, etc. are always the same. It is a pity to create the views every time; so I was thinking: maybe there would be a nice way to put the admin interface in my MVC library, as it is reused by every project?
But for the moment, in every single view I got code like the following:
<?php $this->_include('/includes/doctype.php'); ?>
<head>
<?php $this->_include('/includes/head.php'); ?>
<title>Some title</title>
</head>
<body>
<?php $this->_include('/includes/topbar.php'); ?>
<div id="page">
<?php $this->_include('/includes/header.php'); ?>
<?php $this->_include('/includes/leftmenu.php'); ?>
<div id="content" role="main">
<h1>Some title</h1>
<p>Blah blah blah.</p>
</div><!-- /#content -->
<?php $this->_include('/includes/footer.php'); ?>
</div><!-- /#page -->
</body>
</html>
Would it be a good idea to extract the custom content from the structure of the interface, and put that structure in my library somehow to make it reusable?
After that how will it be possible to customize the title and the actual menus?

I do this all the time. I have a custom header and footer file that are called at the start and end of every page.
<?PHP
Require("includes/header.php");
...
Require("includes/footer.php");
?>
The header provides a database handle, a datetime string and handles logon, priveleges, logging of pageviews etc.
The footer provides a standard HTML page but includes some systematised variables. It also generates the menu dynamically from the driving database then closes the database connection.
This way when I write code, I don't get mixed up in the HTML and any bugs are easy to find.
I like variables akin to:
$display_scripts - adds extra data in the head section.
$display_onload_scripts - adds onload scripts to body section.
$display_style_sheets - option to include link to additional stylesheets
$display_above_menu - will appear above the menubar. NOT recommended.
$display_below_menu - will appear immediately below the menubar.
$display_one_column - page contents when only one column is to be used
$display_left_column - page contents when two columns used. Left pane.
$display_right_column - page contents when two columns used. Right pane.
$display_footer - appears in footer division.
My main code then just has to generate the appropriate variable. Fundamentally, what you need to do is examine the source of a good age you have produced then replace the stuff you want to change with variables.
Here is a schematised version of the file I use (pseudocode) to give you an idea of how I do it.
// Code here generates the menu from database
// Code here genereates popup alert messages from other users
//permanent links to external style sheets go here.
//You can also select skins here.
<?PHP
echo $display_style_sheets;
echo "<title>".$display_page_title."</title>";
?>
<script type="text/javascript" src="JAVASCRIPT GOES HERE.js"></script>
</head>
<body <?PHP echo $display_onload_scripts;?> >
<div id="page_area" >
<div id="banner">
</div>
<?php
echo $display_above_menu;
if(!$hide_menu){echo $display_menu;} //Insert the menu variable here.
echo $display_below_menu;
?>
<div id="content_area">
<div id="inner_content">
<?PHP
if($display_number_of_columns==1)
{
echo "<div id='onecolumn'>".$display_one_column."</div>"; //I only use this one
}
if($display_number_of_columns==2)
{
echo "<div id='leftcolumn'>".$display_left_column."</div>"; //these are left for legacy support from before I got better at CSS.
echo "<div id='rightcolumn'>".$display_right_column."</div>";
}
echo "<div id='footer'>".$display_footer."</div>"; //just in case - I hardly use it.
echo $display_pop_box; //for user alert messages to other users
?>
</div>
</div>
</div>
<div id="logbox"> Automatic Logout statement</div> //this is called by JS to activate timeouts.
</body>
</html>
<?PHP
$mysqlidb->close();
?>
Sorry it's such a lot of code. The layout allows easy adaptation and makes it simple to find the offending variable if things are not going as expected. There are more elegant solutions but this works well for me and is very fast.

Related

How to Make or Call sidebar in CakePHP

I have such type of code in view, add.ctp file in Cake PHP.
<div id="container">
<div id="content">
------------------
</div>
<div id="sidebar">
----------------
</div>
</div>
Now in Layout, in default.ctp file, we access this code by this line.
<?php echo $this->fetch('content'); ?>
I have sidebar in each and every view file, and if I need some changes then I will go in each and every file and then change.
Now My Question is that, can I made a file in layout like sidebar.ctp or any thing else that I just call this file in my view. If I can, then how I will made such type of file.
You could do it with include or elements like this
<?php echo $this->element('sidebar'); ?>
With the element, you make the sidebar.ctp file in the View/Elements/ folder.
Check for more information: Cakephp 2 Elements
The other way is with include (not my choice, but another way to accomplish it)
<?php include('../View/Layouts/sidebar.ctp'); ?>
You can use elements and if the content in elements is dynamic you can use the blocks supported in latest version of cakephp.
http://book.cakephp.org/2.0/en/views.html

Letter preview PHP/JQuery

I have a set of fields such as title, body, header, footer, signature and so on. When i fill these fields which are sections of a letter, a preview of what is being filled should show as the link given here: http://www.cvplaza.com/wp-content/uploads/2012/09/cover-letter-example.png
I will be developing this using codeigniter and want to know libraries or any other technologies to achieve this. I will also need to set predefined templates for the letter so once i loads them, i can then fill-in details and the preview fill format and show the final draft.
Something like this?
Guess some normal html would suffice, just create a html mockup, including some <address> tags etc (or whatever you want), and use some css to make it look like you want. Nothing special about it...
EDIT
reply on the comment: yes and no, ofcourse you can limit the number of characters or even words, but note that calculating dimensions based on text is nearly impossible. Except for monospace fonts every letter has it's own width, which is based on several variables, amongst others the rendering engine, which depends on the os and even the browser, the font chosen, etc. etc.
Except for if you have a lot of time and/or resources, I'd go with a practical solution. If you do have both, you can dynamically parse pdf files, using, eg. FPDF or TCPDF. Or you can look into dynamically parsing LaTeX, which gives you beautiful results with minimal effort in creating a page layout. But consider; is it worth the trouble?
In case of html and latex, you can create templates the way you would create normal html templates. An example for the template I created in the fiddle would look like this in php:
<div class="letter">
<header>
<div class="sender">
<address>
<?php echo $sender['name']; ?><br/>
<?php echo $sender['address']; ?><br/>
<?php echo $sender['city']; ?><br/>
<?php echo $sender['zip']; ?><br/>
</address>
</div>
<div class="date">
<?php echo $date; ?>
</div>
<div class="recipient">
<address>
<?php // recipient... ?>
</address>
</div>
</header>
<div class="body">
Dear <?php echo $recipient['full_name']; ?><br/>
<br/>
<strong><?php echo $subject; ?></strong><br/><br/>
<?php echo nl2br($message_body); ?>
</div>
</div>

Cakephp, adding a view to a sidebar

I'm struggling trying to understand cakephp's views, blocks and layouts.
I need everypage to show a left and right sidebar which content might change. At this moment I have the right sidebar defined in /pages/home.ctp but I'm guessing it would be better to extend that sidebar since it has to appear in everypage. Correct me if that thought is wrong.
Then, I have this view add.ctp for the 'usuarios' table, it practically shows the fields login and password. I want to show this view in the sidebar, but I'm really lost as how to do that.
Thanks in advance.
Lets make this thing easy. Like #patrick said, there is a lots of way.
Start with layout file. Rearrange your default.ctp layout like-
default.ctp layout
<div id="container">
<div id="header">
<?php echo $this->element('header');?>
</div>
<div id="left-sidebar">
<?php echo $this->element('left-sidebar');?>
</div>
<div id="content">
<?php echo $this->Session->flash(); ?>
<?php echo $this->fetch('content'); ?>
</div>
<div id="right-sidebar">
<?php echo $this->element('right-sidebar');?>
</div>
<div id="footer">
<?php echo $this->element('footer');?>
</div>
</div>
Now create elements ctp files as header.ctp, left-sidebar.ctp, right-sidebar.ctp and so on and place them to app/View/Elements.
Your left-sidebar.ctp file may looks like this...
left-sidebar.ctp
// to show login form //
if you just need to show on view.ctp place few logic here for login form.
//end login form//
show other sidebar contents
There are a couple ways to do it, depending on your Cake version. If you're using >=2.1 (which I assume you are since you asked about blocks), then you should try those to see if they work for your setup. The way I usually do things is that if all views for a controller need common markup then those view files would extend a base view within the Controller directory, e.g.
#/View/Posts/index.ctp
<?php
$this->extend('_skel'); //arbitrary filename, I use '_skel' since that makes sense
echo $this->Html->para(null, 'Hello');
#/View/Posts/_skel.ctp
<?php
echo $this->Html->div('sidebar', 'Sidebar for posts...');
echo $this->fetch('content'); // This gets all output from the Posts/index.ctp view
Then all your Posts views which extend _skel will have the sidebar automatically.
Your login module might make sense as an element - something that could be used anywhere in your views.

Dynamic data in header in a symfony project

I have a Symfony 1.4 project. As you know the Template layout is defined independently, in the apps' templates' folder and then it is universally applied to all other templates. My layout is very simple, something like this:
<div id = "header">
</div>
<div id = "content">
<?php echo $sf_content ; ?>
</div>
<div id = "footer">
</div>
$sf_content, as most symfonians would know, essentially spits out the template for whatever web page is being viewed at the moment. If I needed some specific data for my header, such as logout, logo etc, I would simply include it within my header. THis works great because it is static in nature. The challenge I am facing is how I can include data that is dynamic in nature and specific to a page within the header tag because the UI demands that I include it there.
For instance, one of my webpages requires user specific data to be loaded in a dropdown/select menu. This is dynamic and could range from 0 to 100 and is specific to each user. To create this dropdown menu is not an issue, and I already have that part done. The challenge is, how do I load it in the header, given that my data becomes part of $sf_content and that is spit out in my content div.
Is there a way for me to move a specific part of my $sf_content into the header div ?
In your actions.php:
$this->getResponse()->setSlot('someData', 'and its value');
In layout.php:
<div id="header">
<?php echo get_slot('someData'); ?>
</div>
<div id="content">
<?php echo $sf_content ; ?>
</div>
<div id="footer">
</div>
Slots work for this. They can either be set in the action as in the first answer above or you can define them in the templates themselves. This is what I've done where I have dynamic data to define for the layout.
In your example:
<div id="header">
<?php include_slot('some slot name')?>
</div>
<div id="content">
<?php echo $sf_content() ?>
</div>
<div id="footer">
</div>
In the templates you would define the following:
<?php slot('some slot name')?>
//your code goes here
<?php end_slot() ?>
When the layout is then rendered Symfony will place the code between the slot() and end_slot() into the point at which you defined by using include_slot().
For ease I created a global partial that is included in all templates that defines the various common slots used through out the application. There is more info on slots and their usage here

Can php divide the page into small block and gradually appear?

Can php divide the page into small block and gradually appear?
I divided my main page into several small blocks, like:
<?php
include('header.php');
<div id="content">
<!-- some content -->
</div>
include('partone.php');
include('parttwo.php');
include('partthree.php');
include('footer.php');
?>
I need open the page, first load header.php, div#content, footer.php, then gradually loaded partone.php, parttwo.php, partthree.php. Is there a way could do that? thanks.
PHP is executed server side, so your code will include all the files listed, and send the entire output to the client computer at once.
If you want only parts of the page to appear at a time, try enclosing them in divs and use JavaScript.
Sounds like you should be using javascript to do this.
Have a look at the jQuery get method.
This might be what you're after: http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/
Demo: http://www.webresourcesdepot.com/dnspinger/
Modify your code to look like the following
<?php
include('header.php');
?>
<div id="content">
<!-- some content -->
</div>
<div id="partOne"></div>
<div id="partTwo"></div>
<div id="partThree"></div>
<?php
include('footer.php');
?>
Then make 3 ajax requests to load in partone.php, parttwo.php and partthree.php to their respecitve divs in the above code. Plenty of tutorials on how to do this via all the different javascript frameworks out there. Personally I use jquery, but you can use whatever is your preference for this.

Categories