Skip to content

Commit c5f184a

Browse files
pikulo-kamapikulo-kama
committed
Update documentation
1 parent e9afd3d commit c5f184a

8 files changed

Lines changed: 396 additions & 230 deletions

File tree

‎Gemfile‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
source "https://rubygems.org"
44

5+
gem "csv"
6+
gem "base64"
57
gem "jekyll", "~> 4.3.4"
68
gem "jekyll-theme-chirpy", "~> 7.2", ">= 7.2.4"
79
# gem "github-pages", "~> 232", group: :jekyll_plugins

‎_includes/script_doc.html‎

Lines changed: 106 additions & 120 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
21
<!--
32
Represents script documentation header
43
which contains summary of script capabilities.
@@ -7,126 +6,113 @@
76
{%- assign script_id = include.name | replace: ' ', '-' | downcase -%}
87

98
<div class="mb-5 mt-5">
10-
<!-- Script name -->
11-
<h3 id="{{ script_id }}">{{include.name}}</h3>
12-
13-
<!-- Chips Section -->
14-
<div class="d-flex gap-1">
15-
<!-- Region Specific Chip -->
16-
{% include doc_chip.html
17-
controlValue=include.specificity
18-
color="warning"
19-
textColor="dark"
20-
icon="flag"
21-
content="Region Specific"
22-
%}
23-
24-
<!-- Widget Support Chip -->
25-
{% include doc_chip.html
26-
controlValue=include.widgetSupport
27-
color="success"
28-
icon="image"
29-
content="Widget Support"
30-
%}
31-
32-
<!-- UI Table Support Chip -->
33-
{% include doc_chip.html
34-
controlValue=include.uiTableSupport
35-
color="primary"
36-
icon="table"
37-
content="UI Table Support"
38-
%}
39-
</div>
9+
<!-- Script name -->
10+
<h3 id="{{ script_id }}">{{include.name}}</h3>
11+
12+
<!-- Chips Section -->
13+
<div class="d-flex gap-1">
14+
<!-- Region Specific Chip -->
15+
{% include doc_chip.html controlValue=include.specificity color="warning"
16+
textColor="dark" icon="flag" content="Region Specific" %}
17+
18+
<!-- Widget Support Chip -->
19+
{% include doc_chip.html controlValue=include.widgetSupport color="success"
20+
icon="image" content="Widget Support" %}
21+
22+
<!-- UI Table Support Chip -->
23+
{% include doc_chip.html controlValue=include.uiTableSupport color="primary"
24+
icon="table" content="UI Table Support" %}
25+
26+
<!-- Option Selection Chip -->
27+
{% include doc_chip.html controlValue=include.optionSelectionSupport
28+
color="primary" icon="list" content="Option Selection Support" %}
29+
</div>
4030

