※一部MySQLの方に書けよって内容含まれてるけど統合しながら修正していったやつなので許して !!進捗 *よしのとおとはに書いてもらったcssをプログラムに合わせた形に修正したりバランスいじったり。追加、変更、削除ボタンの機能が使えない書き方だったのでデータ送れるように書き直し。なんかフォントが変わってしまったが本人に了承を得た。 *デザインを最大限生かせるサブウィンドウのサイズにしたいけどそうすると他の項目のサイズが微妙になるのでちょっと妥協。 *一覧表示の方はよしののこだわりが一部反映されなくて悩んでいたが普通のテーブルの書き方のサイトを参考にするとループ処理でおかしくなる部分をいじってたからだった。無駄に悩んだ。 *すずねが用意したトップにこっちで作ったコンテンツを統合。他のページも統合。 *コンテンツエリアの背景がコンテンツの大きさによって変わる仕様だったので固定できれいに見えるように調整。 *各ページのコンテンツの配置を調整。 *一覧表示で色要素使った図形でフラグを表現するやつ、結局cssで図形設定してもサイズ調整とかなんやかんやが上手くいかなかったのでテキストの●を文字色変えて表現。(cssで円作るとそこだけテーブルの背景色が丸くなって変だった。)黄色が見づらいなー。 *今まで保存されてるタグが確認出来るようにタグは3つテーブルに表示させてたけど企画書通りの1個表示に統一。トップページはカレンダーがでかくて幅がないので3つだと画面が乱れてた。 *新規メモ追加したときに白(#ffffff)が自動で保存されるようにした。MySQLの方でデフォルト値として設定すると新規メモが作れなくなったの意味分からなかったのでプログラムでinputで白が保存されるようにしてやった。ちなみにデフォルト値でNULLが入るようにすると1回色設定したメモでも編集時に色選択しないと変更したときに元の色消えちゃうのでユーザー定義を何も入力しないで設定し直して元に戻った。あと新規で白を自動追加した要領で元の色を送信することで編集時に色選択してなくても反映されるようになった。(ただし白に戻したくても戻せない、ラジオボタンでリセットとかの表記で白のカラーコード渡せばいいのか。)((br)) **↑の修正((br)) 新規メモ追加の時に入る白を#ffffff→whiteで追加。タグはどうせあいまい検索で「#」なくても検索できるしいちいち入力するのも手間なのでこの際なくして、検索ボックスに「#(半角)」入れて検索すると色付けたメモだけが出てくるっていうフラグの表示のさせ方。 **フラグ検索方法から思いついちゃったサイドメニューからのフラグ全件表示方法!検索結果画面の検索対象をcolorだけにした(この時点でタグから#を消した意味は無くなった)ページを用意してそこにvalue="#"を与えて画面遷移すればいいんじゃん!!やってみたらできた、がクリックでリンク先にただ飛ぶのではなく値を送る方式で記述するとボタンができてしまってどうしよう。hiddenじゃ隠れてくれない。とりあえず#なんで色つきは全部フラグ扱いにしてあるけど、カラーコード指定すれば赤だけをフラグとかにも変更できるのでちょっと相談しよう。(絞り込みは解決してない) **フラグは赤だけにして、フラグ全件では赤のやつだけ表示される。 *カレンダーとの連動、日付が保存されているメモのタイトルがcolorを反映させてカレンダーに表示される。カレンダーの背景色とかの調整してもらった。JSON使うために、カレンダーのjs部分をtop.php内に直接記述するようにした結果、トップだけで500行近いプログラムになっちった。 *新規と詳細のデータベース呼び出しとボタンを押したときの処理内容のプログラムを別ファルにまとめた。phpファイルを書き分けてそのファイル読み込んでるだけなので関数とかではない。 *サブウィンドウのデザインの引き継ぎミスを修正。memo.css内に二パターン書いてclassで分けたら表示が上手くいかなかったのでmemo.cssをなかったことにして各phpプログラム内に記述。ってことでcssファイルにわけてごちゃごちゃしすぎない中身だったプログラムが長くなったとさ。 *サイドメニューのフラグリンクのボタンが出ちゃってダサい問題&全件とフラグの間に謎のほっそ~い何かが発生している問題をまこに、自作タグの追加ボタンがウィンドウサイズによって現れたり消えたりする問題をすずねに解決していただいた。 +トップ最初に開いた感じ((br)) <<{全画面.png} +トップページカレンダー((br)) <<{カレンダー連動.png} +タイトルとかつけて保存するレベルじゃない思いついたこととかぱっと書ける部分。((br)) <<{自由帳.png} +サイドメニューの全件から保存されてる全てのメモの一覧が表示される。((br)) <<{全て.png} +検索に該当するメモだけが表示される。(例:「学校」の検索結果)((br)) <<{けんさくけんさく~.png} +新規メモ作成画面。「追加」ボタンで保存される。サブウィンドウは自動で閉じないので連続で複数のメモを作成可能。((br)) <<{追加真.png} +各ページのメモの横のアイコンをクリックすると開くメモの中身。ここから削除もできる。((br)) <<{中身.png} +フラグ全件、サイドメニューでクリックすると飛べる((br)) <<{サイドメニューリンク化.png} <<{フラグ全件.png} !!頑張ったけどできなかったこと *カレンダーの日付クリックで今日の予定がその日のメモに切り替わる(そこだけ処理をかえた画面に遷移)するようにしたかったがjsファイルのどこをどうしたらいいかわからないしカレンダーにメモのタイトルが出せただけでも十分なので諦め。 *サイドメニューのタグ編集欄のサイズが意味不明。ウィンドウを小さくしていくとボタン出てくるけど大きいと出てこないしなんか飛び出してる。どこであんなサイズになっちゃってるのか探したけどわからないし、知ってる方法で変わらないか試したけど不正解だった。 *サイドメニューで作ったタグのリンク、作った文字列を送信するのどうやんの。ていうかjsでの書き方見るにそもそもPOST通信できない記述の仕方している。別の書き方調べたけどいろんな部分書き換える必要あるかもしれなくて断念。 *トップの当日のメモのテーブル、cssで指定してるのに入ってる文字数によってタグの幅変わっちゃうのなんで。タグ入ってないメモのときとか幅狭すぎてダサいよ。 *フラグ絞り込みをつけようとしたが、メインの検索フォームとか検索結果画面の処理とかが参考にしたサイト(性別、年齢で絞り込めるやつ、サンプルコード書いといてコピペできない仕様はなんなの?)と違っててよくわからなかった。フラグ有り無しの選択するフォーム追加しようとしたけどそのフォームが表示すらされなくて処理を試してみるとかの段階ですらなかった。意味不明。(フラグ有りを選択すると'1'が送信されて、その値が'1'ならカラーコードが赤のメモの中から検索される、的な処理をしようとした。)色要素の内の一色をフラグとして使うっていう発想自体は悪くないと思ったんだが。。。 *詳細画面で削除ボタン押したらサブウィンドウ閉じてメインウィンドウ自動更新をしたかったけど色々試して結果失敗。直接window.close()とかopenを利用したやつとか使うと削除されないんで、jsに関数で削除、更新、ウィンドウ閉じるってのを書いたけどウィンドウは閉じねえし更新はメインじゃなくサブがされて意味ねえしで削除しかまともに動かないから一周回って元に戻った。すぐできると思ったのに時間の無駄でした。 *ポップアップはphpファイルでhtmlの中のjs部分にhtmlで書きたいという状況が訳分からなくて諦めた。 *いろんなサイトの画像の保存の仕方を、新しいテーブル用意して丸々サンプルコード使ったやり方で書いてみたり、メモのテーブルにパス保存するカラム追加して新規メモ作成のプログラムに必要そうなコード入れたりして試したけどどれも失敗。もうわからない。時間ないし画像は諦めよう。(ローカルストレージだと画像保存きついからMySQLを使おうって話だったような・・・) !!やってないこと *カレンダーの背景透けててページの柄が出ちゃってるので色付けた方がよくないですか? **完了 *サイドメニューの自作タグとカレンダーはなんで更新する度表示されたりされなかったりするの。何を条件としてそんな挙動をしているの。 **連動させてるうちにカレンダーは常に出るようになった *ロゴの画像はおそらく透過pngのはずだがjpgに変換されてて背景白くなっちゃうの相談しなくては。 **完了 *一覧表示でスクロールしてもhead部分は固定されてほしい。 **優先度低いので諦め *各ページのコンテンツにタイトルをトップページみたいな感じで付けた方がいいかな?トップ以外は中身一つだからなくてもいいんだけど、今のままだとシンプル過ぎてちょっと寂しい気がして。一応すずねの書いた部分を参考にやってみようとしたけどできなかった。 **index.cssの方に書いてないだけだった。各ページで色変えようかとも思ったけど逆にうるさくなりそうだしページに合う色で考えると色の系統が被っていきそうだから一色にした。 *メモの詳細表示を同時に複数のサブウィンドウ開けるようにしたいけど今は1つしか立ち上がらない書き方してる。同じところをクリックした回数だけサブウィンドウ立ち上がるっていうサンプルは見たことあるけどクリックするの別のとこだしできんのかな? **時間ないのでなかったことに >>{20::gr10}{班トップ}