yewang / besogo Goto Github PK

View Code? Open in Web Editor NEW

96.0 9.0 26.0 3.29 MB

Embeddable SGF editor/viewer for the game of Go (aka Weiqi, Baduk)

Home Page: http://yewang.github.io/besogo/

License: MIT License

CSS 5.21% JavaScript 87.01% HTML 7.60% Shell 0.17%

sgf igo baduk sgf-editor weiqi go goban javascript boardgame board-game

besogo's People

Contributors

Stargazers

Watchers

besogo's Issues

Support move/position annotations

Add display and editing of move and position annotations (e.g., blunder, tesuji, interesting, even, good for black, etc.).

SGF properties: BM, DO, IT, TE, DM, GB, GW, HO, UC

Get territory/total points

Hi, I see the captures are counted but I cannot find anyway to get the total points / the territory of a player. However, I'm guessing the functionality must be there somewhere... isn't it?

Thanks!

Responsiveness Design

Finish redesigning the responsive widget resizing behavior

Annotate move tree

Mark the presence of comments, markup, or other annotations in the move tree.

Paste Tool

Add paste tool to allow transplanting cut branches

Hide last move marker option

Add an option for hiding the last move marker

Tool for Reordering Variations

Add tool for changing the order of variations

Board viewport options

Add option for restricting the view of the board to a given box or an automatic bounding box of all stones and markup in the SGF file.

Decoupling sgf interpretation from board visualization

I have a very simple problem: I want to take an SGF and a move number, and get a matrix with the stones at that point. I've been looking around for a while but I haven't found anything yet (sgfutils doesn't have anything like that; there doesn't seem to be anything in javascript or python neither). So I think this is something that, maybe, besogo could do?

More specifically, I think parsing an SGF should generate a game tree, and each element of that tree should have an abstract description of the game at that point (stone positions, whose turn is it, captures, ko).

This could go hand in hand with #12, meaning that you could expose both the function to show the board, but also a "low-level" function for doing this. That way anyone could use this to visualize the board however they want. A contrived example: you could use this to make a command-line go player in node.js. Or you could use this to make your own HTML/JS board component, using besogo as the interpreter but doing the UI in some other way.

What do you think? Is this something worth doing?

Is there an API?

Is it possible to control the board trough javascript code instead of the visual panels without changing the library code itself?
Something like besogo.playMove(1, 2, 0);

Jump to move

Shift-click should jump to the move at that location in the tree

Export Board Position as PNG or SVG

Add a tool to take a screenshot of the board position in either PNG or SVG format

Besogo ignores PL

I'm testing with this simple SGF:

(;GM[1]FF[4]CA[UTF-8]AP[Sabaki:0.52.0]KM[6.5]SZ[19]DT[2022-07-20]PL[W])

There are no stones and no moves yet, but PL[W] tells that the next to make a move is white.

Besogo ignores the PL and behaves like it's black's turn:

Here's a complete example:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BesoGo</title>

<link rel="icon" type="image/png" href="icon32.png" sizes="32x32">
<link rel="icon" type="image/png" href="icon152.png" sizes="152x152">
<link rel="icon" type="image/png" href="icon192.png" sizes="192x192">
<link rel="icon" type="image/png" href="icon512.png" sizes="512x512">
<link rel="apple-touch-icon-precomposed" href="icon152.png" sizes="152x152">
<link rel="apple-touch-icon-precomposed" href="icon192.png" sizes="192x192">
<link rel="icon" href="icon.svg" sizes="any" type="image/svg+xml">
<link rel="manifest" href="manifest.json" />
<meta name="description" content="BesoGo: a web-based SGF Editor">
<meta property="og:url" content="https://yewang.github.io/besogo/testing.html">
<meta property="og:type" content="website">
<meta property="og:title" content="BesoGo">
<meta property="og:description" content="BesoGo: a web-based SGF Editor">
<meta property="og:image" content="https://yewang.github.io/besogo/icon512.png">

