v6.09

Thanks to urmel1960, Ben0it-T and xet7 !

Fixes #4384

.babelrc

@@ -1,5 +1,12 @@
 { 
   "presets": [ 
     "@babel/preset-stage-3" 
-  ]
+  ],
+  "env": {
+    "COVERAGE": {
+      "plugins": [
+        "istanbul"
+      ]
+    }
+  }
 }

.devcontainer/Dockerfile

@@ -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.10 \
     METEOR_RELEASE=1.10.2 \
     USE_EDGE=false \
     METEOR_EDGE=1.5-beta.17 \
@@ -19,12 +15,14 @@ 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 \
     ACCOUNTS_LOCKOUT_UNKNOWN_USERS_FAILURES_BERORE=3 \
     ACCOUNTS_LOCKOUT_UNKNOWN_USERS_LOCKOUT_PERIOD=60 \
     ACCOUNTS_LOCKOUT_UNKNOWN_USERS_FAILURE_WINDOW=15 \
+    ACCOUNTS_COMMON_LOGIN_EXPIRATION_IN_DAYS=90 \
     RICHER_CARD_COMMENT_EDITOR=false \
     CARD_OPENED_WEBHOOK_ENABLED=false \
     ATTACHMENTS_STORE_PATH="" \
@@ -133,23 +131,33 @@ ENV \
     SAML_PUBLIC_CERTFILE="" \
     SAML_IDENTIFIER_FORMAT="" \
     SAML_LOCAL_PROFILE_MATCH_ATTRIBUTE="" \
-    SAML_ATTRIBUTES=""
+    SAML_ATTRIBUTES="" \
+    DEFAULT_WAIT_SPINNER="" \
+    NODE_OPTIONS="--max_old_space_size=4096"
+
+#---------------------------------------------------------------------
+# https://github.com/wekan/wekan/issues/3585#issuecomment-1021522132
+# Add more Node heap:
+#   NODE_OPTIONS="--max_old_space_size=4096"
+# Add more stack:
+#   bash -c "ulimit -s 65500; exec node --stack-size=65500 main.js"
+#---------------------------------------------------------------------
 
 # 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 +179,94 @@ 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 \
+    tests \
+    /home/wekan/app/tests/
+
+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 && \
+    cd node_modules/fibers && \
+    node build.js
+
+USER root
+# Cleanup
+RUN \
+    set -o xtrace && \
+    apt-get clean -y && \
+    apt-get autoremove -y && \
+    rm -Rf /tmp/* && \
+    rm -Rf /home/wekan/app_build && \
+    rm -Rf /var/cache/apt /var/lib/apt/lists && \
+    rm -Rf /var/lib/apt/lists/*
+
+USER wekan
+
+ENV PORT=3000
+EXPOSE $PORT
+WORKDIR /home/wekan/app
+
+#---------------------------------------------------------------------
+# https://github.com/wekan/wekan/issues/3585#issuecomment-1021522132
+# Add more Node heap:
+#   NODE_OPTIONS="--max_old_space_size=4096"
+# Add more stack:
+#   bash -c "ulimit -s 65500; exec node --stack-size=65500 main.js"
+#---------------------------------------------------------------------
+#TODO:
+#CMD ["bash", "-c", "ulimit -s 65500; exec node --stack-size=65500 /build/main.js"]
+
+CMD ["/home/wekan/.meteor/meteor", "run", "--verbose", "--settings", "settings.json"]

.devcontainer/build.sh

@@ -9,4 +9,6 @@ cp -f fix-download-unicode/cfs_access-point.txt .build/bundle/programs/server/pa
 cd .build/bundle/programs/server
 rm -rf node_modules
 /home/wekan/.meteor/meteor npm install
+cd node_modules/fibers
+node build.js
 cd /home/wekan/app

.devcontainer/docker-compose.yml

@@ -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
+      - /etc/localtime:/etc/localtime:ro
+      - ./volumes/wekan-db:/data/db
+      - ./volumes/wekan-db-dump:/dump
 
   wekan-dev:
     container_name: wekan-dev-app
@@ -35,15 +36,13 @@ services:
     depends_on:
       - wekandb-dev
     volumes:
-      - ..:/app:delegated
-    command:
-      sleep infinity
-
-volumes:
-  wekan-dev-db:
-    driver: local
-  wekan-dev-db-dump:
-    driver: local
+      - /etc/localtime:/etc/localtime:ro
+      - ../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
 
 networks:
   wekan-dev-tier:

.dockerignore

@@ -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

.eslintrc.json

@@ -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,

.future-snap/broken-snapcraft.yaml

@@ -81,7 +81,7 @@ parts:
     wekan:
         source: .
         plugin: nodejs
-        node-engine: 12.20.1
+        node-engine: 12.22.10
         node-packages:
             - node-gyp
             - node-pre-gyp

.future-snap/old-rebuild-wekan.sh

@@ -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

.future-snap/snapcraft.yaml

@@ -83,7 +83,7 @@ parts:
     wekan:
         source: .
         plugin: nodejs
-        node-engine: 12.20.1
+        node-engine: 12.22.10
         node-packages:
             - node-gyp
             - node-pre-gyp

.github/ISSUE_TEMPLATE.md

@@ -1,30 +1,35 @@
 ## Issue
+<!--
+**[PLEASE UPGRADE](https://github.com/wekan/wekan/wiki/Backup)** to the newest WeKan ® before reporting an issue.
+Please search existing Open and Closed issues, most questions have already been answered.
 
-Add these issues to elsewhere:
-- Snap: https://github.com/wekan/wekan-snap/issues
-- LDAP: https://github.com/wekan/wekan-ldap/issues
+If you can not login for any reason: https://github.com/wekan/wekan/wiki/Forgot-Password
+Email settings, only SMTP MAIL_URL and MAIL_FROM are in use: https://github.com/wekan/wekan/wiki/Troubleshooting-Mail
+
+The following types of issues should be reported separately:
+- 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.
-
-**Server Setup Information**:
-
-* Note: Please anonymize info, and do not add to this public issue any of your Wekan board URLs, passwords, API tokens etc, do you understand?:
+### Server Setup Information
+<!-- Please anonymize info, and do not any of your Wekan board URLs, passwords, API tokens etc to this public issue. -->
 * Did you test in newest Wekan?:
-* For new Wekan install, did you configure root-url correctly so Wekan cards open correctly https://github.com/wekan/wekan/wiki/Settings ?
-* Wekan version:
-* If this is about old version of Wekan, what upgrade problem you have?:
+* Did you configure root-url correctly so Wekan cards open correctly (see https://github.com/wekan/wekan/wiki/Settings)?
 * Operating System:
-* Deployment Method(snap/docker/sandstorm/mongodb bundle/source):
+* Deployment Method (Snap/Docker/Sandstorm/bundle/source):
 * Http frontend if any (Caddy, Nginx, Apache, see config examples from Wekan GitHub wiki first):
-* Node Version:
+* Node.js Version:
 * MongoDB Version:
-* Wekan only works on newest desktop Firefox/Chromium/Chrome/Edge/Chromium Edge and mobile Chrome. What webbrowser version are you using?
+* What webbrowser version are you using (Wekan should work on all modern browsers that support Javascript)?
 
-**Problem description**:
-- *REQUIRED: Add recorded animated gif about how it works currently, and screenshot mockups how it should work. Use peek to record animgif in Linux https://github.com/phw/peek*
-- *Explain steps how to reproduce*
-- *In webbrowser, what does show Right Click / Inspect / Console ? Chrome shows more detailed info than Firefox.*
-- *If using Snap, what does show command `sudo snap logs wekan.wekan` ? Please anonymize logs.* 
-- *If using Docker, what does show command `sudo docker logs wekan-app` ? Please anonymize logs.*
-- *If logs are very long, attach them in .zip file*
+### Problem description
+<!-- Add a recorded animated gif (e.g. with https://github.com/phw/peek) about how it works currently, and screenshot mockups how it should work. -->
+#### Reproduction Steps
+
+#### Logs
+<!-- Check Right Click>Inspect>Console in you browser - generally Chrome shows more detailed info than Firefox. -->
+
+<!-- Please anonymize logs.
+Snap: sudo snap logs wekan.wekan
+Docker: sudo docker logs wekan-app
+If logs are very long, attach them in .zip file -->

.github/workflows/docker-publish.yml

@@ -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 }}

.github/workflows/release.yml

@@ -0,0 +1,25 @@
+name: Release Charts
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+
+      - name: Configure Git
+        run: |
+          git config user.name "$GITHUB_ACTOR"
+          git config user.email "$GITHUB_ACTOR@users.noreply.github.com"
+
+      - name: Run chart-releaser
+        uses: helm/chart-releaser-action@v1.1.0
+        env:
+          CR_TOKEN: "${{ secrets.GITHUB_TOKEN }}"

.github/workflows/test_suite.yml

@@ -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-keys: |
+            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!

.gitignore

@@ -31,5 +31,11 @@ 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
+/helm/wekan/charts

.meteor/packages

@@ -6,8 +6,8 @@
 meteor-base@1.4.0
 
 # Build system
-ecmascript@0.14.4
-standard-minifier-css@1.7.1
+ecmascript@0.15.1
+standard-minifier-css@1.7.2
 standard-minifier-js@2.6.0
 mquandalle:jade
 coffeescript@2.4.1!
@@ -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
@@ -60,11 +60,10 @@ reactive-var@1.0.11
 fortawesome:fontawesome
 mousetrap:mousetrap
 mquandalle:jquery-textcomplete
-mquandalle:jquery-ui-drag-drop-sort
 mquandalle:mousetrap-bindglobal
 peerlibrary:blaze-components@=0.15.1
 templates:tabs
-verron:autosize
+meteor-autosize
 simple:json-routes
 rajit:bootstrap3-datepicker
 shell-server@0.5.0
@@ -72,10 +71,10 @@ simple:rest-accounts-password
 useraccounts:core
 email@2.0.0
 horka:swipebox
-dynamic-import@0.5.5
+dynamic-import@0.6.0
 
-accounts-password@1.6.3
-cfs:gridfs
+accounts-password@1.7.0
+wekan-cfs-gridfs
 rzymek:fullcalendar
 momentjs:moment@2.22.2
 browser-policy-framing@1.1.0
@@ -83,7 +82,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
@@ -91,9 +89,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
@@ -145,3 +141,8 @@ rajit:bootstrap3-datepicker-zh-cn
 rajit:bootstrap3-datepicker-zh-tw
 staringatlights:fast-render
 spacebars
+easylogic:summernote
+pascoual:pdfkit
+wekan-accounts-lockout
+lmieulet:meteor-coverage
+meteortesting:mocha

.meteor/release

@@ -1 +1 @@
-METEOR@1.12.1
+METEOR@2.2

.meteor/versions

@@ -1,7 +1,7 @@
 3stack:presence@1.1.2
-accounts-base@1.7.1
+accounts-base@1.9.0
 accounts-oauth@1.2.0
-accounts-password@1.6.3
+accounts-password@1.7.1
 aldeed:collection2@2.10.0
 aldeed:collection2-core@1.2.0
 aldeed:schema-deny@1.1.0
@@ -10,37 +10,20 @@ aldeed:simple-schema@1.5.4
 allow-deny@1.1.0
 arillo:flow-router-helpers@0.5.2
 audit-argument-checks@1.0.7
-autoupdate@1.6.0
-babel-compiler@7.5.5
+autoupdate@1.7.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.3.3
+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.5.5
+dynamic-import@0.6.0
 easylogic:summernote@0.8.8
-ecmascript@0.14.4
+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,10 +53,10 @@ 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.2
-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
 jquery@1.11.11
@@ -84,15 +67,16 @@ 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.1.20
-lucasantoniassi:accounts-lockout@1.0.0
+logging@1.2.0
 matb33:collection-hooks@0.9.1
 matteodem:easy-search@1.6.4
 mdg:validation-error@0.5.1
 meteor@1.9.3
+meteor-autosize@5.0.1
 meteor-base@1.4.0
 meteor-platform@1.2.6
 meteorhacks:aggregate@1.3.0
@@ -100,19 +84,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.15.0
+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
@@ -120,17 +107,17 @@ mquandalle:collection-mutations@0.1.0
 mquandalle:jade@0.4.9
 mquandalle:jade-compiler@0.4.5
 mquandalle:jquery-textcomplete@0.8.0_1
-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
@@ -191,6 +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.1
 reactive-dict@1.3.0
 reactive-var@1.0.11
 reload@1.3.1
@@ -207,36 +195,53 @@ 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.1
+standard-minifier-css@1.7.2
 standard-minifier-js@2.6.0
 staringatlights:fast-render@3.3.0
 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.9.1
-webapp-hashing@1.0.9
+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

.travis.yml

@@ -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.10
   TRAVIS_NPM_VERSION: latest
 
 before_install:

.tx/config

@@ -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 = 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_AT:de-AT, de_CH:de-CH, en_DE:en-DE, en_IT:en-IT, en_GB:en-GB, et_EE:et-EE, 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-GR, fa_IR:fa-IR, fi_FI:fi, fr_FR:fr-FR, fr_CH:fr-CH, gl_ES:gl-ES, gu_IN:gu-IN, hi_IN:hi-IN, hu_HU:hu, id_ID:id, mn_MN:mn, ms_MY:ms-MY, lv_LV:lv, pt_BR:pt-BR, ro_RO:ro, ru_UA:ru-UA, sl_SI:sl, uk_UA:uk-UA, zh_CN:zh-CN, zh_TW:zh-TW, zh_Hans:zh-Hans, zh_HK:zh-HK
 
 [wekan.application]
 file_filter = i18n/<lang>.i18n.json

Dockerfile

@@ -1,8 +1,8 @@
-FROM quay.io/wekan/ubuntu:groovy-20201125.2
+FROM ubuntu:rolling
 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.10 \
     METEOR_RELEASE=1.10.2 \
     USE_EDGE=false \
     METEOR_EDGE=1.5-beta.17 \
@@ -21,12 +21,14 @@ 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 \
     ACCOUNTS_LOCKOUT_UNKNOWN_USERS_FAILURES_BERORE=3 \
     ACCOUNTS_LOCKOUT_UNKNOWN_USERS_LOCKOUT_PERIOD=60 \
     ACCOUNTS_LOCKOUT_UNKNOWN_USERS_FAILURE_WINDOW=15 \
+    ACCOUNTS_COMMON_LOGIN_EXPIRATION_IN_DAYS=90 \
     RICHER_CARD_COMMENT_EDITOR=false \
     CARD_OPENED_WEBHOOK_ENABLED=false \
     ATTACHMENTS_STORE_PATH="" \
@@ -63,6 +65,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 +85,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 +139,17 @@ 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="" \
+    NODE_OPTIONS="--max_old_space_size=4096"
+
+#---------------------------------------------------------------------
+# https://github.com/wekan/wekan/issues/3585#issuecomment-1021522132
+# Add more Node heap:
+#   NODE_OPTIONS="--max_old_space_size=4096"
+# Add more stack:
+#   bash -c "ulimit -s 65500; exec node --stack-size=65500 main.js"
+#---------------------------------------------------------------------
 
 # Copy the app to the image
 COPY ${SRC_PATH} /home/wekan/app
@@ -274,11 +287,12 @@ RUN \
     mkdir -p /home/wekan/.npm && \
     chown wekan --recursive /home/wekan/.npm /home/wekan/.config /home/wekan/.meteor && \
     #gosu wekan:wekan /home/wekan/.meteor/meteor add standard-minifier-js && \
+    chmod u+w *.json && \
     gosu wekan:wekan npm install && \
     gosu wekan:wekan /home/wekan/.meteor/meteor build --directory /home/wekan/app_build && \
-    cp /home/wekan/app/fix-download-unicode/cfs_access-point.txt /home/wekan/app_build/bundle/programs/server/packages/cfs_access-point.js && \
+    #cp /home/wekan/app/fix-download-unicode/cfs_access-point.txt /home/wekan/app_build/bundle/programs/server/packages/cfs_access-point.js && \
     #rm /home/wekan/app_build/bundle/programs/server/npm/node_modules/meteor/rajit_bootstrap3-datepicker/lib/bootstrap-datepicker/node_modules/phantomjs-prebuilt/lib/phantom/bin/phantomjs && \
-    chown wekan /home/wekan/app_build/bundle/programs/server/packages/cfs_access-point.js && \
+    #chown wekan /home/wekan/app_build/bundle/programs/server/packages/cfs_access-point.js && \
     #Removed binary version of bcrypt because of security vulnerability that is not fixed yet.
     #https://github.com/wekan/wekan/commit/4b2010213907c61b0e0482ab55abb06f6a668eac
     #https://github.com/wekan/wekan/commit/7eeabf14be3c63fae2226e561ef8a0c1390c8d3c
@@ -291,10 +305,14 @@ RUN \
     #find . -name "*phantomjs*" | xargs rm -rf && \
     #
     cd /home/wekan/app_build/bundle/programs/server/ && \
+    chmod u+w *.json && \
     gosu wekan:wekan npm install && \
+    cd node_modules/fibers && \
+    node build.js && \
+    cd ../.. && \
     #gosu wekan:wekan npm install bcrypt && \
     # Remove legacy webbroser bundle, so that Wekan works also at Android Firefox, iOS Safari, etc.
-		rm -rf /home/wekan/app_build/bundle/programs/web.browser.legacy && \
+    rm -rf /home/wekan/app_build/bundle/programs/web.browser.legacy && \
     mv /home/wekan/app_build/bundle /build && \
     \
     # Put back the original tar
@@ -304,6 +322,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 && \
@@ -316,4 +335,14 @@ ENV PORT=8080
 EXPOSE $PORT
 USER wekan
 
-CMD ["node", "/build/main.js"]
+#---------------------------------------------------------------------
+# https://github.com/wekan/wekan/issues/3585#issuecomment-1021522132
+# Add more Node heap:
+#   NODE_OPTIONS="--max_old_space_size=4096"
+# Add more stack:
+#   bash -c "ulimit -s 65500; exec node --stack-size=65500 main.js"
+#---------------------------------------------------------------------
+#
+# CMD ["node", "/build/main.js"]
+
+CMD ["bash", "-c", "ulimit -s 65500; exec node --stack-size=65500 /build/main.js"]

Dockerfile.arm64v8

@@ -4,16 +4,25 @@ 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  \
-    WEKAN_ARCHITECTURE=arm64
+    NODE_VERSION=v12.22.10 \
+    WEKAN_VERSION=latest  \
+    WEKAN_ARCHITECTURE=arm64 \
+    NODE_OPTIONS="--max_old_space_size=4096"
 
-     # 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 && \
-     \
+#---------------------------------------------------------------------
+# https://github.com/wekan/wekan/issues/3585#issuecomment-1021522132
+# Add more Node heap:
+#   NODE_OPTIONS="--max_old_space_size=4096"
+# Add more stack:
+#   bash -c "ulimit -s 65500; exec node --stack-size=65500 main.js"
+#---------------------------------------------------------------------
+
+    # 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 +49,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.10 \
     NODE_ENV=production \
     NPM_VERSION=latest \
     WITH_API=true \
@@ -74,4 +83,15 @@ RUN \
 EXPOSE $PORT
 USER wekan
 
-CMD ["node", "/home/wekan/bundle/main.js"]
+#---------------------------------------------------------------------
+# https://github.com/wekan/wekan/issues/3585#issuecomment-1021522132
+# Add more Node heap:
+#   NODE_OPTIONS="--max_old_space_size=4096"
+# Add more stack:
+#   bash -c "ulimit -s 65500; exec node --stack-size=65500 main.js"
+#---------------------------------------------------------------------
+#
+#CMD ["node", "/home/wekan/bundle/main.js"]
+
+CMD ["bash", "-c", "ulimit -s 65500; exec node --stack-size=65500 /home/wekan/bundle/main.js"]
+

README.md

@@ -1,6 +1,6 @@
-[![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
+# WeKan ® - Open Source kanban
 
 [![Contributors](https://img.shields.io/github/contributors/wekan/wekan.svg "Contributors")](https://github.com/wekan/wekan/graphs/contributors)
 [![Docker Repository on Quay](https://quay.io/repository/wekan/wekan/status "Docker Repository on Quay")](https://quay.io/repository/wekan/wekan)
@@ -12,33 +12,38 @@
 [![Project Dependencies](https://david-dm.org/wekan/wekan.svg "Project Dependencies")](https://david-dm.org/wekan/wekan)
 [![Code analysis at Open Hub](https://img.shields.io/badge/code%20analysis-at%20Open%20Hub-brightgreen.svg "Code analysis at Open Hub")](https://www.openhub.net/p/wekan)
 [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fwekan%2Fwekan.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fwekan%2Fwekan?ref=badge_shield)
+[![CII Best Practices](https://bestpractices.coreinfrastructure.org/projects/4619/badge)](https://bestpractices.coreinfrastructure.org/projects/4619)
 
-## [Translate Wekan at Transifex](https://transifex.com/wekan/wekan)
+## [Translate WeKan ® at Transifex](https://transifex.com/wekan/wekan)
 
 Translations to non-English languages are accepted only at [Transifex](https://transifex.com/wekan/wekan) using webbrowser.
 New English strings of new features can be added as PRs to edge branch file wekan/i18n/en.i18n.json .
 
 ## [Wekan feature requests and bugs](https://github.com/wekan/wekan/issues)
 
-Please add most of your questions as GitHub issue: [Wekan feature requests and bugs](https://github.com/wekan/wekan/issues).
+Please add most of your questions as GitHub issue: [WeKan ® Feature Requests and Bugs](https://github.com/wekan/wekan/issues).
 It's better than at chat where details get lost when chat scrolls up.
 
 ## Chat
 
-[![Wekan Chat][vanila_badge]][wekan_chat] - Most Wekan community and developers are here. Works on webbrowser
-and PWA app that can be added as icon on Android and bookmark on iOS, used like native app.
+[Discussions][discussions] - WeKan Community GitHub Discussions, that are not [Feature Requests and Bugs](https://github.com/wekan/wekan/issues).
 
 [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 :)
 
-## About Wekan
+## About WeKan ®
 
-Wekan is an completely [Open Source][open_source] and [Free software][free_software]
+WeKan ® is an completely [Open Source][open_source] and [Free software][free_software]
 collaborative kanban board application with MIT license.
 
 Whether you’re maintaining a personal todo list, planning your holidays with some friends,
@@ -46,58 +51,58 @@ or working in a team on your next revolutionary idea, Kanban boards are an unbea
 to keep your things organized. They give you a visual overview of the current state of your project,
 and make you productive by allowing you to focus on the few items that matter the most.
 
-Since Wekan is a free software, you don’t have to trust us with your data and can
+Since WeKan ® is a free software, you don’t have to trust us with your data and can
 install Wekan on your own computer or server. In fact we encourage you to do
 that by providing one-click installation on various platforms.
 
-- Wekan is used in [most countries of the world](https://snapcraft.io/wekan).
+- 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.
-- [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.
+- Wekan has been [translated](https://transifex.com/wekan/wekan) to about 70 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.
 
 ## Requirements
 
 - 64bit: Linux [Snap](https://github.com/wekan/wekan-snap/wiki/Install) or [Sandstorm](https://sandstorm.io) /
   [Mac](https://github.com/wekan/wekan/wiki/Mac) / [Windows](https://github.com/wekan/wekan/wiki/Install-Wekan-from-source-on-Windows).
   [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.
+- 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.
+- 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).
-- [Backups](https://github.com/wekan/wekan/wiki/Backup) of Wekan database once a day miminum.
+  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.
+  Some bug can cause WeKan ® board to not load at all, requiring manual fixing of database content.
 
 ## Roadmap and Demo
 
-[Roadmap][roadmap_wekan] - Public read-only board at Wekan demo.
+[Roadmap][roadmap_wekan] - Public read-only board at WeKan ® demo.
 
 [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).
+- 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/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/).
 
 We also welcome sponsors for features and bugfixes.
-By working directly with Wekan you get the benefit of active maintenance and new features added by growing Wekan developer community.
+By working directly with WeKan ® you get the benefit of active maintenance and new features added by growing WeKan ® developer community.
 
 ## Screenshot
 
 [More screenshots at Features page](https://github.com/wekan/wekan/wiki/Features)
 
-[![Screenshot of Wekan][screenshot_wekan]][roadmap_wekan]
+[![Screenshot of WeKan ®][screenshot_wekan]][roadmap_wekan]
 
 ## License
 
-Wekan is released under the very permissive [MIT license](LICENSE), and made
+WeKan ® is released under the very permissive [MIT license](LICENSE), and made
 with [Meteor](https://www.meteor.com).
 
 [platforms]: https://github.com/wekan/wekan/wiki/Platforms
@@ -114,8 +119,6 @@ with [Meteor](https://www.meteor.com).
 [translate_wekan]: https://www.transifex.com/wekan/wekan/
 [open_source]: https://en.wikipedia.org/wiki/Open-source_software
 [free_software]: https://en.wikipedia.org/wiki/Free_software
-[vanila_badge]: https://vanila.io/img/join-chat-button2.png
-[wekan_chat]: https://community.vanila.io/wekan
-
+[discussions]: https://github.com/wekan/wekan/discussions
 
 [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fwekan%2Fwekan.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fwekan%2Fwekan?ref=badge_large)

SECURITY.md

@@ -1,10 +1,10 @@
 Security is very important to us. If you discover any issue regarding security, please disclose
-the information responsibly by sending an email to security (at) wekan.team and not by
+the information responsibly by sending an email to support (at) wekan.team using
+[this PGP public key](support-at-wekan.team_pgp-publickey.asc) and not by
 creating a GitHub issue. We will respond swiftly to fix verifiable security issues.
 
 We thank you with a place at our hall of fame page, that is
-at https://wekan.github.io/hall-of-fame . Others have just posted public GitHub issue,
-so they are not at that hall-of-fame page.
+at https://wekan.github.io/hall-of-fame
 
 ## How should reports be formatted?
 
@@ -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)

Stackerfile.yml

@@ -1,5 +1,5 @@
 appId: wekan-public/apps/77b94f60-dec9-0136-304e-16ff53095928
-appVersion: "v4.78.0"
+appVersion: "v6.09.0"
 files:
   userUploads:
     - README.md

api.py

@@ -5,6 +5,9 @@
 # Wekan API Python CLI, originally from here, where is more details:
 # https://github.com/wekan/wekan/wiki/New-card-with-Python3-and-REST-API
 
+# TODO:
+#   addcustomfieldtoboard: There is error: Settings must be object. So adding does not work yet.
+
 try:
     # python 3
     from urllib.parse import urlencode
@@ -23,17 +26,25 @@ if arguments == 0:
     print("AUTHORID is USERID that writes card.")
     print("If *nix:  chmod +x api.py => ./api.py users")
     print("Syntax:")
-    print("  python3 api.py users              # All users")
-    print("  python3 api.py boards USERID      # Boards of USERID")
-    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 users                # All users")
+    print("  python3 api.py boards               # All Public Boards")
+    print("  python3 api.py boards USERID        # Boards of USERID")
+    print("  python3 api.py board BOARDID        # Info of BOARDID")
+    print("  python3 api.py customfields BOARDID # Custom Fields of BOARDID")
+    print("  python3 api.py customfield BOARDID CUSTOMFIELDID # Info of CUSTOMFIELDID")
+    print("  python3 api.py addcustomfieldtoboard AUTHORID BOARDID NAME TYPE SETTINGS SHOWONCARD AUTOMATICALLYONCARD SHOWLABELONMINICARD SHOWSUMATTOPOFLIST # Add Custom Field to Board")
+    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,17 +72,29 @@ 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 customfields BOARDID # Custom Fields of BOARDID
+  python3 api.py customfield BOARDID CUSTOMFIELDID # Info of CUSTOMFIELDID
+  python3 api.py addcustomfieldtoboard AUTHORID BOARDID NAME TYPE SETTINGS SHOWONCARD AUTOMATICALLYONCARD SHOWLABELONMINICARD SHOWSUMATTOPOFLIST # Add Custom Field to Board
+  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
 
+=== ADD CUSTOM FIELD TO BOARD ===
+
+Type: text, number, date, dropdown, checkbox, currency, stringtemplate.
+
+python3 api.py addcustomfieldtoboard cmx3gmHLKwAXLqjxz LcDW4QdooAx8hsZh8 "SomeField" "date" "" true true true true 
+
+
 === USERS ===
 
 python3 api.py users
@@ -127,6 +150,7 @@ l = 'lists'
 sw = 'swimlane'
 sws = 'swimlanes'
 cs = 'cards'
+cf = 'custom-fields'
 bs = 'boards'
 atl = 'attachmentslist'
 at = 'attachment'
@@ -144,10 +168,34 @@ apikey = d['token']
 
 # ------- LOGIN TOKEN END -----------
 
+if arguments == 10:
+
+    if sys.argv[1] == 'addcustomfieldtoboard':
+        # ------- ADD CUSTOM FIELD TO BOARD START -----------
+        authorid = sys.argv[2]
+        boardid = sys.argv[3]
+        name = sys.argv[4]
+        type1 = sys.argv[5]
+        settings = str(json.loads(sys.argv[6]))
+        #  There is error: Settings must be object. So this does not work yet.
+        #settings = {'currencyCode': 'EUR'}
+        print(type(settings))
+        showoncard = sys.argv[7]
+        automaticallyoncard = sys.argv[8]
+        showlabelonminicard = sys.argv[9]
+        showsumattopoflist = sys.argv[10]
+        customfieldtoboard = wekanurl + apiboards + boardid + s + cf
+        # Add Custom Field to Board
+        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
+        post_data = {'authorId': '{}'.format(authorid), 'name': '{}'.format(name), 'type': '{}'.format(type1), 'settings': '{}'.format(settings), 'showoncard': '{}'.format(showoncard), 'automaticallyoncard': '{}'.format(automaticallyoncard), 'showlabelonminicard': '{}'.format(showlabelonminicard), 'showsumattopoflist': '{}'.format(showsumattopoflist)}
+        body = requests.post(customfieldtoboard, data=post_data, headers=headers)
+        print(body.text)
+        # ------- ADD CUSTOM FIELD TO BOARD END -----------
+
 if arguments == 7:
 
     if sys.argv[1] == 'addcard':
-        # ------- WRITE TO CARD START -----------
+        # ------- ADD CARD START -----------
         authorid = sys.argv[2]
         boardid = sys.argv[3]
         swimlaneid = sys.argv[4]
@@ -155,12 +203,33 @@ if arguments == 7:
         cardtitle = sys.argv[6]
         carddescription = sys.argv[7]
         cardtolist = wekanurl + apiboards + boardid + s + l + s + listid + s + cs
-        # Write to card
+        # Add card
         headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
         post_data = {'authorId': '{}'.format(authorid), 'title': '{}'.format(cardtitle), 'description': '{}'.format(carddescription), 'swimlaneId': '{}'.format(swimlaneid)}
         body = requests.post(cardtolist, data=post_data, headers=headers)
         print(body.text)
-        # ------- WRITE TO CARD END -----------
+        # ------- ADD CARD END -----------
+
+if arguments == 6:
+
+    if sys.argv[1] == 'editcard':
+
+        # ------- EDIT CARD 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)
+        # ------- EDIT CARD END -----------
 
 if arguments == 3:
 
@@ -177,6 +246,32 @@ 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 sys.argv[1] == 'customfield':
+
+        # ------- INFO OF CUSTOM FIELD START -----------
+        boardid = sys.argv[2]
+        customfieldid = sys.argv[3]
+        customfieldone = wekanurl + apiboards + boardid + s + cf + s + customfieldid
+        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
+        print("=== INFO OF ONE CUSTOM FIELD ===\n")
+        body = requests.get(customfieldone, headers=headers)
+        data2 = body.text.replace('}',"}\n")
+        print(data2)
+        # ------- INFO OF CUSTOM FIELD END -----------
+
 if arguments == 2:
 
     # ------- BOARDS LIST START -----------
@@ -190,8 +285,8 @@ if arguments == 2:
         data2 = body.text.replace('}',"}\n")
         print(data2)
     # ------- BOARDS LIST END -----------
-    if sys.argv[1] == 'board':
 
+    if sys.argv[1] == 'board':
         # ------- BOARD INFO START -----------
         boardid = sys.argv[2]
         board = wekanurl + apiboards + boardid
@@ -202,6 +297,17 @@ if arguments == 2:
         print(data2)
         # ------- BOARD INFO END -----------
 
+    if sys.argv[1] == 'customfields':
+        # ------- CUSTOM FIELDS OF BOARD START -----------
+        boardid = sys.argv[2]
+        boardcustomfields = wekanurl + apiboards + boardid + s + cf
+        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
+        body = requests.get(boardcustomfields, headers=headers)
+        print("=== CUSTOM FIELDS OF BOARD ===\n")
+        data2 = body.text.replace('}',"}\n")
+        print(data2)
+        # ------- CUSTOM FIELDS OF BOARD END -----------
+
     if sys.argv[1] == 'swimlanes':
         boardid = sys.argv[2]
         swimlanes = wekanurl + apiboards + boardid + s + sws
@@ -217,7 +323,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)
@@ -249,3 +355,14 @@ if arguments == 1:
         data2 = body.text.replace('}',"}\n")
         print(data2)
         # ------- LIST OF USERS END -----------
+
+    if sys.argv[1] == 'boards':
+
+        # ------- LIST OF PUBLIC BOARDS START -----------
+        headers = {'Accept': 'application/json', 'Authorization': 'Bearer {}'.format(apikey)}
+        print("=== PUBLIC BOARDS ===\n")
+        listpublicboards = wekanurl + apiboards
+        body = requests.get(listpublicboards, headers=headers)
+        data2 = body.text.replace('}',"}\n")
+        print(data2)
+        # ------- LIST OF PUBLIC BOARDS END -----------

client/components/activities/activities.jade

@@ -12,7 +12,7 @@ template(name="boardActivities")
     +activity(activity=activityData card=card mode=mode)
 
 template(name="cardActivities")
-  each activityData in currentCard.activities
+  each activityData in activities
     +activity(activity=activityData card=card mode=mode)
 
 template(name="editOrDeleteComment")
@@ -21,6 +21,26 @@ template(name="editOrDeleteComment")
   = ' - '
   a.js-delete-comment {{_ "delete"}}
 
+template(name="deleteCommentPopup")
+  p {{_ "comment-delete"}}
+  button.js-confirm.negate.full(type="submit") {{_ '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 +102,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 +123,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
 
@@ -120,10 +140,12 @@ template(name="activity")
               = activity.comment.text
             .edit-controls
               button.primary(type="submit") {{_ 'edit'}}
+              .fa.fa-times-thin.js-close-inlined-form
           else
             .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 +161,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 +172,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}}}.
 

client/components/activities/activities.js

@@ -1,6 +1,6 @@
-import sanitizeXss from 'xss';
+import DOMPurify from 'dompurify';
 
-const activitiesPerPage = 20;
+const activitiesPerPage = 500;
 
 BlazeComponent.extendComponent({
   onCreated() {
@@ -13,14 +13,14 @@ BlazeComponent.extendComponent({
     this.autorun(() => {
       let mode = this.data().mode;
       const capitalizedMode = Utils.capitalize(mode);
-      let thisId, searchId;
+      let searchId;
       if (mode === 'linkedcard' || mode === 'linkedboard') {
-        thisId = Session.get('currentCard');
-        searchId = Cards.findOne({ _id: thisId }).linkedId;
+        searchId = Utils.getCurrentCard().linkedId;
         mode = mode.replace('linked', '');
+      } else if (mode === 'card') {
+        searchId = Utils.getCurrentCardId();
       } else {
-        thisId = Session.get(`current${capitalizedMode}`);
-        searchId = thisId;
+        searchId = Session.get(`current${capitalizedMode}`);
       }
       const limit = this.page.get() * activitiesPerPage;
       const user = Meteor.user();
@@ -54,6 +54,13 @@ BlazeComponent.extendComponent({
   },
 }).register('activities');
 
+Template.activities.helpers({
+  activities() {
+    const ret = this.card.activities();
+    return ret;
+  },
+});
+
 BlazeComponent.extendComponent({
   checkItem() {
     const checkItemId = this.currentData().activity.checklistItemId;
@@ -113,8 +120,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 +171,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 +203,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)
     );
   },
 
@@ -207,10 +220,11 @@ BlazeComponent.extendComponent({
     return [
       {
         // XXX We should use Popup.afterConfirmation here
-        'click .js-delete-comment'() {
-          const commentId = this.currentData().activity.commentId;
+        'click .js-delete-comment': Popup.afterConfirm('deleteComment', () => {
+          const commentId = this.data().activity.commentId;
           CardComments.remove(commentId);
-        },
+          Popup.back();
+        }),
         'submit .js-edit-comment'(evt) {
           evt.preventDefault();
           const commentText = this.currentComponent()
@@ -232,10 +246,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.back();
+  },
+})
+
+Template.addReactionPopup.helpers({
+  codepoints() {
+    // Starting set of unicode codepoints as comment reactions
+    return [
+      '👍',
+      '👎',
+      '👀',
+      '✅',
+      '❌',
+      '🙏',
+      '👏',
+      '🎉',
+      '🚀',
+      '😊',
+      '🤔',
+      '😔'];
+  }
+})
+
+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 +311,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 +328,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 }),
       ),
     )
   );

client/components/activities/activities.styl

@@ -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

client/components/activities/comments.jade

@@ -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}}

client/components/activities/comments.js

@@ -3,6 +3,7 @@ const commentFormIsOpen = new ReactiveVar(false);
 BlazeComponent.extendComponent({
   onDestroyed() {
     commentFormIsOpen.set(false);
+    $('.note-popover').hide();
   },
 
   commentFormIsOpen() {
@@ -25,6 +26,8 @@ BlazeComponent.extendComponent({
           if (card.isLinkedCard()) {
             boardId = Cards.findOne(card.linkedId).boardId;
             cardId = card.linkedId;
+          } else if (card.isLinkedBoard()) {
+            boardId = card.linkedId;
           }
           if (text) {
             CardComments.insert({
@@ -63,7 +66,7 @@ function resetCommentInput(input) {
 // Tracker.autorun to register the component dependencies, and re-run when these
 // dependencies are invalidated. A better component API would remove this hack.
 Tracker.autorun(() => {
-  Session.get('currentCard');
+  Utils.getCurrentCardId();
   Tracker.afterFlush(() => {
     autosize.update($('.js-new-comment-input'));
   });
@@ -74,7 +77,7 @@ EscapeActions.register(
   () => {
     const draftKey = {
       fieldName: 'cardComment',
-      docId: Session.get('currentCard'),
+      docId: Utils.getCurrentCardId(),
     };
     const commentInput = $('.js-new-comment-input');
     const draft = commentInput.val().trim();

client/components/activities/comments.styl

@@ -31,7 +31,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

client/components/boards/boardArchive.js

@@ -11,7 +11,7 @@ BlazeComponent.extendComponent({
     return Boards.find(
       { archived: true },
       {
-        sort: { sort: 1 /* boards default sorting */ },
+        sort: { archivedAt: -1, modifiedAt: -1 },
       },
     );
   },
