main.js

// main.js

$(".topic img").on("click",function(e){
    $("#popup").hide();
    // 화면 한가운데 위치 조정
    // var wh = $(window).height() / 2;
    // var ww = $(window).width() / 2;
    // var x = ww - 250;
    // var y = wh - 250;
    // 마우스 포인터 위치
    var x = e.pageX - 250;
    var y = e.pageY - 250;
    $("#popup").css({left:x+"px",top:y+"px"});
    var src = $(this).attr("src");
    var img = "<img src='" + src + "' width='500' height='500'>";
    $("#popup").html(img);
    $("#popup").show("slow");
});

$("#popup").on("click",function(){
    $(this).hide("slow");
});

var page=1;

function getPage(){
    $.getJSON("list.php?page="+page,function(d){
        if( ! d ) return; // ! = not/false
        for( i=0; i<d.length; i++) {
            var title = d[i].title;
            var writer = d[i].writer;
            var wdate = d[i].wdate;
            var tr = "<tr data-id='" + d[i].id + "'>";
            tr += "<td>" + title + "</td>";
            tr += "<td>" + writer + "</td>";
            tr += "<td>" + wdate.substring(0,10) + "</td>";
            tr += "<td><button class='del btn btn-danger btn-xs'><span class='glyphicon glyphicon-trash'></span>삭제</button> <button class='edit btn btn-info btn-xs'><span class='glyphicon glyphicon-pencil'></span>수정</button></td>";
            tr += "</tr>";
            $("#board tr:last").after(tr);
        }
    });
}

getPage();


$("#board").on("click",".del",function(){
    var id = $(this).parent("td").parent("tr").attr("data-id");
    //alert(id);
    var del = confirm("정말 지울까요?");
    if( ! del ) return;
    $.post("delete.php",{"id":id},function(){
        location.reload();
    });
});

$("#board").on("click",".edit",function(){
    var id = $(this).parent("td").parent("tr").attr("data-id");
    location.href = "write.php?id=" + id;
});

// var app = angular.module("myApp",[]);
// app.controller("myBoard",function($scope,$http){
//  $http.get("board.json").then(function(d){
//      $scope.board = d.data;
//  });
// });


$(window).scroll(function(){
    var scrollHeight = $(document).height();
    var windowHeight = $(window).height();
    var scrollTop = $(window).scrollTop();
    var scrollButtom = windowHeight + scrollTop;
    console.log("scrollHeight=" + scrollHeight);
    console.log("windowHeight=" + windowHeight);
    console.log("scrollTop=" + scrollTop);
    console.log("scrollButtom=" + scrollButtom);
    console.log("스크롤결과=" + ((scrollHeight-scrollButtom)/scrollHeight));
    if( (scrollHeight-scrollButtom)/scrollHeight === 0 ) {
        page++;
        getPage();
    }
});