Updated examples for web

15 files changed, 442 insertions, 283 deletions

diff --git a/examples/src/core/core_vr_simulator.c b/examples/src/core/core_vr_simulator.c
index 69e0f84..d919c41 100644
--- a/examples/src/core/core_vr_simulator.c
+++ b/examples/src/core/core_vr_simulator.c
@@ -22,7 +22,8 @@ int main()
     
     InitWindow(screenWidth, screenHeight, "raylib [core] example - vr simulator");
 
-    InitVrSimulator(HMD_OCULUS_RIFT_CV1);               // Init VR simulator (Oculus Rift CV1 parameters)
+    // Init VR simulator (Oculus Rift CV1 parameters)
+    InitVrSimulator(GetVrDeviceInfo(HMD_OCULUS_RIFT_CV1));
     
     // Define the camera to look into our 3d world
     Camera camera;
diff --git a/examples/web/Makefile b/examples/web/Makefile
index 6fc2727..6b77559 100644
--- a/examples/web/Makefile
+++ b/examples/web/Makefile
@@ -26,7 +26,7 @@
 # Define required raylib variables
 # WARNING: To compile to HTML5, code must be redesigned to use emscripten.h and emscripten_set_main_loop()
 PLATFORM ?= PLATFORM_DESKTOP
-RAYLIB_PATH ?= ../..
+RAYLIB_PATH ?= C:/GitHub/raylib
 PROJECT_NAME ?= raylib_example
 
 ifeq ($(PLATFORM),PLATFORM_RPI)
@@ -137,7 +137,7 @@ endif
 #  -fgnu89-inline       declaring inline functions support (GCC optimized)
 #  -Wno-missing-braces  ignore invalid warning (GCC bug 53119)
 #  -D_DEFAULT_SOURCE    use with -std=c99 on Linux and PLATFORM_WEB, required for timespec
-CFLAGS += -O1 -s -Wall -std=c99 -D_DEFAULT_SOURCE -fgnu89-inline -Wno-missing-braces
+CFLAGS += -O1 -Wall -std=c99 -D_DEFAULT_SOURCE -fgnu89-inline -Wno-missing-braces
 
 # Additional flags for compiler (if desired)
 #CFLAGS += -Wextra -Wmissing-prototypes -Wstrict-prototypes
@@ -160,7 +160,7 @@ ifeq ($(PLATFORM),PLATFORM_WEB)
     # -s ALLOW_MEMORY_GROWTH=1   # to allow memory resizing
     # -s TOTAL_MEMORY=16777216   # to specify heap memory size (default = 16MB)
     # -s USE_PTHREADS=1          # multithreading support
-    CFLAGS += -s USE_GLFW=3 -s ASSERTIONS=1 --profiling -s TOTAL_MEMORY=16777216 --preload-file resources
+    CFLAGS += -s USE_GLFW=3 -s ASSERTIONS=1 --profiling
 endif
 
 # Define include paths for required headers
@@ -471,7 +471,7 @@ text/text_sprite_fonts: text/text_sprite_fonts.c
 
 # compile [text] example - bmfonts and ttf loading
 text/text_bmfont_ttf: text/text_bmfont_ttf.c
-	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s ALLOW_MEMORY_GROWTH=1 \
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s TOTAL_MEMORY=67108864 \
     --preload-file text/resources/bmfont.fnt@resources/bmfont.fnt \
     --preload-file text/resources/bmfont.png@resources/bmfont.png \
     --preload-file text/resources/pixantiqua.ttf@resources/pixantiqua.ttf
@@ -498,7 +498,7 @@ text/text_writing_anim: text/text_writing_anim.c
 
 # compile [text] example - text ttf loading
 text/text_ttf_loading: text/text_ttf_loading.c
-	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s ALLOW_MEMORY_GROWTH=1 \
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s TOTAL_MEMORY=67108864 \
     --preload-file text/resources/KAISG.ttf@resources/KAISG.ttf
 
 # compile [text] example - text bmfont unordered
@@ -550,7 +550,37 @@ models/models_mesh_picking: models/models_mesh_picking.c
 	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) \
     --preload-file models/resources/tower.obj@resources/tower.obj \
     --preload-file models/resources/tower.png@resources/tower.png
+    
+# compile [models] example - models mesh generation
+models/models_mesh_generation: models/models_mesh_generation.c
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM)
 
+# compile [models] example - models material pbr
+models/models_material_pbr: models/models_material_pbr.c
+ifeq ($(PLATFORM), $(filter $(PLATFORM),PLATFORM_DESKTOP))
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM)
+else
+	@echo models_material_pbr: Example not supported on PLATFORM_ANDROID, PLATFORM_WEB or PLATFORM_RPI
+endif
+
+# compile [models] example - models skybox
+models/models_skybox: models/models_skybox.c
+ifeq ($(PLATFORM), $(filter $(PLATFORM),PLATFORM_DESKTOP))
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM)
+else
+	@echo models_skybox: Example not supported on PLATFORM_ANDROID, PLATFORM_WEB or PLATFORM_RPI
+endif
+
+# compile [models] example - models yaw pitch roll
+models/models_yaw_pitch_roll: models/models_yaw_pitch_roll.c
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s TOTAL_MEMORY=67108864 \
+    --preload-file models/resources/plane.obj@resources/plane.obj \
+    --preload-file models/resources/plane_diffuse.png@resources/plane_diffuse.png \
+    --preload-file models/resources/plane.png@resources/plane.png \
+    --preload-file models/resources/pitch.png@resources/pitch.png \
+    --preload-file models/resources/background.png@resources/background.png \
+    --preload-file models/resources/angle_gauge.png@resources/angle_gauge.png \   
+ 
 # compile [shaders] example - model shader
 shaders/shaders_model_shader: shaders/shaders_model_shader.c
 	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s TOTAL_MEMORY=67108864 \
@@ -599,7 +629,7 @@ audio/audio_module_playing: audio/audio_module_playing.c
 
 # compile [audio] example - raw audio streaming
 audio/audio_raw_stream: audio/audio_raw_stream.c
-	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s ALLOW_MEMORY_GROWTH=1
+	$(CC) -o $@$(EXT) $< $(CFLAGS) $(INCLUDE_PATHS) $(LDFLAGS) $(LDLIBS) -D$(PLATFORM) -s TOTAL_MEMORY=67108864
 
 # compile [physac] example - physics demo
 physac/physics_demo: physac/physics_demo.c
diff --git a/examples/web/core/core_3d_camera_free.c b/examples/web/core/core_3d_camera_free.c
index c8b634f..ad3ad99 100644
--- a/examples/web/core/core_3d_camera_free.c
+++ b/examples/web/core/core_3d_camera_free.c
@@ -25,7 +25,6 @@ int screenHeight = 450;
 Camera camera;
 Vector3 cubePosition = { 0.0f, 0.0f, 0.0f };
 
-
 //----------------------------------------------------------------------------------
 // Module Functions Declaration
 //----------------------------------------------------------------------------------
@@ -76,7 +75,7 @@ void UpdateDrawFrame(void)
 {
     // Update
     //----------------------------------------------------------------------------------
-     UpdateCamera(&camera);          // Update internal camera and our camera
+    UpdateCamera(&camera);          // Update internal camera and our camera
     //----------------------------------------------------------------------------------
 
     // Draw
diff --git a/examples/web/core/core_vr_simulator.c b/examples/web/core/core_vr_simulator.c
index 3a3b8dd..fcfd320 100644
--- a/examples/web/core/core_vr_simulator.c
+++ b/examples/web/core/core_vr_simulator.c
@@ -41,8 +41,8 @@ int main()
     //--------------------------------------------------------------------------------------
     InitWindow(screenWidth, screenHeight, "raylib [core] example - oculus rift");
     
-    // NOTE: If device is not available, it fallbacks to default device (simulator)
-    InitVrSimulator(HMD_OCULUS_RIFT_CV1);               // Init VR simulator (Oculus Rift CV1 parameters)
+    // Init VR simulator (Oculus Rift CV1 parameters)
+    InitVrSimulator(GetVrDeviceInfo(HMD_OCULUS_RIFT_CV1));
     
     // Define the camera to look into our 3d world
     camera.position = (Vector3){ 5.0f, 5.0f, 5.0f };    // Camera position
diff --git a/examples/web/models/loader.html b/examples/web/models/loader.html
index 090a8ea..a56ac70 100644
--- a/examples/web/models/loader.html
+++ b/examples/web/models/loader.html
@@ -72,7 +72,7 @@
                 // Quick hack for some examples not working on web
                 if ((name == "core_drop_files") || 
                     (name == "core_storage_values") || 
-                    (name == "models_material_pbr")
+                    (name == "models_material_pbr") ||
                     (name == "models_skybox"))
                 {
                     $('#eximage').append('<img src="' + imgUrl + '" alt=" ">');
diff --git a/examples/web/models/models_cubicmap.c b/examples/web/models/models_cubicmap.c
index 4e0dddd..0cbef2e 100644
--- a/examples/web/models/models_cubicmap.c
+++ b/examples/web/models/models_cubicmap.c
@@ -5,7 +5,7 @@
 *   This example has been created using raylib 1.3 (www.raylib.com)
 *   raylib is licensed under an unmodified zlib/libpng license (View raylib.h for details)
 *
-*   Copyright (c) 2015 Ramon Santamaria (@raysan5)
+*   Copyright (c) 2017 Ramon Santamaria (@raysan5)
 *
 ********************************************************************************************/
 
@@ -45,11 +45,13 @@ int main()
 
     Image image = LoadImage("resources/cubicmap.png");  // Load cubicmap image (RAM)
     cubicmap = LoadTextureFromImage(image);             // Convert image to texture to display (VRAM)
-    map = LoadCubicmap(image);                          // Load cubicmap model (generate model from image)
+    
+    Mesh mesh = GenMeshCubicmap(image, (Vector3){ 1.0f, 1.0f, 1.0f });
+    Model model = LoadModelFromMesh(mesh);
     
     // NOTE: By default each cube is mapped to one part of texture atlas
     Texture2D texture = LoadTexture("resources/cubicmap_atlas.png");    // Load map texture
-    map.material.texDiffuse = texture;                  // Set map diffuse texture
+    model.material.maps[MAP_DIFFUSE].texture = texture;                 // Set map diffuse texture
 
     UnloadImage(image);     // Unload cubesmap image from RAM, already uploaded to VRAM
     
diff --git a/examples/web/models/models_heightmap.c b/examples/web/models/models_heightmap.c
index bc51453..e9baa8b 100644
--- a/examples/web/models/models_heightmap.c
+++ b/examples/web/models/models_heightmap.c
@@ -5,7 +5,7 @@
 *   This example has been created using raylib 1.3 (www.raylib.com)
 *   raylib is licensed under an unmodified zlib/libpng license (View raylib.h for details)
 *
-*   Copyright (c) 2015 Ramon Santamaria (@raysan5)
+*   Copyright (c) 2017 Ramon Santamaria (@raysan5)
 *
 ********************************************************************************************/
 
@@ -45,9 +45,11 @@ int main()
 
     Image image = LoadImage("resources/heightmap.png");     // Load heightmap image (RAM)
     texture = LoadTextureFromImage(image);                  // Convert image to texture (VRAM)
-    map = LoadHeightmap(image, (Vector3){ 16, 8, 16 });     // Load heightmap model with defined size
-    map.material.texDiffuse = texture;                      // Set map diffuse texture
-
+    
+    Mesh mesh = GenMeshHeightmap(image, (Vector3){ 16, 8, 16 });    // Generate heightmap mesh (RAM and VRAM)
+    Model model = LoadModelFromMesh(mesh);                          // Load model from generated mesh
+    model.material.maps[MAP_DIFFUSE].texture = texture;             // Set map diffuse texture
+    
     UnloadImage(image);                         // Unload heightmap image from RAM, already uploaded to VRAM
     
     SetCameraMode(camera, CAMERA_ORBITAL);      // Set an orbital camera mode
diff --git a/examples/web/models/models_material_pbr.c b/examples/web/models/models_material_pbr.c
index 9f57634..051384a 100644
--- a/examples/web/models/models_material_pbr.c
+++ b/examples/web/models/models_material_pbr.c
@@ -15,14 +15,37 @@
 #define RLIGHTS_IMPLEMENTATION
 #include "rlights.h"
 
+#if defined(PLATFORM_WEB)
+    #include <emscripten/emscripten.h>
+#endif
+
 #define CUBEMAP_SIZE         512        // Cubemap texture size
 #define IRRADIANCE_SIZE       32        // Irradiance texture size
 #define PREFILTERED_SIZE     256        // Prefiltered HDR environment texture size
 #define BRDF_SIZE            512        // BRDF LUT texture size
 
+//----------------------------------------------------------------------------------
+// Global Variables Definition
+//----------------------------------------------------------------------------------
+int screenWidth = 800;
+int screenHeight = 450;
+
+// Define the camera to look into our 3d world
+Camera camera = {{ 4.0f, 4.0f, 4.0f }, { 0.0f, 0.5f, 0.0f }, { 0.0f, 1.0f, 0.0f }, 45.0f };
+
+Model model;
+
+//----------------------------------------------------------------------------------
+// Module Functions Declaration
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void);     // Update and Draw one frame
+
 // PBR material loading
 static Material LoadMaterialPBR(Color albedo, float metalness, float roughness);
 
+//----------------------------------------------------------------------------------
+// Main Enry Point
+//----------------------------------------------------------------------------------
 int main()
 {
     // Initialization
@@ -33,11 +56,8 @@ int main()
     SetConfigFlags(FLAG_MSAA_4X_HINT);  // Enable Multi Sampling Anti Aliasing 4x (if available)
     InitWindow(screenWidth, screenHeight, "raylib [models] example - pbr material");
 
-    // Define the camera to look into our 3d world
-    Camera camera = {{ 4.0f, 4.0f, 4.0f }, { 0.0f, 0.5f, 0.0f }, { 0.0f, 1.0f, 0.0f }, 45.0f };
-
     // Load model and PBR material
-    Model model = LoadModel("resources/pbr/trooper.obj");
+    model = LoadModel("resources/pbr/trooper.obj");
     model.material = LoadMaterialPBR((Color){ 255, 255, 255, 255 }, 1.0f, 1.0f);
 
     // Define lights attributes
@@ -51,40 +71,18 @@ int main()
     
     SetCameraMode(camera, CAMERA_ORBITAL);  // Set an orbital camera mode
 
-    SetTargetFPS(60);                       // Set our game to run at 60 frames-per-second
+#if defined(PLATFORM_WEB)
+    emscripten_set_main_loop(UpdateDrawFrame, 0, 1);
+#else
+    SetTargetFPS(60);   // Set our game to run at 60 frames-per-second
     //--------------------------------------------------------------------------------------
-
+    
     // Main game loop
-    while (!WindowShouldClose())            // Detect window close button or ESC key
+    while (!WindowShouldClose())    // Detect window close button or ESC key
     {
-        // Update
-        //----------------------------------------------------------------------------------
-        UpdateCamera(&camera);              // Update camera
-        
-        // Send to material PBR shader camera view position
-        float cameraPos[3] = { camera.position.x, camera.position.y, camera.position.z };
-        SetShaderValue(model.material.shader, model.material.shader.locs[LOC_VECTOR_VIEW], cameraPos, 3);
-        //----------------------------------------------------------------------------------
-
-        // Draw
-        //----------------------------------------------------------------------------------
-        BeginDrawing();
-
-            ClearBackground(RAYWHITE);
-
-            Begin3dMode(camera);
-
-                DrawModel(model, Vector3Zero(), 1.0f, WHITE);
-                
-                DrawGrid(10, 1.0f);
-
-            End3dMode();
-
-            DrawFPS(10, 10);
-
-        EndDrawing();
-        //----------------------------------------------------------------------------------
+        UpdateDrawFrame();
     }
+#endif
 
     // De-Initialization
     //--------------------------------------------------------------------------------------
@@ -96,6 +94,40 @@ int main()
     return 0;
 }
 
+//----------------------------------------------------------------------------------
+// Module Functions Definition
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void)
+{
+    // Update
+    //----------------------------------------------------------------------------------
+    UpdateCamera(&camera);              // Update camera
+    
+    // Send to material PBR shader camera view position
+    float cameraPos[3] = { camera.position.x, camera.position.y, camera.position.z };
+    SetShaderValue(model.material.shader, model.material.shader.locs[LOC_VECTOR_VIEW], cameraPos, 3);
+    //----------------------------------------------------------------------------------
+
+    // Draw
+    //----------------------------------------------------------------------------------
+    BeginDrawing();
+
+        ClearBackground(RAYWHITE);
+
+        Begin3dMode(camera);
+
+            DrawModel(model, Vector3Zero(), 1.0f, WHITE);
+            
+            DrawGrid(10, 1.0f);
+
+        End3dMode();
+
+        DrawFPS(10, 10);
+
+    EndDrawing();
+    //----------------------------------------------------------------------------------
+}
+
 // Load PBR material (Supports: ALBEDO, NORMAL, METALNESS, ROUGHNESS, AO, EMMISIVE, HEIGHT maps)
 // NOTE: PBR shader is loaded inside this function
 static Material LoadMaterialPBR(Color albedo, float metalness, float roughness)
diff --git a/examples/web/models/models_mesh_generation.c b/examples/web/models/models_mesh_generation.c
index 7222215..8c2a41a 100644
--- a/examples/web/models/models_mesh_generation.c
+++ b/examples/web/models/models_mesh_generation.c
@@ -11,15 +11,40 @@
 
 #include "raylib.h"
 
-#define NUM_MODELS  7      // We generate 7 parametric 3d shapes
+#if defined(PLATFORM_WEB)
+    #include <emscripten/emscripten.h>
+#endif
 
+#define NUM_MODELS  7       // We generate 7 parametric 3d shapes
+
+//----------------------------------------------------------------------------------
+// Global Variables Definition
+//----------------------------------------------------------------------------------
+int screenWidth = 800;
+int screenHeight = 450;
+
+Model models[NUM_MODELS];
+
+// Define the camera to look into our 3d world
+Camera camera = {{ 5.0f, 5.0f, 5.0f }, { 0.0f, 0.0f, 0.0f }, { 0.0f, 1.0f, 0.0f }, 45.0f };
+
+// Model drawing position
+Vector3 position = { 0.0f, 0.0f, 0.0f };
+
+int currentModel = 0;
+
+//----------------------------------------------------------------------------------
+// Module Functions Declaration
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void);     // Update and Draw one frame
+
+//----------------------------------------------------------------------------------
+// Main Enry Point
+//----------------------------------------------------------------------------------
 int main()
 {
     // Initialization
     //--------------------------------------------------------------------------------------
-    int screenWidth = 800;
-    int screenHeight = 450;
-
     InitWindow(screenWidth, screenHeight, "raylib [models] example - mesh generation");
     
     // We generate a checked image for texturing
@@ -39,70 +64,24 @@ int main()
     
     // Set checked texture as default diffuse component for all models material
     for (int i = 0; i < NUM_MODELS; i++) models[i].material.maps[MAP_DIFFUSE].texture = texture;
-
-    // Define the camera to look into our 3d world
-    Camera camera = {{ 5.0f, 5.0f, 5.0f }, { 0.0f, 0.0f, 0.0f }, { 0.0f, 1.0f, 0.0f }, 45.0f };
-
-    // Model drawing position
-    Vector3 position = { 0.0f, 0.0f, 0.0f };
-    
-    int currentModel = 0;
     
     SetCameraMode(camera, CAMERA_ORBITAL);  // Set a orbital camera mode
 
-    SetTargetFPS(60);                       // Set our game to run at 60 frames-per-second
+#if defined(PLATFORM_WEB)
+    emscripten_set_main_loop(UpdateDrawFrame, 0, 1);
+#else
+    SetTargetFPS(60);   // Set our game to run at 60 frames-per-second
     //--------------------------------------------------------------------------------------
-
+    
     // Main game loop
     while (!WindowShouldClose())    // Detect window close button or ESC key
     {
-        // Update
-        //----------------------------------------------------------------------------------
-        UpdateCamera(&camera);      // Update internal camera and our camera
-        
-        if (IsMouseButtonPressed(MOUSE_LEFT_BUTTON))
-        {
-            currentModel = (currentModel + 1)%NUM_MODELS; // Cycle between the textures
-        }
-        //----------------------------------------------------------------------------------
-
-        // Draw
-        //----------------------------------------------------------------------------------
-        BeginDrawing();
-
-            ClearBackground(RAYWHITE);
-
-            Begin3dMode(camera);
-
-                DrawModel(models[currentModel], position, 1.0f, WHITE);
-
-                DrawGrid(10, 1.0);
-
-            End3dMode();
-            
-            DrawRectangle(30, 400, 310, 30, Fade(SKYBLUE, 0.5f));
-            DrawRectangleLines(30, 400, 310, 30, Fade(DARKBLUE, 0.5f));
-            DrawText("MOUSE LEFT BUTTON to CYCLE PROCEDURAL MODELS", 40, 410, 10, BLUE);
-            
-            switch(currentModel)
-            {
-                case 0: DrawText("PLANE", 680, 10, 20, DARKBLUE); break;
-                case 1: DrawText("CUBE", 680, 10, 20, DARKBLUE); break;
-                case 2: DrawText("SPHERE", 680, 10, 20, DARKBLUE); break;
-                case 3: DrawText("HEMISPHERE", 640, 10, 20, DARKBLUE); break;
-                case 4: DrawText("CYLINDER", 680, 10, 20, DARKBLUE); break;
-                case 5: DrawText("TORUS", 680, 10, 20, DARKBLUE); break;
-                case 6: DrawText("KNOT", 680, 10, 20, DARKBLUE); break;
-                default: break;
-            }
-
-        EndDrawing();
-        //----------------------------------------------------------------------------------
+        UpdateDrawFrame();
     }
+#endif
 
     // De-Initialization
-    //--------------------------------------------------------------------------------------
-    
+    //--------------------------------------------------------------------------------------   
     // Unload models data (GPU VRAM)
     for (int i = 0; i < NUM_MODELS; i++) UnloadModel(models[i]);
     
@@ -110,4 +89,53 @@ int main()
     //--------------------------------------------------------------------------------------
 
     return 0;
+}
+
+//----------------------------------------------------------------------------------
+// Module Functions Definition
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void)
+{
+    // Update
+    //----------------------------------------------------------------------------------
+    UpdateCamera(&camera);      // Update internal camera and our camera
+    
+    if (IsMouseButtonPressed(MOUSE_LEFT_BUTTON))
+    {
+        currentModel = (currentModel + 1)%NUM_MODELS; // Cycle between the textures
+    }
+    //----------------------------------------------------------------------------------
+
+    // Draw
+    //----------------------------------------------------------------------------------
+    BeginDrawing();
+
+        ClearBackground(RAYWHITE);
+
+        Begin3dMode(camera);
+
+            DrawModel(models[currentModel], position, 1.0f, WHITE);
+
+            DrawGrid(10, 1.0);
+
+        End3dMode();
+        
+        DrawRectangle(30, 400, 310, 30, Fade(SKYBLUE, 0.5f));
+        DrawRectangleLines(30, 400, 310, 30, Fade(DARKBLUE, 0.5f));
+        DrawText("MOUSE LEFT BUTTON to CYCLE PROCEDURAL MODELS", 40, 410, 10, BLUE);
+        
+        switch(currentModel)
+        {
+            case 0: DrawText("PLANE", 680, 10, 20, DARKBLUE); break;
+            case 1: DrawText("CUBE", 680, 10, 20, DARKBLUE); break;
+            case 2: DrawText("SPHERE", 680, 10, 20, DARKBLUE); break;
+            case 3: DrawText("HEMISPHERE", 640, 10, 20, DARKBLUE); break;
+            case 4: DrawText("CYLINDER", 680, 10, 20, DARKBLUE); break;
+            case 5: DrawText("TORUS", 680, 10, 20, DARKBLUE); break;
+            case 6: DrawText("KNOT", 680, 10, 20, DARKBLUE); break;
+            default: break;
+        }
+
+    EndDrawing();
+    //----------------------------------------------------------------------------------
 }
\ No newline at end of file
diff --git a/examples/web/models/models_mesh_picking.c b/examples/web/models/models_mesh_picking.c
index 332fa20..d659e2d 100644
--- a/examples/web/models/models_mesh_picking.c
+++ b/examples/web/models/models_mesh_picking.c
@@ -70,9 +70,9 @@ int main()
     camera.up = (Vector3){ 0.0f, 1.6f, 0.0f };                  // Camera up vector (rotation towards target)
     camera.fovy = 45.0f;                                        // Camera field-of-view Y
 
-    tower = LoadModel("resources/tower.obj");     // Load OBJ model
-    texture = LoadTexture("resources/tower.png"); // Load model texture
-    tower.material.texDiffuse = texture;                        // Set model diffuse texture
+    tower = LoadModel("resources/tower.obj");                   // Load OBJ model
+    texture = LoadTexture("resources/tower.png");               // Load model texture
+    tower.material.maps[MAP_DIFFUSE].texture = texture;         // Set model diffuse texture
     
     towerBBox = CalculateBoundingBox(tower.mesh);
 
@@ -143,7 +143,7 @@ void UpdateDrawFrame(void)
         cursorColor = PURPLE;
         hitObjectName = "Triangle";
 
-        bary = VectorBarycenter(nearestHit.hitPosition, ta, tb, tc);
+        bary = Vector3Barycenter(nearestHit.position, ta, tb, tc);
         hitTriangle = true;
     } 
     else hitTriangle = false;
@@ -190,15 +190,15 @@ void UpdateDrawFrame(void)
             // If we hit something, draw the cursor at the hit point
             if (nearestHit.hit) 
             {
-                DrawCube(nearestHit.hitPosition, 0.5, 0.5, 0.5, cursorColor);
-                DrawCubeWires(nearestHit.hitPosition, 0.5, 0.5, 0.5, YELLOW);
+                DrawCube(nearestHit.position, 0.5, 0.5, 0.5, cursorColor);
+                DrawCubeWires(nearestHit.position, 0.5, 0.5, 0.5, YELLOW);
 
                 Vector3 normalEnd;
-                normalEnd.x = nearestHit.hitPosition.x + nearestHit.hitNormal.x;
-                normalEnd.y = nearestHit.hitPosition.y + nearestHit.hitNormal.y;
-                normalEnd.z = nearestHit.hitPosition.z + nearestHit.hitNormal.z;
+                normalEnd.x = nearestHit.position.x + nearestHit.normal.x;
+                normalEnd.y = nearestHit.position.y + nearestHit.normal.y;
+                normalEnd.z = nearestHit.position.z + nearestHit.normal.z;
                 
-                DrawLine3D(nearestHit.hitPosition, normalEnd, YELLOW);
+                DrawLine3D(nearestHit.position, normalEnd, YELLOW);
             }
 
             DrawRay(ray, MAROON);
@@ -217,14 +217,14 @@ void UpdateDrawFrame(void)
             DrawText(FormatText("Distance: %3.2f", nearestHit.distance), 10, ypos, 10, BLACK);
             
             DrawText(FormatText("Hit Pos: %3.2f %3.2f %3.2f", 
-                                nearestHit.hitPosition.x, 
-                                nearestHit.hitPosition.y, 
-                                nearestHit.hitPosition.z), 10, ypos + 15, 10, BLACK);
+                                nearestHit.position.x, 
+                                nearestHit.position.y, 
+                                nearestHit.position.z), 10, ypos + 15, 10, BLACK);
                                 
             DrawText(FormatText("Hit Norm: %3.2f %3.2f %3.2f", 
-                                nearestHit.hitNormal.x, 
-                                nearestHit.hitNormal.y, 
-                                nearestHit.hitNormal.z), 10, ypos + 30, 10, BLACK);
+                                nearestHit.normal.x, 
+                                nearestHit.normal.y, 
+                                nearestHit.normal.z), 10, ypos + 30, 10, BLACK);
 
             if (hitTriangle) DrawText(FormatText("Barycenter: %3.2f %3.2f %3.2f",  bary.x, bary.y, bary.z), 10, ypos + 45, 10, BLACK);
         }
diff --git a/examples/web/models/models_obj_loading.c b/examples/web/models/models_obj_loading.c
index c816372..f58a3ad 100644
--- a/examples/web/models/models_obj_loading.c
+++ b/examples/web/models/models_obj_loading.c
@@ -45,7 +45,7 @@ int main()
 
     dwarf = LoadModel("resources/model/dwarf.obj");               // Load OBJ model
     texture = LoadTexture("resources/model/dwarf_diffuse.png");   // Load model texture
-    dwarf.material.texDiffuse = texture;                          // Set dwarf model diffuse texture
+    dwarf.material.maps[MAP_DIFFUSE].texture = texture;           // Set map diffuse texture
 
 #if defined(PLATFORM_WEB)
     emscripten_set_main_loop(UpdateDrawFrame, 0, 1);
diff --git a/examples/web/models/models_skybox.c b/examples/web/models/models_skybox.c
index 46297e4..8f2bcfd 100644
--- a/examples/web/models/models_skybox.c
+++ b/examples/web/models/models_skybox.c
@@ -11,21 +11,38 @@
 
 #include "raylib.h"
 
+#if defined(PLATFORM_WEB)
+    #include <emscripten/emscripten.h>
+#endif
+
+//----------------------------------------------------------------------------------
+// Global Variables Definition
+//----------------------------------------------------------------------------------
+int screenWidth = 800;
+int screenHeight = 450;
+
+// Define the camera to look into our 3d world
+Camera camera = {{ 1.0f, 1.0f, 1.0f }, { 0.0f, 0.0f, 0.0f }, { 0.0f, 1.0f, 0.0f }, 45.0f };
+
+Model skybox;
+
+//----------------------------------------------------------------------------------
+// Module Functions Declaration
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void);     // Update and Draw one frame
+
+//----------------------------------------------------------------------------------
+// Main Enry Point
+//----------------------------------------------------------------------------------
 int main()
 {
     // Initialization
     //--------------------------------------------------------------------------------------
-    int screenWidth = 800;
-    int screenHeight = 450;
-
     InitWindow(screenWidth, screenHeight, "raylib [models] example - skybox loading and drawing");
 
-    // Define the camera to look into our 3d world
-    Camera camera = {{ 1.0f, 1.0f, 1.0f }, { 0.0f, 0.0f, 0.0f }, { 0.0f, 1.0f, 0.0f }, 45.0f };
-
     // Load skybox model   
     Mesh cube = GenMeshCube(1.0f, 1.0f, 1.0f);
-    Model skybox = LoadModelFromMesh(cube);
+    skybox = LoadModelFromMesh(cube);
     
     // Load skybox shader and set required locations
     // NOTE: Some locations are automatically set at shader loading
@@ -43,36 +60,18 @@ int main()
     
     SetCameraMode(camera, CAMERA_ORBITAL);  // Set an orbital camera mode
 
-    SetTargetFPS(60);                       // Set our game to run at 60 frames-per-second
+#if defined(PLATFORM_WEB)
+    emscripten_set_main_loop(UpdateDrawFrame, 0, 1);
+#else
+    SetTargetFPS(60);   // Set our game to run at 60 frames-per-second
     //--------------------------------------------------------------------------------------
-
+    
     // Main game loop
-    while (!WindowShouldClose())            // Detect window close button or ESC key
+    while (!WindowShouldClose())    // Detect window close button or ESC key
     {
-        // Update
-        //----------------------------------------------------------------------------------
-        UpdateCamera(&camera);              // Update camera
-        //----------------------------------------------------------------------------------
-
-        // Draw
-        //----------------------------------------------------------------------------------
-        BeginDrawing();
-
-            ClearBackground(RAYWHITE);
-
-            Begin3dMode(camera);
-
-                DrawModel(skybox, Vector3Zero(), 1.0f, WHITE);
-                
-                DrawGrid(10, 1.0f);
-
-            End3dMode();
-
-            DrawFPS(10, 10);
-
-        EndDrawing();
-        //----------------------------------------------------------------------------------
+        UpdateDrawFrame();
     }
+#endif
 
     // De-Initialization
     //--------------------------------------------------------------------------------------
@@ -83,3 +82,33 @@ int main()
 
     return 0;
 }
+
+//----------------------------------------------------------------------------------
+// Module Functions Definition
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void)
+{
+    // Update
+    //----------------------------------------------------------------------------------
+    UpdateCamera(&camera);              // Update camera
+    //----------------------------------------------------------------------------------
+
+    // Draw
+    //----------------------------------------------------------------------------------
+    BeginDrawing();
+
+        ClearBackground(RAYWHITE);
+
+        Begin3dMode(camera);
+
+            DrawModel(skybox, Vector3Zero(), 1.0f, WHITE);
+            
+            DrawGrid(10, 1.0f);
+
+        End3dMode();
+
+        DrawFPS(10, 10);
+
+    EndDrawing();
+    //----------------------------------------------------------------------------------
+}
diff --git a/examples/web/models/models_yaw_pitch_roll.c b/examples/web/models/models_yaw_pitch_roll.c
index 2bae2bf..33fef31 100644
--- a/examples/web/models/models_yaw_pitch_roll.c
+++ b/examples/web/models/models_yaw_pitch_roll.c
@@ -18,8 +18,38 @@
 // Draw angle gauge controls
 void DrawAngleGauge(Texture2D angleGauge, int x, int y, float angle, char title[], Color color);
 
+#if defined(PLATFORM_WEB)
+    #include <emscripten/emscripten.h>
+#endif
+
+//----------------------------------------------------------------------------------
+// Global Variables Definition
+//----------------------------------------------------------------------------------
+int screenWidth = 800;
+int screenHeight = 450;
+
+// Define our custom camera to look into our 3d world
+Camera camera = { 0 };
+
+Texture2D texAngleGauge; 
+Texture2D texBackground;
+Texture2D texPitch;   
+Texture2D texPlane;
+
+RenderTexture2D framebuffer;
+Model model;
+
+float pitch = 0.0f;
+float roll = 0.0f;
+float yaw = 0.0f;
+
 //----------------------------------------------------------------------------------