41-
<!-- UI Table Information Block -->
42-
{%- if include.uiTableSupport -%}
43-
<div class="scriptable-doc mt-5 p-1">
44-
<div class="d-flex flex-column align-items-start p-4">
45-
46-
<span class="mb-4 h4">UI Table</span>
47-
48-
<!-- UI Table Attributes -->
49-
<div class="d-flex flex-row align-items-start gap-5">
50-
{%-
51-
if include.uiTableAllowCreation
52-
or include.uiTableAllowEditing
53-
or include.uiTableAllowDeletion
54-
-%}
55-
<div class="d-flex flex-column gap-1">
56-
{% include ui_table_attr.html
57-
controlValue=include.uiTableAllowCreation
58-
content="Create"
59-
icon="fa-plus"
60-
%}
61-
{% include ui_table_attr.html
62-
controlValue=include.uiTableAllowEditing
63-
content="Edit"
64-
icon="fa-pen-to-square"
65-
%}
66-
{% include ui_table_attr.html
67-
controlValue=include.uiTableAllowDeletion
68-
content="Delete"
69-
icon="fa-trash"
70-
%}
71-
</div>
72-
{%- endif -%}
73-
74-
<div class="d-flex flex-column gap-1">
75-
{% include ui_table_attr.html
76-
controlValue=include.uiTableAllowFiltering
77-
content="Filter"
78-
icon="fa-filter"
79-
%}
80-
{% include ui_table_attr.html
81-
controlValue=include.uiTableReadonly
82-
content="Readonly"
83-
color="warning"
84-
icon="fa-book-open"
85-
%}
86-
</div>
87-
</div>
88-
</div>
89-
90-
<!-- UI Table Image Preview -->
91-
<div class="scriptable-doc__preview ui-table">
92-
{%- if include.uiTablePreview != null -%}
93-
<img
94-
src="{{ include.uiTablePreview }}"
95-
alt="Preview of {{ include.name }} UI Table"
96-
>
97-
{%- endif -%}
98-
</div>
31+
<!-- UI Table Information Block -->
32+
{%- if include.uiTableSupport -%}
33+
<div class="scriptable-doc mt-5 p-1">
34+
<div class="d-flex flex-column align-items-start p-4">
35+
<span class="mb-4 h4">UI Table</span>
36+
37+
<!-- UI Table Attributes -->
38+
<div class="d-flex flex-row align-items-start gap-5">
39+
{%- if include.uiTableAllowCreation or include.uiTableAllowEditing or
40+
include.uiTableAllowDeletion -%}
41+
<div class="d-flex flex-column gap-1">
42+
{% include ui_table_attr.html
43+
controlValue=include.uiTableAllowCreation content="Create"
44+
icon="fa-plus" %} {% include ui_table_attr.html
45+
controlValue=include.uiTableAllowEditing content="Edit"
46+
icon="fa-pen-to-square" %} {% include ui_table_attr.html
47+
controlValue=include.uiTableAllowDeletion content="Delete"
48+
icon="fa-trash" %}
9949
</div>
100-
{%- endif -%}
101-
102-
<!-- Widget Information Block -->
103-
{%- if include.widgetSupport -%}
104-
105-
<div class="scriptable-doc mt-5 p-1">
106-
<div class="d-flex flex-column align-items-start p-4">
107-
108-
<span class="mb-4 h4">Widget</span>
109-
110-
<!-- Widget Attributes -->
111-
<div class="d-flex flex-column align-items-start">
112-
{% include widget_size.html
113-
size=include.widgetSize
114-
%}
115-
{% include widget_specificity.html
116-
specificity=include.specificity
117-
%}
118-
</div>
119-
</div>
120-
121-
<!-- Widget Image Preview -->
122-
<div class="scriptable-doc__preview widget">
123-
{%- if include.widgetPreview != null -%}
124-
<img
125-
src="{{ include.widgetPreview }}"
126-
alt="Preview of {{ include.name }} widget"
127-
>
128-
{%- endif -%}
129-
</div>
50+
{%- endif -%}
51+
52+
<div class="d-flex flex-column gap-1">
53+
{% include ui_table_attr.html
54+
controlValue=include.uiTableAllowFiltering content="Filter"
55+
icon="fa-filter" %} {% include ui_table_attr.html
56+
controlValue=include.uiTableReadonly content="Readonly"
57+
color="warning" icon="fa-book-open" %}
13058
</div>
131-
{%- endif -%}
59+
</div>
60+
</div>
61+
62+
<!-- UI Table Image Preview -->
63+
<div class="scriptable-doc__preview ui-table">
64+
{%- if include.uiTablePreview != null -%}
65+
<img
66+
src="{{ include.uiTablePreview }}"
67+
alt="Preview of {{ include.name }} UI Table"
68+
/>
69+
{%- endif -%}
70+
</div>
71+
</div>
72+
{%- endif -%}
73+
74+
<!-- Widget Information Block -->
75+
{%- if include.widgetSupport -%}
76+
77+
<div class="scriptable-doc mt-5 p-1">
78+
<div class="d-flex flex-column align-items-start p-4">
79+
<span class="mb-4 h4">Widget</span>
80+
81+
<!-- Widget Attributes -->
82+
<div class="d-flex flex-column align-items-start">
83+
{% include widget_size.html size=include.widgetSize %} {% include
84+
widget_specificity.html specificity=include.specificity %}
85+
</div>
86+
</div>
87+
88+
<!-- Widget Image Preview -->
89+
<div class="scriptable-doc__preview widget">
90+
{%- if include.widgetPreview != null -%}
91+
<img
92+
src="{{ include.widgetPreview }}"
93+
alt="Preview of {{ include.name }} widget"
94+
/>
95+
{%- endif -%}
96+
</div>
97+
</div>
98+
{%- endif -%}
99+
100+
<!-- Option Selection Block -->
101+
{%- if include.optionSelectionSupport -%}
102+
<div class="scriptable-doc mt-5 p-1">
103+
<div class="d-flex flex-column align-items-start p-4">
104+
<span class="mb-4 h4">Option Selection</span>
105+
</div>
106+
107+
<!-- Dropdown Preview -->
108+
<div class="scriptable-doc__preview ui-table">
109+
{%- if include.optionSelectionPreview != null -%}
110+
<img
111+
src="{{ include.optionSelectionPreview }}"
112+
alt="Preview of {{ include.name }} option list"
113+
/>
114+
{%- endif -%}
115+
</div>
116+
</div>
117+
{%- endif -%}
132118
</div>

