Skip to content

Instantly share code, notes, and snippets.

@maksadbek

maksadbek/app.js

Last active August 29, 2015 14:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save maksadbek/f8ca34004c147b89362a to your computer and use it in GitHub Desktop.
Save maksadbek/f8ca34004c147b89362a to your computer and use it in GitHub Desktop.
Download ZIP
Raw
app.js
Ext.require([
'Ext.grid.*',
'Ext.data.*',
'Ext.panel.*',
'Ext.layout.container.Border'
]);
Ext.onReady(function(){
var Mydata = [
{
"name":"Maksadbek",
"surname":"Akxmedov",
"address":"Sergeli",
"date": "2014-07-22 12:00:00"
},
{
"name":"Maksadbek",
"surname":"Akxmedov",
"address":"Sergeli",
"date": "2014-07-22 10:00:00"
},
{
"name":"Maksadbek",
"surname":"Akxmedov",
"address":"Sergeli",
"date": "2014-07-22 9:00:00"
},
{
"name":"Maksadbek",
"surname":"Akxmedov",
"address":"Sergeli",
"date": "2014-07-22 4:00:00"
}
]
var dataStore = Ext.create("Ext.data.Store", {
storeId: 'personStore',
fields:[
{name:'name'},
{name:'surname'},
{name:'address'},
{name: 'date',type: 'date' }
],
data: Mydata
})
var states = Ext.create("Ext.data.Store", {
fields:['abbr','state'],
data : [
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
]
})
var grid = Ext.create("Ext.grid.Panel",{
id: 'main_grid',
columns: [
{text: "name", dataIndex:"name"},
{text: "surname", dataIndex:"surname"},
{text: "address", dataIndex: "address"},
{text: "date", dataIndex: "date"}
],
forceFit: true,
region: 'north',
store: dataStore,
height: 500,
layout: 'border',
region: 'north'
})
var combo =Ext.create('Ext.form.ComboBox', {
fieldLabel: 'Choose State',
store: states,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr',
});
var panel = Ext.create("Ext.Panel",{
renderTo : "grid",
frame: true,
title: "List",
height:580,
layout: "border",
items:[
grid,
{
xtype: 'toolbar',
items:[{
text: "pressme",
menu:{
items: [
{
text: 'Aero Glass',
checked: true,
group: 'theme',
}, {
text: 'Vista Black',
checked: false,
group: 'theme',
}, {
text: 'Gray Theme',
checked: false,
group: 'theme',
}, {
text: 'Default Theme',
checked: false,
group: 'theme',
}
]
}
},
combo
]
}
]
});
dataStore.load();
})
Raw
index.html
<!doctype html>
<html>
<head>
<script
src="http://127.0.0.1:8080/socket.io/socket.io.js">
</script>
<script src="ext-all.js"></script>
<script src="app.js"></script>
<script src="sock.js"></script>
<link rel="stylesheet" type="text/css"
href="packages/ext-theme-neptune/build/resources/ext-theme-neptune-all.css">
</head>
<body>
<div id="grid"></div>
</body>
</html>
Raw
server.js
var express = require("express")
var bodyparser = require("body-parser");
var socket = require("socket.io").listen(8080);
var app = express();
app.use(bodyparser.json());
app.get("/", function(req, res){
res.sendfile("index.html");
})
socket.sockets.on('connection', function(sock){
console.log("connected");
app.post("/", function(req, res){
res.send(req.body);
sock.broadcast.json.send(req.body.user);
console.log("send")
})
})
app.listen(3333);
Raw
sock.js
var socket = io.connect('http://127.0.0.1:8080');
socket.on('connect', function(){
console.log("connected");
var i =0;
socket.on('message', function(msg){
i++;
console.log(i);
console.log(msg);
// Ext.getCmp('main_grid').store.setData(msg);
var personStore = Ext.data.StoreManager.lookup('personStore')
personStore.add(msg);
personStore.sort("date", "DESC");
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment