commit fae8fd20ea8ef6c9805cf5f574ff1c0ea83179f7 Author: 陽だまり Date: Thu Dec 27 12:43:27 2018 +0900 初始 diff --git a/1/10.png b/1/10.png new file mode 100644 index 0000000..15447a9 Binary files /dev/null and b/1/10.png differ diff --git a/1/100.png b/1/100.png new file mode 100644 index 0000000..9172350 Binary files /dev/null and b/1/100.png differ diff --git a/1/20.png b/1/20.png new file mode 100644 index 0000000..ec5ba25 Binary files /dev/null and b/1/20.png differ diff --git a/1/30.png b/1/30.png new file mode 100644 index 0000000..c034698 Binary files /dev/null and b/1/30.png differ diff --git a/1/main.png b/1/main.png new file mode 100644 index 0000000..cd6f1e8 Binary files /dev/null and b/1/main.png differ diff --git a/2/10.png b/2/10.png new file mode 100644 index 0000000..15447a9 Binary files /dev/null and b/2/10.png differ diff --git a/2/100.png b/2/100.png new file mode 100644 index 0000000..9172350 Binary files /dev/null and b/2/100.png differ diff --git a/2/20.png b/2/20.png new file mode 100644 index 0000000..ec5ba25 Binary files /dev/null and b/2/20.png differ diff --git a/2/30.png b/2/30.png new file mode 100644 index 0000000..c034698 Binary files /dev/null and b/2/30.png differ diff --git a/2/atama.png b/2/atama.png new file mode 100644 index 0000000..74062d9 Binary files /dev/null and b/2/atama.png differ diff --git a/2/main - コピー.jpg b/2/main - コピー.jpg new file mode 100644 index 0000000..4bd12d5 Binary files /dev/null and b/2/main - コピー.jpg differ diff --git a/2/main.jpg b/2/main.jpg new file mode 100644 index 0000000..88b89a2 Binary files /dev/null and b/2/main.jpg differ diff --git a/2/main.png b/2/main.png new file mode 100644 index 0000000..fc50dae Binary files /dev/null and b/2/main.png differ diff --git a/gbf.js b/gbf.js new file mode 100644 index 0000000..8ad27f4 --- /dev/null +++ b/gbf.js @@ -0,0 +1,260 @@ +var stage = null; +var canvas = null; +var stampList = []; +if (typeof (localStorage.data) == "undefined") localStorage.data = "[]"; + + +// 定義基本資料 +var stampImgList = [ + { + id: 1, name: "GBF 2018四周年", image_data: [ + { id: 10, name: "10.png", x: 53, y: 441 }, + { id: 20, name: "20.png", x: 153, y: 441 }, + { id: 30, name: "30.png", x: 253, y: 441 }, + { id: 100, name: "100.png", x: 353, y: 441 } + ], + pos_data: [ + { x: 63, y: 213 } + , { x: 153, y: 213 } + , { x: 243, y: 213 } + , { x: 333, y: 213 } + , { x: 423, y: 213 } + , { x: 513, y: 213 } + , { x: 603, y: 213 } + , { x: 63, y: 303 } + , { x: 153, y: 303 } + , { x: 243, y: 303 } + , { x: 333, y: 303 } + , { x: 423, y: 303 } + , { x: 513, y: 303 } + , { x: 603, y: 303 } + ] + }, + { + id: 2, name: "GBF 2018聖誕節", image_data: [ + { id: "10", name: "10.png", x: 53, y: 420 }, + { id: "20", name: "20.png", x: 153, y: 420 }, + { id: "30", name: "30.png", x: 253, y: 420 }, + { id: "100", name: "100.png", x: 353, y: 420 }, + { id: "atama", name: "atama.png", x: 453, y: 420 }, + ], + pos_data: [ + { x: 43, y: 219 } + , { x: 133, y: 219 } + , { x: 223, y: 219 } + , { x: 313, y: 219 } + , { x: 403, y: 219 } + , { x: 493, y: 219 } + , { x: 583, y: 219 } + , { x: 43, y: 311 } + , { x: 133, y: 311 } + , { x: 223, y: 311 } + , { x: 313, y: 311 } + , { x: 403, y: 311 } + , { x: 493, y: 311 } + , { x: 583, y: 311 } + ] + } +]; + + +function init() { + var curEventId = $("select[name=EventList]").val(); + var curPath = "./" + curEventId + "/" + + canvas = document.querySelector('#gbfCanvas'); + stage = new createjs.Stage("gbfCanvas"); + stage.enableMouseOver(); + + // 背景圖片 + var stampCard = new createjs.Bitmap(curPath + "main.png"); + stage.addChild(stampCard); + // point + stampList = []; + var curStampImgList = Enumerable.from(stampImgList).where(function (obj) { return obj.id == curEventId; }).firstOrDefault().image_data; + for (var i in curStampImgList) { + var stamp = curStampImgList[i]; + + var stampData = new baseData(); + stampData.Id = stamp.id; + stampData.ImageName = curPath + stamp.name; + stampData.ImageX = stamp.x; + stampData.ImageY = stamp.y; + stampData.setObj(); + stage.addChild(stampData.Obj); + stampList.push(stampData); + } + // space + curPos = Enumerable.from(stampImgList).where(function (obj) { return obj.id == curEventId; }).firstOrDefault().pos_data; + + // 代入上次存檔值 + var tmpData = JSON.parse(localStorage.data); + var tmpStampData = Enumerable.from(tmpData).where(function (obj) { return obj.id == curEventId; }).firstOrDefault(); + if (tmpStampData == null) tmpStampData = { id: curEventId, data: [] }; + var curStampData = tmpStampData.data; + for (var index in curStampData) { + var item = curStampData[index]; + stampData = new baseData(); + stampData.Id = item.Id; + for (var i in stampList) { + var tmpStamp = stampList[i]; + if (tmpStamp.Id == item.Id) stampData.ImageName = tmpStamp.ImageName; + } + stampData.ImageX = item.ImageX; + stampData.ImageY = item.ImageY; + stampData.IsRestore = true; + stampData.setObj(); + stage.addChild(stampData.Obj); + } + + // 測點用 + function checkPoint(event) { + console.info(stage.mouseX); + console.info(stage.mouseY); + } + stage.addEventListener("mousedown", checkPoint); + + + // tick イベントを監視します + createjs.Ticker.setFPS(60); + createjs.Ticker.on("tick", function () { + // Stageの描画を更新します + stage.update(); + }); +} + +function baseData() { + var _Func = this; + _Func.Id = ""; + _Func.IsRestore = false; + _Func.Obj = null; + _Func.ImageName = ""; + _Func.ImageX = 0; + _Func.ImageY = 0; + + _Func.setObj = function () { + _Func.Obj = new createjs.Bitmap(_Func.ImageName); + _Func.Obj.customId = _Func.Id; + _Func.Obj.x = _Func.ImageX; + _Func.Obj.y = _Func.ImageY; + + if (!_Func.IsRestore) { + _Func.Obj.addEventListener("mousedown", handleDown); + _Func.Obj.addEventListener("pressmove", handleMove); + _Func.Obj.addEventListener("pressup", handleUp); + } else { + _Func.Obj.addEventListener("dblclick", deleteSelf); + } + _Func.Obj.cursor = 'pointer'; + + _Func.Obj.addEventListener('mouseover', function (e) { + canvas.className = 'mouseon'; + }); + + + } + function deleteSelf(event) { + var curEventId = $("select[name=EventList]").val(); + + var tmpData = JSON.parse(localStorage.data); + var tmpStampData = Enumerable.from(tmpData).where(function (obj) { return obj.id == curEventId; }).firstOrDefault(); + if (tmpStampData == null) { + tmpData.push({ id: curEventId, data: [] }); + tmpStampData = Enumerable.from(tmpData).where(function (obj) { return obj.id == curEventId; }).firstOrDefault(); + } + var curStampData = tmpStampData.data; + + var curData = []; + for (var index in curStampData) { + var item = curStampData[index]; + if (item.Id != event.target.customId + & item.ImageX != event.target.x + & item.ImageY != event.target.y + ) curData.push(item); + } + tmpStampData.data = curData; + localStorage.data = JSON.stringify(tmpData); + + stage.removeChild(event.target); + } + function handleDown(event) { + // ドラッグを開始した座標を覚えておく + dragPointX = stage.mouseX - event.target.x; + dragPointY = stage.mouseY - event.target.y; + // ボールを半透明にする + event.target.alpha = 0.5; + } + // ボールを押した状態で動かしたときの処理です + + function handleMove(event) { + // ボールはマウス座標に追随する + // ただしドラッグ開始地点との補正をいれておく + event.target.x = stage.mouseX - dragPointX; + event.target.y = stage.mouseY - dragPointY; + } + // ボールからマウスを離したときの処理です + + function handleUp(event) { + var curEventId = $("select[name=EventList]").val(); + + // ボールを元の透明度に戻す + event.target.alpha = 1.0; + + for (var index in curPos) { + var item = curPos[index]; + if (event.target.x >= (item.x - 30) + && event.target.x <= (item.x + 30) + && event.target.y >= (item.y - 30) + && event.target.y <= (item.y + 30) + ) { + var cloneObj = event.target.clone(); + // cloneObj.x = item.x + 8; + // cloneObj.y = item.y + 8; + stage.addChild(cloneObj); + var tmpData = JSON.parse(localStorage.data); + var tmpStampData = Enumerable.from(tmpData).where(function (obj) { return obj.id == curEventId; }).firstOrDefault(); + if (tmpStampData == null) { + tmpData.push({ id: curEventId, data: [] }); + tmpStampData = Enumerable.from(tmpData).where(function (obj) { return obj.id == curEventId; }).firstOrDefault(); + } + var curStampData = tmpStampData.data; + + var tmpBase = new baseData(); + tmpBase.Id = event.target.customId; + tmpBase.ImageX = event.target.x; + tmpBase.ImageY = event.target.y; + tmpBase.IsRestore = true; + cloneObj.addEventListener("dblclick", deleteSelf); + + curStampData.push(tmpBase); + localStorage.data = JSON.stringify(tmpData); + } + } + + for (var index in stampList) { + var item = stampList[index]; + if (item.Id == event.target.customId) { + event.target.x = item.ImageX; + event.target.y = item.ImageY; + } + } + } +} + +function stampChecker() { + var _Func = this; + _Func.x = 0; + _Func.y = 0; +} + +$(function () { + window.addEventListener("load", init); + + $("select[name=EventList]").on("change", function () { + stage.removeAllChildren(); + stage.update(); + init(); + }); +}); + + diff --git a/index.php b/index.php new file mode 100644 index 0000000..2d5c4d3 --- /dev/null +++ b/index.php @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + 活動選擇: + +
+ 格子內的點二下刪除,資料存在使用者端,換電腦資料會消失 +
+ + + + + \ No newline at end of file diff --git a/kjt_me_1_01.png b/kjt_me_1_01.png new file mode 100644 index 0000000..bdf0ba8 Binary files /dev/null and b/kjt_me_1_01.png differ diff --git a/sample.jpg b/sample.jpg new file mode 100644 index 0000000..59e45ca Binary files /dev/null and b/sample.jpg differ