@@ -34,7 +34,7 @@ BlazeComponent.extendComponent({
           Utils.goBoardId(board._id);
         },
         'click .js-delete-board': Popup.afterConfirm('boardDelete', function() {
-          Popup.close();
+          Popup.back();
           const isSandstorm =
             Meteor.settings &&
             Meteor.settings.public &&

client/components/boards/boardBody.jade

@@ -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

client/components/boards/boardBody.js

@@ -23,7 +23,7 @@ BlazeComponent.extendComponent({
   },
 
   onlyShowCurrentCard() {
-    return Utils.isMiniScreen() && Session.get('currentCard');
+    return Utils.isMiniScreen() && Utils.getCurrentCardId(true);
   },
 
   goHome() {
@@ -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;
@@ -190,21 +191,11 @@ BlazeComponent.extendComponent({
     });
 
     this.autorun(() => {
-      let showDesktopDragHandles = false;
-      currentUser = Meteor.user();
-      if (currentUser) {
-        showDesktopDragHandles = (currentUser.profile || {})
-          .showDesktopDragHandles;
-      } else if (window.localStorage.getItem('showDesktopDragHandles')) {
-        showDesktopDragHandles = true;
-      } else {
-        showDesktopDragHandles = false;
-      }
-      if (Utils.isMiniScreen() || showDesktopDragHandles) {
+      if (Utils.isMiniScreenOrShowDesktopDragHandles()) {
         $swimlanesDom.sortable({
           handle: '.js-swimlane-header-handle',
         });
-      } else if (!Utils.isMiniScreen() && !showDesktopDragHandles) {
+      } else {
         $swimlanesDom.sortable({
           handle: '.swimlane-header',
         });
@@ -215,7 +206,7 @@ BlazeComponent.extendComponent({
       $swimlanesDom.sortable(
         'option',
         'disabled',
-        !Meteor.user().isBoardAdmin(),
+        !Meteor.user() || !Meteor.user().isBoardAdmin(),
       );
     });
 
@@ -235,6 +226,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 +326,7 @@ BlazeComponent.extendComponent({
       defaultView: 'agendaDay',
       editable: true,
       timezone: 'local',
+      weekNumbers: true,
       header: {
         left: 'title   today prev,next',
         center:
@@ -360,7 +362,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,

client/components/boards/boardColors.styl

@@ -15,9 +15,16 @@ setBoardColor(color)
   .is-selected .minicard
     border-left: 3px solid color
 
+  // All minicards rounded corners:
+  .minicard
+    border-radius: 7px
+    padding: 10px 10px 4px 10px
+    box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.15)
+
   button[type=submit].primary, input[type=submit].primary,
   .sidebar .sidebar-content .sidebar-btn
     background-color: darken(color, 20%)
+    border-radius: 7px
 
   &.pop-over .pop-over-list li a:not(.disabled):hover,
   .sidebar .sidebar-content .sidebar-btn:hover,
@@ -186,9 +193,10 @@ setBoardColor(color)
   .list >.list-header, .swimlane-header
     color:rgba(255,255,255,.7)
 
-  /* minicards */
+  /* minicards
   .minicard
     background-color:rgba(255,255,255,.4)
+  */
 
   .minicard-wrapper.is-selected .minicard,
   .minicard:hover,
@@ -196,9 +204,12 @@ setBoardColor(color)
   .open-minicard-composer:hover
     background-color:rgba(255,255,255,.8) !important
     color:#000
+    border-radius: 7px
 
+  /*
   .minicard, .minicard .badge
     color:#fff
+  */
 
   .minicard:hover .badge, .minicard-wrapper.is-selected .badge
     color:#000
@@ -214,6 +225,10 @@ setBoardColor(color)
   .sidebar-content h3, .sidebar-content h2, .sidebar-content
     color:rgba(255,255,255,.7) !important
 
+  .card-details .activities .activity .activity-desc .activity-comment
+    background-color: #cccccc
+    color: #222222
+
 .board-color-relax
   setBoardColor(#27AE61)
 
@@ -225,7 +240,7 @@ setBoardColor(color)
 
   .list-header
     background-color:#a7e366
-    border-bottom: 6px solid #a7e366
+    // border-bottom: 6px solid #a7e366
 
   .list-body
     background-color:#a7e366
@@ -450,7 +465,7 @@ setBoardClear(color1,color2)
     background-color: rgba(255,255,255,0.7)
     color: rgba(0,0,0,0.8)
     box-shadow: 0 1px 2px rgba(0,0,0,.2)
-
+    border-radius: 7px
   .quiet, .quiet a
     color: rgba(0,0,0,0.4)
 
@@ -465,6 +480,7 @@ setBoardClear(color1,color2)
 
   a:not(.disabled).is-active.fa, a:not(.disabled).is-active i.fa, a:not(.disabled):hover.fa, a:not(.disabled):hover i.fa
     color: rgba(0,0,0,0.6)
+    border-radius: 7px
 
   input[type="email"], input[type="password"], input[type="text"]
     border: 0
@@ -541,8 +557,8 @@ setBoardClear(color1,color2)
     background-color:#dedede
 
   .list-header
-    background-color: #c9cfc3
-    border-bottom: 6px solid #c9cfc3
+    // background-color: #c9cfc3
+    // border-bottom: 6px solid #c9cfc3
 
   .swimlane .swimlane-header-wrap
     background-color: #c2c0ab
@@ -645,7 +661,7 @@ setBoardClear(color1,color2)
 
   .list-header
     background: none
-    border-bottom-width: 0px
+    // border-bottom-width: 0px
 
   .list-header .list-header-name
     font-family: Poppins
@@ -654,7 +670,6 @@ setBoardClear(color1,color2)
 
   /* Card changes */
   .minicard
-    background: #FFF
     padding: 15px 15px 10px
     box-shadow: 0 3px 8px rgba(0,0,0,.05)
 
@@ -759,15 +774,24 @@ setBoardClear(color1,color2)
 
   /* Forms */
   button[type=submit].primary, .board-color-modern input[type=submit].primary
-    background-color: #819C5D
+    background-color: #777777
+    border-radius: 7px
 
   .toggle-switch:checked~.toggle-label
-    background-color: #D2E9B4
+    background-color: #f7f7f7
 
   .toggle-label:after, .board-color-modern .toggle-switch:checked~.toggle-label:after
-    background-color: #819C5D !important
+    background-color: #777777 !important
+
+  button, input:not([type=file]), select, textarea
+    border-radius: 7px
 
   /* 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 +799,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 +839,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,23 +868,34 @@ setBoardClear(color1,color2)
     border: 0px solid #666666
     flex: 0 0 265px;
 
-  .swimlane .list:nth-child(even)
-    background: #5f5f5f
+  .swimlane .list:first-child
+    margin-left: 0
+
+  .swimlane .list:nth-child(even) .list-header,
+  .swimlane .list:nth-child(even) .list-body
+    background: #6a6a6a
+
+  .swimlane .list:nth-child(odd) .list-header,
+  .swimlane .list:nth-child(odd) .list-body
+    background: #555555
 
   .list-header
-    background: #333333
-    padding-top: 10px
-    border-bottom: 6px solid #333333
+    padding: 10px
 
   .list-header .viewer
     padding-left: 10px
 
-  .list-header .list-header-name
+  .list-header .list-header-name,
+  .minicard
     line-height: 14px
     color: #eeeeee
 
   .list-header .list-header-menu
-    padding-top: 17px
+    padding: 10px
+    top: 0
+
+  .list-header .list-header-plus-top
+    color: #a6a6a6
 
   .list-body
     scrollbar-width: thin
@@ -882,37 +924,47 @@ setBoardClear(color1,color2)
 
   .list-body a.open-minicard-composer:hover, .list-body a.open-minicard-composer:hover i, .list .list-composer .open-list-composer:hover i
     color: #ffffff
+    border-radius: 7px
 
   /* Mini Card */
+  .minicard-wrapper
+    margin-bottom: 12px
+
   .minicard
     background-color: #444444
     color: #cccccc
     border-radius: 2px
-    font-size: 0.9em
-    padding: 10px
+    font-size: 0.95em
     box-shadow: 0 4px 3px -3px rgba(0,0,0,0.8)
     border-bottom: 1px solid #666666
+    padding: 8px
 
   .minicard:hover
-    background-color: #555555 !important
+    color: #f7f7f7
+    background-color: #4d4d4d !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
@@ -924,17 +976,24 @@ setBoardClear(color1,color2)
 
   /* Card Details */
   .card-details
-    position: absolute
-    top: 30px
-    left: calc(50% - 384px)
-    width: 768px
-    max-height: calc(100% - 60px)
     background-color: #454545
     color: #cccccc
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
     border: 1px solid #111111
     z-index: 100 !important
 
+  @media screen and (max-width: 800px)
+    .card-details
+      width: 98%
+
+  @media screen and (min-width: 801px)
+    .card-details
+      position: absolute
+      top: 30px
+      left: calc(50% - 384px)
+      width: 768px
+      max-height: calc(100% - 60px)
+
   .card-details
     scrollbar-width: thin
     scrollbar-color: #343434 #999999
@@ -971,17 +1030,23 @@ 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
 
   .card-details .check-box.materialCheckBox.is-checked
-    border-bottom: 2px solid #819C5D
-    border-right: 2px solid #819C5D
+    border-bottom: 2px solid #ffffff
+    border-right: 2px solid #ffffff
     border-top: 0
     border-left: 0
 
@@ -1021,5 +1086,5 @@ setBoardClear(color1,color2)
   font-size: 16px
   color: #cccccc
 
-.pop-over.board-color-moderndark .pop-over-list li:hover > a
-  background-color: #819C5D !important
+.pop-over.board-color-moderndark .pop-over-list li > a:hover
+  background-color: rgba(255,255,255,0.2)

client/components/boards/boardHeader.jade

@@ -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}}")
@@ -64,6 +80,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(
@@ -118,7 +140,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 +153,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 +235,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 +273,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'}}
+

client/components/boards/boardHeader.js

@@ -2,15 +2,16 @@
 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'() {
     Sidebar.setView('customFields');
-    Popup.close();
+    Popup.back();
   },
   'click .js-open-archives'() {
     Sidebar.setView('archives');
-    Popup.close();
+    Popup.back();
   },
   'click .js-change-board-color': Popup.open('boardChangeColor'),
   'click .js-change-language': Popup.open('changeLanguage'),
@@ -23,7 +24,7 @@ Template.boardMenuPopup.events({
   }),
   'click .js-delete-board': Popup.afterConfirm('deleteBoard', function() {
     const currentBoard = Boards.findOne(Session.get('currentBoard'));
-    Popup.close();
+    Popup.back();
     Boards.remove(currentBoard._id);
     FlowRouter.go('home');
   }),
@@ -46,7 +47,7 @@ Template.boardChangeTitlePopup.events({
     if (newTitle) {
       this.rename(newTitle);
       this.setDescription(newDesc);
-      Popup.close();
+      Popup.back();
     }
     event.preventDefault();
   },
@@ -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,11 +129,14 @@ BlazeComponent.extendComponent({
           Sidebar.setView();
           Filter.reset();
         },
+        'click .js-sort-reset'() {
+          Session.set('sortBy', '');
+        },
         'click .js-open-search-view'() {
           Sidebar.setView('search');
         },
         'click .js-multiselection-activate'() {
-          const currentCard = Session.get('currentCard');
+          const currentCard = Utils.getCurrentCardId();
           MultiSelection.activate();
           if (currentCard) {
             MultiSelection.add(currentCard);
@@ -160,20 +165,23 @@ Template.boardHeaderBar.helpers({
   boardView() {
     return Utils.boardView();
   },
+  isSortActive() {
+    return Session.get('sortBy') ? true : false;
+  },
 });
 
 Template.boardChangeViewPopup.events({
   'click .js-open-lists-view'() {
     Utils.setBoardView('board-view-lists');
-    Popup.close();
+    Popup.back();
   },
   'click .js-open-swimlanes-view'() {
     Utils.setBoardView('board-view-swimlanes');
-    Popup.close();
+    Popup.back();
   },
   'click .js-open-cal-view'() {
     Utils.setBoardView('board-view-cal');
-    Popup.close();
+    Popup.back();
   },
 });
 
@@ -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;
@@ -255,7 +327,7 @@ BlazeComponent.extendComponent({
     const currentBoard = Boards.findOne(Session.get('currentBoard'));
     const visibility = this.currentData();
     currentBoard.setVisibility(visibility);
-    Popup.close();
+    Popup.back();
   },
 
   events() {
@@ -288,7 +360,7 @@ BlazeComponent.extendComponent({
             Session.get('currentBoard'),
             level,
             (err, ret) => {
-              if (!err && ret) Popup.close();
+              if (!err && ret) Popup.back();
             },
           );
         },
@@ -360,7 +432,7 @@ BlazeComponent.extendComponent({
           const direction = down ? -1 : 1;
           this.setSortBy([sortby, direction]);
           if (Utils.isMiniScreen) {
-            Popup.close();
+            Popup.back();
           }
         },
       },
@@ -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.back();
+        },
+        'click .js-sort-title'() {
+          const sortBy = {
+            title: 1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('title'));
+          Popup.back();
+        },
+        'click .js-sort-created-asc'() {
+          const sortBy = {
+            createdAt: 1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('date-created-newest-first'));
+          Popup.back();
+        },
+        'click .js-sort-created-desc'() {
+          const sortBy = {
+            createdAt: -1,
+          };
+          Session.set('sortBy', sortBy);
+          sortCardsBy.set(TAPi18n.__('date-created-oldest-first'));
+          Popup.back();
+        },
+      },
+    ];
+  },
+}).register('cardsSortPopup');

client/components/boards/boardsList.jade

@@ -1,10 +1,40 @@
 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.AllBoardTemplates
+      //  if userHasTemplates
+      //  select.js-AllBoardTemplates#jsAllBoardTemplates("multiple")
+      //    option(value="-1") {{_ 'templates'}} :
+      //    each templatesDatas
+      //      option(value="{{templateId}}") {{_ templateDisplayName}}
+
+      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 +46,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 isMiniScreenOrShowDesktopDragHandles
+                    i.fa.board-handle(
+                        class="fa-arrows"
+                        title="{{_ 'Drag board'}}")
+                  else
+                    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 isMiniScreenOrShowDesktopDragHandles
+                    i.fa.board-handle(
+                        class="fa-arrows"
+                        title="{{_ 'Drag board'}}")
+                  else
+                    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 }}

client/components/boards/boardsList.js

@@ -1,5 +1,4 @@
 const subManager = new SubsManager();
-const { calculateIndex, enableClickOnTouch } = Utils;
 
 Template.boardListHeaderBar.events({
   'click .js-open-archived-board'() {
@@ -9,7 +8,11 @@ Template.boardListHeaderBar.events({
 
 Template.boardListHeaderBar.helpers({
   title() {
+    //if (FlowRouter.getRouteName() === 'template-container') {
+    //  return 'template-container';
+    //} else {
     return FlowRouter.getRouteName() === 'home' ? 'my-boards' : 'public';
+    //}
   },
   templatesBoardId() {
     return Meteor.user() && Meteor.user().getTemplatesBoardId();
@@ -22,6 +25,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() {
@@ -46,7 +59,7 @@ BlazeComponent.extendComponent({
         // of the previous and the following card -- if any.
         const prevBoardDom = ui.item.prev('.js-board').get(0);
         const nextBoardBom = ui.item.next('.js-board').get(0);
-        const sortIndex = calculateIndex(prevBoardDom, nextBoardBom, 1);
+        const sortIndex = Utils.calculateIndex(prevBoardDom, nextBoardBom, 1);
 
         const boardDomElement = ui.item.get(0);
         const board = Blaze.getData(boardDomElement);
@@ -63,27 +76,119 @@ BlazeComponent.extendComponent({
       },
     });
 
-    // ugly touch event hotfix
-    enableClickOnTouch(itemsSelector);
-
     // Disable drag-dropping if the current user is not a board member or is comment only
     this.autorun(() => {
-      if (Utils.isMiniScreen()) {
+      if (Utils.isMiniScreenOrShowDesktopDragHandles()) {
         $boards.sortable({
           handle: '.board-handle',
         });
       }
     });
   },
+  userHasTeams(){
+    if(Meteor.user() != null && Meteor.user().teams && Meteor.user().teams.length > 0)
+      return true;
+    else
+      return false;
+  },
+  teamsDatas() {
+    if(Meteor.user().teams)
+      return Meteor.user().teams.sort((a, b) => a.teamDisplayName.localeCompare(b.teamDisplayName));
+    else
+      return [];
+  },
+  userHasOrgs(){
+    if(Meteor.user() != null && Meteor.user().orgs && Meteor.user().orgs.length > 0)
+      return true;
+    else
+      return false;
+  },
+/*
+  userHasTemplates(){
+    if(Meteor.user() != null && Meteor.user().orgs && Meteor.user().orgs.length > 0)
+      return true;
+    else
+      return false;
+  },
+*/
+  orgsDatas() {
+    if(Meteor.user().orgs)
+      return Meteor.user().orgs.sort((a, b) => a.orgDisplayName.localeCompare(b.orgDisplayName));
+    else
+      return [];
+  },
+  userHasOrgsOrTeams(){
+    let boolUserHasOrgs;
+    if(Meteor.user() != null && Meteor.user().orgs && Meteor.user().orgs.length > 0)
+      boolUserHasOrgs = true;
+    else
+      boolUserHasOrgs = false;
 
+    let boolUserHasTeams;
+    if(Meteor.user() != null && 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 = {
+      // { type: 'board' },
+      // { type: { $in: ['board','template-container'] } },
+      $and: [
+        { archived: false },
+        { type: { $in: ['board','template-container'] } },
+        { $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 !== undefined && 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 !== undefined && 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 */ },
@@ -124,14 +229,19 @@ BlazeComponent.extendComponent({
         },
         'click .js-clone-board'(evt) {
           Meteor.call(
-            'cloneBoard',
+            'copyBoard',
             this.currentData()._id,
-            Session.get('fromBoard'),
+            {
+              sort: Boards.find({ archived: false }).count(),
+              type: 'board',
+              title: Boards.findOne(this.currentData()._id).title,
+            },
             (err, res) => {
               if (err) {
                 this.setError(err.error);
               } else {
                 Session.set('fromBoard', null);
+                subManager.subscribe('board', res, false);
                 Utils.goBoardId(res);
               }
             },
@@ -156,6 +266,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";
+              }
+            }
+          }
+        },
       },
     ];
   },

client/components/boards/boardsList.styl

@@ -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;

client/components/cards/attachments.jade

@@ -26,12 +26,25 @@ 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
             +spinner
         p.attachment-details
           = name
+          span.file-size ({{fileSize size}} KB)
           span.attachment-details-actions
             a.js-download(href="{{url download=true}}")
               i.fa.fa-download
@@ -55,6 +68,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' }}

client/components/cards/attachments.js

@@ -4,7 +4,7 @@ Template.attachmentsGalery.events({
     'attachmentDelete',
     function() {
       Attachments.remove(this._id);
-      Popup.close();
+      Popup.back();
     },
   ),
   // If we let this event bubble, FlowRouter will handle it and empty the page
@@ -49,11 +49,14 @@ Template.attachmentsGalery.helpers({
   isBoardAdmin() {
     return Meteor.user().isBoardAdmin();
   },
+  fileSize(size) {
+    return Math.round(size / 1024);
+  },
 });
 
 Template.previewAttachedImagePopup.events({
   'click .js-large-image-clicked'() {
-    Popup.close();
+    Popup.back();
   },
 });
 
@@ -65,7 +68,7 @@ Template.cardAttachmentsPopup.events({
         if (attachment && attachment._id && attachment.isImage()) {
           card.setCover(attachment._id);
         }
-        Popup.close();
+        Popup.back();
       });
     };
 
@@ -174,7 +177,7 @@ Template.previewClipboardImagePopup.events({
 
       pastedResults = null;
       $(document.body).pasteImageReader(() => {});
-      Popup.close();
+      Popup.back();
     }
   },
 });

client/components/cards/attachments.styl

@@ -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
 

client/components/cards/cardCustomFields.jade

@@ -52,10 +52,18 @@ template(name="cardCustomField-number")
         if value
             = value
 
+template(name="cardCustomField-checkbox")
+  .js-checklist-item.checklist-item(class="{{#if data.value }}is-checked{{/if}}")
+    if canModifyCard
+      .check-box-container
+        .check-box.materialCheckBox(class="{{#if data.value }}is-checked{{/if}}")
+    else
+      .materialCheckBox(class="{{#if data.value }}is-checked{{/if}}")
+
 template(name="cardCustomField-currency")
     if canModifyCard
         +inlinedForm(classNames="js-card-customfield-currency")
-            input(type="text" value=data.value)
+            input(type="text" value=data.value autofocus)
             .edit-controls.clearfix
                 button.primary(type="submit") {{_ 'save'}}
                 a.fa.fa-times-thin.js-close-inlined-form
@@ -71,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
@@ -111,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

client/components/cards/cardCustomFields.js

@@ -1,6 +1,9 @@
+import { DatePicker } from '/client/lib/datepicker';
+import Cards from '/models/cards';
+
 Template.cardCustomFieldsPopup.helpers({
   hasCustomField() {
-    const card = Cards.findOne(Session.get('currentCard'));
+    const card = Utils.getCurrentCard();
     const customFieldId = this._id;
     return card.customFieldIndex(customFieldId) > -1;
   },
@@ -8,7 +11,7 @@ Template.cardCustomFieldsPopup.helpers({
 
 Template.cardCustomFieldsPopup.events({
   'click .js-select-field'(event) {
-    const card = Cards.findOne(Session.get('currentCard'));
+    const card = Utils.getCurrentCard();
     const customFieldId = this._id;
     card.toggleCustomField(customFieldId);
     event.preventDefault();
@@ -28,7 +31,7 @@ const CardCustomField = BlazeComponent.extendComponent({
 
   onCreated() {
     const self = this;
-    self.card = Cards.findOne(Session.get('currentCard'));
+    self.card = Utils.getCurrentCard();
     self.customFieldId = this.data()._id;
   },
 
@@ -80,6 +83,25 @@ CardCustomField.register('cardCustomField');
   }
 }.register('cardCustomField-number'));
 
+// cardCustomField-checkbox
+(class extends CardCustomField {
+  onCreated() {
+    super.onCreated();
+  }
+
+  toggleItem() {
+    this.card.setCustomField(this.customFieldId, !this.data().value);
+  }
+
+  events() {
+    return [
+      {
+        'click .js-checklist-item .check-box-container': this.toggleItem,
+      },
+    ];
+  }
+}.register('cardCustomField-checkbox'));
+
 // cardCustomField-currency
 (class extends CardCustomField {
   onCreated() {
@@ -102,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);
         },
       },
@@ -126,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
@@ -167,7 +194,7 @@ CardCustomField.register('cardCustomField');
   onCreated() {
     super.onCreated();
     const self = this;
-    self.card = Cards.findOne(Session.get('currentCard'));
+    self.card = Utils.getCurrentCard();
     self.customFieldId = this.data()._id;
     this.data().value && this.date.set(moment(this.data().value));
   }
@@ -214,3 +241,91 @@ 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.stringtemplateItems.get();
+          this.card.setCustomField(this.customFieldId, items);
+        },
+
+        'keydown .js-card-customfield-stringtemplate-item'(event) {
+          if (event.keyCode === 13) {
+            event.preventDefault();
+
+            if (event.target.value.trim() || event.metaKey || event.ctrlKey) {
+              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);
+            }
+            if (event.metaKey || event.ctrlKey) {
+              this.find('button[type=submit]').click();
+            }
+          }
+        },
+
+        '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'));

client/components/cards/cardDate.jade

@@ -1,10 +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}} {{_ 'predicate-week'}} {{showWeek}}" class="{{classes}}")
+    time(datetime="{{showISODate}}")
+      | {{showDate}}
+      b
+        | {{showWeek}}

client/components/cards/cardDate.js

@@ -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() {
@@ -116,7 +24,7 @@ Template.dateBadge.helpers({
   }
 
   _deleteDate() {
-    this.card.setReceived(null);
+    this.card.unsetReceived();
   }
 }.register('editCardReceivedDatePopup'));
 
@@ -142,7 +50,7 @@ Template.dateBadge.helpers({
   }
 
   _deleteDate() {
-    this.card.setStart(null);
+    this.card.unsetStart();
   }
 }.register('editCardStartDatePopup'));
 
@@ -165,7 +73,7 @@ Template.dateBadge.helpers({
   }
 
   _deleteDate() {
-    this.card.setDue(null);
+    this.card.unsetDue();
   }
 }.register('editCardDueDatePopup'));
 
@@ -188,7 +96,7 @@ Template.dateBadge.helpers({
   }
 
   _deleteDate() {
-    this.card.setEnd(null);
+    this.card.unsetEnd();
   }
 }.register('editCardEndDatePopup'));
 
@@ -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;
   }
@@ -363,6 +275,46 @@ class CardEndDate extends CardDate {
 }
 CardEndDate.register('cardEndDate');
 
+class CardCustomFieldDate extends CardDate {
+  template() {
+    return 'dateCustomField';
+  }
+
+  onCreated() {
+    super.onCreated();
+    const self = this;
+    self.autorun(() => {
+      self.date.set(moment(self.data().value));
+    });
+  }
+
+  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 `${this.date.get().format('LLLL')}`;
+  }
+
+  classes() {
+    return 'customfield-date';
+  }
+
+  events() {
+    return [];
+  }
+}
+CardCustomFieldDate.register('cardCustomFieldDate');
+
 (class extends CardReceivedDate {
   showDate() {
     return this.date.get().format('l');
@@ -387,6 +339,12 @@ CardEndDate.register('cardEndDate');
   }
 }.register('minicardEndDate'));
 
+(class extends CardCustomFieldDate {
+  showDate() {
+    return this.date.get().format('l');
+  }
+}.register('minicardCustomFieldDate'));
+
 class VoteEndDate extends CardDate {
   onCreated() {
     super.onCreated();
@@ -413,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');

client/components/cards/cardDate.styl

@@ -2,11 +2,11 @@
   display: block
   border-radius: 4px
   padding: 1px 3px
-  
+
   background-color: #dbdbdb
   &:hover, &.is-active
     background-color: #b3b3b3
-  
+
   &.current, &.almost-due, &.due, &.long-overdue
     color: #fff
 
@@ -14,17 +14,17 @@
     background-color: #5ba639
     &:hover, &.is-active
       background-color: darken(#5ba639, 10)
-  
+
   &.almost-due
     background-color: #edc909
     &:hover, &.is-active
       background-color: darken(#edc909, 10)
-  
+
   &.due
     background-color: #fa3f00
     &:hover, &.is-active
       background-color: darken(#fa3f00, 10)
-  
+
   &.long-overdue
     background-color: #fd5d47
     &:hover, &.is-active
@@ -57,3 +57,7 @@
       -webkit-font-smoothing: antialiased
       margin-right: 0.3em
 
+.customfield-date
+  display: block
+  border-radius: 4px
+  padding: 1px 3px

client/components/cards/cardDescription.jade

@@ -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}}

client/components/cards/cardDescription.js

@@ -3,6 +3,7 @@ const descriptionFormIsOpen = new ReactiveVar(false);
 BlazeComponent.extendComponent({
   onDestroyed() {
     descriptionFormIsOpen.set(false);
+    $('.note-popover').hide();
   },
 
   descriptionFormIsOpen() {
@@ -24,7 +25,10 @@ BlazeComponent.extendComponent({
         // Pressing Ctrl+Enter should submit the form
         'keydown form textarea'(evt) {
           if (evt.keyCode === 13 && (evt.metaKey || evt.ctrlKey)) {
-            this.find('button[type=submit]').click();
+            const submitButton = this.find('button[type=submit]');
+            if (submitButton) {
+              submitButton.click();
+            }
           }
         },
       },

client/components/cards/cardDescription.styl

@@ -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

client/components/cards/cardDetails.styl

@@ -4,15 +4,6 @@
 
 avatar-radius = 50%
 
-#cardURL_copy
-  // Have clipboard text not visible by moving it to far left
-  position: absolute
-  left: -2000px
-  top: 0px
-
-#clipboard
-  white-space: normal
-
 .assignee
   border-radius: 3px
   display: block
@@ -85,6 +76,12 @@ avatar-radius = 50%
       box-shadow: 0 0 0 2px darken(white, 60%) inset
 
 // Other card details
+.copied-tooltip
+  display: none
+  padding: 0px 10px;
+  background-color: #000000df;
+  color: #fff;
+  border-radius: 5px;
 
 .card-details
   padding: 0
@@ -95,7 +92,7 @@ avatar-radius = 50%
   overflow-x: hidden
   background: darken(white, 3%)
   border-radius: bottom 3px
-  z-index: 20 !important
+  z-index: 20
   animation: flexGrowIn 0.1s
   box-shadow: 0 0 7px 0 darken(white, 30%)
   transition: flex-basis 0.1s
@@ -110,21 +107,35 @@ 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%)
+    position: sticky
+    top: 0px
+    z-index: 500
+
+    .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,
     .close-card-details-mobile-web,
-    .card-details-menu-mobile-web
+    .card-details-menu-mobile-web,
+    .copied-tooltip
       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
@@ -173,6 +184,9 @@ avatar-radius = 50%
       margin-top: 5px
       margin-bottom: 10px
 
+      .copied-tooltip
+        padding: 0px 10px
+
     .card-details-list
       font-size: 0.85em
       margin-bottom: 3px
@@ -186,6 +200,10 @@ avatar-radius = 50%
           border-radius: 3px
           padding: 0px 5px
 
+    .copied-tooltip
+      margin-right: 10px
+      padding: 10px;
+
   .card-description textarea
     min-height: 100px
 
@@ -196,13 +214,13 @@ avatar-radius = 50%
 
     .card-details-item
       margin-right: 0.5em
+      flex-grow: 1
       &:last-child
         margin-right: 0
       &.card-details-item-labels
         display: block
         word-wrap: break-word
         max-width: 95%
-        flex-grow: 1
       &.card-details-item-members,
       &.card-details-item-assignees,
       &.card-details-item-customfield,
@@ -210,7 +228,7 @@ avatar-radius = 50%
         display: block
         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,
@@ -218,20 +236,55 @@ avatar-radius = 50%
         display: block
         word-wrap: break-word
         max-width: 28%
-        flex-grow: 1
+      &.custom-fields
+        padding-left: 10px
+
 
   .card-details-item-title
     font-size: 16px
     font-weight: bold
     color: #4d4d4d
 
-  .card-label
-    padding-top: 5px
-    padding-bottom: 5px
-
   .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: 100
+    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
@@ -249,6 +302,8 @@ input[type="submit"].attachment-add-link-submit
     padding: 0px 20px 0px 20px
     margin: 0px
     transition: none
+    overflow-y: revert
+    overflow-x: revert
 
     .card-details-canvas
       width: 100%
@@ -259,7 +314,28 @@ 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-popup
+    padding: 0px 10px
+
+  .pop-over > .content-wrapper > .popup-container-depth-0
+    width: 100%
+
+    & > .content
+      width: calc(100% - 10px)
+
+    & > .content > .card-details-popup hr
+        margin: 15px 0px
+
+      .card-details-header
+        margin: 0
 
 card-details-color(background, color...)
   background: background !important
@@ -356,3 +432,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
+

client/components/cards/cardTime.js

@@ -9,7 +9,6 @@ BlazeComponent.extendComponent({
   toggleOvertime() {
     this.card.setIsOvertime(!this.card.getIsOvertime());
     $('#overtime .materialCheckBox').toggleClass('is-checked');
-
     $('#overtime').toggleClass('is-checked');
   },
   storeTime(spentTime, isOvertime) {
@@ -18,6 +17,7 @@ BlazeComponent.extendComponent({
   },
   deleteTime() {
     this.card.setSpentTime(null);
+    this.card.setIsOvertime(false);
   },
   events() {
     return [
@@ -27,11 +27,14 @@ BlazeComponent.extendComponent({
           evt.preventDefault();
 
           const spentTime = parseFloat(evt.target.time.value);
-          const isOvertime = this.card.getIsOvertime();
-
+          //const isOvertime = this.card.getIsOvertime();
+          let isOvertime = false;
+          if ($('#overtime').attr('class').indexOf('is-checked') >= 0) {
+            isOvertime = true;
+          }
           if (spentTime >= 0) {
             this.storeTime(spentTime, isOvertime);
-            Popup.close();
+            Popup.back();
           } else {
             this.error.set('invalid-time');
             evt.target.time.focus();
@@ -40,7 +43,7 @@ BlazeComponent.extendComponent({
         'click .js-delete-time'(evt) {
           evt.preventDefault();
           this.deleteTime();
-          Popup.close();
+          Popup.back();
         },
         'click a.js-toggle-overtime': this.toggleOvertime,
       },

client/components/cards/checklists.jade

@@ -4,30 +4,24 @@ 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
           input.toggle-switch(type="checkbox" id="toggleHideCheckedItemsButton")
         label.toggle-label(for="toggleHideCheckedItemsButton")
 
-  if toggleDeleteDialog.get
-    .board-overlay#card-details-overlay
-    +checklistDeleteDialog(checklist = checklistToDelete)
-
-
   .card-checklist-items
-    each checklist in currentCard.checklists
+    each checklist in checklists
       +checklistDetail(checklist = checklist)
 
   if canModifyCard
     +inlinedForm(autoclose=false classNames="js-add-checklist" cardId = cardId)
-      +addChecklistItemForm
+      +addChecklistItemForm(checklist=checklist showNewlineBecomesNewChecklistItem=false)
     else
-      a.js-open-inlined-form
+      a.add-checklist.js-open-inlined-form(title="{{_ 'add-checklist'}}")
         i.fa.fa-plus
-        | {{_ 'add-checklist'}}...
 
 template(name="checklistDetail")
   .js-checklist.checklist
@@ -37,7 +31,7 @@ template(name="checklistDetail")
       .checklist-title
         span
         if canModifyCard
-          a.js-delete-checklist.toggle-delete-checklist-dialog {{_ "delete"}}...
+          a.fa.fa-navicon.checklist-details-menu.js-open-checklist-details-menu(title="{{_ 'checklistActionsPopup-title'}}")
 
         if canModifyCard
           h2.title.js-open-inlined-form.is-editable
@@ -49,27 +43,33 @@ template(name="checklistDetail")
           h2.title
             +viewer
                 = checklist.title
+
+    if $gt finishedPercent 0
+      .checklist-progress-bar-container
+        .checklist-progress-text {{finishedPercent}}%
+        .checklist-progress-bar
+          .checklist-progress(style="width:{{finishedPercent}}%")
     +checklistItems(checklist = checklist)
 
-template(name="checklistDeleteDialog")
-  .js-confirm-checklist-delete
-    p
-      i(class="fa fa-exclamation-triangle" aria-hidden="true")
-    p
-      | {{_ 'confirm-checklist-delete-dialog'}}
-      span {{checklist.title}}
-      | ?
-    .js-checklist-delete-buttons
-      button.confirm-checklist-delete(type="button") {{_ 'delete'}}
-      button.toggle-delete-checklist-dialog(type="button") {{_ 'cancel'}}
+template(name="checklistDeletePopup")
+  p {{_ 'confirm-checklist-delete-popup'}}
+  button.js-confirm.negate.full(type="submit") {{_ 'delete'}}
 
 template(name="addChecklistItemForm")
+  a.fa.fa-copy(title="{{_ 'copy-text-to-clipboard'}}")
+  span.copied-tooltip {{_ 'copied'}}
   textarea.js-add-checklist-item(rows='1' autofocus)
   .edit-controls.clearfix
     button.primary.confirm.js-submit-add-checklist-item-form(type="submit") {{_ 'save'}}
     a.fa.fa-times-thin.js-close-inlined-form
+    if showNewlineBecomesNewChecklistItem
+      .material-toggle-switch(title="{{_ 'newlineBecomesNewChecklistItem'}}")
+        input.toggle-switch(type="checkbox" id="toggleNewlineBecomesNewChecklistItem")
+        label.toggle-label(for="toggleNewlineBecomesNewChecklistItem")
 
 template(name="editChecklistItemForm")
+  a.fa.fa-copy(title="{{_ 'copy-text-to-clipboard'}}")
+  span.copied-tooltip {{_ 'copied'}}
   textarea.js-edit-checklist-item(rows='1' autofocus dir="auto")
     if $eq type 'item'
       = item.title
@@ -81,6 +81,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
@@ -91,11 +94,10 @@ template(name="checklistItems")
         +checklistItemDetail(item = item checklist = checklist)
     if canModifyCard
       +inlinedForm(autoclose=false classNames="js-add-checklist-item" checklist = checklist)
-        +addChecklistItemForm
+        +addChecklistItemForm(checklist=checklist showNewlineBecomesNewChecklistItem=true)
       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 +114,79 @@ 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'}}
+
+template(name="checklistActionsPopup")
+  ul.pop-over-list
+    li
+      a.js-delete-checklist.delete-checklist
+        i.fa.fa-trash
+        | {{_ "delete"}} ...
+      a.js-move-checklist.move-checklist
+        i.fa.fa-arrow-right
+        | {{_ "moveChecklist"}} ...
+      a.js-copy-checklist.copy-checklist
+        i.fa.fa-copy
+        | {{_ "copyChecklist"}} ...
+
+template(name="copyChecklistPopup")
+  +copyAndMoveChecklist
+
+template(name="moveChecklistPopup")
+  +copyAndMoveChecklist
+
+template(name="copyAndMoveChecklist")
+  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}}" selected="{{#if isChecklistDialogOptionBoardId _id}}selected{{/if}}") {{title}}
+
+  label {{_ 'swimlanes'}}:
+  select.js-select-swimlanes
+    each swimlanes
+      option(value="{{_id}}" selected="{{#if isChecklistDialogOptionSwimlaneId _id}}selected{{/if}}") {{title}}
+
+  label {{_ 'lists'}}:
+  select.js-select-lists
+    each lists
+      option(value="{{_id}}" selected="{{#if isChecklistDialogOptionListId _id}}selected{{/if}}") {{title}}
+
+  label {{_ 'cards'}}:
+  select.js-select-cards
+    each cards
+      option(value="{{_id}}" selected="{{#if isChecklistDialogOptionCardId _id}}selected{{/if}}") {{title}}
+
+  .edit-controls.clearfix
+    button.primary.confirm.js-done {{_ 'done'}}

client/components/cards/checklists.js

@@ -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) {
@@ -9,10 +13,10 @@ function initSorting(items) {
     appendTo: 'parent',
     distance: 7,
     placeholder: 'checklist-item placeholder',
-    scroll: false,
+    scroll: true,
     start(evt, ui) {
       ui.placeholder.height(ui.helper.height());
-      EscapeActions.executeUpTo('popup-close');
+      EscapeActions.clickExecute(evt.target, 'inlinedForm');
     },
     stop(evt, ui) {
       const parent = ui.item.parents('.js-checklist-items');
@@ -51,7 +55,7 @@ BlazeComponent.extendComponent({
       return Meteor.user() && Meteor.user().isBoardMember();
     }
 
-    // Disable sorting if the current user is not a board member or is a miniscreen
+    // Disable sorting if the current user is not a board member
     self.autorun(() => {
       const $itemsDom = $(self.itemsDom);
       if ($itemsDom.data('uiSortable') || $itemsDom.data('sortable')) {
@@ -73,6 +77,12 @@ BlazeComponent.extendComponent({
       !Meteor.user().isWorker()
     );
   },
+
+  /** returns the finished percent of the checklist */
+  finishedPercent() {
+    const ret = this.data().checklist.finishedPercent();
+    return ret;
+  },
 }).register('checklistDetail');
 
 BlazeComponent.extendComponent({
@@ -82,7 +92,8 @@ BlazeComponent.extendComponent({
     const title = textarea.value.trim();
     let cardId = this.currentData().cardId;
     const card = Cards.findOne(cardId);
-    if (card.isLinked()) cardId = card.linkedId;
+    //if (card.isLinked()) cardId = card.linkedId;
+    if (card.isLinkedCard()) cardId = card.linkedId;
 
     if (title) {
       Checklists.insert({
@@ -90,29 +101,34 @@ BlazeComponent.extendComponent({
         title,
         sort: card.checklists().count(),
       });
+      this.closeAllInlinedForms();
       setTimeout(() => {
         this.$('.add-checklist-item')
           .last()
           .click();
       }, 100);
     }
-    textarea.value = '';
-    textarea.focus();
   },
-
   addChecklistItem(event) {
     event.preventDefault();
     const textarea = this.find('textarea.js-add-checklist-item');
+    const newlineBecomesNewChecklistItem = this.find('input#toggleNewlineBecomesNewChecklistItem');
     const title = textarea.value.trim();
     const checklist = this.currentData().checklist;
 
     if (title) {
-      ChecklistItems.insert({
-        title,
-        checklistId: checklist._id,
-        cardId: checklist.cardId,
-        sort: checklist.itemCount(),
-      });
+      let checklistItems = [title];
+      if (newlineBecomesNewChecklistItem.checked) {
+        checklistItems = title.split('\n').map(_value => _value.trim());
+      }
+      for (let checklistItem of checklistItems) {
+        ChecklistItems.insert({
+          title: checklistItem,
+          checklistId: checklist._id,
+          cardId: checklist.cardId,
+          sort: Utils.calculateIndexData(checklist.lastItem()).base,
+        });
+      }
     }
     // We keep the form opened, empty it.
     textarea.value = '';
@@ -128,14 +144,6 @@ BlazeComponent.extendComponent({
     );
   },
 
-  deleteChecklist() {
-    const checklist = this.currentData().checklist;
-    if (checklist && checklist._id) {
-      Checklists.remove(checklist._id);
-      this.toggleDeleteDialog.set(false);
-    }
-  },
-
   deleteItem() {
     const checklist = this.currentData().checklist;
     const item = this.currentData().item;
@@ -161,11 +169,6 @@ BlazeComponent.extendComponent({
     item.setTitle(title);
   },
 
-  onCreated() {
-    this.toggleDeleteDialog = new ReactiveVar(false);
-    this.checklistToDelete = null; //Store data context to pass to checklistDeleteDialog template
-  },
-
   pressKey(event) {
     //If user press enter key inside a form, submit it
     //Unless the user is also holding down the 'shift' key
@@ -186,14 +189,13 @@ BlazeComponent.extendComponent({
     }
   },
 
+  /** closes all inlined forms (checklist and checklist-item input fields) */
+  closeAllInlinedForms() {
+    this.$('.js-close-inlined-form').click();
+  },
+
   events() {
     const events = {
-      'click .toggle-delete-checklist-dialog'(event) {
-        if ($(event.target).hasClass('js-delete-checklist')) {
-          this.checklistToDelete = this.currentData().checklist; //Store data context
-        }
-        this.toggleDeleteDialog.set(!this.toggleDeleteDialog.get());
-      },
       'click #toggleHideCheckedItemsButton'() {
         Meteor.call('toggleHideCheckedItems');
       },
@@ -202,20 +204,69 @@ BlazeComponent.extendComponent({
     return [
       {
         ...events,
+        'click .js-open-checklist-details-menu': Popup.open('checklistActions'),
         'submit .js-add-checklist': this.addChecklist,
         '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,
+        // add and delete checklist / checklist-item
+        'click .js-open-inlined-form': this.closeAllInlinedForms,
         keydown: this.pressKey,
       },
     ];
   },
 }).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({
+  checklists() {
+    const card = Cards.findOne(this.cardId);
+    const ret = card.checklists();
+    return ret;
+  },
   hideCheckedItems() {
     const currentUser = Meteor.user();
     if (currentUser) return currentUser.hasHideCheckedItems();
@@ -223,39 +274,77 @@ Template.checklists.helpers({
   },
 });
 
-Template.addChecklistItemForm.onRendered(() => {
-  autosize($('textarea.js-add-checklist-item'));
-});
+BlazeComponent.extendComponent({
+  onRendered() {
+    autosize(this.$('textarea.js-add-checklist-item'));
+  },
+  canModifyCard() {
+    return (
+      Meteor.user() &&
+      Meteor.user().isBoardMember() &&
+      !Meteor.user().isCommentOnly() &&
+      !Meteor.user().isWorker()
+    );
+  },
+  events() {
+    return [
+      {
+        'click a.fa.fa-copy'(event) {
+          const $editor = this.$('textarea');
+          const promise = Utils.copyTextToClipboard($editor[0].value);
 
-Template.editChecklistItemForm.onRendered(() => {
-  autosize($('textarea.js-edit-checklist-item'));
-});
+          const $tooltip = this.$('.copied-tooltip');
+          Utils.showCopied(promise, $tooltip);
+        },
+      }
+    ];
+  }
+}).register('addChecklistItemForm');
 
-Template.checklistDeleteDialog.onCreated(() => {
-  const $cardDetails = this.$('.card-details');
-  this.scrollState = {
-    position: $cardDetails.scrollTop(), //save current scroll position
-    top: false, //required for smooth scroll animation
-  };
-  //Callback's purpose is to only prevent scrolling after animation is complete
-  $cardDetails.animate({ scrollTop: 0 }, 500, () => {
-    this.scrollState.top = true;
-  });
+BlazeComponent.extendComponent({
+  events() {
+    return [
+      {
+        'click .js-delete-checklist' : Popup.afterConfirm('checklistDelete', function () {
+          Popup.back(2);
+          const checklist = this.checklist;
+          if (checklist && checklist._id) {
+            Checklists.remove(checklist._id);
+          }
+        }),
+        'click .js-move-checklist' : Popup.open('moveChecklist'),
+        'click .js-copy-checklist' : Popup.open('copyChecklist'),
+      }
+    ]
+  }
+}).register('checklistActionsPopup');
 
-  //Prevent scrolling while dialog is open
-  $cardDetails.on('scroll', () => {
-    if (this.scrollState.top) {
-      //If it's already in position, keep it there. Otherwise let animation scroll
-      $cardDetails.scrollTop(0);
-    }
-  });
-});
+BlazeComponent.extendComponent({
+  onRendered() {
+    autosize(this.$('textarea.js-edit-checklist-item'));
+  },
+  canModifyCard() {
+    return (
+      Meteor.user() &&
+      Meteor.user().isBoardMember() &&
+      !Meteor.user().isCommentOnly() &&
+      !Meteor.user().isWorker()
+    );
+  },
+  events() {
+    return [
+      {
+        'click a.fa.fa-copy'(event) {
+          const $editor = this.$('textarea');
+          const promise = Utils.copyTextToClipboard($editor[0].value);
 
-Template.checklistDeleteDialog.onDestroyed(() => {
-  const $cardDetails = this.$('.card-details');
-  $cardDetails.off('scroll'); //Reactivate scrolling
-  $cardDetails.animate({ scrollTop: this.scrollState.position });
-});
+          const $tooltip = this.$('.copied-tooltip');
+          Utils.showCopied(promise, $tooltip);
+        },
+      }
+    ];
+  }
+}).register('editChecklistItemForm');
 
 Template.checklistItemDetail.helpers({
   canModifyCard() {
@@ -289,3 +378,231 @@ BlazeComponent.extendComponent({
     ];
   },
 }).register('checklistItemDetail');
+
+class DialogWithBoardSwimlaneListAndCard extends BlazeComponent {
+  /** returns the checklist dialog options
+   * @return Object with properties { boardId, swimlaneId, listId, cardId }
+   */
+  getChecklistDialogOptions() {
+  }
+
+  /** checklist is done
+   * @param cardId the selected card id
+   * @param options the selected options (Object with properties { boardId, swimlaneId, listId, cardId })
+   */
+  setDone(cardId, options) {
+  }
+
+  onCreated() {
+    this.currentBoardId = Utils.getCurrentBoardId();
+    this.selectedBoardId = new ReactiveVar(this.currentBoardId);
+    this.selectedSwimlaneId = new ReactiveVar('');
+    this.selectedListId = new ReactiveVar('');
+    this.setChecklistDialogOption(this.currentBoardId);
+  }
+
+  /** set the last confirmed dialog field values
+   * @param boardId the current board id
+   */
+  setChecklistDialogOption(boardId) {
+    this.checklistDialogOption = {
+      'boardId' : "",
+      'swimlaneId' : "",
+      'listId' : "",
+      'cardId': "",
+    }
+
+    let currentOptions = this.getChecklistDialogOptions();
+    if (currentOptions && boardId && currentOptions[boardId]) {
+      this.checklistDialogOption = currentOptions[boardId];
+      if (this.checklistDialogOption.boardId &&
+          this.checklistDialogOption.swimlaneId &&
+          this.checklistDialogOption.listId
+      )
+      {
+        this.selectedBoardId.set(this.checklistDialogOption.boardId)
+        this.selectedSwimlaneId.set(this.checklistDialogOption.swimlaneId);
+        this.selectedListId.set(this.checklistDialogOption.listId);
+      }
+    }
+    this.getBoardData(this.selectedBoardId.get());
+    if (!this.selectedSwimlaneId.get() || !Swimlanes.findOne({_id: this.selectedSwimlaneId.get(), boardId: this.selectedBoardId.get()})) {
+      this.setFirstSwimlaneId();
+    }
+    if (!this.selectedListId.get() || !Lists.findOne({_id: this.selectedListId.get(), boardId: this.selectedBoardId.get()})) {
+      this.setFirstListId();
+    }
+  }
+  /** sets the first swimlane id */
+  setFirstSwimlaneId() {
+    try {
+      const board = Boards.findOne(this.selectedBoardId.get());
+      const swimlaneId = board.swimlanes().fetch()[0]._id;
+      this.selectedSwimlaneId.set(swimlaneId);
+    } catch (e) {}
+  }
+  /** sets the first list id */
+  setFirstListId() {
+    try {
+      const board = Boards.findOne(this.selectedBoardId.get());
+      const listId = board.lists().fetch()[0]._id;
+      this.selectedListId.set(listId);
+    } catch (e) {}
+  }
+
+  /** returns if the board id was the last confirmed one
+   * @param boardId check this board id
+   * @return if the board id was the last confirmed one
+   */
+  isChecklistDialogOptionBoardId(boardId) {
+    let ret = this.checklistDialogOption.boardId == boardId;
+    return ret;
+  }
+
+  /** returns if the swimlane id was the last confirmed one
+   * @param swimlaneId check this swimlane id
+   * @return if the swimlane id was the last confirmed one
+   */
+  isChecklistDialogOptionSwimlaneId(swimlaneId) {
+    let ret = this.checklistDialogOption.swimlaneId == swimlaneId;
+    return ret;
+  }
+
+  /** returns if the list id was the last confirmed one
+   * @param listId check this list id
+   * @return if the list id was the last confirmed one
+   */
+  isChecklistDialogOptionListId(listId) {
+    let ret = this.checklistDialogOption.listId == listId;
+    return ret;
+  }
+
+  /** returns if the card id was the last confirmed one
+   * @param cardId check this card id
+   * @return if the card id was the last confirmed one
+   */
+  isChecklistDialogOptionCardId(cardId) {
+    let ret = this.checklistDialogOption.cardId == cardId;
+    return ret;
+  }
+
+  /** returns all available board */
+  boards() {
+    const ret = Boards.find(
+      {
+        archived: false,
+        'members.userId': Meteor.userId(),
+        _id: { $ne: Meteor.user().getTemplatesBoardId() },
+      },
+      {
+        sort: { sort: 1 },
+      },
+    );
+    return ret;
+  }
+
+  /** returns all available swimlanes of the current board */
+  swimlanes() {
+    const board = Boards.findOne(this.selectedBoardId.get());
+    const ret = board.swimlanes();
+    return ret;
+  }
+
+  /** returns all available lists of the current board */
+  lists() {
+    const board = Boards.findOne(this.selectedBoardId.get());
+    const ret = board.lists();
+    return ret;
+  }
+
+  /** returns all available cards of the current list */
+  cards() {
+    const list = Lists.findOne(this.selectedListId.get());
+    const ret = list.cards(this.selectedSwimlaneId.get());
+    return ret;
+  }
+
+  /** get the board data from the server
+   * @param boardId get the board data of this board id
+   */
+  getBoardData(boardId) {
+    const self = this;
+    Meteor.subscribe('board', boardId, false, {
+      onReady() {
+        const sameBoardId = self.selectedBoardId.get() == boardId;
+        self.selectedBoardId.set(boardId);
+
+        if (!sameBoardId) {
+          // reset swimlane id (for selection in cards())
+          self.setFirstSwimlaneId();
+
+          // reset list id (for selection in cards())
+          self.setFirstListId();
+        }
+      },
+    });
+  }
+
+  events() {
+    return [
+      {
+        'click .js-done'() {
+          const boardSelect = this.$('.js-select-boards')[0];
+          const boardId = boardSelect.options[boardSelect.selectedIndex].value;
+
+          const listSelect = this.$('.js-select-lists')[0];
+          const listId = listSelect.options[listSelect.selectedIndex].value;
+
+          const swimlaneSelect = this.$('.js-select-swimlanes')[0];
+          const swimlaneId = swimlaneSelect.options[swimlaneSelect.selectedIndex].value;
+
+          const cardSelect = this.$('.js-select-cards')[0];
+          const cardId = cardSelect.options[cardSelect.selectedIndex].value;
+
+          const options = {
+            'boardId' : boardId,
+            'swimlaneId' : swimlaneId,
+            'listId' : listId,
+            'cardId': cardId,
+          }
+          this.setDone(cardId, options);
+          Popup.back(2);
+        },
+        'change .js-select-boards'(event) {
+          const boardId = $(event.currentTarget).val();
+          this.getBoardData(boardId);
+        },
+        'change .js-select-swimlanes'(event) {
+          this.selectedSwimlaneId.set($(event.currentTarget).val());
+        },
+        'change .js-select-lists'(event) {
+          this.selectedListId.set($(event.currentTarget).val());
+        },
+      },
+    ];
+  }
+}
+
+/** Move Checklist Dialog */
+(class extends DialogWithBoardSwimlaneListAndCard {
+  getChecklistDialogOptions() {
+    const ret = Meteor.user().getMoveChecklistDialogOptions();
+    return ret;
+  }
+  setDone(cardId, options) {
+    Meteor.user().setMoveChecklistDialogOption(this.currentBoardId, options);
+    this.data().checklist.move(cardId);
+  }
+}).register('moveChecklistPopup');
+
+/** Copy Checklist Dialog */
+(class extends DialogWithBoardSwimlaneListAndCard {
+  getChecklistDialogOptions() {
+    const ret = Meteor.user().getCopyChecklistDialogOptions();
+    return ret;
+  }
+  setDone(cardId, options) {
+    Meteor.user().setCopyChecklistDialogOption(this.currentBoardId, options);
+    this.data().checklist.copy(cardId);
+  }
+}).register('copyChecklistPopup');

client/components/cards/checklists.styl

@@ -20,6 +20,25 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
   display: flex
   justify-content: space-between
 
+.checklist-progress-bar-container
+  display: flex
+  flex-direction: row
+  align-items: center
+
+  .checklist-progress-text
+    margin-right: 10px
+
+  .checklist-progress-bar
+    width: 80%
+    height: 10px
+
+    .checklist-progress
+      color: #fff !important
+      background-color: #2196F3 !important
+      padding: 0.01em 16px
+      border-radius: 16px
+      height: 100%
+
 .checklist-title
   .checkbox
     float: left
@@ -39,48 +58,10 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
     &.is-finished
       color: #3cb500
 
-  .js-delete-checklist
-    @extends .delete-text
-
   span.fa.checklist-handle
     padding-right: 20px
-    padding-top: 6px
-    float: right
-
-
-.js-confirm-checklist-delete
-  background-color: darken(white, 3%)
-  position: absolute
-  float: left;
-  width: 60%
-  margin-top: 0
-  margin-left: 13%
-  padding-bottom: 2%
-  padding-left: 3%
-  padding-right: 3%
-  z-index: 17
-  border-radius: 3px
-
-  p
-    position: relative
-    margin-top: 3%
-    width: 100%
-    text-align: center
-    span
-      font-weight: bold
-
-    i
-      font-size: 2em
-
-  .js-checklist-delete-buttons
-    position: relative
-    padding: left 2% right 2%
-    .confirm-checklist-delete
-      margin-left: 12%
-      float: left
-    .toggle-delete-checklist-dialog
-      margin-right: 12%
-      float: right
+    padding-top: 3px
+    float: left
 
 #card-details-overlay
   top: 0
@@ -159,11 +140,29 @@ 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
 
 .add-checklist-item
   margin: 0.2em 0 0.5em 1.33em
-  display: inline-block
+
+.add-checklist-item,.add-checklist
+  &.js-open-inlined-form
+    display: block
+    width: 50%
+
+    &:hover
+      background: #dbdbdb
+      color: #222
+      box-shadow: 0 1px 2px rgba(0,0,0,.2)
+
+.checklist-details-menu
+  float: right
+  padding: 6px 10px 6px 10px
+
+.edit-controls
+  label.toggle-label
+    margin-left: 2px

client/components/cards/labels.jade

@@ -27,9 +27,11 @@ template(name="deleteLabelPopup")
 template(name="cardLabelsPopup")
   ul.edit-labels-pop-over
     each board.labels
-      li
+      li.js-card-label-item
         a.card-label-edit-button.fa.fa-pencil.js-edit-label
-        span.card-label.card-label-selectable.js-select-label(class="card-label-{{color}}"
+        if isMiniScreenOrShowDesktopDragHandles
+          span.fa.label-handle(class="fa-arrows" title="{{_ 'dragLabel'}}")
+        span.card-label.card-label-selectable.js-select-label.card-label-wrapper(class="card-label-{{color}}"
           class="{{# if isLabelSelected ../_id }}active{{/if}}")
             +viewer
               = name

client/components/cards/labels.js

@@ -39,15 +39,67 @@ Template.createLabelPopup.helpers({
   },
 });
 
-Template.cardLabelsPopup.events({
-  'click .js-select-label'(event) {
-    const card = Cards.findOne(Session.get('currentCard'));
-    const labelId = this._id;
-    card.toggleLabel(labelId);
-    event.preventDefault();
+BlazeComponent.extendComponent({
+  onRendered() {
+    const itemsSelector = 'li.js-card-label-item:not(.placeholder)';
+    const $labels = this.$('.edit-labels-pop-over');
+
+    $labels.sortable({
+      connectWith: '.edit-labels-pop-over',
+      tolerance: 'pointer',
+      appendTo: '.edit-labels-pop-over',
+      helper(element, currentItem) {
+        let ret = currentItem.clone();
+        if (currentItem.closest('.popup-container-depth-0').size() == 0)
+        { // only set css transform at every sub-popup, not at the main popup
+          const content = currentItem.closest('.content')[0]
+          const offsetLeft = content.offsetLeft;
+          const offsetTop = $('.pop-over > .header').height() * -1;
+          ret.css("transform", `translate(${offsetLeft}px, ${offsetTop}px)`);
+        }
+        return ret;
+      },
+      distance: 7,
+      items: itemsSelector,
+      placeholder: 'card-label-wrapper placeholder',
+      start(evt, ui) {
+        ui.helper.css('z-index', 1000);
+        ui.placeholder.height(ui.helper.height());
+        EscapeActions.clickExecute(evt.target, 'inlinedForm');
+      },
+      stop(evt, ui) {
+        const newLabelOrderOnlyIds = ui.item.parent().children().toArray().map(_element => Blaze.getData(_element)._id)
+        const card = Blaze.getData(this);
+        card.board().setNewLabelOrder(newLabelOrderOnlyIds);
+      },
+    });
+
+    // Disable drag-dropping if the current user is not a board member or is comment only
+    this.autorun(() => {
+      if (Utils.isMiniScreenOrShowDesktopDragHandles()) {
+        $labels.sortable({
+          handle: '.label-handle',
+        });
+      }
+    });
   },
-  'click .js-edit-label': Popup.open('editLabel'),
-  'click .js-add-label': Popup.open('createLabel'),
+  events() {
+    return [
+      {
+        'click .js-select-label'(event) {
+          const card = this.data();
+          const labelId = this.currentData()._id;
+          card.toggleLabel(labelId);
+          event.preventDefault();
+        },
+        'click .js-edit-label': Popup.open('editLabel'),
+        'click .js-add-label': Popup.open('createLabel'),
+      }
+    ];
+  }
+}).register('cardLabelsPopup');
+
+Template.cardLabelsPopup.events({
 });
 
 Template.formLabel.events({

client/components/cards/labels.styl

@@ -2,6 +2,7 @@
 
 // XXX Use .board-widget-labels as a flexbox container
 .card-label
+  border: 1px solid #000000
   border-radius: 4px
   color: white  //Default white text, in select cases,  changed to black to improve contrast between label colour and text
   display: inline-block
@@ -12,10 +13,11 @@
   padding: 3px 8px
   max-width: 210px
   min-width: 8px
-  overflow: ellipsis
   word-wrap: break-word
-  height: 18px
-  vertical-align: bottom
+  min-height: 18px
+  vertical-align: middle
+  white-space: initial
+  overflow: initial
 
   &:hover
     color: white
@@ -27,12 +29,13 @@
 
   &.add-label
     box-shadow: 0 0 0 2px darken(white, 25%) inset
+    border: initial
 
     &:hover, &.is-active
       box-shadow: 0 0 0 2px darken(white, 60%) inset
 
-    i.fa-plus
-      margin-top: 3px
+  p
+    margin: 0px
 
 .palette-colors
   display: flex
@@ -44,9 +47,19 @@
     align-items: center
     justify-content: center
 
+.card-label-white
+  background-color: #ffffff
+  color: #000000 //Black text for better visibility
+
+.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
@@ -133,6 +146,7 @@
     height: 25px
     margin: 0px 3% 7px 0px
     width: 10.5%
+    max-width: 10.5%
     cursor: pointer
 
 .edit-labels
@@ -209,3 +223,9 @@
   &:hover
     background: #dbdbdb
 
+ul.edit-labels-pop-over
+  span.fa.label-handle
+    padding-right: 10px;
+
+  span.fa.label-handle + .card-label
+    max-width: 180px

client/components/cards/minicard.jade

@@ -2,21 +2,17 @@ template(name="minicard")
   .minicard(
     class="{{#if isLinkedCard}}linked-card{{/if}}"
     class="{{#if isLinkedBoard}}linked-board{{/if}}"
-    class="minicard-{{colorClass}}")
-    if isMiniScreen
+    class="{{#if colorClass}}minicard-{{colorClass}}{{/if}}")
+    if isMiniScreenOrShowDesktopDragHandles
       .handle
         .fa.fa-arrows
-    unless isMiniScreen
-      if showDesktopDragHandles
-        .handle
-          .fa.fa-arrows
     if cover
       .minicard-cover(style="background-image: url('{{cover.url}}');")
     if labels
-      .minicard-labels
+      .minicard-labels(class="{{#if hiddenMinicardLabelText}}minicard-labels-no-text{{/if}}")
         each labels
           unless hiddenMinicardLabelText
-            span.card-label(class="card-label-{{color}}" title=name)
+            span.js-card-label.card-label(class="card-label-{{color}}" title=name)
               +viewer
                 = name
           if hiddenMinicardLabelText
@@ -37,6 +33,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
@@ -77,20 +76,33 @@ template(name="minicard")
                 if $eq definition.type "currency"
                   +viewer
                     = formattedCurrencyCustomFieldValue(definition)
+                else if $eq definition.type "date"
+                  .date
+                    +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
 
-    if getAssignees
-      .minicard-assignees.js-minicard-assignees
-        each getAssignees
-          +userAvatar(userId=this)
-        hr(class="assigneehr" title="{{_ 'assignee'}}")
+    if showAssignee
+      if getAssignees
+        .minicard-assignees.js-minicard-assignees
+          each getAssignees
+            +userAvatar(userId=this)
 
-    if getMembers
-      .minicard-members.js-minicard-members
-        each getMembers
-          +userAvatar(userId=this)
+    if showMembers
+      if getMembers
+        .minicard-members.js-minicard-members
+          each getMembers
+            +userAvatar(userId=this)
+
+    if showCreator
+      .minicard-creator
+        +userAvatar(userId=this.userId noRemove=true)
 
     .badges
       unless currentUser.isNoComments
@@ -110,6 +122,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
@@ -118,3 +135,17 @@ 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.check-list-sort {{ sort }}
+
+template(name="editCardSortOrderPopup")
+  input.js-edit-card-sort-popup(type='text' autofocus value=sort dir="auto")
+  .edit-controls.clearfix
+    button.primary.confirm.js-submit-edit-card-sort-popup(type="submit") {{_ 'save'}}

client/components/cards/minicard.js

@@ -21,6 +21,66 @@ 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;
+  },
+
+  showMembers() {
+    if (this.data().board()) {
+      return (
+        this.data().board.allowsMembers === null ||
+        this.data().board().allowsMembers === undefined ||
+        this.data().board().allowsMembers
+      );
+    }
+    return false;
+  },
+
+  showAssignee() {
+    if (this.data().board()) {
+      return (
+        this.data().board.allowsAssignee === null ||
+        this.data().board().allowsAssignee === undefined ||
+        this.data().board().allowsAssignee
+      );
+    }
+    return false;
+  },
+
+  /** opens the card label popup only if clicked onto a label
+   * <li> this is necessary to have the data context of the minicard.
+   *      if .js-card-label is used at click event, then only the data context of the label itself is available at this.currentData()
+   */
+  cardLabelsPopup(event) {
+    if (this.find('.js-card-label:hover')) {
+      Popup.open("cardLabels")(event, {dataContextIfCurrentDataIsUndefined: this.currentData()});
+    }
+  },
+
   events() {
     return [
       {
@@ -29,8 +89,6 @@ BlazeComponent.extendComponent({
           else if (this.data().isLinkedBoard())
             Utils.goBoardId(this.data().linkedId);
         },
-      },
-      {
         'click .js-toggle-minicard-label-text'() {
           if (window.localStorage.getItem('hiddenMinicardLabelText')) {
             window.localStorage.removeItem('hiddenMinicardLabelText'); //true
@@ -38,22 +96,14 @@ BlazeComponent.extendComponent({
             window.localStorage.setItem('hiddenMinicardLabelText', 'true'); //true
           }
         },
-      },
+        'click span.badge-icon.fa.fa-sort, click span.badge-text.check-list-sort' : Popup.open("editCardSortOrder"),
+        'click .minicard-labels' : this.cardLabelsPopup,
+      }
     ];
   },
 }).register('minicard');
 
 Template.minicard.helpers({
-  showDesktopDragHandles() {
-    currentUser = Meteor.user();
-    if (currentUser) {
-      return (currentUser.profile || {}).showDesktopDragHandles;
-    } else if (window.localStorage.getItem('showDesktopDragHandles')) {
-      return true;
-    } else {
-      return false;
-    }
-  },
   hiddenMinicardLabelText() {
     currentUser = Meteor.user();
     if (currentUser) {
@@ -65,3 +115,30 @@ Template.minicard.helpers({
     }
   },
 });
+
+BlazeComponent.extendComponent({
+  events() {
+    return [
+      {
+        'keydown input.js-edit-card-sort-popup'(evt) {
+          // enter = save
+          if (evt.keyCode === 13) {
+            this.find('button[type=submit]').click();
+          }
+        },
+        'click button.js-submit-edit-card-sort-popup'(event) {
+          // save button pressed
+          event.preventDefault();
+          const sort = this.$('.js-edit-card-sort-popup')[0]
+            .value
+            .trim();
+          if (!Number.isNaN(sort)) {
+            let card = this.data();
+            card.move(card.boardId, card.swimlaneId, card.listId, sort);
+            Popup.back();
+          }
+        },
+      }
+    ]
+  }
+}).register('editCardSortOrderPopup');

client/components/cards/minicard.styl

@@ -80,8 +80,6 @@
 
   .minicard-labels
     float: none
-    display: flex
-    flex-wrap: wrap
 
     .minicard-label
       width: 11px
@@ -89,7 +87,11 @@
       border-radius: 2px
       margin-right: 3px
       margin-bottom: 3px
-      
+
+  .minicard-labels-no-text
+    display: flex
+    flex-wrap: wrap
+
   .minicard-custom-fields
     display:block;
   .minicard-custom-field
@@ -114,6 +116,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,19 +169,18 @@
         line-height: 12px
 
   .minicard-members,
-  .minicard-assignees
+  .minicard-assignees,
+  .minicard-creator
     float: right
     margin-left: 5px
-
-    .assigneehr
-      border-top: 1px solid red
-      margin-bottom: 4px
+    margin-bottom: 4px
 
     .member
       float: right
       border-radius: 50%
       height: 28px
       width: @height
+      margin-bottom: 4px
 
     .assignee
       float: right
@@ -186,6 +191,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

client/components/cards/resultCard.jade

@@ -1,23 +1,44 @@
 template(name="resultCard")
   .result-card-wrapper
-    a.minicard-wrapper.card-title(href=card.absoluteUrl)
+    a.minicard-wrapper.js-minicard.card-title(href=originRelativeUrl)
       +minicard(this)
       //= card.title
     ul.result-card-context-list
       li.result-card-context(title="{{_ 'board'}}")
-        +viewer
-          = getBoard.title
+        .result-card-block-wrapper
+          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
         = ' '
         | {{_ 'context-separator'}}
         = ' '
       li.result-card-context(title="{{_ 'swimlane'}}")
-        +viewer
-          = getSwimlane.title
+        .result-card-block-wrapper
+          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
         = ' '
         | {{_ 'context-separator'}}
         = ' '
       li.result-card-context(title="{{_ 'list'}}")
-        +viewer
-          = getList.title
+        .result-card-block-wrapper
+          if listId
+            +viewer
+              = getList.title
+          else
+            .broken-cards-null
+              | NULL
+        if getList.archived
+          i.fa.fa-archive

client/components/cards/resultCard.js

@@ -5,7 +5,31 @@ Template.resultCard.helpers({
 });
 
 BlazeComponent.extendComponent({
+  clickOnMiniCard(evt) {
+    evt.preventDefault();
+    const this_ = this;
+    const cardId = this.currentData()._id;
+    const boardId = this.currentData().boardId;
+    Meteor.subscribe('popupCardData', cardId, {
+      onReady() {
+        Session.set('popupCardId', cardId);
+        Session.set('popupCardBoardId', boardId);
+        this_.cardDetailsPopup(evt);
+      },
+    });
+  },
+
+  cardDetailsPopup(event) {
+    if (!Popup.isOpen()) {
+      Popup.open("cardDetails")(event);
+    }
+  },
+
   events() {
-    return [{}];
+    return [
+      {
+        'click .js-minicard': this.clickOnMiniCard,
+      },
+    ];
   },
 }).register('resultCard');

client/components/cards/resultCard.styl

@@ -19,3 +19,6 @@
 
 .result-card-context-list
   margin-bottom: 0.7rem
+
+.result-card-block-wrapper
+  display: inline-block

client/components/cards/subtasks.jade

@@ -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

client/components/cards/subtasks.js

@@ -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

client/components/forms/forms.styl

@@ -86,7 +86,7 @@ select
   margin-bottom: 8px
 
   &.inline
-  	width: 100%
+    width: 100%
 
 option[disabled]
   color: #8c8c8c
@@ -117,7 +117,6 @@ button
   display: inline-block
   font-weight: 700
   line-height: 22px
-  margin: 8px 4px 0 0
   padding: 7px 20px
   text-align: center
 
@@ -226,27 +225,27 @@ textarea
 .edit-controls,
 .add-controls
   display: flex
-  align-items: baseline
-  margin-top: 0
+  align-items: center
+  margin-top: 0px
+  margin-bottom: 12px
 
   button[type=submit]
   input[type=button]
     float: left
     height: 32px
-    margin-top: -2px
-    padding-top: 5px
-    padding-bottom: 5px
+    margin-bottom: 0px
 
   .fa-times-thin
     font-size: 26px
-    margin: 3px 4px
+    margin: 3px 10px
 
 // Material Design checkboxes
-[type="checkbox"]:not(:checked),
-[type="checkbox"]:checked
-  position: absolute
-  left: -9999px
-  visibility: hidden
+  [type="checkbox"]:not(:checked),
+  [type="checkbox"]:checked
+    position: absolute
+    left: -9999px
+    visibility: hidden
+    display: none
 
 .materialCheckBox
   position: relative

client/components/import/import.jade

@@ -13,38 +13,43 @@ template(name="import")
 template(name="importTextarea")
   form
     p: label(for='import-textarea') {{_ instruction}} {{_ 'import-board-instruction-about-errors'}}
-    textarea.js-import-json(placeholder="{{_ importPlaceHolder}}" autofocus)
+    textarea.js-import-json(id='import-textarea' placeholder="{{_ importPlaceHolder}}" autofocus)
       | {{jsonText}}
     input.primary.wide(type="submit" value="{{_ 'import'}}")
 
 template(name="importMapMembers")
   h2 {{_ 'import-map-members'}}
-  .map-members
-    p {{_ 'import-members-map'}}
-    .mapping-list
-      each members
-        a.mapping-item.js-select-member(class="{{#if wekanId}}filled{{/if}}")
-          .profile-source
-            .full-name= fullName
-            .username
-              | ({{username}})
-          .wekan
-            if wekanId
-              +userAvatar(userId=wekanId)
-            else
-              a.member.add-member
-                i.fa.fa-plus
-      //-
-        Due to the way the flewbox layout is working, we need to set some
-        invisible items so that the last row items have a consistent width.
-        See http://jsfiddle.net/Ln4h3c4n/ for an minimal example of the issue.
-      .mapping-item.ghost-item
-      .mapping-item.ghost-item
-      .mapping-item.ghost-item
-      .mapping-item.ghost-item
-      .mapping-item.ghost-item
-    form
-      input.primary.wide(type="submit" value="{{_ 'done'}}")
+  if usersLoaded.get
+    .map-members
+      p {{_ 'import-members-map'}}
+      p.import-members-map-note
+        | {{_ 'import-members-map-note' }}
+      .mapping-list
+        each members
+          a.mapping-item.js-select-member(class="{{#if wekanId}}filled{{/if}}")
+            .profile-source
+              .full-name= fullName
+              .username
+                | ({{username}})
+            .wekan
+              if wekanId
+                +userAvatar(userId=wekanId)
+              else
+                a.member.add-member
+                  i.fa.fa-plus
+        //-
+          Due to the way the flewbox layout is working, we need to set some
+          invisible items so that the last row items have a consistent width.
+          See http://jsfiddle.net/Ln4h3c4n/ for an minimal example of the issue.
+        .mapping-item.ghost-item
+        .mapping-item.ghost-item
+        .mapping-item.ghost-item
+        .mapping-item.ghost-item
+        .mapping-item.ghost-item
+      form
+        input.primary.wide(type="submit" value="{{_ 'done'}}")
+  else
+    +spinner
 
 template(name="importMapMembersAddPopup")
   .select-member

client/components/import/import.js

@@ -150,14 +150,42 @@ BlazeComponent.extendComponent({
 
 BlazeComponent.extendComponent({
   onCreated() {
+    this.usersLoaded = new ReactiveVar(false);
+
     this.autorun(() => {
-      this.parentComponent()
-        .membersToMap.get()
-        .forEach(({ wekanId }) => {
-          if (wekanId) {
-            this.subscribe('user-miniprofile', wekanId);
+      const handle = this.subscribe(
+        'user-miniprofile',
+        this.members().map(member => {
+          return member.username;
+        }),
+      );
+      Tracker.nonreactive(() => {
+        Tracker.autorun(() => {
+          if (
+            handle.ready() &&
+            !this.usersLoaded.get() &&
+            this.members().length
+          ) {
+            this._refreshMembers(
+              this.members().map(member => {
+                if (!member.wekanId) {
+                  let user = Users.findOne({ username: member.username });
+                  if (!user) {
+                    user = Users.findOne({ importUsernames: member.username });
+                  }
+                  if (user) {
+                    // eslint-disable-next-line no-console
+                    // console.log('found username:', user.username);
+                    member.wekanId = user._id;
+                  }
+                }
+                return member;
+              }),
+            );
           }
+          this.usersLoaded.set(handle.ready());
         });
+      });
     });
   },
 

client/components/import/import.styl

@@ -47,3 +47,7 @@
 
 a.show-mapping
   text-decoration underline
+
+.import-members-map-note
+  font-size: 90%
+  font-weight: bold

client/components/lists/list.js

@@ -1,3 +1,5 @@
+require('/client/lib/jquery-ui.js')
+
 const { calculateIndex } = Utils;
 
 BlazeComponent.extendComponent({
@@ -93,7 +95,7 @@ BlazeComponent.extendComponent({
         $cards.sortable('cancel');
 
         if (MultiSelection.isActive()) {
-          Cards.find(MultiSelection.getMongoSelector()).forEach((card, i) => {
+          Cards.find(MultiSelection.getMongoSelector(), {sort: ['sort']}).forEach((card, i) => {
             const newSwimlaneId = targetSwimlaneId
               ? targetSwimlaneId
               : card.swimlaneId || defaultSwimlaneId;
@@ -114,25 +116,51 @@ BlazeComponent.extendComponent({
         }
         boardComponent.setIsDragging(false);
       },
+      sort(event, ui) {
+        const $boardCanvas = $('.board-canvas');
+        const  boardCanvas = $boardCanvas[0];
+
+        if (event.pageX < 10)
+        { // scroll to the left
+          boardCanvas.scrollLeft -= 15;
+          ui.helper[0].offsetLeft -= 15;
+        }
+        if (
+          event.pageX > boardCanvas.offsetWidth - 10 &&
+          boardCanvas.scrollLeft < $boardCanvas.data('scrollLeftMax') // don't scroll more than possible
+        )
+        { // scroll to the right
+          boardCanvas.scrollLeft += 15;
+        }
+        if (
+          event.pageY > boardCanvas.offsetHeight - 10 &&
+          event.pageY + boardCanvas.scrollTop < $boardCanvas.data('scrollTopMax') // don't scroll more than possible
+        )
+        { // scroll to the bottom
+          boardCanvas.scrollTop += 15;
+        }
+        if (event.pageY < 10)
+        { // scroll to the top
+          boardCanvas.scrollTop -= 15;
+        }
+      },
+      activate(event, ui) {
+        const $boardCanvas = $('.board-canvas');
+        const  boardCanvas = $boardCanvas[0];
+        // scrollTopMax and scrollLeftMax only available at Firefox (https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTopMax)
+        // https://www.it-swarm.com.de/de/javascript/so-erhalten-sie-den-maximalen-dokument-scrolltop-wert/1069126844/
+        $boardCanvas.data('scrollTopMax', boardCanvas.scrollHeight - boardCanvas.clientTop);
+        // https://stackoverflow.com/questions/5138373/how-do-i-get-the-max-value-of-scrollleft/5704386#5704386
+        $boardCanvas.data('scrollLeftMax', boardCanvas.scrollWidth - boardCanvas.clientWidth);
+      },
     });
 
     this.autorun(() => {
-      let showDesktopDragHandles = false;
-      currentUser = Meteor.user();
-      if (currentUser) {
-        showDesktopDragHandles = (currentUser.profile || {})
-          .showDesktopDragHandles;
-      } else if (window.localStorage.getItem('showDesktopDragHandles')) {
-        showDesktopDragHandles = true;
-      } else {
-        showDesktopDragHandles = false;
-      }
-
-      if (Utils.isMiniScreen() || showDesktopDragHandles) {
+      if (Utils.isMiniScreenOrShowDesktopDragHandles()) {
         $cards.sortable({
           handle: '.handle',
         });
-      } else if (!Utils.isMiniScreen() && !showDesktopDragHandles) {
+      } else {
         $cards.sortable({
           handle: '.minicard',
         });
@@ -178,19 +206,6 @@ BlazeComponent.extendComponent({
   },
 }).register('list');
 
-Template.list.helpers({
-  showDesktopDragHandles() {
-    currentUser = Meteor.user();
-    if (currentUser) {
-      return (currentUser.profile || {}).showDesktopDragHandles;
-    } else if (window.localStorage.getItem('showDesktopDragHandles')) {
-      return true;
-    } else {
-      return false;
-    }
-  },
-});
-
 Template.miniList.events({
   'click .js-select-list'() {
     const listId = this._id;

client/components/lists/list.styl

@@ -4,7 +4,6 @@
   box-sizing: border-box
   display: flex
   flex-direction: column
-  flex: 0 0 270px
   position: relative
   // Even if this background color is the same as the body we can't leave it
   // transparent, because that won't work during a list drag.
@@ -12,6 +11,8 @@
   border-left: 1px solid darken(white, 20%)
   padding: 0
   float: left
+  min-width: 270px
+  max-width: 270px
 
   &:first-child
     margin-left: 5px
@@ -85,13 +86,9 @@
     color: #a6a6a6
 
   .list-header-menu
-    position: absolute
-    padding: 27px 19px
-    margin-top: 1px
-    top: -7px
-    right: 3px
+    float: right
 
-  .list-header-plus-icon
+  .list-header-plus-top
     color: #a6a6a6
     margin-right: 15px
 
@@ -100,9 +97,10 @@
 
   .cardCount
     color: #8c8c8c
-    font-size: 0.8em
+    font-size: 12px
+    font-weight: bold
 
-.list-header .list-header-plus-icon, .js-open-list-menu, .list-header-menu a
+.list-header .list-header-plus-top, .js-open-list-menu, .list-header-menu a
     color #4d4d4d
     padding-left 4px
 
@@ -160,18 +158,6 @@
     float: left
 
 @media screen and (max-width: 800px)
-  .list-header-menu
-    position: absolute
-    padding: 27px 19px
-    margin-top: 1px
-    top: -7px
-    margin-right: 7px
-    right: -3px
-
-  .list-header
-    .list-header-name
-      margin-left: 1.4rem
-
   .mini-list
     flex: 0 0 60px
     height: auto
@@ -180,7 +166,8 @@
     border-bottom: 1px solid darken(white, 20%)
 
   .list
-    display: block
+    display: contents
+    flex-basis: auto
     width: 100%
     border-left: 0px
     &:first-child
@@ -214,7 +201,6 @@
     display: flex
     align-items: center
     .list-header-left-icon
-      display: inline
       padding: 7px
       padding-right: 27px
       margin-top: 1px
@@ -237,6 +223,30 @@
       right: 10px
       font-size: 24px
 
+  .list-header
+    display: grid
+    grid-template-columns: 30px 5fr 1fr
+    .list-header-left-icon
+      display: grid
+      grid-row: 1/3
+      grid-column: 1
+    .list-header-name
+      grid-row: 1
+      grid-column: 2
+      align-self: end
+    .cardCount
+      grid-row: 2
+      grid-column: 2
+      align-self: start
+    .list-header-menu
+      grid-row: 1/3
+      grid-column: 3
+    .inlined-form
+      grid-row: 1/3
+      grid-column: 1/4
+    .edit-controls
+      align-items: initial
+
 .link-board-wrapper
   display: flex
   align-items: baseline

client/components/lists/listBody.jade

@@ -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
@@ -47,6 +53,7 @@ template(name="addCardForm")
 
   .add-controls.clearfix
     button.primary.confirm(type="submit") {{_ 'add'}}
+    a.fa.fa-times-thin.js-close-inlined-form
     unless currentBoard.isTemplatesBoard
       unless currentBoard.isTemplateBoard
         span.quiet

client/components/lists/listBody.js

@@ -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();
     }
   },
 
@@ -138,6 +148,10 @@ BlazeComponent.extendComponent({
       // If the card is already selected, we want to de-select it.
       // XXX We should probably modify the minicard href attribute instead of
       // overwriting the event in case the card is already selected.
+    } else if (Utils.isMiniScreen()) {
+      evt.preventDefault();
+      Session.set('popupCardId', this.currentData()._id);
+      this.cardDetailsPopup(evt);
     } else if (Session.equals('currentCard', this.currentData()._id)) {
       evt.stopImmediatePropagation();
       evt.preventDefault();
@@ -168,13 +182,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,
     });
   },
@@ -203,6 +220,12 @@ BlazeComponent.extendComponent({
     );
   },
 
+  cardDetailsPopup(event) {
+    if (!Popup.isOpen()) {
+      Popup.open("cardDetails")(event);
+    }
+  },
+
   events() {
     return [
       {
@@ -238,8 +261,8 @@ BlazeComponent.extendComponent({
       Boards.findOne(currentBoardId)
         .customFields()
         .fetch(),
-      function(field) {
-        if (field.automaticallyOnCard)
+      function (field) {
+        if (field.automaticallyOnCard || field.alwaysOnCard)
           arr.push({ _id: field._id, value: null });
       },
     );
@@ -254,9 +277,12 @@ BlazeComponent.extendComponent({
 
   getLabels() {
     const currentBoardId = Session.get('currentBoard');
-    return Boards.findOne(currentBoardId).labels.filter(label => {
-      return this.labels.get().indexOf(label._id) > -1;
-    });
+    if (Boards.findOne(currentBoardId).labels) {
+      return Boards.findOne(currentBoardId).labels.filter(label => {
+        return this.labels.get().indexOf(label._id) > -1;
+      });
+    }
+    return false;
   },
 
   pressKey(evt) {
@@ -310,7 +336,7 @@ BlazeComponent.extendComponent({
       [
         // User mentions
         {
-          match: /\B@([\w.]*)$/,
+          match: /\B@([\w.-]*)$/,
           search(term, callback) {
             const currentBoard = Boards.findOne(Session.get('currentBoard'));
             callback(
@@ -321,6 +347,9 @@ BlazeComponent.extendComponent({
             );
           },
           template(user) {
+            if (user.profile && user.profile.fullname) {
+              return (user.username + " (" + user.profile.fullname + ")");
+            }
             return user.username;
           },
           replace(user) {
@@ -337,6 +366,9 @@ BlazeComponent.extendComponent({
             const currentBoard = Boards.findOne(Session.get('currentBoard'));
             callback(
               $.map(currentBoard.labels, label => {
+                if (label.name == undefined) {
+                  label.name = "";
+                }
                 if (
                   label.name.indexOf(term) > -1 ||
                   label.color.indexOf(term) > -1
@@ -473,7 +505,7 @@ BlazeComponent.extendComponent({
           evt.preventDefault();
           const linkedId = $('.js-select-cards option:selected').val();
           if (!linkedId) {
-            Popup.close();
+            Popup.back();
             return;
           }
           const _id = Cards.insert({
@@ -488,7 +520,7 @@ BlazeComponent.extendComponent({
             linkedId,
           });
           Filter.addException(_id);
-          Popup.close();
+          Popup.back();
         },
         'click .js-link-board'(evt) {
           //LINK BOARD
@@ -499,7 +531,7 @@ BlazeComponent.extendComponent({
             !impBoardId ||
             Cards.findOne({ linkedId: impBoardId, archived: false })
           ) {
-            Popup.close();
+            Popup.back();
             return;
           }
           const _id = Cards.insert({
@@ -514,7 +546,7 @@ BlazeComponent.extendComponent({
             linkedId: impBoardId,
           });
           Filter.addException(_id);
-          Popup.close();
+          Popup.back();
         },
       },
     ];
@@ -546,10 +578,11 @@ BlazeComponent.extendComponent({
       this.isBoardTemplateSearch;
     let board = {};
     if (this.isTemplateSearch) {
-      board = Boards.findOne((Meteor.user().profile || {}).templatesBoardId);
+      //board = Boards.findOne((Meteor.user().profile || {}).templatesBoardId);
+      board._id = (Meteor.user().profile || {}).templatesBoardId;
     } else {
       // Prefetch first non-current board id
-      board = Boards.findOne({
+      board = Boards.find({
         archived: false,
         'members.userId': Meteor.userId(),
         _id: {
@@ -561,7 +594,7 @@ BlazeComponent.extendComponent({
       });
     }
     if (!board) {
-      Popup.close();
+      Popup.back();
       return;
     }
     const boardId = board._id;
@@ -675,21 +708,28 @@ BlazeComponent.extendComponent({
             element.type = 'swimlane';
             _id = element.copy(this.boardId);
           } else if (this.isBoardTemplateSearch) {
-            board = Boards.findOne(element.linkedId);
-            board.sort = Boards.find({ archived: false }).count();
-            board.type = 'board';
-            board.title = element.title;
-            delete board.slug;
-            _id = board.copy();
+            Meteor.call(
+              'copyBoard',
+              element.linkedId,
+              {
+                sort: Boards.find({ archived: false }).count(),
+                type: 'board',
+                title: element.title,
+              },
+              (err, data) => {
+                _id = data;
+                subManager.subscribe('board', _id, false);
+              },
+            );
           }
-          Popup.close();
+          Popup.back();
         },
       },
     ];
   },
 }).register('searchElementPopup');
 
-BlazeComponent.extendComponent({
+(class extends Spinner {
   onCreated() {
     this.cardlimit = this.parentComponent().cardlimit;
 
@@ -717,7 +757,7 @@ BlazeComponent.extendComponent({
         .parentComponent()
         .data()._id;
     }
-  },
+  }
 
   onRendered() {
     this.spinner = this.find('.sk-spinner-list');
@@ -732,21 +772,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() {
@@ -755,24 +792,33 @@ 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 spinnerViewPosition = this.spinner.offsetTop - this.container.offsetTop + this.spinner.clientHeight;
+
+    const parentViewHeight = this.container.clientHeight;
+    const bottomViewPosition = this.container.scrollTop + parentViewHeight;
+
+    return bottomViewPosition > spinnerViewPosition;
+  }
+
+  getSkSpinnerName() {
+    return "sk-spinner-" + super.getSpinnerName().toLowerCase();
+  }
+}.register('spinnerList'));

client/components/lists/listHeader.jade

@@ -15,12 +15,12 @@ template(name="listHeader")
           = title
         if wipLimit.enabled
          | (
-         span(class="{{#if reachedWipLimit}}highlight{{/if}}") {{cards.count}}
+         span(class="{{#if exceededWipLimit}}highlight{{/if}}") {{cards.count}}
          |/#{wipLimit.value})
 
-        if showCardsCountForList cards.count
-          | 
-          span(class="cardCount") {{cardsCount}} {{_ 'cards-count'}}
+      if showCardsCountForList cards.count
+        span.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-top(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
@@ -39,12 +39,12 @@ template(name="listHeader")
         div.list-header-menu
           unless currentUser.isCommentOnly
             //if isBoardAdmin
-            //  a.fa.js-list-star.list-header-plus-icon(class="fa-star{{#unless starred}}-o{{/unless}}")
+            //  a.fa.js-list-star.list-header-plus-top(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-top(title="{{_ 'add-card-to-top-of-list'}}")
+            a.fa.fa-navicon.js-open-list-menu(title="{{_ 'listActionPopup-title'}}")
           if currentUser.isBoardAdmin
-            if showDesktopDragHandles
+            if isShowDesktopDragHandles
               a.list-header-handle.handle.fa.fa-arrows.js-list-handle
 
 template(name="editListTitleForm")
@@ -55,6 +55,13 @@ template(name="editListTitleForm")
       a.fa.fa-times-thin.js-close-inlined-form
 
 template(name="listActionPopup")
+  ul.pop-over-list
+    li
+      a.js-add-card.list-header-plus-bottom
+        i.fa.fa-plus
+        i.fa.fa-arrow-down
+        | {{_ 'add-card-to-bottom-of-list'}}
+  hr
   ul.pop-over-list
     li
       a.js-toggle-watch-list

client/components/lists/listHeader.js

@@ -72,9 +72,25 @@ BlazeComponent.extendComponent({
     );
   },
 
+  exceededWipLimit() {
+    const list = Template.currentData();
+    return (
+      list.getWipLimit('enabled') &&
+      list.getWipLimit('value') < list.cards().count()
+    );
+  },
+
   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() {
@@ -85,7 +101,7 @@ BlazeComponent.extendComponent({
           this.starred(!this.starred());
         },
         'click .js-open-list-menu': Popup.open('listAction'),
-        'click .js-add-card'(event) {
+        'click .js-add-card.list-header-plus-top'(event) {
           const listDom = $(event.target).parents(
             `#js-list-${this.currentData()._id}`,
           )[0];
@@ -106,18 +122,7 @@ BlazeComponent.extendComponent({
 Template.listHeader.helpers({
   isBoardAdmin() {
     return Meteor.user().isBoardAdmin();
-  },
-
-  showDesktopDragHandles() {
-    currentUser = Meteor.user();
-    if (currentUser) {
-      return (currentUser.profile || {}).showDesktopDragHandles;
-    } else if (window.localStorage.getItem('showDesktopDragHandles')) {
-      return true;
-    } else {
-      return false;
-    }
-  },
+  }
 });
 
 Template.listActionPopup.helpers({
@@ -136,23 +141,31 @@ Template.listActionPopup.helpers({
 
 Template.listActionPopup.events({
   'click .js-list-subscribe'() {},
+  'click .js-add-card.list-header-plus-bottom'(event) {
+    const listDom = $(`#js-list-${this._id}`)[0];
+    const listComponent = BlazeComponent.getComponentForElement(listDom);
+    listComponent.openForm({
+      position: 'bottom',
+    });
+    Popup.back();
+  },
   'click .js-set-color-list': Popup.open('setListColor'),
   'click .js-select-cards'() {
     const cardIds = this.allCards().map(card => card._id);
     MultiSelection.add(cardIds);
-    Popup.close();
+    Popup.back();
   },
   'click .js-toggle-watch-list'() {
     const currentList = this;
     const level = currentList.findWatcher(Meteor.userId()) ? null : 'watching';
     Meteor.call('watch', 'list', currentList._id, level, (err, ret) => {
-      if (!err && ret) Popup.close();
+      if (!err && ret) Popup.back();
     });
   },
   'click .js-close-list'(event) {
     event.preventDefault();
     this.archive();
-    Popup.close();
+    Popup.back();
   },
   'click .js-set-wip-limit': Popup.open('setWipLimit'),
   'click .js-more': Popup.open('listMore'),
@@ -228,7 +241,7 @@ BlazeComponent.extendComponent({
 
 Template.listMorePopup.events({
   'click .js-delete': Popup.afterConfirm('listDelete', function() {
-    Popup.close();
+    Popup.back();
     // TODO how can we avoid the fetch call?
     const allCards = this.allCards().fetch();
     const allCardIds = _.pluck(allCards, '_id');
@@ -294,11 +307,11 @@ BlazeComponent.extendComponent({
         },
         'click .js-submit'() {
           this.currentList.setColor(this.currentColor.get());
-          Popup.close();
+          Popup.back();
         },
         'click .js-remove-color'() {
           this.currentList.setColor(null);
-          Popup.close();
+          Popup.back();
         },
       },
     ];

client/components/main/brokenCards.jade

@@ -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)

client/components/main/brokenCards.js

@@ -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');

client/components/main/dueCards.jade

@@ -22,33 +22,17 @@ template(name="dueCardsModalTitle")
 
 template(name="dueCards")
   if currentUser
-    if isPageReady.get
-      .wrapper
-        .due-cards-dueat-list-wrapper
-          each card in dueCardsList
-            .due-cards-card-wrapper
-              a.minicard-wrapper.card-title(href=card.absoluteUrl)
-                +minicard(card)
-              ul.due-cards-context-list
-                li.due-cards-context(title="{{_ 'board'}}")
-                  +viewer
-                    = card.getBoard.title
-                li.due-cards-context.due-cards-context-separator
-                  = ' '
-                  | {{_ 'context-separator'}}
-                  = ' '
-                li.due-cards-context(title="{{_ 'swimlane'}}")
-                  +viewer
-                    = card.getSwimlane.title
-                li.due-cards-context
-                  = ' '
-                  | {{_ 'context-separator'}}
-                  = ' '
-                li.due-cards-context(title="{{_ 'list'}}")
-                  +viewer
-                    = card.getList.title
-    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

client/components/main/dueCards.js

@@ -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() {
@@ -28,118 +38,63 @@ BlazeComponent.extendComponent({
       {
         'click .js-due-cards-view-me'() {
           Utils.setDueCardsView('me');
-          Popup.close();
+          Popup.back();
         },
 
         'click .js-due-cards-view-all'() {
           Utils.setDueCardsView('all');
-          Popup.close();
+          Popup.back();
         },
       },
     ];
   },
 }).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());
+    //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');

client/components/main/dueCards.styl

@@ -1,69 +1,4 @@
-.due-cards-board-wrapper
-  border-radius: 8px
-  //padding: 0.5rem
-  min-width: 400px
-  border-width: 8px
-  border-color: grey
-  border-style: solid
-  margin-bottom: 2rem
-  margin-right: auto
-  margin-left: auto
-
-.due-cards-board-title
-  font-size: 1.4rem
-  font-weight: bold
-  padding: 0.5rem
-  background-color: grey
-  color: white
-
-.due-cards-swimlane-title
-  font-size: 1.1rem
-  font-weight: bold
-  padding: 0.5rem
-  padding-bottom: 0.4rem
-  margin-top: 0
-  margin-bottom: 0.5rem
-  //border-top: black 1px solid
-  //border-bottom: black 1px solid
-  text-align: center
-
-.swimlane-default-color
-  background-color: lightgrey
-
-.due-cards-list-title
-  font-weight: bold
-  font-size: 1.1rem
-  //padding-bottom: 0
-  //margin-bottom: 0
-  text-align: center
-  margin-bottom: 0.7rem
-
-.due-cards-list-wrapper
-  margin: 1rem
-  border-radius: 5px
-  padding: 1.5rem
-  padding-top: 0.75rem
-  display: inline-block
-  min-width: 250px
-  max-width: 350px
-
-.due-cards-card-wrapper
-  margin-top: 0
-  margin-bottom: 10px
-
 .due-cards-dueat-list-wrapper
   max-width: 500px
   margin-right: auto
   margin-left: auto
-
-.due-cards-field-name
-  font-weight: bold
-
-.due-cards-context
-  display: inline-block
-
-.due-cards-context-separator
-  font-weight: bold
-
-.due-cards-context-list
-  margin-bottom: 0.7rem

client/components/main/editor.jade

@@ -1,4 +1,6 @@
 template(name="editor")
+  a.fa.fa-copy(title="{{_ 'copy-text-to-clipboard'}}")
+  span.copied-tooltip {{_ 'copied'}}
   textarea.editor(
     dir="auto"
     class="{{class}}"

client/components/main/editor.js

@@ -1,272 +1,315 @@
-Template.editor.onRendered(() => {
-  const textareaSelector = 'textarea';
-  const mentions = [
-    // User mentions
-    {
-      match: /\B@([\w.]*)$/,
-      search(term, callback) {
-        const currentBoard = Boards.findOne(Session.get('currentBoard'));
-        callback(
-          currentBoard
-            .activeMembers()
-            .map(member => {
-              const username = Users.findOne(member.userId).username;
-              return username.includes(term) ? username : null;
-            })
-            .filter(Boolean),
-        );
-      },
-      template(value) {
-        return value;
-      },
-      replace(username) {
-        return `@${username} `;
-      },
-      index: 1,
-    },
-  ];
-  const enableTextarea = function() {
-    const $textarea = this.$(textareaSelector);
-    autosize($textarea);
-    $textarea.escapeableTextComplete(mentions);
-  };
-  if (Meteor.settings.public.RICHER_CARD_COMMENT_EDITOR !== false) {
-    const isSmall = Utils.isMiniScreen();
-    const toolbar = isSmall
-      ? [
-          ['view', ['fullscreen']],
-          ['table', ['table']],
-          ['font', ['bold', 'underline']],
-          //['fontsize', ['fontsize']],
-          ['color', ['color']],
-        ]
-      : [
-          ['style', ['style']],
-          ['font', ['bold', 'underline', 'clear']],
-          ['fontsize', ['fontsize']],
-          ['fontname', ['fontname']],
-          ['color', ['color']],
-          ['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']],
-        ];
-    const cleanPastedHTML = function(input) {
-      const badTags = [
-        'style',
-        'script',
-        'applet',
-        'embed',
-        'noframes',
-        'noscript',
-        'meta',
-        'link',
-        'button',
-        'form',
-      ].join('|');
-      const badPatterns = new RegExp(
-        `(?:${[
-          `<(${badTags})s*[^>][\\s\\S]*?<\\/\\1>`,
-          `<(${badTags})[^>]*?\\/>`,
-        ].join('|')})`,
-        'gi',
-      );
-      let output = input;
-      // remove bad Tags
-      output = output.replace(badPatterns, '');
-      // remove attributes ' style="..."'
-      const badAttributes = new RegExp(
-        `(?:${[
-          'on\\S+=([\'"]?).*?\\1',
-          'href=([\'"]?)javascript:.*?\\2',
-          'style=([\'"]?).*?\\3',
-          'target=\\S+',
-        ].join('|')})`,
-        'gi',
-      );
-      output = output.replace(badAttributes, '');
-      output = output.replace(/(<a )/gi, '$1target=_ '); // always to new target
-      return output;
-    };
-    const editor = '.editor';
-    const selectors = [
-      `.js-new-description-form ${editor}`,
-      `.js-new-comment-form ${editor}`,
-      `.js-edit-comment ${editor}`,
-    ].join(','); // only new comment and edit comment
-    const inputs = $(selectors);
-    if (inputs.length === 0) {
-      // only enable richereditor to new comment or edit comment no others
-      enableTextarea();
-    } else {
-      const placeholder = inputs.attr('placeholder') || '';
-      const mSummernotes = [];
-      const getSummernote = function(input) {
-        const idx = inputs.index(input);
-        if (idx > -1) {
-          return mSummernotes[idx];
-        }
-        return undefined;
-      };
-      inputs.each(function(idx, input) {
-        mSummernotes[idx] = $(input).summernote({
-          placeholder,
-          callbacks: {
-            onInit(object) {
-              const originalInput = this;
-              $(originalInput).on('submitted', function() {
-                // when comment is submitted, the original textarea will be set to '', so shall we
-                if (!this.value) {
-                  const sn = getSummernote(this);
-                  sn && sn.summernote('code', '');
-                }
-              });
-              const jEditor = object && object.editable;
-              const toolbar = object && object.toolbar;
-              if (jEditor !== undefined) {
-                jEditor.escapeableTextComplete(mentions);
-              }
-              if (toolbar !== undefined) {
-                const fBtn = toolbar.find('.btn-fullscreen');
-                fBtn.on('click', function() {
-                  const $this = $(this),
-                    isActive = $this.hasClass('active');
-                  $('.minicards,#header-quick-access').toggle(!isActive); // mini card is still showing when editor is in fullscreen mode, we hide here manually
-                });
-              }
-            },
+const specialHandles = [
+  {userId: 'board_members', username: 'board_members'},
+  {userId: 'card_members', username: 'card_members'}
+];
+const specialHandleNames = specialHandles.map(m => m.username);
 
-            onImageUpload(files) {
-              const $summernote = getSummernote(this);
-              if (files && files.length > 0) {
-                const image = files[0];
-                const currentCard = Cards.findOne(Session.get('currentCard'));
-                const MAX_IMAGE_PIXEL = Utils.MAX_IMAGE_PIXEL;
-                const COMPRESS_RATIO = Utils.IMAGE_COMPRESS_RATIO;
-                const insertImage = src => {
-                  const img = document.createElement('img');
-                  img.src = src;
-                  img.setAttribute('width', '100%');
-                  $summernote.summernote('insertNode', img);
-                };
-                const processData = function(fileObj) {
-                  Utils.processUploadedAttachment(
-                    currentCard,
-                    fileObj,
-                    attachment => {
-                      if (
-                        attachment &&
-                        attachment._id &&
-                        attachment.isImage()
-                      ) {
-                        attachment.one('uploaded', function() {
-                          const maxTry = 3;
-                          const checkItvl = 500;
-                          let retry = 0;
-                          const checkUrl = function() {
-                            // even though uploaded event fired, attachment.url() is still null somehow //TODO
-                            const url = attachment.url();
-                            if (url) {
-                              insertImage(
-                                `${location.protocol}//${location.host}${url}`,
-                              );
-                            } else {
-                              retry++;
-                              if (retry < maxTry) {
-                                setTimeout(checkUrl, checkItvl);
+
+BlazeComponent.extendComponent({
+  onRendered() {
+    const textareaSelector = 'textarea';
+    const mentions = [
+      // User mentions
+      {
+        match: /\B@([\w.-]*)$/,
+        search(term, callback) {
+          const currentBoard = Boards.findOne(Session.get('currentBoard'));
+          callback(
+            _.union(
+            currentBoard
+              .activeMembers()
+              .map(member => {
+                const user = Users.findOne(member.userId);
+                const username = user.username;
+                const fullName = user.profile && user.profile !== undefined && user.profile.fullname ? user.profile.fullname : "";
+                return username.includes(term) || fullName.includes(term) ? user : null;
+              })
+              .filter(Boolean), [...specialHandles])
+          );
+        },
+        template(user) {
+          if (user.profile && user.profile.fullname) {
+            return (user.profile.fullname + " (" + user.username + ")");
+          }
+          return user.username;
+        },
+        replace(user) {
+          if (user.profile && user.profile.fullname) {
+            return `@${user.username} (${user.profile.fullname}) `;
+          }
+          return `@${user.username} `;
+        },
+        index: 1,
+      },
+    ];
+    const enableTextarea = function() {
+      const $textarea = this.$(textareaSelector);
+      autosize($textarea);
+      $textarea.escapeableTextComplete(mentions);
+    };
+    if (Meteor.settings.public.RICHER_CARD_COMMENT_EDITOR !== false) {
+      const isSmall = Utils.isMiniScreen();
+      const toolbar = isSmall
+        ? [
+            ['view', ['fullscreen']],
+            ['table', ['table']],
+            ['font', ['bold', 'underline']],
+            //['fontsize', ['fontsize']],
+            ['color', ['color']],
+          ]
+        : [
+            ['style', ['style']],
+            ['font', ['bold', 'underline', 'clear']],
+            ['fontsize', ['fontsize']],
+            ['fontname', ['fontname']],
+            ['color', ['color']],
+            ['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', 'codeview', 'help']],
+          ];
+      const cleanPastedHTML = function(input) {
+        const badTags = [
+          'style',
+          'script',
+          'applet',
+          'embed',
+          'noframes',
+          'noscript',
+          'meta',
+          'link',
+          'button',
+          'form',
+        ].join('|');
+        const badPatterns = new RegExp(
+          `(?:${[
+            `<(${badTags})s*[^>][\\s\\S]*?<\\/\\1>`,
+            `<(${badTags})[^>]*?\\/>`,
+          ].join('|')})`,
+          'gi',
+        );
+        let output = input;
+        // remove bad Tags
+        output = output.replace(badPatterns, '');
+        // remove attributes ' style="..."'
+        const badAttributes = new RegExp(
+          `(?:${[
+            'on\\S+=([\'"]?).*?\\1',
+            'href=([\'"]?)javascript:.*?\\2',
+            'style=([\'"]?).*?\\3',
+            'target=\\S+',
+          ].join('|')})`,
+          'gi',
+        );
+        output = output.replace(badAttributes, '');
+        output = output.replace(/(<a )/gi, '$1target=_ '); // always to new target
+        return output;
+      };
+      const editor = '.editor';
+      const selectors = [
+        `.js-new-description-form ${editor}`,
+        `.js-new-comment-form ${editor}`,
+        `.js-edit-comment ${editor}`,
+      ].join(','); // only new comment and edit comment
+      const inputs = $(selectors);
+      if (inputs.length === 0) {
+        // only enable richereditor to new comment or edit comment no others
+        enableTextarea();
+      } else {
+        const placeholder = inputs.attr('placeholder') || '';
+        const mSummernotes = [];
+        const getSummernote = function(input) {
+          const idx = inputs.index(input);
+          if (idx > -1) {
+            return mSummernotes[idx];
+          }
+          return undefined;
+        };
+        inputs.each(function(idx, input) {
+          mSummernotes[idx] = $(input).summernote({
+            placeholder,
+            callbacks: {
+              onInit(object) {
+                const originalInput = this;
+                $(originalInput).on('submitted', function() {
+                  // when comment is submitted, the original textarea will be set to '', so shall we
+                  if (!this.value) {
+                    const sn = getSummernote(this);
+                    sn && sn.summernote('code', '');
+                  }
+                });
+                const jEditor = object && object.editable;
+                const toolbar = object && object.toolbar;
+                if (jEditor !== undefined) {
+                  jEditor.escapeableTextComplete(mentions);
+                }
+                if (toolbar !== undefined) {
+                  const fBtn = toolbar.find('.btn-fullscreen');
+                  fBtn.on('click', function() {
+                    const $this = $(this),
+                      isActive = $this.hasClass('active');
+                    $('.minicards,#header-quick-access').toggle(!isActive); // mini card is still showing when editor is in fullscreen mode, we hide here manually
+                  });
+                }
+              },
+
+              onImageUpload(files) {
+                const $summernote = getSummernote(this);
+                if (files && files.length > 0) {
+                  const image = files[0];
+                  const currentCard = Utils.getCurrentCard();
+                  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%');
+                    $summernote.summernote('insertNode', img);
+                  };
+                  const processData = function(fileObj) {
+                    Utils.processUploadedAttachment(
+                      currentCard,
+                      fileObj,
+                      attachment => {
+                        if (
+                          attachment &&
+                          attachment._id &&
+                          attachment.isImage()
+                        ) {
+                          attachment.one('uploaded', function() {
+                            const maxTry = 3;
+                            const checkItvl = 500;
+                            let retry = 0;
+                            const checkUrl = function() {
+                              // even though uploaded event fired, attachment.url() is still null somehow //TODO
+                              const url = attachment.url();
+                              if (url) {
+                                insertImage(
+                                  `${location.protocol}//${location.host}${url}`,
+                                );
+                              } else {
+                                retry++;
+                                if (retry < maxTry) {
+                                  setTimeout(checkUrl, checkItvl);
+                                }
                               }
+                            };
+                            checkUrl();
+                          });
+                        }
+                      },
+                    );
+                  };
+                  if (MAX_IMAGE_PIXEL) {
+                    const reader = new FileReader();
+                    reader.onload = function(e) {
+                      const dataurl = e && e.target && e.target.result;
+                      if (dataurl !== undefined) {
+                        // need to shrink image
+                        Utils.shrinkImage({
+                          dataurl,
+                          maxSize: MAX_IMAGE_PIXEL,
+                          ratio: COMPRESS_RATIO,
+                          toBlob: true,
+                          callback(blob) {
+                            if (blob !== false) {
+                              blob.name = image.name;
+                              processData(blob);
                             }
-                          };
-                          checkUrl();
+                          },
                         });
                       }
-                    },
-                  );
-                };
-                if (MAX_IMAGE_PIXEL) {
-                  const reader = new FileReader();
-                  reader.onload = function(e) {
-                    const dataurl = e && e.target && e.target.result;
-                    if (dataurl !== undefined) {
-                      // need to shrink image
-                      Utils.shrinkImage({
-                        dataurl,
-                        maxSize: MAX_IMAGE_PIXEL,
-                        ratio: COMPRESS_RATIO,
-                        toBlob: true,
-                        callback(blob) {
-                          if (blob !== false) {
-                            blob.name = image.name;
-                            processData(blob);
-                          }
-                        },
-                      });
-                    }
-                  };
-                  reader.readAsDataURL(image);
-                } else {
-                  processData(image);
+                    };
+                    reader.readAsDataURL(image);
+                  } else {
+                    processData(image);
+                  }
                 }
-              }
-            },
-            onPaste() {
-              // clear up unwanted tag info when user pasted in text
-              const thisNote = this;
-              const updatePastedText = function(object) {
-                const someNote = getSummernote(object);
-                // Fix Pasting text into a card is adding a line before and after
-                // (and multiplies by pasting more) by changing paste "p" to "br".
-                // Fixes https://github.com/wekan/wekan/2890 .
-                // == Fix Start ==
-                someNote.execCommand('defaultParagraphSeparator', false, 'br');
-                // == Fix End ==
-                const original = someNote.summernote('code');
-                const cleaned = cleanPastedHTML(original); //this is where to call whatever clean function you want. I have mine in a different file, called CleanPastedHTML.
-                someNote.summernote('code', ''); //clear original
-                someNote.summernote('pasteHTML', cleaned); //this sets the displayed content editor to the cleaned pasted code.
-              };
-              setTimeout(function() {
-                //this kinda sucks, but if you don't do a setTimeout,
-                //the function is called before the text is really pasted.
-                updatePastedText(thisNote);
-              }, 10);
-            },
-          },
-          dialogsInBody: true,
-          disableDragAndDrop: true,
-          toolbar,
-          popover: {
-            image: [
-              [
-                'image',
-                ['resizeFull', 'resizeHalf', 'resizeQuarter', 'resizeNone'],
-              ],
-              ['float', ['floatLeft', 'floatRight', 'floatNone']],
-              ['remove', ['removeMedia']],
-            ],
-            table: [
-              ['add', ['addRowDown', 'addRowUp', 'addColLeft', 'addColRight']],
-              ['delete', ['deleteRow', 'deleteCol', 'deleteTable']],
-            ],
-            air: [
-              ['color', ['color']],
-              ['font', ['bold', 'underline', 'clear']],
-            ],
-          },
-          height: 200,
-        });
-      });
-    }
-  } else {
-    enableTextarea();
-  }
-});
+              },
+              onPaste(e) {
+                var clipboardData = e.clipboardData;
+                var pastedData = clipboardData.getData('Text');
 
-import sanitizeXss from 'xss';
+                //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) {
+                  const someNote = getSummernote(object);
+                  // Fix Pasting text into a card is adding a line before and after
+                  // (and multiplies by pasting more) by changing paste "p" to "br".
+                  // Fixes https://github.com/wekan/wekan/2890 .
+                  // == Fix Start ==
+                  someNote.execCommand('defaultParagraphSeparator', false, 'br');
+                  // == Fix End ==
+                  const original = someNote.summernote('code');
+                  const cleaned = cleanPastedHTML(original); //this is where to call whatever clean function you want. I have mine in a different file, called CleanPastedHTML.
+                  someNote.summernote('code', ''); //clear original
+                  someNote.summernote('pasteHTML', cleaned); //this sets the displayed content editor to the cleaned pasted code.
+                };
+                setTimeout(function() {
+                  //this kinda sucks, but if you don't do a setTimeout,
+                  //the function is called before the text is really pasted.
+                  updatePastedText(thisNote);
+                }, 10);
+              },
+            },
+            dialogsInBody: true,
+            spellCheck: true,
+            disableGrammar: false,
+            disableDragAndDrop: false,
+            toolbar,
+            popover: {
+              image: [
+                ['imagesize', ['imageSize100', 'imageSize50', 'imageSize25']],
+                ['float', ['floatLeft', 'floatRight', 'floatNone']],
+                ['remove', ['removeMedia']],
+              ],
+              link: [['link', ['linkDialogShow', 'unlink']]],
+              table: [
+                ['add', ['addRowDown', 'addRowUp', 'addColLeft', 'addColRight']],
+                ['delete', ['deleteRow', 'deleteCol', 'deleteTable']],
+              ],
+              air: [
+                ['color', ['color']],
+                ['font', ['bold', 'underline', 'clear']],
+              ],
+            },
+            height: 200,
+          });
+        });
+      }
+    } else {
+      enableTextarea();
+    }
+  },
+  events() {
+    return [
+      {
+        'click a.fa.fa-copy'(event) {
+          const $editor = this.$('textarea.editor');
+          const promise = Utils.copyTextToClipboard($editor[0].value);
+
+          const $tooltip = this.$('.copied-tooltip');
+          Utils.showCopied(promise, $tooltip);
+        },
+      }
+    ]
+  }
+}).register('editor');
+
+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
@@ -278,6 +321,8 @@ function mySafeAttrValue(tag, name, value, cssFilter) {
       /^aodroplink:/gi.test(value) ||
       /^onenote:/gi.test(value) ||
       /^file:/gi.test(value) ||
+      /^abasurl:/gi.test(value) ||
+      /^conisio:/gi.test(value) ||
       /^mailspring:/gi.test(value)
     ) {
       return value;
@@ -290,6 +335,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
@@ -305,15 +351,17 @@ 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;
-    });
-    const mentionRegex = /\B@([\w.]*)/gi;
+    }), [...specialHandles]);
+    const mentionRegex = /\B@([\w.-]*)/gi;
 
     let currentMention;
     while ((currentMention = mentionRegex.exec(content)) !== null) {
@@ -349,7 +397,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 }),
+    );
   }),
 );
 

client/components/main/editor.styl

@@ -0,0 +1,7 @@
+.new-comment,
+.inlined-form
+  a.fa.fa-copy
+    float: right
+    position: relative
+    top: 20px
+    right: 6px

client/components/main/globalSearch.jade

@@ -10,73 +10,95 @@ 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
-        input.global-search-query-input(type="text" name="searchQuery" placeholder="{{_ 'search-example'}}" autofocus dir="auto")
+      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"
+          placeholder="{{_ 'search-example'}}"
+          value="{{ query.get }}"
+          autofocus dir="auto"
+        )
+        a.js-new-search.fa.fa-eraser
+      if debug.get.show
+        h1 Debug
+        if debug.get.showSelector
+          h2 Selector
+            button.js-copy-debug-selector
+              = 'Copy'
+          pre(
+            id="debug-selector"
+          )
+            = sessionData.selector
+        if debug.get.showProjection
+          h2 Projection
+            button.js-copy-debug-projection
+              = 'Copy'
+          pre(
+            id="debug-projection"
+          )
+            = sessionData.projection
       if searching.get
         +spinner
       else if hasResults.get
-        .global-search-dueat-list-wrapper
-          h1
-            if $eq resultsCount.get 0
-              | {{_ 'no-cards-found' }}
-            else if $eq resultsCount.get 1
-              | {{_ 'one-card-found' }}
-            else if $eq resultsCount.get totalHits.get
-              | {{_ 'n-cards-found' resultsCount.get }}
-            else
-              | {{_ 'n-n-of-n-cards-found' 1 resultsCount.get totalHits.get }}
-          if queryErrors.get
-            div
+        .global-search-results-list-wrapper
+          if hasQueryErrors.get
+            ul
               each msg in errorMessages
-                span.global-search-error-messages
-                  | {{_ msg.tag msg.value }}
-          each card in results
-            +resultCard(card)
+                li.global-search-error-messages
+                  = msg
+          +resultsPaged(this)
+      else if serverError.get
+        .global-search-page
+          .global-search-help
+            h1 {{_ 'server-error' }}
+            +viewer
+              | {{_ 'server-error-troubleshooting' }}
       else
-        .global-search-instructions
-          h1 Search Operators
-          +viewer
-            = 'Searches can include operators to refine the search.  Operators are specified by writing the operator'
-            = 'name and value separated by a colon.  For example, an operator specification of `list:Blocked` would limit the search'
-            = 'to cards that are contained in a list named *Blocked*.  If the value contains spaces or special characters'
-            = 'it must be enclosed in quotation marks (e.g. `list:"To Review"`).\n'
-            = 'Available operators are:\n'
-            = '* `board:title` - cards in boards matching the specified title\n'
-            = '* `list:title` - cards in lists matching the specified title\n'
-            = '* `swimlane:title` - cards in swimlanes matching the specified title\n'
-            = '* `label:color` - cards that have a label matching the given color\n'
-            = '* `label:name` - cards that have a label matching the given name\n'
-            = '* `user:username` - cards where the specified user is a member or assignee\n'
-            = '* `@username` - shorthand for `user:username`\n'
-            = '* `#label` - shorthand for `label:color-or-name`\n'
-            = '## Notes\n'
-            = '*  Multiple operators may be specified.\n'
-            = '*  Similar operators are *OR*ed together.  Cards that match any of the conditions will be returned.\n'
-            = '    `list:Available list:Blocked` would return cards contained in any list named *Blocked* or *Available*.\n'
-            = '*  Differing operators are *AND*ed together.  Only cards that match all of the differing operators are returned.\n'
-            = '`list:Available label:red` returns only cards in the list *Available* with a *red* label.\n'
-            = '* Text searches are case insensitive.\n'
-
-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
+        .global-search-page
+          .global-search-help
+            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' }}
+              .lists-wrapper
+                each name in myLabelNames.get
+                  span.card-label.list-title.js-label-name
+                    = name
+          .global-search-instructions
+            +viewer
+              = searchInstructions

client/components/main/globalSearch.js

@@ -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,186 +20,279 @@ 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.isPageReady = new ReactiveVar(true);
-    this.searching = new ReactiveVar(false);
-    this.hasResults = new ReactiveVar(false);
-    this.query = new ReactiveVar('');
+    super.onCreated();
+    this.myLists = new ReactiveVar([]);
+    this.myLabelNames = new ReactiveVar([]);
+    this.myBoardNames = new ReactiveVar([]);
+    this.parsingErrors = new QueryErrors();
     this.queryParams = null;
-    this.resultsCount = new ReactiveVar(0);
-    this.totalHits = new ReactiveVar(0);
-    this.queryErrors = new ReactiveVar(null);
-    Meteor.subscribe('setting');
-  },
 
-  results() {
-    if (this.queryParams) {
-      const results = Cards.globalSearch(this.queryParams);
-      // eslint-disable-next-line no-console
-      // console.log('user:', Meteor.user());
-      // eslint-disable-next-line no-console
-      // console.log('user:', Meteor.user().sessionData);
-      // console.log('errors:', results.errors);
-      this.totalHits.set(Meteor.user().sessionData.totalHits);
-      this.resultsCount.set(results.cards.count());
-      this.queryErrors.set(results.errors);
-      return results.cards;
+    Meteor.call('myLists', (err, data) => {
+      if (!err) {
+        this.myLists.set(data);
+      }
+    });
+
+    Meteor.call('myLabelNames', (err, data) => {
+      if (!err) {
+        this.myLabelNames.set(data);
+      }
+    });
+
+    Meteor.call('myBoardNames', (err, data) => {
+      if (!err) {
+        this.myBoardNames.set(data);
+      }
+    });
+  }
+
+  onRendered() {
+    Meteor.subscribe('setting');
+
+    // eslint-disable-next-line no-console
+    //console.log('lang:', TAPi18n.getLanguage());
+
+    if (Session.get('globalQuery')) {
+      this.searchAllBoards(Session.get('globalQuery'));
     }
-    this.resultsCount.set(0);
-    return [];
-  },
+  }
+
+  resetSearch() {
+    super.resetSearch();
+    this.parsingErrors = new QueryErrors();
+  }
 
   errorMessages() {
-    const errors = this.queryErrors.get();
-    const messages = [];
+    if (this.parsingErrors.hasErrors()) {
+      return this.parsingErrors.errorMessages();
+    }
+    return this.queryErrorMessages();
+  }
 
-    errors.notFound.boards.forEach(board => {
-      messages.push({ tag: 'board-title-not-found', value: board });
-    });
-    errors.notFound.swimlanes.forEach(swim => {
-      messages.push({ tag: 'swimlane-title-not-found', value: swim });
-    });
-    errors.notFound.lists.forEach(list => {
-      messages.push({ tag: 'list-title-not-found', value: list });
-    });
-    errors.notFound.users.forEach(user => {
-      messages.push({ tag: 'user-username-not-found', value: user });
-    });
+  parsingErrorMessages() {
+    this.parsingErrors.errorMessages();
+  }
 
-    return messages;
-  },
+  searchAllBoards(queryText) {
+    queryText = queryText.trim();
+    // eslint-disable-next-line no-console
+    //console.log('queryText:', queryText);
+
+    this.query.set(queryText);
+
+    this.resetSearch();
+
+    if (!queryText) {
+      return;
+    }
+
+    this.searching.set(true);
+
+    const query = new Query();
+    query.buildParams(queryText);
+
+    // eslint-disable-next-line no-console
+    // console.log('params:', query.getParams());
+
+    this.queryParams = query.getQueryParams().getParams();
+
+    if (query.hasErrors()) {
+      this.searching.set(false);
+      this.queryErrors = query.errors();
+      this.hasResults.set(true);
+      this.hasQueryErrors.set(true);
+      return;
+    }
+
+    this.runGlobalSearch(query.getQueryParams());
+  }
+
+  searchInstructions() {
+    const tags = {
+      operator_board: TAPi18n.__('operator-board'),
+      operator_list: TAPi18n.__('operator-list'),
+      operator_swimlane: TAPi18n.__('operator-swimlane'),
+      operator_comment: TAPi18n.__('operator-comment'),
+      operator_label: TAPi18n.__('operator-label'),
+      operator_label_abbrev: TAPi18n.__('operator-label-abbrev'),
+      operator_user: TAPi18n.__('operator-user'),
+      operator_user_abbrev: TAPi18n.__('operator-user-abbrev'),
+      operator_member: TAPi18n.__('operator-member'),
+      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'),
+      operator_debug: TAPi18n.__('operator-debug'),
+      operator_org: TAPi18n.__('operator-org'),
+      operator_team: TAPi18n.__('operator-team'),
+      predicate_overdue: TAPi18n.__('predicate-overdue'),
+      predicate_archived: TAPi18n.__('predicate-archived'),
+      predicate_all: TAPi18n.__('predicate-all'),
+      predicate_ended: TAPi18n.__('predicate-ended'),
+      predicate_week: TAPi18n.__('predicate-week'),
+      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'),
+      predicate_selector: TAPi18n.__('predicate-selector'),
+      predicate_projection: TAPi18n.__('predicate-projection'),
+    };
+
+    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-org'],
+      ['\n- ', 'globalSearch-instructions-operator-team'],
+      ['\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(
+      color => {
+        return { color, name: TAPi18n.__(`color-${color}`) };
+      },
+    );
+  }
 
   events() {
-    return [
+    return super.events().concat([
       {
         'submit .js-search-query-form'(evt) {
           evt.preventDefault();
-          this.query.set(evt.target.searchQuery.value);
-          this.queryErrors.set(null);
+          this.searchAllBoards(evt.target.searchQuery.value);
+        },
+        'click .js-label-color'(evt) {
+          evt.preventDefault();
+          const input = document.getElementById('global-search-input');
+          this.query.set(
+            `${input.value} ${TAPi18n.__('operator-label')}:"${
+              evt.currentTarget.textContent
+            }"`,
+          );
+          document.getElementById('global-search-input').focus();
+        },
+        'click .js-copy-debug-selector'(evt) {
+          /* Get the text field */
+          const selector = document.getElementById("debug-selector");
 
-          if (!this.query.get()) {
-            this.searching.set(false);
-            this.hasResults.set(false);
-            return;
+          try {
+            navigator.clipboard.writeText(selector.textContent);
+            alert("Selector copied to clipboard");
+          } catch(err) {
+            alert("Error copying text: " + err);
           }
 
-          this.searching.set(true);
+        },
+        'click .js-copy-debug-projection'(evt) {
+          /* Get the text field */
+          const projection = document.getElementById("debug-projection");
+
+          try {
+            navigator.clipboard.writeText(projection.textContent);
+            alert("Projection copied to clipboard");
+          } catch(err) {
+            alert("Error copying text: " + err);
+          }
+
+        },
+        'click .js-board-title'(evt) {
+          evt.preventDefault();
+          const input = document.getElementById('global-search-input');
+          this.query.set(
+            `${input.value} ${TAPi18n.__('operator-board')}:"${
+              evt.currentTarget.textContent
+            }"`,
+          );
+          document.getElementById('global-search-input').focus();
+        },
+        'click .js-list-title'(evt) {
+          evt.preventDefault();
+          const input = document.getElementById('global-search-input');
+          this.query.set(
+            `${input.value} ${TAPi18n.__('operator-list')}:"${
+              evt.currentTarget.textContent
+            }"`,
+          );
+          document.getElementById('global-search-input').focus();
+        },
+        'click .js-label-name'(evt) {
+          evt.preventDefault();
+          const input = document.getElementById('global-search-input');
+          this.query.set(
+            `${input.value} ${TAPi18n.__('operator-label')}:"${
+              evt.currentTarget.textContent
+            }"`,
+          );
+          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);
-
-          let query = this.query.get();
-          // eslint-disable-next-line no-console
-          // console.log('query:', query);
-
-          const reOperator1 = /^((?<operator>\w+):|(?<abbrev>[#@]))(?<value>\w+)(\s+|$)/;
-          const reOperator2 = /^((?<operator>\w+):|(?<abbrev>[#@]))(?<quote>["']*)(?<value>.*?)\k<quote>(\s+|$)/;
-          const reText = /^(?<text>\S+)(\s+|$)/;
-          const reQuotedText = /^(?<quote>["'])(?<text>\w+)\k<quote>(\s+|$)/;
-
-          const operatorMap = {};
-          operatorMap[TAPi18n.__('operator-board')] = 'boards';
-          operatorMap[TAPi18n.__('operator-board-abbrev')] = 'boards';
-          operatorMap[TAPi18n.__('operator-swimlane')] = 'swimlanes';
-          operatorMap[TAPi18n.__('operator-swimlane-abbrev')] = 'swimlanes';
-          operatorMap[TAPi18n.__('operator-list')] = 'lists';
-          operatorMap[TAPi18n.__('operator-list-abbrev')] = 'lists';
-          operatorMap[TAPi18n.__('operator-label')] = 'labels';
-          operatorMap[TAPi18n.__('operator-label-abbrev')] = 'labels';
-          operatorMap[TAPi18n.__('operator-user')] = 'users';
-          operatorMap[TAPi18n.__('operator-user-abbrev')] = 'users';
-          operatorMap[TAPi18n.__('operator-is')] = 'is';
-
-          // eslint-disable-next-line no-console
-          // console.log('operatorMap:', operatorMap);
-          const params = {
-            boards: [],
-            swimlanes: [],
-            lists: [],
-            users: [],
-            labels: [],
-            is: [],
-          };
-
-          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;
-              }
-              if (op in operatorMap) {
-                params[operatorMap[op]].push(m.groups.value);
-              }
-              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;
-            }
-          }
-
-          // eslint-disable-next-line no-console
-          // console.log('text:', text);
-          params.text = text;
-
-          // eslint-disable-next-line no-console
-          // console.log('params:', params);
-
-          this.queryParams = params;
-
-          this.autorun(() => {
-            const handle = subManager.subscribe('globalSearch', params);
-            Tracker.nonreactive(() => {
-              Tracker.autorun(() => {
-                // eslint-disable-next-line no-console
-                // console.log('ready:', handle.ready());
-                if (handle.ready()) {
-                  this.searching.set(false);
-                  this.hasResults.set(true);
-                }
-              });
-            });
-          });
         },
       },
-    ];
-  },
-}).register('globalSearch');
+    ]);
+  }
+}
+
+GlobalSearchComponent.register('globalSearch');

client/components/main/globalSearch.styl

@@ -51,7 +51,7 @@
   margin-top: 0
   margin-bottom: 10px
 
-.global-search-dueat-list-wrapper
+.global-search-results-list-wrapper
   max-width: 500px
   margin-right: auto
   margin-left: auto
@@ -71,13 +71,19 @@
 .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-page h1
+  margin-top: 2rem;
+
+.global-search-page h2
+  margin-top: 1rem;
+
 .global-search-query-input
   width: 90% !important
   margin-right: auto
@@ -91,7 +97,25 @@
   font-style: italic
 
 code
-  color: white
-  background-color: grey
+  color: black
+  background-color: lightgrey
   padding: 0.1rem !important
-  font-size: 0.7rem !important
+  font-size: 0.8rem !important
+
+.list-title
+  background-color: darkgray
+
+.global-search-footer
+  border: none
+  width: 100%
+
+.global-search-next-page
+  border: none
+  text-align: right;
+
+.global-search-previous-page
+  border: none
+  text-align: left;
+
+.global-search-instructions li
+  margin-bottom: 0.3rem

client/components/main/header.jade

@@ -7,16 +7,23 @@ template(name="header")
   if currentUser
     #header-quick-access(class=currentBoard.colorClass)
       if isMiniScreen
-        ul
-          li
-            a(href="{{pathFor 'home'}}")
-              span.fa.fa-home
+        span
+          a(href="{{pathFor 'home'}}")
+            span.fa.fa-home
 
+        ul.header-quick-access-list
           if currentList
             each currentBoard.lists
               li(class="{{#if $.Session.equals 'currentList' _id}}current{{/if}}")
                 a.js-select-list
-                  = title
+                  +viewer
+                    = title
+          else
+            each currentUser.starredBoards
+              li(class="{{#if $.Session.equals 'currentBoard' _id}}current{{/if}}")
+                a(href="{{pathFor 'board' id=_id slug=slug}}")
+                  +viewer
+                    = title
         #header-new-board-icon
       else
         //-
@@ -26,29 +33,29 @@ 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="")
-        ul
-          li
-            a(href="{{pathFor 'home'}}")
-              span.fa.fa-home
-              | {{_ 'all-boards'}}
-          li.separator -
+            div#headerIsSettingDatabaseCallDone
+              img(src="{{pathFor '/logo-header.png'}}" alt="{{currentSetting.productName}}" title="{{currentSetting.productName}}")
+        span.allBoards
+          a(href="{{pathFor 'home'}}")
+            span.fa.fa-home
+            | {{_ 'all-boards'}}
+        ul.header-quick-access-list
           //li
           //  a(href="{{pathFor 'public'}}")
           //    span.fa.fa-globe
           //    | {{_ 'public'}}
           each currentUser.starredBoards
-            li.separator -
             li(class="{{#if $.Session.equals 'currentBoard' _id}}current{{/if}}")
               a(href="{{pathFor 'board' id=_id slug=slug}}")
-                = title
+                +viewer
+                  = 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.
@@ -87,3 +94,5 @@ template(name="offlineWarning")
     p
       i.fa.fa-warning
       | {{_ 'app-is-offline'}}
+
+      a.app-try-reconnect {{_ 'app-try-reconnect'}}

client/components/main/header.js

@@ -1,7 +1,24 @@
 Meteor.subscribe('user-admin');
 Meteor.subscribe('boards');
 Meteor.subscribe('setting');
+Meteor.subscribe('announcements');
+Template.header.onCreated(function(){
+  const templateInstance = this;
+  templateInstance.currentSetting = new ReactiveVar();
+  templateInstance.isLoading = new ReactiveVar(false);
 
+  Meteor.subscribe('setting', {
+    onReady() {
+      templateInstance.currentSetting.set(Settings.findOne());
+      let currSetting = templateInstance.currentSetting.curValue;
+      if(currSetting && currSetting !== undefined && currSetting.customLoginLogoImageUrl !== undefined && document.getElementById("headerIsSettingDatabaseCallDone") != null)
+        document.getElementById("headerIsSettingDatabaseCallDone").style.display = 'none';
+      else if(document.getElementById("headerIsSettingDatabaseCallDone") != null)
+        document.getElementById("headerIsSettingDatabaseCallDone").style.display = 'block';
+      return this.stop();
+    },
+  });
+});
 Template.header.helpers({
   wrappedHeader() {
     return !Session.get('currentBoard');
@@ -41,3 +58,10 @@ Template.header.events({
     Session.set('currentCard', null);
   },
 });
+
+Template.offlineWarning.events({
+  'click a.app-try-reconnect'(event) {
+    event.preventDefault();
+    Meteor.reconnect();
+  },
+});

client/components/main/header.styl

@@ -99,7 +99,11 @@
   height: 28px
   font-size: 12px
   display: flex
-  z-index: 21
+  z-index: 1000
+  padding: 10px 0px
+
+  .allBoards
+      padding: 0 0 0 10px
 
   #header-user-bar,
   #header-new-board-icon,
@@ -112,21 +116,39 @@
     a:hover, a.is-active
       color: white
 
-  ul
+  ul.header-quick-access-list
     transition: opacity 0.2s
-    margin: 4px 0 0 5px
-    overflow: hidden
+    overflow-x: auto
+    overflow-y: hidden
+    white-space: nowrap
+    padding: 10px
+    margin: -10px
 
     li
-      display: block
-      float: left
+      display: inline
       width: auto
       color: darken(white, 15%)
-      padding: 2px 5px 0
+      padding: 12px 0px
+      margin: -10px 0px
+
+      a
+        padding: 12px 10px
+        margin: -10px 0px
+
+        .viewer
+          display: inline
+          white-space: nowrap
+
+          p
+            display: inline
+            white-space: nowrap
 
       &.current
         color: darken(white, 5%)
 
+      &.current.empty
+        padding: 12px 10px 12px 10px
+
       &:first-child .fa-home,&:nth-child(3) .fa-globe
         margin-right: 5px
 
@@ -186,37 +208,32 @@
   #header-quick-access
     transition: background-color 0.4s
     width: 100%
-    padding: 10px 0px
     z-index: 30
 
     ul
       width: calc(100% - 60px)
-      overflow: ellipsis
-      padding: 10px
-      margin: -10px
+      margin-right: 10px
 
       li
         height: 100%
-        padding: 12px 0px
-        margin: -10px 0px
 
         a
           height: 100%
-          padding: 12px 10px
-          margin: -10px 0px
 
-        .fa-home
+    span
+      .fa-home
           font-size: 26px
           margin-top: -2px
+          margin-right: 10px
+          margin-left: 10px
 
     #header-new-board-icon
       display: none
 
     #header-user-bar
-      position: absolute
       right: 0px
       padding: 10px
-      margin: -10px 0 -10px -10px
+      margin: -8px 0 -10px -10px
 
 .announcement .viewer
   display: inline-block
@@ -233,3 +250,6 @@
   p
     margin: 7px
     padding: 0
+
+#headerIsSettingDatabaseCallDone
+  display: none;

client/components/main/layouts.jade

@@ -1,6 +1,6 @@
 head
   title
-  meta(name="viewport" content="maximum-scale=1.0,width=device-width,initial-scale=1.0,user-scalable=0")
+  meta(name="viewport" content="width=device-width, initial-scale=1")
   meta(http-equiv="X-UA-Compatible" content="IE=edge")
   //- XXX We should use pathFor in the following `href` to support the case
     where the application is deployed with a path prefix, but it seems to be
@@ -34,8 +34,9 @@ template(name="userFormsLayout")
           img(src="{{currentSetting.customLoginLogoImageUrl}}" width="300" height="auto")
           br
       unless currentSetting.customLoginLogoImageUrl
-        img(src="{{pathFor '/wekan-logo.svg'}}" alt="" width="300" height="auto")
-        br
+        div#isSettingDatabaseCallDone
+          img(src="{{pathFor '/wekan-logo.svg'}}" alt="" width="300" height="auto")
+          br
       if currentSetting.textBelowCustomLoginLogo
         +viewer
           | {{currentSetting.textBelowCustomLoginLogo}}
@@ -47,6 +48,13 @@ template(name="userFormsLayout")
         +Template.dynamic(template=content)
         if currentSetting.displayAuthenticationMethod
           +connectionMethod(authenticationMethod=currentSetting.defaultAuthenticationMethod)
+        if isLegalNoticeLinkExist
+          div#legalNoticeDiv
+            span#legalNoticeSpan {{_ 'acceptance_of_our_legalNotice'}}
+            a#legalNoticeAtLink.at-link(href="{{currentSetting.legalNotice}}", target="_blank", rel="noopener noreferrer")
+              | {{_ 'legalNotice'}}
+          if getLegalNoticeWithWritTraduction
+            div
         div.at-form-lang
           select.select-lang.js-userform-set-language
             each languages

client/components/main/layouts.js

@@ -6,6 +6,9 @@ const i18nTagToT9n = i18nTag => {
   return i18nTag;
 };
 
+let alreadyCheck = 1;
+let isCheckDone = false;
+
 const validator = {
   set(obj, prop, value) {
     if (prop === 'state' && value !== 'signIn') {
@@ -20,6 +23,8 @@ const validator = {
   },
 };
 
+// let isSettingDatabaseFctCallDone = false;
+
 Template.userFormsLayout.onCreated(function() {
   const templateInstance = this;
   templateInstance.currentSetting = new ReactiveVar();
@@ -28,6 +33,18 @@ 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);
+      }
+
+      // isSettingDatabaseFctCallDone = true;
+      if(currSetting && currSetting !== undefined && currSetting.customLoginLogoImageUrl !== undefined)
+        document.getElementById("isSettingDatabaseCallDone").style.display = 'none';
+      else
+        document.getElementById("isSettingDatabaseCallDone").style.display = 'block';
       return this.stop();
     },
   });
@@ -36,6 +53,19 @@ Template.userFormsLayout.onCreated(function() {
       $('.at-pwd-form').hide();
     }
   });
+
+  Meteor.call('isDisableRegistration', (_, result) => {
+    if (result) {
+      $('.at-signup-link').hide();
+    }
+  });
+
+  Meteor.call('isDisableForgotPassword', (_, result) => {
+    if (result) {
+      $('.at-pwd-link').hide();
+    }
+  });
+
 });
 
 Template.userFormsLayout.onRendered(() => {
@@ -56,6 +86,31 @@ Template.userFormsLayout.helpers({
     return Template.instance().currentSetting.get();
   },
 
+  // isSettingDatabaseCallDone(){
+  //   return isSettingDatabaseFctCallDone;
+  // },
+
+  isLegalNoticeLinkExist(){
+    const currSet = Template.instance().currentSetting.get();
+    if(currSet && currSet !== undefined && currSet != null){
+      return currSet.legalNotice !== undefined && currSet.legalNotice.trim() != "";
+    }
+    else
+      return false;
+  },
+
+  getLegalNoticeWithWritTraduction(){
+    let spanLegalNoticeElt = $("#legalNoticeSpan");
+    if(spanLegalNoticeElt != null && spanLegalNoticeElt != undefined){
+      spanLegalNoticeElt.html(TAPi18n.__('acceptance_of_our_legalNotice', {}, T9n.getLanguage() || 'en'));
+    }
+    let atLinkLegalNoticeElt = $("#legalNoticeAtLink");
+    if(atLinkLegalNoticeElt != null && atLinkLegalNoticeElt != undefined){
+      atLinkLegalNoticeElt.html(TAPi18n.__('legalNotice', {}, T9n.getLanguage() || 'en'));
+    }
+    return true;
+  },
+
   isLoading() {
     return Template.instance().isLoading.get();
   },
@@ -74,25 +129,84 @@ Template.userFormsLayout.helpers({
       let name = lang.name;
       if (lang.name === 'br') {
         name = 'Brezhoneg';
-      } else if (lang.name === 'es-PY') {
-        name = 'Español de Paraguayo';
+      } 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 === 'de-CH') {
+        name = 'Deutsch (Schweiz)';
+      } else if (lang.name === 'de-AT') {
+        name = 'Deutsch (Österreich)';
+      } else if (lang.name === 'en-DE') {
+        name = 'English (Germany)';
+      } else if (lang.name === 'et-EE') {
+        name = 'eesti keel (Eesti)';
+      } 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 === 'gu-IN') {
+        // gu-IN = Gurajati (India)
+        name = 'ગુજરાતી';
+      } else if (lang.name === 'hi-IN') {
+        // hi-IN = Hindi (India)
+        name = 'हिंदी (भारत)';
       } 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 === 'ms-MY') {
+        // ms-MY = Malay (Malaysia)
+        name = 'بهاس ملايو';
+      } else if (lang.name === 'en-IT') {
+        name = 'English (Italy)';
+      } else if (lang.name === 'el-GR') {
+        // el-GR = Greek (Greece)
+        name = 'Ελληνικά (Ελλάδα)';
+      } 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 === 'gl-ES') {
+        name = 'Galego (España)';
       } else if (lang.name === 'oc') {
         name = 'Occitan';
+      } else if (lang.name === 'ru-UA') {
+        name = 'Русский (Украина)';
       } else if (lang.name === 'st') {
         name = 'Sãotomense';
+      } else if (lang.name === 'uk-UA') {
+        name = 'українська (Україна)';
       } else if (lang.name === '繁体中文（台湾）') {
+        // Traditional Chinese (Taiwan)
         name = '繁體中文（台灣）';
       }
       return { tag, name };
@@ -125,6 +239,53 @@ Template.userFormsLayout.events({
         templateInstance.isLoading.set(false);
       });
     }
+    isCheckDone = false;
+  },
+  'click #at-signUp'(event, templateInstance){
+    isCheckDone = false;
+  },
+  'DOMSubtreeModified #at-oidc'(event){
+    if(alreadyCheck <= 2){
+      let currSetting = Settings.findOne();
+      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;
+        if(alreadyCheck == 1){
+          alreadyCheck++;
+          oidcBtnElt.html("");
+        }
+        else{
+          alreadyCheck++;
+          oidcBtnElt.html(htmlvalue);
+        }
+      }
+    }
+    else{
+      alreadyCheck = 1;
+    }
+  },
+  'DOMSubtreeModified .at-form'(event){
+    if(alreadyCheck <= 2 && !isCheckDone){
+      if(document.getElementById("at-oidc") != null){
+        let currSetting = Settings.findOne();
+        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;
+          if(alreadyCheck == 1){
+            alreadyCheck++;
+            oidcBtnElt.html("");
+          }
+          else{
+            alreadyCheck++;
+            isCheckDone = true;
+            oidcBtnElt.html(htmlvalue);
+          }
+        }
+      }
+    }
+    else{
+      alreadyCheck = 1;
+    }
   },
 });
 

client/components/main/layouts.styl

@@ -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
@@ -430,7 +433,7 @@ a
       margin-top: 0px
 
   .wrapper
-    height: 100%
+    height: calc(100% - 31px)
     margin: 0px
 
   .panel-default
@@ -539,3 +542,11 @@ a
 
   100%
     transform: rotate(360deg)
+
+#isSettingDatabaseCallDone
+  display: none;
+
+.at-link
+  color: #17683a;
+  text-decoration: underline;
+  text-decoration-color: #17683a;

client/components/main/myCards.jade

@@ -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,69 +14,26 @@ template(name="myCardsModalTitle")
 
 template(name="myCards")
   if currentUser
-    if isPageReady.get
+    if searching.get
+      +spinner
+    else
       .wrapper
-        if $eq myCardsSort 'board'
-          each board in myCardsList
-            .my-cards-board-wrapper
-              .my-cards-board-title
+        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.absoluteUrl)
-                          +minicard(card)
-        else
-          .my-cards-dueat-list-wrapper
-            each card in myDueCardsList
-              .my-cards-card-wrapper
-                a.minicard-wrapper.card-title(href=card.absoluteUrl)
-                  +minicard(card)
-                ul.my-cards-context-list
-                  li.my-cards-context(title="{{_ 'board'}}")
+            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
-                      = card.getBoard.title
-                  li.my-cards-context.my-cards-context-separator
-                    = ' '
-                    | {{_ 'context-separator'}}
-                    = ' '
-                  li.my-cards-context(title="{{_ 'swimlane'}}")
-                    +viewer
-                      = card.getSwimlane.title
-                  li.my-cards-context
-                    = ' '
-                    | {{_ 'context-separator'}}
-                    = ' '
-                  li.my-cards-context(title="{{_ 'list'}}")
-                    +viewer
-                      = card.getList.title
-    else
-      +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
+                      = list.title
+                  each card in list.myCards
+                    .my-cards-card-wrapper
+                      a.minicard-wrapper(href=card.originRelativeUrl)
+                        +minicard(card)

client/components/main/myCards.js

@@ -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');

client/components/main/myCards.styl

@@ -1,14 +1,14 @@
 .my-cards-board-wrapper
-  border-radius: 8px
+  border-radius: 0 0 4px 4px;
   //padding: 0.5rem
   min-width: 400px
-  border-width: 8px
-  border-color: grey
-  border-style: solid
   margin-bottom: 2rem
   margin-right: auto
   margin-left: auto
-
+  border-width: 2px
+  border-style: solid
+  border-color: #a2a2a2
+  
 .my-cards-board-title
   font-size: 1.4rem
   font-weight: bold
@@ -41,9 +41,9 @@
 .my-cards-list-wrapper
   margin: 1rem
   border-radius: 5px
-  padding: 1.5rem
-  padding-top: 0.75rem
-  display: inline-block
+  //padding: 1.5rem
+  //padding-top: 0.75rem
+  display: inline-grid
   min-width: 250px
   max-width: 350px
 
@@ -55,15 +55,3 @@
   max-width: 500px
   margin-right: auto
   margin-left: auto
-
-.my-cards-field-name
-  font-weight: bold
-
-.my-cards-context
-  display: inline-block
-
-.my-cards-context-separator
-  font-weight: bold
-
-.my-cards-context-list
-  margin-bottom: 0.7rem