TitaniumMobile勉強記

Web系エンジニア向けのキャリアアドバイザーやってましたが現在はフリーランスで開発含めて色々やってます。技術ネタとしてはRuby/RailsとJavaScript関連(Node.js、Titanium)あたり

画面遷移で最初・最後のページにたどりついた処理に悩み中

前回のエントリから2週間近く更新滞った理由というのは画面遷移で最初・最後のページにたどりついた処理に悩んでいるから。

ButtonBarとして配置したボタンをクリックした時にイベント発火されて、該当のページに遷移するんだけど、そのページの表示が完了したタイミングで別のイベントを発火することが出来ればあっさりと解決するんだけど結局それが思いつかずにこの2週間ほど費やしました・・・

全く違うアプローチというのも視野に入れて、参考になりそうな情報(例えばItem Paginationの実装方法)を参考にしてみようかと思ってはみるものの、なかなかいいアイデアが思いつかずにいます。

最初・最後のページにたどりついた時に、対応するボタンをdisableに出来ないので、その点では不完全だけど、それ以外の処理については自分の中ではコード見通しやくなったし晒しておきます。

EntrySummary = function(title,html_body,permalink,post_date,number_of_entry,current_page){
  this.title = title;
  this.html_body = html_body;
  this.permalink = permalink;
  this.post_date = post_date;
  this.number_of_entry = number_of_entry;
  this.current_page = current_page;
  this.first_window = Titanium.UI.createWindow();
  this.buttons = [
    {title:'newer',width:100,enabled:true},
    {title:'older',width:100,enabled:true}
  ];
  this.button_bar = Titanium.UI.createButtonBar({
      style:Ti.UI.iPhone.SystemButtonStyle.BAR
    });
  this.init();
};
EntrySummary.prototype = {
  init:function(){
    var view = this.setWebView(this.title,this.html_body);
    this.first_window.add(view);
    this.handlePage();
    Titanium.UI.currentTab.open(this.first_window,{animated:true});
  },
  handlePage:function(){

    if(this.current_page===1){
      this.firstPage();
    }else if(this.current_page===this.number_of_entry){
      this.lastPage();
    }else{
      this.middlePage();
    }
  },
  makeButtonBar:function(newer_button_prop,older_button_prop){
    var self = this;
    var webview = null;

    self.buttons[0].enabled = newer_button_prop;
    self.buttons[1].enabled = older_button_prop;
    self.button_bar.labels = self.buttons;
    self.button_bar.addEventListener('click',function(e){
      if(e.index===0){
      	webview = self.newerEntry();
      	self.current_page = self.current_page -1;
      }else{
      	webview = self.olderEntry();
      	self.current_page = self.current_page +1;
      }
     // animate完了したタイミングで現在のページ数に応じたイベント発火出来ればよいけど
     // その方法が思いつかず、最初のページ(もしくは最後のページ)に遷移した時に
     // newerボタン(もしくはolderボタン)をdisableに出来てない
      self.first_window.animate({
	transition: Titanium.UI.iPhone.AnimationStyle.CURL_UP,
	view:webview
      });
    }); // click event listener


    self.first_window.addEventListener('open', function(e){
      self.buttons[0].enabled = newer_button_prop;
      self.buttons[1].enabled = older_button_prop;
      self.button_bar.labels = self.buttons;
    });

    self.setTitle(self.button_bar);

  },
  setTitle:function(button_bar){
    return this.first_window.setTitleControl(button_bar);
  },
  firstPage:function(){
    var newer = false;
    var older = true;
    this.makeButtonBar(newer,older);

  },
  lastPage:function(){
    var newer = true;
    var older = false;
    this.makeButtonBar(newer,older);

  },
  middlePage:function(){
    var newer = true;
    var older = true;
    this.makeButtonBar(newer,older);

  },
  olderEntry:function(){
    var entry = this.searchEntry('older');
    this.post_date = entry[0].post_date;
    var view = this.setWebView(entry[0].title,entry[0].html_body);
    return view;
  },
  newerEntry:function(){
    var entry = this.searchEntry('newer');
    this.post_date = entry[0].post_date;
    var view = this.setWebView(entry[0].title,entry[0].html_body);
    return view;
  },
  searchEntry:function(param){
    var controller = new Controller('hibi');
    var entry = controller.findOneBy(this.post_date,param);
    return entry;
  },
  setWebView:function(title,html_body){
    var webview =  Ti.UI.createWebView();
    webview.html = '<html><head><title>'
      + title
      + '</title></head>'
      + '<body><h1>'
      + title
      + '</h1><hr />'
      + html_body
      + '</body></html>';
    return webview;
  }
};