Realms-wiki in non-root directory - editor isn't working

jpalczewski commented 7 years ago

Hi,

I'm wondering how I can edit editor to use styles when realms is behind reverse-proxy - with some magic it is possible to run app in such way(the most important change was adding a static_url_path parameter to Flask constructor in create_app function from main __init__.py - otherwise all static assets were relative to /). Unfortunately, in nginx log I see that clicking styles results in requests to /static(...) and 404, not $static_url_path(...).

stephane-martin commented 7 years ago

I have the same problems with URL prefixing. just as you i patched create_app to generate a custom prefix in python code.

But the editor theming happens in javascript code. look at realms-wiki/realms/static/js/aced.js

change:

themePath: '/static/vendor/ace-builds/src'

to :

themePath: '/yourprefix/wiki/static/vendor/ace-builds/src'

stephane-martin commented 7 years ago

oh, and by the way, the github/twitter/... oauth login does not work with a custom URL prefix too. Haven't succeeded to fix that one :-/

theodotos commented 7 years ago

@stephane-martin

After fixing my LDAP setup (#168) now my editor broke.

These are the steps I used to install realms-wiki:

I use a debian jessie setup.

Installed dependencies from debian repos:

apt-get install -y \
       software-properties-common \
       python-software-properties \
       python-dev \
       python-pip \
       libssl-dev \
       libldap2-dev \
       libsasl2-dev \
       libxml2-dev \
       libxslt1-dev \
       libyaml-dev \
       libffi-dev \
       python-virtualenv \
       python-werkzeug \
       python-wtforms \
       python-oauthlib \
       python-jinja2 \
       npm \
       git

Installed request-oauthlib and realms-wiki using `pip`

pip install request-oauthlib realms-wiki

Installed clean-css (not sure what this does)

npm install -g bower clean-css

Run the setup

mkdir -p /var/lib/realms/db

realms-wiki setup
Enter site title. [Realms]: Example Wiki
Enter base URL. [http://localhost]: http://wiki-test.example.com
Enter port number. [5000]:
Enter secret key. [xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx]:
Enter wiki data directory. [/var/lib/realms/data]:
Allow anonymous edits? [Y/n]: n
Enable registration? [Y/n]: y
Cache type? [simple]:
Search type? [simple]:
Database URI? Examples: http://goo.gl/RyW0cl [sqlite:////tmp/wiki.db]: sqlite:////var/lib/realms/db/wiki.db

mv ~/realms-wiki.json /etc/realms-wiki

Start the wiki

realms-wiki start

At this point I was able to use the wiki using a registered account. The editor was working unless I was connecting using Firefox privacy mode or Chromium incognito mode (weird!).

After I configured LDAP the editor stopped working in either case.

I cannot find any aced.js in my setup.

This is my current *realms-wiki.json file:

root@wiki-test:~# cat /etc/realms-wiki/realms-wiki.json 
{
    "ALLOW_ANON": false,
    "BASE_URL": "http://wiki-test.example.com
    "DB_URI": "sqlite:////var/lib/realms/db/wiki.db",
    "PORT": 5000,
    "REGISTRATION_ENABLED": true,
    "SEARCH_TYPE": "simple",
    "SECRET_KEY": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    "SITE_TITLE": "Example Wiki",
    "WIKI_PATH": "/var/lib/realms/data",

    "LDAP": {
        "URI": "ldap://ldap.example.com:389",
        "BIND_DN": "cn=realms,ou=dsa,dc=example,dc=com",
        "BIND_AUTH": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
        "USER_SEARCH": {
            "base": "ou=people,dc=example,dc=com",
            "filter": "uid=%(username)s"},
        "START_TLS": true,
        "KEY_MAP": {
            "username": "uid",
            "email": "mail"},
        "OPTIONS": {
            "OPT_PROTOCOL_VERSION": 3}
    }
}

Any idea? Suggestions?

stephane-martin commented 7 years ago

what do you mean, by "the editor stopped working" ? what happens ?
the fix about aced.js is only used when you have a subdir in BASE_URL. In your setup (root of domain) it should not be needed.

theodotos commented 7 years ago

Basically the left pane is white (normally it's black when the editor is active) and it does not respond, neither presents the cursor to start editing.

Look:

screenshot from 2016-09-21 14-39-40

stephane-martin commented 7 years ago

looks like the JS is not loading. with firefox or chrome dev tools you can look at the list of network requests and hopefully see why they fail

theodotos commented 7 years ago

@stephane-martin I saw your reply on #168:

yes it's better to expose realms at the root of the domain, some things break when you try to install in /somesubdir

The default dir for data was /tmp/data and for db it was /tmp/wiki.db! I don't think it's a good idea to keep those.

theodotos commented 7 years ago

Nothing interesting in the javascrpt console:

Use of getPreventDefault() is deprecated.  Use defaultPrevented instead.

But I do get a lot of CSS errors:

Unknown pseudo-class or pseudo-element '-webkit-inner-spin-button'.  Ruleset ignored due to bad selector.bootstrap.css:161:22
Unknown pseudo-class or pseudo-element '-webkit-search-cancel-button'.  Ruleset ignored due to bad selector.bootstrap.css:171:22
Unknown property 'orphans'.  Declaration dropped.bootstrap.css:241:11
Unknown property 'widows'.  Declaration dropped.bootstrap.css:242:10
Unknown property '-moz-osx-font-smoothing'.  Declaration dropped.bootstrap.css:284:25
Expected color but found 'auto'.  Expected color but found '-webkit-focus-ring-color'.  Expected end of value but found '-webkit-focus-ring-color'.  Error in parsing value for 'outline'.  Declaration dropped.bootstrap.css:1114:15
Expected end of value but found '\9 '.  Error in parsing value for 'margin-top'.  Declaration dropped.bootstrap.css:2527:18
Expected color but found 'auto'.  Expected color but found '-webkit-focus-ring-color'.  Expected end of value but found '-webkit-focus-ring-color'.  Error in parsing value for 'outline'.  Declaration dropped.bootstrap.css:2545:15
Unknown pseudo-class or pseudo-element '-ms-input-placeholder'.  Ruleset ignored due to bad selector.bootstrap.css:2583:14
Unknown pseudo-class or pseudo-element '-webkit-input-placeholder'.  Ruleset ignored due to bad selector.bootstrap.css:2586:15
Unknown pseudo-class or pseudo-element '-ms-expand'.  Ruleset ignored due to bad selector.bootstrap.css:2589:15
Expected media feature name but found '-webkit-min-device-pixel-ratio'.bootstrap.css:2609:19
Expected end of value but found '\9 '.  Error in parsing value for 'margin-top'.  Declaration dropped.bootstrap.css:2661:18
Unknown property 'touch-action'.  Declaration dropped.bootstrap.css:3016:18
Unknown property 'user-select'.  Declaration dropped.bootstrap.css:3028:13
Expected color but found 'auto'.  Expected color but found '-webkit-focus-ring-color'.  Expected end of value but found '-webkit-focus-ring-color'.  Error in parsing value for 'outline'.  Declaration dropped.bootstrap.css:3037:15
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:3058:10
Expected color but found '\9 '.  Expected end of value but found '\9 '.  Error in parsing value for 'border-top'.  Declaration dropped.bootstrap.css:3516:24
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:3592:10
Expected color but found '\9 '.  Expected end of value but found '\9 '.  Error in parsing value for 'border-bottom'.  Declaration dropped.bootstrap.css:3633:27
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5159:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5160:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5175:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5176:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5183:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5184:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5191:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5192:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5199:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:5200:20
Unknown property 'zoom'.  Declaration dropped.bootstrap.css:5211:6
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:5856:10
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:5864:10
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:5935:10
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:5939:10
Unknown property 'line-break'.  Declaration dropped.bootstrap.css:6004:12
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:6017:10
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:6021:10
Unknown property 'line-break'.  Declaration dropped.bootstrap.css:6122:12
Expected media feature name but found 'transform-3d'.bootstrap.css:6261:16
Expected media feature name but found '-webkit-transform-3d'.bootstrap.css:6261:32
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:6328:10
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:6336:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:6337:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:6338:20
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:6341:10
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:6346:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:6347:20
Error in parsing value for 'background-image'.  Declaration dropped.bootstrap.css:6348:20
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:6351:10
Expected 'none', URL, or filter function but found 'alpha('.  Error in parsing value for 'filter'.  Declaration dropped.bootstrap.css:6359:10
Expected end of value but found '\9 '.  Error in parsing value for 'background-color'.  Declaration dropped.bootstrap.css:6414:25
Error in parsing value for 'background'.  Declaration dropped.dataTables.bootstrap.css:235:16
Error in parsing value for 'background'.  Declaration dropped.dataTables.bootstrap.css:236:16
Error in parsing value for 'background'.  Declaration dropped.dataTables.bootstrap.css:238:16
Error in parsing value for 'background'.  Declaration dropped.dataTables.bootstrap.css:239:16
Unknown property '-moz-box-shadow'.  Declaration dropped.style.css:97:17
Unknown property '-moz-border-radius'.  Declaration dropped.style.css:100:20
Unknown property '-moz-opacity'.  Declaration dropped.style.css:147:14
Unknown property '-moz-osx-font-smoothing'.  Declaration dropped.font-awesome.css:20:25
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.font-awesome.css:121:10
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.font-awesome.css:127:10
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.font-awesome.css:133:10
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.font-awesome.css:139:10
Expected 'none', URL, or filter function but found 'progid'.  Error in parsing value for 'filter'.  Declaration dropped.font-awesome.css:145:10

jaycuse commented 7 years ago

I'm having the same issue. It looks like it's trying to load the following files and failing because they are not present in the static directory.

/static/wiki/js/aced.js
/static/wiki/js/editor.js
/static/wiki/js/collaboration/main.js
/static/wiki/js/collaboration/togetherjs.js

The files are also not present in the current git repo https://github.com/scragg0x/realms-wiki/tree/master/realms/static

Also, just a note that I followed all the install instructions. Not sure if these files are supposed to get generated during the install but they haven't for me.

virtadpt commented 6 years ago

I just ran into this, too. I had to create some directories and copy over those Javascript files manually to make it work:

cd env/lib/python2.7/site-packages/realms/static/
mkdir -p wiki/js/collaboration/
cp /home/wiki/env/lib/python2.7/site-packages/realms/modules/wiki/static/js/aced.js .
cp /home/wiki/env/lib/python2.7/site-packages/realms/modules/wiki/static/js/editor.js .
cd collaboration/
cp /home/wiki/env/lib/python2.7/site-packages/realms/modules/wiki/static/js/collaboration/main.js .
cp /home/wiki/env/lib/python2.7/site-packages/realms/modules/wiki/static/js/collaboration/togetherjs.js .

(Note: I'm not running Realms Wiki from a subdirectory, I have it proxied with Nginx to / of a vhost.)

jelmer commented 6 years ago

@jpalczewski can you put your modifications up somewhere?

jpalczewski commented 6 years ago

@jelmer unfortunately I played with realms ages ago and don't have my edited copy anywhere, but maybe @stephane-martin can provide one with his fixes.

scragg0x / realms-wiki