우리 반 자리 배치·청소 구역 정하기

진행판

위에서부터 누르면 됩니다

1 classpage 명단 가져오기 명단을 먼저 준비합니다.

이메일 명단

번호, 이름, 이메일만 있으면 학생 카드와 QR 메일 발송에 바로 반영됩니다.

명단 화면으로 이동

2 자리 배치하기 좌석을 만들고 Markdown으로 보관합니다.

저장·QR 메일

자리 화면으로 이동

3 청소 구역 정하기 청소 구역표를 만들고 Markdown으로 보관합니다.

저장·QR 메일

청소 화면으로 이동

4 저장·불러오기 classpage용 Markdown과 전체 백업을 저장합니다.

Gmail 자동 발송 설정

저장 화면으로 이동

1단계부터 눌러 진행하면 됩니다. 필요한 세부 설정은 각 단계 안에서만 펼쳐 보세요.

시작

오늘 할 일

명단부터 보기 저장 영역 보기

자리

자리 배치 시작

명단과 순번을 정리하고 자리판에서 바로 첫 성공을 만듭니다.

명단 → 순번 → 좌석 로컬 완료 가능

청소

청소 구역 시작

같은 명단으로 청소 면제와 요일/구역 배정만 먼저 끝냅니다.

명단 → 청소 설정 → 확정 이번 주 운영용

선택

QR 학생 선택 준비

학생이 직접 고르게 할 때만 사용합니다.

순번 확인 세션 Markdown 준비

먼저 오늘 할 일을 하나 고르면 필요한 영역을 열어 줍니다.

classpage

classpage 명단

classpage에서 보낸 명단은 자동으로 읽습니다.

형식 문서 보기 앱에 붙여넣기

학생 선택 화면

학생이 직접 자리나 청소를 고르게 할 때만 엽니다.

실운영 준비 열기 교사용 진행 보기

Teacher Flow

선생님용 빠른 흐름

1. 명단 넣기

CSV/엑셀을 열거나 표를 붙여넣은 뒤 명단 반영만 누르면 됩니다.

2. 번호/순번 정리

번호와 선택 순번을 따로 관리하고, 자리 배치·청소 구역 조건도 함께 넣을 수 있습니다.

3. QR 배포/기록

실시간 세션 만들기 후 학생 링크와 QR을 만들고, 결과를 기록으로 저장할 수 있습니다.

classpage 연동

이 순서대로 하면 됩니다

classpage 학급 탭에서 planner로 바로 보내기를 누르면 명단이 자동으로 들어옵니다.

1. 명단

학생 명단 넣기

시작 전

CSV/엑셀을 열거나 이름만 붙여넣은 뒤 명단 반영을 누르면 시작됩니다.

1. Roster

학생 명단 넣기

가장 추천

Markdown/CSV/엑셀 파일 열기

CSV는 바로 읽고, 엑셀 파일도 첫 번째 시트를 바로 불러올 수 있습니다.

엑셀 바로 사용

표 복사 후 붙여넣기

엑셀 표를 그대로 복사해서 아래 입력칸에 붙여넣어도 됩니다. 탭 구분 표를 읽습니다.

처음 시작

샘플 양식 받기

번호,이름,별점,선택순번,청소면제 형식의 엑셀 양식을 내려받아 바로 편집할 수 있습니다.

CSV 또는 엑셀 표 붙여넣기

바로 읽는 파일 형식은 .md(Classpage 표), .csv, .txt, .tsv, .xlsx, .xls 입니다. .numbers는 표를 복사해서 붙여넣거나 CSV로 저장해 주세요. 지원 열은 번호, 학번, 이름, 성별, 별점, 선택순번, 학급도우미, 전화번호, 이메일, 청소면제, 특별구역, 청소넘김, 다음청소페널티, 청소횟수, 자리조건, 청소조건 입니다.

이름만 붙여넣어도 되고, 번호,이름,성별,별점,선택순번,전화번호,이메일,청소면제 CSV나 엑셀 표 붙여넣기, 엑셀 파일 열기도 됩니다.

2. Order

학생 순번 정하기

자리 선택 인원 수 남은 학생 배치 방식 학생이 자기 차례를 정해진 횟수만큼 넘길 수 있게 허용 학생 스킵 가능 횟수 학생이 스스로 랜덤 자리 선택 가능

별점순으로 먼저 고를 학생 수를 정합니다. 0명으로 두면 바로 수동 또는 랜덤 배치로 시작합니다. 자리 배치에 반영할 세부 조건은 아래 학생 카드에서 같은 값으로 맞춰 두세요.

