Skip to content
This repository has been archived by the owner. It is now read-only.
Permalink
Browse files

Introduce Store UI

Now able to buy and sells items to npc store.
  • Loading branch information...
vthibault committed Apr 9, 2014
1 parent 309f0e3 commit dc23ce5545fdae64626ef4f671150704bc5e8893
@@ -126,6 +126,7 @@ define(function( require )
require('./MapEngine/Skill').call();
require('./MapEngine/ChatRoom').call();
require('./MapEngine/Pet').call();
require('./MapEngine/Store').call();
}


@@ -0,0 +1,136 @@
/**
* Engine/MapEngine/Store.js
*
* Manage npc store (buy/sell items)
*
* This file is part of ROBrowser, Ragnarok Online in the Web Browser (http://www.robrowser.com/).
*
* @author Vincent Thibault
*/
define(function( require )
{
'use strict';


/**
* Load dependencies
*/
var DB = require('DB/DBManager');
var Network = require('Network/NetworkManager');
var PACKET = require('Network/PacketStructure');
var NpcStore = require('UI/Components/NpcStore/NpcStore');
var ChatBox = require('UI/Components/ChatBox/ChatBox');


/**
* Received items list to buy from npc
*
* @param {object} pkt - PACKET.ZC.PC_PURCHASE_ITEMLIST
*/
function onBuyList( pkt )
{
NpcStore.append();
NpcStore.setType(NpcStore.Type.BUY);
NpcStore.setList(pkt.itemList);
NpcStore.onSubmit = function(itemList) {
var i, count;
var pkt;

pkt = new PACKET.CZ.PC_PURCHASE_ITEMLIST();
count = itemList.length;

for (i = 0; i < count; ++i) {
pkt.itemList.push({
ITID: itemList[i].ITID,
count: itemList[i].count
});
}

Network.sendPacket(pkt);
};
}


/**
* Received purchased informations
*
* @param {object} pkt - PACKET_ZC_PC_PURCHASE_RESULT
*/
function onBuyResult( pkt )
{
NpcStore.remove();

switch (pkt.result) {
case 0: ChatBox.addText( DB.msgstringtable[54], ChatBox.TYPE.BLUE); break; // success
case 1: ChatBox.addText( DB.msgstringtable[55], ChatBox.TYPE.ERROR); break; // zeny
case 2: ChatBox.addText( DB.msgstringtable[56], ChatBox.TYPE.ERROR); break; // overweight
case 4: ChatBox.addText( DB.msgstringtable[230], ChatBox.TYPE.ERROR); break; // out of stock
case 5: ChatBox.addText( DB.msgstringtable[281], ChatBox.TYPE.ERROR); break; // trade
// case 6: 6 = Because the store information was incorrect the item was not purchased.
case 7: ChatBox.addText( DB.msgstringtable[1797], ChatBox.TYPE.ERROR); break; // no sale information
default: ChatBox.addText( DB.msgstringtable[57], ChatBox.TYPE.ERROR); break; // deal failed
}
}


/**
* Received items list to buy from npc
*
* @param {object} pkt - PACKET.ZC.PC_SELL_ITEMLIST
*/
function onSellList( pkt )
{
NpcStore.append();
NpcStore.setType(NpcStore.Type.SELL);
NpcStore.setList(pkt.itemList);
NpcStore.onSubmit = function(itemList) {
var i, count;
var pkt;

pkt = new PACKET.CZ.PC_SELL_ITEMLIST();
count = itemList.length;

for (i = 0; i < count; ++i) {
pkt.itemList.push({
index: itemList[i].index,
count: itemList[i].count
});
}

Network.sendPacket(pkt);
};
}


/**
* Receive sell list result
*
* @param {object} pkt - PACKET_ZC.PC.SELL_RESULT
*/
function onSellResult( pkt )
{
NpcStore.remove();

// success
if (pkt.result === 0) {
ChatBox.addText( DB.msgstringtable[54], ChatBox.TYPE.BLUE);
}

// Fail
else {
ChatBox.addText( DB.msgstringtable[57], ChatBox.TYPE.ERROR);
}
}


/**
* Initialize
*/
return function MainEngine()
{
Network.hookPacket( PACKET.ZC.PC_PURCHASE_ITEMLIST, onBuyList );
Network.hookPacket( PACKET.ZC.PC_PURCHASE_RESULT, onBuyResult );
Network.hookPacket( PACKET.ZC.PC_SELL_ITEMLIST, onSellList );
Network.hookPacket( PACKET.ZC.PC_SELL_RESULT, onSellResult );
};
});
@@ -15,18 +15,20 @@ define(function()

return {

AuthCode: 0,
AID: 0,
UserLevel: 0,
Sex: 0,
LangType: 0,
AuthCode: 0,
AID: 0,
UserLevel: 0,
Sex: 0,
LangType: 0,

Character: null,
Entity: null,
Character: null,
Entity: null,

AdminList: [],

intravision: false,
moveTarget: null
moveTarget: null,

zeny: 0,
};
});
@@ -79,10 +79,10 @@ define( ['./PacketStructure' ], function( PACKET )
0xc2: PACKET.ZC.USER_COUNT, // ok
0xc3: PACKET.ZC.SPRITE_CHANGE, // ok
0xc4: PACKET.ZC.SELECT_DEALTYPE, // ok
0xc6: PACKET.ZC.PC_PURCHASE_ITEMLIST,
0xc7: PACKET.ZC.PC_SELL_ITEMLIST,
0xca: PACKET.ZC.PC_PURCHASE_RESULT,
0xcb: PACKET.ZC.PC_SELL_RESULT,
0xc6: PACKET.ZC.PC_PURCHASE_ITEMLIST, // ok
0xc7: PACKET.ZC.PC_SELL_ITEMLIST, // ok
0xca: PACKET.ZC.PC_PURCHASE_RESULT, // ok
0xcb: PACKET.ZC.PC_SELL_RESULT, // ok
0xcd: PACKET.ZC.ACK_DISCONNECT_CHARACTER, // ok
0xd1: PACKET.ZC.SETTING_WHISPER_PC,
0xd2: PACKET.ZC.SETTING_WHISPER_STATE,
@@ -19,6 +19,7 @@ define(function(require)
var Client = require('Core/Client');
var Preferences = require('Core/Preferences');
var Renderer = require('Renderer/Renderer');
var Session = require('Engine/SessionStorage');
var KEYS = require('Controls/KeyEventHandler');
var UIManager = require('UI/UIManager');
var UIComponent = require('UI/UIComponent');
@@ -262,6 +263,8 @@ define(function(require)
break;

case 'zeny':
Session.zeny = val1;

var list = val1.toString().split('');
var i, count = list.length;
var str = '';
@@ -1,7 +1,7 @@
/**
* UI/Components/BasicInfo/BasicInfo.js
* UI/Components/NpcMenu/NpcMenu.js
*
* Chararacter Basic information windows
* Display npc menu
*
* This file is part of ROBrowser, Ragnarok Online in the Web Browser (http://www.robrowser.com/).
*
@@ -0,0 +1,22 @@
#NpcStore .titlebar { width:100%; height:17px; background-color:white; background-repeat:repeat-x; border-radius:3px 3px 0px 0px; text-shadow:1px 1px white; }
#NpcStore .titlebar .text { position:relative; top:2px; left:15px; }
#NpcStore .content { }
#NpcStore .footer { width:100%; height:27px; background-repeat:repeat-x; background-color:transparent; position:relative; border-radius:0px 0px 3px 3px; position:relative;}
#NpcStore .resize { position:absolute; right:1px; bottom:1px; width:13px; height:13px; border:none; background-repeat:no-repeat; background-color:transparent; }
#NpcStore .btn { width:42px; height:20px; border:none; margin:0; background-color:transparent; background-repeat:no-repeat; }
#NpcStore .selectall { vertical-align:2px; width:10px; height:10px; border:none; background-color:transparent; background-repeat:no-repeat; }
#NpcStore .ask_quantity { padding-top:7px; padding-left:20px;}

#NpcStore .container { padding-left: 16px; border-right:1px solid #ccc; background:white; background-repeat:repeat-y; padding-right:2px; }
#NpcStore .content { overflow-y:scroll; padding-top:10px; width:100%; height:100%; min-height:65px; background-color:transparent; background-repeat:repeat-y; background-position-y:6px; }
#NpcStore .content .item { display:block; position:relative; height:32px; }
#NpcStore .content .item .icon { float:left; margin-left:4px; width:24px; height:24px; border:none; background-color:transparent; background-repeat:no-repeat; }
#NpcStore .content .item .amount { float:left; position:absolute; white-space:nowrap; font-size:11px; top:15px; left:17px; text-align:left; text-shadow:-1px -1px white; }
#NpcStore .content .item .name { padding-top:5px; padding-left:5px; float:left; width:115px; white-space:nowrap; }
#NpcStore .content .item .price { padding-top:5px; float:left; width:80px; text-align:right; }
#NpcStore .content .item .unity { padding-top:5px; padding-left:5px; float:left; width:10px; }

#NpcStore .footer .total { padding-left:10px; padding-top:8px; }
#NpcStore .InputWindow, #NpcStore .OutputWindow { width:280px; position:absolute; z-index:50; }
#NpcStore .btn.buy, #NpcStore .btn.sell { position:absolute; top:4px; right:62px; }
#NpcStore .btn.cancel { position:absolute; top:4px; right:15px;}
@@ -0,0 +1,40 @@
<div id="NpcStore">

<div class="InputWindow">
<div class="titlebar" data-background="basic_interface/titlebar_mid.bmp">
<div class="text">
<span class="WinSell" data-text="">Available Items for selling</span>
<span class="WinBuy" data-text="">Shop Items</span>
<!--<span class="winMerchantBuy" data-text="">Merchant Shop</span> - <span class="seller"></span>-->
</div>
</div>
<div class="container" data-background="basic_interface/sprite_bg.bmp">
<div class="content" data-background="basic_interface/itemwin_mid.bmp"></div>
</div>
<div class="footer" data-background="basic_interface/btnbar_mid2.bmp">
<div class="ask_quantity WinSell">
<button class="selectall" data-background="checkbox_0.bmp" data-preload="checkbox_1.bmp"></button> <span data-text="">Don't ask the Quantity of Items</span>
</div>
<button class="resize" data-background="btn_resize.bmp"></button>
</div>
</div>

<div class="OutputWindow">
<div class="titlebar" data-background="basic_interface/titlebar_mid.bmp">
<div class="text">
<span class="WinSell" data-text="">Selling Items</span>
<span class="WinBuy" data-text="">Buying Items</span>
</div>
</div>
<div class="container" data-background="basic_interface/sprite_bg.bmp">
<div class="content" data-background="basic_interface/itemwin_mid.bmp"></div>
</div>
<div class="footer" data-background="basic_interface/btnbar_mid2.bmp">
<div class="total">Total : <span class="result"></span> <span class="unity">Zeny</span></div>
<button class="btn sell WinSell" data-background="btn_sell.bmp" data-hover="btn_sell_a.bmp" data-down="btn_sell_b.bmp"></button>
<button class="btn buy WinBuy" data-background="btn_buy.bmp" data-hover="btn_buy_a.bmp" data-down="btn_buy_b.bmp"></button>
<button class="btn cancel" data-background="btn_cancel.bmp" data-hover="btn_cancel_a.bmp" data-down="btn_cancel_b.bmp"></button>
<button class="resize" data-background="btn_resize.bmp"></button>
</div>
</div>
</div>
Oops, something went wrong.

0 comments on commit dc23ce5

Please sign in to comment.
You can’t perform that action at this time.