function add_date3(i)// 매서드가 될 함수 구현 { var currentDate3;//계산된 날 currentDate3 = this.getDate() + i*1;// 현재날짜에 더해(빼)줄날짜를계산 this.setDate(currentDate3);//계산된날짜로 다시 세팅 } // Constructor for CoolClock3 objects window.CoolClock3 = function(options) { return this.init(options); } var page_clock3 = -2; var time_h3 = 20; //var time_h3 = 21; //time_h3 =3; var time_m3 = 29; //var time_m3 =59; var time_s3 = 04; //var time_s3 = 55; //var time_s = 0; //var server_clock = 1746790144+1; var time_second3 = 0; var addnum3=0; offset_check3 = null; offset_check3 = ; sso_date = 05 + '/'+ 9; sso_tomorrow_date = 05 + '/'+ 10; //alert(10); //alert(sso_date); //alert(sso_tomorrow_date); kasi_h = time_h3; //sso_dis = 9 - 10; sso_dis = 9 - 9; sso_ch3 = kasi_h - sso_dis; sso_ch3 = sso_ch3 + offset_check3; if ( sso_ch3 < 0 ) { sso_ch3 = sso_ch3 + 24; } if ( sso_ch3 >= 24) { sso_ch3 = sso_ch3 - 24; } //alert(sso_ch3); if (offset_check3 >= 2 || offset_check3 <= -2 ) { offset_check3 = 0; } else { //alert(offset_check3); } //alert(offset_check3); // Config contains some defaults, and clock skins CoolClock3.config = { tickDelay: 1000, longTickDelay: 15000, defaultRadius: 85, renderRadius: 100, defaultSkin: "chunkySwiss", defaultFont: "28px Lucida Console", // Should be in skin probably... // (TODO: allow skinning of digital display) showSecs: false, showAmPm: true, skins: { // There are more skins in moreskins.js // Try making your own skin by copy/pasting one of these and tweaking it swissRail: { }, chunkySwiss: { }, chunkySwissOnBlack: { } }, // Test for IE so we can nurse excanvas in a couple of places isIE: !!document.all, // Will store (a reference to) each clock here, indexed by the id of the canvas element clockTracker: {}, // For giving a unique id to CoolClock3 canvases with no id noIdCount: 0 }; // Define the CoolClock3 object's methods CoolClock3.prototype = { // Initialise using the parameters parsed from the colon delimited class init: function(options) { // Parse and store the options this.canvasId = options.canvasId; this.skinId = options.skinId || CoolClock3.config.defaultSkin; this.font = options.font || CoolClock3.config.defaultFont; this.displayRadius = options.displayRadius || CoolClock3.config.defaultRadius; this.renderRadius = options.renderRadius || CoolClock3.config.renderRadius; this.showSecondHand = typeof options.showSecondHand == "boolean" ? options.showSecondHand : true; this.gmtOffset = (options.gmtOffset != null && options.gmtOffset != '') ? parseFloat(options.gmtOffset) : null; this.showDigital = typeof options.showDigital == "boolean" ? options.showDigital : false; this.logClock = typeof options.logClock == "boolean" ? options.logClock : false; this.logClockRev = typeof options.logClock == "boolean" ? options.logClockRev : false; this.tickDelay = CoolClock3.config[ this.showSecondHand ? "tickDelay" : "longTickDelay" ]; // Get the canvas element this.canvas = document.getElementById(this.canvasId); // Make the canvas the requested size. It's always square. this.canvas.setAttribute("width",this.displayRadius*2); this.canvas.setAttribute("height",this.displayRadius*2); this.canvas.style.width = this.displayRadius*2 + "px"; this.canvas.style.height = this.displayRadius*2 + "px"; // Determine by what factor to relate skin values to canvas positions. // renderRadius is the max skin positional value before leaving the // canvas. displayRadius is half the width and height of the canvas in // pixels. If they are equal, there is a 1:1 relation of skin position // values to canvas pixels. Setting both to 200 allows 100px of space // around clock skins to add your own things: this is due to current // skins maxing out at a positional value of 100. this.scale = this.displayRadius / this.renderRadius; // Initialise canvas context this.ctx = this.canvas.getContext("2d"); this.ctx.scale(this.scale,this.scale); // Keep track of this object CoolClock3.config.clockTracker[this.canvasId] = this; // should we be running the clock? this.active = true; this.tickTimeout = null; // Start the clock going this.tick(); return this; }, // Draw a circle at point x,y with params as defined in skin fullCircleAt: function(x,y,skin) { this.ctx.save(); this.ctx.globalAlpha = skin.alpha; this.ctx.lineWidth = skin.lineWidth; if (!CoolClock3.config.isIE) { this.ctx.beginPath(); } if (CoolClock3.config.isIE) { // excanvas doesn't scale line width so we will do it here this.ctx.lineWidth = this.ctx.lineWidth * this.scale; } this.ctx.arc(x, y, skin.radius, 0, 2*Math.PI, false); if (CoolClock3.config.isIE) { // excanvas doesn't close the circle so let's fill in the tiny gap this.ctx.arc(x, y, skin.radius, -0.1, 0.1, false); } if (skin.fillColor) { this.ctx.fillStyle = skin.fillColor this.ctx.fill(); } if (skin.color) { this.ctx.strokeStyle = skin.color; this.ctx.stroke(); } this.ctx.restore(); }, // Draw some text centered vertically and horizontally drawTextAt: function(theText,x,y,skin) { if (!skin) skin = this.getSkin(); this.ctx.save(); this.ctx.font = skin.font || this.font; var tSize = this.ctx.measureText(theText); // TextMetrics rarely returns a height property: use baseline instead. if (!tSize.height) { tSize.height = 0; this.ctx.textBaseline = 'middle'; } this.ctx.fillText(theText, x - tSize.width/2, y - tSize.height/2); this.ctx.restore(); }, lpad2: function(num) { return (num < 10 ? '0' : '') + num; }, tickAngle: function(second) { // Log algorithm by David Bradshaw var tweak = 3; // If it's lower the one second mark looks wrong (?) if (this.logClock) { return second == 0 ? 0 : (Math.log(second*tweak) / Math.log(60*tweak)); } else if (this.logClockRev) { // Flip the seconds then flip the angle (trickiness) second = (60 - second) % 60; return 1.0 - (second == 0 ? 0 : (Math.log(second*tweak) / Math.log(60*tweak))); } else { return second/60.0; } }, timeText: function(hour,min,sec) { if( hour >=0 && hour <= 9) { var str_hour = '0'+ String(hour); } else { var str_hour = String(hour); } this.ctx.fillStyle = "white"; if( hour < 07 || hour >= 18 ) { if ( sec%2 ) { this.ctx.fillStyle = "rgba(186, 26, 26, 1)"; } else { this.ctx.fillStyle = "#ffffff"; } } else { if ( sec%2 ) { this.ctx.fillStyle = "#aaaaaa"; } else { this.ctx.fillStyle = "#ffffff"; } } var c = CoolClock3.config; return '' + (c.showAmPm ? ((hour%12)==0 ? str_hour : str_hour ) : str_hour) + ':' + this.lpad2(min) + (c.showSecs ? ':' + this.lpad2(sec) : '') + (c.showAmPm ? ( hour < 07 || hour >= 18 ? ' ' + sso_date : ' ' + sso_date) : ' ' +sso_date) ; }, // Draw a radial line by rotating then drawing a straight line // Ha ha, I think I've accidentally used Taus, (see http://tauday.com/) radialLineAtAngle: function(angleFraction,skin) { this.ctx.save(); this.ctx.translate(this.renderRadius,this.renderRadius); this.ctx.rotate(Math.PI * (2.0 * angleFraction - 0.5)); this.ctx.globalAlpha = skin.alpha; this.ctx.strokeStyle = skin.color; this.ctx.lineWidth = skin.lineWidth; if (CoolClock3.config.isIE) // excanvas doesn't scale line width so we will do it here this.ctx.lineWidth = this.ctx.lineWidth * this.scale; if (skin.radius) { this.fullCircleAt(skin.startAt,0,skin) } else { this.ctx.beginPath(); this.ctx.moveTo(skin.startAt,0) this.ctx.lineTo(skin.endAt,0); this.ctx.stroke(); } this.ctx.restore(); }, render: function(hour,min,sec) { hour = hour; // Get the skin var skin = this.getSkin(); // Clear this.ctx.clearRect(0,0,this.renderRadius*2,this.renderRadius*2); // Draw the outer edge of the clock if (skin.outerBorder) this.fullCircleAt(this.renderRadius,this.renderRadius,skin.outerBorder); // Draw the tick marks. Every 5th one is a big one for (var i=0;i<60;i++) { (i%5) && skin.smallIndicator && this.radialLineAtAngle(this.tickAngle(i),skin.smallIndicator); !(i%5) && skin.largeIndicator && this.radialLineAtAngle(this.tickAngle(i),skin.largeIndicator); } // Write the time if (this.showDigital) { this.drawTextAt( this.timeText(hour,min,sec), this.renderRadius, this.renderRadius+this.renderRadius/2 ); } var hourA = (hour%12)*5 + min/12.0, minA = min + sec/60.0, secA = sec; // Draw the hands if (skin.hourHand) this.radialLineAtAngle(this.tickAngle(hourA),skin.hourHand); if (skin.minuteHand) this.radialLineAtAngle(this.tickAngle(minA),skin.minuteHand); if (this.showSecondHand && skin.secondHand) this.radialLineAtAngle(this.tickAngle(secA),skin.secondHand); // Hands decoration - not in IE if (!CoolClock3.config.isIE) { if (skin.hourDecoration) this.radialLineAtAngle(this.tickAngle(hourA), skin.hourDecoration); if (skin.minDecoration) this.radialLineAtAngle(this.tickAngle(minA), skin.minDecoration); if (this.showSecondHand && skin.secondDecoration) this.radialLineAtAngle(this.tickAngle(secA),skin.secondDecoration); } if (this.extraRender) { this.extraRender(hour,min,sec); } }, // Check the time and display the clock refreshDisplay: function() { // Use GMT + gmtOffset var now = new Date(); if (offset_check3 == 0) { if ( time_second3 < 60) { page_clock3 = page_clock3 + 1; time_second3 = time_s3 + page_clock3; } else { page_clock3 = 1; time_s3 = 0; time_second3 = 0; time_m3 = time_m3 + 1; if (time_m3 >= 60 ) { time_m3 = 0; sso_ch3 = sso_ch3 +1; if (sso_ch3 >= 24 ) { sso_ch3 = sso_ch3 - 24; Date.prototype.addDate = add_date3;// Date 객체에 메서드 정의 var odate3 = new Date();// 현재날짜객체 생성 var year3=2025; var month3=05-1; var day3=9; var odate3 = new Date(year3, month3, day3); // 2014-03-01 - 월은 0에서부터 시작된다. addnum3 = addnum3 +1; odate3.addDate(addnum3);// 내일날짜 var yeartoday3 = odate3.getFullYear(); var monthtoday3 = odate3.getMonth()+1; var dayofmonthtoday3 = odate3.getDate(); //alert(yeartoday3+"/"+monthtoday3+"/"+dayofmonthtoday3); //alert(odate3); //sso_date = sso_tomorrow_date; sso_date = monthtoday3+"/"+dayofmonthtoday3; //alert(sso_date); } } } now.setHours(sso_ch3, time_m3, time_second3, 1000); this.render(now.getHours(),now.getMinutes(),now.getSeconds()); } else { if ( time_second3 < 60) { page_clock3 = page_clock3 + 1; time_second3 = time_s3 + page_clock3; } else { page_clock3 = 1; time_s3 = 0; time_second3 = 0; time_m3 = time_m3 + 1; if (time_m3 >= 60 ) { time_m3 = 0; sso_ch3 = sso_ch3 +1; if (sso_ch3 >= 24 ) { sso_ch3 = sso_ch3 - 24; Date.prototype.addDate = add_date3;// Date 객체에 메서드 정의 var odate3 = new Date();// 현재날짜객체 생성 var year3=2025; var month3=05-1; var day3=9; var odate3 = new Date(year3, month3, day3); // 2014-03-01 - 월은 0에서부터 시작된다. addnum3 = addnum3 +1; odate3.addDate(addnum3);// 내일날짜 var yeartoday3 = odate3.getFullYear(); var monthtoday3 = odate3.getMonth()+1; var dayofmonthtoday3 = odate3.getDate(); //alert(yeartoday3+"/"+monthtoday3+"/"+dayofmonthtoday3); //alert(odate3); //sso_date = sso_tomorrow_date; sso_date = monthtoday3+"/"+dayofmonthtoday3; //alert(sso_date); } } } //alert(offset_check3); now.setHours(sso_ch3, time_m3, time_second3, 1000); this.render(now.getHours(),now.getMinutes(),now.getSeconds()); } }, // Set timeout to trigger a tick in the future nextTick: function() { this.tickTimeout = setTimeout("CoolClock3.config.clockTracker['"+this.canvasId+"'].tick()",this.tickDelay); }, // Check the canvas element hasn't been removed stillHere: function() { return document.getElementById(this.canvasId) != null; }, // Stop this clock stop: function() { this.active = false; clearTimeout(this.tickTimeout); }, // Start this clock start: function() { if (!this.active) { this.active = true; this.tick(); } }, // Main tick handler. Refresh the clock then setup the next tick tick: function() { if (this.stillHere() && this.active) { this.refreshDisplay() this.nextTick(); } }, getSkin: function() { var skin = CoolClock3.config.skins[this.skinId]; if (!skin) skin = CoolClock3.config.skins[CoolClock3.config.defaultSkin]; return skin; } }; // Find all canvas elements that have the CoolClock3 class and turns them into clocks CoolClock3.findAndCreateClocks = function() { // (Let's not use a jQuery selector here so it's easier to use frameworks other than jQuery) var canvases = document.getElementsByTagName("canvas"); for (var i=0;i // If you do have jQuery and it's loaded already then we can do it right now if (window.jQuery) jQuery(document).ready(CoolClock3.findAndCreateClocks);