순번은 1번부터 연속이어야 합니다. 우선 대상 자동 채우기는 정한 인원 수만큼 별점순으로 채웁니다. QR 순번이 없는 학생은 자리 선택이 끝난 뒤 남은 학생 랜덤 배치로 채울 수 있습니다.

3. Seats

자리 배치하기

학생이 직접 고를 좌석판입니다. 쓰지 않을 좌석은 클릭해서 끄고, 자리 배치를 바꾸고 싶으면 격자 보기에서는 좌석 카드를 다른 자리 위로 끌어 놓고, 자유 배치를 켜면 교실 안 원하는 위치로 좌석을 직접 끌어 놓을 수 있습니다. 아래 교탁 쪽 맨 앞줄이 1-1부터 시작합니다.

초록색은 사용, 회색은 사용 안 함입니다.

교사용 자리 배정은 청소 구역처럼 아래에서 바로 시작할 수 있습니다. 먼저 고를 학생 수를 정하고, 나머지는 수동 또는 랜덤 방식으로 교사가 이어서 채울 수 있습니다.

자리 후보

0명

자리 선택

0명

이번 배정

0명

자리 상태

시작 전

학생 명단과 좌석이 준비되면 `자리 배치 시작`을 눌러 교사용 자리 배정을 바로 시작할 수 있습니다.

4. Cleaning

청소 구역 정하기

청소 항목 설정

청소 구역 우선 인원 수 청소 추가·반복 배정 방식 반복 배정 진행 방식 학생당 최대 배정 횟수 2회·3회처럼 정할 수 있으며, 같은 학생은 같은 요일에 두 번 배정되지 않습니다. 보강 우선 정책 학급도우미는 청소에서 제외 특별구역 학생은 일반 청소에서 제외 청소 구역 선택 학생이 자기 차례를 정해진 횟수만큼 넘길 수 있게 허용 청소 학생 스킵 가능 횟수 청소 구역 선택 학생이 스스로 랜덤 요일/구역 선택 가능

청소도 자리 배치처럼 정한 인원 수만큼 먼저 요일과 역할을 고르고, 나머지는 남은 칸에 배정합니다. 청소 배정에 반영할 세부 조건은 아래 학생 카드에서 같은 값으로 맞춰 두세요.

별점순 모드는 선택 기간 별점이 높은 순이며, 동점이면 전체 기간 별점 합계가 높은 순입니다. 보강 우선·건너뜀 벌점·학생별 배정 횟수 조건은 유지됩니다. 랜덤 모드는 기존 낮은 별점순 첫 배정을 유지하며, 모든 학생의 첫 배정이 끝난 뒤 반복 배정에만 랜덤을 적용합니다. 학생별 최대 배정 횟수 안에서 여러 요일을 맡을 수 있지만 같은 요일에는 두 번 배정되지 않습니다. 확정 전후 모두 배정된 학생 카드를 다른 칸으로 끌면 한 칸씩 이동하거나 서로 교환할 수 있으며, 학생별 배정 횟수는 유지됩니다. 청소를 넘긴 학생은 확정할 때 다음 차례용 별점 페널티가 예약됩니다(별점 절댓값의 절반만큼 감점).

청소 결석생 관리

청소 결석 캘린더

기준 날짜

저장 상태

결석 0명

아직 변경 없음

일일 체크 안내

해당 날짜에 빠진 학생을 체크하면 청소 후보에서 자동 제외합니다. 청소 당번이 빠졌다면 다음 청소 배정 때 우선 보정합니다.

날짜를 고른 뒤 빠진 학생을 체크하세요.

월간 청소 운영

기본 청소 구역표와 결석 보강 현황이 여기에 표시됩니다.

청소 후보

0명

청소 구역 선택

0명

이번 배정

0명

청소 상태

생성 전

반복 배정도 옮길 학생의 원래 청소 칸을 직접 끌어 빈 칸에 놓거나 다른 학생 칸과 교환할 수 있습니다.

청소 후보가 준비되면 월요일부터 금요일까지 6명씩 한 조로 청소 구역표를 만들 수 있습니다.

5. 저장

결과 저장

자리 QR 실운영 준비 열기 청소 QR 실운영 준비 열기

우선 학생

0명

자동 배치 학생

0명

사용 좌석

36석

저장 준비

준비 전

세션 이름 학생이 코드 뒤에 PIN까지 입력하도록 하기 (권장)

