Skip to content

C
converse.js
Commit 4a3f38e5 authored by JC Brand's avatar JC Brand
Browse files
Options

Update docs with info on how to set up the dev env

parent 716ecc1b
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 320 additions and 222 deletions
docs/html/.buildinfo
View file @ 4a3f38e5
# Sphinx build info version 1
# This file hashes the configuration used when building these files. When it is not found, a full rebuild will be done.
config: 11cf73c9901b429394dccc272608c52e
config: 412a90a1e0621af20e495234fc711bdf
tags: fbb0d17656682115ca4d033fb2f83ba1
docs/html/_sources/index.txt
View file @ 4a3f38e5
......@@ -10,6 +10,60 @@
:depth: 3
:local:
=========================================
Quickstart (to get a demo up and running)
=========================================
When you download a specific release of *Converse.js* there will be two minified files inside the zip file.
* converse.min.js
* converse.min.css
You can include these two files inside the *<head>* element of your website via the *script* and *link*
tags:
::
<link rel="stylesheet" type="text/css" media="screen" href="converse.min.css">
<script src="converse.min.js"></script>
Then, at the bottom of your page, after the closing *</body>* element, put the
following inline Javascript code:
::
require(['converse'], function (converse) {
converse.initialize({
auto_list_rooms: false,
auto_subscribe: false,
bosh_service_url: 'https://bind.opkode.im', // Please use this connection manager only for testing purposes
hide_muc_server: false,
i18n: locales.en, // Refer to ./locale/locales.js to see which locales are supported
prebind: false,
show_controlbox_by_default: true,
xhr_user_search: false
});
});
The *index.html* file inside the Converse.js folder serves as a nice usable
example of this.
These minified files provide the same demo-like functionality as is available
on the `conversejs.org`_ website. Useful for testing or demoing, but not very
practical.
You'll most likely want to implement some kind of single-signon solution for
your website, where users authenticate once in your website and then stay
logged into their XMPP session upon page reload.
For more info on this, read: `Pre-binding and Single Session Support`_.
You might also want to have more fine-grained control of what gets included in
the minified Javascript file. Read `Configuration`_ and `Minification`_ for more info on how to do
that.
============
Introduction
============
......@@ -36,6 +90,7 @@ code.
The `What you will need`_ section has more information on all these
requirements.
==================
What you will need
==================
......@@ -151,85 +206,63 @@ In the callback function, you call *converse.onConnected* together with the
connection object.
=========================================
Quickstart (to get a demo up and running)
=========================================
When you download a specific release of *Converse.js* there will be two minified files inside the zip file.
* converse.min.js
* converse.min.css
===========
Development
===========
You can include these two files inside the *<head>* element of your website via the *script* and *link*
tags:
Install Node.js and development dependencies
============================================
::
We use development tools (`Grunt <http://gruntjs.com>`_ and `Bower <http://bower.io>`_)
which depend on Node.js and npm (the Node package manager).
<link rel="stylesheet" type="text/css" media="screen" href="converse.min.css">
<script src="converse.min.js"></script>
If you don't have Node.js installed, you can download and install the latest
version `here <https://nodejs.org/download>`_.
Then, at the bottom of your page, after the closing *</body>* element, put the
following inline Javascript code:
Once you have Node.js installed, run the following command in the Converse.js
directory:
::
require(['converse'], function (converse) {
converse.initialize({
auto_list_rooms: false,
auto_subscribe: false,
bosh_service_url: 'https://bind.opkode.im', // Please use this connection manager only for testing purposes
hide_muc_server: false,
i18n: locales.en, // Refer to ./locale/locales.js to see which locales are supported
prebind: false,
show_controlbox_by_default: true,
xhr_user_search: false
});
});
The *index.html* file inside the Converse.js folder serves as a nice usable
example of this.
These minified files provide the same demo-like functionality as is available
on the `conversejs.org`_ website. Useful for testing or demoing, but not very
practical.
npm install
You'll most likely want to implement some kind of single-signon solution for
your website, where users authenticate once in your website and then stay
logged into their XMPP session upon page reload.
Install 3rd party dependencies
==============================
For more info on this, read: `Pre-binding and Single Session Support`_.
Now that we have Grunt and Bower, you can install and configure Converse's
3rd party dependencies with the following command:
You might also want to have more fine-grained control of what gets included in
the minified Javascript file. Read `Configuration`_ and `Minification`_ for more info on how to do
that.
::
===========
Development
===========
grunt build
With AMD and require.js (recommended)
-------------------------------------
=====================================
Converse.js uses `require.js`_ to track and load dependencies.
Converse.js uses `require.js`_ to asynchronously load dependencies.
If you want to develop or customize converse.js, you'll want to load the
non-minified javascript files.
Add the following two lines to the *<head>* section of your webpage.
Add the following two lines to the *<head>* section of your webpage:
::
<link rel="stylesheet" type="text/css" media="screen" href="converse.css">
<script data-main="main" src="Libraries/require-jquery.js"></script>
<script data-main="main" src="components/requirejs/require.js"></script>
require.js will then let the main.js file be parsed (because of the *data-main*
attribute on the *script* tag), which will in turn cause converse.js to be
parsed.
Without AMD and require.js
--------------------------
==========================
Converse.js can also be used without require.js. If you for some reason prefer
to use it this way, please refer to *non_amd.html* for an example of how and in
what order all the Javascript files that converse.js depends on need to be
loaded.
to use it this way, please refer to
`non_amd.html <https://github.com/jcbrand/converse.js/blob/master/non_amd.html>`_
for an example of how and in what order all the Javascript files that converse.js
depends on need to be loaded.
=============
......@@ -290,7 +323,7 @@ bosh_service_url
Connections to an XMPP server depend on a BOSH connection manager which acts as
a middle man between HTTP and XMPP.
See `here`_ for more information.
See `here <http://metajack.im/2008/09/08/which-bosh-server-do-you-need>`_ for more information.
fullname
--------
......@@ -505,7 +538,6 @@ those hoops you had to jump through.
.. _`conversejs.org`: http://conversejs.org
.. _`require.js`: http://requirejs.org
.. _`read more about require.js's optimizer here`: http://requirejs.org/docs/optimization.html
.. _`here`: http://metajack.im/2008/09/08/which-bosh-server-do-you-need/l
.. _`HTTP`: https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol
.. _`XMPP`: https://en.wikipedia.org/wiki/Xmpp
.. _`Converse.js homepage`: http://conversejs.org
......
docs/html/genindex.html
View file @ 4a3f38e5
......@@ -9,7 +9,7 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Index &mdash; Converse.js 0.3 documentation</title>
<title>Index &mdash; Converse.js 0.5 documentation</title>
<link rel="stylesheet" href="_static/stylesheet.css" type="text/css" />
<link rel="stylesheet" href="_static/pygments.css" type="text/css" />
......@@ -17,7 +17,7 @@
<script type="text/javascript">
var DOCUMENTATION_OPTIONS = {
URL_ROOT: '',
VERSION: '0.3',
VERSION: '0.5',
COLLAPSE_INDEX: false,
FILE_SUFFIX: '.html',
HAS_SOURCE: true
......@@ -26,7 +26,7 @@
<script type="text/javascript" src="_static/jquery.js"></script>
<script type="text/javascript" src="_static/underscore.js"></script>
<script type="text/javascript" src="_static/doctools.js"></script>
<link rel="top" title="Converse.js 0.3 documentation" href="index.html" />
<link rel="top" title="Converse.js 0.5 documentation" href="index.html" />
</head>
<body>
<div id="header_wrap" class="outer">
......@@ -51,7 +51,7 @@
<li class="right" style="margin-right: 10px">
<a href="#" title="General Index"
accesskey="I">index</a></li>
<li><a href="index.html">Converse.js 0.3 documentation</a> &raquo;</li>
<li><a href="index.html">Converse.js 0.5 documentation</a> &raquo;</li>
</ul>
</div>
<section id="main_content" class="inner">
......@@ -80,7 +80,7 @@
<li class="right" style="margin-right: 10px">
<a href="#" title="General Index"
>index</a></li>
<li><a href="index.html">Converse.js 0.3 documentation</a> &raquo;</li>
<li><a href="index.html">Converse.js 0.5 documentation</a> &raquo;</li>
</ul>
</div>
</div>
......
docs/html/index.html
View file @ 4a3f38e5
This diff is collapsed.
docs/html/objects.inv
View file @ 4a3f38e5
# Sphinx inventory version 2
# Project: Converse.js
# Version: 0.3
# Version: 0.5
# The remainder of this file is compressed using zlib.
xm
{"];
......
docs/html/search.html
View file @ 4a3f38e5
......@@ -7,7 +7,7 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Search &mdash; Converse.js 0.3 documentation</title>
<title>Search &mdash; Converse.js 0.5 documentation</title>
<link rel="stylesheet" href="_static/stylesheet.css" type="text/css" />
<link rel="stylesheet" href="_static/pygments.css" type="text/css" />
......@@ -15,7 +15,7 @@
<script type="text/javascript">
var DOCUMENTATION_OPTIONS = {
URL_ROOT: '',
VERSION: '0.3',
VERSION: '0.5',
COLLAPSE_INDEX: false,
FILE_SUFFIX: '.html',
HAS_SOURCE: true
......@@ -25,7 +25,7 @@
<script type="text/javascript" src="_static/underscore.js"></script>
<script type="text/javascript" src="_static/doctools.js"></script>
<script type="text/javascript" src="_static/searchtools.js"></script>
<link rel="top" title="Converse.js 0.3 documentation" href="index.html" />
<link rel="top" title="Converse.js 0.5 documentation" href="index.html" />
<script type="text/javascript">
jQuery(function() { Search.loadIndex("searchindex.js"); });
</script>
......@@ -55,7 +55,7 @@
<li class="right" style="margin-right: 10px">
<a href="genindex.html" title="General Index"
accesskey="I">index</a></li>
<li><a href="index.html">Converse.js 0.3 documentation</a> &raquo;</li>
<li><a href="index.html">Converse.js 0.5 documentation</a> &raquo;</li>
</ul>
</div>
<section id="main_content" class="inner">
......@@ -100,7 +100,7 @@
<li class="right" style="margin-right: 10px">
<a href="genindex.html" title="General Index"
>index</a></li>
<li><a href="index.html">Converse.js 0.3 documentation</a> &raquo;</li>
<li><a href="index.html">Converse.js 0.5 documentation</a> &raquo;</li>
</ul>
</div>
</div>
......
docs/html/searchindex.js
View file @ 4a3f38e5
Search.setIndex({objects:{},terms:{all:0,code:0,partial:0,queri:0,webchat:0,follow:0,middl:0,depend:0,sensit:0,sorri:0,specif:0,those:0,under:0,string:0,fals:0,mechan:0,jack:0,veri:0,list:0,pleas:0,prevent:0,past:0,second:0,pass:0,download:0,further:0,fullnam:0,click:0,even:0,index:0,what:0,hide:0,section:0,current:0,version:[],"new":0,net:0,method:0,widget:0,gener:0,here:0,bodi:0,valu:0,box:0,convert:0,convers:0,mysit:0,ajax:0,fetch:0,implement:0,via:0,extra:0,solut:0,prefer:0,put:0,href:0,succesfulli:0,auto_list_room:0,instal:0,from:0,zip:0,commun:0,doubl:0,two:0,websit:0,stylesheet:0,call:0,recommend:0,type:0,until:0,tightli:0,more:0,yahoo:0,site:0,must:0,room:0,setup:[],work:0,xhr:0,can:0,lc_messag:0,purpos:0,root:0,blogpost:0,control:0,quickstart:0,share:0,templat:0,tag:0,proprietari:0,explor:0,onlin:0,occup:0,end:0,goal:0,snippet:0,how:0,sid:0,instead:0,css:0,updat:0,npm:0,regener:0,product:0,resourc:0,after:0,usabl:0,befor:0,callback:0,underscor:0,data:0,demonstr:0,man:0,practic:0,bind:0,show_controlbox_by_default:0,element:0,inform:0,order:0,chatbox:0,xmpp:0,over:0,through:0,streamlin:0,write:0,jid:0,directli:0,fit:0,pend:0,hidden:0,therefor:0,might:0,them:0,anim:0,"return":0,thei:0,initi:0,front:0,now:0,introduct:0,name:0,edit:0,authent:0,token:0,ejabberd:0,each:0,side:0,mean:0,domain:0,individu:0,realli:0,legwork:0,connect:0,happen:0,extract:0,special:0,variabl:0,shown:0,space:0,open:0,content:0,rel:0,internet:0,plural:0,factori:0,po2json:0,proxi:0,insid:0,standard:0,standalon:0,reason:0,ask:0,org:0,afterward:0,could:0,keep:0,yui:0,first:0,origin:0,softwar:0,render:0,onc:0,hoop:0,lastnam:0,number:0,yourself:0,restrict:0,alreadi:0,done:0,owner:0,jabber:0,differ:0,script:0,top:0,messag:0,attach:0,attack:0,jed:0,luckili:0,option:0,tool:0,specifi:0,compressor:0,part:0,exactli:0,than:0,serv:0,jump:0,kind:0,bloat:0,provid:0,remov:0,exampl:0,jqueri:0,reus:0,toward:[],browser:0,pre:0,sai:[],saa:0,modern:0,ani:0,packag:0,have:0,tabl:0,need:0,moffitt:0,django:0,bosh_service_url:0,prebind:0,min:0,latter:0,note:0,also:0,without:0,build:0,which:0,singl:0,sure:0,roster:0,track:0,object:0,most:0,deploi:0,homepag:0,"class":0,don:0,url:0,request:0,face:0,runtim:0,xdomainrequest:0,show:0,german:0,text:0,session:0,fine:0,find:0,onli:0,locat:0,firstnam:0,configur:0,apach:0,should:0,folder:0,local:0,meant:0,get:0,opkod:0,cannot:0,deploy:0,requir:0,enabl:0,emb:0,"public":0,reload:0,integr:0,contain:0,where:0,set:0,stroph:0,see:0,close:0,statu:0,state:0,bridg:0,between:0,experi:0,hide_muc_serv:0,attribut:0,kei:0,screen:0,javascript:0,conjunct:[],job:0,bosh:0,cor:0,instant:0,shortliv:0,conversej:0,etc:0,grain:0,mani:0,login:0,com:0,load:0,instanti:0,pot:0,backend:0,onconnect:0,rebuild:0,json:0,much:0,besid:0,subscrib:0,msgmerg:0,great:0,minifi:0,togeth:0,i18n:0,present:0,multi:0,main:0,servic:0,plugin:0,defin:0,chat:0,helper:0,demo:0,auto_subscrib:0,non:0,rid:0,develop:0,minim:0,receiv:0,media:0,make:0,minif:0,cross:0,same:0,read:0,html:0,chatroom:0,signon:0,http:0,webserv:0,optim:0,upon:0,hand:0,"50kb":0,user:0,xhr_user_search:0,recent:0,stateless:0,markup:0,person:[],contact:0,command:0,wherebi:0,thi:0,choos:0,usual:0,plural_form:0,protocol:0,just:0,languag:0,web:0,xmlhttprequest:0,had:0,add:0,other:0,non_amd:0,input:0,yuicompressor:0,match:0,take:0,applic:0,format:0,webpag:0,nginx:0,traffic:0,xss:0,like:0,success:0,server:0,benefit:0,necessari:0,either:0,page:0,deal:0,nplural:0,some:0,back:0,librari:0,bottom:0,though:0,overcom:0,refer:0,run:0,host:0,panel:0,src:0,about:0,obj:[],controlbox:0,unfortun:0,act:0,own:0,encod:0,automat:0,wrap:0,your:0,manag:0,log:0,wai:0,transfer:0,support:0,custom:0,avail:0,start:[],includ:0,lot:0,suit:0,"var":0,"function":0,head:0,properli:0,form:0,bundl:0,link:0,translat:0,synonym:0,line:0,inlin:0,"true":0,congratul:0,longer:0,info:0,made:0,locale_data:0,possibl:0,"default":0,below:0,toggl:0,otherwis:0,problem:0,expect:0,featur:0,creat:0,"100kb":[],exist:0,file:0,want:0,when:0,detail:0,gettext:0,field:0,valid:0,rememb:0,test:0,you:0,nice:0,node:0,intend:0,releas:0,stai:0,lang:0,requirej:0,getjson:0,time:0},objtypes:{},titles:["Introduction"],objnames:{},filenames:["index"]})
\ No newline at end of file
Search.setIndex({objects:{},terms:{all:0,code:0,partial:0,queri:0,webchat:0,follow:0,middl:0,depend:0,sensit:0,sorri:0,those:0,under:0,string:0,fals:0,mechan:0,jack:0,veri:0,list:0,pleas:0,prevent:0,past:0,second:0,pass:0,download:0,further:0,fullnam:0,click:0,even:0,index:0,what:0,hide:0,section:0,current:0,version:0,"new":0,net:0,"public":0,widget:0,gener:0,here:0,bodi:0,let:0,valu:0,box:0,convert:0,convers:0,mysit:0,reason:0,fetch:0,implement:0,via:0,extra:0,apach:0,prefer:0,ask:0,href:0,org:0,auto_list_room:0,instal:0,from:0,zip:0,commun:0,doubl:0,two:0,websit:0,stylesheet:0,call:0,recommend:0,type:0,until:0,tightli:0,more:0,yahoo:0,site:0,must:0,room:0,setup:[],work:0,xhr:0,can:0,lc_messag:0,purpos:0,root:0,blogpost:0,control:0,quickstart:0,share:0,templat:0,tag:0,proprietari:0,explor:0,onlin:0,occup:0,end:0,goal:0,write:0,how:0,sid:0,instead:0,css:0,updat:0,npm:0,regener:0,product:0,resourc:0,after:0,usabl:0,befor:0,callback:0,underscor:0,data:0,demonstr:0,man:0,practic:0,bind:0,show_controlbox_by_default:0,django:0,caus:0,inform:0,media:0,order:0,chatbox:0,xmpp:0,over:0,becaus:0,through:0,streamlin:0,snippet:0,jid:0,directli:0,fit:0,pend:0,hidden:0,therefor:0,might:0,them:0,anim:0,"return":0,thei:0,initi:0,front:0,now:0,introduct:0,name:0,edit:0,authent:0,token:0,ejabberd:0,each:0,side:0,mean:0,domain:0,individu:0,realli:0,legwork:0,connect:0,happen:0,extract:0,special:0,variabl:0,shown:0,"3rd":0,space:0,open:0,content:0,rel:0,internet:0,plural:0,factori:0,po2json:0,proxi:0,insid:0,standard:0,standalon:0,ajax:0,put:0,succesfulli:0,afterward:0,could:0,success:0,keep:0,yui:0,turn:0,first:0,origin:0,softwar:0,render:0,onc:0,hoop:0,lastnam:0,number:0,yourself:0,restrict:0,alreadi:0,done:0,owner:0,jabber:0,differ:0,script:0,top:0,messag:0,attach:0,attack:0,jed:0,luckili:0,option:0,tool:0,specifi:0,compressor:0,part:0,bower:0,grunt:0,than:0,serv:0,jump:0,kind:0,bloat:0,provid:0,remov:0,exampl:0,jqueri:[],bridg:0,toward:[],browser:0,pre:0,sai:[],saa:0,modern:0,ani:0,packag:0,have:0,tabl:0,need:0,moffitt:0,element:0,bosh_service_url:0,prebind:0,min:0,latter:0,note:0,also:0,without:0,build:0,which:0,singl:0,sure:0,roster:0,track:0,object:0,most:0,deploi:0,homepag:0,"class":0,don:0,url:0,request:0,face:0,runtim:0,pars:0,usual:0,xdomainrequest:0,show:0,german:0,text:0,session:0,fine:0,find:0,onli:0,exactli:0,locat:0,just:0,configur:0,solut:0,should:0,folder:0,local:0,meant:0,get:0,opkod:0,cannot:0,deploy:0,requir:0,enabl:0,emb:0,method:0,reload:0,integr:0,contain:0,where:0,set:0,stroph:0,see:0,close:0,statu:0,state:0,reus:0,between:0,experi:0,hide_muc_serv:0,attribut:0,kei:0,screen:0,javascript:0,conjunct:[],job:0,bosh:0,cor:0,instant:0,shortliv:0,conversej:0,etc:0,grain:0,mani:0,login:0,com:0,load:0,instanti:0,pot:0,backend:0,creat:0,rebuild:0,compon:0,json:0,much:0,besid:0,subscrib:0,msgmerg:0,great:0,minifi:0,togeth:0,i18n:0,present:0,multi:0,main:0,servic:0,plugin:0,defin:0,file:0,helper:0,demo:0,auto_subscrib:0,non:0,rid:0,develop:0,minim:0,receiv:0,parti:0,make:0,minif:0,cross:0,same:0,webpag:0,html:0,chatroom:0,signon:0,http:0,webserv:0,optim:0,upon:0,hand:0,"50kb":0,user:0,xhr_user_search:0,recent:0,stateless:0,markup:0,person:[],contact:0,command:0,wherebi:0,thi:0,choos:0,latest:0,plural_form:0,protocol:0,firstnam:0,languag:0,web:0,xmlhttprequest:0,had:0,add:0,valid:0,non_amd:0,input:0,yuicompressor:0,match:0,take:0,applic:0,format:0,read:0,amd:0,nginx:0,traffic:0,xss:0,like:0,specif:0,server:0,benefit:0,necessari:0,either:0,page:0,deal:0,nplural:0,some:0,back:0,librari:0,bottom:0,though:0,overcom:0,refer:0,run:0,host:0,panel:0,src:0,about:0,obj:[],controlbox:0,unfortun:0,act:0,own:0,encod:0,automat:0,wrap:0,your:0,manag:0,log:0,wai:0,transfer:0,support:0,custom:0,avail:0,start:[],includ:0,lot:0,suit:0,"var":0,"function":0,head:0,properli:0,form:0,bundl:0,link:0,translat:0,synonym:0,line:0,inlin:0,"true":0,congratul:0,requirej:0,info:0,made:0,locale_data:0,possibl:0,"default":0,asynchron:0,below:0,toggl:0,otherwis:0,problem:0,expect:0,featur:0,onconnect:0,"100kb":[],exist:0,chat:0,want:0,when:0,detail:0,gettext:0,field:0,other:0,rememb:0,test:0,you:0,nice:0,node:0,intend:0,releas:0,stai:0,lang:0,longer:0,directori:0,getjson:0,time:0},objtypes:{},titles:["Quickstart (to get a demo up and running)"],objnames:{},filenames:["index"]})
\ No newline at end of file
docs/source/conf.py
View file @ 4a3f38e5
......@@ -48,9 +48,9 @@ copyright = u'2013, JC Brand'
# built documents.
#
# The short X.Y version.
version = '0.3'
version = '0.5'
# The full version, including alpha/beta/rc tags.
release = '0.3'
release = '0.5'
# The language for content autogenerated by Sphinx. Refer to documentation
# for a list of supported languages.
......
docs/source/index.rst
View file @ 4a3f38e5
......@@ -10,6 +10,60 @@
:depth: 3
:local:
=========================================
Quickstart (to get a demo up and running)
=========================================
When you download a specific release of *Converse.js* there will be two minified files inside the zip file.
* converse.min.js
* converse.min.css
You can include these two files inside the *<head>* element of your website via the *script* and *link*
tags:
::
<link rel="stylesheet" type="text/css" media="screen" href="converse.min.css">
<script src="converse.min.js"></script>
Then, at the bottom of your page, after the closing *</body>* element, put the
following inline Javascript code:
::
require(['converse'], function (converse) {
converse.initialize({
auto_list_rooms: false,
auto_subscribe: false,
bosh_service_url: 'https://bind.opkode.im', // Please use this connection manager only for testing purposes
hide_muc_server: false,
i18n: locales.en, // Refer to ./locale/locales.js to see which locales are supported
prebind: false,
show_controlbox_by_default: true,
xhr_user_search: false
});
});
The *index.html* file inside the Converse.js folder serves as a nice usable
example of this.
These minified files provide the same demo-like functionality as is available
on the `conversejs.org`_ website. Useful for testing or demoing, but not very
practical.
You'll most likely want to implement some kind of single-signon solution for
your website, where users authenticate once in your website and then stay
logged into their XMPP session upon page reload.
For more info on this, read: `Pre-binding and Single Session Support`_.
You might also want to have more fine-grained control of what gets included in
the minified Javascript file. Read `Configuration`_ and `Minification`_ for more info on how to do
that.
============
Introduction
============
......@@ -36,6 +90,7 @@ code.
The `What you will need`_ section has more information on all these
requirements.
==================
What you will need
==================
......@@ -151,85 +206,63 @@ In the callback function, you call *converse.onConnected* together with the
connection object.
=========================================
Quickstart (to get a demo up and running)
=========================================
When you download a specific release of *Converse.js* there will be two minified files inside the zip file.
* converse.min.js
* converse.min.css
===========
Development
===========
You can include these two files inside the *<head>* element of your website via the *script* and *link*
tags:
Install Node.js and development dependencies
============================================
::
We use development tools (`Grunt <http://gruntjs.com>`_ and `Bower <http://bower.io>`_)
which depend on Node.js and npm (the Node package manager).
<link rel="stylesheet" type="text/css" media="screen" href="converse.min.css">
<script src="converse.min.js"></script>
If you don't have Node.js installed, you can download and install the latest
version `here <https://nodejs.org/download>`_.
Then, at the bottom of your page, after the closing *</body>* element, put the
following inline Javascript code:
Once you have Node.js installed, run the following command in the Converse.js
directory:
::
require(['converse'], function (converse) {
converse.initialize({
auto_list_rooms: false,
auto_subscribe: false,
bosh_service_url: 'https://bind.opkode.im', // Please use this connection manager only for testing purposes
hide_muc_server: false,
i18n: locales.en, // Refer to ./locale/locales.js to see which locales are supported
prebind: false,
show_controlbox_by_default: true,
xhr_user_search: false
});
});
The *index.html* file inside the Converse.js folder serves as a nice usable
example of this.
These minified files provide the same demo-like functionality as is available
on the `conversejs.org`_ website. Useful for testing or demoing, but not very
practical.
npm install
You'll most likely want to implement some kind of single-signon solution for
your website, where users authenticate once in your website and then stay
logged into their XMPP session upon page reload.
Install 3rd party dependencies
==============================
For more info on this, read: `Pre-binding and Single Session Support`_.
Now that we have Grunt and Bower, you can install and configure Converse's
3rd party dependencies with the following command:
You might also want to have more fine-grained control of what gets included in
the minified Javascript file. Read `Configuration`_ and `Minification`_ for more info on how to do
that.
::
===========
Development
===========
grunt build
With AMD and require.js (recommended)
-------------------------------------
=====================================
Converse.js uses `require.js`_ to track and load dependencies.
Converse.js uses `require.js`_ to asynchronously load dependencies.
If you want to develop or customize converse.js, you'll want to load the
non-minified javascript files.
Add the following two lines to the *<head>* section of your webpage.
Add the following two lines to the *<head>* section of your webpage:
::
<link rel="stylesheet" type="text/css" media="screen" href="converse.css">
<script data-main="main" src="Libraries/require-jquery.js"></script>
<script data-main="main" src="components/requirejs/require.js"></script>
require.js will then let the main.js file be parsed (because of the *data-main*
attribute on the *script* tag), which will in turn cause converse.js to be
parsed.
Without AMD and require.js
--------------------------
==========================
Converse.js can also be used without require.js. If you for some reason prefer
to use it this way, please refer to *non_amd.html* for an example of how and in
what order all the Javascript files that converse.js depends on need to be
loaded.
to use it this way, please refer to
`non_amd.html <https://github.com/jcbrand/converse.js/blob/master/non_amd.html>`_
for an example of how and in what order all the Javascript files that converse.js
depends on need to be loaded.
=============
......@@ -290,7 +323,7 @@ bosh_service_url
Connections to an XMPP server depend on a BOSH connection manager which acts as
a middle man between HTTP and XMPP.
See `here`_ for more information.
See `here <http://metajack.im/2008/09/08/which-bosh-server-do-you-need>`_ for more information.
fullname
--------
......@@ -505,7 +538,6 @@ those hoops you had to jump through.
.. _`conversejs.org`: http://conversejs.org
.. _`require.js`: http://requirejs.org
.. _`read more about require.js's optimizer here`: http://requirejs.org/docs/optimization.html
.. _`here`: http://metajack.im/2008/09/08/which-bosh-server-do-you-need/l
.. _`HTTP`: https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol
.. _`XMPP`: https://en.wikipedia.org/wiki/Xmpp
.. _`Converse.js homepage`: http://conversejs.org
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7