View previous topic :: View next topic |
Author |
Message |
yarco Smarty Regular
Joined: 20 Mar 2009 Posts: 39
|
Posted: Tue Mar 24, 2009 9:17 am Post subject: feature request: function which could loading js/css files |
|
|
I think this function is very useful.
Our first web programming course always said we need to put script/css between the html <head> tags. (good style)
But in some reason when we split html into several templates, we might put js/css into several files.(quick find)
So if we have such functions which we could write it into the templates but exists between the <head> tag in complied file, it would be very good.
Code: |
1.tpl:
{include file='1.js' type='js'}
{include file='1.css' type='css'}
<span class="c1">1</span>
2.tpl:
{include file='2.css' type='css'}
...
3.tpl:
{include file="1.tpl" type="tpl"}
{include file="2.tpl" type="tpl"}
index.php
<?php
$smarty->display('3.tpl');
?>
output:
<head>
<script type="text/javascript" src="1.js"></script>
<link rel="stylesheet" href="1.css" />
<link rel="stylesheet" href="2.css" />
...
</head>
<span class="c1">1</span>
|
|
|
Back to top |
|
elpmis Smarty Elite
Joined: 07 Jun 2007 Posts: 321
|
Posted: Tue Mar 24, 2009 11:57 am Post subject: |
|
|
For javascript you can use this
Code: | function smarty_function_jsinsert($params, &$smarty)
{
$files = explode(',', $params['files']);
foreach ($files as $file)
{
echo '<script type="text/javascript" src="your/js/path/'.$file.'"></script>'."\n";
}
} |
with
Code: | {jsinsert files="1.js,2.js"} |
Could be modfied for css too
Code: | function smarty_function_cssinsert($params, &$smarty)
{
$files = explode(',', $params['files']);
foreach ($files as $file)
{
echo '<link rel="stylesheet" href="your/css/path/'.$file.'"/>'."\n";
}
} |
with
Code: | {cssinsert files="1.css,2.css"} |
|
|
Back to top |
|
yarco Smarty Regular
Joined: 20 Mar 2009 Posts: 39
|
Posted: Tue Mar 24, 2009 5:15 pm Post subject: |
|
|
not enough.
cause it only translate tpl into html -- you need to put them between html <head> tag. |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
Posted: Tue Mar 24, 2009 6:54 pm Post subject: |
|
|
Smarty 3 will have template inheritance. Example:
base.tpl:
Code: | <html>
<head>
<title>{block name="title"}default{/block}</title>
{block name="head"}{/block}
</head>
<body>
{block name="body"}{/block}
</body>
</html> |
my.tpl:
Code: | {extend file="base.tpl"}
{block name="title"} my title {/block}
{block name="head"} <!-- insert js/css here --> {/block}
{block name="body"} <!-- insert content here --> {/block} |
output of $smarty->display('my.tpl'):
Code: | <html>
<head>
<title>my title</title>
<!-- insert js/css here -->
</head>
<body>
<!-- insert content here -->
</body>
</html> |
Last edited by mohrt on Wed Mar 25, 2009 12:05 am; edited 1 time in total |
|
Back to top |
|
douglassdavis Smarty Junkie
Joined: 21 Jan 2008 Posts: 541
|
Posted: Tue Mar 24, 2009 8:21 pm Post subject: |
|
|
Template inheritance... Nice.
Say if i has a template named base.tpl, and some one else has a template named base.tpl in another dir, how can we refer to one or another?
Does this name
{extend name="base.tpl"}
always refer to a file name? |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
Posted: Tue Mar 24, 2009 8:25 pm Post subject: |
|
|
It extends the same template that {include file="base.tpl"} would include. |
|
Back to top |
|
douglassdavis Smarty Junkie
Joined: 21 Jan 2008 Posts: 541
|
Posted: Tue Mar 24, 2009 11:55 pm Post subject: |
|
|
mohrt wrote: | It extends the same template that {include file="base.tpl"} would include. |
Maybe I'm just being nitpicky, but why not:
{extend file="base.tpl"}
Name seems to imply a different concept. |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
Posted: Wed Mar 25, 2009 12:00 am Post subject: |
|
|
it is {extend file="foo.tpl"}, I had that wrong. |
|
Back to top |
|
yarco Smarty Regular
Joined: 20 Mar 2009 Posts: 39
|
Posted: Wed Mar 25, 2009 2:06 am Post subject: |
|
|
Well, the thinking of template inheritance is very good. But what i've mentioned here is something different.
Inheritance means when you add new feature, you make it inherit an old one. So maybe it look like:
A(feature A) <- A,B (feature A and B) <- A, B, C (feature A, B, C)
Then if you want to add a page contains A, C, D, you need do another inherit path like:
A <- A, C <- A, C, D
My thinking is to dive a page into several parts. And one part could contain html/css/js. And finally make them one page. So if i don't need one part, i could never include them.
(But i think i should put css/js in between the head in the result page) |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
|
Back to top |
|
yankee Smarty Rookie
Joined: 02 Mar 2009 Posts: 31
|
Posted: Wed Mar 25, 2009 7:51 pm Post subject: |
|
|
yarco wrote: | not enough.
cause it only translate tpl into html -- you need to put them between html <head> tag. |
Not quite true. At least this is not true for javascript. js can be anywhere in your html document.
If you need to introduce another css file in your template then I suppose that you have an error in your overall design. Because the fundamental concept of css is to split structure from design. If you need to introduce a specific css file in your template then there is something wrong... |
|
Back to top |
|
yarco Smarty Regular
Joined: 20 Mar 2009 Posts: 39
|
Posted: Thu Mar 26, 2009 2:51 am Post subject: |
|
|
yankee wrote: | yarco wrote: | not enough.
cause it only translate tpl into html -- you need to put them between html <head> tag. |
Not quite true. At least this is not true for javascript. js can be anywhere in your html document.
If you need to introduce another css file in your template then I suppose that you have an error in your overall design. Because the fundamental concept of css is to split structure from design. If you need to introduce a specific css file in your template then there is something wrong... |
Sorry, i don't know what you mean. If css only work for structure, what about colors?
For example, if i have a page: user profile. And this page is divided into several parts like:
1) header
2) footer
3) user profile
4) guest book
And user profile part includes its own html/js/css, and also guest book.
Code: |
userprofile.tpl
<style>
div.userprofile {color:red}
</style>
<div class="userprofile">
Name: {$userprofile.name}
...
</div>
guestbook.tpl
<style>
div.guestbook {color:blue}
</style>
<div class="guestbook">
{foreach ... item=guestbook}
Name: {$guestbook.name}
...
</div>
|
And if there exists such functions, then i could create two css files: userprofile.css, guestbook.css to contain the two style parts. Finally it would output:
Code: |
...header...
<link rel="styleshee" href="userprofile.css" />
<link rel="styleshee" href="guestbook.css" />
...header...
...user profile part...
...guest book part...
*BUT NOT*
...header...
<link rel="styleshee" href="userprofile.css" />
...user profile part...
<link rel="styleshee" href="guestbook.css" />
...guest book part...
it would make some browser angry.
|
And if one day, i don't need guestbook part in user profile, i could only just exclude it.
Erm...do i make myself clear? |
|
Back to top |
|
yankee Smarty Rookie
Joined: 02 Mar 2009 Posts: 31
|
Posted: Thu Mar 26, 2009 10:08 am Post subject: |
|
|
yarco wrote: | If css only work for structure, what about colors? |
css is for design and html is for structuring content.
yarco wrote: | For example, if i have a page: user profile. And this page is divided into several parts like:
1) header
2) footer
3) user profile
4) guest book
And user profile part includes its own html/js/css, and also guest book. |
Well... It is perfectly normal for every of those pages to have their own javascript section. That's why it is allowed to insert as many javascript sections as you like anywhere in your document.
But css files usually describe the layout for an entire webpage. It appears strange to me that you want your user profile to have a different look compared to your guest book.
You might have good reason to break this "rule", but it should not be the included template's task to set the stylesheet. |
|
Back to top |
|
yarco Smarty Regular
Joined: 20 Mar 2009 Posts: 39
|
Posted: Fri Mar 27, 2009 6:24 am Post subject: |
|
|
yankee wrote: | yarco wrote: | If css only work for structure, what about colors? |
css is for design and html is for structuring content.
yarco wrote: | For example, if i have a page: user profile. And this page is divided into several parts like:
1) header
2) footer
3) user profile
4) guest book
And user profile part includes its own html/js/css, and also guest book. |
Well... It is perfectly normal for every of those pages to have their own javascript section. That's why it is allowed to insert as many javascript sections as you like anywhere in your document.
But css files usually describe the layout for an entire webpage. It appears strange to me that you want your user profile to have a different look compared to your guest book.
You might have good reason to break this "rule", but it should not be the included template's task to set the stylesheet. |
Erm...maybe you are right. I'm not a css expert. So when i'm writting css, i always want to make it clear - put them into several css files.
I'm unhappy to put js code to everywhere...it seems very dirty.
Still i think it is better when smarty could include such function. |
|
Back to top |
|
mohrt Administrator
Joined: 16 Apr 2003 Posts: 7368 Location: Lincoln Nebraska, USA
|
Posted: Fri Mar 27, 2009 1:35 pm Post subject: |
|
|
You should know in your business logic what modules are being loaded in the presentation layer? So if you assign something like:
Code: | $smarty->assign("is_profile",true);
$smarty->assign("is_guestbook",true); |
You can test this in your presentation code. In the head you load the proper css files, in the body you include the proper templates. |
|
Back to top |
|
|