Merge pull request #10 from wanasyraf96/include-composer-install-build

Implement URL pattern matching with include and exclude options

Author: pyhrus

.gitattributes

@@ -1,2 +1,3 @@
 # exclude docker files from archive
 /docker export-ignore
+/.github export-ignore

.github/workflows/release.yml

@@ -0,0 +1,39 @@
+name: create-release-artifact
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  create-release-artifact:
+    name: Creating release artifact
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout
+        uses: actions/checkout@v2
+
+      - name: cached dependencies
+        uses: actions/cache@v2
+        id: cached-dependencies
+        with:
+          path: ./tawk_to/vendor
+          # the key will change if composer.lock changes
+          key: ${{ runner.os }}-dependencies-${{ hashFiles('**/composer.lock') }}
+
+      - name: install dependencies
+        uses: php-actions/composer@v6
+        with:
+          command: run build:prod
+
+      - name: build artifact
+        run: composer run package && mv ./tmp/tawk_to.zip tawk_to.zip
+
+      - name: upload artifact
+        uses: actions/upload-release-asset@v1
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        with:
+          upload_url: ${{ github.event.release.upload_url }}
+          asset_path: ./tawk_to.zip
+          asset_name: tawk_to.zip
+          asset_content_type: application/zip

.gitignore

@@ -1 +1,4 @@
 docker/bin
+/tawk_to/vendor
+/vendor
+/tmp

README.md

@@ -14,14 +14,14 @@ Don't have a tawk.to account yet? [Create one here.](https://www.tawk.to/?utm_so
 ## Installation
 
 ### Module Installer
