diff --git a/README.md b/README.md
index 6bd13f3..018091e 100644
--- a/README.md
+++ b/README.md
@@ -101,13 +101,13 @@ https://gitee.com/bnu_mixly/mixio-linux-x86-dist/blob/darwin/mixio
16. BAIDU_MAP_AK - string，百度地图客户端应用AK（OFFLINE_MODE=false时可配置），默认为""
17. BAIDU_MAP_SERVER_AK - string，百度地图服务端应用AK（OFFLINE_MODE=false时可配置），默认为""
18. TENCENT_MAP_KEY - string, 腾讯地图key（OFFLINE_MODE=false时可配置），默认为""，和百度地图二选一进行配置即可，同时配置时优先启用百度地图
-18. BAIDU_STAT_LINK - string, 百度统计链接，通常以"https://hm.baidu.com/hm.js?"开头
-19. ADMIN_USERNAME - string，管理后台用户名，默认为"admin"
-20. ADMIN_PASSWORD - string，管理后台密码，默认为"public"
-21. STORAGE_ENGINE - string，数据库引擎，默认为"sqlite"
-22. MYSQL_HOST - string，MySQL地址（STORAGE_ENGINE="mysql"时必须配置），默认为"localhost"
-23. MYSQL_PORT - int，MySQL地址（STORAGE_ENGINE="mysql"时必须配置），默认为3306
-24. MYSQL_USER - string，MySQL用户名（STORAGE_ENGINE="mysql"时必须配置），默认为""
-25. MYSQL_PASS - string，MySQL密码（STORAGE_ENGINE="mysql"时必须配置），默认为""
-26. MYSQL_DB - string，MySQL数据库名（STORAGE_ENGINE="mysql"时必须配置），默认为"mixio",
-27. FOOTER - string，显示在首页的备案信息，公网部署时请务必配置此项（支持HTML语言，请注意为双引号添加转义字符\\），默认为""
+19. BAIDU_STAT_LINK - string, 百度统计链接，通常以"https://hm.baidu.com/hm.js?"开头
+20. ADMIN_USERNAME - string，管理后台用户名，默认为"admin"
+21. ADMIN_PASSWORD - string，管理后台密码，默认为"public"
+22. STORAGE_ENGINE - string，数据库引擎，默认为"sqlite"
+23. MYSQL_HOST - string，MySQL地址（STORAGE_ENGINE="mysql"时必须配置），默认为"localhost"
+24. MYSQL_PORT - int，MySQL地址（STORAGE_ENGINE="mysql"时必须配置），默认为3306
+25. MYSQL_USER - string，MySQL用户名（STORAGE_ENGINE="mysql"时必须配置），默认为""
+26. MYSQL_PASS - string，MySQL密码（STORAGE_ENGINE="mysql"时必须配置），默认为""
+27. MYSQL_DB - string，MySQL数据库名（STORAGE_ENGINE="mysql"时必须配置），默认为"mixio",
+28. FOOTER - string，显示在首页的备案信息，公网部署时请务必配置此项（支持HTML语言，请注意为双引号添加转义字符\\），默认为""
diff --git a/ejs/observe.ejs b/ejs/observe.ejs
index c002c07..c0614e5 100644
--- a/ejs/observe.ejs
+++ b/ejs/observe.ejs
@@ -24,6 +24,9 @@
<% if (configs['OFFLINE_MODE']==false) { %>
<% } %>
+ <% if (configs['OFFLINE_MODE']==false) { %>
+
+ <% } %>
diff --git a/ejs/projects.ejs b/ejs/projects.ejs
index d5d9049..536dcac 100644
--- a/ejs/projects.ejs
+++ b/ejs/projects.ejs
@@ -22,6 +22,9 @@
<% if (configs['OFFLINE_MODE']==false) { %>
<% } %>
+ <% if (configs['OFFLINE_MODE']==false) { %>
+
+ <% } %>
diff --git a/js/widgets.js b/js/widgets.js
index eda4d4c..ce56c1f 100644
--- a/js/widgets.js
+++ b/js/widgets.js
@@ -3762,342 +3762,662 @@ function add_dashboard(user_title, user_topic, user_content, user_style, title_s
function add_map(user_title, user_topic, user_content, user_style, title_style) {
var modald = showmodaltext("")
- $.getScript("//api.map.baidu.com/getscript?type=webgl&v=3.0&ak="+baidu_ak, function() {
- modald.close().remove()
- var isAlive = true
- var contents = []
- var title = $("" + user_title + "
")
- title.attr("hidden", title_style)
- contents.push(title)
- var topicDiv = $("")
- var topic = $("" + user_topic + "")
- topicDiv.append($(""))
- topicDiv.append(topic)
- var randomName = randomString() + "map"
- var mapDiv = $("")
- mapDiv.attr("id", randomName)
- mapDiv.bind('click', function(event) {
- event.stopPropagation()
- })
- mapDiv.bind('pointerdown', function(event) {
- event.stopPropagation()
- })
- mapDiv.bind('mousedown', function(event) {
- event.stopPropagation()
- })
- mapDiv[0].addEventListener('touchstart', function(event) {
- event.stopPropagation()
- }, { passive: false })
- contents.push(mapDiv)
- attrs = [
- ['user-type', 'output_map'],
- ['user-title', user_title],
- ['user-topic', user_topic],
- ['user-content', user_content],
- ['title-hidden', title_style]
- ]
- var itemdiv = add_block(3, 3, contents, attrs)
- var maxLeft = mapDiv[0].clientWidth
- var maxTop = mapDiv[0].clientHeight
- var markers = []
- var setContent = function() {
- var tmp = []
- for (marker in markers) {
- console.log(markers[marker])
- tmp.push(markers[marker].long)
- tmp.push(markers[marker].lat)
- tmp.push(markers[marker].time)
- tmp.push(markers[marker].message)
- tmp.push(markers[marker].clientid)
+ if(baidu_ak!='')
+ {
+ $.getScript("//api.map.baidu.com/getscript?type=webgl&v=3.0&ak="+baidu_ak, function() {
+ modald.close().remove()
+ var isAlive = true
+ var contents = []
+ var title = $("" + user_title + "
")
+ title.attr("hidden", title_style)
+ contents.push(title)
+ var topicDiv = $("")
+ var topic = $("" + user_topic + "")
+ topicDiv.append($(""))
+ topicDiv.append(topic)
+ var randomName = randomString() + "map"
+ var mapDiv = $("")
+ mapDiv.attr("id", randomName)
+ mapDiv.bind('click', function(event) {
+ event.stopPropagation()
+ })
+ mapDiv.bind('pointerdown', function(event) {
+ event.stopPropagation()
+ })
+ mapDiv.bind('mousedown', function(event) {
+ event.stopPropagation()
+ })
+ mapDiv[0].addEventListener('touchstart', function(event) {
+ event.stopPropagation()
+ }, { passive: false })
+ contents.push(mapDiv)
+ attrs = [
+ ['user-type', 'output_map'],
+ ['user-title', user_title],
+ ['user-topic', user_topic],
+ ['user-content', user_content],
+ ['title-hidden', title_style]
+ ]
+ var itemdiv = add_block(3, 3, contents, attrs)
+ var maxLeft = mapDiv[0].clientWidth
+ var maxTop = mapDiv[0].clientHeight
+ var markers = []
+ var setContent = function() {
+ var tmp = []
+ for (marker in markers) {
+ console.log(markers[marker])
+ tmp.push(markers[marker].long)
+ tmp.push(markers[marker].lat)
+ tmp.push(markers[marker].time)
+ tmp.push(markers[marker].message)
+ tmp.push(markers[marker].clientid)
+ }
+ title.parent().parent().attr('user-content', tmp.join("@#@$@"))
}
- title.parent().parent().attr('user-content', tmp.join("@#@$@"))
- }
- itemdiv.bind(MixIO.actionTags.DATA_MAP_CHANGE, function(event, message) {
- MixIO.publish(topic.text(), JSON.stringify(message))
- })
- itemdiv.bind(MixIO.actionTags.DATA_MAP_CLEAR, function() {
- clear_on_click()
- })
- client.on('message', function(topic1, message1) {
+ itemdiv.bind(MixIO.actionTags.DATA_MAP_CHANGE, function(event, message) {
+ MixIO.publish(topic.text(), JSON.stringify(message))
+ })
+ itemdiv.bind(MixIO.actionTags.DATA_MAP_CLEAR, function() {
+ clear_on_click()
+ })
+ client.on('message', function(topic1, message1) {
- if (isAlive && isRunning)
- if (topic1.split("/")[(isMixly ? 3 : 2)] == topic.text()) {
+ if (isAlive && isRunning)
+ if (topic1.split("/")[(isMixly ? 3 : 2)] == topic.text()) {
- var label = (new Date().getHours() + ":" + (new Date().getMinutes() < 10 ? "0" : "") + new Date().getMinutes() + ":" + (new Date().getSeconds() < 10 ? "0" : "") + new Date().getSeconds())
- if (isJSON(String(message1)) && ("long" in JSON.parse(String(message1))) && ("lat" in JSON.parse(String(message1))) && JSON.parse(String(message1)).clientid) {
- var jsonMessage = JSON.parse(String(message1))
- console.log(jsonMessage)
- itemdiv.trigger(MixIO.eventTags.DATA_MAP_CHANGED, [jsonMessage.clientid, jsonMessage.long, jsonMessage.lat, jsonMessage.message])
- var newOrNot = true
- var markerIndex = -1
- for (marker in markers) {
- if (jsonMessage.clientid == markers[marker].clientid) {
- newOrNot = false
- markerIndex = marker
- break
+ var label = ((new Date().getHours() < 10 ? "0" : "") + new Date().getHours() + ":" + (new Date().getMinutes() < 10 ? "0" : "") + new Date().getMinutes() + ":" + (new Date().getSeconds() < 10 ? "0" : "") + new Date().getSeconds())
+ if (isJSON(String(message1)) && ("long" in JSON.parse(String(message1))) && ("lat" in JSON.parse(String(message1))) && JSON.parse(String(message1)).clientid) {
+ var jsonMessage = JSON.parse(String(message1))
+ console.log(jsonMessage)
+ itemdiv.trigger(MixIO.eventTags.DATA_MAP_CHANGED, [jsonMessage.clientid, jsonMessage.long, jsonMessage.lat, jsonMessage.message])
+ var newOrNot = true
+ var markerIndex = -1
+ for (marker in markers) {
+ if (jsonMessage.clientid == markers[marker].clientid) {
+ newOrNot = false
+ markerIndex = marker
+ break
+ }
}
- }
- if (newOrNot) {
- var msgstr = ""
- if (typeof jsonMessage.message == "string")
- jsonMessage.message = JSON.parse(jsonMessage.message)
- for (msg in jsonMessage.message) {
- msgstr = msgstr + jsonMessage.message[msg].label + ":" + jsonMessage.message[msg].value + "
"
- }
- var point = new BMapGL.Point(jsonMessage.long, jsonMessage.lat)
- var newMarker = new BMapGL.Marker(point)
- markerIndex = markers.length
- var bubble = create_a_map_bubble(msgstr, label, point)
- newMarker.bubble = bubble
- console.log(msgstr)
- markers.push({
- "clientid": jsonMessage.clientid,
- "long": jsonMessage.long,
- "lat": jsonMessage.lat,
- "time": label,
- "message": msgstr,
- "target": newMarker,
- "point": point
- })
- if (markers.length == 1) {
- map.centerAndZoom(markers[markerIndex].point, 17);
- }
- map.addOverlay(newMarker)
- newMarker.addEventListener('click', function() {
+ if (newOrNot) {
+ var msgstr = ""
+ if (typeof jsonMessage.message == "string")
+ jsonMessage.message = JSON.parse(jsonMessage.message)
+ for (msg in jsonMessage.message) {
+ msgstr = msgstr + jsonMessage.message[msg].label + ":" + jsonMessage.message[msg].value + "
"
+ }
+ var point = new BMapGL.Point(jsonMessage.long, jsonMessage.lat)
+ var newMarker = new BMapGL.Marker(point)
+ markerIndex = markers.length
+ var bubble = create_a_map_bubble(msgstr, label, point)
+ newMarker.bubble = bubble
+ console.log(msgstr)
+ markers.push({
+ "clientid": jsonMessage.clientid,
+ "long": jsonMessage.long,
+ "lat": jsonMessage.lat,
+ "time": label,
+ "message": msgstr,
+ "target": newMarker,
+ "point": point
+ })
+ if (markers.length == 1) {
+ map.centerAndZoom(markers[markerIndex].point, 17);
+ }
+ map.addOverlay(newMarker)
+ newMarker.addEventListener('click', function() {
+ if (map.getOverlays().indexOf(bubble) == -1)
+ map.addOverlay(bubble)
+ else
+ map.removeOverlay(bubble)
+ })
+ map.addOverlay(bubble)
+ } else {
+ markers[markerIndex].time = label
+ var msgstr = ""
+ if (typeof jsonMessage.message == "string")
+ jsonMessage.message = JSON.parse(jsonMessage.message)
+ for (msg in jsonMessage.message) {
+ msgstr = msgstr + jsonMessage.message[msg].label + ":" + jsonMessage.message[msg].value + "
"
+ }
+ var point = new BMapGL.Point(jsonMessage.long, jsonMessage.lat)
+ markers[markerIndex].long = jsonMessage.long
+ markers[markerIndex].lat = jsonMessage.lat
+ markers[markerIndex].point = point
+ markers[markerIndex].message = msgstr
+ markers[markerIndex].target.bubble.setPosition(point)
+ markers[markerIndex].target.setPosition(point)
+ markers[markerIndex].target.bubble.setContent(label + "
" + msgstr)
if (map.getOverlays().indexOf(bubble) == -1)
map.addOverlay(bubble)
- else
- map.removeOverlay(bubble)
- })
- map.addOverlay(bubble)
- } else {
- markers[markerIndex].time = label
- var msgstr = ""
- if (typeof jsonMessage.message == "string")
- jsonMessage.message = JSON.parse(jsonMessage.message)
- for (msg in jsonMessage.message) {
- msgstr = msgstr + jsonMessage.message[msg].label + ":" + jsonMessage.message[msg].value + "
"
}
- var point = new BMapGL.Point(jsonMessage.long, jsonMessage.lat)
- markers[markerIndex].long = jsonMessage.long
- markers[markerIndex].lat = jsonMessage.lat
- markers[markerIndex].point = point
- markers[markerIndex].message = msgstr
- markers[markerIndex].target.bubble.setPosition(point)
- markers[markerIndex].target.setPosition(point)
- markers[markerIndex].target.bubble.setContent(label + "
" + msgstr)
- if (map.getOverlays().indexOf(bubble) == -1)
- map.addOverlay(bubble)
+ setContent()
+ } else {
+ showtext(JSLang[lang].mapJSON)
}
- setContent()
- } else {
- showtext(JSLang[lang].mapJSON)
}
- }
- })
- var map = new BMapGL.Map(randomName)
- map.centerAndZoom(new BMapGL.Point(116.373, 39.967), 17)
- map.enableScrollWheelZoom(true);
- map.disableContinuousZoom();
- map.disableInertialDragging();
- var opts = {
- offset: new BMapGL.Size(0, 0)
- };
- var label = new BMapGL.Label();
- label.setStyle({
- color: '#4e73df',
- borderRadius: '5px',
- borderColor: '#ccc',
- backgroundColor: 'rgba(255,255,255,0.8)',
- padding: '8px',
- fontSize: '1rem',
- fontFamily: 'Nunito'
- });
- map.addEventListener('mousemove', function(e) {
- if (!isRunning) {
- map.addOverlay(label)
- label.setContent(e.latlng.lng.toFixed(4) + ',' + e.latlng.lat.toFixed(4))
- label.setPosition(new BMapGL.Point(e.latlng.lng, e.latlng.lat))
- } else
- map.removeOverlay(label)
- });
- var toBeAdded = user_content.split("@#@$@")
- var addLength = toBeAdded.length / 5
- console.log(toBeAdded)
- for (var tmpi = 0; tmpi <= addLength - 1; tmpi = tmpi + 1) {
- var point = new BMapGL.Point(toBeAdded[tmpi * 5], toBeAdded[tmpi * 5 + 1])
- var newMarker = new BMapGL.Marker(point)
- var bubble = create_a_map_bubble(toBeAdded[tmpi * 5 + 3], toBeAdded[tmpi * 5 + 2], point)
- newMarker.bubble = bubble
- markers.push({
- "long": toBeAdded[tmpi * 5],
- "lat": toBeAdded[tmpi * 5 + 1],
- "time": toBeAdded[tmpi * 5 + 2],
- "message": toBeAdded[tmpi * 5 + 3],
- "clientid": toBeAdded[tmpi * 5 + 4],
- "target": newMarker,
- "point": point
})
- if (markers.length == 1) {
- map.centerAndZoom(point, 17);
- }
- map.addOverlay(newMarker)
- newMarker.addEventListener('click', function(bubble) {
- return function() {
- if (map.getOverlays().indexOf(bubble) == -1)
- map.addOverlay(bubble)
- else
- map.removeOverlay(bubble)
+ var map = new BMapGL.Map(randomName)
+ map.centerAndZoom(new BMapGL.Point(116.373, 39.967), 17)
+ map.enableScrollWheelZoom(true);
+ map.disableContinuousZoom();
+ map.disableInertialDragging();
+ var opts = {
+ offset: new BMapGL.Size(0, 0)
+ };
+ var label = new BMapGL.Label();
+ label.setStyle({
+ color: '#4e73df',
+ borderRadius: '5px',
+ borderColor: '#ccc',
+ backgroundColor: 'rgba(255,255,255,0.8)',
+ padding: '8px',
+ fontSize: '1rem',
+ fontFamily: 'Nunito'
+ });
+ map.addEventListener('mousemove', function(e) {
+ if (!isRunning) {
+ map.addOverlay(label)
+ label.setContent(e.latlng.lng.toFixed(4) + ',' + e.latlng.lat.toFixed(4))
+ label.setPosition(new BMapGL.Point(e.latlng.lng, e.latlng.lat))
+ } else
+ map.removeOverlay(label)
+ });
+ var toBeAdded = user_content.split("@#@$@")
+ var addLength = toBeAdded.length / 5
+ console.log(toBeAdded)
+ for (var tmpi = 0; tmpi <= addLength - 1; tmpi = tmpi + 1) {
+ var point = new BMapGL.Point(toBeAdded[tmpi * 5], toBeAdded[tmpi * 5 + 1])
+ var newMarker = new BMapGL.Marker(point)
+ var bubble = create_a_map_bubble(toBeAdded[tmpi * 5 + 3], toBeAdded[tmpi * 5 + 2], point)
+ newMarker.bubble = bubble
+ markers.push({
+ "long": toBeAdded[tmpi * 5],
+ "lat": toBeAdded[tmpi * 5 + 1],
+ "time": toBeAdded[tmpi * 5 + 2],
+ "message": toBeAdded[tmpi * 5 + 3],
+ "clientid": toBeAdded[tmpi * 5 + 4],
+ "target": newMarker,
+ "point": point
+ })
+ if (markers.length == 1) {
+ map.centerAndZoom(point, 17);
}
- }(bubble))
- map.addOverlay(bubble)
- }
- setContent()
-
- var delete_on_click = function() {
- $("#trashbin").append(mapDiv)
- title.parent().parent().remove();
- isAlive = false;
- if (tbd)
- tbd.remove()
- }
- var clear_on_click = function() {
- map.clearOverlays()
- markers = []
+ map.addOverlay(newMarker)
+ newMarker.addEventListener('click', function(bubble) {
+ return function() {
+ if (map.getOverlays().indexOf(bubble) == -1)
+ map.addOverlay(bubble)
+ else
+ map.removeOverlay(bubble)
+ }
+ }(bubble))
+ map.addOverlay(bubble)
+ }
setContent()
- }
- var edit_on_click = function() {
- modifyDia.showModal()
- if (tbd)
- tbd.remove()
- }
- var editForm = $('')
- editForm.append($(''))
- editForm.append($('' + JSLang[lang].unitName + '
'))
- var title_input_div = $('')
- var title_input = $("")
- title_input_div.append(title_input)
- editForm.append(title_input_div)
- editForm.append($('' + JSLang[lang].messTopic + '
'))
- var topic_input_div = $('')
- var topic_input = $("")
- topic_input_div.append(topic_input)
- editForm.append(topic_input_div)
- var bottomDiv = $('')
- var confirmEdit = $('')
- bottomDiv.append(confirmEdit)
- confirmEdit.click(function() {
- if (getByteLen(title_input.val()) > 0 && getByteLen(title_input.val()) < 21) {
- var re = /^[a-z0-9]+$/i;
- if (getByteLen(topic_input.val()) > 0 && getByteLen(topic_input.val()) < 11)
- if (true) {
- if (countSubstr(grid.html(), 'user-title=\"' + title_input.val() + '\"', false) <= (title_input.val() == title.text() ? 1 : 0)) {
- title.parent().parent().attr('user-title', title_input.val())
- title.parent().parent().attr('user-topic', topic_input.val())
- if (title.parent().parent().attr('user-content') == undefined)
- title.parent().parent().attr('user-content', "")
- title.text(title_input.val())
- topic.text(topic_input.val())
- modifyDia.close()
+
+ var delete_on_click = function() {
+ $("#trashbin").append(mapDiv)
+ title.parent().parent().remove();
+ isAlive = false;
+ if (tbd)
+ tbd.remove()
+ }
+ var clear_on_click = function() {
+ map.clearOverlays()
+ markers = []
+ setContent()
+ }
+ var edit_on_click = function() {
+ modifyDia.showModal()
+ if (tbd)
+ tbd.remove()
+ }
+ var editForm = $('')
+ editForm.append($(''))
+ editForm.append($('' + JSLang[lang].unitName + '
'))
+ var title_input_div = $('')
+ var title_input = $("")
+ title_input_div.append(title_input)
+ editForm.append(title_input_div)
+ editForm.append($('' + JSLang[lang].messTopic + '
'))
+ var topic_input_div = $('')
+ var topic_input = $("")
+ topic_input_div.append(topic_input)
+ editForm.append(topic_input_div)
+ var bottomDiv = $('')
+ var confirmEdit = $('')
+ bottomDiv.append(confirmEdit)
+ confirmEdit.click(function() {
+ if (getByteLen(title_input.val()) > 0 && getByteLen(title_input.val()) < 21) {
+ var re = /^[a-z0-9]+$/i;
+ if (getByteLen(topic_input.val()) > 0 && getByteLen(topic_input.val()) < 11)
+ if (true) {
+ if (countSubstr(grid.html(), 'user-title=\"' + title_input.val() + '\"', false) <= (title_input.val() == title.text() ? 1 : 0)) {
+ title.parent().parent().attr('user-title', title_input.val())
+ title.parent().parent().attr('user-topic', topic_input.val())
+ if (title.parent().parent().attr('user-content') == undefined)
+ title.parent().parent().attr('user-content', "")
+ title.text(title_input.val())
+ topic.text(topic_input.val())
+ modifyDia.close()
+ } else
+ showtext(JSLang[lang].sameUnit)
} else
- showtext(JSLang[lang].sameUnit)
- } else
- showtext("")
- else
- showtext(JSLang[lang].topicLenIllegal)
- } else
- showtext(JSLang[lang].nameLenIllegal)
- })
- var cancelEdit = $('')
- cancelEdit.click(function() {
- modifyDia.close()
- })
- bottomDiv.append(cancelEdit)
- editForm.append(bottomDiv)
- var modifyDia = dialog({
- content: editForm[0],
- cancel: false
- })
- var showEditBubble = function(event) {
- if(tbd)
- tbd.remove()
- if (typeof startX != "undefined" && (startX - endX < 5 && endX - startX < 5) && (startY - endY < 5 && endY - startY < 5)) {
- var editButton = $('')
- var clearButton = $('')
- var deleteButton = $('')
- var bubble = $('')
- bubble.append(topicDiv)
- var d = dialog({
- align: 'top',
- content: bubble[0],
- quickClose: true,
- autofocus: false
- });
- tbd = d;
- editButton.click(edit_on_click)
- clearButton.click(clear_on_click)
- deleteButton.click(delete_on_click)
- if (!isRunning)
- bubble.append(editButton)
- bubble.append(clearButton)
- if (!isRunning)
- bubble.append(deleteButton)
- if (!isRunning)
+ showtext("")
+ else
+ showtext(JSLang[lang].topicLenIllegal)
+ } else
+ showtext(JSLang[lang].nameLenIllegal)
+ })
+ var cancelEdit = $('')
+ cancelEdit.click(function() {
+ modifyDia.close()
+ })
+ bottomDiv.append(cancelEdit)
+ editForm.append(bottomDiv)
+ var modifyDia = dialog({
+ content: editForm[0],
+ cancel: false
+ })
+ var showEditBubble = function(event) {
+ if(tbd)
+ tbd.remove()
+ if (typeof startX != "undefined" && (startX - endX < 5 && endX - startX < 5) && (startY - endY < 5 && endY - startY < 5)) {
+ var editButton = $('')
+ var clearButton = $('')
+ var deleteButton = $('')
+ var bubble = $('')
+ bubble.append(topicDiv)
+ var d = dialog({
+ align: 'top',
+ content: bubble[0],
+ quickClose: true,
+ autofocus: false
+ });
+ tbd = d;
+ editButton.click(edit_on_click)
+ clearButton.click(clear_on_click)
+ deleteButton.click(delete_on_click)
+ if (!isRunning)
+ bubble.append(editButton)
+ bubble.append(clearButton)
+ if (!isRunning)
+ bubble.append(deleteButton)
+ if (!isRunning)
+ {
+ copyButton.attr("user-origin", title.text())
+ bubble.append(copyButton)
+ styleButton.attr("user-origin", title.text())
+ bubble.append(styleButton)
+ helpButton.attr("user-origin", attrs[0][1])
+ bubble.append(helpButton)
+ }
+ title_input.val(title.text())
+ topic_input.val(topic.text())
+ if (!d.open)
{
- copyButton.attr("user-origin", title.text())
- bubble.append(copyButton)
- styleButton.attr("user-origin", title.text())
- bubble.append(styleButton)
- helpButton.attr("user-origin", attrs[0][1])
- bubble.append(helpButton)
+ d.show(itemdiv[0]);
+ setTimeout(function() {
+ $(".ui-popup-backdrop").css("pointer-events", "auto")
+ },100)
+ }
+ else
+ d.close()
}
- title_input.val(title.text())
- topic_input.val(topic.text())
- if (!d.open)
- {
- d.show(itemdiv[0]);
- setTimeout(function() {
- $(".ui-popup-backdrop").css("pointer-events", "auto")
- },100)
- }
- else
- d.close()
}
- }
- if (window.screen.width > 800)
- {
- itemdiv.click(showEditBubble)
- itemdiv.on('contextmenu', function(event) {
- event.preventDefault()
+ if (window.screen.width > 800)
+ {
+ itemdiv.click(showEditBubble)
+ itemdiv.on('contextmenu', function(event) {
+ event.preventDefault()
+ event.stopPropagation()
+ showEditBubble(event)
+ })
+ }
+ else
+ itemdiv[0].addEventListener('touchend', function(event) {
+ event.preventDefault()
+ showEditBubble(event)
+ })
+ itemdiv[0].addEventListener('touchmove', function(e) {
+ e.preventDefault()
+ })
+ if (user_style != undefined)
+ itemdiv.attr('style', user_style)
+ itemdiv.resizable({
+ minWidth: 300,
+ minHeight: 300,
+ onStopResize: function() {
+ var stdLeft = parseInt(itemdiv.css('left')) - parseInt(itemdiv.css('left')) % 20 + (parseInt(itemdiv.css('left')) % 20 > 10 ? 1 : 0) * 20
+ var stdTop = parseInt(itemdiv.css('top')) - parseInt(itemdiv.css('top')) % 20 + (parseInt(itemdiv.css('top')) % 20 > 10 ? 1 : 0) * 20
+ itemdiv.css('left', stdLeft)
+ itemdiv.css('top', stdTop)
+ var stdWidth = parseInt(itemdiv.css('width')) - parseInt(itemdiv.css('width')) % 20 + (parseInt(itemdiv.css('width')) % 20 > 10 ? 1 : 0) * 20
+ var stdHeight = parseInt(itemdiv.css('height')) - parseInt(itemdiv.css('height')) % 20 + (parseInt(itemdiv.css('height')) % 20 > 10 ? 1 : 0) * 20
+ itemdiv.css('width', stdWidth)
+ itemdiv.css('height', stdHeight)
+ }
+ })
+ },true);
+ }
+ else if(tencent_key!='')
+ {
+ $.getScript("//map.qq.com/api/gljs?v=1.exp&key="+tencent_key, function() {
+ modald.close().remove()
+ var isAlive = true
+ var contents = []
+ var title = $("" + user_title + "
")
+ title.attr("hidden", title_style)
+ contents.push(title)
+ var topicDiv = $("")
+ var topic = $("" + user_topic + "")
+ topicDiv.append($(""))
+ topicDiv.append(topic)
+ var randomName = randomString() + "map"
+ var mapDiv = $("")
+ mapDiv.attr("id", randomName)
+ mapDiv.bind('click', function(event) {
event.stopPropagation()
- showEditBubble(event)
})
- }
- else
- itemdiv[0].addEventListener('touchend', function(event) {
- event.preventDefault()
- showEditBubble(event)
+ mapDiv.bind('pointerdown', function(event) {
+ event.stopPropagation()
})
- itemdiv[0].addEventListener('touchmove', function(e) {
- e.preventDefault()
- })
- if (user_style != undefined)
- itemdiv.attr('style', user_style)
- itemdiv.resizable({
- minWidth: 300,
- minHeight: 300,
- onStopResize: function() {
- var stdLeft = parseInt(itemdiv.css('left')) - parseInt(itemdiv.css('left')) % 20 + (parseInt(itemdiv.css('left')) % 20 > 10 ? 1 : 0) * 20
- var stdTop = parseInt(itemdiv.css('top')) - parseInt(itemdiv.css('top')) % 20 + (parseInt(itemdiv.css('top')) % 20 > 10 ? 1 : 0) * 20
- itemdiv.css('left', stdLeft)
- itemdiv.css('top', stdTop)
- var stdWidth = parseInt(itemdiv.css('width')) - parseInt(itemdiv.css('width')) % 20 + (parseInt(itemdiv.css('width')) % 20 > 10 ? 1 : 0) * 20
- var stdHeight = parseInt(itemdiv.css('height')) - parseInt(itemdiv.css('height')) % 20 + (parseInt(itemdiv.css('height')) % 20 > 10 ? 1 : 0) * 20
- itemdiv.css('width', stdWidth)
- itemdiv.css('height', stdHeight)
+ mapDiv.bind('mousedown', function(event) {
+ event.stopPropagation()
+ })
+ mapDiv[0].addEventListener('touchstart', function(event) {
+ event.stopPropagation()
+ }, { passive: false })
+ contents.push(mapDiv)
+ attrs = [
+ ['user-type', 'output_map'],
+ ['user-title', user_title],
+ ['user-topic', user_topic],
+ ['user-content', user_content],
+ ['title-hidden', title_style]
+ ]
+ var itemdiv = add_block(3, 3, contents, attrs)
+ var maxLeft = mapDiv[0].clientWidth
+ var maxTop = mapDiv[0].clientHeight
+ var markers = []
+ var setContent = function() {
+ var tmp = []
+ var markergeos = []
+ var layergeos = []
+ for (marker in markers) {
+ tmp.push(markers[marker].long)
+ tmp.push(markers[marker].lat)
+ tmp.push(markers[marker].time)
+ tmp.push(markers[marker].message)
+ tmp.push(markers[marker].clientid)
+ markergeos.push({
+ "id": markers[marker].clientid + "marker",
+ "styleId": "myStyle",
+ "position": new TMap.LatLng(markers[marker].lat, markers[marker].long)
+ })
+ layergeos.push({
+ "id": markers[marker].clientid + "layer",
+ "styleId": "label",
+ "position": new TMap.LatLng(markers[marker].lat, markers[marker].long),
+ "content": markers[marker].message + " " + markers[marker].time
+ })
+ }
+ console.log(markergeos)
+ if(markergeos.length == 1){
+ map.setCenter(new TMap.LatLng(markers[0].lat, markers[0].long))
+ }
+ title.parent().parent().attr('user-content', tmp.join("@#@$@"))
+ markerLayer.setGeometries(markergeos)
+ mapTextLayer.setGeometries(layergeos)
}
- })
- },true);
+ itemdiv.bind(MixIO.actionTags.DATA_MAP_CHANGE, function(event, message) {
+ MixIO.publish(topic.text(), JSON.stringify(message))
+ })
+ itemdiv.bind(MixIO.actionTags.DATA_MAP_CLEAR, function() {
+ clear_on_click()
+ })
+ client.on('message', function(topic1, message1) {
+
+ if (isAlive && isRunning)
+ if (topic1.split("/")[(isMixly ? 3 : 2)] == topic.text()) {
+ var label = ((new Date().getHours() < 10 ? "0" : "") + new Date().getHours() + ":" + (new Date().getMinutes() < 10 ? "0" : "") + new Date().getMinutes() + ":" + (new Date().getSeconds() < 10 ? "0" : "") + new Date().getSeconds())
+ if (isJSON(String(message1)) && ("long" in JSON.parse(String(message1))) && ("lat" in JSON.parse(String(message1))) && JSON.parse(String(message1)).clientid) {
+ var jsonMessage = JSON.parse(String(message1))
+ console.log(jsonMessage)
+ itemdiv.trigger(MixIO.eventTags.DATA_MAP_CHANGED, [jsonMessage.clientid, jsonMessage.long, jsonMessage.lat, jsonMessage.message])
+ var newOrNot = true
+ var markerIndex = -1
+ for (marker in markers) {
+ if (jsonMessage.clientid == markers[marker].clientid) {
+ newOrNot = false
+ markerIndex = marker
+ break
+ }
+ }
+ if (newOrNot) {
+ var msgstr = ""
+ if (typeof jsonMessage.message == "string")
+ jsonMessage.message = JSON.parse(jsonMessage.message)
+ for (msg in jsonMessage.message) {
+ msgstr = msgstr + jsonMessage.message[msg].label + ": " + jsonMessage.message[msg].value + " "
+ }
+ markers.push({
+ "clientid": jsonMessage.clientid,
+ "long": jsonMessage.long,
+ "lat": jsonMessage.lat,
+ "time": label,
+ "message": msgstr
+ })
+ } else {
+ markers[markerIndex].time = label
+ var msgstr = ""
+ if (typeof jsonMessage.message == "string")
+ jsonMessage.message = JSON.parse(jsonMessage.message)
+ for (msg in jsonMessage.message) {
+ msgstr = msgstr + jsonMessage.message[msg].label + ": " + jsonMessage.message[msg].value + " "
+ }
+ markers[markerIndex].long = jsonMessage.long
+ markers[markerIndex].lat = jsonMessage.lat
+ markers[markerIndex].message = msgstr
+ }
+ setContent()
+ } else {
+ showtext(JSLang[lang].mapJSON)
+ }
+ }
+ })
+ var map = new TMap.Map(document.getElementById(randomName), {
+ center: new TMap.LatLng(39.967, 116.373),
+ zoom: 17,
+ pitch: 43.5,
+ rotation: 45
+ });
+ var markerLayer = new TMap.MultiMarker({
+ map: map, //指定地图容器
+ styles: {
+ //创建一个styleId为"myStyle"的样式（styles的子属性名即为styleId）
+ "myStyle": new TMap.MarkerStyle({
+ "width": 25, // 点标记样式宽度（像素）
+ "height": 35, // 点标记样式高度（像素）
+ "src": 'data:image/png;base64,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', //图片路径
+ //焦点在图片中的像素位置，一般大头针类似形式的图片以针尖位置做为焦点，圆形点以圆心位置为焦点
+ "anchor": { x: 16, y: 32 }
+ })
+ }
+ });
+ var mapTextLayer = new TMap.MultiLabel({
+ id: 'mapTextLayer',
+ map: map,
+ styles: {
+ 'label': new TMap.LabelStyle({
+ 'color': '#3777FF', //颜色属性
+ 'strokeColor': '#ffffff',
+ 'size': 14, //文字大小属性
+ 'offset': { x: 0, y: 10 }, //文字偏移属性单位为像素
+ 'angle': 0, //文字旋转属性
+ 'alignment': 'center', //文字水平对齐属性
+ 'verticalAlignment': 'top' //文字垂直对齐属性
+ })
+ }
+ });
+ var toBeAdded = user_content.split("@#@$@")
+ var addLength = toBeAdded.length / 5
+ for (var tmpi = 0; tmpi <= addLength - 1; tmpi = tmpi + 1) {
+ markers.push({
+ "long": toBeAdded[tmpi * 5],
+ "lat": toBeAdded[tmpi * 5 + 1],
+ "time": toBeAdded[tmpi * 5 + 2],
+ "message": toBeAdded[tmpi * 5 + 3],
+ "clientid": toBeAdded[tmpi * 5 + 4]
+ })
+ }
+ setContent()
+
+ var delete_on_click = function() {
+ $("#trashbin").append(mapDiv)
+ title.parent().parent().remove();
+ isAlive = false;
+ if (tbd)
+ tbd.remove()
+ }
+ var clear_on_click = function() {
+ markers = []
+ setContent()
+ }
+ var edit_on_click = function() {
+ modifyDia.showModal()
+ if (tbd)
+ tbd.remove()
+ }
+ var editForm = $('')
+ editForm.append($(''))
+ editForm.append($('' + JSLang[lang].unitName + '
'))
+ var title_input_div = $('')
+ var title_input = $("")
+ title_input_div.append(title_input)
+ editForm.append(title_input_div)
+ editForm.append($('' + JSLang[lang].messTopic + '
'))
+ var topic_input_div = $('')
+ var topic_input = $("")
+ topic_input_div.append(topic_input)
+ editForm.append(topic_input_div)
+ var bottomDiv = $('')
+ var confirmEdit = $('')
+ bottomDiv.append(confirmEdit)
+ confirmEdit.click(function() {
+ if (getByteLen(title_input.val()) > 0 && getByteLen(title_input.val()) < 21) {
+ var re = /^[a-z0-9]+$/i;
+ if (getByteLen(topic_input.val()) > 0 && getByteLen(topic_input.val()) < 11)
+ if (true) {
+ if (countSubstr(grid.html(), 'user-title=\"' + title_input.val() + '\"', false) <= (title_input.val() == title.text() ? 1 : 0)) {
+ title.parent().parent().attr('user-title', title_input.val())
+ title.parent().parent().attr('user-topic', topic_input.val())
+ if (title.parent().parent().attr('user-content') == undefined)
+ title.parent().parent().attr('user-content', "")
+ title.text(title_input.val())
+ topic.text(topic_input.val())
+ modifyDia.close()
+ } else
+ showtext(JSLang[lang].sameUnit)
+ } else
+ showtext("")
+ else
+ showtext(JSLang[lang].topicLenIllegal)
+ } else
+ showtext(JSLang[lang].nameLenIllegal)
+ })
+ var cancelEdit = $('')
+ cancelEdit.click(function() {
+ modifyDia.close()
+ })
+ bottomDiv.append(cancelEdit)
+ editForm.append(bottomDiv)
+ var modifyDia = dialog({
+ content: editForm[0],
+ cancel: false
+ })
+ var showEditBubble = function(event) {
+ if(tbd)
+ tbd.remove()
+ if (typeof startX != "undefined" && (startX - endX < 5 && endX - startX < 5) && (startY - endY < 5 && endY - startY < 5)) {
+ var editButton = $('')
+ var clearButton = $('')
+ var deleteButton = $('')
+ var bubble = $('')
+ bubble.append(topicDiv)
+ var d = dialog({
+ align: 'top',
+ content: bubble[0],
+ quickClose: true,
+ autofocus: false
+ });
+ tbd = d;
+ editButton.click(edit_on_click)
+ clearButton.click(clear_on_click)
+ deleteButton.click(delete_on_click)
+ if (!isRunning)
+ bubble.append(editButton)
+ bubble.append(clearButton)
+ if (!isRunning)
+ bubble.append(deleteButton)
+ if (!isRunning)
+ {
+ copyButton.attr("user-origin", title.text())
+ bubble.append(copyButton)
+ styleButton.attr("user-origin", title.text())
+ bubble.append(styleButton)
+ helpButton.attr("user-origin", attrs[0][1])
+ bubble.append(helpButton)
+ }
+ title_input.val(title.text())
+ topic_input.val(topic.text())
+ if (!d.open)
+ {
+ d.show(itemdiv[0]);
+ setTimeout(function() {
+ $(".ui-popup-backdrop").css("pointer-events", "auto")
+ },100)
+ }
+ else
+ d.close()
+ }
+ }
+ if (window.screen.width > 800)
+ {
+ itemdiv.click(showEditBubble)
+ itemdiv.on('contextmenu', function(event) {
+ event.preventDefault()
+ event.stopPropagation()
+ showEditBubble(event)
+ })
+ }
+ else
+ itemdiv[0].addEventListener('touchend', function(event) {
+ event.preventDefault()
+ showEditBubble(event)
+ })
+ itemdiv[0].addEventListener('touchmove', function(e) {
+ e.preventDefault()
+ })
+ if (user_style != undefined)
+ itemdiv.attr('style', user_style)
+ itemdiv.resizable({
+ minWidth: 300,
+ minHeight: 300,
+ onStopResize: function() {
+ var stdLeft = parseInt(itemdiv.css('left')) - parseInt(itemdiv.css('left')) % 20 + (parseInt(itemdiv.css('left')) % 20 > 10 ? 1 : 0) * 20
+ var stdTop = parseInt(itemdiv.css('top')) - parseInt(itemdiv.css('top')) % 20 + (parseInt(itemdiv.css('top')) % 20 > 10 ? 1 : 0) * 20
+ itemdiv.css('left', stdLeft)
+ itemdiv.css('top', stdTop)
+ var stdWidth = parseInt(itemdiv.css('width')) - parseInt(itemdiv.css('width')) % 20 + (parseInt(itemdiv.css('width')) % 20 > 10 ? 1 : 0) * 20
+ var stdHeight = parseInt(itemdiv.css('height')) - parseInt(itemdiv.css('height')) % 20 + (parseInt(itemdiv.css('height')) % 20 > 10 ? 1 : 0) * 20
+ itemdiv.css('width', stdWidth)
+ itemdiv.css('height', stdHeight)
+ }
+ })
+ },true);
+ }
}
function create_a_map_bubble(messageBody, time, point) {