Mail Template

반별 안내 문구와 발송 상태

자리 메일 제목 템플릿

바로 쓸 수 있는 변수

{sessionName} {sessionCode} {studentName} {studentLabel} {studentCode} {studentPin} {studentUrl} {sessionCodeLine} {studentCodeLine} {studentPinLine} {studentUrlLine}

자리 메일 본문 템플릿

청소 메일 제목 템플릿

자리/청소 공통 변수

{sessionName} {sessionCode} {studentName} {studentLabel} {studentCode} {studentPin} {studentUrl} {sessionCodeLine} {studentCodeLine} {studentPinLine} {studentUrlLine}

청소 메일 본문 템플릿

통합 메일 제목 템플릿

통합 메일 전용 변수

{sessionName} {studentName} {studentLabel} {seatSessionCode} {seatStudentCode} {cleaningSessionCode} {cleaningStudentCode} {studentPin} {studentUrl} {seatSessionCodeLine} {seatStudentCodeLine} {cleaningSessionCodeLine} {cleaningStudentCodeLine} {studentPinLine} {studentUrlLine}

통합 메일 본문 템플릿

메일 목록은 Markdown 표로 보관합니다. Sheets에는 ‘마지막 표 복사’로 붙여넣고 열·줄바꿈을 확인하세요. 기존 CSV·Excel 발송 결과를 다시 불러오면 학생 카드에 발송 완료, 미발송, 오류 상태가 반영됩니다.

보안을 더 높이려면 {studentPin} 또는 {studentPinLine}은 메일 본문에 넣지 말고, 필요하면 학생에게 따로 알려 주세요. 같은 메일에 링크와 PIN을 함께 넣으면 보호 효과가 줄어듭니다.

Auto Send

Gmail 자동 발송 연결

Apps Script 웹앱 URL 웹앱 비밀키

비밀키는 이제 이 브라우저의 현재 탭에만 임시로 보관됩니다. 웹앱 URL은 https://script.google.com/macros/s/.../exec 주소만 사용하세요.

Apps Script 웹앱 URL과 비밀키를 넣으면, 자리 세션과 청소 세션의 미발송 메일을 이 화면에서 바로 보낼 수 있습니다.

이 화면에서 Gmail 자동 발송 안내와 스크립트 보기

1. 비밀키 만들기

위의 비밀키 만들기를 눌러 값을 만든 뒤, 아래 스크립트의 WEBHOOK_SECRET 자리에 같은 값을 넣습니다.

2. Google Apps Script 붙여넣기

새 구글 스프레드시트에서 확장 프로그램 → Apps Script를 연 뒤, 기본 코드를 모두 지우고 아래 스크립트를 붙여넣습니다.

3. 웹앱으로 배포하기

배포 → 새 배포 → 웹 앱에서 실행 사용자: 나로 배포한 뒤, 나온 웹앱 URL을 이 화면의 Apps Script 웹앱 URL 칸에 넣습니다.

4. 연결 점검 후 자동 발송

연결 점검이 성공하면 자리 QR 세션 또는 청소 QR 세션을 만든 상태에서 각 버튼으로 바로 자동 발송하면 됩니다.

붙여넣을 Apps Script

const WEBHOOK_SECRET = "PASTE_YOUR_WEBAPP_SECRET";
const RESULT_TYPE = "classroom-planner-mail-automation-result";

