Skip to content

Widget update #37

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 19 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
183 changes: 0 additions & 183 deletions ios_widget/Notion Block View.js

This file was deleted.

91 changes: 46 additions & 45 deletions ios_widget/README.md
Original file line number Diff line number Diff line change
@@ -1,47 +1,48 @@
# Scriptable -- Notion Block View

This is a [Scriptable](https://scriptable.app/) widget that provides basic functionality for viewing/creating/deleting Notion blocks using iOS Shortcuts.

<img src="./images/widget.jpeg" width="50%">

# Demo

I announced and released this on [my blog in this article](https://kevinjalbert.com/custom-notion-ios-widget/). A full demo of the widget is presented in the following YouTube video.

<div align="centre">
<a href="https://www.youtube.com/watch?v=atq6u7Le1JE">
<img src="https://img.youtube.com/vi/atq6u7Le1JE/0.jpg" style="width:70%;">
</a>
</div>

## Installation

To use this widget you have to do the following:

1. Acquire your `token_v2` from [Notion's web application](https://www.notion.so/).

2. (Optional) have your own [notion-toolbox server](../server) running (if the security concern of sending your token to my server scares you)

3. Install [Scriptable](https://scriptable.app/) on your iOS device

4. Install [Data Jar](https://datajar.app/) on iOS your iOS device (this is optional if you want to hardcode the notion token in the iOS Shortcuts) and put the `token_v2` value under a new `notion_token` text key.

5. Create a new script (`Notion Block View`) in Scriptable with the contents in this [file](./Notion%20Block%20View.js) and replace the `NOTION_TOKEN` with your `token_v2` value (and maybe the server url if you decided to use your own)

6. Add a Scriptable widget on your homescreen in iOS

6a. Configure the widget's _Script_ to be `Notion Block View`

6b. Configure the widget's _When Interacting_ to be `Run Script`

6c. Configure the widget's _Parameter_ to be a Notion link for a page/collection

7. Create the following iOS Shortcuts on your device (names are important and case-sensitive), you might have to change some things based on the server URL and usage of Data Jar:

7a. [Append to Notion Block (image)](./images/shortcut-append.jpeg)

7b. [Delete Notion Block (image)](./images/shortcut-delete.jpeg)

7c. [Refresh Notion Block (image)](./images/shortcut-refresh.jpeg)

8. Enjoy
This is a [Scriptable](https://scriptable.app/) widget that provides basic functionality for viewing/creating/deleting Notion blocks.

<img src="./images/widget.jpg" width="100%">

# Make README md 1611a8ff3dd64c2aae3124a5822142a2

# Description

This repository contains code and short instructions for creating a widget filled with data from your database in Notion.

«Scriptable» automatically updates the information inside the widget every 5-7 minutes.

## Brief description of the widget features:

1. Clicking on a widget - when clicked launches a main script branch that launches the Notion app
2. Text strings - contain text from one of the fields in your Notion database. When you click on the text, a branch of the main script is called, which opens the corresponding page in Notion
3. Circle before each entry - calls a script that transfers the task to the final status (for example: Done)
4. Square with a handle - The button calls Alert, with which you can create a task in the initial status.
5. Round Arrow - Forces a widget refresh.

# Installation

1. Create a new database or use [my template](https://www.notion.so/77bcd7e231d84566a2959e6abea33c2d).
1. It should be understood that the database may have:
1. Other structure
2. Other field names
3. Status names
4. And so on.
2. To do this, you will need to change the corresponding lines in the script code.
2. Follow the steps from [this instruction](https://developers.notion.com/docs)
1. At this step, it is important to save
1. Your API Token
2. Your Database ID
3. [Install Scriptable](https://apps.apple.com/ru/app/scriptable/id1405459188) from the App Store
4. Create 3 scripts in Scriptable (names are important and case-sensitive)
1. [to-do](https://github.com/homerostov/notion-toolbox/blob/master/ios_widget/to_do.js)
2. [task_done](https://github.com/homerostov/notion-toolbox/blob/master/ios_widget/task_done.js)
3. [new_task](https://github.com/homerostov/notion-toolbox/blob/master/ios_widget/new_task.js)
5. Go to [to_do](https://github.com/homerostov/notion-toolbox/blob/master/ios_widget/to_do.js#:~:text=let%20notion_token%20%3D-,%3CYour_notion_token%3E,-%3B) script and paste your Token Notion API
6. Add widget
1. Call the menu for changing the widget and specify the following parameters
1. Script: to_do
2. When interacting: Run Script
3. Parameter: [Your Database ID]
2. Click Done
7. After a few seconds, the widget will update and display pages from your Notion database
Binary file removed ios_widget/images/shortcut-append.jpeg
Binary file not shown.
Binary file removed ios_widget/images/shortcut-delete.jpeg
Binary file not shown.
Binary file removed ios_widget/images/shortcut-refresh.jpeg
Binary file not shown.
Binary file removed ios_widget/images/widget.jpeg
Binary file not shown.
Binary file added ios_widget/images/widget.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
58 changes: 58 additions & 0 deletions ios_widget/new_task.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
let alert = new Alert()
alert.title = "New Task"
alert.addTextField();
alert.addAction("Add Task");
alert.addCancelAction("Cancel")
await alert.presentAlert();
let task = alert.textFieldValue(0)
if (task){

let req = new Request("https://api.notion.com/v1/pages");
req.method = "post";
req.headers = {
'Authorization': 'Bearer '+ args.queryParameters.token,
'Notion-Version': '2021-08-16',
"Content-Type": "application/json"
};

req.body = JSON.stringify({
"parent": {
"database_id": args.queryParameters.parent_id
},
"properties": {
"State": {
"type": "select",
"select": {
"name": "Open"
}
},
"Name": {
"title": [
{
"text": {
"content": task
}
}
]
}
}
});

const res = await req.loadJSON()

let refresh = new CallbackURL("scriptable:///run/")
refresh.addParameter("scriptName", "to_do")
refresh.addParameter("limit" , args.queryParameters.limit.toString())
refresh.addParameter("parent_id", args.queryParameters.parent_id.toString())
refresh.open()

}
else {
App.close()
}
function get_week(date){
var oneJan = new Date(date.getFullYear(),0,1);
var numberOfDays = Math.floor((date - oneJan) / (24 * 60 * 60 * 1000));
var resultq = Math.ceil(( date.getDay() + 1 + numberOfDays) / 7);
return resultq;
}
26 changes: 26 additions & 0 deletions ios_widget/task_done.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
let req = new Request("https://api.notion.com/v1/pages/" + args.queryParameters.id);
req.method = "PATCH";
req.headers = {
'Authorization': 'Bearer ' + args.queryParameters.token,
'Notion-Version': '2021-08-16',
"Content-Type": "application/json"
};

req.body = JSON.stringify({
"properties":{
"State":{
"select":{
"name":"Done"
}
}
}
});

const res = await req.loadJSON()


let refresh = new CallbackURL("scriptable:///run/")
refresh.addParameter("scriptName", "to_do")
refresh.addParameter("limit" , args.queryParameters.limit.toString())
refresh.addParameter("parent_id", args.queryParameters.parent_id.toString())
refresh.open()
Loading