Smarty Forum Index Smarty
WARNING: All discussion is moving to https://reddit.com/r/smarty, please go there! This forum will be closing soon.

feature request: function which could loading js/css files
Goto page 1, 2  Next
 
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Smarty Forum Index -> Smarty 3
View previous topic :: View next topic  
Author Message
yarco
Smarty Regular


Joined: 20 Mar 2009
Posts: 39

PostPosted: Tue Mar 24, 2009 9:17 am    Post subject: feature request: function which could loading js/css files Reply with quote

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
View user's profile Send private message
elpmis
Smarty Elite


Joined: 07 Jun 2007
Posts: 321

PostPosted: Tue Mar 24, 2009 11:57 am    Post subject: Reply with quote

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
View user's profile Send private message
yarco
Smarty Regular


Joined: 20 Mar 2009
Posts: 39

PostPosted: Tue Mar 24, 2009 5:15 pm    Post subject: Reply with quote

not enough.
cause it only translate tpl into html -- you need to put them between html <head> tag.
Back to top
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Tue Mar 24, 2009 6:54 pm    Post subject: Reply with quote

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
View user's profile Send private message Visit poster's website
douglassdavis
Smarty Junkie


Joined: 21 Jan 2008
Posts: 541

PostPosted: Tue Mar 24, 2009 8:21 pm    Post subject: Reply with quote

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
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Tue Mar 24, 2009 8:25 pm    Post subject: Reply with quote

It extends the same template that {include file="base.tpl"} would include.
Back to top
View user's profile Send private message Visit poster's website
douglassdavis
Smarty Junkie


Joined: 21 Jan 2008
Posts: 541

PostPosted: Tue Mar 24, 2009 11:55 pm    Post subject: Reply with quote

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
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Wed Mar 25, 2009 12:00 am    Post subject: Reply with quote

it is {extend file="foo.tpl"}, I had that wrong.
Back to top
View user's profile Send private message Visit poster's website
yarco
Smarty Regular


Joined: 20 Mar 2009
Posts: 39

PostPosted: Wed Mar 25, 2009 2:06 am    Post subject: Reply with quote

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
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Wed Mar 25, 2009 1:46 pm    Post subject: Reply with quote

You might be interested in this thread:

http://www.phpinsider.com/smarty-forum/viewtopic.php?t=5836
Back to top
View user's profile Send private message Visit poster's website
yankee
Smarty Rookie


Joined: 02 Mar 2009
Posts: 31

PostPosted: Wed Mar 25, 2009 7:51 pm    Post subject: Reply with quote

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
View user's profile Send private message
yarco
Smarty Regular


Joined: 20 Mar 2009
Posts: 39

PostPosted: Thu Mar 26, 2009 2:51 am    Post subject: Reply with quote

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
View user's profile Send private message
yankee
Smarty Rookie


Joined: 02 Mar 2009
Posts: 31

PostPosted: Thu Mar 26, 2009 10:08 am    Post subject: Reply with quote

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
View user's profile Send private message
yarco
Smarty Regular


Joined: 20 Mar 2009
Posts: 39

PostPosted: Fri Mar 27, 2009 6:24 am    Post subject: Reply with quote

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
View user's profile Send private message
mohrt
Administrator


Joined: 16 Apr 2003
Posts: 7368
Location: Lincoln Nebraska, USA

PostPosted: Fri Mar 27, 2009 1:35 pm    Post subject: Reply with quote

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
View user's profile Send private message Visit poster's website
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Smarty Forum Index -> Smarty 3 All times are GMT
Goto page 1, 2  Next
Page 1 of 2

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group
Protected by Anti-Spam ACP