function doPost(e) {
  const payload = parsePayload_(e);
  const requestId = String(payload.requestId || "");
  const action = String(payload.action || "").trim();
  const returnOrigin = normalizeReturnOrigin_(payload.returnOrigin);

  try {
    if (!WEBHOOK_SECRET || WEBHOOK_SECRET === "PASTE_YOUR_WEBAPP_SECRET") {
      throw new Error("WEBHOOK_SECRET를 먼저 바꿔 주세요.");
    }
    if (String(payload.secret || "").trim() !== WEBHOOK_SECRET) {
      throw new Error("비밀키가 맞지 않습니다.");
    }

    if (action === "ping") {
      return buildResultPage_(
        {
          type: RESULT_TYPE,
          requestId,
          action,
          ok: true,
          message: `연결 확인 완료: ${Session.getEffectiveUser().getEmail() || "현재 Google 계정"}`,
          summary: {
            sentCount: 0,
            errorCount: 0,
            skippedCount: 0,
            remainingQuota: MailApp.getRemainingDailyQuota(),
          },
          rows: [],
        },
        returnOrigin
      );
    }

    if (action !== "send_selection_emails") {
      throw new Error(`지원하지 않는 action입니다: ${action}`);
    }

    const mails = Array.isArray(payload.mails) ? payload.mails : [];
    if (!mails.length) {
      throw new Error("보낼 메일이 없습니다.");
    }

    const remainingQuota = MailApp.getRemainingDailyQuota();
    let sentCount = 0;
    let errorCount = 0;
    let skippedCount = 0;

    const rows = mails.map((mail) => {
      const emailAddress = String(mail.emailAddress || "").trim();
      const mailSubject = String(mail.mailSubject || "").trim() || "교실 QR 안내";
      const mailBody = String(mail.mailBody || "").trim();
      const studentUrl = String(mail.studentUrl || "").trim();
      const baseRow = {
        studentId: String(mail.studentId || "").trim(),
        selectionOrder: Number(mail.selectionOrder || 0),
        studentName: String(mail.studentName || "").trim(),
        emailAddress,
        sentAt: "",
      };

      if (!emailAddress || !mailBody) {
        skippedCount += 1;
        return {
          ...baseRow,
          status: "skipped",
        };
      }

      if (sentCount >= remainingQuota) {
        skippedCount += 1;
        return {
          ...baseRow,
          status: "quota_exceeded",
        };
      }

      try {
        MailApp.sendEmail({
          to: emailAddress,
          subject: mailSubject,
          body: buildPlainTextBody_(mailBody, studentUrl),
          htmlBody: buildHtmlBody_(mailBody, studentUrl),
        });

        sentCount += 1;
        return {
          ...baseRow,
          status: "sent",
          sentAt: new Date().toISOString(),
        };
      } catch (error) {
        errorCount += 1;
        return {
          ...baseRow,
          status: "error",
          sentAt: "",
          message: String(error && error.message ? error.message : error),
        };
      }
    });

    return buildResultPage_(
      {
        type: RESULT_TYPE,
        requestId,
        action,
        ok: true,
        message: `자동 발송을 마쳤습니다. 발송 ${sentCount}건, 건너뜀 ${skippedCount}건, 오류 ${errorCount}건입니다.`,
        summary: {
          sentCount,
          errorCount,
          skippedCount,
          remainingQuota: Math.max(remainingQuota - sentCount, 0),
        },
        rows,
      },
      returnOrigin
    );
  } catch (error) {
    return buildResultPage_(
      {
        type: RESULT_TYPE,
        requestId,
        action,
        ok: false,
        message: String(error && error.message ? error.message : error),
        summary: {
          sentCount: 0,
          errorCount: 0,
          skippedCount: 0,
          remainingQuota: MailApp.getRemainingDailyQuota(),
        },
        rows: [],
      },
      returnOrigin
    );
  }
}

function parsePayload_(e) {
  const parameterPayload = e && e.parameter && e.parameter.payload ? String(e.parameter.payload) : "";
  if (parameterPayload) {
    return JSON.parse(parameterPayload);
  }

  const raw = e && e.postData && e.postData.contents ? String(e.postData.contents) : "{}";
  const parsed = JSON.parse(raw);
  if (parsed && typeof parsed === "object" && parsed.payload) {
    return JSON.parse(String(parsed.payload));
  }
  return parsed;
}

function buildResultPage_(result, returnOrigin) {
  const safeJson = JSON.stringify(result)
    .replace(/</g, "\\u003c")
    .replace(/>/g, "\\u003e");
  const safeOrigin = JSON.stringify(returnOrigin || "*");
  const summary = escapeHtml_(String(result.message || "요청을 처리했습니다."));

  const html = `
<!doctype html>
<html lang="ko">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>교실 QR Gmail 자동 발송</title>
    <style>
      body { font-family: Arial, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif; padding: 24px; line-height: 1.6; color: #1f2b2c; }
      .card { padding: 20px; border-radius: 18px; border: 1px solid #d8e2df; background: #ffffff; max-width: 640px; margin: 0 auto; }
      h1 { margin-top: 0; font-size: 1.3rem; }
      p { margin: 0; }
      .meta { margin-top: 12px; color: #627273; font-size: 0.92rem; }
    </style>
  </head>
  <body>
    <div class="card">
      <h1>${result.ok ? "Gmail 자동 발송 완료" : "Gmail 자동 발송 오류"}</h1>
      <p>${summary}</p>
      <p class="meta">이 창은 잠시 뒤 자동으로 닫힙니다. 닫히지 않으면 직접 닫아도 됩니다.</p>
    </div>
    <script>
      const result = ${safeJson};
      const targetOrigin = ${safeOrigin};
      try {
        if (window.opener && typeof window.opener.postMessage === "function") {
          window.opener.postMessage(result, targetOrigin || "*");
        }
      } catch (error) {}
      window.setTimeout(() => {
        try {
          window.close();
        } catch (error) {}
      }, 400);
    </script>
  </body>
</html>`;

  return HtmlService.createHtmlOutput(html);
}

