// This widget was created by Max Zeryck @mzeryck | |
/* | |
You can't add commit messages to gists, so I just want to say thanks to everyone who has used, modified, | |
and enjoyed this script. This version adds support for the iPhone 12 mini, thanks to arealhen for providing | |
a screenshot, and mintakka for a temporary solution. | |
*/ | |
// Widgets are unique based on the name of the script. | |
const filename = Script.name() + ".jpg" | |
const files = FileManager.local() | |
const path = files.joinPath(files.documentsDirectory(), filename) | |
if (config.runsInWidget) { | |
let widget = new ListWidget() | |
widget.backgroundImage = files.readImage(path) | |
// You can your own code here to add additional items to the "invisible" background of the widget. | |
Script.setWidget(widget) | |
Script.complete() | |
/* | |
* The code below this comment is used to set up the invisible widget. | |
* =================================================================== | |
*/ | |
} else { | |
// Determine if user has taken the screenshot. | |
var message | |
message = "Before you start, go to your home screen and enter wiggle mode. Scroll to the empty page on the far right and take a screenshot." | |
let exitOptions = ["Continue","Exit to Take Screenshot"] | |
let shouldExit = await generateAlert(message,exitOptions) | |
if (shouldExit) return | |
// Get screenshot and determine phone size. | |
let img = await Photos.fromLibrary() | |
let height = img.size.height | |
let phone = phoneSizes()[height] | |
if (!phone) { | |
message = "It looks like you selected an image that isn't an iPhone screenshot, or your iPhone is not supported. Try again with a different image." | |
await generateAlert(message,["OK"]) | |
return | |
} | |
// Extra setup needed for 2436-sized phones. | |
if (height == 2436) { | |
let cacheName = "mz-phone-type" | |
let cachePath = files.joinPath(files.libraryDirectory(), cacheName) | |
// If we already cached the phone size, load it. | |
if (files.fileExists(cachePath)) { | |
let typeString = files.readString(cachePath) | |
phone = phone[typeString] | |
// Otherwise, prompt the user. | |
} else { | |
message = "What type of iPhone do you have?" | |
let types = ["iPhone 12 mini", "iPhone 11 Pro, XS, or X"] | |
let typeIndex = await generateAlert(message, types) | |
let type = (typeIndex == 0) ? "mini" : "x" | |
phone = phone[type] | |
files.writeString(cachePath, type) | |
} | |
} | |
// Prompt for widget size and position. | |
message = "What size of widget are you creating?" | |
let sizes = ["Small","Medium","Large"] | |
let size = await generateAlert(message,sizes) | |
let widgetSize = sizes[size] | |
message = "What position will it be in?" | |
message += (height == 1136 ? " (Note that your device only supports two rows of widgets, so the middle and bottom options are the same.)" : "") | |
// Determine image crop based on phone size. | |
let crop = { w: "", h: "", x: "", y: "" } | |
if (widgetSize == "Small") { | |
crop.w = phone.small | |
crop.h = phone.small | |
let positions = ["Top left","Top right","Middle left","Middle right","Bottom left","Bottom right"] | |
let position = await generateAlert(message,positions) | |
// Convert the two words into two keys for the phone size dictionary. | |
let keys = positions[position].toLowerCase().split(' ') | |
crop.y = phone[keys[0]] | |
crop.x = phone[keys[1]] | |
} else if (widgetSize == "Medium") { | |
crop.w = phone.medium | |
crop.h = phone.small | |
// Medium and large widgets have a fixed x-value. | |
crop.x = phone.left | |
let positions = ["Top","Middle","Bottom"] | |
let position = await generateAlert(message,positions) | |
let key = positions[position].toLowerCase() | |
crop.y = phone[key] | |
} else if(widgetSize == "Large") { | |
crop.w = phone.medium | |
crop.h = phone.large | |
crop.x = phone.left | |
let positions = ["Top","Bottom"] | |
let position = await generateAlert(message,positions) | |
// Large widgets at the bottom have the "middle" y-value. | |
crop.y = position ? phone.middle : phone.top | |
} | |
// Crop image and finalize the widget. | |
let imgCrop = cropImage(img, new Rect(crop.x,crop.y,crop.w,crop.h)) | |
message = "Your widget background is ready. Would you like to use it as this script's background, or export the image for use in a different script or another widget app?" | |
const exportPhotoOptions = ["Use for this script","Export to Photos","Export to Files"] | |
const exportPhoto = await generateAlert(message,exportPhotoOptions) | |
if (exportPhoto == 0) { | |
files.writeImage(path,imgCrop) | |
} else if (exportPhoto == 1) { | |
Photos.save(imgCrop) | |
} else if (exportPhoto == 2) { | |
await DocumentPicker.exportImage(imgCrop) | |
} | |
Script.complete() | |
} | |
// Generate an alert with the provided array of options. | |
async function generateAlert(message,options) { | |
let alert = new Alert() | |
alert.message = message | |
for (const option of options) { | |
alert.addAction(option) | |
} | |
let response = await alert.presentAlert() | |
return response | |
} | |
// Crop an image into the specified rect. | |
function cropImage(img,rect) { | |
let draw = new DrawContext() | |
draw.size = new Size(rect.width, rect.height) | |
draw.drawImageAtPoint(img,new Point(-rect.x, -rect.y)) | |
return draw.getImage() | |
} | |
// Pixel sizes and positions for widgets on all supported phones. | |
function phoneSizes() { | |
let phones = { | |
// 12 Pro Max | |
"2778": { | |
small: 510, | |
medium: 1092, | |
large: 1146, | |
left: 96, | |
right: 678, | |
top: 246, | |
middle: 882, | |
bottom: 1518 | |
}, | |
// 12 and 12 Pro | |
"2532": { | |
small: 474, | |
medium: 1014, | |
large: 1062, | |
left: 78, | |
right: 618, | |
top: 231, | |
middle: 819, | |
bottom: 1407 | |
}, | |
// 11 Pro Max, XS Max | |
"2688": { | |
small: 507, | |
medium: 1080, | |
large: 1137, | |
left: 81, | |
right: 654, | |
top: 228, | |
middle: 858, | |
bottom: 1488 | |
}, | |
// 11, XR | |
"1792": { | |
small: 338, | |
medium: 720, | |
large: 758, | |
left: 54, | |
right: 436, | |
top: 160, | |
middle: 580, | |
bottom: 1000 | |
}, | |
// 11 Pro, XS, X, 12 mini | |
"2436": { | |
x: { | |
small: 465, | |
medium: 987, | |
large: 1035, | |
left: 69, | |
right: 591, | |
top: 213, | |
middle: 783, | |
bottom: 1353, | |
}, | |
mini: { | |
small: 465, | |
medium: 987, | |
large: 1035, | |
left: 69, | |
right: 591, | |
top: 231, | |
middle: 801, | |
bottom: 1371, | |
} | |
}, | |
// Plus phones | |
"2208": { | |
small: 471, | |
medium: 1044, | |
large: 1071, | |
left: 99, | |
right: 672, | |
top: 114, | |
middle: 696, | |
bottom: 1278 | |
}, | |
// SE2 and 6/6S/7/8 | |
"1334": { | |
small: 296, | |
medium: 642, | |
large: 648, | |
left: 54, | |
right: 400, | |
top: 60, | |
middle: 412, | |
bottom: 764 | |
}, | |
// SE1 | |
"1136": { | |
small: 282, | |
medium: 584, | |
large: 622, | |
left: 30, | |
right: 332, | |
top: 59, | |
middle: 399, | |
bottom: 399 | |
}, | |
// 11 and XR in Display Zoom mode | |
"1624": { | |
small: 310, | |
medium: 658, | |
large: 690, | |
left: 46, | |
right: 394, | |
top: 142, | |
middle: 522, | |
bottom: 902 | |
}, | |
// Plus in Display Zoom mode | |
"2001" : { | |
small: 444, | |
medium: 963, | |
large: 972, | |
left: 81, | |
right: 600, | |
top: 90, | |
middle: 618, | |
bottom: 1146 | |
}, | |
} | |
return phones | |
} |
This comment has been minimized.
This comment has been minimized.
Very nice! One issue I noticed on my ancient iPhone 8 Plus is that the image aligns a couple of pixels too much on the left. |
This comment has been minimized.
This comment has been minimized.
@janik6n The Plus was the hardest phone to find screenshots of! I would be happy to fix it if you're willing to take a screenshot like the one linked here - basically, three small widgets in a diagonal pattern (they can be any widgets, so long as they contrast with the background). |
This comment has been minimized.
This comment has been minimized.
Nice one, |
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
@janik6n Huh, I'm getting the same width/height values from that screenshot. Please feel free to message me on Twitter (same @) if you are willing to troubleshoot further -- I'm wondering if the Plus is weird because it's the only iPhone that downsamples the entire display. |
This comment has been minimized.
This comment has been minimized.
I’m also getting an image with a few columns of blank pixels on the fidget side of the image. I can send a screenshot tomorrow |
This comment has been minimized.
This comment has been minimized.
@mzeryck I figured it out. As a user, when setting a wallpaper, I need to set the Perspective zoom OFF. That was messing with the dimensions. |
This comment has been minimized.
This comment has been minimized.
I have perspective zoom off and my image is still a bit shifted |
This comment has been minimized.
This comment has been minimized.
Hi, I took a screenshot of my empty home page (perspective zoom: off), copied the code into scriptable, and pressed run. It came up with the prompt to add a screenshot and I did. But it says my phone or the image isn’t compatible. ): any help would be appreciated. Edit: I have an iPhone 8 plus |
This comment has been minimized.
This comment has been minimized.
@alekhat I think the update I just posted should work now - let me know if it doesn't! |
This comment has been minimized.
This comment has been minimized.
THANK YOU SO MUCH! This is perfect |
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
@tslagle13 That is perfect, thank you so much! I just added 12 and 12 Pro support thanks to you, really appreciate it. |
This comment has been minimized.
This comment has been minimized.
I use the latest script on iphone 11 pro max, even I have turned off the perspective zoom and regardless how many images I use to try, there is always a white line at the right side of the widget. is it a bug in the script or any settings i need to do on widgetsmith? it only happen for the medium size widget, no problem with the large size widget. |
This comment has been minimized.
This comment has been minimized.
@spikeyhair This is a bug in Widgetsmith. For some reason, horizontal images don't fill the entire widget, leaving a white line at the edge. It works for small and large widgets because they're square. Please feel free to submit feedback to the developer (it's in Widgetsmith > Settings > Contact & Help) about this issue, although it's an app made by just one developer so he may not be able to respond. |
This comment has been minimized.
This comment has been minimized.
@ mzeryck Hey Max, your widget is really good!!! However, I have problems at "weather calendar widget builder” and always get the following hint: 2020-11-08 17:09:55: Error on line 769:51: TypeError: undefined is not an object (evaluating 'weatherDataRaw.current.temp') Can you help meines me? I’m looking forward to a feedback. |
This comment has been minimized.
This comment has been minimized.
Hey there Max, congratulations for such amazing script! We are building a similar feature in one of our apps. Digging a bit, I'm not sure if you guys support iPhone 12 Pro Max (1284 x 2778), so maybe this is helpful:
Feel free to correct me if I'm wrong. Once again awesome job and awesome app @simonbs! |
This comment has been minimized.
This comment has been minimized.
@idec Oh my gosh, thank you so much! My Pro Max arrives later today and I've been anxious to update the script. Really appreciate it! |
This comment has been minimized.
This comment has been minimized.
I just got my iPhone 12 mini, is there going to be an update for this design? |
This comment has been minimized.
This comment has been minimized.
@StratosHF The most recent version of this gist does have 12 mini support! Please let me know if you have any issues with it. |
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
@StratosHF When you ran the script, did it prompt you to select your phone type, like this: If it didn't, that means your script is on an older version. You'd just need to copy the code from the very top of this page. |
This comment has been minimized.
This comment has been minimized.
That fixed it, not sure how I got the wrong script, but thank you for pointing out my mistake. Works perfectly! |
This comment has been minimized.
This comment has been minimized.
@StratosHF Don't worry about it, I'm glad it works now! :) |
This comment has been minimized.
This comment has been minimized.
Just wanted to confirm that this works nicely on 12 Pro Max! Once again, great work |
This comment has been minimized.
This comment has been minimized.
I got the calendar working but i cant make it to the transparent part? I think im lost!!! |
This comment has been minimized.
This comment has been minimized.
@arlon8taruc When you copy and paste the code into a script, and press Run, it should guide you through the process. At the end, it will make an image. You can use that image as the background for any widget, making that widget appear "transparent". Does that help? |
This comment has been minimized.
This comment has been minimized.
I’ve noticed that the ‘transparent’ widget background created from this script has slightly lower image quality than the actual wallpaper background (edges are noticeably blurrier), possibly due to jpeg compression. Is there currently any way to fix this by preserving the original image quality? FWIW, running it in a 12 Pro Max. |
This comment has been minimized.
This comment has been minimized.
@david-zou If you save the exported image to Photos or Files, you'll see that the script does export at full resolution - it's just that all Scriptable widgets reduce the resolution of background images. I'm not sure why. You can see this if you use one of these backgrounds in a different widget app, they'll appear sharper. |
This comment has been minimized.
This comment has been minimized.
How to display week language as zh_CN? |
This comment has been minimized.
This comment has been minimized.
@08ggininder I'm guessing you're asking about Weather Cal, which version do you have? There are text settings for all of the hard-coded words on the widget that you can edit. |
This comment has been minimized.
This comment has been minimized.
How do I get the scriptable image processor JS file to work with iPhone 12 Pro Max? I like the blue backgrounds and this is just for clear. What would I have to add to the other to make it function with 12 pro Max? Thanks! |
This comment has been minimized.
This comment has been minimized.
Is it possible to automate the steps to complete this script (i.e. the jiggle mode, screenshot, widget size, transparency, option)? I’ve dabbled in setting my wallpaper through Automation (changes daily), and I think it’s be really cool to incorporate this into it! I guess your Weather Cal widget would also need to be incorporated for it to work too. Anyways, just a thought! Great scripts mate! It literally changed the way I use my iPhone on a daily basis! |
This comment has been minimized.
This comment has been minimized.
@yung40oz84 The most recent version should work with the 12 Pro Max! @behns13 Thanks, I'm glad you enjoy it! With that new calendar automation stuff I am definitely thinking about ways to integrate into Weather Cal - wallpaper changes for Dark Mode have been requested many times, so check the GitHub page hopefully sometime this week while I'm on vacation! :) |
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
@mzeryck this is really an excellent widget. Is there any chance you would consider adding a permissive license such as MIT to it just so other developers could get clarity? Regardless - huge fan of this (wish Apple would've included it out of the box!). Thanks. |
This comment has been minimized.
I tweaked the script a bit to make it export either to the Files app or Photos. I prefer this over the hard coded path it exported to before. It’s just a personal preference but I’ll share my updated script here for anyone who might be interested.