Shikiryu/Accueil
1
0
Fork 0
Code Issues 9 Pull Requests Releases Wiki Activity

Ajout d'une horloge plus complète.

Browse Source
This commit is contained in:
Chouchen 2010-09-20 08:44:44 +00:00
parent 563f40f6d7
commit efc9187699
5 changed files with 260 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
class/ClockAdvanced.php Normal file
View File

@ -0,0 +1,37 @@
<?php
class clockAdvanced {
public static $paramsList = array(
'visibility',
'x',
'y',
'fontFamily',
'fontSize',
'format',
'color'
);
public $params = array();
public function __construct($params){
$this->setParams($params);
echo '<script type="text/javascript" src="js/jquery.jclockAdvanced.js"></script>';
echo '<div class="jclockAdvanced" id="clockAdvanced" style="left:'.$params['x'].'; top:'.$params['y'].';"></div>';
$options = '';
foreach (self::$paramsList as $paramName){
if(isset($this->params[$paramName]))
$options .= $paramName.' : '.$this->params[$paramName].',';
}
echo '<script>$(document).ready(function(){
$(\'.jclockAdvanced\').jclock({'.substr($options,0,-1).'});
});
</script>';
}
private function setParams($params){
$this->params = $params;
}
public static function start($params){
$clockAdvanced = new clockAdvanced($params);
}
}

2
css/main.css
View File

