v5.63

Updated ChangeLog.
Fixed SMTP by reverting MAIL_SERVICE changes.
2021-10-07 09:31:38 +03:00 · 2021-10-07 08:50:42 +03:00 · 2021-10-07 08:47:10 +03:00 · 2021-10-07 08:46:32 +03:00 · 2021-10-05 20:53:50 +03:00 · 2021-10-05 20:51:00 +03:00
519 changed files with 117876 additions and 68054 deletions
@@ -1,5 +1,12 @@
 { 
  "presets": [ 
    "@babel/preset-stage-3" 
-  ]
+  ],
+  "env": {
+    "COVERAGE": {
+      "plugins": [
+        "istanbul"
+      ]
+    }
+  }
 }
@@ -1,16 +1,12 @@
-FROM quay.io/wekan/ubuntu:groovy-20201125.2
+FROM quay.io/wekan/ubuntu:groovy-20210115
 LABEL maintainer="sgr"

-# 2020-12-03:
-# - Above Ubuntu base image copied from Docker Hub ubuntu:groovy-20201125.2
-#   to Quay to avoid Docker Hub rate limits.
-
-ENV BUILD_DEPS="gnupg gosu bsdtar wget curl bzip2 g++ build-essential python git ca-certificates iproute2"
+ENV BUILD_DEPS="gnupg gosu libarchive-tools wget curl bzip2 g++ build-essential python git ca-certificates iproute2"
 ENV DEBIAN_FRONTEND=noninteractive

 ENV \
    DEBUG=false \
-    NODE_VERSION=v12.20.1 \
+    NODE_VERSION=v12.22.6 \
    METEOR_RELEASE=1.10.2 \
    USE_EDGE=false \
    METEOR_EDGE=1.5-beta.17 \
@@ -19,6 +15,7 @@ ENV \
    ARCHITECTURE=linux-x64 \
    SRC_PATH=./ \
    WITH_API=true \
+    RESULTS_PER_PAGE="" \
    ACCOUNTS_LOCKOUT_KNOWN_USERS_FAILURES_BEFORE=3 \
    ACCOUNTS_LOCKOUT_KNOWN_USERS_PERIOD=60 \
    ACCOUNTS_LOCKOUT_KNOWN_USERS_FAILURE_WINDOW=15 \
@@ -133,23 +130,24 @@ ENV \
    SAML_PUBLIC_CERTFILE="" \
    SAML_IDENTIFIER_FORMAT="" \
    SAML_LOCAL_PROFILE_MATCH_ATTRIBUTE="" \
-    SAML_ATTRIBUTES=""
+    SAML_ATTRIBUTES="" \
+    DEFAULT_WAIT_SPINNER=""

 # Install OS
 RUN set -o xtrace \
  && useradd --user-group -m --system --home-dir /home/wekan wekan \
  && apt-get update \
-	&& apt-get install --assume-yes --no-install-recommends apt-utils apt-transport-https ca-certificates 2>&1 \
-	&& apt-get install --assume-yes --no-install-recommends ${BUILD_DEPS}
+  && apt-get install --assume-yes --no-install-recommends apt-utils apt-transport-https ca-certificates 2>&1 \
+  && apt-get install --assume-yes --no-install-recommends ${BUILD_DEPS}

 # Install NodeJS
 RUN set -o xtrace \
  && cd /tmp \
-  && curl -fsSLO --compressed "https://nodejs.org/dist/v$NODE_VERSION/node-v$NODE_VERSION-$ARCHITECTURE.tar.xz" \
-  && curl -fsSLO --compressed "https://nodejs.org/dist/v$NODE_VERSION/SHASUMS256.txt.asc" \
-  && grep " node-v$NODE_VERSION-$ARCHITECTURE.tar.xz\$" SHASUMS256.txt.asc | sha256sum -c - \
-  && tar -xJf "node-v$NODE_VERSION-$ARCHITECTURE.tar.xz" -C /usr/local --strip-components=1 --no-same-owner \
-  && rm "node-v$NODE_VERSION-$ARCHITECTURE.tar.xz" SHASUMS256.txt.asc \
+  && curl -fsSLO --compressed "https://nodejs.org/dist/$NODE_VERSION/node-$NODE_VERSION-$ARCHITECTURE.tar.xz" \
+  && curl -fsSLO --compressed "https://nodejs.org/dist/$NODE_VERSION/SHASUMS256.txt.asc" \
+  && grep " node-$NODE_VERSION-$ARCHITECTURE.tar.xz\$" SHASUMS256.txt.asc | sha256sum -c - \
+  && tar -xJf "node-$NODE_VERSION-$ARCHITECTURE.tar.xz" -C /usr/local --strip-components=1 --no-same-owner \
+  && rm "node-$NODE_VERSION-$ARCHITECTURE.tar.xz" SHASUMS256.txt.asc \
  && ln -s /usr/local/bin/node /usr/local/bin/nodejs \
  && mkdir -p /usr/local/lib/node_modules/fibers/.node-gyp /root/.node-gyp/${NODE_VERSION} /home/wekan/.config \
  && npm install -g npm@${NPM_VERSION} \
@@ -171,17 +169,65 @@ RUN set -o xtrace \

 ENV PATH=$PATH:/home/wekan/.meteor/

-# Copy source dir
 USER root

 RUN echo "export PATH=$PATH" >> /etc/environment

-RUN set -o xtrace \
-  && mkdir /home/wekan/app
+USER wekan

-COPY ${SRC_PATH} /home/wekan/app/
+# Copy source dir
+RUN set -o xtrace \
+  && mkdir -p /home/wekan/app/.meteor \
+  && mkdir -p /home/wekan/app/packages
+
+COPY \
+    .meteor/.finished-upgraders \
+    .meteor/.id \
+    .meteor/cordova-plugins \
+    .meteor/packages \
+    .meteor/platforms \
+    .meteor/release \
+    .meteor/versions \
+    /home/wekan/app/.meteor/
+
+COPY \
+    package.json \
+    settings.json \
+    /home/wekan/app/
+
+COPY \
+    packages \
+    /home/wekan/app/packages/
+
+USER root

 RUN set -o xtrace \
  && chown -R wekan:wekan /home/wekan/app /home/wekan/.meteor

 USER wekan
+
+RUN \
+    set -o xtrace && \
+    sed -i 's/api\.versionsFrom/\/\/api.versionsFrom/' /home/wekan/app/packages/meteor-useraccounts-core/package.js && \
+    cd /home/wekan/.meteor && \
+    /home/wekan/.meteor/meteor -- help;
+
+RUN \
+    set -o xtrace && \
+    # Build app
+    cd /home/wekan/app && \
+    /home/wekan/.meteor/meteor add standard-minifier-js && \
+    /home/wekan/.meteor/meteor npm install && \
+    /home/wekan/.meteor/meteor build --directory /home/wekan/app_build
+
+RUN \
+    set -o xtrace && \
+    cd /home/wekan/app_build/bundle/programs/server/ && \
+    chmod u+w package.json npm-shrinkwrap.json && \
+    npm install
+
+ENV PORT=3000
+EXPOSE $PORT
+WORKDIR /home/wekan/app
+
+CMD ["/home/wekan/.meteor/meteor", "run", "--verbose", "--settings", "settings.json"]
@@ -3,17 +3,18 @@ version: '3.7'
 services:

  wekandb-dev:
-    image: mongo:4.0.12
+    image: mongo:4.4
    container_name: wekan-dev-db
    restart: unless-stopped
-    command: mongod --smallfiles --oplogSize 128
+    command: mongod --oplogSize 128
    networks:
      - wekan-dev-tier
    expose:
      - 27017
    volumes:
-      - wekan-dev-db:/data/db
-      - wekan-dev-db-dump:/dump
+      - ./volumes/wekan-db:/data/db
+      - ./volumes/wekan-db-dump:/dump
+      - /etc/localtime:/etc/localtime:ro

  wekan-dev:
    container_name: wekan-dev-app
@@ -35,9 +36,13 @@ services:
    depends_on:
      - wekandb-dev
    volumes:
-      - ..:/app:delegated
-    command:
-      sleep infinity
+      - ../client:/home/wekan/app/client
+      - ../models:/home/wekan/app/models
+      - ../config:/home/wekan/app/config
+      - ../i18n:/home/wekan/app/i18n
+      - ../server:/home/wekan/app/server
+      - ../public:/home/wekan/app/public
+      - /etc/localtime:/etc/localtime:ro

 volumes:
  wekan-dev-db:
@@ -0,0 +1,36 @@
+*~
+*.swp
+.meteor-spk
+*.sublime-workspace
+tmp/
+node_modules/
+npm-debug.log
+.gitmodules
+.vscode/
+.idea/
+.build/*
+**/parts/
+**/stage
+**/prime
+**/*.snap
+snap/.snapcraft/
+.idea
+.DS_Store
+.DS_Store?
+.build*
+*.browserify.js.cached
+*.browserify.js.map
+.build*
+versions.json
+.versions
+.npm
+.build*
+._*
+.Trashes
+Thumbs.db
+ehthumbs.db
+.eslintcache
+.meteor/local
+.devcontainer/docker-compose.extend.yml
+.devcontainer/volumes*/
+.git
@@ -122,6 +122,7 @@
    "Activities": true,
    "Attachments": true,
    "Boards": true,
+    "CardCommentReactions": true,
    "CardComments": true,
    "DatePicker": true,
    "Cards": true,
@@ -156,6 +157,7 @@
    "Integrations": true,
    "HTTP": true,
    "AccountSettings": true,
+    "TableVisibilityModeSettings": true,
    "Announcements": true,
    "Swimlanes": true,
    "ChecklistItems": true,
@@ -81,7 +81,7 @@ parts:
    wekan:
        source: .
        plugin: nodejs
-        node-engine: 12.20.1
+        node-engine: 12.22.6
        node-packages:
            - node-gyp
            - node-pre-gyp
@@ -5,7 +5,7 @@ echo "      with 'sudo dpkg-reconfigure locales' , so that MongoDB works correct
 echo "      You can still use any other locale as your main locale."

 #Below script installs newest node 8.x for Debian/Ubuntu/Mint.