-1. Download the [plugin module](https://www.drupal.org/project/tawkto).
+1. Download the `tawk_to.zip` from [latest release.](https://github.com/tawk/tawk-drupal8/releases).
 2. Log in to the your administration panel and click on `Extend`.
 3. In the module list, click on the `Install new module` button.
 4. Click on `Choose File`, select the downloaded module, and click on the `Install` button.
 5. After the installation completes, click on `Enable newly added modules` to complete the installation.
 
 ### Manual Installation
-1. Download the [plugin module](https://www.drupal.org/project/tawkto) and extract the contents.
+1. Download the `tawk_to.zip` from [latest release.](https://github.com/tawk/tawk-drupal8/releases).
 2. In the extracted files, copy the `tawkto` directory to the `<DRUPAL_INSTALLATION>/modules` directory.
 3. Log in to the your administration panel and click on `Extend`.
 4. In the module list, search for `tawk.to` and enable the module by ticking the checkbox beside `tawk.to Module`.

composer.json

@@ -0,0 +1,20 @@
+{
+    "name": "tawk/tawk-drupal8",
+    "description": "tawk.to Live Chat module for Drupal 8 CMS",
+    "type": "project",
+    "license": "GPLv3",
+    "require": {
+        "tawk/url-utils": "2.0.1"
+    },
+    "repositories": {
+        "tawk-url-utils": {
+            "type": "vcs",
+            "url": "https://github.com/tawk/tawk-url-utils.git"
+        }
+    },
+    "scripts": {
+        "build:prod": "COMPOSER_VENDOR_DIR=./tawk_to/vendor composer install --no-dev",
+        "package": "composer run clean && mkdir -p ./tmp && cp -r ./tawk_to ./tmp && (cd ./tmp && zip -9 -rq ./tawk_to.zip ./tawk_to)",
+        "clean": "rm -rf ./tmp"
+    }
+}

composer.lock

@@ -10,6 +10,9 @@ Docker containers for Drupal
 - install docker-compose [http://docs.docker.com/compose/install/](http://docs.docker.com/compose/install/)
 
 ## Usage
+Build using defined environment:
+- ```cd ./docker && ./build.sh envs/<env-file>```
+
 Start the container:
 - ```docker-compose --env-file envs/<env-file> up```
 

docker/README.md

@@ -12,6 +12,9 @@ fi
 echo "Creating module folder";
 mkdir -p $module_dir;
 
+echo "Installing dependency"
+composer run build:prod --working-dir=$build_dir/..
+
 echo "Copying files to module folder";
 cp -r $build_dir/../tawk_to/* $module_dir
 

docker/build.sh

@@ -1,8 +1,11 @@
 <?php
 namespace Drupal\tawk_to\core;
 
+require_once drupal_get_path('module', 'tawk_to').'/vendor/autoload.php';
+
 use Symfony\Component\HttpFoundation\JsonResponse;
 use \Drupal\Core\Cache\Cache;
+use Tawk\Modules\UrlPatternMatcher;
 
 define('TAWK_TO_WIDGET_PID', 'tawk_to_widget_pid'); // page ID
 define('TAWK_TO_WIDGET_WID', 'tawk_to_widget_wid'); // widget ID
@@ -89,17 +92,8 @@ private function shouldDisplayWidget($options = null)
         // prepare visibility
         $currentUrl = $base_url.$_SERVER["REQUEST_URI"];
         if ($options->always_display == false) {
-
-            $showPages = json_decode($options->show_oncustom);
-            foreach ($showPages as $slug) {
-                if (empty(trim($slug))) {
-                    continue;
-                }
-
-                if ($currentUrl == $slug) {
-                    $show = true;
-                    break;
-                }
+            if (UrlPatternMatcher::match($currentUrl, $showPages)) {
+                $show = true;
             }
 
             // check if category/taxonomy page
@@ -121,18 +115,8 @@ private function shouldDisplayWidget($options = null)
             $show = true;
 
             $currentUrl = (string) $currentUrl;
-            foreach ($hide_pages as $slug) {
-
-                if (empty(trim($slug))) {
-                    continue;
-                }
-
-                $slug = (string) htmlspecialchars($slug); // we need to add htmlspecialchars due to slashes added when saving to database
-
-                if ($currentUrl == $slug) {
-                    $show = false;
-                    break;
-                }
+            if (UrlPatternMatcher::match($currentUrl, $hide_pages)) {
+                $show = false;
             }
         }
 
@@ -203,6 +187,46 @@ public function getIframe()
                     display: block;
                 }
             }
+
+            /* Tooltip */
+            .tooltip {
+            position: relative;
+            display: inline;
+            color: #03a84e;
+            }
+
+            .tooltip .tooltiptext {
+            visibility: hidden;
+            background-color: #545454;
+            color: #fff;
+            text-align: center;
+            padding: 0.5rem;
+            max-width: 300px;
+            border-radius: 0.5rem;
+            line-height: 0.9;
+
+            /* Position the tooltip text - see examples below! */
+            position: absolute;
+            z-index: 1000;
+            top: 12px;
+            }
+
+            .tooltip .tooltiptext::before {
+            content: "";
+            display: block;
+            width: 0;
+            height: 0;
+            position: absolute;
+            border-left: 5px solid transparent;
+            border-right: 5px solid transparent;
+            border-bottom: 5px solid #545454;
+            top: -5px;
+            left: 5px;
+            }
+
+            .tooltip:hover .tooltiptext {
+            visibility: visible;
+            }
         </style>
         <?php if (!$sameUser) : ?>
             <div id="widget_already_set" style="width: 100%; float: left; color: #3c763d; border-color: #d6e9c6; font-weight: bold; margin: 20px 0;" class="alert alert-warning">Notice: Widget already set by other user</div>
@@ -247,10 +271,39 @@ public function getIframe()
                                         <textarea class="form-control hide_specific" name="hide_oncustom" id="hide_oncustom" cols="30" rows="10"></textarea>
                                     <?php endif; ?>
                                     <br>
-                                    <p style="text-align: justify;">
-                                    Add URLs to pages in which you would like to hide the widget. ( if "always show" is checked )<br>
-                                    Put each URL in a new line.
-                                    </p>
+                                    <div style="text-align: justify;">
+                                        Add URLs/paths to pages in which you would like to hide the widget.<br>
+                                        Put each URL/path in a new line. Paths should have a leading '/'.
+                                        <br>
+                                        <div class="tooltip">
+                                            Examples of accepted path patterns
+                                            <ul class="tooltiptext">
+                                                <li>*</li>
+                                                <li>*/to/somewhere</li>
+                                                <li>/*/to/somewhere</li>
+                                                <li>/path/*/somewhere</li>
+                                                <li>/path/*/lead/*/somewhere</li>
+                                                <li>/path/*/*/somewhere</li>
+                                                <li>/path/to/*</li>
+                                                <li>/path/to/*/</li>
+                                                <li>*/to/*/page</li>
+                                                <li>/*/to/*/page</li>
+                                                <li>/path/*/other/*</li>
+                                                <li>/path/*/other/*/</li>
+                                                <li>http://www.example.com/</li>
+                                                <li>http://www.example.com/*</li>
+                                                <li>http://www.example.com/*/to/somewhere</li>
+                                                <li>http://www.example.com/path/*/somewhere</li>
+                                                <li>http://www.example.com/path/*/lead/*/somewhere</li>
+                                                <li>http://www.example.com/path/*/*/somewhere</li>
+                                                <li>http://www.example.com/path/to/*</li>
+                                                <li>http://www.example.com/path/to/*/</li>
+                                                <li>http://www.example.com/*/to/*/page</li>
+                                                <li>http://www.example.com/path/*/other/*</li>
+                                                <li>http://www.example.com/path/*/other/*/</li>
+                                            </ul>
+                                        </div>
+                                    </div>
                                 </div>
                             </div>
 
@@ -298,10 +351,39 @@ public function getIframe()
                                         <textarea class="form-control show_specific" name="show_oncustom" id="show_oncustom" cols="30" rows="10"></textarea>
                                     <?php endif; ?>
                                     <br>
-                                    <p style="text-align: justify;">
-                                    Add URLs to pages in which you would like to show the widget.<br>
-                                    Put each URL in a new line.
-                                    </p>
+                                    <div style="text-align: justify;">
+                                        Add URLs/paths to pages in which you would like to show the widget.<br>
+                                        Put each URL/path in a new line. Paths should have a leading '/'.
+                                        <br>
+                                        <div class="tooltip">
+                                            Examples of accepted path patterns
+                                            <ul class="tooltiptext">
+                                                <li>*</li>
+                                                <li>*/to/somewhere</li>
+                                                <li>/*/to/somewhere</li>
+                                                <li>/path/*/somewhere</li>
+                                                <li>/path/*/lead/*/somewhere</li>
+                                                <li>/path/*/*/somewhere</li>
+                                                <li>/path/to/*</li>
+                                                <li>/path/to/*/</li>
+                                                <li>*/to/*/page</li>
+                                                <li>/*/to/*/page</li>
+                                                <li>/path/*/other/*</li>
+                                                <li>/path/*/other/*/</li>
+                                                <li>http://www.example.com/</li>
+                                                <li>http://www.example.com/*</li>
+                                                <li>http://www.example.com/*/to/somewhere</li>
+                                                <li>http://www.example.com/path/*/somewhere</li>
+                                                <li>http://www.example.com/path/*/lead/*/somewhere</li>
+                                                <li>http://www.example.com/path/*/*/somewhere</li>
+                                                <li>http://www.example.com/path/to/*</li>
+                                                <li>http://www.example.com/path/to/*/</li>
+                                                <li>http://www.example.com/*/to/*/page</li>
+                                                <li>http://www.example.com/path/*/other/*</li>
+                                                <li>http://www.example.com/path/*/other/*/</li>
+                                            </ul>
+                                        </div>
+                                    </div>
                                 </div>
                             </div>
                         </div>