非管理パッケージ：お知らせ画面を作ってみた！

今日は会社の人が一人ハッカソンしようぜ！と誘ってくれたので、
渋谷のコワーキングで何かしら作ることになりました。

ログインした後にお知らせ画面表示させるようなの作ってみたいなー。
もちろん大好きなSalesforceでガリガリ作ってみます。


でも、お家のパソコンには開発環境が整ってないので、
ブラウザ＆１日でできる範囲でトラーイ！！




■開発環境の準備
①サインアップ
https://developer.salesforce.com

②ログイン情報の登録

③登録完了！メールが届くのまつ。


④メールが届くので、URLクリックしてパスワード登録

パスワードは英語と数字がデフォルト

⑤ログインできました！


■ログインした瞬間のおしらせ的な画面どうやって作ろう。
・Visualforceを１つ用意して、クッキーで今日の初回起動か判断して、全画面表示化。ヘッダフッタいかすか判断させる。
・画面開いたときに、今日の日付をクッキーに入れちゃう。（ユーザオブジェクトも考えたけど、今回はやめておく）
・画面表示したら５秒後に自動で遷移。
・カスタムオブジェクトでメッセージを動的に管理！

まずVF作成。せっかくなので苦手な開発コンソールを使う。
今日はEclipse一切使わずにやってみる。

①ログイン名クリック、開発コンソールクリック。


②コンソール起動


③Visualforce Page作成
・File＞New＞Visualforce Page
welcomeページにしてみる。


空のVFができました！


このURLで画面確認します。
https://c.ap0.visual.force.com/apex/welcome
ページは空っぽです。


リファレンス類と、Google先生に頼りつつ。
https://developer.salesforce.com/page/JP:Documentation
・Visualforce開発者ガイド
・Apexコード開発者ガイド

・Apexクラスでクッキー制御したり
・VFさわったり
showHeaderとsidebarの指定を動的に。



・お知らせオブジェクト作ってみたり
カスタム項目２つ作った（メッセージと名前）


・静的リソースに画像追加してみたり
zipで固めずに、そのまま登録。

ちゃんと登録されてるか、確認。
URL直たたき。
https://ap.salesforce.com/resource/welcome
見えた見えた。


で。いろいろやった。
メッセージがはみでた。。
divで囲った時にテキストがはみ出る。


しらべる。（css。。）
「word-break: break-word;」をdivにかけてみた。
Chromeでは大丈夫そう。。


改行対応もしておきたい。
コントローラで、\r\nを改行タグ(br)で置換したメッセージを表示。
apex:outputPanel escape="false"



あとは。。
・クッキーリセットのボタンをURLパラメータ「debug=1」の時だけ表示させる
※初回表示確認用
ボタン表示の条件追加。
rendered="{!$CurrentPage.parameters.debug=='1'}"

・有効フラグがonのものだけ表示するようにする。
→やってみた、URLパラメータでselect条件変更。

・事前に表示確認できるようにパラメータにIDがあれば優先表示させる。
→カスタムボタンから画面起動。URL指定。

ページレイアウトからボタン追加。

カスタムボタンを押すと、別画面でイメージ確認できます。

・顔のパターンを指定できるようにする。
カスタム項目に選択リスト追加。静的リソースには複数のPNGをzipで固めてアップロード。
選択リストの値がそのままイメージ名で使えるように。詳細はヘルプに書きました。




上の設定だと、画像は「5.PNG」を表示するように。


・テストクラス。。
→パッケージにするために、とりあえず書いた。



■動作確認
本日の初回ログイン。


アプリケーションのデフォルトタブがwelcomeページになってると。
全画面表示！そして、５秒後に遷移します。


遷移先は自分の画面になってまして、ヘッダとサイドバー付きで表示。


やりたかったことは出来ました！
（クロームでしか確認してません）


途中。あれ？ログインしても設定画面しか開かない。。なぜ！？！？とかもあった。
アプリケーションのデフォルトタブの設定は間違ってないし。。
隣にいた鎌倉の方に聞くと、ユーザの設定に、”設定画面をデフォルトページに設定”にチェックがついてないかとのこと。（あ、ついてました）

（こんな設定あったっけ。。）



■非管理パッケージにしてみました。
久々に非管理パッケージ作ったけど、説明用URLとかいつの間に増えたんだろう。
・クッキー名welcomeを使います。
・News__cオブジェクトをつくったので、既存環境にあれば入りませんっ
・”設定画面をデフォルトページに設定”のチェックをはずすのをお忘れなく！

https://login.salesforce.com/packaging/installPackage.apexp?p0=04t10000000N4hT
パスワード。nakayama2014。に、してみました。

別環境でインストールしてみた。ちゃんと動いた♪


今日おえかきした子たち。
iPadアプリPaperでお絵描きして、透過設定のままアルバムに保存出力。
Windowsのペインタで必要なところだけ切ってPNG保存。
背景が白いとキレイに表示されたので満足。





パッケージ直前に変えたコードがまずくて、すでにバージョンアップ。。

もうちょっとやりたかったこと。
・全画面の時にセンタリング表示させたい。（cssもうちょっと頑張りたい）
・Bootstrapでいい感じのデザインにしてみたい。
・５秒後に開くURLを設定できてもよかったかも。
・添付＆メモにのせた画像だしても面白そう。
・ランダム表示とか。有効期限設定とか。
・スキップするボタンがなかった。


なれれば開発者コンソールでも作れそう。
ショートカットキー覚えきれてないので、なんかもたつく。


このぐらい軽いのだったら、またすぐ作りたくなりますね！
また来週もチャレンジしてみよう。

おつかれさまでしたー。