@ -241,7 +241,7 @@ a.green-button:hover, span.green-button:hover{
} }
.jclock {position:absolute; top:10px; right:10px;z-index:500; width:200px;background:#fff url(../images/interface/clock.png) top left no-repeat; padding:5px 0 0 5px; width:59px; height:21px;} .jclock {position:absolute; top:10px; right:10px;z-index:500; width:200px;background:#fff url(../images/interface/clock.png) top left no-repeat; padding:5px 0 0 5px; width:59px; height:21px;}
.jclockAdvanced{position:absolute; top:10px; right:80px; padding:5px 0 0 5px;}
#blogs {/*position:absolute; bottom:10px; left: 100px;*/padding:5px;width:350px;-webkit-border-radius: 5px; #blogs {/*position:absolute; bottom:10px; left: 100px;*/padding:5px;width:350px;-webkit-border-radius: 5px;
-moz-border-radius: 5px;border: 1px solid rgba(0,0,0,0.3); -moz-border-radius: 5px;border: 1px solid rgba(0,0,0,0.3);

2
css/todo.css
View File

@ -6,7 +6,7 @@
#todoList ul{list-style:none;} #todoList ul{list-style:none;}
#todoList ul li{white-space : nowrap; padding-left:16px;} #todoList ul li{white-space : nowrap; padding-left:16px;}
#todoList ul li div.puce{width: 16px; height: 16px; background: #FFF url(../images/interface/ui-icons_888888_256x240.png) -32px -48px no-repeat; display:inline-block;} #todoList ul li div.puce{width: 16px; height: 16px; background:url(../images/interface/ui-icons_888888_256x240.png) -32px -48px no-repeat; display:inline-block;}

9
db/config.xml
View File

@ -30,4 +30,13 @@
<x>130</x> <x>130</x>
<y>138</y> <y>138</y>
</item> </item>
<item id="clockAdvanced">
<visibility>true</visibility>
<x>80</x>
<y>10</y>
<fontFamily>'Times New Roman, serial'</fontFamily>
<fontSize>'20px'</fontSize>
<format>'%A %d %B %Y - %H:%m:%S'</format>
<color>'#000'</color>
</item>
</Config> </Config>

212
js/jquery.jclockAdvanced.js Normal file
View File

@ -0,0 +1,212 @@
/*
* jQuery jclock - Clock plugin - v 2.3.0
* http://plugins.jquery.com/project/jclock
*
* Copyright (c) 2007-2009 Doug Sparling <http://www.dougsparling.com>
* Licensed under the MIT License:
* http://www.opensource.org/licenses/mit-license.php
*/
(function($) {
$.fn.jclock = function(options) {
var version = '2.3.0';
// options
var opts = $.extend({}, $.fn.jclock.defaults, options);
return this.each(function() {
$this = $(this);
$this.timerID = null;
$this.running = false;
// Record keeping for seeded clock
$this.increment = 0;
$this.lastCalled = new Date().getTime();
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
$this.format = o.format;
$this.utc = o.utc;
// deprecate utc_offset (v 2.2.0)
$this.utcOffset = (o.utc_offset != null) ? o.utc_offset : o.utcOffset;
$this.seedTime = o.seedTime;
$this.timeout = o.timeout;
$this.css({
fontFamily: o.fontFamily,
fontSize: o.fontSize,
backgroundColor: o.background,
color: o.foreground
});
// %a
$this.daysAbbrvNames = new Array(7);
$this.daysAbbrvNames[0] = "Dim";
$this.daysAbbrvNames[1] = "Lun";
$this.daysAbbrvNames[2] = "Mar";
$this.daysAbbrvNames[3] = "Mer";
$this.daysAbbrvNames[4] = "Jeu";
$this.daysAbbrvNames[5] = "Ven";
$this.daysAbbrvNames[6] = "Sam";
// %A
$this.daysFullNames = new Array(7);
$this.daysFullNames[0] = "Dimanche";
$this.daysFullNames[1] = "Lundi";
$this.daysFullNames[2] = "Mardi";
$this.daysFullNames[3] = "Mercredi";
$this.daysFullNames[4] = "Jeudi";
$this.daysFullNames[5] = "Vendredi";
$this.daysFullNames[6] = "Samedi";
// %b
$this.monthsAbbrvNames = new Array(12);
$this.monthsAbbrvNames[0] = "Jan";
$this.monthsAbbrvNames[1] = "Fev";
$this.monthsAbbrvNames[2] = "Mar";
$this.monthsAbbrvNames[3] = "Avr";
$this.monthsAbbrvNames[4] = "Mai";
$this.monthsAbbrvNames[5] = "Jun";
$this.monthsAbbrvNames[6] = "Jul";
$this.monthsAbbrvNames[7] = "Aou";
$this.monthsAbbrvNames[8] = "Sep";
$this.monthsAbbrvNames[9] = "Oct";
$this.monthsAbbrvNames[10] = "Nov";
$this.monthsAbbrvNames[11] = "Dec";
// %B
$this.monthsFullNames = new Array(12);
$this.monthsFullNames[0] = "Janvier";
$this.monthsFullNames[1] = "Février";
$this.monthsFullNames[2] = "Mars";
$this.monthsFullNames[3] = "Avril";
$this.monthsFullNames[4] = "Mai";
$this.monthsFullNames[5] = "Juin";
$this.monthsFullNames[6] = "Juillet";
$this.monthsFullNames[7] = "Aout";
$this.monthsFullNames[8] = "Septembre";
$this.monthsFullNames[9] = "Octobre";
$this.monthsFullNames[10] = "Novembre";
$this.monthsFullNames[11] = "Décembre";
$.fn.jclock.startClock($this);
});
};
$.fn.jclock.startClock = function(el) {
$.fn.jclock.stopClock(el);
$.fn.jclock.displayTime(el);
}
$.fn.jclock.stopClock = function(el) {
if(el.running) {
clearTimeout(el.timerID);
}
el.running = false;
}
$.fn.jclock.displayTime = function(el) {
var time = $.fn.jclock.getTime(el);
el.html(time);
el.timerID = setTimeout(function(){$.fn.jclock.displayTime(el)},el.timeout);
}
$.fn.jclock.getTime = function(el) {
if(typeof(el.seedTime) == 'undefined') {
// Seed time not being used, use current time
var now = new Date();
} else {
// Otherwise, use seed time with increment
el.increment += new Date().getTime() - el.lastCalled;
var now = new Date(el.seedTime + el.increment);
el.lastCalled = new Date().getTime();
}
if(el.utc == true) {
var localTime = now.getTime();
var localOffset = now.getTimezoneOffset() * 60000;
var utc = localTime + localOffset;
var utcTime = utc + (3600000 * el.utcOffset);
now = new Date(utcTime);
}
var timeNow = "";
var i = 0;
var index = 0;
while ((index = el.format.indexOf("%", i)) != -1) {
timeNow += el.format.substring(i, index);
index++;
// modifier flag
//switch (el.format.charAt(index++)) {
//}
var property = $.fn.jclock.getProperty(now, el, el.format.charAt(index));
index++;
//switch (switchCase) {
//}
timeNow += property;
i = index
}
timeNow += el.format.substring(i);
return timeNow;
};
$.fn.jclock.getProperty = function(dateObject, el, property) {
switch (property) {
case "a": // abbrv day names
return (el.daysAbbrvNames[dateObject.getDay()]);
case "A": // full day names
return (el.daysFullNames[dateObject.getDay()]);
case "b": // abbrv month names
return (el.monthsAbbrvNames[dateObject.getMonth()]);
case "B": // full month names
return (el.monthsFullNames[dateObject.getMonth()]);
case "d": // day 01-31
return ((dateObject.getDate() < 10) ? "0" : "") + dateObject.getDate();
case "H": // hour as a decimal number using a 24-hour clock (range 00 to 23)
return ((dateObject.getHours() < 10) ? "0" : "") + dateObject.getHours();
case "I": // hour as a decimal number using a 12-hour clock (range 01 to 12)
var hours = (dateObject.getHours() % 12 || 12);
return ((hours < 10) ? "0" : "") + hours;
case "m": // month number
return (((dateObject.getMonth() + 1) < 10) ? "0" : "") + (dateObject.getMonth() + 1);
case "M": // minute as a decimal number
return ((dateObject.getMinutes() < 10) ? "0" : "") + dateObject.getMinutes();
case "p": // either `am' or `pm' according to the given time value,
// or the corresponding strings for the current locale
return (dateObject.getHours() < 12 ? "am" : "pm");
case "P": // either `AM' or `PM' according to the given time value,
return (dateObject.getHours() < 12 ? "AM" : "PM");
case "S": // second as a decimal number
return ((dateObject.getSeconds() < 10) ? "0" : "") + dateObject.getSeconds();
case "y": // two-digit year
return dateObject.getFullYear().toString().substring(2);
case "Y": // full year
return (dateObject.getFullYear());
case "%":
return "%";
}
}
// plugin defaults (24-hour)
$.fn.jclock.defaults = {
format: '%H:%M:%S',
utcOffset: 0,
utc: false,
fontFamily: '',
fontSize: '',
foreground: '',
background: '',
seedTime: undefined,
timeout: 1000 // 1000 = one second, 60000 = one minute
};
})(jQuery);