From c3b45b824b081d3d86220fe38dcb15cf7debb098 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E2=80=9Cnico-shishkin=E2=80=9D?= <“nicoshishkinatlogz@outlook.com”> Date: Wed, 29 Mar 2023 11:32:32 +0200 Subject: [PATCH] TOC per tab - Concept --- _source/_layouts/default.html | 4 + _source/css/logz-docs.css | 8 + _source/js/tab_toc.js | 46 ++++ .../_log-sources/apprunner.md | 198 ++---------------- 4 files changed, 71 insertions(+), 185 deletions(-) create mode 100644 _source/js/tab_toc.js diff --git a/_source/_layouts/default.html b/_source/_layouts/default.html index 614c5ba44..63ecee5a5 100644 --- a/_source/_layouts/default.html +++ b/_source/_layouts/default.html @@ -57,6 +57,10 @@

{% include templates/footer.html %} + + + + diff --git a/_source/css/logz-docs.css b/_source/css/logz-docs.css index a9a92eeb4..d3d59f9ed 100644 --- a/_source/css/logz-docs.css +++ b/_source/css/logz-docs.css @@ -485,6 +485,14 @@ ol .branching-tabs { padding-top: 12px; } +.toc-container { + position: sticky; + top: 80px; + max-height: calc(100vh - 80px); + overflow-y: auto; + margin-right: 20px; +} + /* ===== LOG SHIPPING PAGES ===== */ #on-this-page-toc { diff --git a/_source/js/tab_toc.js b/_source/js/tab_toc.js new file mode 100644 index 000000000..097ef0b7b --- /dev/null +++ b/_source/js/tab_toc.js @@ -0,0 +1,46 @@ +document.addEventListener("DOMContentLoaded", function() { + function generateTOC(tabContent, tocContainer) { + const headings = tabContent.find('h1, h2, h3, h4, h5, h6'); + let tocList = ''; + + headings.each((index, heading) => { + const anchorId = `${tabContent.attr('id')}-heading-${index}`; + $(heading).attr('id', anchorId); + + tocList += `
  • ${heading.innerText}
    • `; + }); + + tocContainer.html(``); + } + + function switchTab(e) { + e.preventDefault(); + + const targetTabId = $(this).attr('href').slice(1); + const allTabs = $('.tab-content'); + const allBranchingTabs = $('.branching-tabs'); + + allTabs.hide(); + allBranchingTabs.removeClass('active'); + + $(`#${targetTabId}`).show(); + $(this).addClass('active'); + } + + $(document).ready(function() { + const tabContents = $('.tab-content'); + tabContents.each(function() { + const tocContainer = $(this).find('.toc-container'); + generateTOC($(this), tocContainer); + }); + + const branchingTabs = $('.branching-tabs'); + branchingTabs.on('click', switchTab); + + // Show the first tab as the default active tab + const firstTabId = branchingTabs.first().attr('href').slice(1); + $(`#${firstTabId}`).show(); + branchingTabs.first().addClass('active'); + }); + }); + \ No newline at end of file diff --git a/_source/logzio_collections/_log-sources/apprunner.md b/_source/logzio_collections/_log-sources/apprunner.md index 738b609ef..0878c5d29 100644 --- a/_source/logzio_collections/_log-sources/apprunner.md +++ b/_source/logzio_collections/_log-sources/apprunner.md @@ -14,215 +14,43 @@ shipping-tags: - aws order: 110 --- -
    -* [Overview](#overview) -* [Manual Lambda configuration](#manual-lambda-configuration) -* [Automated CloudFormation deployment](#automated-cloudformation-deployment) +* [Manual Lambda configuration](#manual) +* [Automated CloudFormation deployment](#automated) {:.branching-tabs} -
    +
    -AWS App Runner is a fully managed service for deployment of containerized web applications and APIs. This integration allows you to send logs from your AppRunner instances to your Logz.io account. +
    -
    - - - -
    +

    Manual configuration with a Lambda function

    -#### Manual configuration with a Lambda function - -{% include log-shipping/note-lambda-test.md %} - -
    +test ##### Create a new Lambda function -This Lambda function will collect AppRunner logs and sends them to Logz.io in bulk over HTTPS. - -Open the AWS Lambda Console, and click **Create function**. -Choose **Author from scratch**, and use this information: - -* **Name**: We suggest adding the log type to the name, but you can name this function whatever you want. -* **Runtime**: Choose **Python 3.7** -* **Role**: Click **Create new role from template(s)**. Then, from the **Policy Templates** list, select **Basic Edge Lambda permissions**. - -Click **Create Function** (bottom right corner of the page). After a few moments, you'll see configuration options for your Lambda function. - -You'll need this page later on, so keep it open. - -##### Zip the source files - -Clone the AppRunner Logs Shipper - Lambda project from GitHub to your computer, -and zip the Python files in the `src/` folder. - -```shell -git clone https://github.com/logzio/logzio_aws_serverless.git \ -&& cd logzio_aws_serverless/python3/apprunner/ \ -&& mkdir -p dist/python3/shipper; cp -r ../shipper/shipper.py dist/python3/shipper \ -&& cp src/lambda_function.py dist \ -&& cd dist/ \ -&& zip logzio-apprunner lambda_function.py python3/shipper/* -``` - -You'll upload `logzio-apprunner.zip` in the next step. - -##### Upload the zip file and set environment variables - -In the _Function_ code section of Lambda, find the **Code entry type** list. Choose **Upload a .ZIP file** from this list. - -Click **Upload**, and choose the zip file you created earlier (`logzio-apprunner.zip`). - -In the _Environment variables_ section, set your Logz.io account token, URL, and log type, and any other variables that you need to use. - -###### Environment variables - -| Parameter | Description | Required/Default | -|---|---|---| -| TOKEN | Your Logz.io account token. {% include log-shipping/log-shipping-token.html %} | Required | -| REGION | {% include log-shipping/log-region.html %} -| URL (Deprecated) | Use REGION instead. | -- | -| TYPE | The log type you'll use with this Lambda. This can be a [built-in log type]({{site.baseurl}}/user-guide/log-shipping/built-in-log-types.html), or a custom log type. You should create a new Lambda for each log type you use. | `logzio_apprunner_lambda` | -| FORMAT | `json` or `text`. If `json`, the Lambda function will attempt to parse the message field as JSON and populate the event data with the parsed fields. | `text` | -| COMPRESS | Set to `true` to compress logs before sending them. Set to `false` to send uncompressed logs. | `false` | -| ENRICH | Enrich AppRunner events with custom properties, formatted as `key1=value1;key2=value2`. | -- | - - - - -##### Configure the function's basic settings - -In Basic settings, we recommend starting with these settings: - -* **Memory**: 512 MB -* **Timeout**: 1 min 0 sec - - -These default settings are just a starting point. -Check your Lambda usage regularly, and adjust these values if you need to. -{:.info-box.note} - - - -{% include log-shipping/apprunner-defaults.md %} - - -##### Set the AppRunner Logs event trigger - -1. Find the **Add triggers** list (left side of the Designer panel). Choose **CloudWatch Logs** from this list. - -2. Below the Designer, you'll see the Configure triggers panel. In the **Log groups**, search for the AppRunner option and select it as the trigger for the Lambda function. - -3. Type a **Filter name** (required) and **Filter pattern** (optional). - -4. Click **Add**, then **Save** at the top of the page. - -##### Check Logz.io for your logs - -Give your logs some time to get from your system to ours, and then open [Open Search Dashboards](https://app.logz.io/#/dashboard/osd). - -If you still don't see your logs, see [log shipping troubleshooting]({{site.baseurl}}/user-guide/log-shipping/log-shipping-troubleshooting.html). - -
    - +test
    -
    - -#### Automated CloudFormation deployment +
    -{% include log-shipping/note-lambda-test.md %} +
    -**Before you begin, you'll need**: -AWS CLI, -an S3 bucket to store the CloudFormation package +#### Automated CloudFormation deployment -
    +test ##### Zip the source files -Clone the AppRunner Logs Shipper - Lambda project from GitHub to your computer, -and zip the Python files in the `src/` folder. - -```shell -git clone https://github.com/logzio/logzio_aws_serverless.git \ -&& cd logzio_aws_serverless/python3/apprunner/ \ -&& mkdir -p dist/python3/shipper; cp -r ../shipper/shipper.py dist/python3/shipper \ -&& cp src/lambda_function.py dist \ -&& cd dist/ \ -&& zip logzio-apprunner lambda_function.py python3/shipper/* -``` - -##### Create the CloudFormation package and upload to S3 - -Create the CloudFormation package using the AWS CLI. -Replace `<>` with the S3 bucket name where you'll be uploading this package. - -```shell -cd ../ \ -&& aws cloudformation package \ - --template sam-template.yaml \ - --output-template-file cloudformation-template.output.yaml \ - --s3-bucket <> -``` - -##### Deploy the CloudFormation package - -Deploy the CloudFormation package using AWS CLI. - -For a complete list of options, see the configuration parameters below the code block. 👇 - -```shell -aws cloudformation deploy \ ---template-file $(pwd)/cloudformation-template.output.yaml \ ---stack-name logzio-apprunner-logs-lambda-stack \ ---parameter-overrides \ - LogzioTOKEN='<>' \ ---capabilities "CAPABILITY_IAM" -``` - - -###### Parameters - -| Parameter | Description | Required/Default | -|---|---|---| -| LogzioTOKEN | Your Logz.io account token. {% include log-shipping/log-shipping-token.html %} | Required | -| LogzioREGION | {% include log-shipping/log-region.html %} -| LogzioURL (Deprecated) | Use LogzioREGION instead. Protocol, listener host, and port (for example, `https://<>:8071`). The [token](https://app.logz.io/#/dashboard/settings/general) of the account you want to ship to. | -- | -| LogzioTYPE | The log type you'll use with this Lambda. This can be a [built-in log type](https://docs.logz.io/user-guide/log-shipping/built-in-log-types.html), or a custom log type. You should create a new Lambda for each log type you use. | `logzio_apprunner_logs` | -| LogzioFORMAT | `json` or `text`. If `json`, the Lambda function will attempt to parse the message field as JSON and populate the event data with the parsed fields. | `text` | -| LogzioCOMPRESS | Set to `true` to compress logs before sending them. Set to `false` to send uncompressed logs. | `false` | -| LogzioENRICH | Enrich AppRunner events with custom properties, formatted as `key1=value1;key2=value2`. | -- | - - - -{% include log-shipping/apprunner-defaults.md %} - - -##### Set the AppRunner Logs event trigger - -1. Find the **Add triggers** list (left side of the Designer panel). Choose **CloudWatch Logs** from this list. - -2. Below the Designer, you'll see the Configure triggers panel. In the **Log groups**, search for the AppRunner option and select it as the trigger for the Lambda function. - -3. Type a **Filter name** (required) and **Filter pattern** (optional). - -4. Click **Add**, then **Save** at the top of the page. - -##### Check Logz.io for your logs - -Give your logs some time to get from your system to ours, and then open [Open Search Dashboards](https://app.logz.io/#/dashboard/osd). - -If you still don't see your logs, see [log shipping troubleshooting]({{site.baseurl}}/user-guide/log-shipping/log-shipping-troubleshooting.html). - +test
    +