-// Main entry point
+// Module Functions Declaration
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void);     // Update and Draw one frame
+
+//----------------------------------------------------------------------------------
+// Main Enry Point
 //----------------------------------------------------------------------------------
 int main()
 {
@@ -30,139 +60,36 @@ int main()
 
     InitWindow(screenWidth, screenHeight, "raylib [models] example - plane rotations (yaw, pitch, roll)");
 
-    Texture2D texAngleGauge = LoadTexture("resources/angle_gauge.png"); 
-    Texture2D texBackground = LoadTexture("resources/background.png");
-    Texture2D texPitch = LoadTexture("resources/pitch.png");   
-    Texture2D texPlane = LoadTexture("resources/plane.png");
+    texAngleGauge = LoadTexture("resources/angle_gauge.png"); 
+    texBackground = LoadTexture("resources/background.png");
+    texPitch = LoadTexture("resources/pitch.png");   
+    texPlane = LoadTexture("resources/plane.png");
 
-    RenderTexture2D framebuffer = LoadRenderTexture(192, 192);
+    framebuffer = LoadRenderTexture(192, 192);
     
     // Model loading
-    Model model = LoadModel("resources/plane.obj");      // Load OBJ model
+    model = LoadModel("resources/plane.obj");      // Load OBJ model
     model.material.maps[MAP_DIFFUSE].texture = LoadTexture("resources/plane_diffuse.png"); // Set map diffuse texture
     
     GenTextureMipmaps(&model.material.maps[MAP_DIFFUSE].texture);
-    
-    Camera camera = { 0 };
+
     camera.position = (Vector3){ 0.0f, 60.0f, -120.0f };// Camera position perspective
     camera.target = (Vector3){ 0.0f, 12.0f, 0.0f };     // Camera looking at point
     camera.up = (Vector3){ 0.0f, 1.0f, 0.0f };          // Camera up vector (rotation towards target)
     camera.fovy = 30.0f;                                // Camera field-of-view Y
-    
-    float pitch = 0.0f;
-    float roll = 0.0f;
-    float yaw = 0.0f;
 
-    SetTargetFPS(60);
+#if defined(PLATFORM_WEB)
+    emscripten_set_main_loop(UpdateDrawFrame, 0, 1);
+#else
+    SetTargetFPS(60);   // Set our game to run at 60 frames-per-second
     //--------------------------------------------------------------------------------------
-
-
+    
+    // Main game loop
     while (!WindowShouldClose())    // Detect window close button or ESC key
     {
-        // Update
-        //----------------------------------------------------------------------------------
-        
-        // Plane roll (x-axis) controls
-        if (IsKeyDown(KEY_LEFT)) roll += 1.0f;
-        else if (IsKeyDown(KEY_RIGHT)) roll -= 1.0f;
-        else
-        {
-            if (roll > 0.0f) roll -= 0.5f;
-            else if (roll < 0.0f) roll += 0.5f;
-        }
-        
-        // Plane yaw (y-axis) controls
-        if (IsKeyDown(KEY_S)) yaw += 1.0f;
-        else if (IsKeyDown(KEY_A)) yaw -= 1.0f;
-        else
-        {
-            if (yaw > 0.0f) yaw -= 0.5f;
-            else if (yaw < 0.0f) yaw += 0.5f;
-        }
-        
-        // Plane pitch (z-axis) controls
-        if (IsKeyDown(KEY_DOWN)) pitch += 0.6f;
-        else if (IsKeyDown(KEY_UP)) pitch -= 0.6f;
-        else
-        {
-            if (pitch > 0.3f) pitch -= 0.3f;
-            else if (pitch < -0.3f) pitch += 0.3f;
-        }
-        
-        // Wraps the phase of an angle to fit between -180 and +180 degrees
-        int pitchOffset = pitch;
-        while (pitchOffset > 180) pitchOffset -= 360;
-        while (pitchOffset < -180) pitchOffset += 360;
-        pitchOffset *= 10;
-
-        Matrix transform = MatrixIdentity();
-    
-        transform = MatrixMultiply(transform, MatrixRotateZ(DEG2RAD*roll));
-        transform = MatrixMultiply(transform, MatrixRotateX(DEG2RAD*pitch));
-        transform = MatrixMultiply(transform, MatrixRotateY(DEG2RAD*yaw));
-        
-        model.transform = transform;
-        //----------------------------------------------------------------------------------
-
-        // Draw
-        //----------------------------------------------------------------------------------
-        BeginDrawing();
-        
-            ClearBackground(RAYWHITE);
-        
-            // Draw framebuffer texture (Ahrs Display)
-            int centerX = framebuffer.texture.width/2;
-            int centerY = framebuffer.texture.height/2;
-            float scaleFactor = 0.5f;
-
-            BeginTextureMode(framebuffer);
-
-                BeginBlendMode(BLEND_ALPHA);
-
-                DrawTexturePro(texBackground, (Rectangle){0,0,texBackground.width, texBackground.height},
-                               (Rectangle){ centerX, centerY, texBackground.width*scaleFactor, texBackground.height*scaleFactor},
-                               (Vector2){texBackground.width/2*scaleFactor, texBackground.height/2*scaleFactor + pitchOffset*scaleFactor}, roll, WHITE);
-
-                DrawTexturePro(texPitch, (Rectangle){ 0, 0, texPitch.width, texPitch.height },
-                               (Rectangle){ centerX, centerY, texPitch.width*scaleFactor, texPitch.height*scaleFactor },
-                               (Vector2){ texPitch.width/2*scaleFactor, texPitch.height/2*scaleFactor + pitchOffset*scaleFactor }, roll, WHITE);
-            
-                DrawTexturePro(texPlane, (Rectangle){0,0,texPlane.width, texPlane.height },
-                               (Rectangle){ centerX, centerY, texPlane.width*scaleFactor, texPlane.height*scaleFactor }, 
-                               (Vector2){texPlane.width/2*scaleFactor, texPlane.height/2*scaleFactor }, 0, WHITE);
-                                
-                EndBlendMode();
-
-            EndTextureMode();
-
-            // Draw 3D model (recomended to draw 3D always before 2D)
-            Begin3dMode(camera);
-
-                DrawModel(model, (Vector3){ 0, 6.0f, 0 }, 1.0f, WHITE);   // Draw 3d model with texture
-                DrawGrid(10, 10.0f);
-
-            End3dMode();
-
-            // Draw 2D GUI stuff
-            DrawAngleGauge(texAngleGauge, 80, 80, roll, "roll", RED);
-            DrawAngleGauge(texAngleGauge, 190, 80, pitch, "pitch", GREEN);
-            DrawAngleGauge(texAngleGauge, 300, 80, yaw, "yaw", SKYBLUE);
-            
-            DrawRectangle(30, 360, 260, 70, Fade(SKYBLUE, 0.5f));
-            DrawRectangleLines(30, 360, 260, 70, Fade(DARKBLUE, 0.5f));
-            DrawText("Pitch controlled with: KEY_UP / KEY_DOWN", 40, 370, 10, DARKGRAY);
-            DrawText("Roll controlled with: KEY_LEFT / KEY_RIGHT", 40, 390, 10, DARKGRAY);
-            DrawText("Yaw controlled with: KEY_A / KEY_S", 40, 410, 10, DARKGRAY);
-
-            // Draw framebuffer texture
-            DrawTextureRec(framebuffer.texture, (Rectangle){ 0, 0, framebuffer.texture.width, -framebuffer.texture.height }, 
-                           (Vector2){ screenWidth - framebuffer.texture.width - 20, 20 }, Fade(WHITE, 0.8f));
-            
-            DrawRectangleLines(screenWidth - framebuffer.texture.width - 20, 20, framebuffer.texture.width, framebuffer.texture.height, DARKGRAY);
-        
-        EndDrawing();
-        //----------------------------------------------------------------------------------
+        UpdateDrawFrame();
     }
+#endif
 
     // De-Initialization
     //--------------------------------------------------------------------------------------
@@ -183,6 +110,115 @@ int main()
     return 0;
 }
 
