# Browser

Just try to think the webpage as a console or linux terminal.

We just have to implement some text input and output and clear methods.

Plus some set\_pixel() like pixel related functions.

Plus some touch\_callback\_functions().

Then we'll get a fresh new browser.

Of cause, for this new browser, we have to use "hero programming language" as the official programming language.

> Consider use 'threejs' and 'ammo.js' to create a 'vue.js'-like 3D and 2D front-end framework.

## Core functions

```
def print_chars(text: str):
    ...
def clear_screen():
    ...
def get_char_or_key_input() -> tuple[str, int]:
    # return char, key_int_id
    ...




def get_screen_resolution() -> tuple[int, int]:
    # return width, height
    ...

def draw_pixel(x:int, y:int, rgba_color: tuple[int, int, int, int]):
    ...

def draw_screen(pixel_2d_array: list[list[tuple[int, int, int, int]]], x_start:int=0, y_start:int=0):
    ...




def listen_touch_event(callback_function: Any):
    """
    It receives functions like:
        def callback_function(touch_event):
            print(touch_event.touches[0]?.event_name) # touch_start, touch_move, touch_end, touch_cancel
            # touch_start - fired when a touch point is placed on the touch surface.
            # touch_move - fired when a touch point is moved along the touch surface.
            # touch_end - fired when a touch point is removed from the touch surface.
            # touch_cancel - fired when a touch point has been disrupted in an implementation-specific manner (for example, too many touch points are created).

            print(touch_event.touches[0]?.x)
            print(touch_event.touches[0]?.y)
    """
    ...
    

"""
# The listen_touch_event function is mainly for implementing the following functions:

## Tap

### on_tap_down
A pointer that might cause a tap has contacted the screen at a particular location.

### on_tap_up
A pointer that triggers a tap has stopped contacting the screen at a particular location.

### on_tap
The pointer that previously triggered the onTapDown has also triggered onTapUp which ends up causing a tap.

### on_tap_cancel
The pointer that previously triggered the onTapDown won’t end up causing a tap.

## Double tap

### on_double_tap
The user has tapped the screen at the same location twice in quick succession.

## Long press

### on_long_press
A pointer has remained in contact with the screen at the same location for a long period of time.

## Vertical drag

### on_vertical_drag_start
A pointer has contacted the screen and might begin to move vertically.

### on_vertical_drag_update
A pointer that is in contact with the screen and moving vertically has moved in the vertical direction.

### on_vertical_drag_end
A pointer that was previously in contact with the screen and moving vertically is no longer in contact with the screen and was moving at a specific velocity when it stopped contacting the screen.

## Horizontal drag

### on_horizontal_drag_start
A pointer has contacted the screen and might begin to move horizontally.

### on_horizontal_drag_update
A pointer that is in contact with the screen and moving horizontally has moved in the horizontal direction.

### on_horizontal_drag_end
A pointer that was previously in contact with the screen and moving horizontally is no longer in contact with the screen and was moving at a specific velocity when it stopped contacting the screen.

## Pan

### on_pan_start
A pointer has contacted the screen and might begin to move horizontally or vertically. This callback crashes if onHorizontalDragStart or onVerticalDragStart is set.

### on_pan_update
A pointer that is in contact with the screen and is moving in the vertical or horizontal direction. This callback crashes if onHorizontalDragUpdate or onVerticalDragUpdate is set.

### on_pan_end
A pointer that was previously in contact with screen is no longer in contact with the screen and is moving at a specific velocity when it stopped contacting the screen. This callback crashes if onHorizontalDragEnd or onVerticalDragEnd is set.
"""




def play_audio(audio_data: str):
    # audio_data is a base64 mp3 audio string
    ...

```

## More Infomation

### Handle the right page

When design this browser, we could consider the compatibility issue.

When a html webpage start with `<!-- use hero programming language -->`, we do special operations for it. We use hero programming language to handle the webpage than javascript.

If the html page does not start with that tag, then we handle it as normal webpage.

### Recommand developer to use terminal style User Interface as much as possible

Because I do not like to use mouse, I like to use keyboard.

> We could have a built-in vim-like plugin to help user click clickable buttons/input\_box/links with just keyboard.

### Has built\_in free offline webpage application as additions for user

For example, `it has alternatives` or `yingshaoxo knowledge bot` or `local gitbook` or `vscode in broswer` .
