Mirrors/pebble
1
0
Fork 0
mirror of https://github.com/google/pebble.git synced 2025-05-31 15:33:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Import the pebble dev site into devsite/

Browse source
This commit is contained in:
Katharine Berry 2025-02-17 17:02:33 -08:00
parent 3b92768480
commit 527858cf4c
1359 changed files with 265431 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

428
devsite/js-docs/pkjs/Pebble.js Normal file
View file

@ -0,0 +1,428 @@
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* @namespace Pebble
*
* @desc The Pebble namespace is where all of the Pebble specific methods and
* properties exist. This class contains methods belonging to PebbleKit JS and
* allows bi-directional communication with a C or JavaScript watchapp, as well as managing
* the user's timeline subscriptions, creating AppGlance slices and obtaining
* information about the currently connected watch.
*/
var Pebble = new Object;
/**
* @desc Adds a listener for PebbleKit JS events, such as when an ``AppMessage`` is
* received or the configuration view is opened or closed.
*
* #### Event Type Options
*
* Possible values:
*
* * `ready` - The watchapp has been launched and the PebbleKit JS component
* is now ready to receive events.
* * `appmessage` - The watch sent an ``AppMessage`` to PebbleKit JS. The
* AppMessage ``Dictionary`` is contained in the payload property (i.e:
* `event.payload`). The payload consists of key-value pairs, where the keys
* are strings containing integers (e.g: "0"), or aliases for keys defined
* in package.json (e.g: "KEY_EXAMPLE"). Values should be integers, strings
* or byte arrays (arrays of characters). This event is not available to
* {@link /docs/rockyjs/ Rocky.js} applications, and attempting to register it will throw an exception.
* * `showConfiguration` - The user has requested the app's configuration
* webview to be displayed. This can occur either upon the app's initial
* install or when the user taps 'Settings' in the 'My Pebble' view within
* the phone app.
* * `webviewclosed` - The configuration webview was closed by the user. If
* the webview had a response, it will be contained in the response property
* (i.e: `event.response`). This response can be used to feed back user
* preferences to the watchapp.
* * `message` - Provide a {@link #PostMessageCallback PostMessageCallback}
* as the callback. The message event is emitted every time PebbleKit JS
* receives a {@link #postMessage postMessage} from the {@link /docs/rockyjs/ Rocky.js}
* application. The payload contains a simple JavaScript object. (i.e. `event.data`).
* This event type can only be used with {@link /docs/rockyjs/ Rocky.js} applications.
* * `postmessageconnected` - Provide a {@link #PostMessageConnectedCallback PostMessageConnectedCallback}
* as the callback. The event may be emitted immediately upon subscription,
* if the subsystem is already connected. It is also emitted when connectivity is established.
* This event type can only be used with {@link /docs/rockyjs/ Rocky.js} applications.
* * `postmessagedisconnected` - Provide a {@link #PostMessageDisconnectedCallback PostMessageDisconnectedCallback}
* as the callback. The event may be emitted immediately upon subscription,
* if the subsystem is already disconnected. It is also emitted when connectivity is lost.
* This event type can only be used with {@link /docs/rockyjs/ Rocky.js} applications.
* * `postmessageerror` - Provide a {@link #PostMessageErrorCallback PostMessageErrorCallback}
* as the callback. The event is emitted when a transmission error occurrs.
* Your message has not been delivered. The type of error is not provided.
* This event type can only be used with {@link /docs/rockyjs/ Rocky.js} applications.
*
* @param {String} type - The type of the event, from the list described above.
* @param {EventCallback} callback - The developer defined {@link #EventCallback EventCallback}
* to receive any events of the type specified that occur.
*/
Pebble.addEventListener = function(type, callback) { };
/**
* @desc Attaches an event handler to the specified events. Synonymous with
[Pebble.addEventListener()](#addEventListener). Only applicable to
{@link /docs/rockyjs/ Rocky.js} applications.
*
* `Pebble.on(type, callback);`
*
* @param {String} type - The type of the event, from the list described above.
* @param {EventCallback} callback - The developer defined {@link #EventCallback EventCallback}
* to receive any events of the type specified that occur.
*/
Pebble.on = function(type, callback) { };
/**
* @desc Remove an existing event listener previously registered with
* [Pebble.addEventListener()](#addEventListener) or [Pebble.on()](#on).
*
* @param {String} type - The type of the event listener to be removed. See
* [Pebble.addEventListener()](#addEventListener) for a list of available event types.
* @param {Function} callback - The existing developer-defined function that was
* previously registered.
*/
Pebble.removeEventListener = function(type, callback) { };
/**
* @desc Remove an existing event handler from the specified events. Synonymous
* with [Pebble.removeEventListener()](#removeEventListener). Only applicable to
* {@link /docs/rockyjs/ Rocky.js} applications.
*
* `Pebble.off(type, callback);`
*
* @param {String} type - The type of the event listener to be removed. See
* [Pebble.addEventListener()](#addEventListener) for a list of available types.
* @param {Function} callback - The existing developer-defined function that was
* previously registered.
*/
Pebble.off = function(type, callback) { };
/**
* @desc Show a simple modal notification on the connected watch.
*
* @param {String} title - The title of the notification
* @param {String} body - The main content of the notification
*/
Pebble.showSimpleNotificationOnPebble = function(title, body) { };
/**
* @desc Send an AppMessage to the app running on the watch. Messages should be
* in the form of JSON objects containing key-value pairs. See
* Pebble.sendAppMessage() for valid key and value data types.
* `Pebble.sendAppMessage = function(data, onSuccess, onFailure) { };`
* Please note that `sendAppMessage` is `undefined` in
* {@link /docs/rockyjs/ Rocky.js} applications, see {@link #postMessage postMessage} instead.
*
* @returns {Number} The transaction id for this message
*
* @param {Object} data - A JSON object containing key-value pairs to send to
* the watch. Values in arrays that are greater then 255 will be mod 255
* before sending.
* @param {AppMessageAckCallback} onSuccess - A developer-defined {@link #AppMessageAckCallback AppMessageAckCallback}
* callback to run if the watch acknowledges (ACK) this message.
* @param {AppMessageOnFailure} onFailure - A developer-defined {@link #AppMessageNackCallback AppMessageNackCallback}
* callback to run if the watch does NOT acknowledge (NACK) this message.
*/
Pebble.sendAppMessage = function(data, onSuccess, onFailure) { };
/**
* @desc Sends a message to the {@link /docs/rockyjs/ Rocky.js} component. Please be aware
* that messages should be kept concise. Each message is queued, so
* `postMessage()` can be called multiple times immediately. If there is a momentary loss of connectivity, queued
* messages may still be delivered, or automatically removed from the queue
* after a few seconds of failed connectivity. Any transmission failures, or
* out of memory errors will be raised via the `postmessageerror` event.
*
* `Pebble.postMessage({temperature: 30, conditions: 'Sunny'});`
*
* @param {Object} data - A {@link #PostMessageCallback PostMessageCallback} containing
* the data to deliver to the watch.
* This will be received in the `data` field of the `type` delivered to
* the `on('message', ...)` handler.
*/
Pebble.postMessage = function(data) { };
/**
* @desc Get the user's timeline token for this app. This is a string and is
* unique per user per app. Note: In order for timeline tokens to be
* available, the app must be submitted to the Pebble appstore, but does not
* need to be public. Read more in the
* {@link /guides/pebble-timeline/timeline-js/ timeline guides}.
*
* @param {TimelineTokenCallback} onSuccess - A developer-defined {@link #TimelineTokenCallback TimelineTokenCallback}
* callback to handle a successful attempt to get the timeline token.
* @param {Function} onFailure - A developer-defined callback to handle a
* failed attempt to get the timeline token.
*/
Pebble.getTimelineToken = function(onSuccess, onFailure) { };
/**
* @desc Subscribe the user to a timeline topic for your app. This can be used
* to filter the different pins a user could receive according to their
* preferences, as well as maintain groups of users.
*
* @param {String} topic - The desired topic to be subscribed to. Users will
* receive all pins pushed to this topic.
* @param {Function} onSuccess - A developer-defined callback to handle a
* successful subscription attempt.
* @param {Function} onFailure - A developer-defined callback to handle a
* failed subscription attempt.
*/
Pebble.timelineSubscribe = function(topic, onSuccess, onFailure) { };
/**
* @desc Unsubscribe the user from a timeline topic for your app. Once
* unsubscribed, the user will no longer receive any pins pushed to this
* topic.
*
* @param {String} topic - The desired topic to be unsubscribed from.
* @param {Function} onSuccess - A developer-defined callback to handle a
* successful unsubscription attempt.
* @param {Function} onFailure - A developer-defined callback to handle a
* failed unsubscription attempt.
*/
Pebble.timelineUnsubscribe = function(topic, onSuccess, onFailure) { };
/**
* @desc Obtain a list of topics that the user is currently subscribed to. The
* length of the list should be checked to determine whether the user is
* subscribed to at least one topic.
*
* `Pebble.timelineSubscriptions(function(topics) { console.log(topics); }, function() { console.log('error'); } );`
*
* @param {TimelineTopicsCallback} onSuccess - The developer-defined function to process the
* retuned list of topic strings.
* @param {Function} onFailure - The developer-defined function to gracefully
* handle any errors in obtaining the user's subscriptions.
*/
Pebble.timelineSubscriptions = function(onSuccess, onFailure) { };
/**
* @desc Obtain an object containing information on the currently connected
* Pebble smartwatch.
*
* **Note:** This function is only available when using the Pebble Time
* smartphone app. Check out our guide on {@link /guides/communication/using-pebblekit-js Getting Watch Information}
* for details on how to use this function.
*
* @returns {WatchInfo} A {@link #WatchInfo WatchInfo} object detailing the
* currently connected Pebble watch.
*/
Pebble.getActiveWatchInfo = function() { };
/**
* @desc Returns a unique account token that is associated with the Pebble
* account of the current user.
*
* **Note:** The behavior of this changed slightly in SDK 3.0. Read the
* {@link /guides/migration/migration-guide-3/ Migration Guide} to learn the
* details and how to adapt older tokens.
*
* @returns {String} A string that is guaranteed to be identical across devices
* if the user owns several Pebble or several mobile devices. From the
* developer's perspective, the account token of a user is identical across
* platforms and across all the developer's watchapps. If the user is not
* logged in, this function will return an empty string ('').
*/
Pebble.getAccountToken = function() { };
/**
* @desc Returns a a unique token that can be used to identify a Pebble device.
*
* @returns {String} A string that is is guaranteed to be identical for each
* Pebble device for the same app across different mobile devices. The token
* is unique to your app and cannot be used to track Pebble devices across
* applications.
*/
Pebble.getWatchToken = function() { };
/**
* @desc Triggers a reload of the app glance which first clears any existing
* slices and then adds the provided slices.
*
* @param {AppGlanceSlice} appGlanceSlices - {@link #AppGlanceSlice AppGlanceSlice}
* JSON objects to add to the app glance.
* @param {AppGlanceReloadSuccessCallback} onSuccess - The developer-defined
* callback which is called if the reload operation succeeds.
* @param {AppGlanceReloadFailureCallback} onFailure - The developer-defined
* callback which is called if the reload operation fails.
*/
Pebble.appGlanceReload = function(appGlanceSlices, onSuccess, onFailure) { };
/**
* @desc When an app is marked as configurable, the PebbleKit JS component must
* implement `Pebble.openURL()` in the `showConfiguration` event handler. The
* Pebble mobile app will launch the supplied URL to allow the user to configure
* the watchapp or watchface. See the
* {@link /guides/user-interfaces/app-configuration-static/ App Configuration guide}.
*
* @param {String} url - The URL of the static configuration page.
*/
Pebble.openURL = function(url) { };
/**
* @typedef {Function} AppGlanceReloadSuccessCallback
* @memberof Pebble
*
* @desc Called when AppGlanceReload is successful.
* @param {AppGlanceSlice} AppGlanceSlices - An {@link #AppGlanceSlice AppGlanceSlice} object
* containing the app glance slices.
*/
/**
* @typedef {Function} AppGlanceReloadFailureCallback
* @memberof Pebble
*
* @desc Called when AppGlanceReload has failed.
* @param {AppGlanceSlice} AppGlanceSlices - An {@link #AppGlanceSlice AppGlanceSlice} object
* containing the app glance slices.
*/
/**
* @typedef {Function} AppMessageAckCallback
* @memberof Pebble
*
* @desc Called when an AppMessage is acknowledged by the watch.
* @param {Object} data - An object containing the callback data. This contains
* the `transactionId` which is the transaction ID of the message.
*/
/**
* @typedef {Function} AppMessageNackCallback
* @memberof Pebble
*
* @desc Called when an AppMessage is not acknowledged by the watch.
* @param {Object} data - An object containing the callback data. This contains
* the `transactionId` which is the transaction ID of the message
* @param {String} error - The error message
*/
/**
* @typedef {Function} EventCallback
* @memberof Pebble
*
* @desc Called when an event of any type previously registered occurs. The
* parameters are different depending on the type of event, shown in
* brackets for each parameter listed here.
* @param {Object} event - An object containing the event information, including:
* * `type` - The type of event fired, from the list in the description of [Pebble.addEventListener()](#addEventListener).
* * `payload` - The dictionary sent over ``AppMessage`` consisting of
* key-value pairs. *This field only exists for `appmessage` events.*
* * `response` - The contents of the URL navigated to when the
* configuration page was closed, after the anchor. This may be encoded,
* which will require use of decodeURIComponent() before reading as an
* object. *This field only exists for for `webviewclosed` events.*
*/
/**
* @typedef {Function} TimelineTokenCallback
* @memberof Pebble
*
* @desc Called when the user's timeline token is available.
* @param {String} token - The user's token.
*/
/**
* @typedef {Function} TimelineTopicsCallback
* @memberof Pebble
*
* @desc Called when the user's list of subscriptions is available for processing by the developer.
* @param {[String]} List of topic strings that the user is subscribed to
*/
/**
* @typedef {Function} PostMessageCallback
* @memberof Pebble
*
* @desc The callback function signature to be used with the `message`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
* * `data` - The data sent within the message.
*/
/**
* @typedef {Function} PostMessageErrorCallback
* @memberof Pebble
*
* @desc The callback function signature to be used with the `postmessageerror`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
* * `data` - The data failed to send within the message.
*/
/**
* @typedef {Function} PostMessageConnectedCallback
* @memberof Pebble
*
* @desc The callback function signature to be used with the `postmessageconnected`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
*/
/**
* @typedef {Function} PostMessageDisconnectedCallback
* @memberof Pebble
*
* @desc The callback function signature to be used with the `postmessagedisconnected`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
*/
/**
* @typedef {Object} WatchInfo
* @memberof Pebble
*
* @desc Provides information about the connected Pebble smartwatch.
*
* @property {String} platform - The hardware platform, such as `basalt` or `emery`.
* @property {String} model - The watch model, such as `pebble_black`
* @property {String} language - The user's currently selected language on
* this watch.
* @property {Object} firmware - An object containing information about the
* watch's firmware version, including:
* * `major` - The major version
* * `minor` - The minor version
* * `patch` - The patch version
* * `suffix` - Any additional version information, such as `beta3`
*/
/**
* @typedef {Object} AppGlanceSlice
* @memberof Pebble
*
* @desc The structure of an app glance.
*
* @property {String} expirationTime - Optional ISO date-time string of when
the entry should expire and no longer be shown in the app glance.
* @property {Object} layout - An object containing:
* * `icon` - URI string of the icon to display in the app glance, e.g. system://images/ALARM_CLOCK.
* * `subtitleTemplateString` - Template string that will be displayed in the subtitle of the app glance.
*/

