Page : Bet Yöneticisi

Page sınıfı Betlerinizi tanımlamanız ve betleriniz arasındaki geçişi yönetmek için tasarlanmıştır.

Kullanım

import {O, Page} from 'otag'

let routes = {
  index: 'ana',
  ana: ''.kur({
    name: 'Ana Bet',
    once(){
      console.log('Bet ilk kez yerleştirildi')
    },
    idle(){
      console.log('Bet uyudu')
    },
    wake(){
      console.log('Bet Uyandı')
    }
  })
}

let Uygulama = new Page({
  routes, handler: 'body'
});

Bet nedir?

Bet(Sayfa), özelleşmiş bir Otağ Sanal Ögesi'dir. name, once, idle, wake özel açarlarını içerebilir.

wake(yol,...)

Betinizin uyandıkça çalışan işlevdir. Bu işlevin girdileri, gidilen yolun alt yolları olacaktır.

  // yol : /Hayvanlar/canis/lupus
  Hayvanlar:'Hayvanlar'.kur({
    View:{
      cins:'.cins',
      tür:'.tür'
    },
    wake(cins, tür){ //cins: "canis" , tür: "lupus"
      this.value={cins, tür}
    }
  })

once(yol,...)

Bir bet ilk kez çağırılıyorsa wake() yerine once() yöntemi çağırılır. Bu yöntem çağırıldıktan sonra silinir.

  once(){
    //belgeyi yükle
    O.req('belge').then(response=>this.value=response)

    //Uyandır
    this.wake.call(this, arguments)
  }

idle()

Bir betten başka bir bete geçiş yaparsanız belgee bulunan betin idle() yöntemi çağırılır. Eğer zaman aralıklı bir iş yapıyorsanız ya da bir izleti oynatıyorsanız. idle() ile durdurmanız üstünlüğünüze olacaktır.

{
  View:{
    izleti: 'video'
  },
  once(){
    let izleti = this.V('izleti').el
    izleti.src = 'izleti.mp4'
    izleti.load()
    this.wake()
  },
  wake(){
    this.V('izleti').el.play()
  },
  idle(){
    this.V('izleti').el.pause()
  }
}

name

Betinizin adıdır, Yönlendirme Çubuğu ya da Belge Başlığı(document.title)'nda görünür. Bu ad değişime duyarlıdır.

Aşağıda /Hayvan/Kedi yoluna gidince belge başlığını Kedi olarak ayarlayan bir yapı kurulmuştur.

  Hayvan: 'Hayvan Beti'.kur({
    name:'Hayvan',
    wake(hayvan="Kedi"){
      this.name = hayvan
    }
  })

Yol tanımlama

routes açarı, betlerinizi tanımlamanızı sağlar, bulunak çubuğuna yazdığınızda Page'in bulacağı bulunaklardır.

Aynı zamanda yönlendirmelerinizi de tanımlayabilirsiniz.

alacağı değer bir bet

  index: 'ana'

Yönlendirme Çubuğu

Page içinde bulunan Navigation yöntemi betleriniz için bir yönlendirme çubuğu arayüzü oluşturur.


Uygulama.Navigation()
        .to='#yönlendirme'

hide:['bet',...]

Navigation çağırırken gireceğiniz hide açarı, yönlendirme çubuğundan gizlemek isteyebileceğiniz betleri tanımlamanızı sağlar.

Örneğin imleğinize ana bete gitme özelliği tanımlamak ve Yönlendirme çubuğunda ana açarıyla bağlantı olmasın isteyebilirsiniz.

  'img#imlek[href="ana"]:imlek.svg'.to='header'

  Uygulama.Navigation({hide:['ana']})
        .to='#yönlendirme'

results matching ""

    No results matching ""