Git Product home page Git Product logo

graphene-ui's Introduction

Graphene-UI

This is a light wallet that connects to a Graphene based API server such as the Bitshares witness_node executable.

It stores all keys locally in the browser, never exposing your keys to anyone as it signs transactions locally before transmitting them to the API server which then broadcasts them to the blockchain network. The wallet is encrypted with a password of your choosing and encrypted in a browser database.

Getting started

Graphene-UI depends node Node.js, and version 6+ is required. It has not yet been tested with v7.

On Ubuntu and OSX, the easiest way to install Node is to use the Node Version Manager.

To install NVM for Linux/OSX, simply copy paste the following in a terminal:

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.30.2/install.sh | bash
nvm install v6
nvm use v6

Once you have Node installed, you can clone the repo:

git clone https://github.com/cryptonomex/graphene-ui.git
cd graphene-ui

Before launching the GUI you will need to install the npm packages for each subdirectory:

cd web
npm install

Running the dev server

The dev server uses Express in combination with Wepback 2.

Once all the packages have been installed you can start the development server by going to the web folder and running:

npm start

Once the compilation is done the GUI will be available in your browser at: localhost:8080 or 127.0.0.1:8080. Hot Reloading is enabled so the browser will live update as you edit the source files.

Testnet

By default graphene-ui connects to the live Bitshares network, but it's very easy to switch it to the testnet run by Xeroc. To do so, open the UI in a browser, go to Settings, then under Access, select the Public Testnet Server in the dropdown menu. You should also change the faucet if you need to create an account, the testnet faucet address is https://testnet.bitshares.eu.

The UI will reload and connect to the testnet, where you can use the faucet to create an account and receive an initial sum of test BTS.

image

Production

If you'd like to host your own wallet somewhere, you should create a production build and host it using NGINX or Apache. In order to create a prod bundle, simply run the following command:

npm run build

This will create a bundle in the /dist folder that can be hosted with the web server of your choice.

Installable wallets

We use Electron to provide installable wallets, available for Windows, OSX and Linux Debian platforms such as Ubuntu. First, install the required packages in the electron folder. Then go to the web folder and run npm run electron. This will compile the UI with some special modifications for use with Electron, and copy the result to the root electron/build folder. Now go back to the electron folder and run npm run release in order to build a wallet for your platform.

Contributing

Graphene-UI is open source and anyone is free to contribute. PR's are welcomed and will be reviewed in a timely manner, and long-term contributors will be given access to the repo.

If you would like to get involved, we have a Slack channel where you can ask questions and get help.

For more info, please contact one of the following people:

There's also a very active Telegram chatroom

Development process

  • Bugs are always worked before enhancements
  • Developers should work each issue according to a numbered branch corresponding to the issue git checkout -b 123

Coding style guideline