377
devsite/js-docs/rocky/CanvasRenderingContext2D.js Normal file
View file

@ -0,0 +1,377 @@
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* @namespace CanvasRenderingContext2D
* @desc The CanvasRenderingContext2D interface is used for drawing
* rectangles, text, images and other objects onto the canvas element. It
* provides the 2D rendering context for the drawing on the device's display.
*
* The canvas uses a standard x and y
* {@link https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes coordinate system}.
*
* The `CanvasRenderingContext2D` object is obtained as a parameter in the
* {@link /docs/rockyjs/rocky#on rocky.on('draw', ...)} event.
*
* `rocky.on('draw', function(drawEvent) {<br>&nbsp;&nbsp;var ctx = drawEvent.context;<br>});`
*
* The state of pixels is maintained between each draw, so developers are
* responsible for clearing an area, before drawing again.
*
* Please note that this API is still in development and there may be some
* limitations, which are documented below. We will also be adding support
* for more common APIs in future releases.
*/
var CanvasRenderingContext2D = {
/**
* @typedef {Object} TextMetrics
* @desc The TextMetrics interface represents the dimensions of a text
* in the canvas (display), as created by {@link #measureText measureText}.
*
* @property {Number} width - Calculated width of text in pixels.
* @property {Number} height - Calculated height of text in pixels.
*/
/**
* @typedef {Object} Canvas
* @desc Provides information about the device's canvas (display). This is not
* actually a DOM element, it is provided for standards compliance only.
*
* `rocky.on('draw', function(drawEvent) {<br>&nbsp;&nbsp;var ctx = drawEvent.context;<br>&nbsp;&nbsp;var h = ctx.canvas.unobstructedHeight;<br>});`
*
* @property {Number} clientWidth - The full width of the canvas.
* @property {Number} clientHeight - The full height of the canvas.
* @property {Number} unobstructedWidth - The width of the canvas that is not
* obstructed by system overlays (Timeline Quick View).
* @property {Number} unobstructedHeight - The height of the canvas that is
* not obstructed by system overlays (Timeline Quick View).
*/
/**
* @desc Specifies the color to use inside shapes. The default is
* `#000` (black).
*
* #### Options
*
* Possible values:
*
* * Most (but not all) CSS color names. e.g. `blanchedalmond`
* * Pebble color names. e.g. `shockingpink`
* * Hex color codes, short and long. e.g. `#FFFFFF` or `#FFF`
*
* Please note that we currently only support solid colors. You may specifiy
* `transparent` or `clear` for transparency, but we do do not support
* partial transparency or the `#RRGGBBAA` notation yet.
*
* `ctx.fillStyle = 'white';`
*
*/
fillStyle,
/**
* @desc Specifies the color to use for lines around shapes. The
* default is `#000` (black).
*
* #### Options
*
* Possible values:
*
* * Most (but not all) CSS color names. e.g. `blanchedalmond`
* * Pebble color names. e.g. `shockingpink`
* * Hex color codes, short and long. e.g. `#FFFFFF` or `#FFF`
*
* Please note that we currently only support solid colors. You may specifiy
* `transparent` or `clear` for transparency, but we do do not support
* partial transparency or the `#RRGGBBAA` notation yet.
*
* `ctx.strokeStyle = 'red';`
*
*/
strokeStyle,
/**
* @desc A {@link #Canvas Canvas} object containing information about
* the system's canvas (display).
*/
canvas,
/**
* @desc The width of lines drawn (to the nearest integer) with the
* context (`1.0` by default).
*
* `ctx.lineWidth = 8;`
*
*/
lineWidth,
/**
* @desc Specifies the current text style being used when drawing text.
* Although this string uses the same syntax as a CSS font specifier, you
* cannot specifiy arbitrary values and you must only use one of the values below.
*
* The default font is `14px bold Gothic`.
*
* `ctx.font = '28px bold Droid-serif';`
*
* #### Options
*
* Possible values:
*
* * `18px bold Gothic`
* * `14px Gothic`
* * `14px bold Gothic`
* * `18px Gothic`
* * `24px Gothic`
* * `24px bold Gothic`
* * `28px Gothic`
* * `28px bold Gothic`
* * `30px bolder Bitham`
* * `42px bold Bitham`
* * `42px light Bitham`
* * `42px Bitham-numeric`
* * `34px Bitham-numeric`
* * `21px Roboto`
* * `49px Roboto-subset`
* * `28px bold Droid-serif`
* * `20px bold Leco-numbers`
* * `26px bold Leco-numbers-am-pm`
* * `32px bold numbers Leco-numbers`
* * `36px bold numbers Leco-numbers`
* * `38px bold numbers Leco-numbers`
* * `42px bold numbers Leco-numbers`
* * `28px light numbers Leco-numbers`
*/
font,
/**
* @desc Specifies the current text alignment being used when drawing
* text. Beware that the alignment is based on the x-axis coordinate value of
* the {@link #fillText CanvasRenderingContext2D.fillText} method.
*
* `ctx.textAlign = 'center';`
*
* #### Options
*
* Possible values:
*
* * `left` - The text is left-aligned
* * `right` - The text is right-aligned
* * `center` - The text is center-aligned
* * `start` (default) - The text is aligned left, unless using a
* right-to-left language. Currently only left-to-right is supported.
* * `end` - The text is aligned right, unless using a right-to-left
* language. Currently only left-to-right is supported.
*/
textAlign
};
/**
* @desc Sets all pixels in the rectangle at (`x`,`y`) with size
* (`width`, `height`) to black, erasing any previously drawn content.
*
* `ctx.clearRect(0, 0, 144, 168);`
*
* @param {Number} x - The x-axis coordinate of the rectangle's starting point
* @param {Number} y - The y-axis coordinate of the rectangle's starting point
* @param {Number} width - The rectangle's width
* @param {Number} height - The rectangle's height
*/
CanvasRenderingContext2D.clearRect = function(x, y, width, height) { };
/**
* @desc Draws a filled rectangle at (`x`,`y`) with size (`width`, `height`),
* using the current fill style.
*
* `ctx.fillRect(0, 30, 144, 30);`
*
* @param {Number} x - The x-axis coordinate of the rectangle's starting point
* @param {Number} y - The y-axis coordinate of the rectangle's starting point
* @param {Number} width - The rectangle's width
* @param {Number} height - The rectangle's height
*/
CanvasRenderingContext2D.fillRect = function(x, y, width, height) { };
/**
* @desc Paints a rectangle at (`x`,`y`) with size (`width`, `height`),
* using the current stroke style.
*
* `ctx.strokeRect(0, 30, 144, 30);`
*
* @param {Number} x - The x-axis coordinate of the rectangle's starting point
* @param {Number} y - The y-axis coordinate of the rectangle's starting point
* @param {Number} width - The rectangle's width
* @param {Number} height - The rectangle's height
*/
CanvasRenderingContext2D.strokeRect = function(x, y, width, height) { };
/**
* @desc Draws (fills) `text` at the given (`x`,`y`) position.
*
* `ctx.fillText('Hello World', 0, 30, 144);`
*
* @param {String} text - The text to draw
* @param {Number} x - The x-axis coordinate of the text's starting point
* @param {Number} y - The y-axis coordinate of the text's starting point
* @param {Number} maxWidth - (Optional) Maximum width to draw. If specified,
* and the string is wider than the width, the font is adjusted to use a
* smaller font.
*/
CanvasRenderingContext2D.fillText = function(text, x, y, maxWidth) { };
/**
* @desc Returns a {@link #TextMetrics TextMetrics} object containing
* information about `text`.
*
* `var dimensions = ctx.measureText('Hello World');`
*
* @returns {TextMetrics} - A ``TextMetrics`` object with information about
* the measured text
*
* @param {String} text - The text to measure
*/
CanvasRenderingContext2D.measureText = function(text) { };
/**
* @desc Starts a new path by emptying the list of sub-paths. Call this
* method when you want to create a new path.
*
* `ctx.beginPath();`
*/
CanvasRenderingContext2D.beginPath = function() { };
/**
* @desc Causes the point of the pen to move back to the start of the
* current sub-path. It tries to add a straight line (but does not
* actually draw it) from the current point to the start. If the shape has
* already been closed or has only one point, this function does nothing.
*
* `ctx.closePath();`
*/
CanvasRenderingContext2D.closePath = function() { };
/**
* @desc Moves the starting point of a new sub-path to the (`x`,`y`)
* coordinates.
*
* `ctx.moveTo(10, 20);`
*
* @param {Number} x - The destination point on the x-axis
* @param {Number} y - The destination point on the y-axis
*/
CanvasRenderingContext2D.moveTo = function(x, y) { };
/**
* @desc Connects the last point of the sub-path to the (`x`,`y`)
* coordinates with a straight line.
*
* `ctx.lineTo(10, 20);`
*
* @param {Number} x - The destination point on the x-axis
* @param {Number} y - The destination point on the y-axis
*/
CanvasRenderingContext2D.lineTo = function(x, y) { };
/**
* @desc Adds an arc to the path which is centered at (`x`,`y`)
* position with radius `r` starting at `startAngle` and ending at
* `endAngle` going in the direction determined by the `anticlockwise`
* parameter (defaulting to clockwise).
*
* If `startAngle` > `endAngle` nothing will be drawn, and if the difference
* between `startAngle` and `endAngle` exceeds 2π, a full circle will be drawn.
*
* `// Draw a full circle outline<br>ctx.strokeStyle = 'white';<br>ctx.beginPath();<br>ctx.arc(72, 84, 40, 0, 2 * Math.PI, false);<br>ctx.stroke();`
*
* Please note this function does not work with `.fill`, you must use
* {@link #rockyFillRadial CanvasRenderingContext2D.rockyFillRadial} instead.
*
* @param {Number} x - The x-axis coordinate of the arc's center
* @param {Number} y - The y-axis coordinate of the arc's center
* @param {Number} r - The radius of the arc
* @param {Number} startAngle - The angle at which the arc starts, measured
* clockwise from the positive x axis and expressed in radians.
* @param {Number} endAngle - The angle at which the arc ends, measured
* clockwise from the positive x axis and expressed in radians.
* @param {Bool} [anticlockwise] - (Optional) `Boolean` which, if `true`,
* causes the arc to be drawn counter-clockwise between the two angles
* (`false` by default)
*/
CanvasRenderingContext2D.arc = function(x, y, r, startAngle, endAngle, anticlockwise) { };
/**
* @desc Creates a path for a rectangle at position (`x`,`y`) with a
* size that is determined by `width` and `height`. Those four points are
* connected by straight lines and the sub-path is marked as closed, so
* that you can fill or stroke this rectangle.
*
* `ctx.rect(0, 30, 144, 50);`
*
* @param {Number} x - The x-axis coordinate of the rectangle's starting point
* @param {Number} y - The y-axis coordinate of the rectangle's starting point
* @param {Number} width - The rectangle's width
* @param {Number} height - The rectangle's height
*/
CanvasRenderingContext2D.rect = function(x, y, width, height) { };
/**
* @desc Fills the current path with the current {@link #fillStyle fillStyle}.
*
* `ctx.fill();`
*/
CanvasRenderingContext2D.fill = function() { };
/**
* @desc Strokes the current path with the current {@link #strokeStyle strokeStyle}.
*
* `ctx.stroke();`
*/
CanvasRenderingContext2D.stroke = function() { };
/**
* @desc Saves the entire state of the canvas by pushing the current
* state onto a stack.
*
* `ctx.save();`
*/
CanvasRenderingContext2D.save = function() { };
/**
* @desc Restores the most recently saved canvas state by popping the
* top entry in the drawing state stack. If there is no saved state, this
* method does nothing.
*
* `ctx.restore();`
*/
CanvasRenderingContext2D.restore = function() { };
/**
* @desc Fills a circle clockwise between startAngle and endAngle where
* 0 is the start of the circle beginning at the 3 o'clock position on a
* watchface.
*
* If `startAngle` > `endAngle` nothing will be drawn, and if the difference
* between `startAngle` and `endAngle` exceeds 2π, a full circle will be drawn.
*
* `// Draw a filled circle<br>ctx.fillStyle = 'white';<br>ctx.rockyFillRadial(72, 84, 0, 30, 0, 2 * Math.PI);`
*
* @param {Number} x - The x-axis coordinate of the radial's center point
* @param {Number} y - The y-axis coordinate of the radial's center point
* @param {Number} innerRadius - The inner radius of the circle. Use 0 for a full circle
* @param {Number} outerRadius - The outer radius of the circle
* @param {Number} startAngle - Radial starting angle
* @param {Number} endAngle - Radial finishing angle. If smaller than `startAngle` nothing is drawn
*/
CanvasRenderingContext2D.rockyFillRadial = function(x, y, innerRadius, outerRadius, startAngle, endAngle) { };

64
devsite/js-docs/rocky/Console.js Normal file
View file

@ -0,0 +1,64 @@
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* @namespace console
* @desc This provides an interface to the app's debugging console.
*
* If you're using {@link https://cloudpebble.net CloudPebble}, these logs
* will appear when you press 'View Logs' after launching your application.
*
* If you're using the local SDK, you can use the `$ pebble logs` command or:
*
* `$ pebble install --emulator basalt --logs`
*
* You can find out more about logging in our
* {@link /guides/debugging/debugging-with-app-logs/ Debugging with App Logs} guide.
*/
var console = new Object();
/**
* @desc Outputs a message to the app's debugging console.
*
* `console.log(rocky.watchInfo.platform);`
*
* @param {...Object} obj - One or more JavaScript objects to output. The string
* representations of each of these objects are appended together in the order
* listed and output.
*/
console.log = function (obj) { };
/**
* @desc Outputs a warning message to the app's debugging console.
*
* `console.warn('Something seems wrong');`
*
* @param {...Object} obj - One or more JavaScript objects to output. The string
* representations of each of these objects are appended together in the order
* listed and output.
*/
console.warn = function (obj) { };
/**
* @desc Outputs an error message to the app's debugging console.
*
* `console.error(JSON.stringify(obj));`
*
* @param {...Object} obj - One or more JavaScript objects to output. The string
* representations of each of these objects are appended together in the order
* listed and output.
*/
console.error = function (obj) { };

121
devsite/js-docs/rocky/Date.js Normal file
View file

@ -0,0 +1,121 @@
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* @namespace Date
*
* @desc Creates a JavaScript Date instance that represents a single moment in
* time. Date objects are based on a time value that is the number of
* milliseconds since 1 January, 1970 UTC.
*
* `var d = new Date();`
*
* We fully implement standard JavaScript `Date` functions, such as: `getDay()`, `getHours()` etc.
*
* For full `Date` documentation see:
* {@link https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date}
*
* ### Locale Date Methods
*
* The locale date methods ({@link #toLocaleString toLocaleString},
* {@link #toLocaleTimeString toLocaleTimeString} and
* {@link #toLocaleDateString toLocaleDateString}) are currently limited in
* their initial implementation.
*
* Available **options**:
*
* **hour12**
*
* Use 12-hour time (as opposed to 24-hour time). Possible values are `true` and `false`; the default is locale dependent (Pebble setting).
*
* **weekday**
*
* The representation of the weekday. Possible values are "narrow", "short", "long".
*
* **year**
*
* The representation of the year. Possible values are "numeric", "2-digit".
*
* **month**
*
* The representation of the month. Possible values are "numeric", "2-digit", "narrow", "short", "long".
*
* **day**
*
* The representation of the day. Possible values are "numeric", "2-digit".
*
* **hour**
*
* The representation of the hour. Possible values are "numeric", "2-digit".
*
* **minute**
*
* The representation of the minute. Possible values are "numeric", "2-digit".
*
* **second**
*
* The representation of the second. Possible values are "numeric", "2-digit".
*
*
* Please note that locale based date and time functions have the following
* limitations at this time:
*
* * You cannot manually specify a locale, it's automatically based upon the
* current device settings. Locale is optional, or you can specify `undefined`.
*
* `console.log(d.toLocaleDateString());`
*
* * Only a single date/time value can be requested in each method call. Do
* NOT request multiple options. e.g. `{hour: 'numeric', minute: '2-digit'}`
*
* `console.log(d.toLocaleTimeString(undefined, {hour: 'numeric'}));`
*/
var Date = new Object();
/**
* @desc This method returns a string with a language sensitive representation
* of this date object.
*
* `d.toLocaleString();`
*
* @param {String} locale - (Optional) The name of the locale.
* @param {Object} options - (Optional) Only a single option is currently supported.
*/
Date.toLocaleString = function(locale, options) { };
/**
* @desc This method returns a string with a language sensitive representation
* of the date portion of this date object.
*
* `d.toLocaleTimeString(undefined, {hour: 'numeric'});`
*
* @param {String} locale - (Optional) The name of the locale.
* @param {Object} options - (Optional) Only a single option is currently supported.
*/
Date.toLocaleTimeString = function(locale, options) { };
/**
* @desc This method returns a string with a language sensitive representation
* of the time portion of this date object.
*
* `d.toLocaleDateString(undefined, {weekday: 'long'});`
*
* @param {String} locale - (Optional) The name of the locale.
* @param {Object} options - (Optional) Only a single option is currently supported.
*/
Date.toLocaleDateString = function() { };

58
devsite/js-docs/rocky/global.js Normal file
View file

@ -0,0 +1,58 @@
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
// Global Functions, Members, and Typedefs
/**
* @desc Calls a function after a specified delay.
*
* `var timeoutId = setTimeout(function(...){}, 10000);`
*
* @returns {Number} timeoutId - The ID of the timeout
* @param {Function} fct - The function to execute
* @param {Number} delay - The delay (in ms)
*/
setTimeout = function(fct, delay) { };
/**
* @desc Clears the delay set by ``setTimeout``.
*
* `clearTimeout(timeoutId);`
*
* @param {Number} timeoutId - The ID of the timeout you wish to clear.
*/
clearTimeout = function(timeoutId) { };
/**
* @desc Repeatedly calls a function, with a fixed time delay between
* each call.
*
* `var intervalId = setInterval(function(...){}, 10000);`
*
* @returns {Number} intervalId - The ID of the interval
* @param {Function} fct - The function to execute
* @param {Number} delay - The delay (in ms)
*/
setInterval = function(fct, delay) { };
/**
* @desc Clears the interval set by ``setInterval``.
*
* `clearInterval(intervalId);`
*
* @param {Number} intervalId - The ID of the interval you wish to clear
*/
clearInterval = function(intervalId) { };

262
devsite/js-docs/rocky/rocky.js Normal file
View file

@ -0,0 +1,262 @@
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* @namespace rocky
*
* @desc Provides an interface for interacting with application context and
* events. Developers can access the Rocky object with the following line of
* code:
*
* `var rocky = require('rocky');`
*
*/
var rocky = {
/**
* @typedef {Object} WatchInfo
* @desc Provides information about the currently connected Pebble smartwatch.
*
* @property {String} model - The name of the Pebble model. (e.g. pebble_time_round_silver_20mm)
* @property {String} platform - The name of the Pebble platform. (e.g. basalt)
* @property {String} language - Not available yet.
* @property {String} firmware - An object with the following fields:
* * `major` - The major version of the smartwatch's firmware.
* * `minor` - The minor version of the smartwatch's firmware.
* * `patch` - The patch version of the smartwatch's firmware.
* * `suffix` - The suffix of the smartwatch's firmware. (e.g. beta3)
*/
/**
* @typedef {Object} UserPreferences
* @desc Provides access to user related settings from the currently connected Pebble smartwatch.
* The size itself will vary between platforms, see the
* {@link /guides/user-interfaces/content-size/ ContentSize guide} for more information.
*
* @property {String} contentSize - Pebble > System > Notifications > Text Size:
* * `small` - Not available on Emery.
* * `medium` - The default setting.
* * `large` - The default setting on Emery.
* * `x-large` - Only available on Emery.
*/
/**
* @typedef {Function} RockyDrawCallback
* @desc The callback function signature to be used with the draw {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `context` - A {@link /docs/rockyjs/CanvasRenderingContext2D CanvasRenderingContext2D}
* object that can be used to draw information on the disply.
*/
/**
* @typedef {Function} RockyTickCallback
* @desc The callback function signature to be used with the `secondchange`,
* `minutechange`, `hourchange` and `daychange` {@link #on events}.
*
* In addition to firing these tick events at the appropriate time change,
* they are also emitted when the application starts.
*
* @param {Object} event - An object containing information about the event:
* * `date` - A JavaScript
* {@link http://www.w3schools.com/jsref/jsref_obj_date.asp date} object
* representing the current time.
*/
/**
* @typedef {Function} RockyMessageCallback
* @desc The callback function signature to be used with the `message`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
* * `data` - The data sent within the message.
*/
/**
* @typedef {Function} RockyPostMessageErrorCallback
* @desc The callback function signature to be used with the `postmessageerror`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
* * `data` - The data failed to send within the message.
*/
/**
* @typedef {Function} RockyPostMessageConnectedCallback
* @desc The callback function signature to be used with the `postmessageconnected`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
*/
/**
* @typedef {Function} RockyPostMessageDisconnectedCallback
* @desc The callback function signature to be used with the `postmessagedisconnected`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `type` - The type of event which was triggered.
*/
/**
* @typedef {Function} RockyMemoryPressureCallback
* @desc The callback function signature to be used with the `memorypressure`
* {@link #on event}.
*
* @param {Object} event - An object containing information about the event:
* * `level` (String) - The current level of memory pressure.
*
* * `high` - This is a critical level, indicating that the application will
* be terminated if memory isn't immediately free'd.
*
* Important Notes:
* - Avoid creating any new objects/arrays/strings when this level is raised.
* - Drop object properties you don't need using the `delete` operator or by assigning `undefined` to it.
* - Don't use the `in` operator in the handler for large objects/arrays. Avoid `for (var x in y)` due to memory constraints.
* - Array has large memory requirements for certain operations/methods. Avoid `Array.pop()`, `Array.slice` and length assignment `Array.length = 123`, on large arrays.
*
* * `normal` - Not yet implemented.
*
* * `low` - Not yet implemented.
*/
/**
* @desc A {@link #WatchInfo WatchInfo} object containing information about the
* connected Pebble smartwatch.
*
* `console.log(rocky.watchInfo.model);<br>&gt; pebble_2_hr_lime`
*
*/
watchInfo,
/**
* @desc A {@link #UserPreferences UserPreferences} object access to user related settings from the currently connected Pebble smartwatch.
*
* `console.log(rocky.userPreferences.contentSize);<br>&gt; medium`
*
*/
userPreferences
};
/**
* @desc Attaches an event handler to the specified events. You may subscribe
* with multiple handlers, but at present there is no way to unsubscribe.
*
* `rocky.on('minutechange', function() {...});`
*
* #### Event Type Options
*
* Possible values:
*
* * `draw` - Provide a {@link #RockyDrawCallback RockyDrawCallback} as the
* callback. The draw event is being emitted after each call to
* {@link #requestDraw requestDraw} but at most once for each screen update,
* even if {@link #requestDraw requestDraw} is called frequently the 'draw'
* event might also fire at other meaningful times (e.g. upon launch).
* * `secondchange` - Provide a {@link #RockyTickCallback RockyTickCallback} as the
* callback. The secondchange event is emitted every time the clock's second changes.
* * `minutechange` - Provide a {@link #RockyTickCallback RockyTickCallback} as the
* callback. The minutechange event is emitted every time the clock's minute changes.
* * `hourchange` - Provide a {@link #RockyTickCallback RockyTickCallback} as the
* callback. The hourchange event is emitted every time the clock's hour changes.
* * `daychange` - Provide a {@link #RockyTickCallback RockyTickCallback} as the
* callback. The daychange event is emitted every time the clock's day changes.
* * `memorypressure` - Provides a {@link #RockyMemoryPressureCallback RockyMemoryPressureCallback}. The
* event is emitted every time there is a notable change in available system memory.
* You can see an example implementation of memory pressure handling {@link https://github.com/pebble-examples/rocky-memorypressure here}.
* * `message` - Provide a {@link #RockyMessageCallback RockyMessageCallback}
* as the callback. The message event is emitted every time the application
* receives a {@link #postMessage postMessage} from the mobile companion.
* * `postmessageconnected` - Provide a {@link #RockyPostMessageConnectedCallback RockyPostMessageConnectedCallback}
* as the callback. The event may be emitted immediately upon subscription,
* if the subsystem is already connected. It is also emitted when connectivity is established.
* * `postmessagedisconnected` - Provide a {@link #RockyPostMessageDisconnectedCallback RockyPostMessageDisconnectedCallback}
* as the callback. The event may be emitted immediately upon subscription,
* if the subsystem is already disconnected. It is also emitted when connectivity is lost.
* * `postmessageerror` - Provide a {@link #RockyPostMessageErrorCallback RockyPostMessageErrorCallback}
* as the callback. The event is emitted when a transmission error occurrs. The type
* of error is not provided, but the message has not been delivered.
*
* @param {String} type - The event being subscribed to.
* @param {Function} callback - A callback function that will be executed when
* the event occurs. See below for more details.
*
*/
rocky.on = function(type, callback) { };
/**
* @desc Attaches an event handler to the specified events. Synonymous with
* [rocky.on()](#on).
*
* `rocky.addEventListener(type, callback);`
*
* @param {String} type - The event being subscribed to.
* @param {Function} callback - A callback function that will be executed when
* the event occurs. See below for more details.
*/
rocky.addEventListener = function(type, callback) { };
/**
* @desc Remove an existing event listener previously registered with
* [rocky.on()](#on) or [rocky.addEventListener()](#addEventListener).
*
* @param {String} type - The type of the event listener to be removed. See
* [rocky.on()](#on) for a list of available event types.
* @param {Function} callback - The existing developer-defined function that was
* previously registered.
*/
rocky.removeEventListener = function(type, callback) { };
/**
* @desc Remove an existing event handler from the specified events. Synonymous
* with [rocky.removeEventListener()](#removeEventListener).
*
* `rocky.off(type, callback);`
*
* @param {String} type - The type of the event listener to be removed. See
* [rocky.on()](#on) for a list of available event types.
* @param {Function} callback - The existing developer-defined function that was
* previously registered.
*/
rocky.off = function(type, callback) { };
/**
* @desc Sends a message to the mobile companion component. Please be aware
* that messages should be kept concise. Each message is queued, so
* `postMessage()` can be called multiple times immediately. If there is a momentary loss of connectivity, queued
* messages may still be delivered, or automatically removed from the queue
* after a few seconds of failed connectivity. Any transmission failures, or
* out of memory errors will be raised via the `postmessageerror` event.
*
* `rocky.postMessage({cmd: 'fetch'});`
*
* @param {Object} data - An object containing the data to deliver to the mobile
* device. This will be received in the `data` field of the `event`
* delivered to the `on('message', ...)` handler.
*/
rocky.postMessage = function(data) { };
/**
* @desc Flags the canvas (display) as requiring a redraw. Invoking this method
* will cause the {@link #on draw event} to be emitted. Only 1 draw event
* will occur, regardless of how many times the redraw is requested before
* the next draw event.
*
* `rocky.on('secondchange', function(e) {<br>&nbsp;&nbsp;rocky.requestDraw();<br>});`
*/
rocky.requestDraw = function() { };