//编辑界面 var EditingInterface = function(n){ this.n = n; //功能按钮 this.mainBtn = $(".edit-hot-active"), //创建编辑热点的功能 this.editHot = new EditHot(), //创建二级编辑的界面 // this.editFun = new EditFun(); //初始化所有基本元素和功能 this.initiate(); loadInfoAttrites() } //初始化界面 EditingInterface.prototype.initiate = function(){ $(".edit-wrap").fadeIn(); this.editHot.init(this.n); this.onClick(); // this.editFun.init(); } EditingInterface.prototype.onClick = function(){ var that = this; this.mainBtn.on("mousedown touchstart", function() { g_HotStatus = g_HotStatus == "add" ? null : "add"; switch(g_HotStatus) { case "add": $("#player").css("cursor","cell"); break } }) } //一级编辑界面,编辑热点的功能 var EditHot = function(){ this.ele = $(".edit-hot-num"), this.dataL = null, //获取最新创建热点的索引 this.children = null; //创建的热点信息 } EditHot.prototype.creatDom = function(index) { return "
position:
" + "x:
" + "y:
" + "z:
" + "rotation:
" + "x:
" + "y:
" + "z:
" + "
'
}
// 视频封面回调
function thumSuccess(file, $elayout) {
if (!/image\/\w+/.test(file.type)) {
alert("文件必须为图片!");
return false;
}
$elayout.parent().find('img').attr('src', URL.createObjectURL(file))
}
// 图片与视频加载
function fileHandle() {
var $seft = $(this)
var $layout = $seft.parent()
var $elayout = $layout.parent()
var $pplayout = $elayout.parent()
var type = $pplayout.attr('type')
var $close = $(document.createElement('span'))
var file = file = this.files[0];
var fnc = type === 'image' ? imageSuccess :
type === 'video' ? videoSuccess : thumSuccess
var $dom = fnc(file, $elayout)
if (type === 'image' || type === 'video') {
if (!$dom) return $seft.val('')
$layout.append($close)
$layout.addClass('result')
var $addLayout = $(document.createElement('a'))
var $addInput = $('')
$addLayout.append($addInput)
var $din = $(document.createElement('div'));
$din.append($addLayout)
$elayout.parent().append($din)
$layout.append($dom)
}
}
// 图片与视频加载
$('.edit-fun-images').on('change', function (ev) {
if (ev.target.tagName.toUpperCase() === 'INPUT') {
fileHandle.call(ev.target)
}
})
$('.edit-fun-images').on('click', function(ev) {
var $tag = $(ev.target)
var tagName = ev.target.tagName.toUpperCase()
if (tagName === 'SPAN') {
var $resf = $(ev.target)
$resf.parent().parent().remove()
} else if (tagName === 'IMG' && $tag.hasClass('play-video')) {
$videoLayout
.css('display', 'flex')
.find('video')
.attr('src', $tag.attr('videoURL'))[0]
.play()
}
})
})();
function showHotEdit(index) {
var $layout = $(".edit-function-wrap")
$layout.css("display", "flex")
$layout[0].targetDOM = $(".edit-hot-num > li").eq(index)[0];
var info = $layout[0].targetDOM.infoAttribute || {}
info.title = info.title || ''
info.content = info.content || ''
info.iframe = info.iframe || []
info.model = info.model || []
info.images = info.images || []
info.video = info.video || []
var iframesHTML = info.iframe.map(function(iframe) {
return ''
})
var modulesHTML = info.model.map(function (module) {
return ''
})
var imagesHTML = info.images.map(function (image) {
return ''
})
var videosHTML = info.video.map(function (ly) {
return ''
})
imagesHTML.push('')
videosHTML.push('')
$('#edit-iframes').html(iframesHTML.join(''))
$('#edit-modules').html(modulesHTML.join(''))
$('.edit-fun-images[type="image"]').html(imagesHTML.join(''))
$('.edit-fun-images[type="video"]').html(videosHTML.join(''))
$('#edit-title').val(info.title)
$('#edit-content').val(info.content)
}
// 保存热点信息
(function() {
var $layout = $(".edit-function-wrap")
$('#edit-submit').on('click', function () {
$layout.addClass('loadding')
var args = {}
var $title = $('#edit-title')
var $content = $('#edit-content')
var $images = $('.edit-fun-images[type="image"] a.result')
var $videos = $('.edit-fun-images[type="video"] a.result')
var $thums = $('.edit-fun-images[type="video"] .upload-thum')
var $iframes = $('#edit-iframes input')
var $modules = $('#edit-modules input')
new Promise(function(resolve, reject) {
upload($images, 'images', resolve)
}).then(function(imgUrls) {
args.images = imgUrls
return new Promise(function (resolve, reject) {
upload($videos, 'images', resolve)
})
}).then(function(videoUrls) {
args.video = videoUrls
return new Promise(function (resolve, reject) {
upload($thums, 'images', resolve)
})
}).then(function(thums){
args.video = args.video.map(function (video, index) {
return {
url: video,
img: thums[index]
}
})
}).then(function() {
args.title = $title.val()
args.content = $content.val()
var iframes = []
for (var i = 0; i < $iframes.length; i++) {
var iframe = $iframes.eq(i).val()
iframe && iframes.push(iframe)
}
args.iframe = iframes
var modules = []
for (var i = 0; i < $modules.length; i++) {
var module = $modules.eq(i).val()
module && modules.push(module)
}
args.model = modules
return args
}).then(function(args) {
$layout[0].targetDOM.infoAttribute = args
$layout.removeClass('loadding')
$layout.hide()
})
})
function upload ($files, type, cb) {
var length = $files.length
var rcount = 0
var result = []
Array.from($files).forEach(function(dFile) {
var $file = $(dFile)
var $image = $file.find('img')
if ($file.hasClass('success')) {
if ($file.attr('attr-thum')) {
console.log($files, $file)
result.push($file.attr('attr-thum'))
} else if ($image.attr('videoURL')) {
result.push($image.attr('videoURL'))
} else {
result.push($image.attr('src'))
}
return success(++rcount);
} else {
dFile = $file.find('input')[0]
}
var file = dFile.files[0]
if (!file) return success(++rcount);
var formData = new FormData()
formData.append('name', number)
formData.append('dir', 'hot/' + type)
formData.append('random', true)
formData.append('file', file)
$.ajax({
url: '/uploadFile',
data: formData,
dataType: 'json',
type: 'POST',
cache: false,//上传文件无需缓存
processData: false,//用于对data参数进行序列化处理 这里必须false
contentType: false, //必须
success: function (rs) {
if (rs.code === 200) {
result.push(rs.content)
}
success(++rcount)
}
})
})
function success() {
if (rcount === length) {
cb(result)
}
}
success()
}
})();
// 上传导览
function uploadGuide(urlData, guide) {
var bytes = window.atob(urlData.split(',')[1]); //去掉url的头,并转换为byte
//处理异常,将ascii码小于0的转换为大于0
var ab = new ArrayBuffer(bytes.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
var blob = new Blob([ab], { type: 'image/jpeg' });
var formData = new FormData()
formData.append('name', number)
formData.append('dir', 'hot/images')
formData.append('random', true)
formData.append('file', blob)
$.ajax({
url: '/uploadFile',
data: formData,
dataType: 'json',
type: 'POST',
cache: false,//上传文件无需缓存
processData: false,//用于对data参数进行序列化处理 这里必须false
contentType: false, //必须
success: function (rs) {
if (rs.code === 200) {
var sid = rs.content.substring(rs.content.lastIndexOf('\\') + 1, rs.content.lastIndexOf('.'))
var thumbnail_signed_src = rs.content
var args = JSON.parse("{"+guide+"}")
args.sid = sid
args.name = sid
args.thumbnail_signed_src = thumbnail_signed_src
args.metadata = JSON.stringify({
camera_mode: 0,
camera_position: {
x: args.metadata.camera_position[0],
y: args.metadata.camera_position[1],
z: args.metadata.camera_position[2]
},
camera_quaternion: {
x: args.metadata.camera_quaternion[3],
y: args.metadata.camera_quaternion[0],
z: args.metadata.camera_quaternion[1],
w: args.metadata.camera_quaternion[2]
},
ortho_zoom: -1,
scan_id: args.metadata.scan_id,
final_angle: 110,
is_ortho: false
})
console.log(args)
var $li = $('