Our style guideline is based on 'Airbnb JavaScript Style Guide' (https://github.com/airbnb/javascript), with few exceptions:

  • Strings are double quoted
  • Additional trailing comma (in arrays and objects declaration) is optional
  • 4 spaces tabs
  • Spaces inside curly braces are optional

We strongly encourage to use eslint to make sure the code adhere to our style guidelines.

graphene-ui's People

Contributors

abitmore avatar aci-chase-irby avatar aci-leecooper avatar alexchien avatar bitsacer avatar bytemaster avatar c055 avatar cassiopaia avatar chronoscrypto avatar clayop avatar destenson avatar dnotestein avatar emfrias avatar maqifrnswa avatar mindphlux1 avatar nathanielhourt avatar naueh avatar nmywn avatar noisy avatar office-work-account avatar rngl4b avatar svk31 avatar szechem avatar todofixthis avatar troglodactyl avatar vikramrajkumar avatar wildbunny avatar wmbutler avatar xeroc avatar zcnsys avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

graphene-ui's Issues

Async dispatcher support in the application state (ex: MyStore)

Atl does not support async stores (data-store). A 'fire and forget' philosophy was attempted but this does not work especially where the state involves permanent storage. Since we are using IndexedDb, everything is async in the data-store.

Possible solutions are:

  1. NodeJs EventEmitter
  2. alt-resolve

This will provide a mechanism for the store to notify the view when an action is complete.

Proposed transactions support

I don't know if we have this already but I think we need it to at least test the Delegate workflow for changing chain rules.

Serialization appears to be broken using latest build of the toolkit

After building the toolkit and updating the serialization using js_operation_serializer I get this error when trying to place an order:

order error: 0 exception: unspecified
Invalid hex character ','
{"c":","}
th_a hex.cpp:13 from_hex
graphene-ui signer address GPHFAbAx7yuxt725qSZvfwWqkdCwp9ZnUama digest 64c23e327934cd07ae13abf988ca6dbece6816149240595d2bdb6df4e0b9d4c9 public GPH6MRyAjQq8ud7hVNYcfnVPJqcVpscN5So8BhtHuGYqET5GDW5CV transaction 000093459455000001010000000000000000000ff4010000000000000140ff1005000000000080e7fc5e00 {"ref_block_num":0,"ref_block_prefix":1435780499,"relative_expiration":0,"operations":[[1,{"fee":{"amount":"0","asset_id":"1.4.0"},"seller":"1.3.15","amount_to_sell":{"amount":"500","asset_id":"1.4.1"},"min_to_receive":{"amount":"85000000","asset_id":"1.4.0"},"expiration":"2020-07-01T19:44:00","fill_or_kill":false}]],"signatures":["11, XW\u0012e\u001f}Y�mI�@�Q�4�\u0011\u0002�\u0003�k�k+�-6<�\u0005�\u0016\u001d�"�(�1\u001f\u000e2F|�{Xl�'�2"]}

Wallet error >>> unlock password

error during aes 256 cbc decrypt final
    {"s":"error:06065064:digital envelope routines:EVP_DecryptFinal_ex:bad decrypt"}
    th_a  aes.cpp:263 aes_decrypt

    {}
    th_a  wallet.cpp:1927 unlock

Cannot access to accounts

Using the latest graphene bulid, accounts are not shown in GUI. cli_wallet works.
How can I fix it?

build fail on windows

I build the ui success on ubuntu and mac, fail on win7x64, any idea?

[694] ./app/assets/fonts/Roboto-Bold.eot 0 bytes [optional] [built] [failed]
[696] ./app/assets/fonts/Roboto-Bold.ttf 0 bytes [optional] [built] [failed]
[697] ./app/assets/fonts/Roboto-Bold.woff 0 bytes [optional] [built] [failed]
......
......
WARNING in ./app/assets/fonts/Roboto-Bold.eot
Module parse failed: I:\private\code\graphene-ui\web\app\assets\fonts\Roboto-Bold.eot Line 1: Unexpected token ILLEGAL
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
 @ ./app/assets/fonts ^\.\/.*$

Cannot make orders in exchange

With the newest commit GUI exchange gives the following error when I attempts to make an order

Unknown error. Failed to place order for 5 TEST

In CLI, it works well

Voting action publishChanges error

This method uses Object.assign which is experimental and at least for me throws an error:

Uncaught TypeError: Object.assign is not a function

Curious if this should be resolved and whether it is effecting anything

Been trying to get the GUI started (separate issue) but I'm curious if I should be concerned with this message and whether or not I need to do something to resolve it?

'''
vor0220@vor0220-ubuntu:~/graphene-ui/cli$ npm start

[email protected] start /home/vor0220/graphene-ui/cli
webpack; node ./bundle.js

[BABEL] Note: The code generator has deoptimised the styling of "/home/vor0220/graphene-ui/dl/lib/bytebuffer_3.5.4.js" as it exceeds the max of "100KB".
[BABEL] Note: The code generator has deoptimised the styling of "/home/vor0220/graphene-ui/dl/src/common/dictionary_en.js" as it exceeds the max of "100KB".
Hash: b27871d6bf2cd6037f42
Version: webpack 1.8.11
Time: 6683ms
Asset Size Chunks Chunk Names
bundle.js 1.42 MB 0 [emitted] main
bundle.js.map 1.89 MB 0 [emitted] main
+ 181 hidden modules

WARNING in ../dl/lib/bytebuffer_3.5.4.js
Critical dependencies:
1:537-544 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results.
@ ../dl/lib/bytebuffer_3.5.4.js 1:537-544

WARNING in ../dl//websocket/lib/BufferUtil.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/Release/bufferutil in /home/vor0220/graphene-ui/dl/node_modules/websocket/lib
@ ../dl/
/websocket/lib/BufferUtil.js 9:19-57

WARNING in ../dl//websocket/lib/BufferUtil.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/default/bufferutil in /home/vor0220/graphene-ui/dl/node_modules/websocket/lib
@ ../dl/
/websocket/lib/BufferUtil.js 11:19-57

WARNING in ../dl//websocket/lib/Validation.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/Release/validation in /home/vor0220/graphene-ui/dl/node_modules/websocket/lib
@ ../dl/
/websocket/lib/Validation.js 9:21-59

WARNING in ../dl//websocket/lib/Validation.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/default/validation in /home/vor0220/graphene-ui/dl/node_modules/websocket/lib
@ ../dl/
/websocket/lib/Validation.js 11:21-59
'''

Question: How can I defined a reusable component in the Graphene GUI?

I'm trying to defined my required properties on a reusable component via (class MyReusableComponent extends React.Component).propTypes.... It does not work, a React warning directed me to use React.createClass (instead of class ... extends React.Component). When I do this in our app and nest in the root element, render does not work because this is undefined: React.createClass({..., render: () => {this === undefined}).

According to the docs, that should have worked..
ref: https://facebook.github.io/react/docs/reusable-components.html

Note, there are other things like getInitialState() that do not work either.

Improve app Footer (so it is always a footer)

I noticed that when I add a new App.jsx Route to a new component, the component will render but the footer "[logo] BitShares 2.0 ..... Head block # 1" does not remain at the bottom. Rather than mock up each component with the magic to fix it, is there something we can add to App.jsx to fix it for all routes?

NPM start - error // throw er; // Unhandled 'error' event

DEVELOPMENT mode
 70% 1/1 build modulesevents.js:85
      throw er; // Unhandled 'error' event
            ^
Error: listen EADDRINUSE
    at exports._errnoException (util.js:746:11)
    at Server._listen2 (net.js:1129:14)
    at listen (net.js:1155:10)
    at net.js:1253:9
    at GetAddrInfoReqWrap.asyncCallback [as callback] (dns.js:81:16)
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:99:10)

npm ERR! Darwin 14.3.0
npm ERR! argv "node" "/usr/local/bin/npm" "start"
npm ERR! node v0.12.0
npm ERR! npm  v2.7.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] start: `webpack-dev-server --hot --inline --progress --colors --devtool inline-source-map --content-base assets/`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] start script 'webpack-dev-server --hot --inline --progress --colors --devtool inline-source-map --content-base assets/'.
npm ERR! This is most likely a problem with the webgui package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     webpack-dev-server --hot --inline --progress --colors --devtool inline-source-map --content-base assets/
npm ERR! You can get their info via:
npm ERR!     npm owner ls webgui
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/xx/Git/graphene-ui/web/npm-debug.log

Shared data for unit testing (ex: memo data)

The memo data checksum format has changed. With the update, introduce a JSON file with the memo data examples and their proper output. The c++ side will be updated to share the same file and ensure that both code bases handle the memo and checksums the same way.

Referral support

Not sure what this really needs to entail but we need to come up with something if we haven't already. Some combination of integration with faucet, and then a page to track your own referrals or maybe a general referral scoreboard?

Adjust CSS style for Select options where size > 1

I noticed in our gui when a select options has a size attribute it should vertically become higher by size=N items (or at least to a reasonable height). It does not, it stays at only one item high and tries to show a scrollbar. The CSS property culprit is app.css:{select: height: 2.4rem}. I can't find this anywhere and also I'm not sure what might be the best fix. It would be nice if 2.4rem only applied to selects of size one. Does anyone know about this? thanks...

Exchange: When enter market buy/sell Button doesn't execute first time

When enter a specific market, then i have to change for example the price input to be able to execute the buy/sell buttons! Aftert this no problem to place an order... but it's not everytime ..hope this helps ..
Hopefully i could explain the poblem .. if not .. pls feel free to ask ..

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.