|
require(["jquery", "ipu-stomp"], function($, IpuStomp,) {
// var baseUrl = "ws://localhost:7100/stomp";
var baseUrl = "ws://47.105.160.21:7100/stomp";
var login = "empty_account1";
var passcode = "123456";
var host = "";
var client;
//为发送者input绑定onchange事件
$("#userId").on("change", function(e) {
$("#userId").val(e.target.value);
})
var callbacks = {};
callbacks.onConnected = function(msg){
console.log("连接成功:" + msg);
alert("连接成功:" + msg);
$("#connBtn").val("断开连接");
$("#connBtn").attr("id", "disconnBtn");
$("#userId").attr("disabled", "disabled");
}
callbacks.onFailure = function(msg){
console.log("连接失败:" + msg);
alert("连接失败:" + msg);
}
$("#connBtn").on("click", function(e) {
if (typeof (WebSocket) == "undefined") {
console.log("您的浏览器不支持WebSocket");
} else {
console.log("您的浏览器支持WebSocket");
//实例化WebSocket对象,指定要连接的服务器地址与端口 建立连接
//等同于socket = new WebSocket("ws://localhost:8888/xxxx/im/25");
if (!client || !client.connected()) {
//检查用户ID
if (!$("#userId").val()) {
alert("请填写用户名")
return;
}
client = IpuStomp.connect({url:baseUrl,name:login,passcode:passcode,host:host}, callbacks);
client.setTopicPath("topic");
} else {
client.disconnect();
subscription && subscription.unsubscribe();
$("#disconnBtn").val("连接服务器");
$("#disconnBtn").attr("id", "connBtn");
$("#userId").removeAttr("disabled");
}
}
});
var path = []
$("#login").on(
"click",
function(e) {
//校验连接状态
if (!client || !client.connected()) {
alert("服务未连接")
return;
}
//校验发布频道
if (!$("#topic").val()) {
alert("请填写发送频道")
return;
}
var map = new AMap.Map("container", {
resizeEnable: true,
center: [116.397428, 39.90923],
zoom: 13
});
var marker = new AMap.Marker({
position: map.getCenter(),
icon: 'img/mark_bs.png',
offset: new AMap.Pixel(-13, -30),
// 设置是否可以拖拽
draggable: true,
cursor: 'move',
// 设置拖拽效果
raiseOnDrag: true
});
marker.on('dragging', function showInfoM(e){
// console.log(e.lnglat)
var sendText = '{"userId":"' + $("#userId").val()
+ '","topic":"' + $("#topic").val()
+ '","contentText":' + JSON.stringify(e.lnglat) + '}'
if(!e.lnglat.lng){
console.log(111111)
}
path.push([e.lnglat.lng,e.lnglat.lat])
var polyline = new AMap.Polyline({
path: path,
isOutline: true,
outlineColor: '#ffeeff',
borderWeight: 3,
strokeColor: "#3366FF",
strokeOpacity: 1,
strokeWeight: 6,
// 折线样式还支持 'dashed'
strokeStyle: "solid",
// strokeStyle是dashed时有效
strokeDasharray: [10, 5],
lineJoin: 'round',
lineCap: 'round',
zIndex: 50,
})
polyline.setMap(map)
// 缩放地图到合适的视野级别
// map.setFitView([ polyline ])
$("#sendText").val("");
client.publish($("#topic").val(), sendText);
});
marker.setMap(map);
})
});
|