function buildPlainTextBody_(body, url) {
  return [body, "", url ? `링크: ${url}` : ""].filter(Boolean).join("\n");
}

function buildHtmlBody_(body, url) {
  const escapedBody = escapeHtml_(body).replace(/\n/g, "<br />");
  const button = url
    ? `<p><a href="${escapeAttribute_(url)}" style="display:inline-block;padding:12px 18px;border-radius:999px;background:#1f5c4d;color:#ffffff;text-decoration:none;font-weight:700;">자리 선택 열기</a></p>`
    : "";

  return [
    '<div style="font-family:Arial,Apple SD Gothic Neo,Noto Sans KR,sans-serif;line-height:1.7;color:#1f2b2c;">',
    `<p>${escapedBody}</p>`,
    button,
    url ? `<p style="font-size:12px;color:#627273;word-break:break-all;">${escapeHtml_(url)}</p>` : "",
    "</div>",
  ].join("");
}

function normalizeReturnOrigin_(value) {
  const text = String(value || "").trim();
  if (!text || text === "null") {
    return "*";
  }
  return text;
}

function escapeHtml_(value) {
  return String(value || "")
    .replace(/&/g, "&")
    .replace(/</g, "<")
    .replace(/>/g, ">")
    .replace(/"/g, """);
}

function escapeAttribute_(value) {
  return escapeHtml_(value);
}

`realtime-config.js`가 준비되면 이 화면에서 곧바로 실시간 세션을 만들고 QR까지 볼 수 있습니다.

현재 요약

자리 QR은 `QR 대상 학생`에게만 만들어집니다. `자동 배치 학생`은 QR 없이 선택 종료 뒤 랜덤/규칙 배정됩니다.

classpage Markdown 저장

파일은 Markdown으로 저장합니다. Markdown을 지원하는 QR 설정 화면에서 파일을 읽고, 이전 버전은 JSON 입력 상자에 ‘QR 설정용 복사’ 내용을 붙여넣으세요. Sheets는 Markdown을 직접 업로드하지 말고 표 복사를 사용하세요. 파일과 복사 내용에는 개인정보·QR 접근 정보가 포함될 수 있으니 필요한 대상에게만 공유하세요.

qr-setup 열기 청소 세션 만들기

6. Archive

배정 기록 보관함

자리 결과와 청소 결과를 보관해 두면 나중에 다시 불러와 확인할 수 있습니다. 전체 백업 Markdown에도 함께 들어갑니다.

아직 저장된 기록이 없습니다.

왼쪽에서 기록을 선택하면 요약이 여기에 보입니다.

자리/청소 결과를 보관해 두면 전체 백업과 별도로 이 화면에서도 다시 꺼내 볼 수 있습니다.

우리 반 자리 배치·청소 구역 정하기

위에서부터 누르면 됩니다

오늘 할 일

자리 배치 시작

청소 구역 시작

QR 학생 선택 준비

classpage 명단

학생 선택 화면

선생님용 빠른 흐름

1. 명단 넣기

2. 번호/순번 정리

3. QR 배포/기록

이 순서대로 하면 됩니다

학생 명단 넣기

학생 명단 넣기

Markdown/CSV/엑셀 파일 열기

표 복사 후 붙여넣기

샘플 양식 받기

학생 순번 정하기

자리 배치하기

자리 후보

자리 선택

이번 배정

자리 상태

청소 구역 정하기

청소 결석 캘린더

청소표 공개 공유

저장 상태

일일 체크 안내

월간 청소 운영

청소 후보

청소 구역 선택

이번 배정

청소 상태

결과 저장

우선 학생

자동 배치 학생

사용 좌석

저장 준비

반별 안내 문구와 발송 상태

Gmail 자동 발송 연결

자리 선택 QR과 링크

세션 ID

세션 코드

세션 상태

청소 구역 선택 QR과 링크

세션 ID

세션 코드

세션 상태

자리+청소 통합 QR과 링크

자리 세션 코드

청소 세션 코드

통합 학생 링크

배정 기록 보관함