サイトのトップ画面をブログから ToDo に変更する
FlatPress は本来ブログエンジンですから、訪問者にトップページとして見せる内容記事は、最新記事になると思われます。ただ、本サイトの目的は、自分のための備忘録なので、最新記事が冒頭に表示されても深い意味を持ちえません。そこで、トップページが表示された際に、すぐ役立つ情報となるようにしてみることにしました。
「このウェブサイトのホームページ」の設定
「管理エリア」の「設定」の「このウェブサイトのホームページ」の設定によって、任意の固定ページを表示させることが可能です。下の図を参照してください。
ということで、新たなトップページを表示する「固定ページ」を作成して切り替えればOKとなります。たとえば、このように作成してみましょうか。
内容としては、HTML記述として /APP/ToDo/todo.php を iframe の利用によって見せようとしています。この todo.php はいわるゆる「ToDo」であり、アクセスした瞬間に表示されて便利に活用したいところです。この todo.php については、最後の方で説明したいと思います。
ToDo プログラムを実行してみるこの画面は http://www.flatpress.world/APP/todo/todo.php を表示させているものです。まずは、正常に稼働するかどうか、単体ページとして確認しておきましょう。この画面に表示される横幅には iframe の横幅と調整しておく必要があります。
この動作が確認できれば、後はトップページにアクセスして最終動作を確認して完了です。こんな感じに便利な「備忘録」に変身しました。なお、続く画面は以前までの画面状態（最新ブログの表示）です。
ここまでのまとめ
- 管理エリアの設定によって、特定のページをデフォルトのトップページに設定する。
- ここでは実際に役立つ意味で todo メモにすることにした。
- 特定ページは「固定ページ」であり、iframe で todo.php プログラムを呼び出だされている。
簡単な todo のプログラムはここで見つけることができました。「PHP 1ファイルのみでDB不要のTODO管理ツール - Todo.php」 http://0-oo.net/sbox/php-tool-box/todoこの ToDo の使い方はシンプルですが、一応、動作説明をしておきます。
- 何らかのカテゴリーを作成する。
- そのカテゴリーでの ToDo の項目名をメモ入力する。
- 同サイトのオリジナルでは「開始日」「期日」の項目があり、かつ javascript によってカレンダー表示での入力が可能である。ただし、本サイトでは同javascript が外部にアクセスすることを好まないこと、加えて、期日はカレンダー日付に従うというよりは「月末まで」とか「今週中」の方が日常生活とマッチするので、同javascript を削除してある。
- 項目名はTODOの詳細画面の「カテゴリ欄」で追加修正が可能である。
- 「状態」についてはオリジナルに加えて「検討中」とか「進行中」を加えてある。
- 「状態」欄において「完了」を選択するとその ToDo 項目はすぐに消えさる。（ログが APP/doto/data/ 配下に残っている）
- その ToDo 項目がすべて「完了」（つまりまったくなくなると）、カテゴリ名も削除される。（逆説的にはカテゴリー全部を消したい場合もこのような手順で行う）
- 「優先度」の欄では 1 から 5 まで優先度が変更できる。優先最上位は 5 であり、この数値でソートが行われている。
PHP プログラムについて
当該の todo.php プログラムは、/APP/todo というディレクトリを作成し、この中にこのコンテンツ用の css と一緒に格納しています。また、上述していますが、カレンダー表示での入力設定部分を削除しています。
<?php
/**
* Todo.php - A Simple Task Manager -
* @version 0.3.10
* @see http://0-oo.net/sbox/php-tool-box/todo
* @copyright 2008-2011 このメールアドレスはスパムボットから保護されています。閲覧するにはJavaScriptを有効にする必要があります。
* @license http://0-oo.net/pryn/MIT_license.txt (The MIT license)
*/
class Todo {
/** 文字コード */
const ENCODING = 'UTF-8'; /** サーバに保存するファイル名の文字コード */
// FlatPress.info
const FILE_NAME_ENCODING = 'UTF-8'; //Linuxその1
//const FILE_NAME_ENCODING = 'EUC-JP'; //Linuxその2
//const FILE_NAME_ENCODING = 'Shift_JIS'; //Windows /** TODOデータを保存するディレクトリ */
const DATA_DIR = 'data'; /** カテゴリ名として許可する正規表現 */
const CAT_REGEX = '^[^\\\\./:*?"<>|]{1,20}$'; /** バックアップの保存期限 */
const BACKUP_TIME = '-7 day'; /** 優先度の最大値 */
const PRI_MAX = 5; public $cat;
public $cats;
public $list; /**
* コンストラクタ
* @param string $cat カテゴリ
*/
public function __construct($cat) {
mb_internal_encoding(Todo::ENCODING);
mb_regex_encoding(Todo::ENCODING);
ini_set('default_charset', Todo::ENCODING); //HTTPヘッダーでの文字コード指定
ini_set('mbstring.strict_detection', true);
mb_substitute_character(0x005f); //変換できない文字は"_"にする $this->cat = $this->_encode($cat);
}
/**
* 表示の準備
*/
public function setUp() {
if ($this->isValidCat()) {
if ($_REQUEST['delete'] && $this->_deleteCat()) {
} else {
if ($_POST['update']) {
$this->_updateList();
}
$this->list = $this->_getList();
}
}
$this->cats = $this->_getCategories();
}
/**
* カテゴリチェック
* @return boolean 許可されるカテゴリかどうか
*/
public function isValidCat() {
return mb_eregi(Todo::CAT_REGEX, $this->cat);
}
/**
* TODOリストのファイルパスを取得する
* @return string パス
*/
public function getPath() {
$cat = mb_convert_encoding($this->cat, Todo::FILE_NAME_ENCODING);
return Todo::DATA_DIR . '/' . $cat . '.txt';
}
/**
* 入力データの文字コードを正しく変換する
* @param $input string 入力データ
* @return string 文字コード変換後の入力データ
*/
private function _encode($input) {
return mb_convert_encoding($input, Todo::ENCODING);
}
/**
* カテゴリを全て取得する
* @return array 全てのカテゴリのカテゴリ名とファイルサイズ
*/
private function _getCategories() {
$h = openDir(Todo::DATA_DIR);
if (!$h) {
exit('data directory is not found.');
}
$cats = array();
$limit = date('YmdHis', strToTime(Todo::BACKUP_TIME));
while (false !== ($file = readDir($h))) {
if (is_dir($file)) {
continue;
}
$arr = explode('.', $file);
$path = Todo::DATA_DIR . '/' . $file;
if (count($arr) == 3) { //バックアップの場合
if ($arr[2] < $limit) { //期限切れは削除
unlink($path);
}
} else { //最新版の場合
$cat = mb_convert_encoding($arr[0], Todo::ENCODING, Todo::FILE_NAME_ENCODING);
$cats[$cat] = fileSize($path);
}
}
closeDir($h);
ksort($cats);
return $cats;
}
/**
* TODOリストを更新して保存する
*/
private function _updateList() {
$oldCat = new Todo($_POST['oldcat']); //変更前のカテゴリ
$newPath = $this->getPath();
if (is_file(strToUpper(__FILE__))) { //ファイルパスで大文字小文字を区別しない場合
$change = strCaseCmp($oldCat->cat, $this->cat);
} else {
$change = ($oldCat->cat != $this->cat);
}
if ($change && is_file($newPath)) {
return; //変更後のカテゴリが既に存在する場合は更新しない
} $oldPath = $oldCat->getPath();
if ($oldCat->isValidCat() && is_file($oldPath)) {
rename($oldPath, $oldPath . '.' . date('YmdHis')); //バックアップ
} foreach ($_POST['todo'] as $post) {
if ($post[1] != '') { //TODO未入力は削除
$data .= implode("\t", array_map(array($this, '_encode'), $post)) . "\n";
}
}
file_put_contents($newPath, $data);
}
/**
* TODOリストを取得する
* @return array TODOリスト
*/
private function _getList() {
$path = $this->getPath();
if (!is_file($path)) { //新規の場合
return array('');
}
$list = explode("\n", file_get_contents($path));
rsort($list); //優先度順でソート
return $list;
}
/**
* カテゴリを削除する
* @return boolean 削除できたかどうか
*/
private function _deleteCat() {
$path = $this->getPath();
if (!is_file($path) || fileSize($path)) { //todoが残っている場合は削除させない
return false;
}
$this->cat = null;
return unlink($path);
}
}//----- HTMLレンダリング用のグローバル関数 -----
/**
* HTMLエスケープ
* @param string $val エスケープしたい文字列
* @return string エスケープした文字列
*/
function h($val) {
return htmlSpecialChars($val, ENT_QUOTES);
}
/**
* option要素を出力する
* @param string $val optionの値
* @param string $selected selectedにすべき値
*/
function echoOption($val, $selectedVal) {
if ($val == $selectedVal) {
$selected = 'selected="selected"';
}
echo "<option $selected>$val</option>\n";
}
//----------------------------------------------
$todo = new Todo($_REQUEST['cat']);
$todo->setUp();
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="<?php echo Todo::ENCODING ?>" />
<title>TODO - <?php echo h($todo->cat) ?></title>
<!-- FlatPres.info -->
<link rel="stylesheet" href="/../../fp-interface/themes/leggero/leggero/res/style.css">
<link rel="stylesheet" href="/../../fp-interface/themes/leggero/leggero/res/common.css">
<link rel="stylesheet" href="/./style.css">
<!--
<link rel="stylesheet" href="https://0-oo.googlecode.com/svn/pryn.css" />
<link rel="stylesheet" href="https://0-oo.googlecode.com/svn/yahho-sticky-footer.css" />
<style>
header, article, footer { display: block }
header { padding-top: 1em }
#bd, #add { font-size: 100% }
#cat { margin-bottom: 1em; font-size: 161.6% }
h1 { margin: 1em 0 0 }
a { text-decoration: none }
a:visited { color: #03c }
tr.row:hover { background-color: #79a }
th, td { border: solid #79a 1px }
td { padding: 1px 0 1px 1px }
select, input { margin: 0 }
select, input.date, footer { text-align: center }
select, #todo input { border-width: 0 }
select { width: 4.3em; height: 1.6em }
input.todo { padding-left: 0.5em; width: 20em }
input.date { width: 6em }
#update { text-align: right }
#update input { padding: 0.2em 2em; line-height: 1.6 }
li { padding-top: 0.5em; font-size: 131% }
li#add input { width: 5em }
</style>
-->
<script>
//IEでHTML5の新要素を使えるようにする
document.createElement("header");
document.createElement("footer");
</script>
</head><body><div id="doc" class="yui-t2"><header id="hd"><h1><a href="/?">TODO</a></h1></header><div id="bd"><div id="yui-main"><div class="yui-b"><article>
<?php
if ($todo->isValidCat()) {
?>
<form method="POST"> <div id="cat">
カテゴリ ： <input type="text" name="cat" value="<?php echo h($todo->cat) ?>" />
<input type="hidden" name="oldcat" value="<?php echo h($todo->cat) ?>" />
</div> <!-- TODOリスト -->
<table id="todo">
<thead>
<!-- <tr><th>優先度</th><th>TODO</th><th>開始日</th><th>期限</th><th>状態</th>-->
<tr><th>優先度</th><th>TODO</th><th>期限</th><th>状態</th>
</thead> <tbody>
<?php
$styleClasses = array('', 'todo', 'date han', 'date han');
$statuses = array('<!-- -->','進行中','検討中','保留中','完了'); foreach ($todo->list as $i => $row) {
$task = explode("\t", $row);
if ($task[4] == $statuses[4]) { //完了は出力しない
continue;
}
?>
<tr class="row"> <!-- 優先度 -->
<td>
<select name="todo[<?php echo $i ?>][]">
<?php
for ($j = 1; $j < Todo::PRI_MAX + 1; $j++) {
echoOption($j, $task[0]);
}
?>
</select>
</td> <!-- TODO、開始日、期限 -->
<?php
for ($j = 1; $j < 3; $j++) {
?>
<td>
<input type="text" name="todo[<?php echo $i ?>][]"
value="<?php echo h($task[$j]) ?>" class="<?php echo $styleClasses[$j] ?>" />
</td>
<?php
}
?> <!-- 状態 -->
<?php if ($task[3] == $statuses[1]) {
echo "<td style=\"background-color: #adff2f;\">";
}
if ($task[3] == $statuses[2]) {
echo "<td style=\"background-color: #87ceeb;\">";
}
if ($task[3] == $statuses[3]) {
echo "<td style=\"background-color: #ff8c00;\">";
}
if ($task[3] == "" ) {
echo "<td>";
}
?>
<select name="todo[<?php echo $i ?>][]" title="「完了」にするとリストからなくなります">
<?php
foreach ($statuses as $status) {
echoOption($status, $task[3]);
}
?>
</select>
</td> </tr>
<?php
}
?>
</tbody>
</table> <div id="update"><input type="submit" name="update" value="更新" /></div> </form>
<?php
} else if ($todo->cat) {
?>
<span class="error">
残念ですが、このカテゴリ名（ <?php echo h($todo->cat) ?> ）は使えません
</span>
<?php
}
?>
</article></div></div><!-- カテゴリリスト -->
<nav class="yui-b">
<ul>
<?php
foreach ($todo->cats as $cat => $fileSize) {
$href = '?cat=' . rawurlencode($cat);
?>
<li>
<a href="/<?php echo $href ?>"><?php echo h($cat) ?></a>
<?php
if (!$fileSize) { //todoが無いカテゴリは削除できる
?>
<a href="/<?php echo $href ?>&delete=do" title="カテゴリを削除する">[削除]</a>
<?php
}
?>
</li>
<?php
}
?><li id="add">
<form method="POST">
<div>
<input type="text" name="cat" />
<input type="submit" value="追加" title="カテゴリを追加する" />
</div>
</form>
</li></ul>
</nav></div><footer id="ft">
powered by <a href="http://0-oo.net/sbox/php-tool-box/todo">Todo.php</a>
</footer></div>
<!-- FlatPress.info
<script src="//0-oo.googlecode.com/svn/pryn.js"></script>
<script src="//0-oo.googlecode.com/svn/yahho-calendar.js"></script>
<script src="//0-oo.googlecode.com/svn/gcalendar-holidays.js" async="async" defer="defer"></script>
<script>
Pryn.addEvent(window, "load", function() {
YahhoCal.loadYUI();
YahhoCal.setMondayAs1st();
(function(input) {
var acs = new Pryn.ClassAccessor(input);
if (acs.hasClass("date")) {
Pryn.addEvent(input, "click", function() {
YahhoCal.render(YAHOO.util.Dom.generateId(input));
});
acs.addClass("clickable");
input.title = "クリックするとカレンダーを表示します";
}
}).foreach($T("input"));
});
</script>
--></body>
</html>
/**
* Todo.php - A Simple Task Manager -
* @version 0.3.10
* @see http://0-oo.net/sbox/php-tool-box/todo
* @copyright 2008-2011 このメールアドレスはスパムボットから保護されています。閲覧するにはJavaScriptを有効にする必要があります。
* @license http://0-oo.net/pryn/MIT_license.txt (The MIT license)
*/
class Todo {
/** 文字コード */
const ENCODING = 'UTF-8'; /** サーバに保存するファイル名の文字コード */
// FlatPress.info
const FILE_NAME_ENCODING = 'UTF-8'; //Linuxその1
//const FILE_NAME_ENCODING = 'EUC-JP'; //Linuxその2
//const FILE_NAME_ENCODING = 'Shift_JIS'; //Windows /** TODOデータを保存するディレクトリ */
const DATA_DIR = 'data'; /** カテゴリ名として許可する正規表現 */
const CAT_REGEX = '^[^\\\\./:*?"<>|]{1,20}$'; /** バックアップの保存期限 */
const BACKUP_TIME = '-7 day'; /** 優先度の最大値 */
const PRI_MAX = 5; public $cat;
public $cats;
public $list; /**
* コンストラクタ
* @param string $cat カテゴリ
*/
public function __construct($cat) {
mb_internal_encoding(Todo::ENCODING);
mb_regex_encoding(Todo::ENCODING);
ini_set('default_charset', Todo::ENCODING); //HTTPヘッダーでの文字コード指定
ini_set('mbstring.strict_detection', true);
mb_substitute_character(0x005f); //変換できない文字は"_"にする $this->cat = $this->_encode($cat);
}
/**
* 表示の準備
*/
public function setUp() {
if ($this->isValidCat()) {
if ($_REQUEST['delete'] && $this->_deleteCat()) {
} else {
if ($_POST['update']) {
$this->_updateList();
}
$this->list = $this->_getList();
}
}
$this->cats = $this->_getCategories();
}
/**
* カテゴリチェック
* @return boolean 許可されるカテゴリかどうか
*/
public function isValidCat() {
return mb_eregi(Todo::CAT_REGEX, $this->cat);
}
/**
* TODOリストのファイルパスを取得する
* @return string パス
*/
public function getPath() {
$cat = mb_convert_encoding($this->cat, Todo::FILE_NAME_ENCODING);
return Todo::DATA_DIR . '/' . $cat . '.txt';
}
/**
* 入力データの文字コードを正しく変換する
* @param $input string 入力データ
* @return string 文字コード変換後の入力データ
*/
private function _encode($input) {
return mb_convert_encoding($input, Todo::ENCODING);
}
/**
* カテゴリを全て取得する
* @return array 全てのカテゴリのカテゴリ名とファイルサイズ
*/
private function _getCategories() {
$h = openDir(Todo::DATA_DIR);
if (!$h) {
exit('data directory is not found.');
}
$cats = array();
$limit = date('YmdHis', strToTime(Todo::BACKUP_TIME));
while (false !== ($file = readDir($h))) {
if (is_dir($file)) {
continue;
}
$arr = explode('.', $file);
$path = Todo::DATA_DIR . '/' . $file;
if (count($arr) == 3) { //バックアップの場合
if ($arr[2] < $limit) { //期限切れは削除
unlink($path);
}
} else { //最新版の場合
$cat = mb_convert_encoding($arr[0], Todo::ENCODING, Todo::FILE_NAME_ENCODING);
$cats[$cat] = fileSize($path);
}
}
closeDir($h);
ksort($cats);
return $cats;
}
/**
* TODOリストを更新して保存する
*/
private function _updateList() {
$oldCat = new Todo($_POST['oldcat']); //変更前のカテゴリ
$newPath = $this->getPath();
if (is_file(strToUpper(__FILE__))) { //ファイルパスで大文字小文字を区別しない場合
$change = strCaseCmp($oldCat->cat, $this->cat);
} else {
$change = ($oldCat->cat != $this->cat);
}
if ($change && is_file($newPath)) {
return; //変更後のカテゴリが既に存在する場合は更新しない
} $oldPath = $oldCat->getPath();
if ($oldCat->isValidCat() && is_file($oldPath)) {
rename($oldPath, $oldPath . '.' . date('YmdHis')); //バックアップ
} foreach ($_POST['todo'] as $post) {
if ($post[1] != '') { //TODO未入力は削除
$data .= implode("\t", array_map(array($this, '_encode'), $post)) . "\n";
}
}
file_put_contents($newPath, $data);
}
/**
* TODOリストを取得する
* @return array TODOリスト
*/
private function _getList() {
$path = $this->getPath();
if (!is_file($path)) { //新規の場合
return array('');
}
$list = explode("\n", file_get_contents($path));
rsort($list); //優先度順でソート
return $list;
}
/**
* カテゴリを削除する
* @return boolean 削除できたかどうか
*/
private function _deleteCat() {
$path = $this->getPath();
if (!is_file($path) || fileSize($path)) { //todoが残っている場合は削除させない
return false;
}
$this->cat = null;
return unlink($path);
}
}//----- HTMLレンダリング用のグローバル関数 -----
/**
* HTMLエスケープ
* @param string $val エスケープしたい文字列
* @return string エスケープした文字列
*/
function h($val) {
return htmlSpecialChars($val, ENT_QUOTES);
}
/**
* option要素を出力する
* @param string $val optionの値
* @param string $selected selectedにすべき値
*/
function echoOption($val, $selectedVal) {
if ($val == $selectedVal) {
$selected = 'selected="selected"';
}
echo "<option $selected>$val</option>\n";
}
//----------------------------------------------
$todo = new Todo($_REQUEST['cat']);
$todo->setUp();
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="<?php echo Todo::ENCODING ?>" />
<title>TODO - <?php echo h($todo->cat) ?></title>
<!-- FlatPres.info -->
<link rel="stylesheet" href="/../../fp-interface/themes/leggero/leggero/res/style.css">
<link rel="stylesheet" href="/../../fp-interface/themes/leggero/leggero/res/common.css">
<link rel="stylesheet" href="/./style.css">
<!--
<link rel="stylesheet" href="https://0-oo.googlecode.com/svn/pryn.css" />
<link rel="stylesheet" href="https://0-oo.googlecode.com/svn/yahho-sticky-footer.css" />
<style>
header, article, footer { display: block }
header { padding-top: 1em }
#bd, #add { font-size: 100% }
#cat { margin-bottom: 1em; font-size: 161.6% }
h1 { margin: 1em 0 0 }
a { text-decoration: none }
a:visited { color: #03c }
tr.row:hover { background-color: #79a }
th, td { border: solid #79a 1px }
td { padding: 1px 0 1px 1px }
select, input { margin: 0 }
select, input.date, footer { text-align: center }
select, #todo input { border-width: 0 }
select { width: 4.3em; height: 1.6em }
input.todo { padding-left: 0.5em; width: 20em }
input.date { width: 6em }
#update { text-align: right }
#update input { padding: 0.2em 2em; line-height: 1.6 }
li { padding-top: 0.5em; font-size: 131% }
li#add input { width: 5em }
</style>
-->
<script>
//IEでHTML5の新要素を使えるようにする
document.createElement("header");
document.createElement("footer");
</script>
</head><body><div id="doc" class="yui-t2"><header id="hd"><h1><a href="/?">TODO</a></h1></header><div id="bd"><div id="yui-main"><div class="yui-b"><article>
<?php
if ($todo->isValidCat()) {
?>
<form method="POST"> <div id="cat">
カテゴリ ： <input type="text" name="cat" value="<?php echo h($todo->cat) ?>" />
<input type="hidden" name="oldcat" value="<?php echo h($todo->cat) ?>" />
</div> <!-- TODOリスト -->
<table id="todo">
<thead>
<!-- <tr><th>優先度</th><th>TODO</th><th>開始日</th><th>期限</th><th>状態</th>-->
<tr><th>優先度</th><th>TODO</th><th>期限</th><th>状態</th>
</thead> <tbody>
<?php
$styleClasses = array('', 'todo', 'date han', 'date han');
$statuses = array('<!-- -->','進行中','検討中','保留中','完了'); foreach ($todo->list as $i => $row) {
$task = explode("\t", $row);
if ($task[4] == $statuses[4]) { //完了は出力しない
continue;
}
?>
<tr class="row"> <!-- 優先度 -->
<td>
<select name="todo[<?php echo $i ?>][]">
<?php
for ($j = 1; $j < Todo::PRI_MAX + 1; $j++) {
echoOption($j, $task[0]);
}
?>
</select>
</td> <!-- TODO、開始日、期限 -->
<?php
for ($j = 1; $j < 3; $j++) {
?>
<td>
<input type="text" name="todo[<?php echo $i ?>][]"
value="<?php echo h($task[$j]) ?>" class="<?php echo $styleClasses[$j] ?>" />
</td>
<?php
}
?> <!-- 状態 -->
<?php if ($task[3] == $statuses[1]) {
echo "<td style=\"background-color: #adff2f;\">";
}
if ($task[3] == $statuses[2]) {
echo "<td style=\"background-color: #87ceeb;\">";
}
if ($task[3] == $statuses[3]) {
echo "<td style=\"background-color: #ff8c00;\">";
}
if ($task[3] == "" ) {
echo "<td>";
}
?>
<select name="todo[<?php echo $i ?>][]" title="「完了」にするとリストからなくなります">
<?php
foreach ($statuses as $status) {
echoOption($status, $task[3]);
}
?>
</select>
</td> </tr>
<?php
}
?>
</tbody>
</table> <div id="update"><input type="submit" name="update" value="更新" /></div> </form>
<?php
} else if ($todo->cat) {
?>
<span class="error">
残念ですが、このカテゴリ名（ <?php echo h($todo->cat) ?> ）は使えません
</span>
<?php
}
?>
</article></div></div><!-- カテゴリリスト -->
<nav class="yui-b">
<ul>
<?php
foreach ($todo->cats as $cat => $fileSize) {
$href = '?cat=' . rawurlencode($cat);
?>
<li>
<a href="/<?php echo $href ?>"><?php echo h($cat) ?></a>
<?php
if (!$fileSize) { //todoが無いカテゴリは削除できる
?>
<a href="/<?php echo $href ?>&delete=do" title="カテゴリを削除する">[削除]</a>
<?php
}
?>
</li>
<?php
}
?><li id="add">
<form method="POST">
<div>
<input type="text" name="cat" />
<input type="submit" value="追加" title="カテゴリを追加する" />
</div>
</form>
</li></ul>
</nav></div><footer id="ft">
powered by <a href="http://0-oo.net/sbox/php-tool-box/todo">Todo.php</a>
</footer></div>
<!-- FlatPress.info
<script src="//0-oo.googlecode.com/svn/pryn.js"></script>
<script src="//0-oo.googlecode.com/svn/yahho-calendar.js"></script>
<script src="//0-oo.googlecode.com/svn/gcalendar-holidays.js" async="async" defer="defer"></script>
<script>
Pryn.addEvent(window, "load", function() {
YahhoCal.loadYUI();
YahhoCal.setMondayAs1st();
(function(input) {
var acs = new Pryn.ClassAccessor(input);
if (acs.hasClass("date")) {
Pryn.addEvent(input, "click", function() {
YahhoCal.render(YAHOO.util.Dom.generateId(input));
});
acs.addClass("clickable");
input.title = "クリックするとカレンダーを表示します";
}
}).foreach($T("input"));
});
</script>
--></body>
</html>
html {
width: 510px;
background-color: #fff;
}#doc {
text-align: left;
margin-left: 16px;
}#yui-main .row input {
margin: 0px;
padding: 3px;
color: #466;
}#todo th {
text-align: center;
}
#todo select {
width: 4em;
}#ft {
clear: both;
}#cat input {
font-size: 100%;
font-weight: bold;
color: #335544;
margin-bottom: 1em;
width: 18em;
}#hd h1 {
font-size: 100%;
margin: 1em 0 1em
}.yui-b li {
margin: 0px;
}#yui-main header, article, footer { display: block }
#yui-main header { padding-top: 1em }
#yui-main #bd, #add {font-size: 90% }
#yui-main #cat input { border: 0px;}
#yui-main a { text-decoration: none }
#yui-main a:visited { color: #335544; }
#yui-main tr.row:hover { background-color: #79a }
#yui-main th, td { border: solid #ccc 1px }
#yui-main td { padding: 1px 0 1px 1px }
#yui-main select, input {margin: 0 }
#yui-main select, input.date, footer { text-align: center }
#yui-main select, #todo input { border-width: 0 }
#yui-main input.todo { padding-left: 0.5em; width: 18em }
#yui-main input.date { width: 6em }
#yui-main #update {text-align: right; margin-right: 2px;}
#yui-main #update input { padding: 0.2em; line-height: 1.6 }#add input[type="submit"] {
cursor: pointer;
width: 3em;
}#update input[type="submit"] {
cursor: pointer;
width: 3em;
}
width: 510px;
background-color: #fff;
}#doc {
text-align: left;
margin-left: 16px;
}#yui-main .row input {
margin: 0px;
padding: 3px;
color: #466;
}#todo th {
text-align: center;
}
#todo select {
width: 4em;
}#ft {
clear: both;
}#cat input {
font-size: 100%;
font-weight: bold;
color: #335544;
margin-bottom: 1em;
width: 18em;
}#hd h1 {
font-size: 100%;
margin: 1em 0 1em
}.yui-b li {
margin: 0px;
}#yui-main header, article, footer { display: block }
#yui-main header { padding-top: 1em }
#yui-main #bd, #add {font-size: 90% }
#yui-main #cat input { border: 0px;}
#yui-main a { text-decoration: none }
#yui-main a:visited { color: #335544; }
#yui-main tr.row:hover { background-color: #79a }
#yui-main th, td { border: solid #ccc 1px }
#yui-main td { padding: 1px 0 1px 1px }
#yui-main select, input {margin: 0 }
#yui-main select, input.date, footer { text-align: center }
#yui-main select, #todo input { border-width: 0 }
#yui-main input.todo { padding-left: 0.5em; width: 18em }
#yui-main input.date { width: 6em }
#yui-main #update {text-align: right; margin-right: 2px;}
#yui-main #update input { padding: 0.2em; line-height: 1.6 }#add input[type="submit"] {
cursor: pointer;
width: 3em;
}#update input[type="submit"] {
cursor: pointer;
width: 3em;
}
/*
===================
Leggero CSS Styles
===================
Ispired by: http://pluxml.org theme default
-------------------Name: Leggero
Author: NoWhereMan & drudo
Version: 0.1
Module: common.css
*//* ===== GENERAL (redefinition HTML tag) ===== */
html {
font-size: 85%;
font-family: 'Lucida Grande', 'Trebuchet MS', arial, Helvetica, sans-serif;
margin: 0;
padding: 0
}body {
font-size: 100%;
padding: 0;
text-align:center;
background: white url(../imgs/backshade.png) repeat-x;
color: black;
}hr { display: none }p { margin: .5em 0 }img { border: none }blockquote {
width: 90%;
color: #666;
margin: 1em 1em;
padding: 0 10px;
border-left: 5px solid #bbb
}pre, code {
font-family: Lucida Console, Monaco, monospace;
font-size: 90%;
}pre {
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background-color: #efefef; overflow: auto;
width: 90%;
margin: 1em 1em;
padding: 5px 10px; /* fix overflow in IE */
min-height: 40px;
height: auto !important;
height: 40px;
}ul, li, ol { margin: 0; padding: 0 }/* === Form === */
form { margin: 1em 0 }fieldset {
margin: 0 0 1em 0;
padding: .5em;
border: #ddd solid 1px
}legend {
color: #666666;
font-size: 80%;
font-style: oblique
}input, textarea, select {
padding: .2em;
border: 1px solid #999;
color: #222;
background-color: #eee;
}input:hover, input:focus, textarea:hover, textarea:focus {
border: 1px solid #AA1111;
background-color: #fff
}textarea {
font-size: 100%;
font-family: 'Lucida Grande', 'Trebuchet MS', arial, Helvetica, sans-serif;
width: 99%;
margin-top: .1em;
margin-bottom: 1em
}/* ===== LINKS GENERAL ===== */
a:link, a:visited {
color: #aa4142;
color: #335544;
font-weight: bold;
text-decoration: none
}a:hover {
color: #c37676;
color: #ffa500;
text-decoration: underline
}/* ===== HEADERS TAGS ===== */
h1 {
/* Title of the blog */
font-size: 2em;
letter-spacing: 2px;
margin: 2em 0 0 0
}h2 { } /* see h2.date */h3 {
/* Titles of the entry */
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
font-style: italic;
font-size: 1.5em;
color: #333333;
margin: 0
}h4 { font-size: 1.2em; }/* ===== DIV CONTAINER ALL ELEMENTS BLOCK ===== */
#body-container {
text-align: left;
width: 760px !important;
width: 748px; /* fix for I.E. */
margin: 0 auto 0 auto;
padding: 5px;
border: solid 1px #ccc;
background-color: white
}/* ===== HEAD ===== */
#head {
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
padding: 95px 10px 5px 5px;
margin: 10px;
/* 2014-8-27 */
/* background: #c37676 url('../imgs/shade.png') repeat-x; */
border: #bbb 1px solid
}#head a { color: white; text-decoration: none } .subtitle {
font-size: 100%;
font-style: oblique;
color: #F1F1F1;
margin: .5em 0 0 0
}/* ===== DIV CONTAINER "MAIN" ===== */
#outer-container {
position: relative;
height: 1%;
margin: 0px;
padding: 0px;
border-top: 1px solid white; /* problem with I.E. */
background-color: white
}/* ===== MAIN ===== */
#main h4 { margin: 2em 0 0 0}#main {
float:left;
position: relative;
width: 508px !important;
width: 478px;
font-size: 100%;
margin: 12px;
}#main p { line-height: 1.5em; margin-top: 1.2em; }#main img { margin: .5em }/* === List === */
#main ul {
list-style-type: disc;
padding: 0 0 0 1.6em
}#main ol {
list-style-position: inside;
padding: 0 1.6em 0 1.6em
} #commentform fieldset p { margin: 0 0 .5em 0 } #comments li {
margin: 0 0 1.5em 0;
padding: 5px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background: #efefef
} /* === Class of main block === */
h2.date {
font-size: 0.5em;
color: #aaa;
} .date { /* date under titles of the entry */
font-size: 80%;
font-style: oblique;
color: gray;
margin: .2em 0 .8em 0
} /* .entry class */
.entry {
margin: 0 0 1.5em 0;
padding: 0;
overflow: auto; /* floating images fix IE<7*/
} #main>.entry {
overflow: hidden; /* rest of the world :) */
}
/* end of .entry */ #main ul.entry-footer { /* entry footer */
clear: both;
font-size: 80%;
color: gray;
margin: 2em 0 .5em 0;
text-align: right;
} .entry-footer li {
display: block;
}
.admincontrols { /* [edit] and [delete] */
font-size: 80%;
text-align: right;
} .buttonbar { text-align: center } .buttonbar input {
text-align: center;
margin: .1em .5em;
padding: 0 1em
} .navigation { /* next entries & previous entries link */
font-size: 80%;
margin-bottom: 5em
}
/* ===== FOOTER ===== */
#footer {
clear: both;
font-size: 80%;
color: #555;
padding: 5px;
border-top: #bbb 1px solid
}/*===== FlatPress.World =====*/
#servername {
color: #fff;
background-color: orange;
padding-left: 1em;
}dl#scroll_lastentry {
width: 18em;
padding: 2px;
margin-top: -0.7em;
margin-left: -0.5em;
height: 10em;
border: 1px solid #eee;
overflow: auto;}/* ===== toppanel ===== */
#toppanel {
font-family: Verdana,"BitStream vera Sans",Helvetica,Sans-serif;
padding-top: 2px;
padding-left: 1em;
padding-bottom: 2px;
background: #464;
margin: 0em;
margin-bottom: 0px;
margin-top: -20px;
height: 18px;
opacity: 0.8;
}
#toppanel a:link, #toppanel a:visited {
color: #fff;
}
#toppanel li {
width: 5em;
float: left;
}
#toppanel ul {
list-style:none;
}
#head {
margin: 0px;
border: 0px;
background-image: url('../imgs/Leaves-l.jpg');
background-position: 0px -30px;
}
#head h1 {
font-size: 2em;
letter-spacing: 2px;
margin: 0 0 10px 90px;
}
.subtitle {
padding-left: 90px;
padding-bottom: 50px;
}/* new search position */
#topsearch {
margin-top: -60px;
padding-bottom: 11px;
padding-left: 570px;
}#topsearch input {
background-color: #fff;
border: 1px solid #637C3E;
color: #5B6D3A;
opacity: 0.7;
}#topsearch .search_btn {
position: relative;
right: 4px;
}#topsearch .search_btn input{
color: #fff;
background-color: #637C3E;
padding: 2px;
cursor: pointer;
}.admincontrols {
margin-top: -20px;
padding-bottom: 10px;
}#smode {
display: inline;
}#smode input {
margin: 0 0 1em;
padding: 0;
font-size: 80%;
}#footerX {
position: fixed;
width: 760px;
bottom:0;
background: #eef0ee;
font-size: 75%;
margin-left: -6px;
padding: 0.1em 0.5em 0.1em 0.5em;
border: 1px solid #486A3D;
}#footerM {
color: #b0421d;
}#footerC {
color: green;
}#findlast_pain {
opacity: 0;
}#findlast_pain {
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
opacity: 1;
}#main .img-gallery { margin-top: 40px; background:-moz-linear-gradient(59% 36% 275deg, #ffffff, #88cc99 100%); } #main .img-gallery img { position: relative; display: inline-block; border: 10px solid #fff; box-shadow: 0 0 4px #999; transform: rotate(20deg); overflow: hidden; margin: 10px; transform-origin: 0 0; transform: rotate(-20deg); }
===================
Leggero CSS Styles
===================
Ispired by: http://pluxml.org theme default
-------------------Name: Leggero
Author: NoWhereMan & drudo
Version: 0.1
Module: common.css
*//* ===== GENERAL (redefinition HTML tag) ===== */
html {
font-size: 85%;
font-family: 'Lucida Grande', 'Trebuchet MS', arial, Helvetica, sans-serif;
margin: 0;
padding: 0
}body {
font-size: 100%;
padding: 0;
text-align:center;
background: white url(../imgs/backshade.png) repeat-x;
color: black;
}hr { display: none }p { margin: .5em 0 }img { border: none }blockquote {
width: 90%;
color: #666;
margin: 1em 1em;
padding: 0 10px;
border-left: 5px solid #bbb
}pre, code {
font-family: Lucida Console, Monaco, monospace;
font-size: 90%;
}pre {
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background-color: #efefef; overflow: auto;
width: 90%;
margin: 1em 1em;
padding: 5px 10px; /* fix overflow in IE */
min-height: 40px;
height: auto !important;
height: 40px;
}ul, li, ol { margin: 0; padding: 0 }/* === Form === */
form { margin: 1em 0 }fieldset {
margin: 0 0 1em 0;
padding: .5em;
border: #ddd solid 1px
}legend {
color: #666666;
font-size: 80%;
font-style: oblique
}input, textarea, select {
padding: .2em;
border: 1px solid #999;
color: #222;
background-color: #eee;
}input:hover, input:focus, textarea:hover, textarea:focus {
border: 1px solid #AA1111;
background-color: #fff
}textarea {
font-size: 100%;
font-family: 'Lucida Grande', 'Trebuchet MS', arial, Helvetica, sans-serif;
width: 99%;
margin-top: .1em;
margin-bottom: 1em
}/* ===== LINKS GENERAL ===== */
a:link, a:visited {
color: #aa4142;
color: #335544;
font-weight: bold;
text-decoration: none
}a:hover {
color: #c37676;
color: #ffa500;
text-decoration: underline
}/* ===== HEADERS TAGS ===== */
h1 {
/* Title of the blog */
font-size: 2em;
letter-spacing: 2px;
margin: 2em 0 0 0
}h2 { } /* see h2.date */h3 {
/* Titles of the entry */
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
font-style: italic;
font-size: 1.5em;
color: #333333;
margin: 0
}h4 { font-size: 1.2em; }/* ===== DIV CONTAINER ALL ELEMENTS BLOCK ===== */
#body-container {
text-align: left;
width: 760px !important;
width: 748px; /* fix for I.E. */
margin: 0 auto 0 auto;
padding: 5px;
border: solid 1px #ccc;
background-color: white
}/* ===== HEAD ===== */
#head {
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
padding: 95px 10px 5px 5px;
margin: 10px;
/* 2014-8-27 */
/* background: #c37676 url('../imgs/shade.png') repeat-x; */
border: #bbb 1px solid
}#head a { color: white; text-decoration: none } .subtitle {
font-size: 100%;
font-style: oblique;
color: #F1F1F1;
margin: .5em 0 0 0
}/* ===== DIV CONTAINER "MAIN" ===== */
#outer-container {
position: relative;
height: 1%;
margin: 0px;
padding: 0px;
border-top: 1px solid white; /* problem with I.E. */
background-color: white
}/* ===== MAIN ===== */
#main h4 { margin: 2em 0 0 0}#main {
float:left;
position: relative;
width: 508px !important;
width: 478px;
font-size: 100%;
margin: 12px;
}#main p { line-height: 1.5em; margin-top: 1.2em; }#main img { margin: .5em }/* === List === */
#main ul {
list-style-type: disc;
padding: 0 0 0 1.6em
}#main ol {
list-style-position: inside;
padding: 0 1.6em 0 1.6em
} #commentform fieldset p { margin: 0 0 .5em 0 } #comments li {
margin: 0 0 1.5em 0;
padding: 5px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background: #efefef
} /* === Class of main block === */
h2.date {
font-size: 0.5em;
color: #aaa;
} .date { /* date under titles of the entry */
font-size: 80%;
font-style: oblique;
color: gray;
margin: .2em 0 .8em 0
} /* .entry class */
.entry {
margin: 0 0 1.5em 0;
padding: 0;
overflow: auto; /* floating images fix IE<7*/
} #main>.entry {
overflow: hidden; /* rest of the world :) */
}
/* end of .entry */ #main ul.entry-footer { /* entry footer */
clear: both;
font-size: 80%;
color: gray;
margin: 2em 0 .5em 0;
text-align: right;
} .entry-footer li {
display: block;
}
.admincontrols { /* [edit] and [delete] */
font-size: 80%;
text-align: right;
} .buttonbar { text-align: center } .buttonbar input {
text-align: center;
margin: .1em .5em;
padding: 0 1em
} .navigation { /* next entries & previous entries link */
font-size: 80%;
margin-bottom: 5em
}
/* ===== FOOTER ===== */
#footer {
clear: both;
font-size: 80%;
color: #555;
padding: 5px;
border-top: #bbb 1px solid
}/*===== FlatPress.World =====*/
#servername {
color: #fff;
background-color: orange;
padding-left: 1em;
}dl#scroll_lastentry {
width: 18em;
padding: 2px;
margin-top: -0.7em;
margin-left: -0.5em;
height: 10em;
border: 1px solid #eee;
overflow: auto;}/* ===== toppanel ===== */
#toppanel {
font-family: Verdana,"BitStream vera Sans",Helvetica,Sans-serif;
padding-top: 2px;
padding-left: 1em;
padding-bottom: 2px;
background: #464;
margin: 0em;
margin-bottom: 0px;
margin-top: -20px;
height: 18px;
opacity: 0.8;
}
#toppanel a:link, #toppanel a:visited {
color: #fff;
}
#toppanel li {
width: 5em;
float: left;
}
#toppanel ul {
list-style:none;
}
#head {
margin: 0px;
border: 0px;
background-image: url('../imgs/Leaves-l.jpg');
background-position: 0px -30px;
}
#head h1 {
font-size: 2em;
letter-spacing: 2px;
margin: 0 0 10px 90px;
}
.subtitle {
padding-left: 90px;
padding-bottom: 50px;
}/* new search position */
#topsearch {
margin-top: -60px;
padding-bottom: 11px;
padding-left: 570px;
}#topsearch input {
background-color: #fff;
border: 1px solid #637C3E;
color: #5B6D3A;
opacity: 0.7;
}#topsearch .search_btn {
position: relative;
right: 4px;
}#topsearch .search_btn input{
color: #fff;
background-color: #637C3E;
padding: 2px;
cursor: pointer;
}.admincontrols {
margin-top: -20px;
padding-bottom: 10px;
}#smode {
display: inline;
}#smode input {
margin: 0 0 1em;
padding: 0;
font-size: 80%;
}#footerX {
position: fixed;
width: 760px;
bottom:0;
background: #eef0ee;
font-size: 75%;
margin-left: -6px;
padding: 0.1em 0.5em 0.1em 0.5em;
border: 1px solid #486A3D;
}#footerM {
color: #b0421d;
}#footerC {
color: green;
}#findlast_pain {
opacity: 0;
}#findlast_pain {
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
opacity: 1;
}#main .img-gallery { margin-top: 40px; background:-moz-linear-gradient(59% 36% 275deg, #ffffff, #88cc99 100%); } #main .img-gallery img { position: relative; display: inline-block; border: 10px solid #fff; box-shadow: 0 0 4px #999; transform: rotate(20deg); overflow: hidden; margin: 10px; transform-origin: 0 0; transform: rotate(-20deg); }
/*
===================
Leggero CSS Styles
===================
Ispired by: http://pluxml.org theme default
-------------------Name: Leggero
Author: NoWhereMan & drudo
Version: 0.1
Module: style.css
*//* ===== COLUMN ===== */
#column {
float: right;
width: 195px !important;
width: 180px;
font-size: 80% !important;
font-size: 75%;
height:1%;
margin-bottom: 5px;
padding: 10px;
border-left: solid 1px #ccc
}#column h4 {
/* Titles of the sections */
margin-bottom: .5em;
}#column p, #column div { margin: 10px 5px }#column a:link, #column a:visited {
color: gray;
color: #335544;
}#column a:hover {
color: #ffa500;
}/* === List === */
#column ul li table { font-size: 100% }
/* FlatPress.info 2014-8-23 */
#column #widget-categories ul ul {
border-left: 4px solid #c5e19b;
margin-left: 0.5em;
}#column ul {
list-style-type: none;
/* FlatPress.info 2014-8-23 */
/* margin-right: 10px; */
/* margin-bottom: .5em; */
padding-left: 1em
}#column fieldset { margin: 0 5px 0 5px }#column legend { font-size: 100% }/* FlatPress.world 2014-8-17 */
.archive-year {
float: left;
text-align: right;}.archive-year > a {
float: left;
text-align: left;
font-style: italic;
}/* FlatPress.info 2014-8-23 */
#column ul ul ul {
border-left: 4px solid #f8f8f8;
}
===================
Leggero CSS Styles
===================
Ispired by: http://pluxml.org theme default
-------------------Name: Leggero
Author: NoWhereMan & drudo
Version: 0.1
Module: style.css
*//* ===== COLUMN ===== */
#column {
float: right;
width: 195px !important;
width: 180px;
font-size: 80% !important;
font-size: 75%;
height:1%;
margin-bottom: 5px;
padding: 10px;
border-left: solid 1px #ccc
}#column h4 {
/* Titles of the sections */
margin-bottom: .5em;
}#column p, #column div { margin: 10px 5px }#column a:link, #column a:visited {
color: gray;
color: #335544;
}#column a:hover {
color: #ffa500;
}/* === List === */
#column ul li table { font-size: 100% }
/* FlatPress.info 2014-8-23 */
#column #widget-categories ul ul {
border-left: 4px solid #c5e19b;
margin-left: 0.5em;
}#column ul {
list-style-type: none;
/* FlatPress.info 2014-8-23 */
/* margin-right: 10px; */
/* margin-bottom: .5em; */
padding-left: 1em
}#column fieldset { margin: 0 5px 0 5px }#column legend { font-size: 100% }/* FlatPress.world 2014-8-17 */
.archive-year {
float: left;
text-align: right;}.archive-year > a {
float: left;
text-align: left;
font-style: italic;
}/* FlatPress.info 2014-8-23 */
#column ul ul ul {
border-left: 4px solid #f8f8f8;
}