if (args.onClick) {this.onClick = args.onClick;}
if (args.onHold) {this.onHold = args.onHold;}
if (args.onMove) {this.onMove = args.onMove;}
-
- /* Img shadow styles */
- if (args.shadowOffsetX) {this.shadowOffsetX = args.shadowOffsetX;}
+
+ /* Img shadow styles */
+ if (args.shadowOffsetX) {this.shadowOffsetX = args.shadowOffsetX;}
if (args.shadowOffsetY) {this.shadowOffsetY = args.shadowOffsetY;}
if (args.shadowBlur) {this.shadowBlur = args.shadowBlur;}
if (args.shadowColor) {this.shadowColor = args.shadowColor;}
{
if (this.visible)
{
- this.ctx.save();
-
- this.ctx.shadowBlur = this.shadowBlur;
- this.ctx.shadowColor = this.shadowColor;
- this.ctx.shadowOffsetX = this.shadowOffsetX;
- this.ctx.shadowOffsetY = this.shadowOffsetY;
-
- this.ctx.drawImage(this.img, this.xLoc, this.yLoc, this.width, this.height);
-
- this.ctx.restore();
+ this.ctx.save();
+
+ this.ctx.shadowBlur = this.shadowBlur;
+ this.ctx.shadowColor = this.shadowColor;
+ this.ctx.shadowOffsetX = this.shadowOffsetX;
+ this.ctx.shadowOffsetY = this.shadowOffsetY;
+
+ this.ctx.drawImage(this.img, this.xLoc, this.yLoc, this.width, this.height);
+
+ this.ctx.restore();
+
+ if (this.textObj != undefined)
+ this.textObj.drawObj();
- if (this.textObj != undefined)
- this.textObj.drawObj();
-
- if (this.icon != undefined)
- this.icon.drawObj();
+ if (this.icon != undefined)
+ this.icon.drawObj();
}
}
var incomingTextTemplate = {"font" : "bold 80pt Arial", "fillStyle" : "white", "textAlign" : "center", "textBaseline" : "middle",
"shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 0, "shadowColor" : "rgba(0, 0, 0, 1.0)"};
-
+
var callTimeTextTemplate = {"font" : "bold 30pt Arial", "fillStyle" : "white", "textAlign" : "left", "textBaseline" : "top",
"shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 0, "shadowColor" : "rgba(0, 0, 0, 1.0)"};
function updateNumber(number)
{
- currentNumber = number;
-
- if (number.length === 10)
- {
- number = number.slice(0,3) + '-' + number.slice(3,6) + '-' + number.slice(6,10);
- }
-
- callPage.getObj("displayedNumber").text = number;
+ currentNumber = number;
+
+ if (number.length === 10)
+ {
+ number = number.slice(0,3) + '-' + number.slice(3,6) + '-' + number.slice(6,10);
+ }
+
+ callPage.getObj("displayedNumber").text = number;
}
function startTimer(timeText)
{
- var today = new Date();
- startTime = today.getTime();
-
- timerInterval = setInterval( function() {
- var today = new Date();
- var currentTime = today.getTime();
- callTime = Math.floor((currentTime - startTime) / 1000);
-
- callPage.getObj("callTime").text = callTime;
- callPage.drawMenu();
- }, 1000);
+ var today = new Date();
+ startTime = today.getTime();
+
+ timerInterval = setInterval( function() {
+ var today = new Date();
+ var currentTime = today.getTime();
+ callTime = Math.floor((currentTime - startTime) / 1000);
+
+ callPage.getObj("callTime").text = callTime;
+ callPage.drawMenu();
+ }, 1000);
}
function stopTimer()
{
- clearInterval(timerInterval);
+ clearInterval(timerInterval);
}
function initCallPage(initState)
{
- if (initState == "dialing" || initState == "inCall")
- var buttonWidth = screenWidth * 0.6;
- else
- var buttonWidth = (screenWidth * 0.8) / 2;
-
- var buttonHeight = screenHeight * 0.15;
-
-
- var incomingBar = callPage.addObject(mainCtx, "shape", {"name" : "incomingBar", "xLoc" : -20, "yLoc" : screenHeight * 0.2, "width" : screenWidth + 40,
- "height" : screenHeight * 0.6, "fillStyle" : "#51504F", "strokeStyle" : "#B3BF3C", "lineWidth" : 5})
-
- var displayedNumber = callPage.addObject(mainCtx, "text", {"name" : "displayedNumber", "xLoc" : screenWidth / 2, "yLoc" : incomingBar.yLoc + incomingBar.height * 0.4, "width" : screenWidth * 0.75,
- "height" : screenHeight * 0.4, "text" : currentNumber, "template" : incomingTextTemplate})
-
+ if (initState == "dialing" || initState == "inCall")
+ var buttonWidth = screenWidth * 0.6;
+ else
+ var buttonWidth = (screenWidth * 0.8) / 2;
+
+ var buttonHeight = screenHeight * 0.15;
+
+
+ var incomingBar = callPage.addObject(mainCtx, "shape", {"name" : "incomingBar", "xLoc" : -20, "yLoc" : screenHeight * 0.2, "width" : screenWidth + 40,
+ "height" : screenHeight * 0.6, "fillStyle" : "#51504F", "strokeStyle" : "#B3BF3C", "lineWidth" : 5});
+
+ var displayedNumber = callPage.addObject(mainCtx, "text", {"name" : "displayedNumber", "xLoc" : screenWidth / 2, "yLoc" : incomingBar.yLoc + incomingBar.height * 0.4, "width" : screenWidth * 0.75,
+ "height" : screenHeight * 0.4, "text" : currentNumber, "template" : incomingTextTemplate});
+
var clockIcon = callPage.addObject(mainCtx, "image", {"name" : "clock", "image": images.clockIcon, "xLoc" : screenWidth * 0.7,
- "yLoc" : incomingBar.yLoc + 30, "width" : 50, "height" : 50} );
-
- var callTime = callPage.addObject(mainCtx, "text", {"name" : "callTime", "xLoc" : clockIcon.xLoc + clockIcon.width + 10, "yLoc" : clockIcon.yLoc, "width" : screenWidth * 0.2,
- "height" : 100, "text" : "00:00:00", "template" : callTimeTextTemplate})
-
- var endCallButton;
-
- if (initState == "dialing" || initState == "inCall")
- {
- endCallButton = callPage.addObject(buttonCtx, "button", {"name" : "endCallButton", "image": images.incomingDeclineButton, "icon": images.endCallIcon, "iconWidth" : 100, "iconHeight" : 100, "xLoc" : screenWidth * 0.2,
- "yLoc" : incomingBar.yLoc + incomingBar.height - buttonHeight - 50, "width" : buttonWidth, "height" : buttonHeight} );
-
- callPage.getObj("acceptCallButton").visible = false;
- }
- else
- {
- acceptCallButton = callPage.addObject(buttonCtx, "button", {"name" : "acceptCallButton", "image": images.incomingAcceptButton, "icon": images.callIcon, "iconWidth" : 100, "iconHeight" : 100, "xLoc" : screenWidth * 0.1,
- "yLoc" : incomingBar.yLoc + incomingBar.height - buttonHeight - 50, "width" : buttonWidth, "height" : buttonHeight, "visible" : true} );
-
- endCallButton = callPage.addObject(buttonCtx, "button", {"name" : "endCallButton", "image": images.incomingDeclineButton, "icon": images.endCallIcon, "iconWidth" : 100, "iconHeight" : 100, "xLoc" : acceptCallButton.xLoc + acceptCallButton.width + 20,
- "yLoc" : incomingBar.yLoc + incomingBar.height - buttonHeight - 50, "width" : buttonWidth, "height" : buttonHeight} );
- }
-
- endCallButton.onClick = function(){
- send({
- "api_namespace" : "tizen.ivi.dialer",
- "type": "method",
- "command": "hangup"
+ "yLoc" : incomingBar.yLoc + 30, "width" : 50, "height" : 50} );
+
+ var callTime = callPage.addObject(mainCtx, "text", {"name" : "callTime", "xLoc" : clockIcon.xLoc + clockIcon.width + 10, "yLoc" : clockIcon.yLoc, "width" : screenWidth * 0.2,
+ "height" : 100, "text" : "00:00:00", "template" : callTimeTextTemplate});
+
+ var endCallButton;
+
+ if (initState == "dialing" || initState == "inCall")
+ {
+ endCallButton = callPage.addObject(buttonCtx, "button", {"name" : "endCallButton", "image": images.incomingDeclineButton, "icon": images.endCallIcon, "iconWidth" : 100, "iconHeight" : 100, "xLoc" : screenWidth * 0.2,
+ "yLoc" : incomingBar.yLoc + incomingBar.height - buttonHeight - 50, "width" : buttonWidth, "height" : buttonHeight} );
+
+ callPage.getObj("acceptCallButton").visible = false;
+ }
+ else
+ {
+ acceptCallButton = callPage.addObject(buttonCtx, "button", {"name" : "acceptCallButton", "image": images.incomingAcceptButton, "icon": images.callIcon, "iconWidth" : 100, "iconHeight" : 100, "xLoc" : screenWidth * 0.1,
+ "yLoc" : incomingBar.yLoc + incomingBar.height - buttonHeight - 50, "width" : buttonWidth, "height" : buttonHeight, "visible" : true} );
+
+ endCallButton = callPage.addObject(buttonCtx, "button", {"name" : "endCallButton", "image": images.incomingDeclineButton, "icon": images.endCallIcon, "iconWidth" : 100, "iconHeight" : 100,
+ "xLoc" : acceptCallButton.xLoc + acceptCallButton.width + 20, "yLoc" : incomingBar.yLoc + incomingBar.height - buttonHeight - 50, "width" : buttonWidth, "height" : buttonHeight} );
+ }
+
+ endCallButton.onClick = function(){
+ send({
+ "api_namespace" : "tizen.ivi.dialer",
+ "type": "method",
+ "command": "hangup"
});
- currentState = "idle";
- switchMenu(mainPage);
- stopTimer();
- };
-
-}
\ No newline at end of file
+ currentState = "idle";
+ switchMenu(mainPage);
+ stopTimer();
+ };
+
for (i = 0; i < pageObj.canvasObjs.length; i++)
{
- if (pageObj.canvasObjs[i] != undefined && pageObj.canvasObjs[i].visible != false)
- {
- currItem = pageObj.canvasObjs[i];
-
- if (xLoc > currItem.xLoc && xLoc < (currItem.xLoc + currItem.width))
- {
- if (yLoc > currItem.yLoc && yLoc < (currItem.yLoc + currItem.height))
- {
- if (prevItem == undefined || (currItem.ctx.canvas.style.zIndex > prevItem.ctx.canvas.style.zIndex) ||
- ((currItem.ctx.canvas.style.zIndex === prevItem.ctx.canvas.style.zIndex) && (currItem.zLoc > prevItem.zLoc)))
- prevItem = currItem;
- }
- }
+ if (pageObj.canvasObjs[i] != undefined && pageObj.canvasObjs[i].visible != false)
+ {
+ currItem = pageObj.canvasObjs[i];
+
+ if (xLoc > currItem.xLoc && xLoc < (currItem.xLoc + currItem.width))
+ {
+ if (yLoc > currItem.yLoc && yLoc < (currItem.yLoc + currItem.height))
+ {
+ if (prevItem == undefined || (currItem.ctx.canvas.style.zIndex > prevItem.ctx.canvas.style.zIndex) ||
+ ((currItem.ctx.canvas.style.zIndex === prevItem.ctx.canvas.style.zIndex) && (currItem.zLoc > prevItem.zLoc)))
+ prevItem = currItem;
}
+ }
+ }
}
- if (prevItem)
- return prevItem;
-
+ if (prevItem)
+ return prevItem;
+
return undefined;
}
function drawRoundedRectangle(ctx, xLoc, yLoc, width, height, cornerRadius, strokeStyle, fillStyle, lineWidth)
{
- ctx.save();
- ctx.strokeStyle = strokeStyle;
- ctx.lineWidth = lineWidth;
- ctx.fillStyle = fillStyle;
- ctx.beginPath();
- ctx.moveTo(xLoc + cornerRadius, yLoc);
- ctx.lineTo(xLoc + width - cornerRadius, yLoc);
- ctx.quadraticCurveTo(xLoc + width, yLoc, xLoc + width, yLoc + cornerRadius);
- ctx.lineTo(xLoc + width, yLoc + height - cornerRadius);
- ctx.quadraticCurveTo(xLoc + width, yLoc + height, xLoc + width - cornerRadius, yLoc + height);
- ctx.lineTo(xLoc + cornerRadius, yLoc + height);
- ctx.quadraticCurveTo(xLoc, yLoc + height, xLoc, yLoc + height - cornerRadius);
- ctx.lineTo(xLoc, yLoc + cornerRadius);
- ctx.quadraticCurveTo(xLoc, yLoc, xLoc + cornerRadius, yLoc);
- ctx.closePath();
- ctx.stroke();
- ctx.fill();
- ctx.restore();
+ ctx.save();
+ ctx.strokeStyle = strokeStyle;
+ ctx.lineWidth = lineWidth;
+ ctx.fillStyle = fillStyle;
+ ctx.beginPath();
+ ctx.moveTo(xLoc + cornerRadius, yLoc);
+ ctx.lineTo(xLoc + width - cornerRadius, yLoc);
+ ctx.quadraticCurveTo(xLoc + width, yLoc, xLoc + width, yLoc + cornerRadius);
+ ctx.lineTo(xLoc + width, yLoc + height - cornerRadius);
+ ctx.quadraticCurveTo(xLoc + width, yLoc + height, xLoc + width - cornerRadius, yLoc + height);
+ ctx.lineTo(xLoc + cornerRadius, yLoc + height);
+ ctx.quadraticCurveTo(xLoc, yLoc + height, xLoc, yLoc + height - cornerRadius);
+ ctx.lineTo(xLoc, yLoc + cornerRadius);
+ ctx.quadraticCurveTo(xLoc, yLoc, xLoc + cornerRadius, yLoc);
+ ctx.closePath();
+ ctx.stroke();
+ ctx.fill();
+ ctx.restore();
}
function onMouseDown(event)
{
- var selectedObj = objectsAtLocation(currentPage, event.clientX, event.clientY);
-
- if (selectedObj && selectedObj.onClick)
- selectedObj.onClick(event);
+ var selectedObj = objectsAtLocation(currentPage, event.clientX, event.clientY);
+
+ if (selectedObj && selectedObj.onClick)
+ selectedObj.onClick(event);
prevXMouse = event.clientX;
prevYMouse = event.clientY;
function onMouseMove(event)
{
- var selectedObj = objectsAtLocation(currentPage, event.clientX, event.clientY);
- if (selectedObj && selectedObj.onMove)
- selectedObj.onMove(event)
-
+ var selectedObj = objectsAtLocation(currentPage, event.clientX, event.clientY);
+ if (selectedObj && selectedObj.onMove)
+ selectedObj.onMove(event);
+
prevXMouse = event.clientX;
prevYMouse = event.clientY;
}
$(mouseClicksLayer).attr('height', screenHeight);
if (currentPage)
- initPages();
+ initPages();
}
function loadImages(sources, callback)
for (var src in sources)
{
- numImages++;
+ numImages++;
}
for (var src in sources)
{
- images[src] = new Image();
- images[src].onload = function(){
- if (++loadedImages >= numImages) {
- callback(images);
- }
- };
- images[src].src = sources[src];
+ images[src] = new Image();
+ images[src].onload = function(){
+ if (++loadedImages >= numImages) {
+ callback(images);
+ }
+ };
+ images[src].src = sources[src];
}
}
function handleMsg(incomingMsg)
{
- if (incomingMsg.event)
+ if (incomingMsg.event)
+ {
+ switch (incomingMsg.event)
{
- switch (incomingMsg.event)
- {
- case "incoming_call":
- currentState = "incomingCall";
- initCallPage("incomingCall");
- switchMenu("callPage");
- break;
- default:
- break;
- }
+ case "incoming_call":
+ currentState = "incomingCall";
+ initCallPage("incomingCall");
+ switchMenu("callPage");
+ break;
+ default:
+ break;
}
+ }
}
function connect()
{
var host = window.location.hostname;
- ws = new WebSocket("ws://localhost:9999/");
-
+ ws = new WebSocket("ws://localhost:9999/");
+
ws.onopen = function() {
send({
"type": "connect",
};
ws.onmessage = function (e) {
- jsonMsg = JSON.parse(e.data);
- handleMsg(jsonMsg);
- console.log(e.data);
+ jsonMsg = JSON.parse(e.data);
+ handleMsg(jsonMsg);
+ console.log(e.data);
};
ws.onclose = function(e) {
- alert("Connecition closed");
- console.log(e);
+ alert("Connecition closed");
+ console.log(e);
};
}
mainCtx = mainCanvas.getContext("2d");
bgCtx = bgCanvas.getContext("2d");
buttonCtx = buttonCanvas.getContext("2d");
-
+
var sources = {
- phoneIcon: "images/bluetooth-smartphone.png",
- callButton: "images/ivi_btn-call.png",
- callButtonPressed: "images/ivi_btn-call-active.png",
- closeButton: "images/ivi_btn-close.png",
- deleteButton: "images/ivi_btn-delete.png",
- deleteButtonActive: "images/ivi_btn-delete-active.png",
- endCallButton: "images/ivi_btn-endcall.png",
- endCallButtonActive: "images/ivi_btn-endcall-active.png",
- incomingAcceptButton: "images/ivi_btn-incomingcall-accept.png",
- incomingAcceptButtonActive: "images/ivi_btn-incomingcall-accept-active.png",
- incomingDeclineButton: "images/ivi_btn-incomingcall-decline.png",
- incomingDeclineButtonActive: "images/ivi_btn-incomingcall-decline-active.png",
- listItem: "images/ivi_btn-list.png",
- listItemActive: "images/ivi_btn-list-active.png",
- numberButton: "images/ivi_btn-numbers.png",
- numberButtonActive: "images/ivi_btn-numbers-active.png",
- buttonBG: "images/ivi_buttonarea.png",
- callIcon: "images/ivi_icon-call.png",
- deleteIcon: "images/ivi_icon-delete.png",
- endCallIcon: "images/ivi_icon-endcall.png",
- deleteListItemIcon: "images/ivi_icon-list-delete.png",
- deleteListItemIconActive: "images/ivi_icon-list-delete-active.png",
- clockIcon: "images/ivi_icon-time.png",
- textArea: "images/ivi_textarea.png",
- bgImage: "images/ivi-v1_ivi-background.jpg"
+ phoneIcon: "images/bluetooth-smartphone.png",
+ callButton: "images/ivi_btn-call.png",
+ callButtonPressed: "images/ivi_btn-call-active.png",
+ closeButton: "images/ivi_btn-close.png",
+ deleteButton: "images/ivi_btn-delete.png",
+ deleteButtonActive: "images/ivi_btn-delete-active.png",
+ endCallButton: "images/ivi_btn-endcall.png",
+ endCallButtonActive: "images/ivi_btn-endcall-active.png",
+ incomingAcceptButton: "images/ivi_btn-incomingcall-accept.png",
+ incomingAcceptButtonActive: "images/ivi_btn-incomingcall-accept-active.png",
+ incomingDeclineButton: "images/ivi_btn-incomingcall-decline.png",
+ incomingDeclineButtonActive: "images/ivi_btn-incomingcall-decline-active.png",
+ listItem: "images/ivi_btn-list.png",
+ listItemActive: "images/ivi_btn-list-active.png",
+ numberButton: "images/ivi_btn-numbers.png",
+ numberButtonActive: "images/ivi_btn-numbers-active.png",
+ buttonBG: "images/ivi_buttonarea.png",
+ callIcon: "images/ivi_icon-call.png",
+ deleteIcon: "images/ivi_icon-delete.png",
+ endCallIcon: "images/ivi_icon-endcall.png",
+ deleteListItemIcon: "images/ivi_icon-list-delete.png",
+ deleteListItemIconActive: "images/ivi_icon-list-delete-active.png",
+ clockIcon: "images/ivi_icon-time.png",
+ textArea: "images/ivi_textarea.png",
+ bgImage: "images/ivi-v1_ivi-background.jpg"
};
loadImages(sources, resizeCanvas);
{
initMainPage();
initCallPage(currentState);
-
- bgCtx.drawImage(images.bgImage, 0, 0, screenWidth, screenHeight);
+
+ bgCtx.drawImage(images.bgImage, 0, 0, screenWidth, screenHeight);
currentPage.drawMenu();
}
$(document).ready(function () {
init();
- });
\ No newline at end of file
+ });
ImageObject.prototype.update = function(args)
{
- if (args.name) {this.name = args.name;}
+ if (args.name) {this.name = args.name;}
if (args.img) {this.img = args.img;}
if (args.xLoc) {this.xLoc = args.xLoc;}
if (args.yLoc) {this.yLoc = args.yLoc;}
if (args.zLoc) {this.zLoc = args.zLoc;}
if (args.width) {this.width = args.width;}
if (args.height) {this.height = args.height;}
-
+
if (args.ctx) {this.ctx = ctx;}
if (args.text !== undefined) {this.textObj.update({"text" : args.text, "xLoc" : (args.xLoc + (args.width / 2)), "yLoc" : (args.yLoc + (args.height / 2)), "zLoc" : (args.zLoc + 1), "template" : args.textTemplate})}
if (args.visible) {this.visible = args.visible;}
if (args.onClick) {this.onClick = args.onClick;}
-
- /* Img shadow styles */
+
+ /* Img shadow styles */
if (args.shadowOffsetX) {this.shadowOffsetX = args.shadowOffsetX;}
if (args.shadowOffsetY) {this.shadowOffsetY = args.shadowOffsetY;}
if (args.shadowBlur) {this.shadowBlur = args.shadowBlur;}
{
if (this.visible)
{
- this.ctx.drawImage(this.img, this.xLoc, this.yLoc, this.width, this.height);
-
- if (this.textObj != undefined)
- this.textObj.drawObj();
+ this.ctx.drawImage(this.img, this.xLoc, this.yLoc, this.width, this.height);
+
+ if (this.textObj != undefined)
+ this.textObj.drawObj();
}
}
function addButtonGrid (gridX, gridY, gridWidth, gridHeight)
{
- var spacer = 5;
- var iconWidth = ((gridWidth - (spacer * 4)) / 3);
- var iconHeight = ((gridHeight - (spacer * 6)) / 5);
-
+ var spacer = 5;
+ var iconWidth = ((gridWidth - (spacer * 4)) / 3);
+ var iconHeight = ((gridHeight - (spacer * 6)) / 5);
+
var iconXPosition = gridX + spacer;
var iconYPosition = gridY + spacer;
var firstIconXPosition = iconXPosition;
- var buttonNum = 1;
- var buttonText = "";
-
+ var buttonNum = 1;
+ var buttonText = "";
+
for (var i = 0; i < 12; i++)
{
- if (buttonNum > 9)
- {
- switch (buttonNum)
- {
- case 10:
- buttonText = "*";
- break;
- case 11:
- buttonText = "0";
- break;
- case 12:
- buttonText = "#";
- break;
- }
- }
- else
- buttonText = buttonNum.toString();
-
- var button = mainPage.addObject(buttonCtx, "button", {"name" : buttonText, "image": images.numberButton, "text" : buttonText, "textTemplate" : buttonTextTemplate, "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth, "height" : iconHeight} );
- button.onClick = function(){
-
- mainPage.getObj("textArea").textObj.text += this.name;
- mainPage.drawMenu();
- };
-
- iconXPosition += (iconWidth + spacer);
-
- if ((i + 1) % 3 === 0)
- {
- iconYPosition += (iconHeight + spacer);
- iconXPosition = firstIconXPosition;
- }
-
- buttonNum += 1;
+ if (buttonNum > 9)
+ {
+ switch (buttonNum)
+ {
+ case 10:
+ buttonText = "*";
+ break;
+ case 11:
+ buttonText = "0";
+ break;
+ case 12:
+ buttonText = "#";
+ break;
+ }
+ }
+ else
+ buttonText = buttonNum.toString();
+
+ var button = mainPage.addObject(buttonCtx, "button", {"name" : buttonText, "image": images.numberButton, "text" : buttonText, "textTemplate" : buttonTextTemplate, "xLoc" : iconXPosition,
+ "yLoc" : iconYPosition, "width" : iconWidth, "height" : iconHeight} );
+
+ button.onClick = function(){
+ mainPage.getObj("textArea").textObj.text += this.name;
+ mainPage.drawMenu();
+ };
+
+ iconXPosition += (iconWidth + spacer);
+
+ if ((i + 1) % 3 === 0)
+ {
+ iconYPosition += (iconHeight + spacer);
+ iconXPosition = firstIconXPosition;
+ }
+
+ buttonNum += 1;
}
-
- buttonNum = 13
- button = mainPage.addObject(buttonCtx, "button", {"name" : "del", "image": images.deleteButton, "icon": images.deleteIcon, "iconWidth" : iconHeight * 0.9, "iconHeight" : iconHeight * 0.9, "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth, "height" : iconHeight} );
+
+ buttonNum = 13;
+ button = mainPage.addObject(buttonCtx, "button", {"name" : "del", "image": images.deleteButton, "icon": images.deleteIcon, "iconWidth" : iconHeight * 0.9, "iconHeight" : iconHeight * 0.9,
+ "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth, "height" : iconHeight} );
iconXPosition += (iconWidth + spacer);
button.onClick = function(){
- mainPage.getObj("textArea").textObj.text = mainPage.getObj("textArea").textObj.text.slice(0,-1);
- mainPage.drawMenu();
- };
- buttonNum = 14
- button = mainPage.addObject(buttonCtx, "button", {"name" : "call", "image": images.callButton, "icon": images.callIcon, "iconWidth" : iconHeight * 0.9, "iconHeight" : iconHeight * 0.9, "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth * 2 + spacer, "height" : iconHeight} );
+ mainPage.getObj("textArea").textObj.text = mainPage.getObj("textArea").textObj.text.slice(0,-1);
+ mainPage.drawMenu();
+ };
+ buttonNum = 14;
+ button = mainPage.addObject(buttonCtx, "button", {"name" : "call", "image": images.callButton, "icon": images.callIcon, "iconWidth" : iconHeight * 0.9, "iconHeight" : iconHeight * 0.9,
+ "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth * 2 + spacer, "height" : iconHeight} );
+
button.onClick = function(){
- var dialNumber = mainPage.getObj("textArea").textObj.text;
- send({
- "api_namespace" : "tizen.ivi.dialer",
- "type": "method",
- "command": "dial_number",
- "number": dialNumber
- });
- initCallPage("dialing");
- updateNumber(dialNumber);
- switchMenu(callPage);
- currentState = "dialing";
- startTimer(callTime);
- };
+ var dialNumber = mainPage.getObj("textArea").textObj.text;
+
+ send({
+ "api_namespace" : "tizen.ivi.dialer",
+ "type": "method",
+ "command": "dial_number",
+ "number": dialNumber
+ });
+
+ initCallPage("dialing");
+ updateNumber(dialNumber);
+ switchMenu(callPage);
+ currentState = "dialing";
+ startTimer(callTime);
+ };
}
function initMainPage()
{
- var textAreaHeight = screenHeight / 4;
- var buttonPadWidth = screenWidth * 0.75;
- var buttonPadHeight = screenHeight - textAreaHeight - 60;
-
+ var textAreaHeight = screenHeight / 4;
+ var buttonPadWidth = screenWidth * 0.75;
+ var buttonPadHeight = screenHeight - textAreaHeight - 60;
+
addButtonGrid(20, textAreaHeight + 40, buttonPadWidth, buttonPadHeight);
mainPage.addObject(mainCtx, "image", {"name" : "textArea", "image": images.textArea, "text" : "", "textTemplate" : phoneNumberTextTemplate, "xLoc" : 20, "yLoc" : 20, "width" : buttonPadWidth, "height" : textAreaHeight} );
-
+
mainPage.addObject(mainCtx, "image", {"name" : "buttonBG","image": images.buttonBG, "xLoc" : 20, "yLoc" : textAreaHeight + 40, "width" : buttonPadWidth, "height" : buttonPadHeight} );
- var myobj = mainPage.addObject(mainCtx, "shape", {"name" : "optionsBG", "xLoc" : 40 + buttonPadWidth, "yLoc" : 0, "width" : (screenWidth * 0.25) - 60, "height" : screenHeight, "fillStyle" : "#51504F", "strokeStyle" : "#373736", "lineWidth" : 5})
-
-
+ var myobj = mainPage.addObject(mainCtx, "shape", {"name" : "optionsBG", "xLoc" : 40 + buttonPadWidth, "yLoc" : 0, "width" : (screenWidth * 0.25) - 60, "height" : screenHeight,
+ "fillStyle" : "#51504F", "strokeStyle" : "#373736", "lineWidth" : 5})
+
+
}
{
if (ctx && objType)
{
- var tmpObj;
- var index = -1;
-
- for (var i = 0; i < this.canvasObjs.length; i++)
- {
- if (this.canvasObjs[i].name === args.name)
- {
- index = i;
- break;
- }
- }
-
- if (index !== -1)
- {
- this.canvasObjs[index].update(args);
- }
- else
- {
- switch(objType)
- {
- case "button":
- tmpObj = new ButtonObject(ctx, args);
- if (tmpObj)
- this.canvasObjs.push(tmpObj);
- break;
- case "text":
- tmpObj = new TextObject(ctx, args);
- if (tmpObj)
- this.canvasObjs.push(tmpObj);
- break;
- case "image":
- tmpObj = new ImageObject(ctx, args);
- if (tmpObj)
- this.canvasObjs.push(tmpObj);
- break;
- case "shape":
- tmpObj = new ShapeObject(ctx, args);
- if (tmpObj)
- this.canvasObjs.push(tmpObj);
- break;
- default:
- console.log("Error: Unknown object type = " + objType);
- break;
- }
- }
+ var tmpObj;
+ var index = -1;
+
+ for (var i = 0; i < this.canvasObjs.length; i++)
+ {
+ if (this.canvasObjs[i].name === args.name)
+ {
+ index = i;
+ break;
+ }
+ }
+
+ if (index !== -1)
+ {
+ this.canvasObjs[index].update(args);
+ }
+ else
+ {
+ switch(objType)
+ {
+ case "button":
+ tmpObj = new ButtonObject(ctx, args);
+ if (tmpObj)
+ this.canvasObjs.push(tmpObj);
+ break;
+ case "text":
+ tmpObj = new TextObject(ctx, args);
+ if (tmpObj)
+ this.canvasObjs.push(tmpObj);
+ break;
+ case "image":
+ tmpObj = new ImageObject(ctx, args);
+ if (tmpObj)
+ this.canvasObjs.push(tmpObj);
+ break;
+ case "shape":
+ tmpObj = new ShapeObject(ctx, args);
+ if (tmpObj)
+ this.canvasObjs.push(tmpObj);
+ break;
+ default:
+ console.log("Error: Unknown object type = " + objType);
+ break;
+ }
+ }
}
if (tmpObj)
- return this.canvasObjs[this.canvasObjs.length - 1];
- else if (index > -1)
- return this.canvasObjs[index];
+ return this.canvasObjs[this.canvasObjs.length - 1];
+ else if (index > -1)
+ return this.canvasObjs[index];
}
MenuObject.prototype.addIconGrid = function(iconNames, iconImages, iconWidth, iconHeight, spacer, minXSpace, gridYPosition)
for (var i = 0; i < iconImages.length; i++)
{
- this.addObject(buttonCtx, "button", {"name" : iconNames[i], "image": iconImages[i], "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth, "height" : iconHeight} );
-
- iconXPosition += (iconWidth + spacer);
-
- if ((i + 1) % iconsPerRow === 0)
- {
- iconYPosition += (iconHeight + spacer);
- iconXPosition = firstIconXPosition;
- }
+ this.addObject(buttonCtx, "button", {"name" : iconNames[i], "image": iconImages[i], "xLoc" : iconXPosition, "yLoc" : iconYPosition, "width" : iconWidth, "height" : iconHeight} );
+
+ iconXPosition += (iconWidth + spacer);
+
+ if ((i + 1) % iconsPerRow === 0)
+ {
+ iconYPosition += (iconHeight + spacer);
+ iconXPosition = firstIconXPosition;
+ }
}
}
{
if (this.visible != false)
{
- clearCanvas();
- for (var canvObjIter = 0; canvObjIter < this.canvasObjs.length; canvObjIter++)
+ clearCanvas();
+ for (var canvObjIter = 0; canvObjIter < this.canvasObjs.length; canvObjIter++)
+ {
+ if (this.canvasObjs[canvObjIter].visible != false)
{
- if (this.canvasObjs[canvObjIter].visible != false)
- {
- if (this.canvasObjs[canvObjIter].largeShadow)
- this.canvasObjs[canvObjIter].drawLargeShadow();
- else
- this.canvasObjs[canvObjIter].drawObj();
- }
+ if (this.canvasObjs[canvObjIter].largeShadow)
+ this.canvasObjs[canvObjIter].drawLargeShadow();
+ else
+ this.canvasObjs[canvObjIter].drawObj();
}
+ }
}
}
{
for (var i = 0; i < this.canvasObjs.length; i++)
{
- if (this.canvasObjs[i].name === objName)
- {
- this.canvasObjs[i].text = newData;
- i = this.canvasObjs.length;
- }
+ if (this.canvasObjs[i].name === objName)
+ {
+ this.canvasObjs[i].text = newData;
+ i = this.canvasObjs.length;
+ }
}
}
{
for (var i = 0; i < this.canvasObjs.length; i++)
{
- if (this.canvasObjs[i].name === objName)
- {
- return this.canvasObjs[i];
- }
+ if (this.canvasObjs[i].name === objName)
+ {
+ return this.canvasObjs[i];
+ }
}
}
ShapeObject.prototype.update = function(args)
{
- if (args.name) {this.name = args.name;}
+ if (args.name) {this.name = args.name;}
if (args.img) {this.img = args.img;}
if (args.xLoc) {this.xLoc = args.xLoc;}
if (args.yLoc) {this.yLoc = args.yLoc;}
if (args.text) {this.textObj.update({"text" : args.text, "xLoc" : (args.xLoc + (args.width / 2)), "yLoc" : (args.yLoc + (args.height / 2)), "zLoc" : (args.zLoc + 1), "template" : args.textTemplate})}
if (args.visible) {this.visible = args.visible;}
if (args.onClick) {this.onClick = args.onClick;}
-
- /* Img shadow styles */
+
+ /* Img shadow styles */
if (args.shadowOffsetX) {this.shadowOffsetX = args.shadowOffsetX;}
if (args.shadowOffsetY) {this.shadowOffsetY = args.shadowOffsetY;}
if (args.shadowBlur) {this.shadowBlur = args.shadowBlur;}
{
if (this.visible)
{
- this.ctx.save();
+ this.ctx.save();
+
+ this.ctx.fillStyle = this.fillStyle;
+ this.ctx.fillRect(this.xLoc, this.yLoc, this.width, this.height);
+
+ if (this.strokeStyle)
+ {
+ this.ctx.strokeStyle = this.strokeStyle;
+ this.ctx.lineWidth = this.lineWidth;
+ this.ctx.strokeRect(this.xLoc, this.yLoc, this.width, this.height);
+ }
+
+ if (this.textObj != undefined)
+ this.textObj.drawObj();
- this.ctx.fillStyle = this.fillStyle;
- this.ctx.fillRect(this.xLoc, this.yLoc, this.width, this.height);
-
- if (this.strokeStyle)
- {
- this.ctx.strokeStyle = this.strokeStyle;
- this.ctx.lineWidth = this.lineWidth;
- this.ctx.strokeRect(this.xLoc, this.yLoc, this.width, this.height);
- }
-
- if (this.textObj != undefined)
- this.textObj.drawObj();
-
- this.ctx.restore();
+ this.ctx.restore();
}
}