-#NODE_VERSION=12.18.2
+#NODE_VERSION=12.21.0
 #X64NODE="https://nodejs.org/dist/v${NODE_VERSION}/node-v${NODE_VERSION}-linux-x64.tar.gz"

 function pause(){
@@ -80,7 +80,7 @@ do
 			curl -0 -L https://npmjs.org/install.sh | sudo sh
 			sudo chown -R $(id -u):$(id -g) $HOME/.npm
 			sudo npm -g install n
-			sudo n 12.18.2
+			sudo n 12.21.0
 			#curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
 			#sudo apt-get install -y nodejs
 		elif [[ "$OSTYPE" == "darwin"* ]]; then
@@ -83,7 +83,7 @@ parts:
    wekan:
        source: .
        plugin: nodejs
-        node-engine: 12.20.1
+        node-engine: 12.22.6
        node-packages:
            - node-gyp
            - node-pre-gyp
@@ -1,8 +1,16 @@
 ## Issue

+Note: With Docker, please don't use latest tag. Only use release tags.
+See https://github.com/wekan/wekan/issues/3874
+
+If you can not login for any reason:
+- https://github.com/wekan/wekan/wiki/Forgot-Password
+
+Email settings:
+- https://github.com/wekan/wekan/wiki/Troubleshooting-Mail
+
 Add these issues to elsewhere:
- Snap: https://github.com/wekan/wekan-snap/issues
- LDAP: https://github.com/wekan/wekan-ldap/issues
+- SECURITY ISSUES: https://github.com/wekan/wekan/blob/master/SECURITY.md
 - UCS: https://github.com/wekan/univention/issues

 Other Wekan issues can be added here.
@@ -0,0 +1,63 @@
+name: Docker
+
+# This workflow uses actions that are not certified by GitHub.
+# They are provided by a third-party and are governed by
+# separate terms of service, privacy policy, and support
+# documentation.
+
+on:
+  schedule:
+    - cron: '28 23 * * *'
+  push:
+    branches: [ master ]
+    # Publish semver tags as releases.
+    tags: [ 'v*.*.*' ]
+  pull_request:
+    branches: [ master ]
+
+env:
+  # Use docker.io for Docker Hub if empty
+  REGISTRY: ghcr.io
+  # github.repository as <account>/<repo>
+  IMAGE_NAME: ${{ github.repository }}
+
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+
+      # Login against a Docker registry except on PR
+      # https://github.com/docker/login-action
+      - name: Log into registry ${{ env.REGISTRY }}
+        if: github.event_name != 'pull_request'
+        uses: docker/login-action@28218f9b04b4f3f62068d7b6ce6ca5b26e35336c
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      # Extract metadata (tags, labels) for Docker
+      # https://github.com/docker/metadata-action
+      - name: Extract Docker metadata
+        id: meta
+        uses: docker/metadata-action@98669ae865ea3cffbcbaa878cf57c20bbf1c6c38
+        with:
+          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
+
+      # Build and push Docker image with Buildx (don't push on PR)
+      # https://github.com/docker/build-push-action
+      - name: Build and push Docker image
+        uses: docker/build-push-action@ad44023a93711e3deb337508980b4b5e9bcdc5dc
+        with:
+          context: .
+          push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
@@ -0,0 +1,160 @@
+name: Test suite
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+
+jobs:
+# the following are optional jobs and need to be configured according
+# to this project's settings:
+#
+#  lintcode:
+#    name: Javascript lint
+#    runs-on: ubuntu-latest
+#    steps:
+#    - name: checkout
+#      uses: actions/checkout@v2
+#
+#    - name: setup node
+#      uses: actions/setup-node@v1
+#      with:
+#        node-version: '12.x'
+#
+#    - name: cache dependencies
+#      uses: actions/cache@v1
+#      with:
+#        path: ~/.npm
+#        key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+#        restore-keys: |
+#          ${{ runner.os }}-node-
+#
+#    - run: npm install
+#    - run: npm run lint:code
+#
+#  lintstyle:
+#    name: SCSS lint
+#    runs-on: ubuntu-latest
+#    needs: [lintcode]
+#    steps:
+#    - name: checkout
+#      uses: actions/checkout@v2
+#
+#    - name: setup node
+#      uses: actions/setup-node@v1
+#      with:
+#        node-version: '12.x'
+#
+#    - name: cache dependencies
+#      uses: actions/cache@v1
+#      with:
+#        path: ~/.npm
+#        key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+#        restore-keys: |
+#          ${{ runner.os }}-node-
+#    - run: npm install
+#    - run: npm run lint:style
+#
+#  lintdocs:
+#    name: documentation lint
+#    runs-on: ubuntu-latest
+#    needs: [lintcode,lintstyle]
+#    steps:
+#    - name: checkout
+#      uses: actions/checkout@v2
+#
+#    - name: setup node
+#      uses: actions/setup-node@v1
+#      with:
+#        node-version: '12.x'
+#
+#    - name: cache dependencies
+#      uses: actions/cache@v1
+#      with:
+#        path: ~/.npm
+#        key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+#        restore-keys: |
+#          ${{ runner.os }}-node-
+#
+#    - run: npm install
+#    - run: npm run lint:markdown
+
+  tests:
+    name: Meteor ${{ matrix.meteor }} tests
+    runs-on: ubuntu-latest
+    steps:
+
+      # CHECKOUTS
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      # CACHING
+      - name: Install Meteor
+        id: cache-meteor-install
+        uses: actions/cache@v2
+        with:
+          path: ~/.meteor
+          key: v1-meteor-${{ hashFiles('.meteor/versions') }}
+          restore-keys: |
+                v1-meteor-
+
+      - name: Cache NPM dependencies
+        id: cache-meteor-npm
+        uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: v1-npm-${{ hashFiles('package-lock.json') }}
+          restore-keys: |
+                v1-npm-
+
+      - name: Cache Meteor build
+        id: cache-meteor-build
+        uses: actions/cache@v2
+        with:
+          path: |
+            .meteor/local/resolver-result-cache.json
+            .meteor/local/plugin-cache
+            .meteor/local/isopacks
+            .meteor/local/bundler-cache/scanner
+          key: v1-meteor_build_cache-${{ github.ref }}-${{ github.sha }}
+          restore-key: |
+            v1-meteor_build_cache-
+
+      - name: Setup meteor
+        uses: meteorengineer/setup-meteor@v1
+        with:
+          meteor-release: '2.2'
+
+      - name: Install NPM Dependencies
+        run: meteor npm ci
+
+      - name: Run Tests
+        run: sh ./test-wekan.sh -cv
+
+      - name: Upload coverage
+        uses: actions/upload-artifact@v2
+        with:
+          name: coverage-folder
+          path: .coverage/
+
+  coverage:
+    name: Coverage report
+    runs-on: ubuntu-latest
+    needs: [tests]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Download coverage
+        uses: actions/download-artifact@v2
+        with:
+          name: coverage-folder
+          path: .coverage/
+
+
+      - name: Coverage Report
+        uses: VeryGoodOpenSource/very_good_coverage@v1.1.1
+        with:
+          path: ".coverage/lcov.info"
+          min_coverage: 1 # TODO add tests and increase to 95!
@@ -31,5 +31,10 @@ Thumbs.db
 ehthumbs.db
 .eslintcache
 .meteor/local
-.meteor-1.6-snap/.meteor/local
 .devcontainer/docker-compose.extend.yml
+.devcontainer/volumes*/
+.coverage
+
+# Helm chart
+# Chart dependencies
+/helm/wekan/**/*.tgz
@@ -6,7 +6,7 @@
 meteor-base@1.4.0

 # Build system
-ecmascript@0.15.0
+ecmascript@0.15.1
 standard-minifier-css@1.7.2
 standard-minifier-js@2.6.0
 mquandalle:jade
@@ -17,13 +17,13 @@ es5-shim@4.8.0

 # Collections
 aldeed:collection2
-cfs:standard-packages
+wekan-cfs-standard-packages
 cottz:publish-relations
 dburles:collection-helpers
 idmontie:migrations
 matb33:collection-hooks
 matteodem:easy-search
-mongo@1.10.1
+mongo@1.11.0
 mquandalle:collection-mutations

 # Account system
@@ -52,6 +52,7 @@ mquandalle:autofocus
 ongoworks:speakingurl
 raix:handlebar-helpers
 tap:i18n
+http@1.4.2

 # UI components
 blaze
@@ -74,7 +75,7 @@ horka:swipebox
 dynamic-import@0.6.0

 accounts-password@1.7.0
-cfs:gridfs
+wekan-cfs-gridfs
 rzymek:fullcalendar
 momentjs:moment@2.22.2
 browser-policy-framing@1.1.0
@@ -82,7 +83,6 @@ mquandalle:moment
 msavin:usercache
 # Keep stylus in 1.1.0, because building v2 takes extra 52 minutes.
 coagmano:stylus@1.1.0!
-lucasantoniassi:accounts-lockout
 meteorhacks:subs-manager
 meteorhacks:picker
 lamhieu:unblock
@@ -90,9 +90,7 @@ meteorhacks:aggregate@1.3.0
 wekan-markdown
 konecty:mongo-counter
 percolate:synced-cron
-easylogic:summernote
-cfs:filesystem
-tmeasday:check-npm-versions
+wekan-cfs-filesystem
 steffo:meteor-accounts-saml
 rajit:bootstrap3-datepicker-fi
 rajit:bootstrap3-datepicker-ar
@@ -144,4 +142,8 @@ rajit:bootstrap3-datepicker-zh-cn
 rajit:bootstrap3-datepicker-zh-tw
 staringatlights:fast-render
 spacebars
-jkuester:http
+easylogic:summernote
+pascoual:pdfkit
+wekan-accounts-lockout
+lmieulet:meteor-coverage
+meteortesting:mocha
@@ -1 +1 @@
-METEOR@2.0
+METEOR@2.2
@@ -1,7 +1,7 @@
 3stack:presence@1.1.2
-accounts-base@1.8.0
+accounts-base@1.9.0
 accounts-oauth@1.2.0
-accounts-password@1.7.0
+accounts-password@1.7.1
 aldeed:collection2@2.10.0
 aldeed:collection2-core@1.2.0
 aldeed:schema-deny@1.1.0
@@ -11,36 +11,19 @@ allow-deny@1.1.0
 arillo:flow-router-helpers@0.5.2
 audit-argument-checks@1.0.7
 autoupdate@1.7.0
-babel-compiler@7.6.0
+babel-compiler@7.6.1
 babel-runtime@1.5.0
 base64@1.0.12
 binary-heap@1.0.11
-blaze@2.3.4
-blaze-tools@1.0.10
+blaze@2.5.0
+blaze-tools@1.1.2
 boilerplate-generator@1.7.1
 browser-policy-common@1.0.11
 browser-policy-framing@1.1.0
 caching-compiler@1.2.2
-caching-html-compiler@1.1.3
+caching-html-compiler@1.2.0
 callback-hook@1.3.0
-cfs:access-point@0.1.49
-cfs:base-package@0.0.30
-cfs:collection@0.5.5
-cfs:collection-filters@0.2.4
-cfs:data-man@0.0.6
-cfs:file@0.1.17
-cfs:filesystem@0.1.2
-cfs:gridfs@0.0.34
 cfs:http-methods@0.0.32
-cfs:http-publish@0.0.13
-cfs:power-queue@0.9.11
-cfs:reactive-list@0.0.9
-cfs:reactive-property@0.0.4
-cfs:standard-packages@0.5.10
-cfs:storage-adapter@0.2.4
-cfs:tempstore@0.1.6
-cfs:upload-http@0.0.20
-cfs:worker@0.1.5
 check@1.3.1
 chuangbo:cookie@1.1.0
 coagmano:stylus@1.1.0
@@ -49,18 +32,18 @@ coffeescript-compiler@2.4.1
 cottz:publish-relations@2.0.8
 dburles:collection-helpers@1.1.0
 ddp@1.4.0
-ddp-client@2.4.0
+ddp-client@2.4.1
 ddp-common@1.4.0
 ddp-rate-limiter@1.0.9
-ddp-server@2.3.2
+ddp-server@2.3.3
 deps@1.0.12
 diff-sequence@1.1.1
 dynamic-import@0.6.0
 easylogic:summernote@0.8.8
-ecmascript@0.15.0
+ecmascript@0.15.1
 ecmascript-runtime@0.7.0
-ecmascript-runtime-client@0.11.0
-ecmascript-runtime-server@0.10.0
+ecmascript-runtime-client@0.11.1
+ecmascript-runtime-server@0.10.1
 ejson@1.1.1
 email@2.0.0
 es5-shim@4.8.0
@@ -70,13 +53,12 @@ fortawesome:fontawesome@4.7.0
 geojson-utils@1.0.10
 horka:swipebox@1.0.2
 hot-code-push@1.0.4
-html-tools@1.0.11
-htmljs@1.0.11
-http@1.4.3
-id-map@1.1.0
+html-tools@1.1.2
+htmljs@1.1.1
+http@1.4.4
+id-map@1.1.1
 idmontie:migrations@1.0.3
 inter-process-messaging@0.1.1
-jkuester:http@2.0.1
 jquery@1.11.11
 kadira:blaze-layout@2.3.0
 kadira:dochead@1.5.0
@@ -85,11 +67,11 @@ kenton:accounts-sandstorm@0.7.0
 konecty:mongo-counter@0.0.5_3
 lamhieu:meteorx@2.1.1
 lamhieu:unblock@1.0.0
-launch-screen@1.2.0
+launch-screen@1.2.1
 livedata@1.0.18
+lmieulet:meteor-coverage@3.2.0
 localstorage@1.2.0
 logging@1.2.0
-lucasantoniassi:accounts-lockout@1.0.0
 matb33:collection-hooks@0.9.1
 matteodem:easy-search@1.6.4
 mdg:validation-error@0.5.1
@@ -101,19 +83,22 @@ meteorhacks:collection-utils@1.2.0
 meteorhacks:picker@1.0.3
 meteorhacks:subs-manager@1.6.4
 meteorspark:util@0.2.0
-minifier-css@1.5.3
+meteortesting:browser-tests@1.3.4
+meteortesting:mocha@2.0.1
+meteortesting:mocha-core@8.0.1
+minifier-css@1.5.4
 minifier-js@2.6.0
 minifiers@1.1.8-faster-rebuild.0
-minimongo@1.6.1
+minimongo@1.6.2
 mobile-status-bar@1.1.0
 modern-browsers@0.1.5
 modules@0.16.0
 modules-runtime@0.12.0
 momentjs:moment@2.29.1
-mongo@1.10.1
+mongo@1.11.1
 mongo-decimal@0.1.2
 mongo-dev-server@1.1.0
-mongo-id@1.0.7
+mongo-id@1.0.8
 mongo-livedata@1.0.12
 mousetrap:mousetrap@1.4.6_1
 mquandalle:autofocus@1.0.0
@@ -125,13 +110,14 @@ mquandalle:jquery-ui-drag-drop-sort@0.2.0
 mquandalle:moment@1.0.1
 mquandalle:mousetrap-bindglobal@0.0.1
 msavin:usercache@1.8.0
-npm-bcrypt@0.9.3
-npm-mongo@3.8.1
+npm-bcrypt@0.9.4
+npm-mongo@3.9.0
 oauth@1.3.2
 oauth2@1.3.0
 observe-sequence@1.0.16
 ongoworks:speakingurl@1.1.0
 ordered-dict@1.1.0
+pascoual:pdfkit@1.0.7
 peerlibrary:assert@0.3.0
 peerlibrary:base-component@0.16.0
 peerlibrary:blaze-components@0.15.1
@@ -192,7 +178,7 @@ rajit:bootstrap3-datepicker-zh-cn@1.7.1
 rajit:bootstrap3-datepicker-zh-tw@1.7.1
 random@1.2.0
 rate-limit@1.0.9
-react-fast-refresh@0.1.0
+react-fast-refresh@0.1.1
 reactive-dict@1.3.0
 reactive-var@1.0.11
 reload@1.3.1
@@ -209,10 +195,10 @@ simple:json-routes@2.1.0
 simple:rest-accounts-password@1.1.2
 simple:rest-bearer-token-parser@1.0.1
 simple:rest-json-error-handler@1.0.1
-socket-stream-client@0.3.1
+socket-stream-client@0.3.3
 softwarerero:accounts-t9n@1.3.11
-spacebars@1.0.15
-spacebars-compiler@1.1.3
+spacebars@1.2.0
+spacebars-compiler@1.2.1
 srp@1.1.0
 standard-minifier-css@1.7.2
 standard-minifier-js@2.6.0
@@ -221,24 +207,42 @@ staringatlights:inject-data@2.3.0
 steffo:meteor-accounts-saml@0.0.18
 tap:i18n@1.8.2
 templates:tabs@2.3.0
-templating@1.3.2
-templating-compiler@1.3.3
-templating-runtime@1.3.2
-templating-tools@1.1.2
-tmeasday:check-npm-versions@0.3.2
+templating@1.4.0
+templating-compiler@1.4.1
+templating-runtime@1.4.0
+templating-tools@1.2.0
 tracker@1.2.0
 twbs:bootstrap@3.3.6
 ui@1.0.13
 underscore@1.0.10
-url@1.3.1
+url@1.3.2
 useraccounts:core@1.14.2
 useraccounts:flow-routing@1.14.2
 useraccounts:unstyled@1.14.2
 verron:autosize@3.0.8
-webapp@1.10.0
+webapp@1.10.1
 webapp-hashing@1.1.0
 wekan-accounts-cas@0.1.0
+wekan-accounts-lockout@1.0.0
 wekan-accounts-oidc@1.0.10
+wekan-cfs-access-point@0.1.50
+wekan-cfs-base-package@0.0.30
+wekan-cfs-collection@0.5.5
+wekan-cfs-collection-filters@0.2.4
+wekan-cfs-data-man@0.0.6
+wekan-cfs-file@0.1.17
+wekan-cfs-filesystem@0.1.2
+wekan-cfs-gridfs@0.0.34
+wekan-cfs-http-methods@0.0.32
+wekan-cfs-http-publish@0.0.13
+wekan-cfs-power-queue@0.9.11
+wekan-cfs-reactive-list@0.0.9
+wekan-cfs-reactive-property@0.0.4
+wekan-cfs-standard-packages@0.5.10
+wekan-cfs-storage-adapter@0.2.4
+wekan-cfs-tempstore@0.1.6
+wekan-cfs-upload-http@0.0.21
+wekan-cfs-worker@0.1.5
 wekan-ldap@0.0.2
 wekan-markdown@1.0.9
 wekan-oidc@1.0.12
@@ -3,7 +3,7 @@ sudo: required

 env:
  TRAVIS_DOCKER_COMPOSE_VERSION: 1.24.0
-  TRAVIS_NODE_VERSION: 12.20.1
+  TRAVIS_NODE_VERSION: 12.22.6
  TRAVIS_NPM_VERSION: latest

 before_install:
@@ -39,7 +39,7 @@ host = https://www.transifex.com
 # tap:i18n requires us to use `-` separator in the language identifiers whereas
 # Transifex uses a `_` separator, without an option to customize it on one side
 # or the other, so we need to do a Manual mapping.
-lang_map = ar_EG:ar-EG, bg_BG:bg, en_GB:en-GB, es_AR:es-AR, es_CL:es-CL, es_PE:es-PE, es_MX:es-MX, es_TX:es-TX, es_PY:es-PY, el_GR:el, fi_FI:fi, hu_HU:hu, id_ID:id, mn_MN:mn, no:nb, lv_LV:lv, pt_BR:pt-BR, ro_RO:ro, sl_SI:sl, zh_CN:zh-CN, zh_TW:zh-TW, zh_HK:zh-HK
+lang_map = ar_EG:ar-EG, bg_BG:bg, de_CH:de-CH, en_IT:en-IT, en_GB:en-GB, es_AR:es-AR, es_CL:es-CL, es_419:es-LA, es_PE:es-PE, es_MX:es-MX, es_TX:es-TX, es_PY:es-PY, el_GR:el, fa_IR:fa-IR, fi_FI:fi, fr_CH:fr-CH, hu_HU:hu, id_ID:id, mn_MN:mn, lv_LV:lv, pt_BR:pt-BR, ro_RO:ro, sl_SI:sl, zh_CN:zh-CN, zh_TW:zh-TW, zh_Hans:zh-Hans, zh_HK:zh-HK

 [wekan.application]
 file_filter = i18n/<lang>.i18n.json
@@ -1,8 +1,8 @@
-FROM quay.io/wekan/ubuntu:groovy-20210115
+FROM quay.io/wekan/ubuntu:hirsute-20210825
 LABEL maintainer="wekan"

-# 2020-12-03:
-# - Above Ubuntu base image copied from Docker Hub ubuntu:groovy-20201125.2
+# 2021-09-18:
+# - Above Ubuntu base image copied from Docker Hub ubuntu:hirsute-20210825
 #   to Quay to avoid Docker Hub rate limits.

 # Set the environment variables (defaults where required)
@@ -12,7 +12,7 @@ ARG DEBIAN_FRONTEND=noninteractive

 ENV BUILD_DEPS="apt-utils libarchive-tools gnupg gosu wget curl bzip2 g++ build-essential git ca-certificates python3" \
    DEBUG=false \
-    NODE_VERSION=v12.20.1 \
+    NODE_VERSION=v12.22.6 \
    METEOR_RELEASE=1.10.2 \
    USE_EDGE=false \
    METEOR_EDGE=1.5-beta.17 \
@@ -21,6 +21,7 @@ ENV BUILD_DEPS="apt-utils libarchive-tools gnupg gosu wget curl bzip2 g++ build-
    ARCHITECTURE=linux-x64 \
    SRC_PATH=./ \
    WITH_API=true \
+    RESULTS_PER_PAGE="" \
    ACCOUNTS_LOCKOUT_KNOWN_USERS_FAILURES_BEFORE=3 \
    ACCOUNTS_LOCKOUT_KNOWN_USERS_PERIOD=60 \
    ACCOUNTS_LOCKOUT_KNOWN_USERS_FAILURE_WINDOW=15 \
@@ -63,6 +64,9 @@ ENV BUILD_DEPS="apt-utils libarchive-tools gnupg gosu wget curl bzip2 g++ build-
    LDAP_ENABLE=false \
    LDAP_PORT=389 \
    LDAP_HOST="" \
+    LDAP_AD_SIMPLE_AUTH="" \
+    LDAP_USER_AUTHENTICATION=false \
+    LDAP_USER_AUTHENTICATION_FIELD=uid \
    LDAP_BASEDN="" \
    LDAP_LOGIN_FALLBACK=false \
    LDAP_RECONNECT=true \
@@ -80,8 +84,6 @@ ENV BUILD_DEPS="apt-utils libarchive-tools gnupg gosu wget curl bzip2 g++ build-
    LDAP_ENCRYPTION=false \
    LDAP_CA_CERT="" \
    LDAP_REJECT_UNAUTHORIZED=false \
-    LDAP_USER_AUTHENTICATION=false \
-    LDAP_USER_AUTHENTICATION_FIELD=uid \
    LDAP_USER_SEARCH_FILTER="" \
    LDAP_USER_SEARCH_SCOPE="" \
    LDAP_USER_SEARCH_FIELD="" \
@@ -136,7 +138,8 @@ ENV BUILD_DEPS="apt-utils libarchive-tools gnupg gosu wget curl bzip2 g++ build-
    SAML_IDENTIFIER_FORMAT="" \
    SAML_LOCAL_PROFILE_MATCH_ATTRIBUTE="" \
    SAML_ATTRIBUTES="" \
-    ORACLE_OIM_ENABLED=false
+    ORACLE_OIM_ENABLED=false \
+    WAIT_SPINNER=""

 # Copy the app to the image
 COPY ${SRC_PATH} /home/wekan/app
@@ -306,6 +309,7 @@ RUN \
    apt-get remove --purge -y ${BUILD_DEPS} && \
    apt-get autoremove -y && \
    npm uninstall -g api2html &&\
+    rm -R /tmp* && \
    rm -R /var/lib/apt/lists/* && \
    rm -R /home/wekan/.meteor && \
    rm -R /home/wekan/app && \
@@ -4,16 +4,16 @@ FROM amd64/alpine:3.7 AS builder
 ENV QEMU_VERSION=v4.2.0-6 \
    QEMU_ARCHITECTURE=aarch64 \
    NODE_ARCHITECTURE=linux-arm64 \
-    NODE_VERSION=v12.20.1 \
-    WEKAN_VERSION=3.96  \
+    NODE_VERSION=v12.22.6 \
+    WEKAN_VERSION=latest  \
    WEKAN_ARCHITECTURE=arm64

-     # Install dependencies
-RUN  apk update && apk add ca-certificates outils-sha1 && \
-     \
-     # Download qemu static for our architecture
-     wget https://github.com/multiarch/qemu-user-static/releases/download/${QEMU_VERSION}/qemu-${QEMU_ARCHITECTURE}-static.tar.gz -O - | tar -xz && \
-     \
+    # Install dependencies
+RUN apk update && apk add ca-certificates outils-sha1 && \
+    \
+    # Download qemu static for our architecture
+    wget https://github.com/multiarch/qemu-user-static/releases/download/${QEMU_VERSION}/qemu-${QEMU_ARCHITECTURE}-static.tar.gz -O - | tar -xz && \
+    \
    # Download wekan and shasum
    wget https://releases.wekan.team/raspi3/wekan-${WEKAN_VERSION}-${WEKAN_ARCHITECTURE}.zip && \
    wget https://releases.wekan.team/raspi3/SHA256SUMS.txt && \
@@ -40,7 +40,7 @@ LABEL maintainer="wekan"
 # Set the environment variables (defaults where required)
 ENV QEMU_ARCHITECTURE=aarch64 \
    NODE_ARCHITECTURE=linux-arm64 \
-    NODE_VERSION=v12.20.1 \
+    NODE_VERSION=v12.22.6 \
    NODE_ENV=production \
    NPM_VERSION=latest \
    WITH_API=true \
@@ -1,4 +1,4 @@
-[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/wekan/wekan) 
+[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/wekan/wekan)

 # Wekan - Open Source kanban

@@ -30,9 +30,14 @@ It's better than at chat where details get lost when chat scrolls up.

 [Wekan IRC FAQ](https://github.com/wekan/wekan/wiki/IRC-FAQ)

+## Docker: Please only use Docker release tags
+
+Note: With Docker, please don't use latest tag. Only use release tags.
+See https://github.com/wekan/wekan/issues/3874
+
 ## FAQ

-**NOTE**: 
+**NOTE**:
 - Please read the [FAQ](https://github.com/wekan/wekan/wiki/FAQ) first
 - Please don't feed the [trolls](https://github.com/wekan/wekan/wiki/FAQ#why-am-i-called-a-troll) and [spammers](https://github.com/wekan/wekan/wiki/FAQ#why-am-i-called-a-spammer) that are mentioned in the FAQ :)

@@ -52,7 +57,7 @@ that by providing one-click installation on various platforms.

 - Wekan is used in [most countries of the world](https://snapcraft.io/wekan).
 - Wekan largest user has 13k users using Wekan in their company.
- Wekan has been [translated](https://transifex.com/wekan/wekan) to about 60 languages.
+- Wekan has been [translated](https://transifex.com/wekan/wekan) to about 63 languages.
 - [Features][features]: Wekan has real-time user interface.
 - [Platforms][platforms]: Wekan supports many platforms.
  Wekan is critical part of new platforms Wekan is currently being integrated to.
@@ -64,13 +69,13 @@ that by providing one-click installation on various platforms.
  [More Platforms](https://github.com/wekan/wekan/wiki/Platforms), bundle for RasPi3 ARM and other CPUs where Node.js and MongoDB exists.
 - 1 GB RAM minimum free for Wekan. Production server should have minimum total 4 GB RAM.
  For thousands of users, for example with [Docker](https://github.com/wekan/wekan/blob/master/docker-compose.yml): 3 frontend servers,
-  each having 2 CPU and 2 wekan-app containers. One backend wekan-db server with many CPUs.  
+  each having 2 CPU and 2 wekan-app containers. One backend wekan-db server with many CPUs.
 - Enough disk space and alerts about low disk space. If you run out disk space, MongoDB database gets corrupted.
 - SECURITY: Updating to newest Wekan version very often. Please check you do not have automatic updates of Sandstorm or Snap turned off.
  Old versions have security issues because of old versions Node.js etc. Only newest Wekan is supported.
  Wekan on Sandstorm is not usually affected by any Standalone Wekan (Snap/Docker/Source) security issues.
 - [Reporting all new bugs immediately](https://github.com/wekan/wekan/issues).
-  New features and fixes are added to Wekan [many times a day](https://github.com/wekan/wekan/blob/devel/CHANGELOG.md).
+  New features and fixes are added to Wekan [many times a day](https://github.com/wekan/wekan/blob/master/CHANGELOG.md).
 - [Backups](https://github.com/wekan/wekan/wiki/Backup) of Wekan database once a day miminum.
  Bugs, updates, users deleting list or card, harddrive full, harddrive crash etc can eat your data. There is no undo yet.
  Some bug can cause Wekan board to not load at all, requiring manual fixing of database content.
@@ -82,7 +87,7 @@ that by providing one-click installation on various platforms.
 [Developer Documentation][dev_docs]

 - There is many companies and individuals contributing code to Wekan, to add features and bugfixes
-  [many times a day](https://github.com/wekan/wekan/blob/devel/CHANGELOG.md).
+  [many times a day](https://github.com/wekan/wekan/blob/master/CHANGELOG.md).
 - [Please add Add new Feature Requests and Bug Reports immediately](https://github.com/wekan/wekan/issues).
 - [Commercial Support](https://wekan.team/commercial-support/).

@@ -51,8 +51,8 @@ This also means all Standalone Wekan functionality works in offline local networ
 Wekan is used by companies that have [thousands of users](https://github.com/wekan/wekan/wiki/AWS) and at healthcare.

 Wekan uses xss package for input fields like cards, as you can see from
-[package.json](https://github.com/wekan/wekan/blob/devel/package.json). Other used versions can be seen from
-[Meteor versions file](https://github.com/wekan/wekan/blob/devel/.meteor/versions).
+[package.json](https://github.com/wekan/wekan/blob/master/package.json). Other used versions can be seen from
+[Meteor versions file](https://github.com/wekan/wekan/blob/master/.meteor/versions).
 Forms can include markdown links, html, image tags etc like you see at https://wekan.github.io .
 It's possible to add attachments to cards, and markdown/html links to files.

@@ -69,7 +69,7 @@ access to outside of Wekan grain.
 Standalone Wekan only has password auth currently, there is work in progress to add
 [oauth2](https://github.com/wekan/wekan/pull/1578), [Openid](https://github.com/wekan/wekan/issues/538),
 [LDAP](https://github.com/wekan/wekan/issues/119) etc. If you need more login security for Standalone Wekan now,
-it's possible add additional [Google Auth proxybouncer](https://github.com/wekan/wekan/wiki/Let's-Encrypt-and-Google-Auth) in front of password auth, and then use Google Authenticator for Google Auth. Standalone Wekan does have [brute force protection with eluck:accounts-lockout and browser-policy clickjacking protection](https://github.com/wekan/wekan/blob/devel/CHANGELOG.md#v080-2018-04-04-wekan-release). You can also optionally use some [WAF](https://en.wikipedia.org/wiki/Web_application_firewall)
+it's possible add additional [Google Auth proxybouncer](https://github.com/wekan/wekan/wiki/Let's-Encrypt-and-Google-Auth) in front of password auth, and then use Google Authenticator for Google Auth. Standalone Wekan does have [brute force protection with eluck:accounts-lockout and browser-policy clickjacking protection](https://github.com/wekan/wekan/blob/master/CHANGELOG.md#v080-2018-04-04-wekan-release). You can also optionally use some [WAF](https://en.wikipedia.org/wiki/Web_application_firewall)
 like for example [AWS WAF](https://aws.amazon.com/waf/).

 [All Wekan Platforms](https://github.com/wekan/wekan/wiki/Platforms)
@@ -106,7 +106,7 @@ a security issue, we'd like to know about it, and also how to fix it:
 Typical already known or "no impact" bugs such as:

 - Brute force password guessign. Currently there is
-  [brute force protection with eluck:accounts-lockout](https://github.com/wekan/wekan/blob/devel/CHANGELOG.md#v080-2018-04-04-wekan-release).
+  [brute force protection with eluck:accounts-lockout](https://github.com/wekan/wekan/blob/master/CHANGELOG.md#v080-2018-04-04-wekan-release).
 - Security issues related to that Wekan uses Meteor 1.6.0.1 related packages, and upgrading to newer
  Meteor 1.6.1 is complicated process that requires lots of changes to many dependency packages.
  Upgrading [has been tried many times, spending a lot of time](https://github.com/meteor/meteor/issues/9609)
@@ -1,5 +1,5 @@
 appId: wekan-public/apps/77b94f60-dec9-0136-304e-16ff53095928
-appVersion: "v4.95.0"
+appVersion: "v5.63.0"
 files:
  userUploads:
    - README.md
@@ -28,12 +28,16 @@ if arguments == 0:
    print("  python3 api.py board BOARDID      # Info of BOARDID")
    print("  python3 api.py swimlanes BOARDID  # Swimlanes of BOARDID")
    print("  python3 api.py lists BOARDID      # Lists of BOARDID")
+    print("  python3 api.py list BOARDID LISTID # Info of LISTID")
    print("  python3 api.py createlist BOARDID LISTTITLE # Create list")
    print("  python3 api.py addcard AUTHORID BOARDID SWIMLANEID LISTID CARDTITLE CARDDESCRIPTION")
+    print("  python3 api.py editcard BOARDID LISTID CARDID NEWCARDTITLE NEWCARDDESCRIPTION")
    print("  python3 api.py listattachments BOARDID # List attachments")
 # TODO:
-#    print("  python3 api.py attachmentdownload BOARDID ATTACHMENTID # One attachment as file")
-#    print("  python3 api.py attachmentsdownload BOARDID # All attachments as files")
+#   print("  python3 api.py attachmentjson BOARDID ATTACHMENTID # One attachment as JSON base64")
+#   print("  python3 api.py attachmentbinary BOARDID ATTACHMENTID # One attachment as binary file")
+#   print("  python3 api.py attachmentdownload BOARDID ATTACHMENTID # One attachment as file")
+#   print("  python3 api.py attachmentsdownload BOARDID # All attachments as files")
    exit

 # ------- SETTINGS START -------------
@@ -61,13 +65,15 @@ chmod +x api.py
 === Wekan API Python CLI: Shows IDs for addcard ===
 AUTHORID is USERID that writes card.
 Syntax:
-  python3 api.py users              # All users
-  python3 api.py boards USERID      # Boards of USERID
-  python3 api.py board BOARDID      # Info of BOARDID
-  python3 api.py swimlanes BOARDID  # Swimlanes of BOARDID
-  python3 api.py lists BOARDID      # Lists of BOARDID
+  python3 api.py users               # All users
+  python3 api.py boards USERID       # Boards of USERID
+  python3 api.py board BOARDID       # Info of BOARDID
+  python3 api.py swimlanes BOARDID   # Swimlanes of BOARDID
+  python3 api.py lists BOARDID       # Lists of BOARDID
+  python3 api.py list BOARDID LISTID # Info of LISTID
  python3 api.py createlist BOARDID LISTTITLE # Create list
  python3 api.py addcard AUTHORID BOARDID SWIMLANEID LISTID CARDTITLE CARDDESCRIPTION
+  python3 api.py editcard BOARDID LISTID CARDID NEWCARDTITLE NEWCARDDESCRIPTION
  python3 api.py listattachments BOARDID # List attachments
  python3 api.py attachmentjson BOARDID ATTACHMENTID # One attachment as JSON base64
  python3 api.py attachmentbinary BOARDID ATTACHMENTID # One attachment as binary file
@@ -162,6 +168,27 @@ if arguments == 7:
        print(body.text)
        # ------- WRITE TO CARD END -----------

+if arguments == 6:
+
+    if sys.argv[1] == 'editcard':
+
+        # ------- LIST OF BOARD START -----------
+        boardid = sys.argv[2]
+        listid = sys.argv[3]
+        cardid = sys.argv[4]
+        newcardtitle = sys.argv[5]
+        newcarddescription = sys.argv[6]
+        edcard = wekanurl + apiboards + boardid + s + l + s + listid + s + cs + s + cardid
+        print(edcard)
+        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
+        put_data = {'title': '{}'.format(newcardtitle), 'description': '{}'.format(newcarddescription)}
+        body = requests.put(edcard, data=put_data, headers=headers)
+        print("=== EDIT CARD ===\n")
+        body = requests.get(edcard, headers=headers)
+        data2 = body.text.replace('}',"}\n")
+        print(data2)
+        # ------- LISTS OF BOARD END -----------
+
 if arguments == 3:

    if sys.argv[1] == 'createlist':
@@ -177,6 +204,19 @@ if arguments == 3:
        print(body.text)
        # ------- CREATE LIST END -----------

+    if sys.argv[1] == 'list':
+
+        # ------- LIST OF BOARD START -----------
+        boardid = sys.argv[2]
+        listid = sys.argv[3]
+        listone = wekanurl + apiboards + boardid + s + l + s + listid
+        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
+        print("=== INFO OF ONE LIST ===\n")
+        body = requests.get(listone, headers=headers)
+        data2 = body.text.replace('}',"}\n")
+        print(data2)
+        # ------- LISTS OF BOARD END -----------
+
 if arguments == 2:

    # ------- BOARDS LIST START -----------
@@ -217,7 +257,7 @@ if arguments == 2:

        # ------- LISTS OF BOARD START -----------
        boardid = sys.argv[2]
-        attachments = wekanurl + apiboards + boardid
+        lists = wekanurl + apiboards + boardid + s + l
        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
        print("=== LISTS ===\n")
        body = requests.get(lists, headers=headers)
@@ -21,6 +21,22 @@ template(name="editOrDeleteComment")
  = ' - '
  a.js-delete-comment {{_ "delete"}}

+template(name="commentReactions")
+  .reactions
+    each reaction in reactions
+      span.reaction(class="{{#if isSelected reaction.userIds}}selected{{/if}}" data-codepoint="#{reaction.reactionCodepoint}" title="{{userNames reaction.userIds}}")
+        span.reaction-codepoint !{reaction.reactionCodepoint}
+        span.reaction-count #{reaction.userIds.length}
+    if (currentUser.isBoardMember)
+      a.open-comment-reaction-popup(title="{{_ 'addReactionPopup-title'}}")
+        i.fa.fa-smile-o
+        i.fa.fa-plus
+
+template(name="addReactionPopup")
+  .reactions-popup
+    each codepoint in codepoints
+      span.add-comment-reaction(data-codepoint="#{codepoint}") !{codepoint}
+
 template(name="activity")
  .activity
    +userAvatar(userId=activity.user._id)
@@ -82,7 +98,7 @@ template(name="activity")
            +viewer
              = activity.checklist.title
        else
-          a.activity-checklist(href="{{ activity.card.absoluteUrl }}")
+          a.activity-checklist(href="{{ activity.card.originRelativeUrl }}")
            +viewer
              = activity.checklist.title

@@ -103,7 +119,7 @@ template(name="activity")

      if($eq activity.activityType 'addChecklistItem')
        | {{{_ 'activity-checklist-item-added' (sanitize activity.checklist.title) cardLink}}}.
-        .activity-checklist(href="{{ activity.card.absoluteUrl }}")
+        .activity-checklist(href="{{ activity.card.originRelativeUrl }}")
          +viewer
            = activity.checklistItem.title

@@ -124,6 +140,7 @@ template(name="activity")
            .activity-comment
              +viewer
                = activity.comment.text
+            +commentReactions(reactions=activity.comment.reactions commentId=activity.comment._id)
            span(title=activity.createdAt).activity-meta {{ moment activity.createdAt }}
              if($eq currentUser._id activity.comment.userId)
                +editOrDeleteComment
@@ -139,7 +156,7 @@ template(name="activity")
        //- if we are not in card mode we only display a summary of the comment
        if($eq activity.activityType 'addComment')
          | {{{_ 'activity-on' cardLink}}}
-          a.activity-comment(href="{{ activity.card.absoluteUrl }}")
+          a.activity-comment(href="{{ activity.card.originRelativeUrl }}")
            +viewer
              = activity.comment.text

@@ -150,20 +167,20 @@ template(name="activity")

        if($eq activity.activityType 'a-startAt')
          | {{{_ 'activity-startDate' (sanitize startDate) cardLink}}}.
-        
+
        if($eq activity.activityType 'a-dueAt')
          | {{{_ 'activity-dueDate' (sanitize dueDate) cardLink}}}.

        if($eq activity.activityType 'a-endAt')
          | {{{_ 'activity-endDate' (sanitize endDate) cardLink}}}.
-      
+
      if($eq mode 'board')
        if($eq activity.activityType 'a-receivedAt')
          | {{{_ 'activity-receivedDate' (sanitize receivedDate) cardLink}}}.

        if($eq activity.activityType 'a-startAt')
          | {{{_ 'activity-startDate' (sanitize startDate) cardLink}}}.
-        
+
        if($eq activity.activityType 'a-dueAt')
          | {{{_ 'activity-dueDate' (sanitize dueDate) cardLink}}}.

@@ -1,4 +1,4 @@
-import sanitizeXss from 'xss';
+import DOMPurify from 'dompurify';

 const activitiesPerPage = 500;

@@ -113,8 +113,10 @@ BlazeComponent.extendComponent({
    ).getLabelById(lastLabelId);
    if (lastLabel && (lastLabel.name === undefined || lastLabel.name === '')) {
      return lastLabel.color;
-    } else {
+    } else if (lastLabel.name !== undefined && lastLabel.name !== '') {
      return lastLabel.name;
+    } else {
+      return null;
    }
  },

@@ -162,11 +164,15 @@ BlazeComponent.extendComponent({
            {
              href: source.url,
            },
-            sanitizeXss(source.system),
+            DOMPurify.sanitize(source.system, {
+              ALLOW_UNKNOWN_PROTOCOLS: true,
+            }),
          ),
        );
      } else {
-        return sanitizeXss(source.system);
+        return DOMPurify.sanitize(source.system, {
+          ALLOW_UNKNOWN_PROTOCOLS: true,
+        });
      }
    }
    return null;
@@ -190,10 +196,10 @@ BlazeComponent.extendComponent({
              href: attachment.url({ download: true }),
              target: '_blank',
            },
-            sanitizeXss(attachment.name()),
+            DOMPurify.sanitize(attachment.name()),
          ),
        )) ||
-      sanitizeXss(this.currentData().activity.attachmentName)
+      DOMPurify.sanitize(this.currentData().activity.attachmentName)
    );
  },

@@ -232,10 +238,64 @@ BlazeComponent.extendComponent({

 Template.activity.helpers({
  sanitize(value) {
-    return sanitizeXss(value);
+    return DOMPurify.sanitize(value, { ALLOW_UNKNOWN_PROTOCOLS: true });
  },
 });

+Template.commentReactions.events({
+  'click .reaction'(event) {
+    if (Meteor.user().isBoardMember()) {
+      const codepoint = event.currentTarget.dataset['codepoint'];
+      const commentId = Template.instance().data.commentId;
+      const cardComment = CardComments.findOne({_id: commentId});
+      cardComment.toggleReaction(codepoint);
+    }
+  },
+  'click .open-comment-reaction-popup': Popup.open('addReaction'),
+})
+
+Template.addReactionPopup.events({
+  'click .add-comment-reaction'(event) {
+    if (Meteor.user().isBoardMember()) {
+      const codepoint = event.currentTarget.dataset['codepoint'];
+      const commentId = Template.instance().data.commentId;
+      const cardComment = CardComments.findOne({_id: commentId});
+      cardComment.toggleReaction(codepoint);
+    }
+    Popup.close();
+  },
+})
+
+Template.addReactionPopup.helpers({
+  codepoints() {
+    // Starting set of unicode codepoints as comment reactions
+    return [
+      '&#128077;',
+      '&#128078;',
+      '&#128064;',
+      '&#9989;',
+      '&#10060;',
+      '&#128591;',
+      '&#128079;',
+      '&#127881;',
+      '&#128640;',
+      '&#128522;',
+      '&#129300;',
+      '&#128532;'];
+  }
+})
+
+Template.commentReactions.helpers({
+  isSelected(userIds) {
+    return userIds.includes(Meteor.user()._id);
+  },
+  userNames(userIds) {
+    return Users.find({_id: {$in: userIds}})
+                .map(user => user.profile.fullname)
+                .join(', ');
+  }
+})
+
 function createCardLink(card) {
  if (!card) return '';
  return (
@@ -243,10 +303,10 @@ function createCardLink(card) {
    Blaze.toHTML(
      HTML.A(
        {
-          href: card.absoluteUrl(),
+          href: card.originRelativeUrl(),
          class: 'action-card',
        },
-        sanitizeXss(card.title),
+        DOMPurify.sanitize(card.title, { ALLOW_UNKNOWN_PROTOCOLS: true }),
      ),
    )
  );
@@ -260,10 +320,10 @@ function createBoardLink(board, list) {
    Blaze.toHTML(
      HTML.A(
        {
-          href: board.absoluteUrl(),
+          href: board.originRelativeUrl(),
          class: 'action-board',
        },
-        sanitizeXss(text),
+        DOMPurify.sanitize(text, { ALLOW_UNKNOWN_PROTOCOLS: true }),
      ),
    )
  );
@@ -5,6 +5,20 @@
  display: flex
  justify-content:space-between

+.reactions-popup
+  .add-comment-reaction
+    display: inline-block
+    cursor: pointer
+    border-radius: 5px
+    font-size: 22px
+    text-align: center
+    line-height: 30px
+    width: 40px
+
+    &:hover {
+      background-color: #b0c4de
+    }
+
 .activities
  clear: both

@@ -18,7 +32,7 @@
      height: @width

    .activity-member
-      font-weight: 700      
+      font-weight: 700

    .activity-desc
      word-wrap: break-word
@@ -39,6 +53,45 @@
        margin-top: 5px
        padding: 5px

+      .reactions
+        display: flex
+        margin-top: 5px
+        gap: 5px
+
+        .open-comment-reaction-popup
+          display: flex
+          align-items: center
+          text-decoration: none
+          height: 24px;
+
+          i.fa.fa-smile-o
+            font-size: 17px
+            font-weight: 500
+            margin-left: 2px
+
+          i.fa.fa-plus
+            font-size: 8px;
+            margin-top: -7px;
+            margin-left: 1px;
+
+        .reaction
+          cursor: pointer
+          border: 1px solid grey
+          border-radius: 15px
+          display: flex
+          padding: 2px 5px
+
+          &.selected {
+            background-color: #b0c4de
+          }
+
+          &:hover {
+            background-color: #b0c4de
+          }
+
+          .reaction-count
+            font-size: 12px
+
      .activity-checklist
        display: block
        border-radius: 3px
@@ -1,7 +1,7 @@
 template(name="commentForm")
  .new-comment.js-new-comment(
    class="{{#if commentFormIsOpen}}is-open{{/if}}")
-    +userAvatar(userId=currentUser._id)
+    +userAvatar(userId=currentUser._id noRemove=true)
    form.js-new-comment-form
      +editor(class="js-new-comment-input")
        | {{getUnsavedValue 'cardComment' currentCard._id}}
@@ -3,6 +3,7 @@ const commentFormIsOpen = new ReactiveVar(false);
 BlazeComponent.extendComponent({
  onDestroyed() {
    commentFormIsOpen.set(false);
+    $('.note-popover').hide();
  },

  commentFormIsOpen() {
@@ -13,26 +13,29 @@ template(name="board")
    +spinner

 template(name="boardBody")
-  .board-wrapper(class=currentBoard.colorClass)
-    +sidebar
-    .board-canvas.js-swimlanes(
-      class="{{#if Sidebar.isOpen}}is-sibling-sidebar-open{{/if}}"
-      class="{{#if MultiSelection.isActive}}is-multiselection-active{{/if}}"
-      class="{{#if draggingActive.get}}is-dragging-active{{/if}}")
-      if showOverlay.get
-        .board-overlay
-      if currentBoard.isTemplatesBoard
-        each currentBoard.swimlanes
-          +swimlane(this)
-      else if isViewSwimlanes
-        each currentBoard.swimlanes
-          +swimlane(this)
-      else if isViewLists
-        +listsGroup(currentBoard)
-      else if isViewCalendar
-        +calendarView
-      else
-        +listsGroup(currentBoard)
+  if notDisplayThisBoard
+   | {{_ 'tableVisibilityMode-allowPrivateOnly'}}
+  else
+    .board-wrapper(class=currentBoard.colorClass)
+      +sidebar
+      .board-canvas.js-swimlanes(
+        class="{{#if Sidebar.isOpen}}is-sibling-sidebar-open{{/if}}"
+        class="{{#if MultiSelection.isActive}}is-multiselection-active{{/if}}"
+        class="{{#if draggingActive.get}}is-dragging-active{{/if}}")
+        if showOverlay.get
+          .board-overlay
+        if currentBoard.isTemplatesBoard
+          each currentBoard.swimlanes
+            +swimlane(this)
+        else if isViewSwimlanes
+          each currentBoard.swimlanes
+            +swimlane(this)
+        else if isViewLists
+          +listsGroup(currentBoard)
+        else if isViewCalendar
+          +calendarView
+        else
+          +listsGroup(currentBoard)

 template(name="calendarView")
  if isViewCalendar
@@ -33,6 +33,7 @@ BlazeComponent.extendComponent({

 BlazeComponent.extendComponent({
  onCreated() {
+    Meteor.subscribe('tableVisibilityModeSettings');
    this.showOverlay = new ReactiveVar(false);
    this.draggingActive = new ReactiveVar(false);
    this._isDragging = false;
@@ -235,6 +236,16 @@ BlazeComponent.extendComponent({
    }
  },

+  notDisplayThisBoard(){
+    let allowPrivateVisibilityOnly = TableVisibilityModeSettings.findOne('tableVisibilityMode-allowPrivateOnly');
+    let currentBoard = Boards.findOne(Session.get('currentBoard'));
+    if(allowPrivateVisibilityOnly !== undefined && allowPrivateVisibilityOnly.booleanValue && currentBoard.permission == 'public'){
+      return true;
+    }
+
+    return false;
+  },
+
  isViewSwimlanes() {
    currentUser = Meteor.user();
    if (currentUser) {
@@ -325,6 +336,7 @@ BlazeComponent.extendComponent({
      defaultView: 'agendaDay',
      editable: true,
      timezone: 'local',
+      weekNumbers: true,
      header: {
        left: 'title   today prev,next',
        center:
@@ -360,7 +372,7 @@ BlazeComponent.extendComponent({
            end: end || card.endAt,
            allDay:
              Math.abs(end.getTime() - start.getTime()) / 1000 === 24 * 3600,
-            url: FlowRouter.url('card', {
+            url: FlowRouter.path('card', {
              boardId: currentBoard._id,
              slug: currentBoard.slug,
              cardId: card._id,
@@ -654,7 +654,6 @@ setBoardClear(color1,color2)

  /* Card changes */
  .minicard
-    background: #FFF
    padding: 15px 15px 10px
    box-shadow: 0 3px 8px rgba(0,0,0,.05)

@@ -767,7 +766,15 @@ setBoardClear(color1,color2)
  .toggle-label:after, .board-color-modern .toggle-switch:checked~.toggle-label:after
    background-color: #819C5D !important

+  button, input:not([type=file]), select, textarea
+    border-radius: 2px
+
  /* Headers */
+  &#header
+    background-color: #262626
+    border-bottom: 1px solid #555555;
+    border-top: 1px solid #555555;
+
  &#header-quick-access, .background-box, #header
    background-color: #333333

@@ -775,14 +782,16 @@ setBoardClear(color1,color2)
    padding: 4px
    font-size: 14px

+  &#header-quick-access .allBoards
+    padding: 5px 10px 0 10px;
+
+  &#header-quick-access ul.header-quick-access-list
+    margin: -5px 0 -5px 0
+
  &#header #header-main-bar
-    height: 30px
    padding-top: 3px
    padding-bottom: 3px

-  &#header
-    box-shadow: 0 6px 6px -6px rgba(0,0,0,0.8)
-
  &#header-quick-access ul
    overflow: visible

@@ -813,18 +822,23 @@ setBoardClear(color1,color2)
  /* Content */
  .board-canvas
    background: #2a2a2a
-    padding: 10px 10px 0

  /* Swimlanes */
  .swimlane .swimlane-header-wrap
-    background-color: #666666
+    background-color: #494949
    color: #cccccc
    padding: 4px 0
-    margin-bottom: 10px

  .swimlane .swimlane-header-wrap .swimlane-header
    font-family: Poppins

+  .swimlane .swimlane-header-wrap .swimlane-header-menu
+    padding: 6px
+    font-size: 16px
+
+  .swimlane .swimlane-header-wrap .swimlane-header-plus-icon
+    font-size: 16px
+
  .swimlane
    background: #2a2a2a
    line-height: 15px
@@ -837,13 +851,19 @@ setBoardClear(color1,color2)
    border: 0px solid #666666
    flex: 0 0 265px;

+  .swimlane .list:first-child
+    margin-left: 0
+
  .swimlane .list:nth-child(even)
    background: #5f5f5f

+  .swimlane .list:nth-child(odd) .list-header
+    background: #3b3b3b
+
  .list-header
    background: #333333
-    padding-top: 10px
-    border-bottom: 6px solid #333333
+    padding: 10px
+    border-bottom: 0

  .list-header .viewer
    padding-left: 10px
@@ -853,7 +873,11 @@ setBoardClear(color1,color2)
    color: #eeeeee

  .list-header .list-header-menu
-    padding-top: 17px
+    padding: 10px
+    top: 0
+
+  .list-header .list-header-plus-icon
+    color: #a6a6a6

  .list-body
    scrollbar-width: thin
@@ -884,35 +908,43 @@ setBoardClear(color1,color2)
    color: #ffffff

  /* Mini Card */
+  .minicard-wrapper
+    margin-bottom: 12px
+
  .minicard
    background-color: #444444
    color: #cccccc
    border-radius: 2px
-    font-size: 0.9em
+    font-size: 0.95em
    padding: 10px
    box-shadow: 0 4px 3px -3px rgba(0,0,0,0.8)
    border-bottom: 1px solid #666666

  .minicard:hover
-    background-color: #555555 !important
+    background-color: #494949 !important
+
+  .minicard .minicard-labels
+    margin-bottom: 4px

  .minicard .card-label
    font-size: 11px
    font-weight: 400
-    padding: 2px 6px 0
+    padding: 1px 6px 0
+    border-radius: 2px

  .minicard .badges
    color: #bbbbbb

  .minicard .date
-    margin-top: 7px
+    margin-top: 10px
    font-size: 11px

  .card-date
-    color: #555555
+    color: #444444
+    border-radius: 2px

  .card-date.almost-due
-    color: #666666
+    color: #444444

  .minicard.minicard-composer textarea.minicard-composer-textarea:focus
    background-color: #eeeeee
@@ -971,11 +1003,17 @@ setBoardClear(color1,color2)

  .card-details .checklist-item
    background-color: rgba(255,255,255,0.1)
-    padding: 2px 8px
-    border-radius: 3px
+    padding: 4px 8px
+    border-radius: 2px
    font-size: 13px
    margin-top: 5px

+  .card-details .checklist-item:hover
+    background-color: rgba(255,255,255,0.2)
+
+  .card-details .checklist-item .item-title .viewer p
+    max-width: auto
+
  .card-details .check-box.materialCheckBox
    border-color: #ffffff

@@ -1,7 +1,9 @@
 template(name="boardHeaderBar")
  h1.header-board-menu
    with currentBoard
-      a(class="{{#if currentUser.isBoardAdmin}}js-edit-board-title{{else}}is-disabled{{/if}}")
+      if $eq title 'Templates'
+        | {{_ 'templates'}}
+      else
        +viewer
          = title

@@ -9,6 +11,10 @@ template(name="boardHeaderBar")
    unless isMiniScreen
      if currentBoard
        if currentUser
+          with currentBoard
+            a.board-header-btn(class="{{#if currentUser.isBoardAdmin}}js-edit-board-title{{else}}is-disabled{{/if}}" title="{{_ 'edit'}}" value=title)
+              i.fa.fa-pencil-square-o
+
          a.board-header-btn.js-star-board(class="{{#if isStarred}}is-active{{/if}}"
            title="{{#if isStarred}}{{_ 'click-to-unstar'}}{{else}}{{_ 'click-to-star'}}{{/if}} {{_ 'starred-boards-description'}}")
            i.fa(class="fa-star{{#unless isStarred}}-o{{/unless}}")
@@ -31,6 +37,12 @@ template(name="boardHeaderBar")
            if $eq watchLevel "muted"
              i.fa.fa-bell-slash
            span {{_ watchLevel}}
+          a.board-header-btn(title="{{_ 'sort-cards'}}" class="{{#if isSortActive }}emphasis{{else}} js-sort-cards {{/if}}")
+            i.fa.fa-sort
+            span {{#if isSortActive }}{{_ 'Sort is on'}}{{else}}{{_ 'sort-cards'}}{{/if}}
+            if isSortActive
+              a.board-header-btn-close.js-sort-reset(title="Remove Sort")
+                i.fa.fa-times-thin

        else
          a.board-header-btn.js-log-in(
@@ -42,6 +54,10 @@ template(name="boardHeaderBar")
    if currentBoard
      if isMiniScreen
        if currentUser
+          with currentBoard
+            a.board-header-btn(class="{{#if currentUser.isBoardAdmin}}js-edit-board-title{{else}}is-disabled{{/if}}" title="{{_ 'edit'}}" value=title)
+              i.fa.fa-pencil-square-o
+
          a.board-header-btn.js-star-board(class="{{#if isStarred}}is-active{{/if}}"
            title="{{#if isStarred}}{{_ 'click-to-unstar'}}{{else}}{{_ 'click-to-star'}}{{/if}} {{_ 'starred-boards-description'}}")
            i.fa(class="fa-star{{#unless isStarred}}-o{{/unless}}")
@@ -118,7 +134,7 @@ template(name="boardHeaderBar")
              i.fa.fa-times-thin

      .separator
-      a.board-header-btn.js-toggle-sidebar
+      a.board-header-btn.js-toggle-sidebar(title="{{_ 'sidebar-open'}} {{_ 'or'}} {{_ 'sidebar-close'}}")
        i.fa.fa-navicon

 template(name="boardVisibilityList")
@@ -131,14 +147,15 @@ template(name="boardVisibilityList")
          if visibilityCheck
            i.fa.fa-check
          span.sub-name {{_ 'private-desc'}}
-    li
-      with "public"
-        a.js-select-visibility
-          i.fa.fa-globe.colorful
-          | {{_ 'public'}}
-          if visibilityCheck
-            i.fa.fa-check
-          span.sub-name {{_ 'public-desc'}}
+    if notAllowPrivateVisibilityOnly
+      li
+        with "public"
+          a.js-select-visibility
+            i.fa.fa-globe.colorful
+            | {{_ 'public'}}
+            if visibilityCheck
+              i.fa.fa-check
+            span.sub-name {{_ 'public-desc'}}

 template(name="boardChangeVisibilityPopup")
  +boardVisibilityList
@@ -212,6 +229,9 @@ template(name="createBoard")
          = " "
          | {{{_ 'board-private-info'}}}
        a.js-change-visibility {{_ 'change'}}.
+    //a.flex.js-toggle-add-template-container
+    //  .materialCheckBox#add-template-container
+    //  span {{_ 'add-template-container'}}
    input.primary.wide(type="submit" value="{{_ 'create'}}")
    span.quiet
      | {{_ 'or'}}
@@ -247,3 +267,19 @@ template(name="boardChangeTitlePopup")
 template(name="boardCreateRulePopup")
  p {{_ 'close-board-pop'}}
  button.js-confirm.negate.full(type="submit") {{_ 'archive'}}
+
+
+template(name="cardsSortPopup")
+  ul.pop-over-list
+    li
+      a.js-sort-due {{_ 'due-date'}}
+      hr
+    li
+      a.js-sort-title {{_ 'title-alphabetically'}}
+      hr
+    li
+      a.js-sort-created-desc {{_ 'created-at-newest-first'}}
+      hr
+    li
+      a.js-sort-created-asc {{_ 'created-at-oldest-first'}}
+
@@ -2,6 +2,7 @@
 const DOWNCLS = 'fa-sort-down';
 const UPCLS = 'fa-sort-up';
 */
+const sortCardsBy = new ReactiveVar('');
 Template.boardMenuPopup.events({
  'click .js-rename-board': Popup.open('boardChangeTitle'),
  'click .js-custom-fields'() {
@@ -110,6 +111,7 @@ BlazeComponent.extendComponent({
        'click .js-open-filter-view'() {
          Sidebar.setView('filter');
        },
+        'click .js-sort-cards': Popup.open('cardsSort'),
        /*
        'click .js-open-sort-view'(evt) {
          const target = evt.target;
@@ -127,6 +129,9 @@ BlazeComponent.extendComponent({
          Sidebar.setView();
          Filter.reset();
        },
+        'click .js-sort-reset'() {
+          Session.set('sortBy', '');
+        },
        'click .js-open-search-view'() {
          Sidebar.setView('search');
        },
@@ -160,6 +165,9 @@ Template.boardHeaderBar.helpers({
  boardView() {
    return Utils.boardView();
  },
+  isSortActive() {
+    return Session.get('sortBy') ? true : false;
+  },
 });

 Template.boardChangeViewPopup.events({
@@ -186,6 +194,11 @@ const CreateBoard = BlazeComponent.extendComponent({
    this.visibilityMenuIsOpen = new ReactiveVar(false);
    this.visibility = new ReactiveVar('private');
    this.boardId = new ReactiveVar('');
+    Meteor.subscribe('tableVisibilityModeSettings');
+  },
+
+  notAllowPrivateVisibilityOnly(){
+    return !TableVisibilityModeSettings.findOne('tableVisibilityMode-allowPrivateOnly').booleanValue;
  },

  visibilityCheck() {
@@ -201,24 +214,79 @@ const CreateBoard = BlazeComponent.extendComponent({
    this.visibilityMenuIsOpen.set(!this.visibilityMenuIsOpen.get());
  },

+  toggleAddTemplateContainer() {
+    $('#add-template-container').toggleClass('is-checked');
+  },
+
  onSubmit(event) {
    event.preventDefault();
    const title = this.find('.js-new-board-title').value;
-    const visibility = this.visibility.get();

-    this.boardId.set(
-      Boards.insert({
-        title,
-        permission: visibility,
-      }),
-    );
+    const addTemplateContainer = $('#add-template-container.is-checked').length > 0;
+    if (addTemplateContainer) {
+      //const templateContainerId = Meteor.call('setCreateTemplateContainer');
+      //Utils.goBoardId(templateContainerId);
+      //alert('niinku template ' + Meteor.call('setCreateTemplateContainer'));

-    Swimlanes.insert({
-      title: 'Default',
-      boardId: this.boardId.get(),
-    });
+      this.boardId.set(
+        Boards.insert({
+            // title: TAPi18n.__('templates'),
+            title: title,
+            permission: 'private',
+            type: 'template-container',
+          }),
+       );

-    Utils.goBoardId(this.boardId.get());
+      // Insert the card templates swimlane
+      Swimlanes.insert({
+          // title: TAPi18n.__('card-templates-swimlane'),
+          title: 'Card Templates',
+          boardId: this.boardId.get(),
+          sort: 1,
+          type: 'template-container',
+        }),
+
+      // Insert the list templates swimlane
+      Swimlanes.insert(
+        {
+          // title: TAPi18n.__('list-templates-swimlane'),
+          title: 'List Templates',
+          boardId: this.boardId.get(),
+          sort: 2,
+          type: 'template-container',
+        },
+      );
+
+      // Insert the board templates swimlane
+      Swimlanes.insert(
+        {
+          //title: TAPi18n.__('board-templates-swimlane'),
+          title: 'Board Templates',
+          boardId: this.boardId.get(),
+          sort: 3,
+          type: 'template-container',
+        },
+      );
+
+      Utils.goBoardId(this.boardId.get());
+
+    } else {
+      const visibility = this.visibility.get();
+
+      this.boardId.set(
+        Boards.insert({
+          title,
+          permission: visibility,
+        }),
+      );
+
+      Swimlanes.insert({
+        title: 'Default',
+        boardId: this.boardId.get(),
+      });
+
+      Utils.goBoardId(this.boardId.get());
+    }
  },

  events() {
@@ -232,6 +300,7 @@ const CreateBoard = BlazeComponent.extendComponent({
        submit: this.onSubmit,
        'click .js-import-board': Popup.open('chooseBoardSource'),
        'click .js-board-template': Popup.open('searchElement'),
+        'click .js-toggle-add-template-container': this.toggleAddTemplateContainer,
      },
    ];
  },
@@ -246,6 +315,9 @@ const CreateBoard = BlazeComponent.extendComponent({
 }.register('headerBarCreateBoardPopup'));

 BlazeComponent.extendComponent({
+  notAllowPrivateVisibilityOnly(){
+    return !TableVisibilityModeSettings.findOne('tableVisibilityMode-allowPrivateOnly').booleanValue;
+  },
  visibilityCheck() {
    const currentBoard = Boards.findOne(Session.get('currentBoard'));
    return this.currentData() === currentBoard.permission;
@@ -368,3 +440,44 @@ BlazeComponent.extendComponent({
  },
 }).register('listsortPopup');
 */
+
+BlazeComponent.extendComponent({
+  events() {
+    return [
+      {
+        'click .js-sort-due'() {
+          const sortBy = {
+            dueAt: 1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('due-date'));
+          Popup.close();
+        },
+        'click .js-sort-title'() {
+          const sortBy = {
+            title: 1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('title'));
+          Popup.close();
+        },
+        'click .js-sort-created-asc'() {
+          const sortBy = {
+            createdAt: 1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('date-created-newest-first'));
+          Popup.close();
+        },
+        'click .js-sort-created-desc'() {
+          const sortBy = {
+            createdAt: -1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('date-created-oldest-first'));
+          Popup.close();
+        },
+      },
+    ];
+  },
+}).register('cardsSortPopup');
@@ -1,10 +1,32 @@
 template(name="boardList")
  .wrapper
+    ul.AllBoardTeamsOrgs
+      li.AllBoardTeams
+        if userHasTeams
+          select.js-AllBoardTeams#jsAllBoardTeams("multiple")
+            option(value="-1") {{_ 'teams'}} :
+            each teamsDatas
+              option(value="{{teamId}}") {{_ teamDisplayName}}
+
+      li.AllBoardOrgs
+        if userHasOrgs
+          select.js-AllBoardOrgs#jsAllBoardOrgs("multiple")
+            option(value="-1") {{_ 'organizations'}} :
+            each orgsDatas
+              option(value="{{orgId}}") {{_ orgDisplayName}}
+      li.AllBoardBtns
+        div.AllBoardButtonsContainer
+          if userHasOrgsOrTeams
+            i.fa.fa-filter
+            input#filterBtn(type="button" value="{{_ 'filter'}}")
+            input#resetBtn(type="button" value="{{_ 'filter-clear'}}")
+
    ul.board-list.clearfix.js-boards
      li.js-add-board
-        a.board-list-item.label {{_ 'add-board'}}
+        a.board-list-item.label(title="{{_ 'add-board'}}")
+          | {{_ 'add-board'}}
      each boards
-        li(class="{{#if isStarred}}starred{{/if}}" class=colorClass).js-board
+        li(class="{{_id}}" class="{{#if isStarred}}starred{{/if}}" class=colorClass).js-board
          if isInvited
            .board-list-item
              span.details
@@ -16,47 +38,90 @@ template(name="boardList")
                button.js-accept-invite.primary {{_ 'accept'}}
                button.js-decline-invite {{_ 'decline'}}
          else
-            a.js-open-board.board-list-item(href="{{pathFor 'board' id=_id slug=slug}}")
-              span.details
-                span.board-list-item-name
-                  +viewer
-                    = title
-                i.fa.js-star-board(
-                  class="fa-star{{#if isStarred}} is-star-active{{else}}-o{{/if}}"
-                  title="{{_ 'star-board-title'}}")
-                p.board-list-item-desc
-                  +viewer
-                    = description
-                if hasSpentTimeCards
-                  i.fa.js-has-spenttime-cards(
-                    class="fa-circle{{#if hasOvertimeCards}} has-overtime-card-active{{else}} no-overtime-card-active{{/if}}"
-                    title="{{#if hasOvertimeCards}}{{_ 'has-overtime-cards'}}{{else}}{{_ 'has-spenttime-cards'}}{{/if}}")
-                if isMiniScreen
-                  i.fa.board-handle(
-                      class="fa-arrows"
-                      title="{{_ 'Drag board'}}")
-                unless isMiniScreen
-                  if isSandstorm
-                    i.fa.js-clone-board(
-                        class="fa-clone"
-                        title="{{_ 'duplicate-board'}}")
-                    i.fa.js-archive-board(
-                        class="fa-archive"
-                        title="{{_ 'archive-board'}}")
-                  else if isAdministrable
-                    i.fa.js-clone-board(
-                        class="fa-clone"
-                        title="{{_ 'duplicate-board'}}")
-                    i.fa.js-archive-board(
-                        class="fa-archive"
-                        title="{{_ 'archive-board'}}")
-                  else if currentUser.isAdmin
-                    i.fa.js-clone-board(
-                        class="fa-clone"
-                        title="{{_ 'duplicate-board'}}")
-                    i.fa.js-archive-board(
-                        class="fa-archive"
-                        title="{{_ 'archive-board'}}")
+            if $eq type "template-container"
+              a.js-open-board.template-container.board-list-item(href="{{pathFor 'board' id=_id slug=slug}}")
+                span.details
+                  span.board-list-item-name(title="{{_ 'template-container'}}")
+                    +viewer
+                      = title
+                  i.fa.js-star-board(
+                    class="fa-star{{#if isStarred}} is-star-active{{else}}-o{{/if}}"
+                    title="{{_ 'star-board-title'}}")
+                  p.board-list-item-desc
+                    +viewer
+                      = description
+                  if hasSpentTimeCards
+                    i.fa.js-has-spenttime-cards(
+                      class="fa-circle{{#if hasOvertimeCards}} has-overtime-card-active{{else}} no-overtime-card-active{{/if}}"
+                      title="{{#if hasOvertimeCards}}{{_ 'has-overtime-cards'}}{{else}}{{_ 'has-spenttime-cards'}}{{/if}}")
+                  if isMiniScreen
+                    i.fa.board-handle(
+                        class="fa-arrows"
+                        title="{{_ 'Drag board'}}")
+                  unless isMiniScreen
+                    if isSandstorm
+                      i.fa.js-clone-board(
+                          class="fa-clone"
+                          title="{{_ 'duplicate-board'}}")
+                      i.fa.js-archive-board(
+                          class="fa-archive"
+                          title="{{_ 'archive-board'}}")
+                    else if isAdministrable
+                      i.fa.js-clone-board(
+                          class="fa-clone"
+                          title="{{_ 'duplicate-board'}}")
+                      i.fa.js-archive-board(
+                          class="fa-archive"
+                          title="{{_ 'archive-board'}}")
+                    else if currentUser.isAdmin
+                      i.fa.js-clone-board(
+                          class="fa-clone"
+                          title="{{_ 'duplicate-board'}}")
+                      i.fa.js-archive-board(
+                          class="fa-archive"
+                          title="{{_ 'archive-board'}}")
+            else
+              a.js-open-board.board-list-item(href="{{pathFor 'board' id=_id slug=slug}}")
+                span.details
+                  span.board-list-item-name(title="{{_ 'board-drag-drop-reorder-or-click-open'}}")
+                    +viewer
+                      = title
+                  i.fa.js-star-board(
+                    class="fa-star{{#if isStarred}} is-star-active{{else}}-o{{/if}}"
+                    title="{{_ 'star-board-title'}}")
+                  p.board-list-item-desc
+                    +viewer
+                      = description
+                  if hasSpentTimeCards
+                    i.fa.js-has-spenttime-cards(
+                      class="fa-circle{{#if hasOvertimeCards}} has-overtime-card-active{{else}} no-overtime-card-active{{/if}}"
+                      title="{{#if hasOvertimeCards}}{{_ 'has-overtime-cards'}}{{else}}{{_ 'has-spenttime-cards'}}{{/if}}")
+                  if isMiniScreen
+                    i.fa.board-handle(
+                        class="fa-arrows"
+                        title="{{_ 'Drag board'}}")
+                  unless isMiniScreen
+                    if isSandstorm
+                      i.fa.js-clone-board(
+                          class="fa-clone"
+                          title="{{_ 'duplicate-board'}}")
+                      i.fa.js-archive-board(
+                          class="fa-archive"
+                          title="{{_ 'archive-board'}}")
+                    else if isAdministrable
+                      i.fa.js-clone-board(
+                          class="fa-clone"
+                          title="{{_ 'duplicate-board'}}")
+                      i.fa.js-archive-board(
+                          class="fa-archive"
+                          title="{{_ 'archive-board'}}")
+                    else if currentUser.isAdmin
+                      i.fa.js-clone-board(
+                          class="fa-clone"
+                          title="{{_ 'duplicate-board'}}")
+                      i.fa.js-archive-board(
+                          class="fa-archive"
+                          title="{{_ 'archive-board'}}")

 template(name="boardListHeaderBar")
  h1 {{_ title }}
@@ -22,6 +22,16 @@ Template.boardListHeaderBar.helpers({
 BlazeComponent.extendComponent({
  onCreated() {
    Meteor.subscribe('setting');
+    Meteor.subscribe('tableVisibilityModeSettings');
+    let currUser = Meteor.user();
+    let userLanguage;
+    if(currUser && currUser.profile){
+      userLanguage = currUser.profile.language
+    }
+    if (userLanguage) {
+      TAPi18n.setLanguage(userLanguage);
+      T9n.setLanguage(userLanguage);
+    }
  },

  onRendered() {
@@ -75,15 +85,103 @@ BlazeComponent.extendComponent({
      }
    });
  },
+  userHasTeams(){
+    if(Meteor.user().teams && Meteor.user().teams.length > 0)
+      return true;
+    else
+      return false;
+  },
+  teamsDatas() {
+    if(Meteor.user().teams)
+      return Meteor.user().teams;
+    else
+      return [];
+  },
+  userHasOrgs(){
+    if(Meteor.user().orgs && Meteor.user().orgs.length > 0)
+      return true;
+    else
+      return false;
+  },
+  orgsDatas() {
+    if(Meteor.user().orgs)
+      return Meteor.user().orgs;
+    else
+      return [];
+  },
+  userHasOrgsOrTeams(){
+    let boolUserHasOrgs;
+    if(Meteor.user().orgs && Meteor.user().orgs.length > 0)
+      boolUserHasOrgs = true;
+    else
+      boolUserHasOrgs = false;

+    let boolUserHasTeams;
+    if(Meteor.user().teams && Meteor.user().teams.length > 0)
+      boolUserHasTeams = true;
+    else
+      boolUserHasTeams = false;
+
+    return (boolUserHasOrgs || boolUserHasTeams);
+  },
  boards() {
-    const query = {
-      archived: false,
-      type: 'board',
+    let query = {
+      //archived: false,
+      ////type: { $in: ['board','template-container'] },
+      //type: 'board',
+      $and: [
+        { archived: false },
+        { type: 'board' },
+        { $or:[] }
+      ]
    };
-    if (FlowRouter.getRouteName() === 'home')
-      query['members.userId'] = Meteor.userId();
-    else query.permission = 'public';
+
+    let allowPrivateVisibilityOnly = TableVisibilityModeSettings.findOne('tableVisibilityMode-allowPrivateOnly');
+
+    if (FlowRouter.getRouteName() === 'home'){
+      query.$and[2].$or.push({'members.userId': Meteor.userId()});
+
+      if(allowPrivateVisibilityOnly !== undefined && allowPrivateVisibilityOnly.booleanValue){
+        query.$and.push({'permission': 'private'});
+      }
+      const currUser = Users.findOne(Meteor.userId());
+
+      // const currUser = Users.findOne(Meteor.userId(), {
+      //   fields: {
+      //     orgs: 1,
+      //     teams: 1,
+      //   },
+      // });
+
+      let orgIdsUserBelongs = currUser.teams !== 'undefined' ? currUser.orgIdsUserBelongs() : '';
+      if(orgIdsUserBelongs && orgIdsUserBelongs != ''){
+        let orgsIds = orgIdsUserBelongs.split(',');
+        // for(let i = 0; i < orgsIds.length; i++){
+        //   query.$and[2].$or.push({'orgs.orgId': orgsIds[i]});
+        // }
+
+        //query.$and[2].$or.push({'orgs': {$elemMatch : {orgId: orgsIds[0]}}});
+        query.$and[2].$or.push({'orgs.orgId': {$in : orgsIds}});
+      }
+
+      let teamIdsUserBelongs = currUser.teams !== 'undefined' ? currUser.teamIdsUserBelongs() : '';
+      if(teamIdsUserBelongs && teamIdsUserBelongs != ''){
+        let teamsIds = teamIdsUserBelongs.split(',');
+        // for(let i = 0; i < teamsIds.length; i++){
+        //   query.$or[2].$or.push({'teams.teamId': teamsIds[i]});
+        // }
+        //query.$and[2].$or.push({'teams': { $elemMatch : {teamId: teamsIds[0]}}});
+        query.$and[2].$or.push({'teams.teamId': {$in : teamsIds}});
+      }
+    }
+    else if(allowPrivateVisibilityOnly !== undefined && !allowPrivateVisibilityOnly.booleanValue){
+      query = {
+        archived: false,
+        //type: { $in: ['board','template-container'] },
+        type: 'board',
+        permission: 'public',
+      };
+    }

    return Boards.find(query, {
      sort: { sort: 1 /* boards default sorting */ },
@@ -160,6 +258,74 @@ BlazeComponent.extendComponent({
            }
          });
        },
+        'click #resetBtn'(event){
+          let allBoards = document.getElementsByClassName("js-board");
+          let currBoard;
+          for(let i=0; i < allBoards.length; i++){
+            currBoard = allBoards[i];
+            currBoard.style.display = "block";
+          }
+        },
+        'click #filterBtn'(event) {
+          event.preventDefault();
+          let selectedTeams = document.querySelectorAll('#jsAllBoardTeams option:checked');
+          let selectedTeamsValues = Array.from(selectedTeams).map(function(elt){return elt.value});
+          let index = selectedTeamsValues.indexOf("-1");
+          if (index > -1) {
+            selectedTeamsValues.splice(index, 1);
+          }
+
+          let selectedOrgs = document.querySelectorAll('#jsAllBoardOrgs option:checked');
+          let selectedOrgsValues = Array.from(selectedOrgs).map(function(elt){return elt.value});
+          index = selectedOrgsValues.indexOf("-1");
+          if (index > -1) {
+            selectedOrgsValues.splice(index, 1);
+          }
+
+          if(selectedTeamsValues.length > 0 || selectedOrgsValues.length > 0){
+            const query = {
+              $and: [
+                { archived: false },
+                { type: 'board' },
+                { $or:[] }
+              ]
+            };
+            if(selectedTeamsValues.length > 0)
+            {
+              query.$and[2].$or.push({'teams.teamId': {$in : selectedTeamsValues}});
+            }
+            if(selectedOrgsValues.length > 0)
+            {
+              query.$and[2].$or.push({'orgs.orgId': {$in : selectedOrgsValues}});
+            }
+
+            let filteredBoards = Boards.find(query, {}).fetch();
+            let allBoards = document.getElementsByClassName("js-board");
+            let currBoard;
+            if(filteredBoards.length > 0){
+              let currBoardId;
+              let found;
+              for(let i=0; i < allBoards.length; i++){
+                currBoard = allBoards[i];
+                currBoardId = currBoard.classList[0];
+                found = filteredBoards.find(function(board){
+                  return board._id == currBoardId;
+                });
+
+                if(found !== undefined)
+                  currBoard.style.display = "block";
+                else
+                  currBoard.style.display = "none";
+              }
+            }
+            else{
+              for(let i=0; i < allBoards.length; i++){
+                currBoard = allBoards[i];
+                currBoard.style.display = "none";
+              }
+            }
+          }
+        },
      },
    ];
  },
@@ -45,6 +45,9 @@ $spaceBetweenTiles = 16px
    text-decoration: none
    word-wrap: break-word

+    &.template-container
+      border: 4px solid #fff
+
    &.tile
      background-size: auto
      background-repeat: repeat
@@ -226,3 +229,25 @@ $spaceBetweenTiles = 16px
      transform: translateY(-50%)
      right: 10px
      font-size: 24px
+
+.AllBoardTeamsOrgs
+  list-style-type: none;
+  overflow: hidden;
+
+.AllBoardTeams,.AllBoardOrgs,.AllBoardBtns
+  float: left;
+
+.js-AllBoardOrgs
+  margin-left: 16px;
+
+.AllBoardTeams
+  margin-left : 16px;
+
+.AllBoardButtonsContainer
+  margin: 16px;
+
+#filterBtn,#resetBtn
+  display: inline;
+
+.js-board
+  display: block;
@@ -26,6 +26,18 @@ template(name="attachmentsGalery")
          if isUploaded
            if isImage
              img.attachment-thumbnail-img(src="{{url}}")
+            else if($eq extension 'mp3')
+                video(width="100%" height="100%" controls="true")
+                  source(src="{{url}}" type="audio/mpeg")
+            else if($eq extension 'ogg')
+                video(width="100%" height="100%" controls="true")
+                  source(src="{{url}}" type="video/ogg")
+            else if($eq extension 'webm')
+                video(width="100%" height="100%" controls="true")
+                  source(src="{{url}}" type="video/webm")
+            else if($eq extension 'mp4')
+                video(width="100%" height="100%" controls="true")
+                  source(src="{{url}}" type="video/mp4")
            else
              span.attachment-thumbnail-ext= extension
          else
@@ -55,6 +67,5 @@ template(name="attachmentsGalery")
      unless currentUser.isCommentOnly
        unless currentUser.isWorker
          //li.attachment-item.add-attachment
-          a.js-add-attachment
+          a.js-add-attachment(title="{{_ 'add-attachment' }}")
            i.fa.fa-plus
-            | {{_ 'add-attachment' }}
@@ -9,7 +9,7 @@
    margin: 10px 1% 0
    text-align: center
    border-radius: 3px
-    overflow: hidden
+    overflow: auto
    background: darken(white, 7%)
    min-height: 120px

@@ -79,18 +79,22 @@ template(name="cardCustomField-currency")

 template(name="cardCustomField-date")
    if canModifyCard
-        a.js-edit-date(title="{{showTitle}}" class="{{classes}}")
-            if value
-                div.card-date
-                    time(datetime="{{showISODate}}")
-                        | {{showDate}}
-            else
-                | {{_ 'edit'}}
-    else
+      a.js-edit-date(title="{{showTitle}} {{_ 'predicate-week'}} {{showWeek}}" class="{{classes}}")
        if value
-            div.card-date
-                time(datetime="{{showISODate}}")
-                    | {{showDate}}
+          div.card-date
+            time(datetime="{{showISODate}}")
+              | {{showDate}}
+              b
+                | {{showWeek}}
+        else
+          | {{_ 'edit'}}
+    else
+      if value
+        div.card-date
+          time(datetime="{{showISODate}}")
+            | {{showDate}}
+            b
+              | {{showWeek}}

 template(name="cardCustomField-dropdown")
    if canModifyCard
@@ -119,3 +123,24 @@ template(name="cardCustomField-dropdown")
        if value
            +viewer
                = selectedItem
+
+template(name="cardCustomField-stringtemplate")
+    if canModifyCard
+        +inlinedForm(classNames="js-card-customfield-stringtemplate")
+            each item in stringtemplateItems.get
+                input.js-card-customfield-stringtemplate-item(type="text" value=item placeholder="")
+            input.js-card-customfield-stringtemplate-item.last(type="text" value="" placeholder="{{_ 'custom-field-stringtemplate-item-placeholder'}}" autofocus)
+            .edit-controls.clearfix
+                button.primary(type="submit") {{_ 'save'}}
+                a.fa.fa-times-thin.js-close-inlined-form
+        else
+            a.js-open-inlined-form
+                if value
+                    +viewer
+                        = formattedValue
+                else
+                    | {{_ 'edit'}}
+    else
+        if value
+            +viewer
+                = formattedValue
@@ -1,3 +1,6 @@
+import { DatePicker } from '/client/lib/datepicker';
+import Cards from '/models/cards';
+
 Template.cardCustomFieldsPopup.helpers({
  hasCustomField() {
    const card = Cards.findOne(Session.get('currentCard'));
@@ -121,7 +124,8 @@ CardCustomField.register('cardCustomField');
      {
        'submit .js-card-customfield-currency'(event) {
          event.preventDefault();
-          const value = Number(this.find('input').value, 10);
+          // To allow input separated by comma, the comma is replaced by a period.
+          const value = Number(this.find('input').value.replace(/,/i, '.'), 10);
          this.card.setCustomField(this.customFieldId, value);
        },
      },
@@ -145,6 +149,10 @@ CardCustomField.register('cardCustomField');
    });
  }

+  showWeek() {
+    return this.date.get().week().toString();
+  }
+
  showDate() {
    // this will start working once mquandalle:moment
    // is updated to at least moment.js 2.10.5
@@ -233,3 +241,90 @@ CardCustomField.register('cardCustomField');
    ];
  }
 }.register('cardCustomField-dropdown'));
+
+// cardCustomField-stringtemplate
+(class extends CardCustomField {
+  onCreated() {
+    super.onCreated();
+
+    this.stringtemplateFormat = this.data().definition.settings.stringtemplateFormat;
+    this.stringtemplateSeparator = this.data().definition.settings.stringtemplateSeparator;
+
+    this.stringtemplateItems = new ReactiveVar(this.data().value ?? []);
+  }
+
+  formattedValue() {
+    return (this.data().value ?? [])
+      .filter(value => !!value.trim())
+      .map(value => this.stringtemplateFormat.replace(/%\{value\}/gi, value))
+      .join(this.stringtemplateSeparator ?? '');
+  }
+
+  getItems() {
+    return Array.from(this.findAll('input'))
+      .map(input => input.value)
+      .filter(value => !!value.trim());
+  }
+
+  events() {
+    return [
+      {
+        'submit .js-card-customfield-stringtemplate'(event) {
+          event.preventDefault();
+          const items = this.getItems();
+          this.card.setCustomField(this.customFieldId, items);
+        },
+
+        'keydown .js-card-customfield-stringtemplate-item'(event) {
+          if (event.keyCode === 13) {
+            event.preventDefault();
+
+            if (event.metaKey || event.ctrlKey) {
+              this.find('button[type=submit]').click();
+            } else if (event.target.value.trim()) {
+              const inputLast = this.find('input.last');
+
+              let items = this.getItems();
+
+              if (event.target === inputLast) {
+                inputLast.value = '';
+              } else if (event.target.nextSibling === inputLast) {
+                inputLast.focus();
+              } else {
+                event.target.blur();
+
+                const idx = Array.from(this.findAll('input')).indexOf(
+                  event.target,
+                );
+                items.splice(idx + 1, 0, '');
+
+                Tracker.afterFlush(() => {
+                  const element = this.findAll('input')[idx + 1];
+                  element.focus();
+                  element.value = '';
+                });
+              }
+
+              this.stringtemplateItems.set(items);
+            }
+          }
+        },
+
+        'blur .js-card-customfield-stringtemplate-item'(event) {
+          if (
+            !event.target.value.trim() ||
+            event.target === this.find('input.last')
+          ) {
+            const items = this.getItems();
+            this.stringtemplateItems.set(items);
+            this.find('input.last').value = '';
+          }
+        },
+
+        'click .js-close-inlined-form'(event) {
+          this.stringtemplateItems.set(this.data().value ?? []);
+        },
+      },
+    ];
+  }
+}.register('cardCustomField-stringtemplate'));
@@ -1,14 +1,20 @@
 template(name="dateBadge")
  if canModifyCard
-    a.js-edit-date.card-date(title="{{showTitle}}" class="{{classes}}")
+    a.js-edit-date.card-date(title="{{showTitle}} {{_ 'predicate-week'}} {{showWeek}}" class="{{classes}}")
      time(datetime="{{showISODate}}")
        | {{showDate}}
+        b
+          | {{showWeek}}
  else
-    a.card-date(title="{{showTitle}}" class="{{classes}}")
+    a.card-date(title="{{showTitle}} {{_ 'predicate-week'}} {{showWeek}}" class="{{classes}}")
      time(datetime="{{showISODate}}")
        | {{showDate}}
+        b
+          | {{showWeek}}

 template(name="dateCustomField")
-  a(title="{{showTitle}}" class="{{classes}}")
+  a(title="{{showTitle}} {{_ 'predicate-week'}} {{showWeek}}" class="{{classes}}")
    time(datetime="{{showISODate}}")
      | {{showDate}}
+      b
+        | {{showWeek}}
@@ -1,96 +1,4 @@
-// Edit received, start, due & end dates
-BlazeComponent.extendComponent({
-  template() {
-    return 'editCardDate';
-  },
-
-  onCreated() {
-    this.error = new ReactiveVar('');
-    this.card = this.data();
-    this.date = new ReactiveVar(moment.invalid());
-  },
-
-  onRendered() {
-    const $picker = this.$('.js-datepicker')
-      .datepicker({
-        todayHighlight: true,
-        todayBtn: 'linked',
-        language: TAPi18n.getLanguage(),
-      })
-      .on(
-        'changeDate',
-        function(evt) {
-          this.find('#date').value = moment(evt.date).format('L');
-          this.error.set('');
-          this.find('#time').focus();
-        }.bind(this),
-      );
-
-    if (this.date.get().isValid()) {
-      $picker.datepicker('update', this.date.get().toDate());
-    }
-  },
-
-  showDate() {
-    if (this.date.get().isValid()) return this.date.get().format('L');
-    return '';
-  },
-  showTime() {
-    if (this.date.get().isValid()) return this.date.get().format('LT');
-    return '';
-  },
-  dateFormat() {
-    return moment.localeData().longDateFormat('L');
-  },
-  timeFormat() {
-    return moment.localeData().longDateFormat('LT');
-  },
-
-  events() {
-    return [
-      {
-        'keyup .js-date-field'() {
-          // parse for localized date format in strict mode
-          const dateMoment = moment(this.find('#date').value, 'L', true);
-          if (dateMoment.isValid()) {
-            this.error.set('');
-            this.$('.js-datepicker').datepicker('update', dateMoment.toDate());
-          }
-        },
-        'keyup .js-time-field'() {
-          // parse for localized time format in strict mode
-          const dateMoment = moment(this.find('#time').value, 'LT', true);
-          if (dateMoment.isValid()) {
-            this.error.set('');
-          }
-        },
-        'submit .edit-date'(evt) {
-          evt.preventDefault();
-
-          // if no time was given, init with 12:00
-          const time =
-            evt.target.time.value ||
-            moment(new Date().setHours(12, 0, 0)).format('LT');
-
-          const dateString = `${evt.target.date.value} ${time}`;
-          const newDate = moment(dateString, 'L LT', true);
-          if (newDate.isValid()) {
-            this._storeDate(newDate.toDate());
-            Popup.close();
-          } else {
-            this.error.set('invalid-date');
-            evt.target.date.focus();
-          }
-        },
-        'click .js-delete-date'(evt) {
-          evt.preventDefault();
-          this._deleteDate();
-          Popup.close();
-        },
-      },
-    ];
-  },
-});
+import { DatePicker } from '/client/lib/datepicker';

 Template.dateBadge.helpers({
  canModifyCard() {
@@ -207,6 +115,10 @@ const CardDate = BlazeComponent.extendComponent({
    }, 60000);
  },

+  showWeek() {
+    return this.date.get().week().toString();
+  },
+
  showDate() {
    // this will start working once mquandalle:moment
    // is updated to at least moment.js 2.10.5
@@ -279,7 +191,7 @@ class CardStartDate extends CardDate {
    // if dueAt or endAt exist & are > startAt, startAt doesn't need to be flagged
    if ((endAt && theDate.isAfter(endAt)) || (dueAt && theDate.isAfter(dueAt)))
      classes += 'long-overdue';
-    else if (theDate.isBefore(now, 'minute')) classes += 'almost-due';
+    else if (theDate.isAfter(now)) classes += '';
    else classes += 'current';
    return classes;
  }
@@ -376,12 +288,25 @@ class CardCustomFieldDate extends CardDate {
    });
  }

-  classes() {
-    return 'customfield-date';
+  showWeek() {
+    return this.date.get().week().toString();
+  }
+
+  showDate() {
+    // this will start working once mquandalle:moment
+    // is updated to at least moment.js 2.10.5
+    // until then, the date is displayed in the "L" format
+    return this.date.get().calendar(null, {
+      sameElse: 'llll',
+    });
  }

  showTitle() {
-    return '';
+    return `${this.date.get().format('LLLL')}`;
+  }
+
+  classes() {
+    return 'customfield-date';
  }

  events() {
@@ -446,3 +371,30 @@ class VoteEndDate extends CardDate {
  }
 }
 VoteEndDate.register('voteEndDate');
+
+class PokerEndDate extends CardDate {
+  onCreated() {
+    super.onCreated();
+    const self = this;
+    self.autorun(() => {
+      self.date.set(moment(self.data().getPokerEnd()));
+    });
+  }
+  classes() {
+    const classes = 'end-date' + ' ';
+    return classes;
+  }
+  showDate() {
+    return this.date.get().format('l LT');
+  }
+  showTitle() {
+    return `${TAPi18n.__('card-end-on')} ${this.date.get().format('LLLL')}`;
+  }
+
+  events() {
+    return super.events().concat({
+      'click .js-edit-date': Popup.open('editPokerEndDate'),
+    });
+  }
+}
+PokerEndDate.register('pokerEndDate');
@@ -3,5 +3,5 @@ template(name="descriptionForm")
  .new-description.js-new-description(
    class="{{#if descriptionFormIsOpen}}is-open{{/if}}")
    form.js-new-description-form
-      +editor(class="js-new-description-input" data-meteor-emoji-large="true" autofocus="autofocus")
+      +editor(class="js-new-description-input" autofocus="autofocus")
        | {{getUnsavedValue 'cardDescription' _id getDescription}}
@@ -3,6 +3,7 @@ const descriptionFormIsOpen = new ReactiveVar(false);
 BlazeComponent.extendComponent({
  onDestroyed() {
    descriptionFormIsOpen.set(false);
+    $('.note-popover').hide();
  },

  descriptionFormIsOpen() {
@@ -23,7 +23,6 @@
    background-color: #fff
    border: 0
    box-shadow: 0 1px 2px rgba(0, 0, 0, .23)
-    color: #8c8c8c
    height: 36px
    margin: 4px 4px 6px 0
    padding: 9px 11px
@@ -110,11 +110,19 @@ avatar-radius = 50%

  .card-details-header
    margin: 0 -20px 5px
-    padding 7px 20px
+    padding: 7px 20px
    background: darken(white, 7%)
    border-bottom: 1px solid darken(white, 14%)

+    .card-number {
+      color: darken(white, 30%);
+      display: inline-block;
+      margin-right: 5px;
+    }
+
    .close-card-details,
+    .maximize-card-details,
+    .minimize-card-details,
    .card-details-menu,
    .card-copy-button,
    .card-copy-mobile-button,
@@ -122,9 +130,11 @@ avatar-radius = 50%
    .card-details-menu-mobile-web
      float: right

-    .close-card-details
+    .close-card-details,
+    .maximize-card-details,
+    .minimize-card-details
      font-size: 24px
-      padding: 5px
+      padding: 5px 10px 5px 10px
      margin-right: -8px

    .close-card-details-mobile-web
@@ -211,6 +221,7 @@ avatar-radius = 50%
        word-wrap: break-word
        max-width: 36%
        flex-grow: 1
+      &.card-details-item-creator,
      &.card-details-item-received,
      &.card-details-item-start,
      &.card-details-item-due,
@@ -232,6 +243,43 @@ avatar-radius = 50%
  .activities
    padding-top: 10px

+@media screen and (min-width: 801px)
+  .card-details-maximized
+    padding: 0
+    flex-shrink: 0
+    flex-basis: calc(100% - 20px)
+    will-change: flex-basis
+    overflow-y: scroll
+    overflow-x: scroll
+    background: darken(white, 3%)
+    border-radius: bottom 3px
+    z-index: 1000 !important
+    animation: flexGrowIn 0.1s
+    box-shadow: 0 0 7px 0 darken(white, 30%)
+    transition: flex-basis 0.1s
+    box-sizing: border-box
+    position: absolute
+    top: 0
+    left: 0
+    height: calc(100% - 20px)
+    width: calc(100% - 20px)
+    float: left
+
+    .card-details-left
+      float: left
+      top: 60px
+      left: 20px
+      width: 47%
+
+    .card-details-right
+      position: absolute
+      float: right
+      top: 20px
+      left: 50%
+
+    .card-details-header
+      width: 47%
+
 input[type="text"].attachment-add-link-input
  float: left
  margin: 0 0 8px
@@ -259,7 +307,13 @@ input[type="submit"].attachment-add-link-submit
        margin-right: 0px

      .card-details-menu
-        margin-right: 10px
+        margin-right: 40px
+
+      .maximize-card-details
+        margin-right: 40px
+
+      .minimize-card-details
+        margin-right: 40px

 card-details-color(background, color...)
  background: background !important
@@ -356,3 +410,131 @@ card-details-color(background, color...)
  display: flex
 .js-show-positive-votes
  cursor: pointer
+
+.poker-voted
+  opacity: .7
+
+.poker-title
+  display: flex
+  justify-content: space-between
+
+  .js-edit-date
+    align-self: baseline
+    margin-left: 5px
+
+.poker-result
+  display: flex
+  flex-flow: row wrap
+.js-show-positive-poker-votes
+  cursor: pointer
+
+.poker-deck
+  display: grid
+  flex-direction: column
+  text-align: center
+
+.poker-card-result
+  width: 32px
+  font-size: 1em
+  font-weight: bold
+  padding: 4px 2px 4px 2px
+  cursor: default
+
+.winner
+  font-weight: bold
+  outline: #2d2d2d solid 2px
+
+.loser
+  opacity: .5
+
+.responsive-table
+  overflow-x: auto
+
+.poker-table
+  display: table
+  width: 100%
+  padding-top: 10px
+
+.poker-table-row
+  display: table-row
+
+.poker-table-heading
+  background-color: #EEE
+  display: table-header-group
+
+.poker-table-cell
+  display: table-cell
+  padding: 0 0 5px 2px
+  border-bottom: 1px solid #d2d0d0
+  text-align: center
+  min-width: 45px
+
+.poker-table-cell-who
+  width: 150px
+  vertical-align: middle
+
+.poker-table-heading-left,
+.poker-table-heading-right
+  display: table-header-group
+  font-weight: bold
+  border-top: 1px solid #808080
+
+@media (max-width: 400px)
+  .poker-table-heading-right
+    display: none
+
+.poker-table-body
+  display: table-row-group
+
+.poker-table-side-left,
+.poker-table-side-right
+  display: inline-block
+
+.poker-table-side-right
+  padding-left: 10px
+
+@media (max-width: 400px)
+  .poker-table-side-right
+    padding-left: 0px
+
+.estimation-add
+  display: block
+  overflow: auto
+  margin-top: 15px
+  margin-bottom: 5px
+  input
+    display: inline-block
+    float: right
+    margin: auto
+    margin-right: 10px
+    width: 100px
+  button
+    display: inline-block
+    float: right
+    margin: auto
+
+.poker-card
+  width:48px
+  height:72px
+  float:left
+  background:#fff
+  border-radius:5px
+  display:table
+  box-sizing:border-box
+  padding:5px
+  margin:3px
+  font-size:20px
+  font-weight: bold
+  text-shadow: #2d2d2d 1px 1px 0
+  box-shadow:0 0 5px #aaaaaa
+  text-align:center
+  position:relative
+  cursor: pointer
+
+  .inner
+    display:table-cell
+    vertical-align:middle
+    border-radius:5px
+    overflow:hidden
+    background-color: #cecece
+
@@ -4,8 +4,8 @@ template(name="checklists")
      i.fa.fa-check
      | {{_ 'checklists'}}
    if currentUser.isBoardMember
-      .material-toggle-switch
-        span.toggle-switch-title {{_ 'hide-checked-items'}}
+      .material-toggle-switch(title="{{_ 'hide-checked-items'}}")
+        //span.toggle-switch-title
        if hideCheckedItems
          input.toggle-switch(type="checkbox" id="toggleHideCheckedItemsButton" checked="checked")
        else
@@ -25,9 +25,8 @@ template(name="checklists")
    +inlinedForm(autoclose=false classNames="js-add-checklist" cardId = cardId)
      +addChecklistItemForm
    else
-      a.js-open-inlined-form
+      a.js-open-inlined-form(title="{{_ 'add-checklist'}}")
        i.fa.fa-plus
-        | {{_ 'add-checklist'}}...

 template(name="checklistDetail")
  .js-checklist.checklist
@@ -81,6 +80,9 @@ template(name="editChecklistItemForm")
    span(title=createdAt) {{ moment createdAt }}
    if canModifyCard
      a.js-delete-checklist-item {{_ "delete"}}...
+      a.js-convert-checklist-item-to-card
+        i.fa.fa-copy
+        | {{_ 'convertChecklistItemToCardPopup-title'}}

 template(name="checklistItems")
  .checklist-items.js-checklist-items
@@ -93,9 +95,8 @@ template(name="checklistItems")
      +inlinedForm(autoclose=false classNames="js-add-checklist-item" checklist = checklist)
        +addChecklistItemForm
      else
-        a.add-checklist-item.js-open-inlined-form
+        a.add-checklist-item.js-open-inlined-form(title="{{_ 'add-checklist-item'}}")
          i.fa.fa-plus
-          | {{_ 'add-checklist-item'}}...

 template(name='checklistItemDetail')
  .js-checklist-item.checklist-item(class="{{#if item.isFinished }}is-checked{{#if hideCheckedItems}} invisible{{/if}}{{/if}}")
@@ -112,3 +113,32 @@ template(name='checklistItemDetail')
      .item-title(class="{{#if item.isFinished }}is-checked{{/if}}")
        +viewer
          = item.title
+
+template(name="convertChecklistItemToCardPopup")
+  label(for='convert-checklist-item-to-card-title') {{_ 'title'}}:
+  textarea#copy-card-title.minicard-composer-textarea.js-card-title(autofocus)
+    = item.title
+  +boardsSwimlanesAndLists
+
+template(name="boardsSwimlanesAndLists")
+  unless currentUser.isWorker
+    label {{_ 'boards'}}:
+    select.js-select-boards(autofocus)
+      each boards
+        if $eq _id currentBoard._id
+          option(value="{{_id}}" selected) {{_ 'current'}}
+        else
+          option(value="{{_id}}") {{title}}
+
+  label {{_ 'swimlanes'}}:
+  select.js-select-swimlanes
+    each swimlanes
+      option(value="{{_id}}") {{title}}
+
+  label {{_ 'lists'}}:
+  select.js-select-lists
+    each aBoardLists
+      option(value="{{_id}}") {{title}}
+
+  .edit-controls.clearfix
+    button.primary.confirm.js-done {{_ 'done'}}
@@ -1,3 +1,7 @@
+import Cards from '/models/cards';
+import Boards from '/models/boards';
+
+const subManager = new SubsManager();
 const { calculateIndexData, capitalize } = Utils;

 function initSorting(items) {
@@ -111,7 +115,7 @@ BlazeComponent.extendComponent({
        title,
        checklistId: checklist._id,
        cardId: checklist.cardId,
-        sort: checklist.itemCount(),
+        sort: Utils.calculateIndexData(checklist.lastItem()).base,
      });
    }
    // We keep the form opened, empty it.
@@ -206,6 +210,7 @@ BlazeComponent.extendComponent({
        'submit .js-edit-checklist-title': this.editChecklist,
        'submit .js-add-checklist-item': this.addChecklistItem,
        'submit .js-edit-checklist-item': this.editChecklistItem,
+        'click .js-convert-checklist-item-to-card': Popup.open('convertChecklistItemToCard'),
        'click .js-delete-checklist-item': this.deleteItem,
        'click .confirm-checklist-delete': this.deleteChecklist,
        'focus .js-add-checklist-item': this.focusChecklistItem,
@@ -215,6 +220,47 @@ BlazeComponent.extendComponent({
  },
 }).register('checklists');

+BlazeComponent.extendComponent({
+  onCreated() {
+    subManager.subscribe('board', Session.get('currentBoard'), false);
+    this.selectedBoardId = new ReactiveVar(Session.get('currentBoard'));
+  },
+
+  boards() {
+    return Boards.find(
+      {
+        archived: false,
+        'members.userId': Meteor.userId(),
+        _id: { $ne: Meteor.user().getTemplatesBoardId() },
+      },
+      {
+        sort: { sort: 1 /* boards default sorting */ },
+      },
+    );
+  },
+
+  swimlanes() {
+    const board = Boards.findOne(this.selectedBoardId.get());
+    return board.swimlanes();
+  },
+
+  aBoardLists() {
+    const board = Boards.findOne(this.selectedBoardId.get());
+    return board.lists();
+  },
+
+  events() {
+    return [
+      {
+        'change .js-select-boards'(event) {
+          this.selectedBoardId.set($(event.currentTarget).val());
+          subManager.subscribe('board', this.selectedBoardId.get(), false);
+        },
+      },
+    ];
+  },
+}).register('boardsSwimlanesAndLists');
+
 Template.checklists.helpers({
  hideCheckedItems() {
    const currentUser = Meteor.user();
@@ -44,8 +44,8 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item

  span.fa.checklist-handle
    padding-right: 20px
-    padding-top: 6px
-    float: right
+    padding-top: 3px
+    float: left


 .js-confirm-checklist-delete
@@ -159,7 +159,8 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
    padding-top: 2px
    padding-right: 10px;

-.js-delete-checklist-item
+.js-delete-checklist-item,
+.js-convert-checklist-item-to-card
  margin: 0 0 0.5em 1.33em
  @extends .delete-text
  padding: 12px 0 0 0
@@ -44,9 +44,20 @@
    align-items: center
    justify-content: center

+.card-label-white
+  background-color: #ffffff
+  color: #000000 //Black text for better visibility
+  border: 1px solid #c0c0c0
+
+.card-label-white:hover
+  color: #aaaaaa //grey text for better visibility
+
 .card-label-green
  background-color: #3cb500

+.card-label-green:hover
+  color: #000000 //Black hover text for better visibility
+
 .card-label-yellow
  background-color: #fad900
  color: #000000 //Black text for better visibility
@@ -37,6 +37,9 @@ template(name="minicard")
      if getArchived
        span.linked-icon.linked-archived.fa.fa-archive
      +viewer
+        if currentBoard.allowsCardNumber
+          span.card-number
+            | ##{getCardNumber}
        = getTitle
      if $eq 'subtext-with-full-path' currentBoard.presentParentTask
        .parent-subtext
@@ -82,6 +85,9 @@ template(name="minicard")
                    +minicardCustomFieldDate
                else if $eq definition.type "checkbox"
                  .materialCheckBox(class="{{#if value }}is-checked{{/if}}")
+                else if $eq definition.type "stringtemplate"
+                  +viewer
+                    = formattedStringtemplateCustomFieldValue(definition)
                else
                  +viewer
                    = trueValue
@@ -96,6 +102,10 @@ template(name="minicard")
        each getMembers
          +userAvatar(userId=this)

+    if showCreator
+      .minicard-creator
+        +userAvatar(userId=this.userId noRemove=true)
+
    .badges
      unless currentUser.isNoComments
        if comments.count
@@ -114,6 +124,11 @@ template(name="minicard")
          span.badge-text {{ voteCountPositive }}
          span.badge-icon.fa.fa-thumbs-down(class="{{#if $eq voteState false}}text-red{{/if}}")
          span.badge-text {{ voteCountNegative }}
+      if getPokerQuestion
+        .badge.badge-state-image-only(title=getPokerQuestion)
+          span.badge-icon.fa.fa-check(class="{{#if pokerState}}text-green{{/if}}")
+          if expiredPoker
+            span.badge-text {{ getPokerEstimation }}
      if attachments.count
        .badge
          span.badge-icon.fa.fa-paperclip
@@ -122,3 +137,12 @@ template(name="minicard")
        .badge(class="{{#if checklistFinished}}is-finished{{/if}}")
          span.badge-icon.fa.fa-check-square-o
          span.badge-text.check-list-text {{checklistFinishedCount}}/{{checklistItemCount}}
+      if allSubtasks.count
+        .badge
+          span.badge-icon.fa.fa-sitemap
+          span.badge-text.check-list-text {{subtasksFinishedCount}}/{{allSubtasksCount}}
+          //{{subtasksFinishedCount}}/{{subtasksCount}} does not work because when a subtaks is archived, the count goes down
+      if currentBoard.allowsCardSortingByNumber
+        .badge
+          span.badge-icon.fa.fa-sort
+          span.badge-text {{ sort }}
@@ -21,6 +21,34 @@ BlazeComponent.extendComponent({
    }).format(customFieldTrueValue);
  },

+  formattedStringtemplateCustomFieldValue(definition) {
+    const customField = this.data()
+      .customFieldsWD()
+      .find(f => f._id === definition._id);
+
+    const customFieldTrueValue =
+      customField && customField.trueValue ? customField.trueValue : [];
+
+    return customFieldTrueValue
+      .filter(value => !!value.trim())
+      .map(value =>
+        definition.settings.stringtemplateFormat.replace(/%\{value\}/gi, value),
+      )
+      .join(definition.settings.stringtemplateSeparator ?? '');
+  },
+
+  showCreator() {
+    if (this.data().board()) {
+      return (
+        this.data().board.allowsCreator === null ||
+        this.data().board().allowsCreator === undefined ||
+        this.data().board().allowsCreator
+      );
+      // return this.data().board().allowsCreator;
+    }
+    return false;
+  },
+
  events() {
    return [
      {
@@ -89,7 +89,7 @@
      border-radius: 2px
      margin-right: 3px
      margin-bottom: 3px
-      
+
  .minicard-custom-fields
    display:block;
  .minicard-custom-field
@@ -114,6 +114,10 @@
      font-size:20px;
      color: #ccc;
  .minicard-title
+    .card-number
+      color: darken(white, 30%);
+      display: inline-block;
+      margin-right: 5px;
    p:last-child
      margin-bottom: 0
    .viewer
@@ -163,10 +167,10 @@
        line-height: 12px

  .minicard-members,
-  .minicard-assignees
+  .minicard-assignees,
+  .minicard-creator
    float: right
    margin-left: 5px
-    border-bottom: 1px solid red
    margin-bottom: 4px

    .member
@@ -185,6 +189,12 @@
    + .badges
      margin-top: 5px

+  .minicard-assignees
+    border-bottom: 1px solid red
+
+  .minicard-creator
+    border-bottom: 1px solid green
+
  .minicard-members:empty,
  .minicard-assignees:empty
    display: none
@@ -1,13 +1,17 @@
 template(name="resultCard")
  .result-card-wrapper
-    a.minicard-wrapper.card-title(href=absoluteUrl)
+    a.minicard-wrapper.card-title(href=originRelativeUrl)
      +minicard(this)
      //= card.title
    ul.result-card-context-list
      li.result-card-context(title="{{_ 'board'}}")
        .result-card-block-wrapper
-          +viewer
-            = getBoard.title
+          if boardId
+            +viewer
+              = getBoard.title
+          else
+            .broken-cards-null
+              | NULL
        if getBoard.archived
          i.fa.fa-archive
      li.result-card-context.result-card-context-separator
@@ -16,8 +20,12 @@ template(name="resultCard")
        = ' '
      li.result-card-context(title="{{_ 'swimlane'}}")
        .result-card-block-wrapper
-          +viewer
-            = getSwimlane.title
+          if swimlaneId
+            +viewer
+              = getSwimlane.title
+          else
+            .broken-cards-null
+              | NULL
        if getSwimlane.archived
          i.fa.fa-archive
      li.result-card-context.result-card-context-separator
@@ -26,7 +34,11 @@ template(name="resultCard")
        = ' '
      li.result-card-context(title="{{_ 'list'}}")
        .result-card-block-wrapper
-          +viewer
-            = getList.title
+          if listId
+            +viewer
+              = getList.title
+          else
+            .broken-cards-null
+              | NULL
        if getList.archived
          i.fa.fa-archive
@@ -15,9 +15,8 @@ template(name="subtasks")
    +inlinedForm(autoclose=false classNames="js-add-subtask" cardId = cardId)
      +addSubtaskItemForm
    else
-      a.js-open-inlined-form
+      a.js-open-inlined-form(title="{{_ 'add-subtask'}}")
        i.fa.fa-plus
-        | {{_ 'add-subtask'}}...

 template(name="subtaskDetail")
  .js-subtasks.subtask
@@ -37,6 +37,8 @@ BlazeComponent.extendComponent({
        ? targetBoard.getDefaultSwimline()._id
        : targetSwimlane._id;

+    const nextCardNumber = targetBoard.getNextCardNumber();
+
    if (title) {
      const _id = Cards.insert({
        title,
@@ -49,6 +51,7 @@ BlazeComponent.extendComponent({
        sort: sortIndex,
        swimlaneId,
        type: 'cardType-card',
+        cardNumber: nextCardNumber
      });

      // In case the filter is active we need to add the newly inserted card in
@@ -86,7 +86,7 @@ select
  margin-bottom: 8px

  &.inline
-  	width: 100%
+    width: 100%

 option[disabled]
  color: #8c8c8c
@@ -180,7 +180,8 @@
    border-bottom: 1px solid darken(white, 20%)

  .list
-    display: block
+    display: contents
+    flex-basis: auto
    width: 100%
    border-left: 0px
    &:first-child
@@ -4,8 +4,19 @@ template(name="listBody")
      if cards.count
        +inlinedForm(autoclose=false position="top")
          +addCardForm(listId=_id position="top")
+      ul.sidebar-list
+        each customFieldsSum
+          li
+            +viewer
+              = name
+            if $eq customFieldsSum.type "number"
+              +viewer
+                = value
+            if $eq customFieldsSum.type "currency"
+              +viewer
+                = formattedCurrencyCustomFieldValue(value)
      each (cardsWithLimit (idOrNull ../../_id))
-        a.minicard-wrapper.js-minicard(href=absoluteUrl
+        a.minicard-wrapper.js-minicard(href=originRelativeUrl
          class="{{#if cardIsSelected}}is-selected{{/if}}"
          class="{{#if MultiSelection.isSelected _id}}is-checked{{/if}}")
          if MultiSelection.isActive
@@ -19,19 +30,14 @@ template(name="listBody")
        +inlinedForm(autoclose=false position="bottom")
          +addCardForm(listId=_id position="bottom")
        else
-          a.open-minicard-composer.js-card-composer.js-open-inlined-form
+          a.open-minicard-composer.js-card-composer.js-open-inlined-form(title="{{_ 'add-card-to-bottom-of-list'}}")
            i.fa.fa-plus
-            | {{_ 'add-card'}}

 template(name="spinnerList")
-  .sk-spinner.sk-spinner-wave.sk-spinner-list(
-    class=currentBoard.colorClass
+  .sk-spinner.sk-spinner-list(
+    class="{{currentBoard.colorClass}} {{getSkSpinnerName}}"
    id="showMoreResults")
-    .sk-rect1
-    .sk-rect2
-    .sk-rect3
-    .sk-rect4
-    .sk-rect5
+    +spinnerRaw

 template(name="addCardForm")
  .minicard.minicard-composer.js-composer
@@ -1,3 +1,5 @@
+import { Spinner } from '/client/lib/spinner';
+
 const subManager = new SubsManager();
 const InfiniteScrollIter = 10;

@@ -11,6 +13,13 @@ BlazeComponent.extendComponent({
    return [];
  },

+  customFieldsSum() {
+    return CustomFields.find({
+      boardIds: { $in: [Session.get('currentBoard')] },
+      showSumAtTopOfList: true,
+    });
+  },
+
  openForm(options) {
    options = options || {};
    options.position = options.position || 'top';
@@ -79,7 +88,9 @@ BlazeComponent.extendComponent({
        Utils.boardView() === 'board-view-cal' ||
        !Utils.boardView()
      )
-        swimlaneId = board.getDefaultSwimline()._id;
+      swimlaneId = board.getDefaultSwimline()._id;
+
+      const nextCardNumber = board.getNextCardNumber();

      const _id = Cards.insert({
        title,
@@ -91,6 +102,7 @@ BlazeComponent.extendComponent({
        sort: sortIndex,
        swimlaneId,
        type: cardType,
+        cardNumber: nextCardNumber,
        linkedId,
      });

@@ -116,8 +128,6 @@ BlazeComponent.extendComponent({
      if (position === 'bottom') {
        this.scrollToBottom();
      }
-
-      formComponent.reset();
    }
  },

@@ -168,13 +178,16 @@ BlazeComponent.extendComponent({

  cardsWithLimit(swimlaneId) {
    const limit = this.cardlimit.get();
+    const defaultSort = { sort: 1 };
+    const sortBy = Session.get('sortBy') ? Session.get('sortBy') : defaultSort;
    const selector = {
      listId: this.currentData()._id,
      archived: false,
    };
    if (swimlaneId) selector.swimlaneId = swimlaneId;
    return Cards.find(Filter.mongoSelector(selector), {
-      sort: ['sort'],
+      // sort: ['sort'],
+      sort: sortBy,
      limit,
    });
  },
@@ -238,7 +251,7 @@ BlazeComponent.extendComponent({
      Boards.findOne(currentBoardId)
        .customFields()
        .fetch(),
-      function(field) {
+      function (field) {
        if (field.automaticallyOnCard || field.alwaysOnCard)
          arr.push({ _id: field._id, value: null });
      },
@@ -549,7 +562,7 @@ BlazeComponent.extendComponent({
      board = Boards.findOne((Meteor.user().profile || {}).templatesBoardId);
    } else {
      // Prefetch first non-current board id
-      board = Boards.findOne({
+      board = Boards.find({
        archived: false,
        'members.userId': Meteor.userId(),
        _id: {
@@ -695,7 +708,7 @@ BlazeComponent.extendComponent({
  },
 }).register('searchElementPopup');

-BlazeComponent.extendComponent({
+(class extends Spinner {
  onCreated() {
    this.cardlimit = this.parentComponent().cardlimit;

@@ -723,7 +736,7 @@ BlazeComponent.extendComponent({
        .parentComponent()
        .data()._id;
    }
-  },
+  }

  onRendered() {
    this.spinner = this.find('.sk-spinner-list');
@@ -738,21 +751,18 @@ BlazeComponent.extendComponent({
    );

    this.updateList();
-  },
+  }

  onDestroyed() {
    $(this.container).off(`scroll.spinner_${this.swimlaneId}_${this.listId}`);
    $(window).off(`resize.spinner_${this.swimlaneId}_${this.listId}`);
-  },
+  }

-  updateList() {
-    // Use fallback when requestIdleCallback is not available on iOS and Safari
-    // https://www.afasterweb.com/2017/11/20/utilizing-idle-moments/
-    checkIdleTime =
-      window.requestIdleCallback ||
-      function(handler) {
+  checkIdleTime() {
+    return window.requestIdleCallback ||
+      function (handler) {
        const startTime = Date.now();
-        return setTimeout(function() {
+        return setTimeout(function () {
          handler({
            didTimeout: false,
            timeRemaining() {
@@ -761,24 +771,38 @@ BlazeComponent.extendComponent({
          });
        }, 1);
      };
+  }
+
+  updateList() {
+    // Use fallback when requestIdleCallback is not available on iOS and Safari
+    // https://www.afasterweb.com/2017/11/20/utilizing-idle-moments/

    if (this.spinnerInView()) {
      this.cardlimit.set(this.cardlimit.get() + InfiniteScrollIter);
-      checkIdleTime(() => this.updateList());
+      this.checkIdleTime(() => this.updateList());
    }
-  },
+  }

  spinnerInView() {
-    const parentViewHeight = this.container.clientHeight;
-    const bottomViewPosition = this.container.scrollTop + parentViewHeight;
-
-    const threshold = this.spinner.offsetTop;
-
    // spinner deleted
    if (!this.spinner.offsetTop) {
      return false;
    }

-    return bottomViewPosition > threshold;
-  },
-}).register('spinnerList');
+    const parentViewHeight = this.container.clientHeight;
+    const bottomViewPosition = this.container.scrollTop + parentViewHeight;
+
+    let spinnerOffsetTop = this.spinner.offsetTop;
+
+    const addCard = $(this.container).find("a.open-minicard-composer").first()[0];
+    if (addCard !== undefined) {
+      spinnerOffsetTop -= addCard.clientHeight;
+    }
+
+    return bottomViewPosition > spinnerOffsetTop;
+  }
+
+  getSkSpinnerName() {
+    return "sk-spinner-" + super.getSpinnerName().toLowerCase();
+  }
+}.register('spinnerList'));
@@ -20,7 +20,7 @@ template(name="listHeader")

        if showCardsCountForList cards.count
          |&nbsp;
-          span(class="cardCount") {{cardsCount}} {{_ 'cards-count'}}
+          span(class="cardCount") {{cardsCount}} {{cardsCountForListIsOne cards.count}}
      if isMiniScreen
        if currentList
          if isWatching
@@ -28,8 +28,8 @@ template(name="listHeader")
          div.list-header-menu
            unless currentUser.isCommentOnly
              if canSeeAddCard
-                a.js-add-card.fa.fa-plus.list-header-plus-icon
-              a.fa.fa-navicon.js-open-list-menu
+                a.js-add-card.fa.fa-plus.list-header-plus-icon(title="{{_ 'add-card-to-top-of-list'}}")
+              a.fa.fa-navicon.js-open-list-menu(title="{{_ 'listActionPopup-title'}}")
        else
          a.list-header-menu-icon.fa.fa-angle-right.js-select-list
          a.list-header-handle.handle.fa.fa-arrows.js-list-handle
@@ -41,8 +41,8 @@ template(name="listHeader")
            //if isBoardAdmin
            //  a.fa.js-list-star.list-header-plus-icon(class="fa-star{{#unless starred}}-o{{/unless}}")
            if canSeeAddCard
-              a.js-add-card.fa.fa-plus.list-header-plus-icon
-            a.fa.fa-navicon.js-open-list-menu
+              a.js-add-card.fa.fa-plus.list-header-plus-icon(title="{{_ 'add-card-to-top-of-list'}}")
+            a.fa.fa-navicon.js-open-list-menu(title="{{_ 'listActionPopup-title'}}")
          if currentUser.isBoardAdmin
            if showDesktopDragHandles
              a.list-header-handle.handle.fa.fa-arrows.js-list-handle
@@ -82,7 +82,15 @@ BlazeComponent.extendComponent({

  showCardsCountForList(count) {
    const limit = this.limitToShowCardsCount();
-    return limit >= 0 && count > limit;
+    return limit >= 0 && count >= limit;
+  },
+
+  cardsCountForListIsOne(count) {
+    if (count === 1) {
+      return TAPi18n.__('cards-count-one');
+    } else {
+      return TAPi18n.__('cards-count');
+    }
  },

  events() {
@@ -3,39 +3,15 @@ template(name="brokenCardsHeaderBar")
    | {{_ 'broken-cards'}}

 template(name="brokenCards")
-  .wrapper
-    .broken-cards-wrapper
-      each card in brokenCardsList
-        .broken-cards-card-wrapper
-          .broken-cards-card-title
-            = card.title
-          ul.broken-cards-context-list
-            li.broken-cards-context(title="{{_ 'board'}}")
-              if card.boardId
-                +viewer
-                  = card.getBoard.title
-              else
-                .broken-cards-null
-                  | NULL
-            li.broken-cards-context.broken-cards-context-separator
-              = ' '
-              | {{_ 'context-separator'}}
-              = ' '
-            li.broken-cards-context(title="{{_ 'swimlane'}}")
-              if card.swimlaneId
-                +viewer
-                  = card.getSwimlane.title
-              else
-                .broken-cards-null
-                  | NULL
-            li.broken-cards-context
-              = ' '
-              | {{_ 'context-separator'}}
-              = ' '
-            li.broken-cards-context(title="{{_ 'list'}}")
-              if card.listId
-                +viewer
-                  = card.getList.title
-              else
-                .broken-cards-null
-                  | NULL
+  if currentUser
+    if searching.get
+      +spinner
+    else if hasResults.get
+      .global-search-results-list-wrapper
+        if hasQueryErrors.get
+          div
+            each msg in errorMessages
+              span.global-search-error-messages
+                = msg
+        else
+          +resultsPaged(this)
@@ -1,3 +1,5 @@
+import { CardSearchPagedComponent } from '../../lib/cardSearch';
+
 BlazeComponent.extendComponent({}).register('brokenCardsHeaderBar');

 Template.brokenCards.helpers({
@@ -6,23 +8,11 @@ Template.brokenCards.helpers({
  },
 });

-BlazeComponent.extendComponent({
+class BrokenCardsComponent extends CardSearchPagedComponent {
  onCreated() {
-    Meteor.subscribe('setting');
-    Meteor.subscribe('brokenCards');
-  },
+    super.onCreated();

-  brokenCardsList() {
-    const selector = {
-      $or: [
-        { boardId: { $in: [null, ''] } },
-        { swimlaneId: { $in: [null, ''] } },
-        { listId: { $in: [null, ''] } },
-        { permission: 'public' },
-        { members: { $elemMatch: { userId: user._id, isActive: true } } },
-      ],
-    };
-
-    return Cards.find(selector);
-  },
-}).register('brokenCards');
+    Meteor.subscribe('brokenCards', this.sessionId);
+  }
+}
+BrokenCardsComponent.register('brokenCards');
@@ -22,13 +22,17 @@ template(name="dueCardsModalTitle")

 template(name="dueCards")
  if currentUser
-    if isPageReady.get
-      .wrapper
-        .due-cards-dueat-list-wrapper
-          each card in dueCardsList
-            +resultCard(card)
-    else
+    if searching.get
      +spinner
+    else if hasResults.get
+      .global-search-results-list-wrapper
+        if hasQueryErrors.get
+          div
+            each msg in errorMessages
+              span.global-search-error-messages
+                = msg
+        else
+          +resultsPaged(this)

 template(name="dueCardsViewChangePopup")
  if currentUser
@@ -1,4 +1,14 @@
-const subManager = new SubsManager();
+import { CardSearchPagedComponent } from '../../lib/cardSearch';
+import {
+  OPERATOR_HAS,
+  OPERATOR_SORT,
+  OPERATOR_USER,
+  ORDER_ASCENDING,
+  PREDICATE_DUE_AT,
+} from '../../../config/search-const';
+import { QueryParams } from '../../../config/query-classes';
+
+// const subManager = new SubsManager();

 BlazeComponent.extendComponent({
  dueCardsView() {
@@ -40,106 +50,51 @@ BlazeComponent.extendComponent({
  },
 }).register('dueCardsViewChangePopup');

-BlazeComponent.extendComponent({
+class DueCardsComponent extends CardSearchPagedComponent {
  onCreated() {
-    this.isPageReady = new ReactiveVar(false);
+    super.onCreated();

-    this.autorun(() => {
-      const handle = subManager.subscribe(
-        'dueCards',
-        Utils.dueCardsView() === 'all',
-      );
-      Tracker.nonreactive(() => {
-        Tracker.autorun(() => {
-          this.isPageReady.set(handle.ready());
-        });
-      });
+    const queryParams = new QueryParams();
+    queryParams.addPredicate(OPERATOR_HAS, {
+      field: PREDICATE_DUE_AT,
+      exists: true,
    });
-    Meteor.subscribe('setting');
-  },
+    // queryParams[OPERATOR_LIMIT] = 5;
+    queryParams.addPredicate(OPERATOR_SORT, {
+      name: PREDICATE_DUE_AT,
+      order: ORDER_ASCENDING,
+    });
+
+    if (Utils.dueCardsView() !== 'all') {
+      queryParams.addPredicate(OPERATOR_USER, Meteor.user().username);
+    }
+
+    this.runGlobalSearch(queryParams);
+  }

  dueCardsView() {
    // eslint-disable-next-line no-console
    //console.log('sort:', Utils.dueCardsView());
    return Utils.dueCardsView();
-  },
+  }

  sortByBoard() {
    return this.dueCardsView() === 'board';
-  },
+  }

  dueCardsList() {
-    const allUsers = Utils.dueCardsView() === 'all';
-
-    const user = Meteor.user();
-
-    const archivedBoards = [];
-    Boards.find({ archived: true }).forEach(board => {
-      archivedBoards.push(board._id);
-    });
-
-    const permiitedBoards = [];
-    let selector = {
-      archived: false,
-    };
-    // for every user including admin allow her to see cards only from public boards
-    // or those where she is a member
-    //if (!user.isAdmin) {
-    selector.$or = [
-      { permission: 'public' },
-      { members: { $elemMatch: { userId: user._id, isActive: true } } },
-    ];
-    //}
-    Boards.find(selector).forEach(board => {
-      permiitedBoards.push(board._id);
-    });
-
-    const archivedSwimlanes = [];
-    Swimlanes.find({ archived: true }).forEach(swimlane => {
-      archivedSwimlanes.push(swimlane._id);
-    });
-
-    const archivedLists = [];
-    Lists.find({ archived: true }).forEach(list => {
-      archivedLists.push(list._id);
-    });
-
-    selector = {
-      archived: false,
-      boardId: {
-        $nin: archivedBoards,
-        $in: permiitedBoards,
-      },
-      swimlaneId: { $nin: archivedSwimlanes },
-      listId: { $nin: archivedLists },
-      dueAt: { $ne: null },
-      endAt: null,
-    };
-
-    if (!allUsers) {
-      selector.$or = [{ members: user._id }, { assignees: user._id }];
+    const results = this.getResults();
+    console.log('results:', results);
+    const cards = [];
+    if (results) {
+      results.forEach(card => {
+        cards.push(card);
+      });
    }

-    const cards = [];
-
-    // eslint-disable-next-line no-console
-    // console.log('cards selector:', selector);
-    Cards.find(selector).forEach(card => {
-      cards.push(card);
-      // eslint-disable-next-line no-console
-      // console.log(
-      //   'board:',
-      //   card.board(),
-      //   'swimlane:',
-      //   card.swimlane(),
-      //   'list:',
-      //   card.list(),
-      // );
-    });
-
    cards.sort((a, b) => {
-      const x = a.dueAt === null ? Date('2100-12-31') : a.dueAt;
-      const y = b.dueAt === null ? Date('2100-12-31') : b.dueAt;
+      const x = a.dueAt === null ? new Date('2100-12-31') : a.dueAt;
+      const y = b.dueAt === null ? new Date('2100-12-31') : b.dueAt;

      if (x > y) return 1;
      else if (x < y) return -1;
@@ -148,7 +103,9 @@ BlazeComponent.extendComponent({
    });

    // eslint-disable-next-line no-console
-    // console.log('cards:', cards);
+    console.log('cards:', cards);
    return cards;
-  },
-}).register('dueCards');
+  }
+}
+
+DueCardsComponent.register('dueCards');
@@ -1,3 +1,9 @@
+const specialHandles = [
+  {userId: 'board_members', username: 'board_members'},
+  {userId: 'card_members', username: 'card_members'}
+];
+const specialHandleNames = specialHandles.map(m => m.username);
+
 Template.editor.onRendered(() => {
  const textareaSelector = 'textarea';
  const mentions = [
@@ -7,13 +13,14 @@ Template.editor.onRendered(() => {
      search(term, callback) {
        const currentBoard = Boards.findOne(Session.get('currentBoard'));
        callback(
+          _.union(
          currentBoard
            .activeMembers()
            .map(member => {
              const username = Users.findOne(member.userId).username;
              return username.includes(term) ? username : null;
            })
-            .filter(Boolean),
+            .filter(Boolean), [...specialHandleNames])
        );
      },
      template(value) {
@@ -49,8 +56,8 @@ Template.editor.onRendered(() => {
          ['para', ['ul', 'ol', 'paragraph']],
          ['table', ['table']],
          //['insert', ['link', 'picture', 'video']], // iframe tag will be sanitized TODO if iframe[class=note-video-clip] can be added into safe list, insert video can be enabled
-          //['insert', ['link', 'picture']], // modal popup has issue somehow :(
-          ['view', ['fullscreen', 'help']],
+          ['insert', ['link']], //, 'picture']], // modal popup has issue somehow :(
+          ['view', ['fullscreen', 'codeview', 'help']],
        ];
    const cleanPastedHTML = function(input) {
      const badTags = [
@@ -145,6 +152,7 @@ Template.editor.onRendered(() => {
                const MAX_IMAGE_PIXEL = Utils.MAX_IMAGE_PIXEL;
                const COMPRESS_RATIO = Utils.IMAGE_COMPRESS_RATIO;
                const insertImage = src => {
+                  // process all image upload types to the description/comment window
                  const img = document.createElement('img');
                  img.src = src;
                  img.setAttribute('width', '100%');
@@ -210,7 +218,16 @@ Template.editor.onRendered(() => {
                }
              }
            },
-            onPaste() {
+            onPaste(e) {
+              var clipboardData = e.clipboardData;
+              var pastedData = clipboardData.getData('Text');
+
+              //if pasted data is an image, exit
+              if (!pastedData.length) {
+                e.preventDefault();
+                return;
+              }
+
              // clear up unwanted tag info when user pasted in text
              const thisNote = this;
              const updatePastedText = function(object) {
@@ -234,17 +251,17 @@ Template.editor.onRendered(() => {
            },
          },
          dialogsInBody: true,
-          disableDragAndDrop: true,
+          spellCheck: true,
+          disableGrammar: false,
+          disableDragAndDrop: false,
          toolbar,
          popover: {
            image: [
-              [
-                'image',
-                ['resizeFull', 'resizeHalf', 'resizeQuarter', 'resizeNone'],
-              ],
+              ['imagesize', ['imageSize100', 'imageSize50', 'imageSize25']],
              ['float', ['floatLeft', 'floatRight', 'floatNone']],
              ['remove', ['removeMedia']],
            ],
+            link: [['link', ['linkDialogShow', 'unlink']]],
            table: [
              ['add', ['addRowDown', 'addRowUp', 'addColLeft', 'addColRight']],
              ['delete', ['deleteRow', 'deleteCol', 'deleteTable']],
@@ -263,10 +280,12 @@ Template.editor.onRendered(() => {
  }
 });

-import sanitizeXss from 'xss';
+import DOMPurify from 'dompurify';

 // Additional  safeAttrValue function to allow for other specific protocols
 // See https://github.com/leizongmin/js-xss/issues/52#issuecomment-241354114
+
+/*
 function mySafeAttrValue(tag, name, value, cssFilter) {
  // only when the tag is 'a' and attribute is 'href'
  // then use your custom function
@@ -292,6 +311,7 @@ function mySafeAttrValue(tag, name, value, cssFilter) {
    return sanitizeXss.safeAttrValue(tag, name, value, cssFilter);
  }
 }
+*/

 // XXX I believe we should compute a HTML rendered field on the server that
 // would handle markdown and user mentions. We can simply have two
@@ -307,14 +327,16 @@ Blaze.Template.registerHelper(
    let content = Blaze.toHTML(view.templateContentBlock);
    const currentBoard = Boards.findOne(Session.get('currentBoard'));
    if (!currentBoard)
-      return HTML.Raw(sanitizeXss(content, { safeAttrValue: mySafeAttrValue }));
-    const knowedUsers = currentBoard.members.map(member => {
+      return HTML.Raw(
+        DOMPurify.sanitize(content, { ALLOW_UNKNOWN_PROTOCOLS: true }),
+      );
+    const knowedUsers = _.union(currentBoard.members.map(member => {
      const u = Users.findOne(member.userId);
      if (u) {
        member.username = u.username;
      }
      return member;
-    });
+    }), [...specialHandles]);
    const mentionRegex = /\B@([\w.]*)/gi;

    let currentMention;
@@ -351,7 +373,9 @@ Blaze.Template.registerHelper(
      content = content.replace(fullMention, Blaze.toHTML(link));
    }

-    return HTML.Raw(sanitizeXss(content, { safeAttrValue: mySafeAttrValue }));
+    return HTML.Raw(
+      DOMPurify.sanitize(content, { ALLOW_UNKNOWN_PROTOCOLS: true }),
+    );
  }),
 );

@@ -10,11 +10,30 @@ template(name="globalSearchModalTitle")
      i.fa.fa-keyboard-o
      | {{_ 'globalSearch-title'}}

+template(name="resultsPaged")
+  if resultsHeading.get
+    h1
+      = resultsHeading.get
+      a.fa.fa-link(title="{{_ 'link-to-search' }}" href="{{ getSearchHref }}")
+  each card in results.get
+    +resultCard(card)
+  table.global-search-footer
+    tr
+      td.global-search-previous-page
+        if hasPreviousPage.get
+          button.js-previous-page
+            | {{_ 'previous-page' }}
+      td.global-search-next-page(align="right")
+        if hasNextPage.get
+          button.js-next-page
+            | {{_ 'next-page' }}
+
 template(name="globalSearch")
  if currentUser
    .wrapper
-      form.global-search-instructions.js-search-query-form
+      form.global-search-page.js-search-query-form
        input.global-search-query-input(
+          style="{# if hasResults.get #}display: inline-block;{#/if#}"
          id="global-search-input"
          type="text"
          name="searchQuery"
@@ -22,73 +41,46 @@ template(name="globalSearch")
          value="{{ query.get }}"
          autofocus dir="auto"
        )
+        a.js-new-search.fa.fa-eraser
      if searching.get
        +spinner
      else if hasResults.get
        .global-search-results-list-wrapper
          if hasQueryErrors.get
-            div
+            ul
              each msg in errorMessages
-                span.global-search-error-messages
+                li.global-search-error-messages
                  = msg
-          else
-            h1
-              = resultsHeading.get
-              a.fa.fa-link(title="{{_ 'link-to-search' }}" href="{{ getSearchHref }}")
-            each card in results.get
-              +resultCard(card)
-            table.global-search-footer
-              tr
-                td.global-search-previous-page
-                  if hasPreviousPage.get
-                    button.js-previous-page
-                      | {{_ 'previous-page' }}
-                td.global-search-next-page(align="right")
-                  if hasNextPage.get
-                    button.js-next-page
-                      | {{_ 'next-page' }}
+          +resultsPaged(this)
+      else if serverError.get
+        .global-search-page
+          .global-search-help
+            h1 {{_ 'server-error' }}
+            +viewer
+              | {{_ 'server-error-troubleshooting' }}
      else
-        .global-search-instructions
-          h2 {{_ 'boards' }}
-          .lists-wrapper
-            each title in myBoardNames.get
-              span.card-label.list-title.js-board-title
-                = title
-          h2 {{_ 'lists' }}
-          .lists-wrapper
-            each title in myLists.get
-              span.card-label.list-title.js-list-title
-                = title
-          h2 {{_ 'label-colors' }}
-          .palette-colors: each label in labelColors
-            span.card-label.palette-color.js-label-color(class="card-label-{{label.color}}")
-              = label.name
-          if myLabelNames.get.length
-            h2 {{_ 'label-names' }}
+        .global-search-page
+          .global-search-help
+            h2 {{_ 'boards' }}
            .lists-wrapper
-              each name in myLabelNames.get
-                span.card-label.list-title.js-label-name
-                  = name
-          +viewer
-            = searchInstructions
-
-template(name="globalSearchViewChangePopup")
-  if currentUser
-    ul.pop-over-list
-      li
-        with "globalSearchViewChange-choice-me"
-          a.js-global-search-view-me
-            i.fa.fa-user.colorful
-            | {{_ 'globalSearchViewChange-choice-me'}}
-            if $eq Utils.globalSearchView "me"
-              i.fa.fa-check
-      li
-        with "globalSearchViewChange-choice-all"
-          a.js-global-search-view-all
-            i.fa.fa-users.colorful
-            | {{_ 'globalSearchViewChange-choice-all'}}
-            span.sub-name
-              +viewer
-                | {{_ 'globalSearchViewChange-choice-all-description' }}
-            if $eq Utils.globalSearchView "all"
-              i.fa.fa-check
+              each title in myBoardNames.get
+                span.card-label.list-title.js-board-title
+                  = title
+            h2 {{_ 'lists' }}
+            .lists-wrapper
+              each title in myLists.get
+                span.card-label.list-title.js-list-title
+                  = title
+            h2 {{_ 'label-colors' }}
+            .palette-colors: each label in labelColors
+              span.card-label.palette-color.js-label-color(class="card-label-{{label.color}}")
+                = label.name
+            if myLabelNames.get.length
+              h2 {{_ 'label-names' }}
+              .lists-wrapper
+                each name in myLabelNames.get
+                  span.card-label.list-title.js-label-name
+                    = name
+          .global-search-instructions
+            +viewer
+              = searchInstructions
@@ -1,4 +1,8 @@
-const subManager = new SubsManager();
+import { CardSearchPagedComponent } from '../../lib/cardSearch';
+import Boards from '../../../models/boards';
+import { Query, QueryErrors } from '../../../config/query-classes';
+
+// const subManager = new SubsManager();

 BlazeComponent.extendComponent({
  events() {
@@ -16,45 +20,14 @@ Template.globalSearch.helpers({
  },
 });

-BlazeComponent.extendComponent({
-  events() {
-    return [
-      {
-        'click .js-due-cards-view-me'() {
-          Utils.setDueCardsView('me');
-          Popup.close();
-        },
-
-        'click .js-due-cards-view-all'() {
-          Utils.setDueCardsView('all');
-          Popup.close();
-        },
-      },
-    ];
-  },
-}).register('globalSearchViewChangePopup');
-
-BlazeComponent.extendComponent({
+class GlobalSearchComponent extends CardSearchPagedComponent {
  onCreated() {
-    this.searching = new ReactiveVar(false);
-    this.hasResults = new ReactiveVar(false);
-    this.hasQueryErrors = new ReactiveVar(false);
-    this.query = new ReactiveVar('');
-    this.resultsHeading = new ReactiveVar('');
-    this.searchLink = new ReactiveVar(null);
+    super.onCreated();
    this.myLists = new ReactiveVar([]);
    this.myLabelNames = new ReactiveVar([]);
    this.myBoardNames = new ReactiveVar([]);
-    this.results = new ReactiveVar([]);
-    this.hasNextPage = new ReactiveVar(false);
-    this.hasPreviousPage = new ReactiveVar(false);
+    this.parsingErrors = new QueryErrors();
    this.queryParams = null;
-    this.parsingErrors = [];
-    this.resultsCount = 0;
-    this.totalHits = 0;
-    this.queryErrors = null;
-    this.colorMap = null;
-    this.resultsPerPage = 25;

    Meteor.call('myLists', (err, data) => {
      if (!err) {
@@ -73,428 +46,71 @@ BlazeComponent.extendComponent({
        this.myBoardNames.set(data);
      }
    });
-  },
+  }

  onRendered() {
    Meteor.subscribe('setting');

    // eslint-disable-next-line no-console
    //console.log('lang:', TAPi18n.getLanguage());
-    this.colorMap = Boards.colorMap();
-    // eslint-disable-next-line no-console
-    // console.log('colorMap:', this.colorMap);

    if (Session.get('globalQuery')) {
      this.searchAllBoards(Session.get('globalQuery'));
    }
-  },
+  }

  resetSearch() {
-    this.searching.set(false);
-    this.results.set([]);
-    this.hasResults.set(false);
-    this.hasQueryErrors.set(false);
-    this.resultsHeading.set('');
-    this.parsingErrors = [];
-    this.resultsCount = 0;
-    this.totalHits = 0;
-    this.queryErrors = null;
-  },
-
-  getSessionData() {
-    return SessionData.findOne({
-      userId: Meteor.userId(),
-      sessionId: SessionData.getSessionId(),
-    });
-  },
-
-  getResults() {
-    // eslint-disable-next-line no-console
-    // console.log('getting results');
-    if (this.queryParams) {
-      const sessionData = this.getSessionData();
-      // eslint-disable-next-line no-console
-      // console.log('selector:', sessionData.getSelector());
-      // console.log('session data:', sessionData);
-      const cards = Cards.find({ _id: { $in: sessionData.cards } });
-      this.queryErrors = sessionData.errors;
-      if (this.queryErrors.length) {
-        this.hasQueryErrors.set(true);
-        return null;
-      }
-
-      if (cards) {
-        this.totalHits = sessionData.totalHits;
-        this.resultsCount = cards.count();
-        this.resultsStart = sessionData.lastHit - this.resultsCount + 1;
-        this.resultsEnd = sessionData.lastHit;
-        this.resultsHeading.set(this.getResultsHeading());
-        this.results.set(cards);
-        this.hasNextPage.set(sessionData.lastHit < sessionData.totalHits);
-        this.hasPreviousPage.set(
-          sessionData.lastHit - sessionData.resultsCount > 0,
-        );
-      }
-    }
-    this.resultsCount = 0;
-    return null;
-  },
+    super.resetSearch();
+    this.parsingErrors = new QueryErrors();
+  }

  errorMessages() {
-    if (this.parsingErrors.length) {
-      return this.parsingErrorMessages();
+    if (this.parsingErrors.hasErrors()) {
+      return this.parsingErrors.errorMessages();
    }
    return this.queryErrorMessages();
-  },
+  }

  parsingErrorMessages() {
-    const messages = [];
+    this.parsingErrors.errorMessages();
+  }

-    if (this.parsingErrors.length) {
-      this.parsingErrors.forEach(err => {
-        messages.push(TAPi18n.__(err.tag, err.value));
-      });
-    }
-
-    return messages;
-  },
-
-  queryErrorMessages() {
-    messages = [];
-
-    this.queryErrors.forEach(err => {
-      let value = err.color ? TAPi18n.__(`color-${err.value}`) : err.value;
-      if (!value) {
-        value = err.value;
-      }
-      messages.push(TAPi18n.__(err.tag, value));
-    });
-
-    return messages;
-  },
-
-  searchAllBoards(query) {
-    query = query.trim();
+  searchAllBoards(queryText) {
+    queryText = queryText.trim();
    // eslint-disable-next-line no-console
-    //console.log('query:', query);
+    //console.log('queryText:', queryText);

-    this.query.set(query);
+    this.query.set(queryText);

    this.resetSearch();

-    if (!query) {
+    if (!queryText) {
      return;
    }

    this.searching.set(true);

-    const reOperator1 = new RegExp(
-      '^((?<operator>[\\p{Letter}\\p{Mark}]+):|(?<abbrev>[#@]))(?<value>[\\p{Letter}\\p{Mark}]+)(\\s+|$)',
-      'iu',
-    );
-    const reOperator2 = new RegExp(
-      '^((?<operator>[\\p{Letter}\\p{Mark}]+):|(?<abbrev>[#@]))(?<quote>["\']*)(?<value>.*?)\\k<quote>(\\s+|$)',
-      'iu',
-    );
-    const reText = new RegExp('^(?<text>\\S+)(\\s+|$)', 'u');
-    const reQuotedText = new RegExp(
-      '^(?<quote>["\'])(?<text>.*?)\\k<quote>(\\s+|$)',
-      'u',
-    );
-
-    const operators = {
-      'operator-board': 'boards',
-      'operator-board-abbrev': 'boards',
-      'operator-swimlane': 'swimlanes',
-      'operator-swimlane-abbrev': 'swimlanes',
-      'operator-list': 'lists',
-      'operator-list-abbrev': 'lists',
-      'operator-label': 'labels',
-      'operator-label-abbrev': 'labels',
-      'operator-user': 'users',
-      'operator-user-abbrev': 'users',
-      'operator-member': 'members',
-      'operator-member-abbrev': 'members',
-      'operator-assignee': 'assignees',
-      'operator-assignee-abbrev': 'assignees',
-      'operator-status': 'status',
-      'operator-due': 'dueAt',
-      'operator-created': 'createdAt',
-      'operator-modified': 'modifiedAt',
-      'operator-comment': 'comments',
-    };
-
-    const predicates = {
-      due: {
-        'predicate-overdue': 'overdue',
-      },
-      durations: {
-        'predicate-week': 'week',
-        'predicate-month': 'month',
-        'predicate-quarter': 'quarter',
-        'predicate-year': 'year',
-      },
-      status: {
-        'predicate-archived': 'archived',
-        'predicate-all': 'all',
-        'predicate-ended': 'ended',
-      },
-      sorts: {
-        'predicate-due': 'dueAt',
-        'predicate-created': 'createdAt',
-        'predicate-modified': 'modifiedAt',
-      },
-    };
-    const predicateTranslations = {};
-    Object.entries(predicates).forEach(([category, catPreds]) => {
-      predicateTranslations[category] = {};
-      Object.entries(catPreds).forEach(([tag, value]) => {
-        predicateTranslations[category][TAPi18n.__(tag)] = value;
-      });
-    });
-    // eslint-disable-next-line no-console
-    // console.log('predicateTranslations:', predicateTranslations);
-
-    const operatorMap = {};
-    Object.entries(operators).forEach(([key, value]) => {
-      operatorMap[TAPi18n.__(key).toLowerCase()] = value;
-    });
-    // eslint-disable-next-line no-console
-    // console.log('operatorMap:', operatorMap);
-
-    const params = {
-      limit: this.resultsPerPage,
-      boards: [],
-      swimlanes: [],
-      lists: [],
-      users: [],
-      members: [],
-      assignees: [],
-      labels: [],
-      status: [],
-      dueAt: null,
-      createdAt: null,
-      modifiedAt: null,
-      comments: [],
-    };
-
-    let text = '';
-    while (query) {
-      m = query.match(reOperator1);
-      if (!m) {
-        m = query.match(reOperator2);
-        if (m) {
-          query = query.replace(reOperator2, '');
-        }
-      } else {
-        query = query.replace(reOperator1, '');
-      }
-      if (m) {
-        let op;
-        if (m.groups.operator) {
-          op = m.groups.operator.toLowerCase();
-        } else {
-          op = m.groups.abbrev.toLowerCase();
-        }
-        if (operatorMap.hasOwnProperty(op)) {
-          let value = m.groups.value;
-          if (operatorMap[op] === 'labels') {
-            if (value in this.colorMap) {
-              value = this.colorMap[value];
-              // console.log('found color:', value);
-            }
-          } else if (
-            ['dueAt', 'createdAt', 'modifiedAt'].includes(operatorMap[op])
-          ) {
-            let days = parseInt(value, 10);
-            let duration = null;
-            if (isNaN(days)) {
-              if (predicateTranslations.durations[value]) {
-                duration = predicateTranslations.durations[value];
-                value = moment();
-              } else if (predicateTranslations.due[value] === 'overdue') {
-                value = moment();
-                duration = 'days';
-                days = 0;
-              } else {
-                this.parsingErrors.push({
-                  tag: 'operator-number-expected',
-                  value: { operator: op, value },
-                });
-                value = null;
-              }
-            } else {
-              value = moment();
-            }
-            if (value) {
-              if (operatorMap[op] === 'dueAt') {
-                value = value.add(days, duration ? duration : 'days').format();
-              } else {
-                value = value
-                  .subtract(days, duration ? duration : 'days')
-                  .format();
-              }
-            }
-          } else if (operatorMap[op] === 'sort') {
-            if (!predicateTranslations.sorts[value]) {
-              this.parsingErrors.push({
-                tag: 'operator-sort-invalid',
-                value,
-              });
-            } else {
-              value = predicateTranslations.sorts[value];
-            }
-          } else if (operatorMap[op] === 'status') {
-            if (!predicateTranslations.status[value]) {
-              this.parsingErrors.push({
-                tag: 'operator-status-invalid',
-                value,
-              });
-            } else {
-              value = predicateTranslations.status[value];
-            }
-          }
-          if (Array.isArray(params[operatorMap[op]])) {
-            params[operatorMap[op]].push(value);
-          } else {
-            params[operatorMap[op]] = value;
-          }
-        } else {
-          this.parsingErrors.push({
-            tag: 'operator-unknown-error',
-            value: op,
-          });
-        }
-        continue;
-      }
-
-      m = query.match(reQuotedText);
-      if (!m) {
-        m = query.match(reText);
-        if (m) {
-          query = query.replace(reText, '');
-        }
-      } else {
-        query = query.replace(reQuotedText, '');
-      }
-      if (m) {
-        text += (text ? ' ' : '') + m.groups.text;
-      }
-    }
+    const query = new Query();
+    query.buildParams(queryText);

    // eslint-disable-next-line no-console
-    // console.log('text:', text);
-    params.text = text;
+    // console.log('params:', query.getParams());

-    // eslint-disable-next-line no-console
-    console.log('params:', params);
+    this.queryParams = query.getQueryParams().getParams();

-    this.queryParams = params;
-
-    if (this.parsingErrors.length) {
+    if (query.hasErrors()) {
      this.searching.set(false);
-      this.queryErrors = this.parsingErrorMessages();
+      this.queryErrors = query.errors();
      this.hasResults.set(true);
      this.hasQueryErrors.set(true);
      return;
    }

-    this.autorun(() => {
-      const handle = Meteor.subscribe(
-        'globalSearch',
-        SessionData.getSessionId(),
-        params,
-      );
-      Tracker.nonreactive(() => {
-        Tracker.autorun(() => {
-          if (handle.ready()) {
-            this.getResults();
-            this.searching.set(false);
-            this.hasResults.set(true);
-          }
-        });
-      });
-    });
-  },
-
-  nextPage() {
-    sessionData = this.getSessionData();
-
-    const params = {
-      limit: this.resultsPerPage,
-      selector: sessionData.getSelector(),
-      skip: sessionData.lastHit,
-    };
-
-    this.autorun(() => {
-      const handle = Meteor.subscribe(
-        'globalSearch',
-        SessionData.getSessionId(),
-        params,
-      );
-      Tracker.nonreactive(() => {
-        Tracker.autorun(() => {
-          if (handle.ready()) {
-            this.getResults();
-            this.searching.set(false);
-            this.hasResults.set(true);
-          }
-        });
-      });
-    });
-  },
-
-  previousPage() {
-    sessionData = this.getSessionData();
-
-    const params = {
-      limit: this.resultsPerPage,
-      selector: sessionData.getSelector(),
-      skip:
-        sessionData.lastHit - sessionData.resultsCount - this.resultsPerPage,
-    };
-
-    this.autorun(() => {
-      const handle = Meteor.subscribe(
-        'globalSearch',
-        SessionData.getSessionId(),
-        params,
-      );
-      Tracker.nonreactive(() => {
-        Tracker.autorun(() => {
-          if (handle.ready()) {
-            this.getResults();
-            this.searching.set(false);
-            this.hasResults.set(true);
-          }
-        });
-      });
-    });
-  },
-
-  getResultsHeading() {
-    if (this.resultsCount === 0) {
-      return TAPi18n.__('no-cards-found');
-    } else if (this.resultsCount === 1) {
-      return TAPi18n.__('one-card-found');
-    } else if (this.resultsCount === this.totalHits) {
-      return TAPi18n.__('n-cards-found', this.resultsCount);
-    }
-
-    return TAPi18n.__('n-n-of-n-cards-found', {
-      start: this.resultsStart,
-      end: this.resultsEnd,
-      total: this.totalHits,
-    });
-  },
-
-  getSearchHref() {
-    const baseUrl = window.location.href.replace(/([?#].*$|\s*$)/, '');
-    return `${baseUrl}?q=${encodeURIComponent(this.query.get())}`;
-  },
+    this.runGlobalSearch(query.getQueryParams());
+  }

  searchInstructions() {
-    tags = {
+    const tags = {
      operator_board: TAPi18n.__('operator-board'),
      operator_list: TAPi18n.__('operator-list'),
      operator_swimlane: TAPi18n.__('operator-swimlane'),
@@ -507,10 +123,14 @@ BlazeComponent.extendComponent({
      operator_member_abbrev: TAPi18n.__('operator-member-abbrev'),
      operator_assignee: TAPi18n.__('operator-assignee'),
      operator_assignee_abbrev: TAPi18n.__('operator-assignee-abbrev'),
+      operator_creator: TAPi18n.__('operator-creator'),
      operator_due: TAPi18n.__('operator-due'),
      operator_created: TAPi18n.__('operator-created'),
      operator_modified: TAPi18n.__('operator-modified'),
      operator_status: TAPi18n.__('operator-status'),
+      operator_has: TAPi18n.__('operator-has'),
+      operator_sort: TAPi18n.__('operator-sort'),
+      operator_limit: TAPi18n.__('operator-limit'),
      predicate_overdue: TAPi18n.__('predicate-overdue'),
      predicate_archived: TAPi18n.__('predicate-archived'),
      predicate_all: TAPi18n.__('predicate-all'),
@@ -519,74 +139,63 @@ BlazeComponent.extendComponent({
      predicate_month: TAPi18n.__('predicate-month'),
      predicate_quarter: TAPi18n.__('predicate-quarter'),
      predicate_year: TAPi18n.__('predicate-year'),
+      predicate_attachment: TAPi18n.__('predicate-attachment'),
+      predicate_description: TAPi18n.__('predicate-description'),
+      predicate_checklist: TAPi18n.__('predicate-checklist'),
+      predicate_public: TAPi18n.__('predicate-public'),
+      predicate_private: TAPi18n.__('predicate-private'),
+      predicate_due: TAPi18n.__('predicate-due'),
+      predicate_created: TAPi18n.__('predicate-created'),
+      predicate_modified: TAPi18n.__('predicate-modified'),
+      predicate_start: TAPi18n.__('predicate-start'),
+      predicate_end: TAPi18n.__('predicate-end'),
+      predicate_assignee: TAPi18n.__('predicate-assignee'),
+      predicate_member: TAPi18n.__('predicate-member'),
    };

-    text = `# ${TAPi18n.__('globalSearch-instructions-heading')}`;
-    text += `\n${TAPi18n.__('globalSearch-instructions-description', tags)}`;
-    text += `\n${TAPi18n.__('globalSearch-instructions-operators', tags)}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-board',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-list',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-swimlane',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-comment',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-label',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-hash',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-user',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-operator-at', tags)}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-member',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-assignee',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-operator-due', tags)}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-created',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-operator-modified',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__(
-      'globalSearch-instructions-status-archived',
-      tags,
-    )}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-status-all', tags)}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-status-ended', tags)}`;
-
-    text += `\n## ${TAPi18n.__('heading-notes')}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-notes-1', tags)}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-notes-2', tags)}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-notes-3', tags)}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-notes-3-2', tags)}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-notes-4', tags)}`;
-    text += `\n* ${TAPi18n.__('globalSearch-instructions-notes-5', tags)}`;
-
+    let text = '';
+    [
+      ['# ', 'globalSearch-instructions-heading'],
+      ['\n', 'globalSearch-instructions-description'],
+      ['\n\n', 'globalSearch-instructions-operators'],
+      ['\n- ', 'globalSearch-instructions-operator-board'],
+      ['\n- ', 'globalSearch-instructions-operator-list'],
+      ['\n- ', 'globalSearch-instructions-operator-swimlane'],
+      ['\n- ', 'globalSearch-instructions-operator-comment'],
+      ['\n- ', 'globalSearch-instructions-operator-label'],
+      ['\n- ', 'globalSearch-instructions-operator-hash'],
+      ['\n- ', 'globalSearch-instructions-operator-user'],
+      ['\n- ', 'globalSearch-instructions-operator-at'],
+      ['\n- ', 'globalSearch-instructions-operator-member'],
+      ['\n- ', 'globalSearch-instructions-operator-assignee'],
+      ['\n- ', 'globalSearch-instructions-operator-creator'],
+      ['\n- ', 'globalSearch-instructions-operator-due'],
+      ['\n- ', 'globalSearch-instructions-operator-created'],
+      ['\n- ', 'globalSearch-instructions-operator-modified'],
+      ['\n- ', 'globalSearch-instructions-operator-status'],
+      ['\n    - ', 'globalSearch-instructions-status-archived'],
+      ['\n    - ', 'globalSearch-instructions-status-public'],
+      ['\n    - ', 'globalSearch-instructions-status-private'],
+      ['\n    - ', 'globalSearch-instructions-status-all'],
+      ['\n    - ', 'globalSearch-instructions-status-ended'],
+      ['\n- ', 'globalSearch-instructions-operator-has'],
+      ['\n- ', 'globalSearch-instructions-operator-sort'],
+      ['\n- ', 'globalSearch-instructions-operator-limit'],
+      ['\n## ', 'heading-notes'],
+      ['\n- ', 'globalSearch-instructions-notes-1'],
+      ['\n- ', 'globalSearch-instructions-notes-2'],
+      ['\n- ', 'globalSearch-instructions-notes-3'],
+      ['\n- ', 'globalSearch-instructions-notes-3-2'],
+      ['\n- ', 'globalSearch-instructions-notes-4'],
+      ['\n- ', 'globalSearch-instructions-notes-5'],
+    ].forEach(([prefix, instruction]) => {
+      text += `${prefix}${TAPi18n.__(instruction, tags)}`
+      // Replace *<text>* with `<text>` so markdown shows correctly
+      .replace(/\*\</, '`<')
+      .replace(/\>\*/, '\>\`')
+    });
    return text;
-  },
+  }

  labelColors() {
    return Boards.simpleSchema()._schema['labels.$.color'].allowedValues.map(
@@ -594,23 +203,15 @@ BlazeComponent.extendComponent({
        return { color, name: TAPi18n.__(`color-${color}`) };
      },
    );
-  },
+  }

  events() {
-    return [
+    return super.events().concat([
      {
        'submit .js-search-query-form'(evt) {
          evt.preventDefault();
          this.searchAllBoards(evt.target.searchQuery.value);
        },
-        'click .js-next-page'(evt) {
-          evt.preventDefault();
-          this.nextPage();
-        },
-        'click .js-previous-page'(evt) {
-          evt.preventDefault();
-          this.previousPage();
-        },
        'click .js-label-color'(evt) {
          evt.preventDefault();
          const input = document.getElementById('global-search-input');
@@ -651,7 +252,16 @@ BlazeComponent.extendComponent({
          );
          document.getElementById('global-search-input').focus();
        },
+        'click .js-new-search'(evt) {
+          evt.preventDefault();
+          const input = document.getElementById('global-search-input');
+          input.value = '';
+          this.query.set('');
+          this.hasResults.set(false);
+        },
      },
-    ];
-  },
-}).register('globalSearch');
+    ]);
+  }
+}
+
+GlobalSearchComponent.register('globalSearch');
@@ -71,17 +71,17 @@
 .global-search-error-messages
  color: darkred

-.global-search-instructions
+.global-search-page
  width: 40%
  min-width: 400px
  margin-right: auto
  margin-left: auto
  line-height: 150%

-.global-search-instructions h1
+.global-search-page h1
  margin-top: 2rem;

-.global-search-instructions h2
+.global-search-page h2
  margin-top: 1rem;

 .global-search-query-input
@@ -100,7 +100,7 @@ code
  color: black
  background-color: lightgrey
  padding: 0.1rem !important
-  font-size: 0.7rem !important
+  font-size: 0.8rem !important

 .list-title
  background-color: darkgray
@@ -116,3 +116,6 @@ code
 .global-search-previous-page
  border: none
  text-align: left;
+
+.global-search-instructions li
+  margin-bottom: 0.3rem
@@ -31,13 +31,13 @@ template(name="header")
        unless currentSetting.hideLogo
          if currentSetting.customTopLeftCornerLogoImageUrl
            if currentSetting.customTopLeftCornerLogoLinkUrl
-              a(href="{{currentSetting.customTopLeftCornerLogoLinkUrl}}")
+              a(href="{{currentSetting.customTopLeftCornerLogoLinkUrl}}" alt="{{currentSetting.productName}}" title="{{currentSetting.productName}}")
                img(src="{{currentSetting.customTopLeftCornerLogoImageUrl}}" height="{{#if currentSetting.customTopLeftCornerLogoHeight}}#{currentSetting.customTopLeftCornerLogoHeight}{{else}}27{{/if}}" width="auto" margin="0" padding="0")
            unless currentSetting.customTopLeftCornerLogoLinkUrl
-              img(src="{{currentSetting.customTopLeftCornerLogoImageUrl}}" height="{{#if currentSetting.customTopLeftCornerLogoHeight}}#{currentSetting.customTopLeftCornerLogoHeight}{{else}}27{{/if}}" width="auto" margin="0" padding="0")
+              img(src="{{currentSetting.customTopLeftCornerLogoImageUrl}}" height="{{#if currentSetting.customTopLeftCornerLogoHeight}}#{currentSetting.customTopLeftCornerLogoHeight}{{else}}27{{/if}}" width="auto" margin="0" padding="0" alt="{{currentSetting.productName}}" title="{{currentSetting.productName}}")
          unless currentSetting.customTopLeftCornerLogoImageUrl
-            img(src="{{pathFor '/logo-header.png'}}" alt="")
-        span
+            img(src="{{pathFor '/logo-header.png'}}" alt="{{currentSetting.productName}}" title="{{currentSetting.productName}}")
+        span.allBoards
          a(href="{{pathFor 'home'}}")
            span.fa.fa-home
            | {{_ 'all-boards'}}
@@ -51,7 +51,7 @@ template(name="header")
              a(href="{{pathFor 'board' id=_id slug=slug}}")
                = title
          else
-            li.current {{_ 'quick-access-description'}}
+            li.current.empty {{_ 'quick-access-description'}}

      // Next line is used only for spacing at header,
      // there is no visible clickable icon.
@@ -102,6 +102,9 @@
  z-index: 21
  padding: 10px 0px

+  .allBoards
+      padding: 0 0 0 10px
+
  #header-user-bar,
  #header-new-board-icon,
  ul li
@@ -135,6 +138,9 @@
      &.current
        color: darken(white, 5%)

+      &.current.empty
+        padding: 12px 10px 12px 10px
+
      &:first-child .fa-home,&:nth-child(3) .fa-globe
        margin-right: 5px

@@ -210,7 +216,8 @@
      .fa-home
          font-size: 26px
          margin-top: -2px
-          margin-right: 20px
+          margin-right: 10px
+          margin-left: 10px

    #header-new-board-icon
      display: none
@@ -28,6 +28,12 @@ Template.userFormsLayout.onCreated(function() {
  Meteor.subscribe('setting', {
    onReady() {
      templateInstance.currentSetting.set(Settings.findOne());
+      let currSetting = templateInstance.currentSetting.curValue;
+      let oidcBtnElt = $("#at-oidc");
+      if(currSetting && currSetting !== undefined && currSetting.oidcBtnText !== undefined && oidcBtnElt != null && oidcBtnElt != undefined){
+        let htmlvalue = "<i class='fa fa-oidc'></i>" + currSetting.oidcBtnText;
+        oidcBtnElt.html(htmlvalue);
+      }
      return this.stop();
    },
  });
@@ -77,20 +83,51 @@ Template.userFormsLayout.helpers({
      } else if (lang.name === 'ar-EG') {
        // ar-EG = Arabic (Egypt), simply Masri (مَصرى, [ˈmɑsˤɾi], Egyptian, Masr refers to Cairo)
        name = 'مَصرى';
-      } else if (lang.name === 'es-PY') {
-        name = 'Español de Paraguayo';
+      } else if (lang.name === 'de-CH') {
+        name = 'Deutsch (Schweiz)';
+      } else if (lang.name === 'fa-IR') {
+        // fa-IR = Persian (Iran)
+        name = 'فارسی/پارسی (ایران‎)';
      } else if (lang.name === 'fr-BE') {
        name = 'Français (Belgique)';
      } else if (lang.name === 'fr-CA') {
        name = 'Français (Canada)';
-      } else if (lang.name === 'fr-CA') {
-        name = 'Français (Canada)';
+      } else if (lang.name === 'fr-CH') {
+        name = 'Français (Schweiz)';
      } else if (lang.name === 'ig') {
        name = 'Igbo';
      } else if (lang.name === 'lv') {
        name = 'Latviešu';
      } else if (lang.name === 'latviešu valoda') {
        name = 'Latviešu';
+      } else if (lang.name === 'en-IT') {
+        name = 'English (Italy)';
+      } else if (lang.name === 'Español') {
+        name = 'español';
+      } else if (lang.name === 'es_419') {
+        name = 'español de América Latina';
+      } else if (lang.name === 'es-419') {
+        name = 'español de América Latina';
+      } else if (lang.name === 'Español de América Latina') {
+        name = 'español de América Latina';
+      } else if (lang.name === 'es-LA') {
+        name = 'español de América Latina';
+      } else if (lang.name === 'Español de Argentina') {
+        name = 'español de Argentina';
+      } else if (lang.name === 'Español de Chile') {
+        name = 'español de Chile';
+      } else if (lang.name === 'Español de Colombia') {
+        name = 'español de Colombia';
+      } else if (lang.name === 'Español de México') {
+        name = 'español de México';
+      } else if (lang.name === 'es-PY') {
+        name = 'español de Paraguayo';
+      } else if (lang.name === 'Español de Paraguayo') {
+        name = 'español de Paraguayo';
+      } else if (lang.name === 'Español de Perú') {
+        name = 'español de Perú';
+      } else if (lang.name === 'Español de Puerto Rico') {
+        name = 'español de Puerto Rico';
      } else if (lang.name === 'oc') {
        name = 'Occitan';
      } else if (lang.name === 'st') {
@@ -317,6 +317,9 @@ kbd
 .grabbing
  cursor: grabbing

+.textcomplete-dropdown
+  z-index: 2000 !important;
+
 // Implement a thiner close icon as suggested in
 // https://github.com/FortAwesome/Font-Awesome/issues/1540#issuecomment-68689950
 .fa.fa-times-thin:before
@@ -6,16 +6,6 @@ template(name="myCardsHeaderBar")
      i.fa.fa-list
      | {{_ 'my-cards'}}

-    .board-header-btns.left
-      a.board-header-btn.js-toggle-my-cards-choose-sort(title="{{_ 'myCardsSortChange-title'}}")
-        i.fa.fa-caret-down
-        if $eq myCardsSort 'board'
-          i.fa.fa-th-large
-          | {{_ 'myCardsSortChange-choice-board'}}
-        if $eq myCardsSort 'dueAt'
-          i.fa.fa-calendar
-          | {{_ 'myCardsSortChange-choice-dueat'}}
-
 template(name="myCardsModalTitle")
  if currentUser
    h2
@@ -24,50 +14,26 @@ template(name="myCardsModalTitle")

 template(name="myCards")
  if currentUser
-    if isPageReady.get
-      .wrapper
-        if $eq myCardsSort 'board'
-          each board in myCardsList
-            .my-cards-board-wrapper
-              .my-cards-board-title(class=board.colorClass, id="header")
-                a(href=board.absoluteUrl)
-                  +viewer 
-                    = board.title
-              each swimlane in board.mySwimlanes
-                .my-cards-swimlane-title(class="{{#if swimlane.colorClass}}{{ swimlane.colorClass }}{{else}}swimlane-default-color{{/if}}")
-                  +viewer
-                    = swimlane.title
-                each list in swimlane.myLists
-                  .my-cards-list-wrapper
-                    .my-cards-list-title(class=list.colorClass)
-                      +viewer
-                        = list.title
-                    each card in list.myCards
-                      .my-cards-card-wrapper
-                        a.minicard-wrapper(href=card.absoluteUrl)
-                          +minicard(card)
-        else
-          .my-cards-dueat-list-wrapper
-            each card in myDueCardsList
-              +resultCard(card)
-    else
+    if searching.get
      +spinner
-
-template(name="myCardsSortChangePopup")
-  if currentUser
-    ul.pop-over-list
-      li
-        with "my-cards-sort-board"
-          a.js-my-cards-sort-board
-            i.fa.fa-th-large.colorful
-            | {{_ 'myCardsSortChange-choice-board'}}
-            if $eq Utils.myCardsSort "board"
-              i.fa.fa-check
-      hr
-      li
-        with "my-cards-sort-dueat"
-          a.js-my-cards-sort-dueat
-            i.fa.fa-calendar.colorful
-            | {{_ 'myCardsSortChange-choice-dueat'}}
-            if $eq Utils.myCardsSort "dueAt"
-              i.fa.fa-check
+    else
+      .wrapper
+        each board in myCardsList
+          .my-cards-board-wrapper
+            .my-cards-board-title(class=board.colorClass, id="header")
+              a(href=board.originRelativeUrl)
+                +viewer
+                  = board.title
+            each swimlane in board.mySwimlanes
+              .my-cards-swimlane-title(class="{{#if swimlane.colorClass}}{{ swimlane.colorClass }}{{else}}swimlane-default-color{{/if}}")
+                +viewer
+                  = swimlane.title
+              each list in swimlane.myLists
+                .my-cards-list-wrapper
+                  .my-cards-list-title(class=list.colorClass)
+                    +viewer
+                      = list.title
+                  each card in list.myCards
+                    .my-cards-card-wrapper
+                      a.minicard-wrapper(href=card.originRelativeUrl)
+                        +minicard(card)
@@ -1,4 +1,4 @@
-const subManager = new SubsManager();
+import { CardSearchPagedComponent } from '../../lib/cardSearch';

 BlazeComponent.extendComponent({
  myCardsSort() {
@@ -24,227 +24,115 @@ Template.myCards.helpers({
  },
 });

-BlazeComponent.extendComponent({
-  events() {
-    return [
-      {
-        'click .js-my-cards-sort-board'() {
-          Utils.setMyCardsSort('board');
-          Popup.close();
-        },
-
-        'click .js-my-cards-sort-dueat'() {
-          Utils.setMyCardsSort('dueAt');
-          Popup.close();
-        },
-      },
-    ];
-  },
-}).register('myCardsSortChangePopup');
-
-BlazeComponent.extendComponent({
+class MyCardsComponent extends CardSearchPagedComponent {
  onCreated() {
-    this.isPageReady = new ReactiveVar(false);
+    super.onCreated();

-    this.autorun(() => {
-      const handle = subManager.subscribe('myCards');
-      Tracker.nonreactive(() => {
-        Tracker.autorun(() => {
-          this.isPageReady.set(handle.ready());
-        });
-      });
-    });
+    this.runGlobalSearch(null);
    Meteor.subscribe('setting');
-  },
+  }

-  myCardsSort() {
-    // eslint-disable-next-line no-console
-    //console.log('sort:', Utils.myCardsSort());
-    return Utils.myCardsSort();
-  },
-
-  sortByBoard() {
-    return this.myCardsSort() === 'board';
-  },
+  // eslint-disable-next-line no-unused-vars
+  getSubscription(queryParams) {
+    return Meteor.subscribe(
+      'myCards',
+      this.sessionId,
+      this.subscriptionCallbacks,
+    );
+  }

  myCardsList() {
-    const userId = Meteor.userId();
    const boards = [];
    let board = null;
    let swimlane = null;
    let list = null;

-    const cursor = Cards.find(
-      {
-        $or: [{ members: userId }, { assignees: userId }],
-        archived: false,
-      },
-      {
-        sort: {
-          boardId: 1,
-          swimlaneId: 1,
-          listId: 1,
-          sort: 1,
-        },
-      },
-    );
+    const cursor = this.getResults();

-    let newBoard = false;
-    let newSwimlane = false;
-    let newList = false;
-
-    cursor.forEach(card => {
-      // eslint-disable-next-line no-console
-      // console.log('card:', card.title);
-      if (list === null || card.listId !== list._id) {
+    if (cursor) {
+      cursor.forEach(card => {
        // eslint-disable-next-line no-console
-        // console.log('new list');
-        list = card.getList();
-        if (list.archived) {
-          list = null;
-          return;
-        }
-        list.myCards = [card];
-        newList = true;
-      }
-      if (swimlane === null || card.swimlaneId !== swimlane._id) {
-        // eslint-disable-next-line no-console
-        // console.log('new swimlane');
-        swimlane = card.getSwimlane();
-        if (swimlane.archived) {
+        // console.log('card:', card.title);
+        if (board === null || card.boardId !== board._id) {
+          // eslint-disable-next-line no-console
+          // console.log('new board');
+          board = card.getBoard();
+          if (board.archived) {
+            board = null;
+            return;
+          }
+          // eslint-disable-next-line no-console
+          // console.log('board:', b, b._id, b.title);
+          boards.push(board);
+          board.mySwimlanes = [];
          swimlane = null;
-          return;
+          list = null;
+        }
+
+        if (swimlane === null || card.swimlaneId !== swimlane._id) {
+          // eslint-disable-next-line no-console
+          // console.log('new swimlane');
+          swimlane = card.getSwimlane();
+          if (swimlane.archived) {
+            swimlane = null;
+            return;
+          }
+          board.mySwimlanes.push(swimlane);
+          swimlane.myLists = [];
+          list = null;
+        }
+
+        if (list === null || card.listId !== list._id) {
+          // eslint-disable-next-line no-console
+          // console.log('new list');
+          list = card.getList();
+          if (list.archived) {
+            list = null;
+            return;
+          }
+          swimlane.myLists.push(list);
+          list.myCards = [];
        }
-        swimlane.myLists = [list];
-        newSwimlane = true;
-      }
-      if (board === null || card.boardId !== board._id) {
-        // eslint-disable-next-line no-console
-        // console.log('new board');
-        board = card.getBoard();
-        if (board.archived) {
-          board = null;
-          return;
-        }
-        // eslint-disable-next-line no-console
-        // console.log('board:', b, b._id, b.title);
-        board.mySwimlanes = [swimlane];
-        newBoard = true;
-      }

-      if (newBoard) {
-        boards.push(board);
-      } else if (newSwimlane) {
-        board.mySwimlanes.push(swimlane);
-      } else if (newList) {
-        swimlane.myLists.push(list);
-      } else {
        list.myCards.push(card);
-      }
+      });

-      newBoard = false;
-      newSwimlane = false;
-      newList = false;
-    });
-
-    // sort the data structure
-    boards.forEach(board => {
-      board.mySwimlanes.forEach(swimlane => {
-        swimlane.myLists.forEach(list => {
-          list.myCards.sort((a, b) => {
+      // sort the data structure
+      boards.forEach(board => {
+        board.mySwimlanes.forEach(swimlane => {
+          swimlane.myLists.forEach(list => {
+            list.myCards.sort((a, b) => {
+              return a.sort - b.sort;
+            });
+          });
+          swimlane.myLists.sort((a, b) => {
            return a.sort - b.sort;
          });
        });
-        swimlane.myLists.sort((a, b) => {
+        board.mySwimlanes.sort((a, b) => {
          return a.sort - b.sort;
        });
      });
-      board.mySwimlanes.sort((a, b) => {
-        return a.sort - b.sort;
+
+      boards.sort((a, b) => {
+        let x = a.sort;
+        let y = b.sort;
+
+        // show the template board last
+        if (a.type === 'template-container') {
+          x = 99999999;
+        } else if (b.type === 'template-container') {
+          y = 99999999;
+        }
+        return x - y;
      });
-    });

-    boards.sort((a, b) => {
-      let x = a.sort;
-      let y = b.sort;
+      // eslint-disable-next-line no-console
+      // console.log('boards:', boards);
+      return boards;
+    }

-      // show the template board last
-      if (a.type === 'template-container') {
-        x = 99999999;
-      } else if (b.type === 'template-container') {
-        y = 99999999;
-      }
-      return x - y;
-    });
-
-    // eslint-disable-next-line no-console
-    // console.log('boards:', boards);
-    return boards;
-  },
-
-  myDueCardsList() {
-    const userId = Meteor.userId();
-
-    const cursor = Cards.find(
-      {
-        $or: [{ members: userId }, { assignees: userId }],
-        archived: false,
-      },
-      {
-        sort: {
-          dueAt: -1,
-          boardId: 1,
-          swimlaneId: 1,
-          listId: 1,
-          sort: 1,
-        },
-      },
-    );
-
-    // eslint-disable-next-line no-console
-    // console.log('cursor:', cursor);
-
-    const cards = [];
-    cursor.forEach(card => {
-      if (
-        !card.getBoard().archived &&
-        !card.getSwimlane().archived &&
-        !card.getList().archived
-      ) {
-        cards.push(card);
-      }
-    });
-
-    cards.sort((a, b) => {
-      const x = a.dueAt === null ? Date('2100-12-31') : a.dueAt;
-      const y = b.dueAt === null ? Date('2100-12-31') : b.dueAt;
-
-      if (x > y) return 1;
-      else if (x < y) return -1;
-
-      return 0;
-    });
-
-    // eslint-disable-next-line no-console
-    // console.log('cursor:', cards);
-    return cards;
-  },
-
-  events() {
-    return [
-      {
-        // 'click .js-my-card'(evt) {
-        //   const card = this.currentData().card;
-        //   // eslint-disable-next-line no-console
-        //   console.log('currentData():', this.currentData());
-        //   // eslint-disable-next-line no-console
-        //   console.log('card:', card);
-        //   if (card) {
-        //     Utils.goCardId(card._id);
-        //   }
-        //   evt.preventDefault();
-        // },
-      },
-    ];
-  },
-}).register('myCards');
+    return [];
+  }
+}
+MyCardsComponent.register('myCards');
@@ -0,0 +1,5 @@
+template(name="spinner")
+  +Template.dynamic(template=getSpinnerTemplate)
+
+template(name="spinnerRaw")
+  +Template.dynamic(template=getSpinnerTemplateRaw)
@@ -0,0 +1,11 @@
+import { Spinner } from '/client/lib/spinner';
+
+(class extends Spinner {
+}.register('spinner'));
+
+(class extends Spinner {
+  getSpinnerTemplateRaw() {
+    let ret = super.getSpinnerTemplate() + 'Raw';
+    return ret;
+  }
+}.register('spinnerRaw'));
@@ -1,6 +0,0 @@
-.sk-spinner.sk-spinner-wave(class=currentBoard.colorClass)
-  .sk-rect1
-  .sk-rect2
-  .sk-rect3
-  .sk-rect4
-  .sk-rect5
@@ -0,0 +1,11 @@
+template(name="spinnerBounce")
+  .sk-spinner.sk-spinner-bounce(class=currentBoard.colorClass)
+    +spinnerBounceRaw
+
+template(name="spinnerBounceRaw")
+  .sk-bounce1
+  | &nbsp;
+  .sk-bounce2
+  | &nbsp;
+  .sk-bounce3
+  | &nbsp;
@@ -0,0 +1,44 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-bounce {
+  margin: 100px auto 0;
+  width: 70px;
+  text-align: center;
+
+  div {
+    width: 18px;
+    height: 18px;
+    background-color: #333;
+
+    border-radius: 100%;
+    display: inline-block;
+    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+  }
+
+  .sk-bounce1 {
+    -webkit-animation-delay: -0.32s;
+    animation-delay: -0.32s;
+  }
+
+  .sk-bounce2 {
+    -webkit-animation-delay: -0.16s;
+    animation-delay: -0.16s;
+  }
+}
+
+@-webkit-keyframes sk-bouncedelay {
+  0%, 80%, 100% { -webkit-transform: scale(0) }
+  40% { -webkit-transform: scale(1.0) }
+}
+
+@keyframes sk-bouncedelay {
+  0%, 80%, 100% {
+    -webkit-transform: scale(0);
+    transform: scale(0);
+  } 40% {
+    -webkit-transform: scale(1.0);
+    transform: scale(1.0);
+  }
+}
@@ -0,0 +1,8 @@
+template(name="spinnerCube")
+  .sk-spinner.sk-spinner-cube(class=currentBoard.colorClass)
+    +spinnerCubeRaw
+
+template(name="spinnerCubeRaw")
+  .sk-cube1
+  .sk-cube2
+  .sk-cube3
@@ -0,0 +1,52 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-cube {
+  margin: 100px auto;
+  width: 40px;
+  height: 40px;
+  position: relative;
+}
+
+.sk-cube1, .sk-cube2 {
+  background-color: #333;
+  width: 15px;
+  height: 15px;
+  position: absolute;
+  top: 0;
+  left: 0;
+
+  -webkit-animation: sk-cubemove 1.8s infinite ease-in-out;
+  animation: sk-cubemove 1.8s infinite ease-in-out;
+}
+
+.sk-cube2 {
+  -webkit-animation-delay: -0.9s;
+  animation-delay: -0.9s;
+}
+
+@-webkit-keyframes sk-cubemove {
+  25% { -webkit-transform: translateX(35px) rotate(-90deg) scale(0.5) }
+  50% { -webkit-transform: translateX(35px) translateY(35px) rotate(-180deg) }
+  75% { -webkit-transform: translateX(0px) translateY(35px) rotate(-270deg) scale(0.5) }
+  100% { -webkit-transform: rotate(-360deg) }
+}
+
+@keyframes sk-cubemove {
+  25% {
+    transform: translateX(35px) rotate(-90deg) scale(0.5);
+    -webkit-transform: translateX(35px) rotate(-90deg) scale(0.5);
+  } 50% {
+    transform: translateX(35px) translateY(35px) rotate(-179deg);
+    -webkit-transform: translateX(35px) translateY(35px) rotate(-179deg);
+  } 50.1% {
+    transform: translateX(35px) translateY(35px) rotate(-180deg);
+    -webkit-transform: translateX(35px) translateY(35px) rotate(-180deg);
+  } 75% {
+    transform: translateX(0px) translateY(35px) rotate(-270deg) scale(0.5);
+    -webkit-transform: translateX(0px) translateY(35px) rotate(-270deg) scale(0.5);
+  } 100% {
+    transform: rotate(-360deg);
+    -webkit-transform: rotate(-360deg);
+  }
+}
@@ -0,0 +1,14 @@
+template(name="spinnerCubeGrid")
+  .sk-spinner.sk-spinner-cube-grid(class=currentBoard.colorClass)
+    +spinnerCubeGridRaw
+
+template(name="spinnerCubeGridRaw")
+  .sk-cube-grid.sk-cube-grid1
+  .sk-cube-grid.sk-cube-grid2
+  .sk-cube-grid.sk-cube-grid3
+  .sk-cube-grid.sk-cube-grid4
+  .sk-cube-grid.sk-cube-grid5
+  .sk-cube-grid.sk-cube-grid6
+  .sk-cube-grid.sk-cube-grid7
+  .sk-cube-grid.sk-cube-grid8
+  .sk-cube-grid.sk-cube-grid9
@@ -0,0 +1,64 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-cube-grid {
+  width: 40px;
+  height: 40px;
+  margin: 100px auto;
+}
+
+.sk-spinner-cube-grid .sk-cube-grid {
+  width: 33%;
+  height: 33%;
+  background-color: #333;
+  float: left;
+  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
+          animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
+}
+.sk-spinner-cube-grid .sk-cube-grid1 {
+  -webkit-animation-delay: 0.2s;
+          animation-delay: 0.2s; }
+.sk-spinner-cube-grid .sk-cube-grid2 {
+  -webkit-animation-delay: 0.3s;
+          animation-delay: 0.3s; }
+.sk-spinner-cube-grid .sk-cube-grid3 {
+  -webkit-animation-delay: 0.4s;
+          animation-delay: 0.4s; }
+.sk-spinner-cube-grid .sk-cube-grid4 {
+  -webkit-animation-delay: 0.1s;
+          animation-delay: 0.1s; }
+.sk-spinner-cube-grid .sk-cube-grid5 {
+  -webkit-animation-delay: 0.2s;
+          animation-delay: 0.2s; }
+.sk-spinner-cube-grid .sk-cube-grid6 {
+  -webkit-animation-delay: 0.3s;
+          animation-delay: 0.3s; }
+.sk-spinner-cube-grid .sk-cube-grid7 {
+  -webkit-animation-delay: 0s;
+          animation-delay: 0s; }
+.sk-spinner-cube-grid .sk-cube-grid8 {
+  -webkit-animation-delay: 0.1s;
+          animation-delay: 0.1s; }
+.sk-spinner-cube-grid .sk-cube-grid9 {
+  -webkit-animation-delay: 0.2s;
+          animation-delay: 0.2s; }
+
+@-webkit-keyframes sk-cubeGridScaleDelay {
+  0%, 70%, 100% {
+    -webkit-transform: scale3D(1, 1, 1);
+            transform: scale3D(1, 1, 1);
+  } 35% {
+    -webkit-transform: scale3D(0, 0, 1);
+            transform: scale3D(0, 0, 1);
+  }
+}
+
+@keyframes sk-cubeGridScaleDelay {
+  0%, 70%, 100% {
+    -webkit-transform: scale3D(1, 1, 1);
+            transform: scale3D(1, 1, 1);
+  } 35% {
+    -webkit-transform: scale3D(0, 0, 1);
+            transform: scale3D(0, 0, 1);
+  }
+}
@@ -0,0 +1,7 @@
+template(name="spinnerDot")
+  .sk-spinner.sk-spinner-dot(class=currentBoard.colorClass)
+    +spinnerDotRaw
+
+template(name="spinnerDotRaw")
+  .sk-dot1
+  .sk-dot2
@@ -0,0 +1,51 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-dot {
+  margin: 100px auto;
+  width: 40px;
+  height: 40px;
+  position: relative;
+  text-align: center;
+
+  -webkit-animation: sk-rotate 2.0s infinite linear;
+  animation: sk-rotate 2.0s infinite linear;
+}
+
+.sk-dot1, .sk-dot2 {
+  width: 40%;
+  height: 40%;
+  display: inline-block;
+  position: absolute;
+  top: 0;
+  background-color: #333;
+  border-radius: 100%;
+
+  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
+  animation: sk-bounce 2.0s infinite ease-in-out;
+}
+
+.sk-dot2 {
+  top: auto;
+  bottom: 0;
+  -webkit-animation-delay: -1.0s;
+  animation-delay: -1.0s;
+}
+
+@-webkit-keyframes sk-rotate { 100% { -webkit-transform: rotate(360deg) }}
+@keyframes sk-rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}
+
+@-webkit-keyframes sk-bounce {
+  0%, 100% { -webkit-transform: scale(0.0) }
+  50% { -webkit-transform: scale(1.0) }
+}
+
+@keyframes sk-bounce {
+  0%, 100% {
+    transform: scale(0.0);
+    -webkit-transform: scale(0.0);
+  } 50% {
+    transform: scale(1.0);
+    -webkit-transform: scale(1.0);
+  }
+}
@@ -0,0 +1,7 @@
+template(name="spinnerDoubleBounce")
+  .sk-spinner.sk-spinner-double-bounce(class=currentBoard.colorClass)
+    +spinnerDoubleBounceRaw
+
+template(name="spinnerDoubleBounceRaw")
+  .sk-double-bounce1
+  .sk-double-bounce2
@@ -0,0 +1,44 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-double-bounce {
+  width: 40px;
+  height: 40px;
+
+  position: relative;
+  margin: 100px auto;
+}
+
+.sk-double-bounce1, .sk-double-bounce2 {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  background-color: #333;
+  opacity: 0.6;
+  position: absolute;
+  top: 0;
+  left: 0;
+
+  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
+  animation: sk-bounce 2.0s infinite ease-in-out;
+}
+
+.sk-double-bounce2 {
+  -webkit-animation-delay: -1.0s;
+  animation-delay: -1.0s;
+}
+
+@-webkit-keyframes sk-bounce {
+  0%, 100% { -webkit-transform: scale(0.0) }
+  50% { -webkit-transform: scale(1.0) }
+}
+
+@keyframes sk-bounce {
+  0%, 100% {
+    transform: scale(0.0);
+    -webkit-transform: scale(0.0);
+  } 50% {
+    transform: scale(1.0);
+    -webkit-transform: scale(1.0);
+  }
+}
@@ -0,0 +1,6 @@
+template(name="spinnerRotateplane")
+  .sk-spinner.sk-spinner-rotateplane(class=currentBoard.colorClass)
+    +spinnerRotateplaneRaw
+
+template(name="spinnerRotateplaneRaw")
+  .sk-rotateplane1
@@ -0,0 +1,38 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-rotateplane {
+  width: 40px;
+  height: 40px;
+  text-align: center;
+
+  margin: 100px auto;
+  -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
+  animation: sk-rotateplane 1.2s infinite ease-in-out;
+
+  div {
+    background-color: #333;
+    height: 100%;
+    width: 100%;
+    display: inline-block;
+  }
+}
+
+@-webkit-keyframes sk-rotateplane {
+  0% { -webkit-transform: perspective(120px) }
+  50% { -webkit-transform: perspective(120px) rotateY(180deg) }
+  100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
+}
+
+@keyframes sk-rotateplane {
+  0% {
+    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
+    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
+  } 50% {
+    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
+    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
+  } 100% {
+    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+  }
+}
@@ -0,0 +1,6 @@
+template(name="spinnerScaleout")
+  .sk-spinner.sk-spinner-scaleout(class=currentBoard.colorClass)
+    +spinnerScaleoutRaw
+
+template(name="spinnerScaleoutRaw")
+  .sk-scaleout1
@@ -0,0 +1,40 @@
+@import 'nib'
+
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-scaleout {
+  width: 40px;
+  height: 40px;
+  text-align: center;
+
+  margin: 100px auto;
+
+  border-radius: 100%;
+  -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
+  animation: sk-scaleout 1.0s infinite ease-in-out;
+
+  div {
+    background-color: #333;
+    height: 100%;
+    width: 100%;
+    display: inline-block;
+  }
+}
+
+@-webkit-keyframes sk-scaleout {
+  0% { -webkit-transform: scale(0) }
+  100% {
+    -webkit-transform: scale(1.0);
+    opacity: 0;
+  }
+}
+
+@keyframes sk-scaleout {
+  0% {
+    -webkit-transform: scale(0);
+    transform: scale(0);
+  } 100% {
+    -webkit-transform: scale(1.0);
+    transform: scale(1.0);
+    opacity: 0;
+  }
+}
@@ -0,0 +1,15 @@
+template(name="spinnerWave")
+  .sk-spinner.sk-spinner-wave(class=currentBoard.colorClass)
+    +spinnerWaveRaw
+
+template(name="spinnerWaveRaw")
+  .sk-rect1
+  | &nbsp;
+  .sk-rect2
+  | &nbsp;
+  .sk-rect3
+  | &nbsp;
+  .sk-rect4
+  | &nbsp;
+  .sk-rect5
+  | &nbsp;
@@ -1,21 +1,7 @@
@import 'nib'

-/*
- * From https://github.com/tobiasahlin/SpinKit
- *
- * Usage:
- *
- *    <div class="sk-spinner sk-spinner-wave">
- *      <div class="sk-rect1"></div>
- *      <div class="sk-rect2"></div>
- *      <div class="sk-rect3"></div>
- *      <div class="sk-rect4"></div>
- *      <div class="sk-rect5"></div>
- *    </div>
- *
- */
-
-.sk-spinner {
+// From https://github.com/tobiasahlin/SpinKit
+.sk-spinner-wave {
  width: 50px;
  height: 50px;
  margin: auto;
@@ -1,5 +1,5 @@
 template(name='notifications')
  #notifications.board-header-btns.right
-    a.notifications-drawer-toggle.fa.fa-bell(class="{{#if $gt unreadNotifications 0}}alert{{/if}}")
+    a.notifications-drawer-toggle.fa.fa-bell(class="{{#if $gt unreadNotifications 0}}alert{{/if}}" title="{{_ 'notifications'}}")
    if $.Session.get 'showNotificationsDrawer'
      +notificationsDrawer(unreadNotifications=unreadNotifications)