Info o ciastkach

Eeee...
Żeby strona działała fajnie to trzeba zaakceptować obsługę pewnych plików. Jeśli jesteś nienormalny, nosisz czapkę z amelinium i siedzisz w schronie zbudowanym z poduszek to możesz je sobie wyłączyć. Autor strony nie czerpie żadnych korzyści z cookies (twierdzi nawet, że ten komunikat jest głupi), ale, cóż - Unia wymaga. Korzystając z witryny zgadzasz się z polityką cookies.

Wszystko w budowie...

Element canvas i klasy w JS - the old way

W poprzednim wpisie opisałem jak wygląda deklaracja klas w JS6. Jako, że jest to dość nowa funkcjonalność to nie wszystkie przeglądarki je obsługują. Więcej na temat implementacji można przeczytać tutaj.

Dziś natomiast poprawiłem trochę ten skrypt żeby działał również na starszych przeglądarkach.



$(function(){

  function constructor(id,wymiary){
    this.id=id;
    this.wymiary=wymiary;
    this.object=document.getElementById(this.id);
    this.object.width=window.innerWidth;
    this.c=this.object.getContext("2d");
  }
  
  function refresh(){
    this.object.width=window.innerWidth;
    this.c.beginPath();

    for(var i=0;i<this.wymiary.length+1;i++){
        if(i==0){
            this.c.moveTo(this.wymiary[0][0],this.wymiary[0][1]);
        }else if(i==this.wymiary.length){
            this.c.lineTo(this.wymiary[0][0],this.wymiary[0][1]);
        }else{
            this.c.lineTo(this.wymiary[i][0],this.wymiary[i][1]);
        }
    }

    this.c.strokeStyle="white";
    this.c.fillStyle="white";
    this.c.closePath();
    this.c.stroke();
    this.c.fill();
  }
  
  function returnWidth(){
      return this.object.width;
  }
  
  var c1={
      constructor:constructor,
      refresh:refresh,
      returnWidth:returnWidth
  }
  
  function utworzObiekty(){
    c1.constructor("canv_top",[[0,50],[window.innerWidth,50],[window.innerWidth,0]]);
    c1.refresh();
  }
  
  utworzObiekty();
  
  window.onresize=function(){
      utworzObiekty();
  }
});


Tutaj natomiast jest taki myk, że konstruktor nie wykonuje się z automatu więc trzeba go wykonać ręcznie. Do tego jest drobny problem z tym w jaki sposób jest wykonywany taki kod. Zatem czasem zamiast liczby czy obiektu zobaczycie "undefined" gdy będziecie chcieć zmienić jakąś cechę - podobnież JS tworzy wtedy zmienną tymczasową do której przypisuje nową wartość a cechę niszczy. Do tego nowszy kod na pierwszy rzut oka wykonuje się szybciej.

Komentarze (0)

Nikt jeszcze nie dodał komentarza. Możesz być pierwszy.

Napisz komentarz lub zgłoś błąd

Dodane w dniu 21 czerwca 2017 przez Michał Misztal
Kopiowanie powyższych wypocin dozwolone pod warunkiem podania źródła, znaczy tandemu autor + link do strony