A set of widgets for a meaningfully social web.
GraphJS is a Javascript client-side library to help developers easily enable social features on their web sites. GraphJS is built upon the Phở framework, and it's open source. With only a few lines of code, you can easily add authentication, comments, messages, forum, groups, profiles etc. to your static web pages.
GraphJS depends on Riot.js.
Make sure you have npm installed. Simply type in:
npm install # to install Riot.js and other dependencies npm run build # to form graph.js file
After compilation, you will get a
graph.jsfile which would be served through HTTPS. Then, you should include this file in all of your web pages where you want to take advantage of GraphJS functionality.
To get started with Graph.js, you need to include graph.js file (created above) to your project. Then you can initiate it with GraphJS.init function.
Example:
htmlThe<script src="path/to/graph.js"></script> <script> GraphJS.init("{{YOUR-PUBLIC-ID}}", { host: "{{URL-OF-GRAPHJS-INSTANCE}}", theme: "{{YOUR-THEME-PREFERENCE}}", color: "{{YOUR-COLOR-PREFERENCE}}", language: "{{YOUR-LANGUAGE-OF-CHOICE}}", defaultAvatar: "{{URL-TO-YOUR-DEFAULT-AVATAR}}" }) </script>
initfunction comes with multiple options:
You can try your custom tags simply by editing the html files in the
testdirectory. The files are self-explanatory, indicating what parts are to edit.
To test and develop, run
npm run watchcommand. This command will start watching the library files, and the files in the test folder will be served automatically on your browser.
Translation files can be found in the directory /lib/language. They are standard json files. Please make a pull request on our Github repo for us to include your contributions in the master branch.
To fetch the latest translations, run
git submodule foreach 'git pull origin master'
If you're only using a certain parts of the Graph.js library, then the full compiled edition may be too bloated/heavy for your goals. As of version 1.18, Graph.js comes with a new feature that allows you to build a graph.js file with only the modules that you'd need. To achieve this, build it as follows:
modules=authentication,feed npm run build
where modules can be one or a combination of:
Obviously, less modules you use, lighter the library becomes. Authentication is a common module that's always included.
restartcall which ensures that the "widget" is updated once the session status changes. See: private-content.tag for more information.
This project exists thanks to all the people who contribute. [Contribute].
Become a financial contributor and help us sustain our community. [Contribute]
Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]
GNU Affero General Public License v3.0, see LICENSE.