+//----------------------------------------------------------------------------------
+// Module Functions Definition
+//----------------------------------------------------------------------------------
+void UpdateDrawFrame(void)
+{
+    // Update
+    //----------------------------------------------------------------------------------
+    // Plane roll (x-axis) controls
+    if (IsKeyDown(KEY_LEFT)) roll += 1.0f;
+    else if (IsKeyDown(KEY_RIGHT)) roll -= 1.0f;
+    else
+    {
+        if (roll > 0.0f) roll -= 0.5f;
+        else if (roll < 0.0f) roll += 0.5f;
+    }
+    
+    // Plane yaw (y-axis) controls
+    if (IsKeyDown(KEY_S)) yaw += 1.0f;
+    else if (IsKeyDown(KEY_A)) yaw -= 1.0f;
+    else
+    {
+        if (yaw > 0.0f) yaw -= 0.5f;
+        else if (yaw < 0.0f) yaw += 0.5f;
+    }
+    
+    // Plane pitch (z-axis) controls
+    if (IsKeyDown(KEY_DOWN)) pitch += 0.6f;
+    else if (IsKeyDown(KEY_UP)) pitch -= 0.6f;
+    else
+    {
+        if (pitch > 0.3f) pitch -= 0.3f;
+        else if (pitch < -0.3f) pitch += 0.3f;
+    }
+    
+    // Wraps the phase of an angle to fit between -180 and +180 degrees
+    int pitchOffset = pitch;
+    while (pitchOffset > 180) pitchOffset -= 360;
+    while (pitchOffset < -180) pitchOffset += 360;
+    pitchOffset *= 10;
+
+    Matrix transform = MatrixIdentity();
+
+    transform = MatrixMultiply(transform, MatrixRotateZ(DEG2RAD*roll));
+    transform = MatrixMultiply(transform, MatrixRotateX(DEG2RAD*pitch));
+    transform = MatrixMultiply(transform, MatrixRotateY(DEG2RAD*yaw));
+    
+    model.transform = transform;
+    //----------------------------------------------------------------------------------
+
+    // Draw
+    //----------------------------------------------------------------------------------
+    BeginDrawing();
+    
+        ClearBackground(RAYWHITE);
+    
+        // Draw framebuffer texture (Ahrs Display)
+        int centerX = framebuffer.texture.width/2;
+        int centerY = framebuffer.texture.height/2;
+        float scaleFactor = 0.5f;
+
+        BeginTextureMode(framebuffer);
+
+            BeginBlendMode(BLEND_ALPHA);
+
+            DrawTexturePro(texBackground, (Rectangle){0,0,texBackground.width, texBackground.height},
+                           (Rectangle){ centerX, centerY, texBackground.width*scaleFactor, texBackground.height*scaleFactor},
+                           (Vector2){texBackground.width/2*scaleFactor, texBackground.height/2*scaleFactor + pitchOffset*scaleFactor}, roll, WHITE);
+
+            DrawTexturePro(texPitch, (Rectangle){ 0, 0, texPitch.width, texPitch.height },
+                           (Rectangle){ centerX, centerY, texPitch.width*scaleFactor, texPitch.height*scaleFactor },
+                           (Vector2){ texPitch.width/2*scaleFactor, texPitch.height/2*scaleFactor + pitchOffset*scaleFactor }, roll, WHITE);
+        
+            DrawTexturePro(texPlane, (Rectangle){0,0,texPlane.width, texPlane.height },
+                           (Rectangle){ centerX, centerY, texPlane.width*scaleFactor, texPlane.height*scaleFactor }, 
+                           (Vector2){texPlane.width/2*scaleFactor, texPlane.height/2*scaleFactor }, 0, WHITE);
+                            
+            EndBlendMode();
+
+        EndTextureMode();
+
+        // Draw 3D model (recomended to draw 3D always before 2D)
+        Begin3dMode(camera);
+
+            DrawModel(model, (Vector3){ 0, 6.0f, 0 }, 1.0f, WHITE);   // Draw 3d model with texture
+            DrawGrid(10, 10.0f);
+
+        End3dMode();
+
+        // Draw 2D GUI stuff
+        DrawAngleGauge(texAngleGauge, 80, 80, roll, "roll", RED);
+        DrawAngleGauge(texAngleGauge, 190, 80, pitch, "pitch", GREEN);
+        DrawAngleGauge(texAngleGauge, 300, 80, yaw, "yaw", SKYBLUE);
+        
+        DrawRectangle(30, 360, 260, 70, Fade(SKYBLUE, 0.5f));
+        DrawRectangleLines(30, 360, 260, 70, Fade(DARKBLUE, 0.5f));
+        DrawText("Pitch controlled with: KEY_UP / KEY_DOWN", 40, 370, 10, DARKGRAY);
+        DrawText("Roll controlled with: KEY_LEFT / KEY_RIGHT", 40, 390, 10, DARKGRAY);
+        DrawText("Yaw controlled with: KEY_A / KEY_S", 40, 410, 10, DARKGRAY);
+
+        // Draw framebuffer texture
+        DrawTextureRec(framebuffer.texture, (Rectangle){ 0, 0, framebuffer.texture.width, -framebuffer.texture.height }, 
+                       (Vector2){ screenWidth - framebuffer.texture.width - 20, 20 }, Fade(WHITE, 0.8f));
+        
+        DrawRectangleLines(screenWidth - framebuffer.texture.width - 20, 20, framebuffer.texture.width, framebuffer.texture.height, DARKGRAY);
+    
+    EndDrawing();
+    //----------------------------------------------------------------------------------
+}
+
 // Draw angle gauge controls
 void DrawAngleGauge(Texture2D angleGauge, int x, int y, float angle, char title[], Color color)
 {
@@ -193,6 +229,6 @@ void DrawAngleGauge(Texture2D angleGauge, int x, int y, float angle, char title[
 
     DrawTexturePro(angleGauge, srcRec, dstRec, origin, angle, color);
   
-    DrawText(FormatText("%5.1f�", angle), x - MeasureText(FormatText("%5.1f�", angle), textSize) / 2, y + 10, textSize, DARKGRAY); 
+    DrawText(FormatText("%5.1f", angle), x - MeasureText(FormatText("%5.1f", angle), textSize) / 2, y + 10, textSize, DARKGRAY); 
     DrawText(title, x - MeasureText(title, textSize) / 2, y + 60, textSize, DARKGRAY);  
 }
\ No newline at end of file
diff --git a/examples/web/shaders/shaders_shapes_textures.c b/examples/web/shaders/shaders_shapes_textures.c
index 4e3475d..8295f30 100644
--- a/examples/web/shaders/shaders_shapes_textures.c
+++ b/examples/web/shaders/shaders_shapes_textures.c
@@ -108,7 +108,7 @@ void UpdateDrawFrame(void)
             DrawText("USING CUSTOM SHADER", 190, 40, 10, RED);
 
             DrawRectangle(250 - 60, 90, 120, 60, RED);
-            DrawRectangleGradient(250 - 90, 170, 180, 130, MAROON, GOLD);
+            DrawRectangleGradientH(250 - 90, 170, 180, 130, MAROON, GOLD);
             DrawRectangleLines(250 - 40, 320, 80, 60, ORANGE);
 
         // Activate our default shader for next drawings
diff --git a/examples/web/shapes/shapes_basic_shapes.c b/examples/web/shapes/shapes_basic_shapes.c
index b4fe0f3..a5e907d 100644
--- a/examples/web/shapes/shapes_basic_shapes.c
+++ b/examples/web/shapes/shapes_basic_shapes.c
@@ -80,7 +80,7 @@ void UpdateDrawFrame(void)
         DrawCircleLines(screenWidth/4, 340, 80, DARKBLUE);
 
         DrawRectangle(screenWidth/4*2 - 60, 100, 120, 60, RED);
-        DrawRectangleGradient(screenWidth/4*2 - 90, 170, 180, 130, MAROON, GOLD);
+        DrawRectangleGradientH(screenWidth/4*2 - 90, 170, 180, 130, MAROON, GOLD);
         DrawRectangleLines(screenWidth/4*2 - 40, 320, 80, 60, ORANGE);
 
         DrawTriangle((Vector2){screenWidth/4*3, 80},