<link rel="stylesheet" type="text/css" href="css/besogo.css">
<link rel="stylesheet" type="text/css" href="css/besogo-fill.css">
<link rel="stylesheet" type="text/css" href="css/board-flat.css">

<script src="js/besogo.js"></script>
<script src="js/editor.js"></script>
<script src="js/gameRoot.js"></script>
<script src="js/svgUtil.js"></script>
<script src="js/parseSgf.js"></script>
<script src="js/loadSgf.js"></script>
<script src="js/saveSgf.js"></script>
<script src="js/boardDisplay.js"></script>
<script src="js/coord.js"></script>
<script src="js/toolPanel.js"></script>
<script src="js/filePanel.js"></script>
<script src="js/controlPanel.js"></script>
<script src="js/namesPanel.js"></script>
<script src="js/commentPanel.js"></script>
<script src="js/treePanel.js"></script>

</head>
<body>
<div id="target"></div>

<script type="text/javascript">
(function() {
    const options = { resize: "fill" },
        div = document.getElementById('target'),
        params = new URLSearchParams(window.location.search);
    
    options.sgf = `
(;GM[1]FF[4]CA[UTF-8]AP[Sabaki:0.52.0]KM[6.5]SZ[19]DT[2022-07-20]PL[W])
`

    besogo.create(div, options);

    function addStyleLink(cssURL) {
        var element = document.createElement('link');
        element.href = cssURL;
        element.type = 'text/css';
        element.rel = 'stylesheet';
        document.head.appendChild(element);
    }
})();
</script>

</body>

</html>

getStone() function always returning zero

when i tried to extract the board position in a 2d array format using getstone function, every time zero is returned for each and every position irrespective of the stones placed on the board

Where can I find besogo-all-min.js file?

Hi!
I can't find besogo-all-min.js.
Could you please tell me where ?

Problem Mode

Add widget mode for displaying go problems

Hide single children option

Add option to hide auto-markup for single children-style variations. Maybe make this the default behavior, with showing single children being the option.

Does not render within wordpress page correctly

Although a minimal HTML file renders fine in Besogo - http://static.livingcosmos.org/cdn/besogo/mydex.html

An attempt to embed this same HTML within a wordpress site leads to a black board and large buttons - http://www.metalevel.link/baduk/thequietcenter-vs-turkeytoprak/

Should use pop-up to warn when closing tab

There's a feature that many sites use to avoid accidental tab closing; I think it's JavaScript's beforeunload event. BesoGo should use this to generate a pop-up and give the user one last chance to avoid lost work.

TypeScript support

Is there any plan about TypeScript support?

Publish in npm

Hi, I would love to use this in a project. Would you consider publishing it in npm so that it's easier to install? I can probably help you with that if you want.

Ideas / todo / etc

If work on the project ever resumes I would like to see the following features.

Electron-based app & analysis
AI win rate graph support. #19
Last move marker options. show \ hide \ move number #10
Sound

Refactor All Colors into CSS

Currently, a lot of colors are hard-coded into the javascript code.

It would be better to define them all in CSS to make it easier to customize the entire color palette. However, this would require some refactoring work and thought about what new CSS classes need to be defined.

Numeric variation labeling option

Add option to number variations instead of using letters for auto-markup

Button border in Chrome

Chrome not use button border style and use default black border.
Fix this in besogo.css

border-color: #ffffff #e6e6e6 #e6e6e6 #ffffff;

AI win rate graph support

Having an option to enable rendering of AI win rate graphs for SGFs that have that information would be great. Having the graph display some kind of a marker for the current move would be nice as well.

If this is not possible, would it be possible to add callbacks for tree navigation events so that users could add their own graphing functionality?

yewang / besogo Goto Github PK

besogo's People

Contributors

Stargazers

Watchers

Forkers

besogo's Issues

Recommend Projects

Recommend Topics

Recommend Org