View previous topic :: View next topic |
Author |
Message |
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Fri Oct 06, 2017 10:51 am Post subject: Convert this script to work with smarty |
|
|
I was searching for a script to display a countdown timer on our smarty driven website. I found this code:-
Code: | <html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.countdown.min.js"></script>
</head>
<body>
<?php
date_default_timezone_set('GMT');
$currentTime = date('H:i:s');
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
<div id="delcta" style="<?php echo $css ?>">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
</body>
</html> |
I'm no programmer but I know how to get the script references into the correct tpl files. The bit I don't know how to do is this :-
Code: | <?php
date_default_timezone_set('GMT');
$currentTime = date('H:i:s');
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?> |
& this references php too :-
Code: | <div id="delcta" style="<?php echo $css ?>">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div> |
& finally this :-
Code: | <script type="text/javascript">
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script> |
This script works exactly how we would want, can it be modified to work with smarty? If not can anyone write a script that would work & advise cost? Thanks |
|
Back to top |
|
bsmither Smarty Elite
Joined: 20 Dec 2011 Posts: 322 Location: West Coast
|
Posted: Fri Oct 06, 2017 5:41 pm Post subject: |
|
|
Sorry, I haven't verified this, but it could work. The original PHP lines have been put in Smarty comments so that you can compare.
Code: | <html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.countdown.min.js"></script>
</head>
<body>
{*
<?php
date_default_timezone_set('GMT');
$currentTime = date('H:i:s');
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
*}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{date_default_timezone_set('GMT')}
{assign $currentTime $smarty.now|date_format:"%H:%i:%s"}
{assign $currentDay $smarty.now|date_format:"%w"}
{assign $delTimeStart '00:00:00'}
{assign $delTimeEnd '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign $css 'display: block;'}
{else}
{assign $css 'display: none;'}
{/if}
{*
<div id="delcta" style="<?php echo $css ?>">
*}
<div id="delcta" style="{$css}">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
{*
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
*}
$('#countdowntimer')
.countdown('{{$smarty.now + 86400}|date_format:"%Y/%m/%d"} 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
{/nocache}
</body>
</html> |
|
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Mon Oct 09, 2017 7:13 am Post subject: |
|
|
Great, thanks! I'll give it a go later & report back. Thanks again for taking the time to reply. |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Mon Oct 09, 2017 9:31 am Post subject: |
|
|
I couldn't get it to work On the page a number 1 appeared above the text line "Time left for Free Next Day Delivery:" and that was it. If this is something you think you could code on a paid basis please let me know! Thanks. |
|
Back to top |
|
bsmither Smarty Elite
Joined: 20 Dec 2011 Posts: 322 Location: West Coast
|
Posted: Mon Oct 09, 2017 3:53 pm Post subject: |
|
|
Please have your browser show you the actual HTML source of the page it is showing. Copy into your reply the relevant code.
It will help to determine what may be generating the '1' which may actually be a true boolean value as the result of some comparison. |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Mon Oct 09, 2017 3:59 pm Post subject: |
|
|
Yeah I did do that, view source showed this piece of the code is generating the number 1 to appear:-
Code: | {*
<?php
date_default_timezone_set('GMT');
$currentTime = date('H:i:s');
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
*}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{date_default_timezone_set('GMT')}
{assign $currentTime $smarty.now|date_format:"%H:%i:%s"}
{assign $currentDay $smarty.now|date_format:"%w"}
{assign $delTimeStart '00:00:00'}
{assign $delTimeEnd '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign $css 'display: block;'}
{else}
{assign $css 'display: none;'}
{/if}
{*
<div id="delcta" style="<?php echo $css ?>">
*} |
|
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Mon Oct 09, 2017 4:00 pm Post subject: |
|
|
right below view source showed this :-
Code: | <script type="text/javascript">
$('#countdowntimer')
.countdown('2017/10/10 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
</body>
</html>
|
|
|
Back to top |
|
bsmither Smarty Elite
Joined: 20 Dec 2011 Posts: 322 Location: West Coast
|
Posted: Mon Oct 09, 2017 6:26 pm Post subject: |
|
|
Ok, the Smarty variable in the javascript command countdown() is working, but if the Smarty comments are also appearing in the HTML as is being displayed by the browser, then something is really wrong.
Smarty comments do not get included in the compiled result of the template.
Also, I am surprised you did not see them in the browser's display, as these are not HTML tags and are treated as regular text.
Please have your browser show you the actual HTML source of the page it is showing. Copy into your reply the relevant HTML code as shown in the browser's source code view window. |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Tue Oct 10, 2017 8:33 am Post subject: |
|
|
Do you want the full paste & copy of the view source for the page? It's very long as it has products on it with structured data etc. If I view source I can see the code references appear in the header :-
Code: | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://www.ourdomain.com/jquery.countdown.min.js"></script>
|
The only other place I see the code is at the bottom of the page, we have a back to top button script & the countdown timer code is appearing right below that :-
Code: | <button class="gototop"><span><strong>BACK TO TOP <i class="fa fa-arrow-up" aria-hidden="true"></i></strong></span></button>
<script src="https://www.ourdomain/js/jquery.min.js"></script>
<script src="https://www.ourdomain/js/jquery.gototop.js"></script>
<script>
$(function(){
// $(".gototop").gototop();
$(".gototop").gototop({
position : 0,
duration : 800,
visibleAt : 1000,
classname : "isvisible"
});
});
</script>
1
<div id="delcta" style="">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
$('#countdowntimer')
.countdown('2017/10/11 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
</body>
</html>
|
As you can see the number 1 is just there. I did a test page which is just PHP, the script works fine & view source gives me this :-
Code: | <html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.countdown.min.js"></script>
</head>
<body>
<div id="delcta" style="display: block;">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
$('#countdowntimer').countdown('2017/10/11 15:57:00').on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
</body>
</html> |
|
|
Back to top |
|
bsmither Smarty Elite
Joined: 20 Dec 2011 Posts: 322 Location: West Coast
|
Posted: Tue Oct 10, 2017 4:30 pm Post subject: |
|
|
It looks like the {assign} syntax is wrong (my bad).
Study the two codeblocks below to understand two of the three syntax styles to assign a value to a variable. Use either one.
Smarty's compressed assign syntax:
Code: | {assign "currentTime" $smarty.now|date_format:"%H:%i:%s"}
{assign "currentDay" $smarty.now|date_format:"%w"}
{assign "delTimeStart" '00:00:00'}
{assign "delTimeEnd" '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign "css" 'display: block;'}
{else}
{assign "css" 'display: none;'}
{/if} |
The following is Smarty's short-form syntax:
Code: | {$currentTime = $smarty.now|date_format:"%H:%i:%s"}
{$currentDay = $smarty.now|date_format:"%w"}
{$delTimeStart = '00:00:00'}
{$delTimeEnd = '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{$css = 'display: block;'}
{else}
{$css = 'display: none;'}
{/if} |
Last edited by bsmither on Tue Oct 10, 2017 7:41 pm; edited 1 time in total |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Tue Oct 10, 2017 6:06 pm Post subject: |
|
|
Hi again, that part of the code is currently ;-
Code: | *}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{date_default_timezone_set('GMT')}
{assign $currentTime $smarty.now|date_format:"%H:%i:%s"}
{assign $currentDay $smarty.now|date_format:"%w"}
{assign $delTimeStart '00:00:00'}
{assign $delTimeEnd '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign $css 'display: block;'}
{else}
{assign $css 'display: none;'}
{/if}
{* |
Are you saying change this to :-
Code: | {nocache}{* Do not cache these variables. Always use fresh values. *}
{date_default_timezone_set('GMT')}
{$currentTime = $smarty.now|date_format:"%H:%i:%s"}
{$currentDay = $smarty.now|date_format:"%w"}
{$delTimeStart = '00:00:00'}
{$delTimeEnd = '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{$css = 'display: block;'}
{else}
{$css = 'display: none;'}
{/if} |
Sorry for the dumb questions! |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Tue Oct 10, 2017 6:32 pm Post subject: |
|
|
I tried it but got nothing. I'm going to check it all over again. Currently I have these code in my header.tpl :-
Code: | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="{$smarty.const.SITE_ROOT}/jquery.countdown.min.js"></script> |
This is in my footer.tpl (so appears above the closing body tag) :-
Code: | {*
<?php
date_default_timezone_set('GMT');
$currentTime = date('H:i:s');
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
*}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{date_default_timezone_set('GMT')}
{$currentTime = $smarty.now|date_format:"%H:%i:%s"}
{$currentDay = $smarty.now|date_format:"%w"}
{$delTimeStart = '00:00:00'}
{$delTimeEnd = '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{$css = 'display: block;'}
{else}
{$css = 'display: none;'}
{/if}
{*
<div id="delcta" style="<?php echo $css ?>">
*}
<div id="delcta" style="{$css}">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
{*
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
*}
$('#countdowntimer')
.countdown('{{$smarty.now + 86400}|date_format:"%Y/%m/%d"} 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
{/nocache} |
All I see is a number 1 right at the bottom of the page. |
|
Back to top |
|
bsmither Smarty Elite
Joined: 20 Dec 2011 Posts: 322 Location: West Coast
|
Posted: Tue Oct 10, 2017 8:21 pm Post subject: |
|
|
The PHP command: Code: | date_default_timezone_set('GMT') | returns a boolean. That is what you are seeing. So, we need to assign it to a dummy variable to keep it from being output by default. Code: | {$tz_was_set = date_default_timezone_set('GMT')} |
Also, it seems Smarty uses PHP's strftime() function in its date_format modifier. So, the $currentTime is getting assigned a false because of some unknown conversion specifiers. Use this instead: Code: | {$currentTime = $smarty.now|date_format:"%T"} |
As for not having anything displayed, the {if} block could be evaluating to false, thus the $css is getting assigned with "display:none;".
Please verify you are running your tests between '00:00:00' and '14:30:00' UTC on a weekday. |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Tue Oct 10, 2017 8:26 pm Post subject: |
|
|
Thanks again. I'll try this tomorrow. (It's late evening here now). My test above was done at 6.30pm. |
|
Back to top |
|
drgl Smarty Rookie
Joined: 06 Oct 2017 Posts: 26
|
Posted: Wed Oct 11, 2017 7:23 am Post subject: |
|
|
OK, I tried three combinations, this one still gave a number 1 :-
Code: | {*
<?php
{$tz_was_set = date_default_timezone_set('GMT')}
{$currentTime = $smarty.now|date_format:"%T"}
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
*}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{date_default_timezone_set('GMT')}
{assign $currentTime $smarty.now|date_format:"%H:%i:%s"}
{assign $currentDay $smarty.now|date_format:"%w"}
{assign $delTimeStart '00:00:00'}
{assign $delTimeEnd '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign $css 'display: block;'}
{else}
{assign $css 'display: none;'}
{/if}
{*
<div id="delcta" style="<?php echo $css ?>">
*}
<div id="delcta" style="{$css}">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
{*
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
*}
$('#countdowntimer')
.countdown('{{$smarty.now + 86400}|date_format:"%Y/%m/%d"} 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
{/nocache}
</body>
</html>
|
These two didn't show anything at all
Code: | {*
<?php
{$tz_was_set = date_default_timezone_set('GMT')}
{$currentTime = $smarty.now|date_format:"%T"}
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
*}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{$tz_was_set = date_default_timezone_set('GMT')}
{$currentTime = $smarty.now|date_format:"%T"}
{assign $currentDay $smarty.now|date_format:"%w"}
{assign $delTimeStart '00:00:00'}
{assign $delTimeEnd '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign $css 'display: block;'}
{else}
{assign $css 'display: none;'}
{/if}
{*
<div id="delcta" style="<?php echo $css ?>">
*}
<div id="delcta" style="{$css}">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
{*
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
*}
$('#countdowntimer')
.countdown('{{$smarty.now + 86400}|date_format:"%Y/%m/%d"} 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
{/nocache}
</body>
</html>
|
Code: | {*
<?php
date_default_timezone_set('GMT');
$currentTime = date('H:i:s');
$currentDay = date('w');
$delTimeStart = '00:00:00';
$delTimeEnd = '14:30:00';
if ($currentTime >= $delTimeStart && $currentTime < $delTimeEnd && $currentDay > 0 && $currentDay < 6){
$css = 'display: block;';
} else {
$css = 'display: none;';
}
?>
*}
{nocache}{* Do not cache these variables. Always use fresh values. *}
{$tz_was_set = date_default_timezone_set('GMT')}
{$currentTime = $smarty.now|date_format:"%T"}
{assign $currentDay $smarty.now|date_format:"%w"}
{assign $delTimeStart '00:00:00'}
{assign $delTimeEnd '14:30:00'}
{if $currentTime gte $delTimeStart && $currentTime lt $delTimeEnd && $currentDay gt 0 && $currentDay lt 6}
{assign $css 'display: block;'}
{else}
{assign $css 'display: none;'}
{/if}
{*
<div id="delcta" style="<?php echo $css ?>">
*}
<div id="delcta" style="{$css}">
<p>Time left for Free Next Day Delivery: <span id="countdowntimer"></span></p>
</div>
<script type="text/javascript">
{*
$('#countdowntimer').countdown('<?php $date = strtotime("+1 day"); echo date('Y/m/d', $date); ?> 14:27:00').on('update.countdown', function(event) {
*}
$('#countdowntimer')
.countdown('{{$smarty.now + 86400}|date_format:"%Y/%m/%d"} 14:27:00')
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%-H %!H:hour,hours; '
+ '%-M %!M:minute,minutes; '
+ '%-S %!S:second,seconds;'
));
});
</script>
{/nocache}
</body>
</html>
|
|
|
Back to top |
|
|