For WebGL, hybrid SDL1 and SDL2 with emscripten

SDL v1と v2 の両方を利用したライブラリーにしようという事は前回話したとおり
Which SDL1 or SDL2 with emscripten

そこそこ動作するようになってきた。
https://github.com/kyorohiro/cgame/tree/master/examples

SDL1 と SDL2 の違い

大きな違いはなかった。 https://wiki.libsdl.org/MigrationGuide の通り。
基本は、初期化方法と、画面の更新方法が違うくらい。

SDL1 と SDL2 の差異、Html5用と、デスクトップ用の違いは、　https://github.com/kyorohiro/cgame/tree/master/app で吸収したので
興味のある方はどうぞ。

ちなみに、SDL_ttf と SDL_image と SDL_mixer の APIは同じでした。

ビルド方法のノウハウ

ビルド方法のノウハウは、Ninjaファイルを参照してください。

• https://github.com/kyorohiro/cgame/blob/master/build.emcc.ninja
• https://github.com/kyorohiro/cgame/blob/master/build.gcc.ninja

ninja -f build.gcc.ninja でビルドできます。

TODO

kyorohiro/cgame版のWebGLで、三角形を表示するコードです。
Html5用、デスクトップ用にビルドできます。

#include <stdio.h>
#include "app/capp.h"
#include "core/ccore.h"


int fps;
int frgShader;
int verShader;
int program;

GLfloat vertexBufferData[] = {
  0.0f, 0.5f, 0.0f,
  -0.5f, -0.5f, 0.0f,
  0.5f, -0.5f, 0.0f
};

GLshort indexData[] = {
  0,1,2
};

void _onInit(CObject* context, CObject* args) {
  printf("## onInit\r\n");
  CApp* appObj = (CApp*)context;

  glEnable(GL_DEPTH_TEST);
  glViewport(0, 0, appObj->width, appObj->height);
  glClearColor(1.0, 0.7, 0.7, 1.0);//rgba
  glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
  //

  CTry {
    frgShader = cglu_loadShader(GL_FRAGMENT_SHADER,
      "void main() {\n"
      "  gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);\n"
      "}\n");
    verShader = cglu_loadShader(GL_VERTEX_SHADER,
      "attribute vec4 position;\n"
      "void main() {\n"
      "  gl_Position = position;\n"
      "}\n");
  } CCatch {
    printf("## ERROR\r\n");
    return;
  }

  program = glCreateProgram();
  glAttachShader(program, frgShader);
  glAttachShader(program, verShader);
  glLinkProgram(program);

}

void _onDisplay(CObject* context, CObject* args) {
  CApp* appObj = (CApp*)context;

  //
  // setup buffer
  GLuint vertexBuffer;
  GLuint indexBuffer;
  glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
  glGenBuffers(1, &vertexBuffer);
  glGenBuffers(1, &indexBuffer);

  glUseProgram(program);
  int positionLoc = glGetAttribLocation(program, "position");

  //
  // connect buffer
  glBindBuffer(GL_ARRAY_BUFFER, vertexBuffer);
  glBufferData(GL_ARRAY_BUFFER, sizeof(GLfloat)*3*3, vertexBufferData, GL_STATIC_DRAW);

  glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, indexBuffer);
  glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(GLshort)*3, indexData, GL_STATIC_DRAW);

  glEnableVertexAttribArray(positionLoc);
  glVertexAttribPointer(positionLoc, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (void*)0);

  //
  // draw
  glDrawElements(GL_TRIANGLES, 3, GL_UNSIGNED_SHORT, 0);

  //
  // release buffer
  glDeleteBuffers(1, &vertexBuffer);
  glDeleteBuffers(1, &indexBuffer);

  if(fps != appObj->fps) {
    fps = appObj->fps;
    printf("fps:%d;\r\n",fps);
  }

  capp_flushBuffers(appObj);
  //capp_postRedisplay(appObj);
}

int main(int argc, char** argv) {
  printf("capp sample\r\n");
  CApp* appObj = createCApp(300, 300);
  capp_addDisplayEventListener(appObj, (CObject*)appObj, _onDisplay);
  capp_addInitEventListener(appObj,  (CObject*)appObj, _onInit);
  capp_run(appObj);
  return 0;
}

https://github.com/kyorohiro/cgame/tree/master/examples/app_002_gl


余計なコードがなくなってきてる気がしませんか。
まだまだ、改良の余地ありかな..

REF

http://kripken.github.io/emscripten-site/



おわり!!

.

------

試したコード
https://github.com/kyorohiro/sdl2_doc
This codes can build for windows and mac and html5 on windows and mac

作成中のライブラリー
https://github.com/kyorohiro/cgame

ことはじめ
https://kyorohiro.blogspot.jp/2017/09/which-use-sdl1-or-sdl2-at-emscripten.html

.