added bezier example and documentation updated

README.md

@@ -12,20 +12,17 @@ Open your game.project file and in the dependencies field under project add:
 >https://github.com/AGulev/drawpixels/archive/master.zip
 
 ## Example
-![screenshot](https://user-images.githubusercontent.com/2209596/38828895-1dc0802e-41c0-11e8-87c1-20fd65cb017f.jpg)
+![screenshot](https://user-images.githubusercontent.com/2209596/45321275-8c8d9b80-b54d-11e8-8885-05d623973d3b.jpg)
 
 Main code example is [here](https://github.com/AGulev/drawpixels/blob/master/example/canvas.script)
 
 ## Lua API
 First of all you need to create a table with a buffer information that contain next fields:
 
-`buffer` - buffer
-
-`width` - buffer width, same as your texture width
-
-`height` - buffer height, same as your texture height
-
-`channels` - 3 for rgb, 4 for rgba
+`buffer` - buffer<br />
+`width` - buffer width, same as your texture width<br />
+`height` - buffer height, same as your texture height<br />
+`channels` - 3 for rgb, 4 for rgba<br />
 
 For example:
 ```lua
@@ -46,154 +43,115 @@ Then when you have a buffer info, you can use next methods:
 #### drawpixels.circle(buffer_info, pox_x, pox_y, diameter, red, green, blue, alpha)
 Method for drawing circle:
 
-`buffer_info` - buffer information
-
-`pox_x` - x position center of the circle
-
-`pox_y` - y position center of the circle
-
-`diameter` - diameter of the circle
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`buffer_info` - buffer information<br />
+`pox_x` - x position center of the circle<br />
+`pox_y` - y position center of the circle<br />
+`diameter` - diameter of the circle<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 #### drawpixels.filled_circle(buffer_info, pos_x, pos_y, diameter, red, green, blue, alpha)
 Method for drawing filled circle:
 
-`buffer_info` - buffer information
-
-`pox_x` - x position center of the circle
-
-`pox_y` - y position center of the circle
-
-`diameter` - diameter of the circle
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`buffer_info` - buffer information<br />
+`pox_x` - x position center of the circle<br />
+`pox_y` - y position center of the circle<br />
+`diameter` - diameter of the circle<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 #### drawpixels.rect(buffer_info, pos_x, pos_y, rect_width, rect_height, red, green, blue, alpha)
 Method for drawing rectangle:
 
-`buffer_info` - buffer information
-
-`pox_x` - x position center of the rectangle
-
-`pox_y` - y position center of the rectangle
-
-`rect_width` - rectangle width
-
-`rect_height` - rectangle height
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`buffer_info` - buffer information<br />
+`pox_x` - x position center of the rectangle<br />
+`pox_y` - y position center of the rectangle<br />
+`rect_width` - rectangle width<br />
+`rect_height` - rectangle height<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 #### drawpixels.filled_rect(buffer_info, pos_x, pos_y, rect_width, rect_height, red, green, blue, alpha, angle)
 Method for drawing filled rectangle:
 
-`buffer_info` - buffer information
-
-`pox_x` - x position center of the rectangle
-
-`pox_y` - y position center of the rectangle
-
-`rect_width` - rectangle width
-
-`rect_height` - rectangle height
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
-
-`angle` - rotation angle in degrees. Optional.
+`buffer_info` - buffer information<br />
+`pox_x` - x position center of the rectangle<br />
+`pox_y` - y position center of the rectangle<br />
+`rect_width` - rectangle width<br />
+`rect_height` - rectangle height<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
+`angle` - rotation angle in degrees. Optional.<br />
 
 #### drawpixels.fill(buffer_info, red, green, blue, alpha)
 Fill buffer with the color:
 
-`buffer_info` - buffer information
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`buffer_info` - buffer information<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 #### drawpixels.line(buffer_info, x0, y0, x1, y1, red, green, blue, alpha)
 Draw a line between two points:
 
-`buffer_info` - buffer information
-
-`x0` - x position of one end of the line
-
-`y0` - y position of one end of the line
-
-`x1` - x position of the other end of the line
-
-`y1` - y position of the other end of the line
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`buffer_info` - buffer information<br />
+`x0` - x position of one end of the line<br />
+`y0` - y position of one end of the line<br />
+`x1` - x position of the other end of the line<br />
+`y1` - y position of the other end of the line<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 #### drawpixels.pixel(buffer_info, x, y, red, green, blue, alpha)
 Draw a pixel:
 
-`buffer_info` - buffer information
-
-`x` - x position of pixel
-
-`y` - y position of pixel
-
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`buffer_info` - buffer information<br />
+`x` - x position of pixel<br />
+`y` - y position of pixel<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 #### drawpixels.color(buffer_info, x, y)
 Read color from a position in the buffer:
 
-`buffer_info` - buffer information
-
-`x` - x position to get color from
-
-`y` - y position to get color from
+`buffer_info` - buffer information<br />
+`x` - x position to get color from<br />
+`y` - y position to get color from<br />
 
 RETURNS:
 
-`red` - red channel of the color 0..255
-
-`green` - green channel of the color 0..255
-
-`blue` - blue channel of the color 0..255
-
-`alpha` - alpha channel 0..255. Optional parameter for rgba textures
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
+
+#### drawpixels.bezier(buffer_info, x0, y0, xc, yc, x1, y1, red, green, blue, alpha)
+Draw a bezier line between two points and one control point:
+
+`buffer_info` - buffer information<br />
+`x0` - x position of the first point<br />
+`y0` - y position of the first point<br />
+`xc` - x position of the control point<br />
+`yc` - y position of the control point<br />
+`x1` - x position of the second point<br />
+`y1` - y position of the second point<br />
+`red` - red channel of the color 0..255<br />
+`green` - green channel of the color 0..255<br />
+`blue` - blue channel of the color 0..255<br />
+`alpha` - alpha channel 0..255. Optional parameter for rgba textures<br />
 
 --------
 

example/canvas.script

@@ -1,5 +1,4 @@
 function init(self)
-  msg.post(".", "acquire_input_focus")
   msg.post("@render:", "clear_color", {color = vmath.vector4(1, 1, 1, 1)})
   -- size of texture when scaled to nearest power of two
   local width = 1024
@@ -49,11 +48,8 @@ function on_message(self, message_id, message, sender)
     end
   elseif message_id == hash("change_tool") then
     self.current_tool = message.tool
-    if message.tool == "line" then
-      self.last_pos = 1
-    else
-      self.last_pos = nil
-    end
+    self.bezier_dots = {}
+    self.last_pos = {}
   elseif message_id == hash("clear") then
     drawpixels.fill(self.buffer_info, 0, 0, 0, 0)
     self.dirty = true
@@ -76,11 +72,21 @@ function on_input(self, action_id, action)
       self.touch_pos = pos
     elseif action.released then
       self.drawing = false
-      if self.last_pos and self.last_pos == 1 then
-        self.last_pos = {}
-      elseif self.last_pos then
+      if not self.last_pos.x then
         self.last_pos.x = pos.x
         self.last_pos.y = pos.y
+      else
+        self.last_pos.x = nil
+      end
+      if self.current_tool == "bezier" then
+        if #self.bezier_dots == 2 then
+          self.bezier_dots = {}
+        else
+          local bz = {}
+          bz.x = pos.x
+          bz.y = pos.y
+          self.bezier_dots[#self.bezier_dots + 1] = bz
+        end
       end
     end
     if self.drawing then
@@ -107,7 +113,7 @@ function on_input(self, action_id, action)
           self.current_color = bytes_to_color_vector(r, g, b, a)
         elseif self.current_tool == "circle" then
           drawpixels.circle(self.buffer_info, self.touch_pos.x, self.touch_pos.y, 40, r, g, b, a)
-        elseif self.current_tool == "line" and self.last_pos and next(self.last_pos) then
+        elseif self.current_tool == "line" and self.last_pos.x then
           drawpixels.line(self.buffer_info, self.last_pos.x, self.last_pos.y, self.touch_pos.x, self.touch_pos.y, r, g, b, a)
         elseif self.current_tool == "filled_circle" then
           drawpixels.filled_circle(self.buffer_info, self.touch_pos.x, self.touch_pos.y, 40, r, g, b, a)
@@ -119,6 +125,9 @@ function on_input(self, action_id, action)
           drawpixels.rect(self.buffer_info, self.touch_pos.x, self.touch_pos.y, 40, 40, 0, 0, 0, 0)
         elseif self.current_tool == "rotated_rect" then
           drawpixels.filled_rect(self.buffer_info, self.touch_pos.x, self.touch_pos.y, 60, 40, r, g, b, a, self.rotation)
+        elseif self.current_tool == "bezier" and #self.bezier_dots == 2 then
+          local pos = self.bezier_dots
+          drawpixels.bezier(self.buffer_info, pos[1].x, pos[1].y, self.touch_pos.x, self.touch_pos.y, pos[2].x, pos[2].y, r, g, b, a)
         end
         self.dirty = true
         self.touch_pos = self.touch_pos - dir

example/draw_pixels.atlas

@@ -34,6 +34,9 @@ images {
 images {
   image: "/example/images/gimp-tool-color-picker.png"
 }
+images {
+  image: "/example/images/bezier.png"
+}
 margin: 0
 extrude_borders: 2
 inner_padding: 0