‎_tabs/about.md‎

Lines changed: 41 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,45 @@ icon: fas fa-info-circle
33
order: 4
44
---
55

6-
Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.
6+
The **Scriptable Modular Framework** was born out of a need for structure in an environment that often encourages "spaghetti code." Scriptable is a powerful tool, but as projects grow in complexity—involving networking, local storage, and multi-language support—managing them in a single file becomes impossible.
77

8-
The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham
8+
[Image of a software development lifecycle diagram showing stages: code, test, localise, bundle, and deploy]
9+
10+
## The Problem
11+
12+
Developing for Scriptable usually involves:
13+
14+
- **Code Duplication**: Copy-pasting the same file management or UI logic into every new script.
15+
- **Static Assets**: Difficulty managing images and icons across multiple devices.
16+
- **Hardcoded Strings**: No easy way to provide translations for a global audience.
17+
- **Difficult Distribution**: Sharing modular code is hard because users have to download 10 different files for one script to work.
18+
19+
## Our Solution
20+
21+
This framework introduces a **Unified Development Lifecycle**. By using a standardized set of core modules, we provide:
22+
23+
### 🧩 True Modularity
24+
25+
Using a custom-built **Bundler**, developers can write clean, decoupled code. You can import common utilities like `Files.js` or `Modal.js` without worrying about how to share the final result. The Bundler merges everything into a production-ready script.
26+
27+
### 🌐 Native Localization
28+
29+
Localization isn't an afterthought here. With the **Localizator** tool and the `Localization.js` module, adding support for a new language is as easy as filling out a table. The framework handles the logic of selecting the correct language based on the user's iOS settings.
30+
31+
### 🛡️ Robust Debugging
32+
33+
Logging in Scriptable is often "all or nothing." Our **Logger UI** allows you to set specific log levels (Debug, Info, Warn, Error) for different parts of your app independently. If your networking service is failing, you can turn its logs to `DEBUG` while keeping the rest of the system quiet.
34+
35+
---
36+
37+
## Technical Standards
38+
39+
To maintain high quality across the ecosystem, we follow strict guidelines:
40+
41+
1. **Strict Typing Simulation**: Using JSDoc for better IDE support and code clarity.
42+
2. **State Management**: Using `Features` flags to toggle experimental behaviors safely.
43+
3. **Encapsulation**: Using private class fields (`#privateField`) to prevent scope leakage.
44+
45+
## About the Author
46+
47+
This project is maintained by **pikulo-kama**. It is an open-source initiative to help the Scriptable community build more professional, reliable, and accessible automation tools for iOS.

0 commit comments

Comments
 (0)