├── .gitignore ├── Analog24hour ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ ├── images │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── Analog24hourApp.mc │ └── Analog24hourView.mc └── manifest.xml ├── AnalogDigital ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── AnalogDigitalApp.mc │ └── AnalogDigitalView.mc └── manifest.xml ├── KeepCalmAndRun ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── KeepCalmAndRunApp.mc │ └── KeepCalmAndRunView.mc └── manifest.xml ├── KeepCalmAndSwim ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── KeepCalmAndSwimApp.mc │ └── KeepCalmAndSwimView.mc └── manifest.xml ├── KeepCalmAndDuathlon ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── KeepCalmAndDuathlonApp.mc │ └── KeepCalmAndDuathlonView.mc └── manifest.xml ├── KeepCalmAndRideBike ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── KeepCalmAndRideBikeApp.mc │ └── KeepCalmAndRideBikeView.mc └── manifest.xml ├── KeepCalmAndTriathlon ├── .gitignore ├── monkey.jungle ├── .settings │ └── IQ_IDE.prefs ├── resources │ ├── strings │ │ └── strings.xml │ ├── drawables │ │ ├── drawables.xml │ │ └── launcher_icon.png │ └── layouts │ │ └── layout.xml ├── source │ ├── KeepCalmAndTriathlonApp.mc │ └── KeepCalmAndTriathlonView.mc └── manifest.xml ├── compile-batch.sh └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | out -------------------------------------------------------------------------------- /Analog24hour/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /AnalogDigital/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /KeepCalmAndRun/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/.gitignore: -------------------------------------------------------------------------------- 1 | /bin 2 | -------------------------------------------------------------------------------- /Analog24hour/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /AnalogDigital/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /KeepCalmAndRun/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/monkey.jungle: -------------------------------------------------------------------------------- 1 | project.manifest = manifest.xml 2 | 3 | -------------------------------------------------------------------------------- /Analog24hour/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /AnalogDigital/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /KeepCalmAndRun/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/.settings/IQ_IDE.prefs: -------------------------------------------------------------------------------- 1 | eclipse.preferences.version=1 2 | project_manifest=manifest.xml 3 | -------------------------------------------------------------------------------- /Analog24hour/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | Analog24hour 3 | 4 | -------------------------------------------------------------------------------- /AnalogDigital/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | AnalogDigital 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndRun/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | KeepCalmAndRun 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | KeepCalmAndSwim 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | KeepCalmAndDuathlon 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | KeepCalmAndRideBike 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/resources/strings/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | KeepCalmAndTriathlon 3 | 4 | -------------------------------------------------------------------------------- /AnalogDigital/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndRun/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /Analog24hour/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/resources/drawables/drawables.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /Analog24hour/resources/images/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/Analog24hour/resources/images/launcher_icon.png -------------------------------------------------------------------------------- /Analog24hour/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/Analog24hour/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /AnalogDigital/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/AnalogDigital/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /KeepCalmAndRun/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/KeepCalmAndRun/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /KeepCalmAndSwim/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/KeepCalmAndSwim/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/KeepCalmAndDuathlon/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /KeepCalmAndRideBike/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/KeepCalmAndRideBike/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/resources/drawables/launcher_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dennybiasiolli/garmin-connect-iq/HEAD/KeepCalmAndTriathlon/resources/drawables/launcher_icon.png -------------------------------------------------------------------------------- /Analog24hour/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /AnalogDigital/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /KeepCalmAndRun/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/resources/layouts/layout.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /Analog24hour/source/Analog24hourApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class Analog24hourApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new Analog24hourView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as Analog24hourApp { 27 | return Application.getApp() as Analog24hourApp; 28 | } -------------------------------------------------------------------------------- /AnalogDigital/source/AnalogDigitalApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class AnalogDigitalApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new AnalogDigitalView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as AnalogDigitalApp { 27 | return Application.getApp() as AnalogDigitalApp; 28 | } -------------------------------------------------------------------------------- /KeepCalmAndRun/source/KeepCalmAndRunApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class KeepCalmAndRunApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new KeepCalmAndRunView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as KeepCalmAndRunApp { 27 | return Application.getApp() as KeepCalmAndRunApp; 28 | } -------------------------------------------------------------------------------- /KeepCalmAndSwim/source/KeepCalmAndSwimApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class KeepCalmAndSwimApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new KeepCalmAndSwimView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as KeepCalmAndSwimApp { 27 | return Application.getApp() as KeepCalmAndSwimApp; 28 | } -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/source/KeepCalmAndDuathlonApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class KeepCalmAndDuathlonApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new KeepCalmAndDuathlonView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as KeepCalmAndDuathlonApp { 27 | return Application.getApp() as KeepCalmAndDuathlonApp; 28 | } -------------------------------------------------------------------------------- /KeepCalmAndRideBike/source/KeepCalmAndRideBikeApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class KeepCalmAndRideBikeApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new KeepCalmAndRideBikeView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as KeepCalmAndRideBikeApp { 27 | return Application.getApp() as KeepCalmAndRideBikeApp; 28 | } -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/source/KeepCalmAndTriathlonApp.mc: -------------------------------------------------------------------------------- 1 | import Toybox.Application; 2 | import Toybox.Lang; 3 | import Toybox.WatchUi; 4 | 5 | class KeepCalmAndTriathlonApp extends Application.AppBase { 6 | 7 | function initialize() { 8 | AppBase.initialize(); 9 | } 10 | 11 | // onStart() is called on application start up 12 | function onStart(state as Dictionary?) as Void { 13 | } 14 | 15 | // onStop() is called when your application is exiting 16 | function onStop(state as Dictionary?) as Void { 17 | } 18 | 19 | // Return the initial view of your application here 20 | function getInitialView() as Array? { 21 | return [ new KeepCalmAndTriathlonView() ] as Array; 22 | } 23 | 24 | } 25 | 26 | function getApp() as KeepCalmAndTriathlonApp { 27 | return Application.getApp() as KeepCalmAndTriathlonApp; 28 | } -------------------------------------------------------------------------------- /compile-batch.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | MONKEYC_BIN=~/Library/Application\ Support/Garmin/ConnectIQ/Sdks/connectiq-sdk-mac-4.1.5-2022-08-03-6e17bf167/bin 4 | CERTIFICATE=~/Downloads/developer_key.der 5 | 6 | PATH=$MONKEYC_BIN:$PATH 7 | 8 | ## Remove the System 5 preview devices from your app before you build the .iq file. 9 | 10 | monkeyc -e \ 11 | -o out/Analog24hour.iq \ 12 | -w -f Analog24hour/monkey.jungle \ 13 | -r -y $CERTIFICATE 14 | monkeyc -e \ 15 | -o out/AnalogDigital.iq \ 16 | -w -f AnalogDigital/monkey.jungle \ 17 | -r -y $CERTIFICATE 18 | monkeyc -e \ 19 | -o out/KeepCalmAndDuathlon.iq \ 20 | -w -f KeepCalmAndDuathlon/monkey.jungle \ 21 | -r -y $CERTIFICATE 22 | monkeyc -e \ 23 | -o out/KeepCalmAndRideBike.iq \ 24 | -w -f KeepCalmAndRideBike/monkey.jungle \ 25 | -r -y $CERTIFICATE 26 | monkeyc -e \ 27 | -o out/KeepCalmAndRun.iq \ 28 | -w -f KeepCalmAndRun/monkey.jungle \ 29 | -r -y $CERTIFICATE 30 | monkeyc -e \ 31 | -o out/KeepCalmAndSwim.iq \ 32 | -w -f KeepCalmAndSwim/monkey.jungle \ 33 | -r -y $CERTIFICATE 34 | monkeyc -e \ 35 | -o out/KeepCalmAndTriathlon.iq \ 36 | -w -f KeepCalmAndTriathlon/monkey.jungle \ 37 | -r -y $CERTIFICATE 38 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # GARMIN CONNECT IQ 2 | 3 | My Garmin Connect IQ Project in one single repository 4 | 5 | 6 | ## Download apps 7 | 8 | Download my apps from [Connect IQ Store](https://apps.garmin.com/en-US/developer/8bd344a5-7e1a-4209-a851-c099d2dff514/apps) 9 | using [Garmin Express](https://www.garmin.com/en-US/software/express). 10 | 11 | 12 | ## Build apps on your own 13 | 14 | Follow [Programmer's Guide](https://developer.garmin.com/connect-iq/overview/) 15 | to setup your Windows or Mac. 16 | 17 | - Download [Garmin Connect IQ SDK Manager](https://developer.garmin.com/connect-iq/sdk/) 18 | 19 | - Use the SDK manager to download the latest Connect IQ SDK and devices 20 | 21 | - Once the download completes, click Yes when prompted to use the new SDK version as your active SDK 22 | 23 | - Close the SDK Manager 24 | 25 | - Install `Visual Studio Code Monkey C Extension` 26 | 27 | - In VS Code, click Ctrl + Shift + P (Command + Shift + P on Mac) and select "Monkey C: Verify Installation" 28 | 29 | 30 | ## Upload apps on Connect IQ Store 31 | 32 | https://apps.garmin.com/en-US/developer/dashboard 33 | 34 | 35 | ## Batch compiling via command line 36 | 37 | Check `MONKEYC` path in `compile-batch.sh` file, then launch 38 | `./compile-batch.sh` 39 | 40 | 41 | ## Command line guide 42 | 43 | ```sh 44 | # Launch the simulator: 45 | connectiq 46 | 47 | # Compile the executable: 48 | monkeyc -d fenix6pro \ 49 | -f KeepCalmAndTriathlon/monkey.jungle \ 50 | -o KeepCalmAndTriathlon.prg \ 51 | -y $HOME/Downloads/developer_key.der 52 | 53 | # Run in the simulator 54 | monkeydo KeepCalmAndTriathlon.prg fenix6pro 55 | 56 | # Compile for Publishing 57 | monkeyc -e \ 58 | -o KeepCalmAndTriathlon.iq \ 59 | -w -f KeepCalmAndTriathlon/monkey.jungle \ 60 | -y $HOME/Downloads/developer_key.der 61 | ``` 62 | 63 | ## Cleanup 64 | 65 | - Remove Garmin ConnectIQ directory, usually in `~/Library/Application Support/Garmin/ConnectIQ` 66 | 67 | - Delete `Visual Studio Code Monkey C Extension` 68 | -------------------------------------------------------------------------------- /Analog24hour/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 111 | 112 | ara 113 | bul 114 | ces 115 | dan 116 | deu 117 | dut 118 | eng 119 | est 120 | fin 121 | fre 122 | gre 123 | heb 124 | hrv 125 | hun 126 | ind 127 | ita 128 | jpn 129 | kor 130 | lav 131 | lit 132 | nob 133 | pol 134 | por 135 | ron 136 | rus 137 | slo 138 | slv 139 | spa 140 | swe 141 | tha 142 | tur 143 | ukr 144 | vie 145 | zhs 146 | zht 147 | zsm 148 | 149 | 153 | 154 | 155 | 156 | -------------------------------------------------------------------------------- /AnalogDigital/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 110 | 111 | 112 | ara 113 | bul 114 | ces 115 | dan 116 | deu 117 | dut 118 | eng 119 | est 120 | fin 121 | fre 122 | gre 123 | heb 124 | hrv 125 | hun 126 | ind 127 | ita 128 | jpn 129 | kor 130 | lav 131 | lit 132 | nob 133 | pol 134 | por 135 | ron 136 | rus 137 | slo 138 | slv 139 | spa 140 | swe 141 | tha 142 | tur 143 | ukr 144 | vie 145 | zhs 146 | zht 147 | zsm 148 | 149 | 153 | 154 | 155 | 156 | -------------------------------------------------------------------------------- /KeepCalmAndRun/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 110 | 111 | 115 | 116 | ara 117 | bul 118 | ces 119 | dan 120 | deu 121 | dut 122 | eng 123 | est 124 | fin 125 | fre 126 | gre 127 | heb 128 | hrv 129 | hun 130 | ind 131 | ita 132 | jpn 133 | kor 134 | lav 135 | lit 136 | nob 137 | pol 138 | por 139 | ron 140 | rus 141 | slo 142 | slv 143 | spa 144 | swe 145 | tha 146 | tur 147 | ukr 148 | vie 149 | zhs 150 | zht 151 | zsm 152 | 153 | 157 | 158 | 159 | 160 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 110 | 111 | 115 | 116 | ara 117 | bul 118 | ces 119 | dan 120 | deu 121 | dut 122 | eng 123 | est 124 | fin 125 | fre 126 | gre 127 | heb 128 | hrv 129 | hun 130 | ind 131 | ita 132 | jpn 133 | kor 134 | lav 135 | lit 136 | nob 137 | pol 138 | por 139 | ron 140 | rus 141 | slo 142 | slv 143 | spa 144 | swe 145 | tha 146 | tur 147 | ukr 148 | vie 149 | zhs 150 | zht 151 | zsm 152 | 153 | 157 | 158 | 159 | 160 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 110 | 111 | 115 | 116 | ara 117 | bul 118 | ces 119 | dan 120 | deu 121 | dut 122 | eng 123 | est 124 | fin 125 | fre 126 | gre 127 | heb 128 | hrv 129 | hun 130 | ind 131 | ita 132 | jpn 133 | kor 134 | lav 135 | lit 136 | nob 137 | pol 138 | por 139 | ron 140 | rus 141 | slo 142 | slv 143 | spa 144 | swe 145 | tha 146 | tur 147 | ukr 148 | vie 149 | zhs 150 | zht 151 | zsm 152 | 153 | 157 | 158 | 159 | 160 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 110 | 111 | 115 | 116 | ara 117 | bul 118 | ces 119 | dan 120 | deu 121 | dut 122 | eng 123 | est 124 | fin 125 | fre 126 | gre 127 | heb 128 | hrv 129 | hun 130 | ind 131 | ita 132 | jpn 133 | kor 134 | lav 135 | lit 136 | nob 137 | pol 138 | por 139 | ron 140 | rus 141 | slo 142 | slv 143 | spa 144 | swe 145 | tha 146 | tur 147 | ukr 148 | vie 149 | zhs 150 | zht 151 | zsm 152 | 153 | 157 | 158 | 159 | 160 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/manifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 110 | 111 | 115 | 116 | ara 117 | bul 118 | ces 119 | dan 120 | deu 121 | dut 122 | eng 123 | est 124 | fin 125 | fre 126 | gre 127 | heb 128 | hrv 129 | hun 130 | ind 131 | ita 132 | jpn 133 | kor 134 | lav 135 | lit 136 | nob 137 | pol 138 | por 139 | ron 140 | rus 141 | slo 142 | slv 143 | spa 144 | swe 145 | tha 146 | tur 147 | ukr 148 | vie 149 | zhs 150 | zht 151 | zsm 152 | 153 | 157 | 158 | 159 | 160 | -------------------------------------------------------------------------------- /Analog24hour/source/Analog24hourView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class Analog24hourView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [24]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | //! Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 24; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | //if(i != 0 && i != 6 && i != 12 && i != 18) 42 | { 43 | hashMarksArray[i][0] = (i / 24.0) * Math.PI * 2; 44 | hashMarksArray[i][1] = -100; 45 | } 46 | } 47 | 48 | //get battery icon position 49 | batt_x = (width_screen/2) - (batt_width_rect/2) - (batt_width_rect_small/2); 50 | batt_y = (height_screen/5*4) - (batt_height_rect/2); 51 | batt_x_small = batt_x + batt_width_rect; 52 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 53 | 54 | setLayout(Rez.Layouts.WatchFace(dc)); 55 | } 56 | 57 | //! Restore the state of the app and prepare the view to be shown 58 | function onShow() { 59 | } 60 | 61 | //! Update the view 62 | function onUpdate(dc) { 63 | var clockTime = Sys.getClockTime(); 64 | 65 | // Clear the screen 66 | dc.setColor(background_color, Gfx.COLOR_WHITE); 67 | dc.fillRectangle(0,0, width_screen, height_screen); 68 | // Draw the gray rectangle 69 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 70 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 71 | 72 | 73 | // Draw the hash marks 74 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 75 | drawHashMarks(dc); 76 | 77 | 78 | // Draw analog time 79 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 80 | 81 | 82 | // Draw the logo 83 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 84 | dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_MEDIUM, "TRIATHLON", Gfx.TEXT_JUSTIFY_CENTER); 85 | dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "SwimBikeRun", Gfx.TEXT_JUSTIFY_CENTER); 86 | //dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_LARGE, "IRONMAN", Gfx.TEXT_JUSTIFY_CENTER); 87 | //dc.drawText(width_screen/2, height_screen/7*2, Gfx.FONT_MEDIUM, "Swim Bike Run", Gfx.TEXT_JUSTIFY_CENTER); 88 | //dc.setColor(Gfx.COLOR_DK_BLUE, Gfx.COLOR_TRANSPARENT); 89 | //dc.drawText(width_screen/4, height_screen/7*2, Gfx.FONT_LARGE, "Swim", Gfx.TEXT_JUSTIFY_CENTER); 90 | //dc.setColor(Gfx.COLOR_RED, Gfx.COLOR_TRANSPARENT); 91 | //dc.drawText(width_screen/2 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Bike", Gfx.TEXT_JUSTIFY_CENTER); 92 | //dc.setColor(Gfx.COLOR_GREEN, Gfx.COLOR_TRANSPARENT); 93 | //dc.drawText(width_screen/4*3 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Run", Gfx.TEXT_JUSTIFY_CENTER); 94 | 95 | 96 | // Draw the battery icon 97 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 98 | 99 | // Draw digital time 100 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 101 | 102 | // Draw date 103 | drawDate(dc, Gfx.COLOR_WHITE); 104 | } 105 | 106 | //! The user has just looked at their watch. Timers and animations may be started here. 107 | function onExitSleep() { 108 | showSecond = true; 109 | } 110 | 111 | //! Terminate any active timers and prepare for slow updates. 112 | function onEnterSleep() { 113 | showSecond = false; 114 | requestUpdate(); 115 | } 116 | 117 | function drawDigitalTime(dc, text_color, clockTime) 118 | { 119 | var hour = clockTime.hour; 120 | var ampm = ""; 121 | if (!is24Hour) 122 | { 123 | //handle midnight and noon, which return as 0 124 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 125 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 126 | } 127 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 128 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 129 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 130 | dc.drawText(width_screen/2, height_screen/5*3, Gfx.FONT_LARGE, timeString, Gfx.TEXT_JUSTIFY_CENTER); 131 | } 132 | 133 | //! Draw the watch hand 134 | //! @param dc Device Context to Draw 135 | //! @param angle Angle to draw the watch hand 136 | //! @param length Length of the watch hand 137 | //! @param width Width of the watch hand 138 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 139 | { 140 | // Map out the coordinates of the watch hand 141 | var coords = [ 142 | [-(width/2), 0 + overheadLine], 143 | [-(width/2), -length], 144 | [width/2, -length], 145 | [width/2, 0 + overheadLine] 146 | ]; 147 | var result = new [4]; 148 | var centerX = width_screen / 2; 149 | var centerY = height_screen / 2; 150 | var cos = Math.cos(angle); 151 | var sin = Math.sin(angle); 152 | 153 | // Transform the coordinates 154 | for (var i = 0; i < 4; i += 1) 155 | { 156 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 157 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 158 | result[i] = [ centerX + x, centerY + y]; 159 | if(drawCircleOnTop) 160 | { 161 | if(i == 0) 162 | { 163 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 164 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 165 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 166 | } 167 | else if(i == 1) 168 | { 169 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 170 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 171 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 172 | } 173 | } 174 | } 175 | 176 | // Draw the polygon 177 | dc.fillPolygon(result); 178 | //dc.fillPolygon(result); 179 | } 180 | 181 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 182 | { 183 | var hour, min, sec; 184 | 185 | // Draw the hour. Convert it to minutes and 186 | // compute the angle. 187 | hour = ( ( ( clock_hour % 24 ) * 60 ) + clock_min ); 188 | hour = hour / (24 * 60.0); 189 | hour = hour * Math.PI * 2; 190 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 191 | drawHand(dc, hour, 70, 6, 15, true); 192 | 193 | // Draw the minute 194 | min = ( clock_min / 60.0) * Math.PI * 2; 195 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 196 | drawHand(dc, min, 100, 4, 15, true); 197 | 198 | // Draw the seconds 199 | if(showSecond){ 200 | sec = ( clock_sec / 60.0) * Math.PI * 2; 201 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 202 | drawHand(dc, sec, 105, 2, 15, true); 203 | } 204 | 205 | // Draw the inner circle 206 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 207 | dc.fillCircle(width_screen/2, height_screen/2, 6); 208 | dc.setColor(background_color,background_color); 209 | dc.drawCircle(width_screen/2, height_screen/2, 6); 210 | } 211 | 212 | 213 | //! Draw the hash mark symbols on the watch 214 | //! @param dc Device context 215 | function drawHashMarks(dc) 216 | { 217 | // Draw the numbers 218 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 219 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "0",Gfx.TEXT_JUSTIFY_CENTER); 220 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "6 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 221 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "12", Gfx.TEXT_JUSTIFY_CENTER); 222 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 18",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 223 | 224 | for(var i = 0; i < 24; i += 1) 225 | { 226 | if(i != 0 && i != 6 && i != 12 && i != 18) 227 | { 228 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 229 | } 230 | } 231 | } 232 | 233 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 234 | { 235 | var battery = Sys.getSystemStats().battery; 236 | 237 | if(battery < 15.0) 238 | { 239 | primaryColor = lowBatteryColor; 240 | } 241 | //else if(battery == 100.0) 242 | //{ 243 | // primaryColor = fullBatteryColor; 244 | //} 245 | 246 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 247 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 248 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 249 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 250 | 251 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 252 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 253 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 254 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 255 | 256 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 257 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 258 | if(battery == 100.0) 259 | { 260 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 261 | } 262 | } 263 | 264 | function drawDate(dc, text_color) 265 | { 266 | var now = Time.now(); 267 | var info = Calendar.info(now, Time.FORMAT_LONG); 268 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 269 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 270 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 271 | dc.drawText(width_screen / 7 * 6, (height_screen / 2), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 272 | } 273 | } -------------------------------------------------------------------------------- /AnalogDigital/source/AnalogDigitalView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class AnalogDigitalView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [60]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | // Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 60; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | if(i != 0 && i != 15 && i != 30 && i != 45) 42 | { 43 | hashMarksArray[i][0] = (i / 60.0) * Math.PI * 2; 44 | if(i % 5 == 0) 45 | { 46 | hashMarksArray[i][1] = -100; 47 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 48 | } 49 | else 50 | { 51 | hashMarksArray[i][1] = -108; 52 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 53 | } 54 | } 55 | } 56 | 57 | //get battery icon position 58 | batt_x = (width_screen / 7 * 2) - (batt_width_rect/2) - (batt_width_rect_small/2); 59 | batt_y = (height_screen / 3) - (batt_height_rect/2); 60 | batt_x_small = batt_x + batt_width_rect; 61 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 62 | 63 | setLayout(Rez.Layouts.WatchFace(dc)); 64 | } 65 | 66 | // Called when this View is brought to the foreground. Restore 67 | // the state of this View and prepare it to be shown. This includes 68 | // loading resources into memory. 69 | function onShow() { 70 | } 71 | 72 | // Update the view 73 | function onUpdate(dc) { 74 | var clockTime = Sys.getClockTime(); 75 | 76 | // Clear the screen 77 | dc.setColor(background_color, Gfx.COLOR_WHITE); 78 | dc.fillRectangle(0,0, width_screen, height_screen); 79 | // Draw the gray rectangle 80 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 81 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 82 | 83 | 84 | // Draw the hash marks 85 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 86 | drawHashMarks(dc); 87 | 88 | 89 | // Draw analog time 90 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 91 | 92 | 93 | // Draw the logo 94 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 95 | 96 | 97 | // Draw the battery icon 98 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 99 | 100 | // Draw digital time 101 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 102 | 103 | // Draw date 104 | drawDate(dc, Gfx.COLOR_WHITE); 105 | } 106 | 107 | // Called when this View is removed from the screen. Save the 108 | // state of this View here. This includes freeing resources from 109 | // memory. 110 | function onHide() { 111 | } 112 | 113 | // The user has just looked at their watch. Timers and animations may be started here. 114 | function onExitSleep() { 115 | showSecond = true; 116 | } 117 | 118 | // Terminate any active timers and prepare for slow updates. 119 | function onEnterSleep() { 120 | showSecond = false; 121 | requestUpdate(); 122 | } 123 | 124 | function drawDigitalTime(dc, text_color, clockTime) 125 | { 126 | var hour = clockTime.hour; 127 | var ampm = ""; 128 | var font = Gfx.FONT_NUMBER_HOT; 129 | if (!is24Hour) 130 | { 131 | //handle midnight and noon, which return as 0 132 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 133 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 134 | font = Gfx.FONT_LARGE; 135 | } 136 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 137 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 138 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 139 | dc.drawText(width_screen/2, (height_screen/32)*24, font, timeString, Gfx.TEXT_JUSTIFY_CENTER + Gfx.TEXT_JUSTIFY_VCENTER); 140 | } 141 | 142 | //! Draw the watch hand 143 | //! @param dc Device Context to Draw 144 | //! @param angle Angle to draw the watch hand 145 | //! @param length Length of the watch hand 146 | //! @param width Width of the watch hand 147 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 148 | { 149 | // Map out the coordinates of the watch hand 150 | var coords = [ 151 | [-(width/2), 0 + overheadLine], 152 | [-(width/2), -length], 153 | [width/2, -length], 154 | [width/2, 0 + overheadLine] 155 | ]; 156 | var result = new [4]; 157 | var centerX = width_screen / 2; 158 | var centerY = height_screen / 2; 159 | var cos = Math.cos(angle); 160 | var sin = Math.sin(angle); 161 | 162 | // Transform the coordinates 163 | for (var i = 0; i < 4; i += 1) 164 | { 165 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 166 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 167 | result[i] = [ centerX + x, centerY + y]; 168 | if(drawCircleOnTop) 169 | { 170 | if(i == 0) 171 | { 172 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 173 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 174 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 175 | } 176 | else if(i == 1) 177 | { 178 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 179 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 180 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 181 | } 182 | } 183 | } 184 | 185 | // Draw the polygon 186 | dc.fillPolygon(result); 187 | //dc.fillPolygon(result); 188 | } 189 | 190 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 191 | { 192 | var hour, min, sec; 193 | 194 | // Draw the hour. Convert it to minutes and 195 | // compute the angle. 196 | hour = ( ( ( clock_hour % 12 ) * 60 ) + clock_min ); 197 | hour = hour / (12 * 60.0); 198 | hour = hour * Math.PI * 2; 199 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 200 | drawHand(dc, hour, 70, 6, 15, true); 201 | 202 | // Draw the minute 203 | min = ( clock_min / 60.0) * Math.PI * 2; 204 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 205 | drawHand(dc, min, 100, 4, 15, true); 206 | 207 | // Draw the seconds 208 | if(showSecond){ 209 | sec = ( clock_sec / 60.0) * Math.PI * 2; 210 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 211 | drawHand(dc, sec, 105, 2, 15, true); 212 | } 213 | 214 | // Draw the inner circle 215 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 216 | dc.fillCircle(width_screen/2, height_screen/2, 6); 217 | dc.setColor(background_color,background_color); 218 | dc.drawCircle(width_screen/2, height_screen/2, 6); 219 | } 220 | 221 | 222 | //! Draw the hash mark symbols on the watch 223 | //! @param dc Device context 224 | function drawHashMarks(dc) 225 | { 226 | // Draw the numbers 227 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 228 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "12",Gfx.TEXT_JUSTIFY_CENTER); 229 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "3 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 230 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "6", Gfx.TEXT_JUSTIFY_CENTER); 231 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 9",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 232 | 233 | //for(var i = 0; i < 60; i += 1) 234 | for(var i = 0; i < 60; i += 5) 235 | { 236 | if(i != 0 && i != 15 && i != 30 && i != 45) 237 | { 238 | //if(i % 5 == 0) 239 | //{ 240 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 241 | //} 242 | //else 243 | //{ 244 | // drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 245 | //} 246 | } 247 | } 248 | } 249 | 250 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 251 | { 252 | var battery = Sys.getSystemStats().battery; 253 | 254 | if(battery < 15.0) 255 | { 256 | primaryColor = lowBatteryColor; 257 | } 258 | //else if(battery == 100.0) 259 | //{ 260 | // primaryColor = fullBatteryColor; 261 | //} 262 | 263 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 264 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 265 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 266 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 267 | 268 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 269 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 270 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 271 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 272 | 273 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 274 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 275 | if(battery == 100.0) 276 | { 277 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 278 | } 279 | } 280 | 281 | function drawDate(dc, text_color) 282 | { 283 | var now = Time.now(); 284 | var info = Calendar.info(now, Time.FORMAT_LONG); 285 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 286 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 287 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 288 | dc.drawText(width_screen / 14 * 11, (height_screen / 3), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 289 | } 290 | } 291 | -------------------------------------------------------------------------------- /KeepCalmAndDuathlon/source/KeepCalmAndDuathlonView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class KeepCalmAndDuathlonView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [60]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | // Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 60; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | if(i != 0 && i != 15 && i != 30 && i != 45) 42 | { 43 | hashMarksArray[i][0] = (i / 60.0) * Math.PI * 2; 44 | if(i % 5 == 0) 45 | { 46 | hashMarksArray[i][1] = -100; 47 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 48 | } 49 | else 50 | { 51 | hashMarksArray[i][1] = -108; 52 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 53 | } 54 | } 55 | } 56 | 57 | //get battery icon position 58 | batt_x = (width_screen / 7 * 2) - (batt_width_rect/2) - (batt_width_rect_small/2); 59 | batt_y = (height_screen / 2) - (batt_height_rect/2); 60 | batt_x_small = batt_x + batt_width_rect; 61 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 62 | 63 | setLayout(Rez.Layouts.WatchFace(dc)); 64 | } 65 | 66 | // Called when this View is brought to the foreground. Restore 67 | // the state of this View and prepare it to be shown. This includes 68 | // loading resources into memory. 69 | function onShow() { 70 | } 71 | 72 | // Update the view 73 | function onUpdate(dc) { 74 | var clockTime = Sys.getClockTime(); 75 | 76 | // Clear the screen 77 | dc.setColor(background_color, Gfx.COLOR_WHITE); 78 | dc.fillRectangle(0,0, width_screen, height_screen); 79 | // Draw the gray rectangle 80 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 81 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 82 | 83 | 84 | // Draw the hash marks 85 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 86 | drawHashMarks(dc); 87 | 88 | 89 | // Draw analog time 90 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 91 | 92 | 93 | // Draw the logo 94 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 95 | dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_SMALL, "Keep Calm and", Gfx.TEXT_JUSTIFY_CENTER); 96 | dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "DUATHLON", Gfx.TEXT_JUSTIFY_CENTER); 97 | 98 | 99 | // Draw the battery icon 100 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 101 | 102 | // Draw digital time 103 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 104 | 105 | // Draw date 106 | drawDate(dc, Gfx.COLOR_WHITE); 107 | } 108 | 109 | // Called when this View is removed from the screen. Save the 110 | // state of this View here. This includes freeing resources from 111 | // memory. 112 | function onHide() { 113 | } 114 | 115 | // The user has just looked at their watch. Timers and animations may be started here. 116 | function onExitSleep() { 117 | showSecond = true; 118 | } 119 | 120 | // Terminate any active timers and prepare for slow updates. 121 | function onEnterSleep() { 122 | showSecond = false; 123 | requestUpdate(); 124 | } 125 | 126 | function drawDigitalTime(dc, text_color, clockTime) 127 | { 128 | var hour = clockTime.hour; 129 | var ampm = ""; 130 | var font = Gfx.FONT_NUMBER_HOT; 131 | if (!is24Hour) 132 | { 133 | //handle midnight and noon, which return as 0 134 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 135 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 136 | font = Gfx.FONT_LARGE; 137 | } 138 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 139 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 140 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 141 | dc.drawText(width_screen/2, (height_screen/32)*24, font, timeString, Gfx.TEXT_JUSTIFY_CENTER + Gfx.TEXT_JUSTIFY_VCENTER); 142 | } 143 | 144 | //! Draw the watch hand 145 | //! @param dc Device Context to Draw 146 | //! @param angle Angle to draw the watch hand 147 | //! @param length Length of the watch hand 148 | //! @param width Width of the watch hand 149 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 150 | { 151 | // Map out the coordinates of the watch hand 152 | var coords = [ 153 | [-(width/2), 0 + overheadLine], 154 | [-(width/2), -length], 155 | [width/2, -length], 156 | [width/2, 0 + overheadLine] 157 | ]; 158 | var result = new [4]; 159 | var centerX = width_screen / 2; 160 | var centerY = height_screen / 2; 161 | var cos = Math.cos(angle); 162 | var sin = Math.sin(angle); 163 | 164 | // Transform the coordinates 165 | for (var i = 0; i < 4; i += 1) 166 | { 167 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 168 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 169 | result[i] = [ centerX + x, centerY + y]; 170 | if(drawCircleOnTop) 171 | { 172 | if(i == 0) 173 | { 174 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 175 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 176 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 177 | } 178 | else if(i == 1) 179 | { 180 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 181 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 182 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 183 | } 184 | } 185 | } 186 | 187 | // Draw the polygon 188 | dc.fillPolygon(result); 189 | //dc.fillPolygon(result); 190 | } 191 | 192 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 193 | { 194 | var hour, min, sec; 195 | 196 | // Draw the hour. Convert it to minutes and 197 | // compute the angle. 198 | hour = ( ( ( clock_hour % 12 ) * 60 ) + clock_min ); 199 | hour = hour / (12 * 60.0); 200 | hour = hour * Math.PI * 2; 201 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 202 | drawHand(dc, hour, 70, 6, 15, true); 203 | 204 | // Draw the minute 205 | min = ( clock_min / 60.0) * Math.PI * 2; 206 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 207 | drawHand(dc, min, 100, 4, 15, true); 208 | 209 | // Draw the seconds 210 | if(showSecond){ 211 | sec = ( clock_sec / 60.0) * Math.PI * 2; 212 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 213 | drawHand(dc, sec, 105, 2, 15, true); 214 | } 215 | 216 | // Draw the inner circle 217 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 218 | dc.fillCircle(width_screen/2, height_screen/2, 6); 219 | dc.setColor(background_color,background_color); 220 | dc.drawCircle(width_screen/2, height_screen/2, 6); 221 | } 222 | 223 | 224 | //! Draw the hash mark symbols on the watch 225 | //! @param dc Device context 226 | function drawHashMarks(dc) 227 | { 228 | // Draw the numbers 229 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 230 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "12",Gfx.TEXT_JUSTIFY_CENTER); 231 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "3 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 232 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "6", Gfx.TEXT_JUSTIFY_CENTER); 233 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 9",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 234 | 235 | //for(var i = 0; i < 60; i += 1) 236 | for(var i = 0; i < 60; i += 5) 237 | { 238 | if(i != 0 && i != 15 && i != 30 && i != 45) 239 | { 240 | //if(i % 5 == 0) 241 | //{ 242 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 243 | //} 244 | //else 245 | //{ 246 | // drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 247 | //} 248 | } 249 | } 250 | } 251 | 252 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 253 | { 254 | var battery = Sys.getSystemStats().battery; 255 | 256 | if(battery < 15.0) 257 | { 258 | primaryColor = lowBatteryColor; 259 | } 260 | //else if(battery == 100.0) 261 | //{ 262 | // primaryColor = fullBatteryColor; 263 | //} 264 | 265 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 266 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 267 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 268 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 269 | 270 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 271 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 272 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 273 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 274 | 275 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 276 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 277 | if(battery == 100.0) 278 | { 279 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 280 | } 281 | } 282 | 283 | function drawDate(dc, text_color) 284 | { 285 | var now = Time.now(); 286 | var info = Calendar.info(now, Time.FORMAT_LONG); 287 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 288 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 289 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 290 | dc.drawText(width_screen / 7 * 6, (height_screen / 2), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 291 | } 292 | } 293 | -------------------------------------------------------------------------------- /KeepCalmAndRideBike/source/KeepCalmAndRideBikeView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class KeepCalmAndRideBikeView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [60]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | // Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 60; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | if(i != 0 && i != 15 && i != 30 && i != 45) 42 | { 43 | hashMarksArray[i][0] = (i / 60.0) * Math.PI * 2; 44 | if(i % 5 == 0) 45 | { 46 | hashMarksArray[i][1] = -100; 47 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 48 | } 49 | else 50 | { 51 | hashMarksArray[i][1] = -108; 52 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 53 | } 54 | } 55 | } 56 | 57 | //get battery icon position 58 | batt_x = (width_screen / 7 * 2) - (batt_width_rect/2) - (batt_width_rect_small/2); 59 | batt_y = (height_screen / 2) - (batt_height_rect/2); 60 | batt_x_small = batt_x + batt_width_rect; 61 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 62 | 63 | setLayout(Rez.Layouts.WatchFace(dc)); 64 | } 65 | 66 | // Called when this View is brought to the foreground. Restore 67 | // the state of this View and prepare it to be shown. This includes 68 | // loading resources into memory. 69 | function onShow() { 70 | } 71 | 72 | // Update the view 73 | function onUpdate(dc) { 74 | var clockTime = Sys.getClockTime(); 75 | 76 | // Clear the screen 77 | dc.setColor(background_color, Gfx.COLOR_WHITE); 78 | dc.fillRectangle(0,0, width_screen, height_screen); 79 | // Draw the gray rectangle 80 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 81 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 82 | 83 | 84 | // Draw the hash marks 85 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 86 | drawHashMarks(dc); 87 | 88 | 89 | // Draw analog time 90 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 91 | 92 | 93 | // Draw the logo 94 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 95 | dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_SMALL, "Keep Calm and", Gfx.TEXT_JUSTIFY_CENTER); 96 | dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "RIDE BIKE", Gfx.TEXT_JUSTIFY_CENTER); 97 | 98 | 99 | // Draw the battery icon 100 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 101 | 102 | // Draw digital time 103 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 104 | 105 | // Draw date 106 | drawDate(dc, Gfx.COLOR_WHITE); 107 | } 108 | 109 | // Called when this View is removed from the screen. Save the 110 | // state of this View here. This includes freeing resources from 111 | // memory. 112 | function onHide() { 113 | } 114 | 115 | // The user has just looked at their watch. Timers and animations may be started here. 116 | function onExitSleep() { 117 | showSecond = true; 118 | } 119 | 120 | // Terminate any active timers and prepare for slow updates. 121 | function onEnterSleep() { 122 | showSecond = false; 123 | requestUpdate(); 124 | } 125 | 126 | function drawDigitalTime(dc, text_color, clockTime) 127 | { 128 | var hour = clockTime.hour; 129 | var ampm = ""; 130 | var font = Gfx.FONT_NUMBER_HOT; 131 | if (!is24Hour) 132 | { 133 | //handle midnight and noon, which return as 0 134 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 135 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 136 | font = Gfx.FONT_LARGE; 137 | } 138 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 139 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 140 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 141 | dc.drawText(width_screen/2, (height_screen/32)*24, font, timeString, Gfx.TEXT_JUSTIFY_CENTER + Gfx.TEXT_JUSTIFY_VCENTER); 142 | } 143 | 144 | //! Draw the watch hand 145 | //! @param dc Device Context to Draw 146 | //! @param angle Angle to draw the watch hand 147 | //! @param length Length of the watch hand 148 | //! @param width Width of the watch hand 149 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 150 | { 151 | // Map out the coordinates of the watch hand 152 | var coords = [ 153 | [-(width/2), 0 + overheadLine], 154 | [-(width/2), -length], 155 | [width/2, -length], 156 | [width/2, 0 + overheadLine] 157 | ]; 158 | var result = new [4]; 159 | var centerX = width_screen / 2; 160 | var centerY = height_screen / 2; 161 | var cos = Math.cos(angle); 162 | var sin = Math.sin(angle); 163 | 164 | // Transform the coordinates 165 | for (var i = 0; i < 4; i += 1) 166 | { 167 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 168 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 169 | result[i] = [ centerX + x, centerY + y]; 170 | if(drawCircleOnTop) 171 | { 172 | if(i == 0) 173 | { 174 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 175 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 176 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 177 | } 178 | else if(i == 1) 179 | { 180 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 181 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 182 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 183 | } 184 | } 185 | } 186 | 187 | // Draw the polygon 188 | dc.fillPolygon(result); 189 | //dc.fillPolygon(result); 190 | } 191 | 192 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 193 | { 194 | var hour, min, sec; 195 | 196 | // Draw the hour. Convert it to minutes and 197 | // compute the angle. 198 | hour = ( ( ( clock_hour % 12 ) * 60 ) + clock_min ); 199 | hour = hour / (12 * 60.0); 200 | hour = hour * Math.PI * 2; 201 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 202 | drawHand(dc, hour, 70, 6, 15, true); 203 | 204 | // Draw the minute 205 | min = ( clock_min / 60.0) * Math.PI * 2; 206 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 207 | drawHand(dc, min, 100, 4, 15, true); 208 | 209 | // Draw the seconds 210 | if(showSecond){ 211 | sec = ( clock_sec / 60.0) * Math.PI * 2; 212 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 213 | drawHand(dc, sec, 105, 2, 15, true); 214 | } 215 | 216 | // Draw the inner circle 217 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 218 | dc.fillCircle(width_screen/2, height_screen/2, 6); 219 | dc.setColor(background_color,background_color); 220 | dc.drawCircle(width_screen/2, height_screen/2, 6); 221 | } 222 | 223 | 224 | //! Draw the hash mark symbols on the watch 225 | //! @param dc Device context 226 | function drawHashMarks(dc) 227 | { 228 | // Draw the numbers 229 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 230 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "12",Gfx.TEXT_JUSTIFY_CENTER); 231 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "3 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 232 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "6", Gfx.TEXT_JUSTIFY_CENTER); 233 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 9",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 234 | 235 | //for(var i = 0; i < 60; i += 1) 236 | for(var i = 0; i < 60; i += 5) 237 | { 238 | if(i != 0 && i != 15 && i != 30 && i != 45) 239 | { 240 | //if(i % 5 == 0) 241 | //{ 242 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 243 | //} 244 | //else 245 | //{ 246 | // drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 247 | //} 248 | } 249 | } 250 | } 251 | 252 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 253 | { 254 | var battery = Sys.getSystemStats().battery; 255 | 256 | if(battery < 15.0) 257 | { 258 | primaryColor = lowBatteryColor; 259 | } 260 | //else if(battery == 100.0) 261 | //{ 262 | // primaryColor = fullBatteryColor; 263 | //} 264 | 265 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 266 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 267 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 268 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 269 | 270 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 271 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 272 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 273 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 274 | 275 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 276 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 277 | if(battery == 100.0) 278 | { 279 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 280 | } 281 | } 282 | 283 | function drawDate(dc, text_color) 284 | { 285 | var now = Time.now(); 286 | var info = Calendar.info(now, Time.FORMAT_LONG); 287 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 288 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 289 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 290 | dc.drawText(width_screen / 7 * 6, (height_screen / 2), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 291 | } 292 | } 293 | -------------------------------------------------------------------------------- /KeepCalmAndRun/source/KeepCalmAndRunView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class KeepCalmAndRunView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [60]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | // Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 60; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | if(i != 0 && i != 15 && i != 30 && i != 45) 42 | { 43 | hashMarksArray[i][0] = (i / 60.0) * Math.PI * 2; 44 | if(i % 5 == 0) 45 | { 46 | hashMarksArray[i][1] = -100; 47 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 48 | } 49 | else 50 | { 51 | hashMarksArray[i][1] = -108; 52 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 53 | } 54 | } 55 | } 56 | 57 | //get battery icon position 58 | batt_x = (width_screen / 7 * 2) - (batt_width_rect/2) - (batt_width_rect_small/2); 59 | batt_y = (height_screen / 2) - (batt_height_rect/2); 60 | batt_x_small = batt_x + batt_width_rect; 61 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 62 | 63 | setLayout(Rez.Layouts.WatchFace(dc)); 64 | } 65 | 66 | // Called when this View is brought to the foreground. Restore 67 | // the state of this View and prepare it to be shown. This includes 68 | // loading resources into memory. 69 | function onShow() { 70 | } 71 | 72 | // Update the view 73 | function onUpdate(dc) { 74 | var clockTime = Sys.getClockTime(); 75 | 76 | // Clear the screen 77 | dc.setColor(background_color, Gfx.COLOR_WHITE); 78 | dc.fillRectangle(0,0, width_screen, height_screen); 79 | // Draw the gray rectangle 80 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 81 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 82 | 83 | 84 | // Draw the hash marks 85 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 86 | drawHashMarks(dc); 87 | 88 | 89 | // Draw analog time 90 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 91 | 92 | 93 | // Draw the logo 94 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 95 | dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_SMALL, "Keep Calm and", Gfx.TEXT_JUSTIFY_CENTER); 96 | dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "RUN", Gfx.TEXT_JUSTIFY_CENTER); 97 | //dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "KeepCalmAndRun", Gfx.TEXT_JUSTIFY_CENTER); 98 | //dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_LARGE, "IRONMAN", Gfx.TEXT_JUSTIFY_CENTER); 99 | //dc.drawText(width_screen/2, height_screen/7*2, Gfx.FONT_MEDIUM, "Swim Bike Run", Gfx.TEXT_JUSTIFY_CENTER); 100 | //dc.setColor(Gfx.COLOR_DK_BLUE, Gfx.COLOR_TRANSPARENT); 101 | //dc.drawText(width_screen/4, height_screen/7*2, Gfx.FONT_LARGE, "Swim", Gfx.TEXT_JUSTIFY_CENTER); 102 | //dc.setColor(Gfx.COLOR_RED, Gfx.COLOR_TRANSPARENT); 103 | //dc.drawText(width_screen/2 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Bike", Gfx.TEXT_JUSTIFY_CENTER); 104 | //dc.setColor(Gfx.COLOR_GREEN, Gfx.COLOR_TRANSPARENT); 105 | //dc.drawText(width_screen/4*3 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Run", Gfx.TEXT_JUSTIFY_CENTER); 106 | 107 | 108 | // Draw the battery icon 109 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 110 | 111 | // Draw digital time 112 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 113 | 114 | // Draw date 115 | drawDate(dc, Gfx.COLOR_WHITE); 116 | } 117 | 118 | // Called when this View is removed from the screen. Save the 119 | // state of this View here. This includes freeing resources from 120 | // memory. 121 | function onHide() { 122 | } 123 | 124 | // The user has just looked at their watch. Timers and animations may be started here. 125 | function onExitSleep() { 126 | showSecond = true; 127 | } 128 | 129 | // Terminate any active timers and prepare for slow updates. 130 | function onEnterSleep() { 131 | showSecond = false; 132 | requestUpdate(); 133 | } 134 | 135 | function drawDigitalTime(dc, text_color, clockTime) 136 | { 137 | var hour = clockTime.hour; 138 | var ampm = ""; 139 | var font = Gfx.FONT_NUMBER_HOT; 140 | if (!is24Hour) 141 | { 142 | //handle midnight and noon, which return as 0 143 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 144 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 145 | font = Gfx.FONT_LARGE; 146 | } 147 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 148 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 149 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 150 | dc.drawText(width_screen/2, (height_screen/32)*24, font, timeString, Gfx.TEXT_JUSTIFY_CENTER + Gfx.TEXT_JUSTIFY_VCENTER); 151 | } 152 | 153 | //! Draw the watch hand 154 | //! @param dc Device Context to Draw 155 | //! @param angle Angle to draw the watch hand 156 | //! @param length Length of the watch hand 157 | //! @param width Width of the watch hand 158 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 159 | { 160 | // Map out the coordinates of the watch hand 161 | var coords = [ 162 | [-(width/2), 0 + overheadLine], 163 | [-(width/2), -length], 164 | [width/2, -length], 165 | [width/2, 0 + overheadLine] 166 | ]; 167 | var result = new [4]; 168 | var centerX = width_screen / 2; 169 | var centerY = height_screen / 2; 170 | var cos = Math.cos(angle); 171 | var sin = Math.sin(angle); 172 | 173 | // Transform the coordinates 174 | for (var i = 0; i < 4; i += 1) 175 | { 176 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 177 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 178 | result[i] = [ centerX + x, centerY + y]; 179 | if(drawCircleOnTop) 180 | { 181 | if(i == 0) 182 | { 183 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 184 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 185 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 186 | } 187 | else if(i == 1) 188 | { 189 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 190 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 191 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 192 | } 193 | } 194 | } 195 | 196 | // Draw the polygon 197 | dc.fillPolygon(result); 198 | //dc.fillPolygon(result); 199 | } 200 | 201 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 202 | { 203 | var hour, min, sec; 204 | 205 | // Draw the hour. Convert it to minutes and 206 | // compute the angle. 207 | hour = ( ( ( clock_hour % 12 ) * 60 ) + clock_min ); 208 | hour = hour / (12 * 60.0); 209 | hour = hour * Math.PI * 2; 210 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 211 | drawHand(dc, hour, 70, 6, 15, true); 212 | 213 | // Draw the minute 214 | min = ( clock_min / 60.0) * Math.PI * 2; 215 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 216 | drawHand(dc, min, 100, 4, 15, true); 217 | 218 | // Draw the seconds 219 | if(showSecond){ 220 | sec = ( clock_sec / 60.0) * Math.PI * 2; 221 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 222 | drawHand(dc, sec, 105, 2, 15, true); 223 | } 224 | 225 | // Draw the inner circle 226 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 227 | dc.fillCircle(width_screen/2, height_screen/2, 6); 228 | dc.setColor(background_color,background_color); 229 | dc.drawCircle(width_screen/2, height_screen/2, 6); 230 | } 231 | 232 | 233 | //! Draw the hash mark symbols on the watch 234 | //! @param dc Device context 235 | function drawHashMarks(dc) 236 | { 237 | // Draw the numbers 238 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 239 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "12",Gfx.TEXT_JUSTIFY_CENTER); 240 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "3 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 241 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "6", Gfx.TEXT_JUSTIFY_CENTER); 242 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 9",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 243 | 244 | //for(var i = 0; i < 60; i += 1) 245 | for(var i = 0; i < 60; i += 5) 246 | { 247 | if(i != 0 && i != 15 && i != 30 && i != 45) 248 | { 249 | //if(i % 5 == 0) 250 | //{ 251 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 252 | //} 253 | //else 254 | //{ 255 | // drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 256 | //} 257 | } 258 | } 259 | } 260 | 261 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 262 | { 263 | var battery = Sys.getSystemStats().battery; 264 | 265 | if(battery < 15.0) 266 | { 267 | primaryColor = lowBatteryColor; 268 | } 269 | //else if(battery == 100.0) 270 | //{ 271 | // primaryColor = fullBatteryColor; 272 | //} 273 | 274 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 275 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 276 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 277 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 278 | 279 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 280 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 281 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 282 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 283 | 284 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 285 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 286 | if(battery == 100.0) 287 | { 288 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 289 | } 290 | } 291 | 292 | function drawDate(dc, text_color) 293 | { 294 | var now = Time.now(); 295 | var info = Calendar.info(now, Time.FORMAT_LONG); 296 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 297 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 298 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 299 | dc.drawText(width_screen / 7 * 6, (height_screen / 2), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 300 | } 301 | } 302 | -------------------------------------------------------------------------------- /KeepCalmAndSwim/source/KeepCalmAndSwimView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class KeepCalmAndSwimView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [60]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | // Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 60; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | if(i != 0 && i != 15 && i != 30 && i != 45) 42 | { 43 | hashMarksArray[i][0] = (i / 60.0) * Math.PI * 2; 44 | if(i % 5 == 0) 45 | { 46 | hashMarksArray[i][1] = -100; 47 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 48 | } 49 | else 50 | { 51 | hashMarksArray[i][1] = -108; 52 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 53 | } 54 | } 55 | } 56 | 57 | //get battery icon position 58 | batt_x = (width_screen / 7 * 2) - (batt_width_rect/2) - (batt_width_rect_small/2); 59 | batt_y = (height_screen / 2) - (batt_height_rect/2); 60 | batt_x_small = batt_x + batt_width_rect; 61 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 62 | 63 | setLayout(Rez.Layouts.WatchFace(dc)); 64 | } 65 | 66 | // Called when this View is brought to the foreground. Restore 67 | // the state of this View and prepare it to be shown. This includes 68 | // loading resources into memory. 69 | function onShow() { 70 | } 71 | 72 | // Update the view 73 | function onUpdate(dc) { 74 | var clockTime = Sys.getClockTime(); 75 | 76 | // Clear the screen 77 | dc.setColor(background_color, Gfx.COLOR_WHITE); 78 | dc.fillRectangle(0,0, width_screen, height_screen); 79 | // Draw the gray rectangle 80 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 81 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 82 | 83 | 84 | // Draw the hash marks 85 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 86 | drawHashMarks(dc); 87 | 88 | 89 | // Draw analog time 90 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 91 | 92 | 93 | // Draw the logo 94 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 95 | dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_SMALL, "Keep Calm and", Gfx.TEXT_JUSTIFY_CENTER); 96 | dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "SWIM", Gfx.TEXT_JUSTIFY_CENTER); 97 | //dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "KeepCalmAndSwim", Gfx.TEXT_JUSTIFY_CENTER); 98 | //dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_LARGE, "IRONMAN", Gfx.TEXT_JUSTIFY_CENTER); 99 | //dc.drawText(width_screen/2, height_screen/7*2, Gfx.FONT_MEDIUM, "Swim Bike Run", Gfx.TEXT_JUSTIFY_CENTER); 100 | //dc.setColor(Gfx.COLOR_DK_BLUE, Gfx.COLOR_TRANSPARENT); 101 | //dc.drawText(width_screen/4, height_screen/7*2, Gfx.FONT_LARGE, "Swim", Gfx.TEXT_JUSTIFY_CENTER); 102 | //dc.setColor(Gfx.COLOR_RED, Gfx.COLOR_TRANSPARENT); 103 | //dc.drawText(width_screen/2 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Bike", Gfx.TEXT_JUSTIFY_CENTER); 104 | //dc.setColor(Gfx.COLOR_GREEN, Gfx.COLOR_TRANSPARENT); 105 | //dc.drawText(width_screen/4*3 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Run", Gfx.TEXT_JUSTIFY_CENTER); 106 | 107 | 108 | // Draw the battery icon 109 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 110 | 111 | // Draw digital time 112 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 113 | 114 | // Draw date 115 | drawDate(dc, Gfx.COLOR_WHITE); 116 | } 117 | 118 | // Called when this View is removed from the screen. Save the 119 | // state of this View here. This includes freeing resources from 120 | // memory. 121 | function onHide() { 122 | } 123 | 124 | // The user has just looked at their watch. Timers and animations may be started here. 125 | function onExitSleep() { 126 | showSecond = true; 127 | } 128 | 129 | // Terminate any active timers and prepare for slow updates. 130 | function onEnterSleep() { 131 | showSecond = false; 132 | requestUpdate(); 133 | } 134 | 135 | function drawDigitalTime(dc, text_color, clockTime) 136 | { 137 | var hour = clockTime.hour; 138 | var ampm = ""; 139 | var font = Gfx.FONT_NUMBER_HOT; 140 | if (!is24Hour) 141 | { 142 | //handle midnight and noon, which return as 0 143 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 144 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 145 | font = Gfx.FONT_LARGE; 146 | } 147 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 148 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 149 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 150 | dc.drawText(width_screen/2, (height_screen/32)*24, font, timeString, Gfx.TEXT_JUSTIFY_CENTER + Gfx.TEXT_JUSTIFY_VCENTER); 151 | } 152 | 153 | //! Draw the watch hand 154 | //! @param dc Device Context to Draw 155 | //! @param angle Angle to draw the watch hand 156 | //! @param length Length of the watch hand 157 | //! @param width Width of the watch hand 158 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 159 | { 160 | // Map out the coordinates of the watch hand 161 | var coords = [ 162 | [-(width/2), 0 + overheadLine], 163 | [-(width/2), -length], 164 | [width/2, -length], 165 | [width/2, 0 + overheadLine] 166 | ]; 167 | var result = new [4]; 168 | var centerX = width_screen / 2; 169 | var centerY = height_screen / 2; 170 | var cos = Math.cos(angle); 171 | var sin = Math.sin(angle); 172 | 173 | // Transform the coordinates 174 | for (var i = 0; i < 4; i += 1) 175 | { 176 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 177 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 178 | result[i] = [ centerX + x, centerY + y]; 179 | if(drawCircleOnTop) 180 | { 181 | if(i == 0) 182 | { 183 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 184 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 185 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 186 | } 187 | else if(i == 1) 188 | { 189 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 190 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 191 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 192 | } 193 | } 194 | } 195 | 196 | // Draw the polygon 197 | dc.fillPolygon(result); 198 | //dc.fillPolygon(result); 199 | } 200 | 201 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 202 | { 203 | var hour, min, sec; 204 | 205 | // Draw the hour. Convert it to minutes and 206 | // compute the angle. 207 | hour = ( ( ( clock_hour % 12 ) * 60 ) + clock_min ); 208 | hour = hour / (12 * 60.0); 209 | hour = hour * Math.PI * 2; 210 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 211 | drawHand(dc, hour, 70, 6, 15, true); 212 | 213 | // Draw the minute 214 | min = ( clock_min / 60.0) * Math.PI * 2; 215 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 216 | drawHand(dc, min, 100, 4, 15, true); 217 | 218 | // Draw the seconds 219 | if(showSecond){ 220 | sec = ( clock_sec / 60.0) * Math.PI * 2; 221 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 222 | drawHand(dc, sec, 105, 2, 15, true); 223 | } 224 | 225 | // Draw the inner circle 226 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 227 | dc.fillCircle(width_screen/2, height_screen/2, 6); 228 | dc.setColor(background_color,background_color); 229 | dc.drawCircle(width_screen/2, height_screen/2, 6); 230 | } 231 | 232 | 233 | //! Draw the hash mark symbols on the watch 234 | //! @param dc Device context 235 | function drawHashMarks(dc) 236 | { 237 | // Draw the numbers 238 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 239 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "12",Gfx.TEXT_JUSTIFY_CENTER); 240 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "3 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 241 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "6", Gfx.TEXT_JUSTIFY_CENTER); 242 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 9",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 243 | 244 | //for(var i = 0; i < 60; i += 1) 245 | for(var i = 0; i < 60; i += 5) 246 | { 247 | if(i != 0 && i != 15 && i != 30 && i != 45) 248 | { 249 | //if(i % 5 == 0) 250 | //{ 251 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 252 | //} 253 | //else 254 | //{ 255 | // drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 256 | //} 257 | } 258 | } 259 | } 260 | 261 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 262 | { 263 | var battery = Sys.getSystemStats().battery; 264 | 265 | if(battery < 15.0) 266 | { 267 | primaryColor = lowBatteryColor; 268 | } 269 | //else if(battery == 100.0) 270 | //{ 271 | // primaryColor = fullBatteryColor; 272 | //} 273 | 274 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 275 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 276 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 277 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 278 | 279 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 280 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 281 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 282 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 283 | 284 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 285 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 286 | if(battery == 100.0) 287 | { 288 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 289 | } 290 | } 291 | 292 | function drawDate(dc, text_color) 293 | { 294 | var now = Time.now(); 295 | var info = Calendar.info(now, Time.FORMAT_LONG); 296 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 297 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 298 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 299 | dc.drawText(width_screen / 7 * 6, (height_screen / 2), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 300 | } 301 | } 302 | -------------------------------------------------------------------------------- /KeepCalmAndTriathlon/source/KeepCalmAndTriathlonView.mc: -------------------------------------------------------------------------------- 1 | using Toybox.Graphics as Gfx; 2 | using Toybox.System as Sys; 3 | using Toybox.Lang as Lang; 4 | using Toybox.Math as Math; 5 | using Toybox.Time as Time; 6 | using Toybox.Time.Gregorian as Calendar; 7 | using Toybox.WatchUi as Ui; 8 | using Toybox.Application as App; 9 | 10 | class KeepCalmAndTriathlonView extends Ui.WatchFace { 11 | var showSecond = true; 12 | var background_color = Gfx.COLOR_BLACK; 13 | var width_screen, height_screen; 14 | 15 | var hashMarksArray = new [60]; 16 | 17 | var batt_width_rect = 20; 18 | var batt_height_rect = 10; 19 | var batt_width_rect_small = 2; 20 | var batt_height_rect_small = 5; 21 | var batt_x, batt_y, batt_x_small, batt_y_small; 22 | 23 | var is24Hour = true; 24 | 25 | function initialize() { 26 | var settings = Sys.getDeviceSettings(); 27 | is24Hour = settings.is24Hour; 28 | WatchFace.initialize(); 29 | } 30 | 31 | // Load your resources here 32 | function onLayout(dc) { 33 | //get screen dimensions 34 | width_screen = dc.getWidth(); 35 | height_screen = dc.getHeight(); 36 | 37 | //get hash marks position 38 | for(var i = 0; i < 60; i+=1) 39 | { 40 | hashMarksArray[i] = new [2]; 41 | if(i != 0 && i != 15 && i != 30 && i != 45) 42 | { 43 | hashMarksArray[i][0] = (i / 60.0) * Math.PI * 2; 44 | if(i % 5 == 0) 45 | { 46 | hashMarksArray[i][1] = -100; 47 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 48 | } 49 | else 50 | { 51 | hashMarksArray[i][1] = -108; 52 | //drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 53 | } 54 | } 55 | } 56 | 57 | //get battery icon position 58 | batt_x = (width_screen / 7 * 2) - (batt_width_rect/2) - (batt_width_rect_small/2); 59 | batt_y = (height_screen / 2) - (batt_height_rect/2); 60 | batt_x_small = batt_x + batt_width_rect; 61 | batt_y_small = batt_y + ((batt_height_rect - batt_height_rect_small) / 2); 62 | 63 | setLayout(Rez.Layouts.WatchFace(dc)); 64 | } 65 | 66 | // Called when this View is brought to the foreground. Restore 67 | // the state of this View and prepare it to be shown. This includes 68 | // loading resources into memory. 69 | function onShow() { 70 | } 71 | 72 | // Update the view 73 | function onUpdate(dc) { 74 | var clockTime = Sys.getClockTime(); 75 | 76 | // Clear the screen 77 | dc.setColor(background_color, Gfx.COLOR_WHITE); 78 | dc.fillRectangle(0,0, width_screen, height_screen); 79 | // Draw the gray rectangle 80 | //dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_GRAY); 81 | //dc.fillPolygon([[0,0],[width_screen, 0],[width_screen, height_screen],[0,0]]); 82 | 83 | 84 | // Draw the hash marks 85 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 86 | drawHashMarks(dc); 87 | 88 | 89 | // Draw analog time 90 | drawHands(dc, clockTime.hour, clockTime.min, clockTime.sec, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY, Gfx.COLOR_LT_GRAY); 91 | 92 | 93 | // Draw the logo 94 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 95 | dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_SMALL, "Keep Calm and", Gfx.TEXT_JUSTIFY_CENTER); 96 | dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "TRIATHLON", Gfx.TEXT_JUSTIFY_CENTER); 97 | //dc.drawText(width_screen/2, height_screen/4, Gfx.FONT_LARGE, "SwimBikeRun", Gfx.TEXT_JUSTIFY_CENTER); 98 | //dc.drawText(width_screen/2, height_screen/6, Gfx.FONT_LARGE, "IRONMAN", Gfx.TEXT_JUSTIFY_CENTER); 99 | //dc.drawText(width_screen/2, height_screen/7*2, Gfx.FONT_MEDIUM, "Swim Bike Run", Gfx.TEXT_JUSTIFY_CENTER); 100 | //dc.setColor(Gfx.COLOR_DK_BLUE, Gfx.COLOR_TRANSPARENT); 101 | //dc.drawText(width_screen/4, height_screen/7*2, Gfx.FONT_LARGE, "Swim", Gfx.TEXT_JUSTIFY_CENTER); 102 | //dc.setColor(Gfx.COLOR_RED, Gfx.COLOR_TRANSPARENT); 103 | //dc.drawText(width_screen/2 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Bike", Gfx.TEXT_JUSTIFY_CENTER); 104 | //dc.setColor(Gfx.COLOR_GREEN, Gfx.COLOR_TRANSPARENT); 105 | //dc.drawText(width_screen/4*3 + 10, height_screen/7*2, Gfx.FONT_LARGE, "Run", Gfx.TEXT_JUSTIFY_CENTER); 106 | 107 | 108 | // Draw the battery icon 109 | drawBattery(dc, Gfx.COLOR_DK_GRAY, Gfx.COLOR_DK_RED, Gfx.COLOR_DK_GREEN); 110 | 111 | // Draw digital time 112 | drawDigitalTime(dc, Gfx.COLOR_WHITE, clockTime); 113 | 114 | // Draw date 115 | drawDate(dc, Gfx.COLOR_WHITE); 116 | } 117 | 118 | // Called when this View is removed from the screen. Save the 119 | // state of this View here. This includes freeing resources from 120 | // memory. 121 | function onHide() { 122 | } 123 | 124 | // The user has just looked at their watch. Timers and animations may be started here. 125 | function onExitSleep() { 126 | showSecond = true; 127 | } 128 | 129 | // Terminate any active timers and prepare for slow updates. 130 | function onEnterSleep() { 131 | showSecond = false; 132 | requestUpdate(); 133 | } 134 | 135 | function drawDigitalTime(dc, text_color, clockTime) 136 | { 137 | var hour = clockTime.hour; 138 | var font = Gfx.FONT_NUMBER_HOT; 139 | var ampm = ""; 140 | if (!is24Hour) 141 | { 142 | //handle midnight and noon, which return as 0 143 | hour = clockTime.hour % 12 == 0 ? 12 : clockTime.hour % 12 ; 144 | ampm = clockTime.hour >= 12 && clockTime.hour < 24 ? " PM" : " AM"; 145 | font = Gfx.FONT_LARGE; 146 | } 147 | //var timeString = Lang.format("$1$:$2$:$3$", [clockTime.hour.format("%2d"), clockTime.min.format("%2d"), clockTime.sec.format("%2d")]); 148 | var timeString = Lang.format("$1$:$2$$3$", [hour.format("%02d"), clockTime.min.format("%02d"), ampm]); 149 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 150 | dc.drawText(width_screen/2, (height_screen/32)*24, font, timeString, Gfx.TEXT_JUSTIFY_CENTER + Gfx.TEXT_JUSTIFY_VCENTER); 151 | } 152 | 153 | //! Draw the watch hand 154 | //! @param dc Device Context to Draw 155 | //! @param angle Angle to draw the watch hand 156 | //! @param length Length of the watch hand 157 | //! @param width Width of the watch hand 158 | function drawHand(dc, angle, length, width, overheadLine, drawCircleOnTop) 159 | { 160 | // Map out the coordinates of the watch hand 161 | var coords = [ 162 | [-(width/2), 0 + overheadLine], 163 | [-(width/2), -length], 164 | [width/2, -length], 165 | [width/2, 0 + overheadLine] 166 | ]; 167 | var result = new [4]; 168 | var centerX = width_screen / 2; 169 | var centerY = height_screen / 2; 170 | var cos = Math.cos(angle); 171 | var sin = Math.sin(angle); 172 | 173 | // Transform the coordinates 174 | for (var i = 0; i < 4; i += 1) 175 | { 176 | var x = (coords[i][0] * cos) - (coords[i][1] * sin); 177 | var y = (coords[i][0] * sin) + (coords[i][1] * cos); 178 | result[i] = [ centerX + x, centerY + y]; 179 | if(drawCircleOnTop) 180 | { 181 | if(i == 0) 182 | { 183 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 184 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 185 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 186 | } 187 | else if(i == 1) 188 | { 189 | var xCircle = ((coords[i][0]+(width/2)) * cos) - ((coords[i][1]) * sin); 190 | var yCircle = ((coords[i][0]+(width/2)) * sin) + ((coords[i][1]) * cos); 191 | dc.fillCircle(centerX + xCircle, centerY + yCircle, (width/2)-1); 192 | } 193 | } 194 | } 195 | 196 | // Draw the polygon 197 | dc.fillPolygon(result); 198 | //dc.fillPolygon(result); 199 | } 200 | 201 | function drawHands(dc, clock_hour, clock_min, clock_sec, hour_color, min_color, sec_color) 202 | { 203 | var hour, min, sec; 204 | 205 | // Draw the hour. Convert it to minutes and 206 | // compute the angle. 207 | hour = ( ( ( clock_hour % 12 ) * 60 ) + clock_min ); 208 | hour = hour / (12 * 60.0); 209 | hour = hour * Math.PI * 2; 210 | dc.setColor(hour_color, Gfx.COLOR_TRANSPARENT); 211 | drawHand(dc, hour, 70, 6, 15, true); 212 | 213 | // Draw the minute 214 | min = ( clock_min / 60.0) * Math.PI * 2; 215 | dc.setColor(min_color, Gfx.COLOR_TRANSPARENT); 216 | drawHand(dc, min, 100, 4, 15, true); 217 | 218 | // Draw the seconds 219 | if(showSecond){ 220 | sec = ( clock_sec / 60.0) * Math.PI * 2; 221 | dc.setColor(sec_color, Gfx.COLOR_TRANSPARENT); 222 | drawHand(dc, sec, 105, 2, 15, true); 223 | } 224 | 225 | // Draw the inner circle 226 | dc.setColor(Gfx.COLOR_LT_GRAY, background_color); 227 | dc.fillCircle(width_screen/2, height_screen/2, 6); 228 | dc.setColor(background_color,background_color); 229 | dc.drawCircle(width_screen/2, height_screen/2, 6); 230 | } 231 | 232 | 233 | //! Draw the hash mark symbols on the watch 234 | //! @param dc Device context 235 | function drawHashMarks(dc) 236 | { 237 | // Draw the numbers 238 | dc.setColor(Gfx.COLOR_DK_GRAY, Gfx.COLOR_TRANSPARENT); 239 | dc.drawText((width_screen/2), 0, Gfx.FONT_MEDIUM, "12",Gfx.TEXT_JUSTIFY_CENTER); 240 | dc.drawText(width_screen, height_screen/2, Gfx.FONT_MEDIUM, "3 ", Gfx.TEXT_JUSTIFY_RIGHT + Gfx.TEXT_JUSTIFY_VCENTER); 241 | dc.drawText(width_screen/2, height_screen-30, Gfx.FONT_MEDIUM, "6", Gfx.TEXT_JUSTIFY_CENTER); 242 | dc.drawText(0, height_screen/2, Gfx.FONT_MEDIUM, " 9",Gfx.TEXT_JUSTIFY_LEFT + Gfx.TEXT_JUSTIFY_VCENTER); 243 | 244 | //for(var i = 0; i < 60; i += 1) 245 | for(var i = 0; i < 60; i += 5) 246 | { 247 | if(i != 0 && i != 15 && i != 30 && i != 45) 248 | { 249 | //if(i % 5 == 0) 250 | //{ 251 | drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 252 | //} 253 | //else 254 | //{ 255 | // drawHand(dc, hashMarksArray[i][0], 110, 2, hashMarksArray[i][1], false); 256 | //} 257 | } 258 | } 259 | } 260 | 261 | function drawBattery(dc, primaryColor, lowBatteryColor, fullBatteryColor) 262 | { 263 | var battery = Sys.getSystemStats().battery; 264 | 265 | if(battery < 15.0) 266 | { 267 | primaryColor = lowBatteryColor; 268 | } 269 | //else if(battery == 100.0) 270 | //{ 271 | // primaryColor = fullBatteryColor; 272 | //} 273 | 274 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 275 | dc.drawRectangle(batt_x, batt_y, batt_width_rect, batt_height_rect); 276 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 277 | dc.drawLine(batt_x_small-1, batt_y_small+1, batt_x_small-1, batt_y_small + batt_height_rect_small-1); 278 | 279 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 280 | dc.drawRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 281 | dc.setColor(background_color, Gfx.COLOR_TRANSPARENT); 282 | dc.drawLine(batt_x_small, batt_y_small+1, batt_x_small, batt_y_small + batt_height_rect_small-1); 283 | 284 | dc.setColor(primaryColor, Gfx.COLOR_TRANSPARENT); 285 | dc.fillRectangle(batt_x, batt_y, (batt_width_rect * battery / 100), batt_height_rect); 286 | if(battery == 100.0) 287 | { 288 | dc.fillRectangle(batt_x_small, batt_y_small, batt_width_rect_small, batt_height_rect_small); 289 | } 290 | } 291 | 292 | function drawDate(dc, text_color) 293 | { 294 | var now = Time.now(); 295 | var info = Calendar.info(now, Time.FORMAT_LONG); 296 | //var dateStr = Lang.format("$1$ $2$ $3$", [info.day_of_week, info.month, info.day]); 297 | var dateStr = Lang.format("$1$ $2$", [info.day_of_week, info.day.format("%02d")]); 298 | dc.setColor(text_color, Gfx.COLOR_TRANSPARENT); 299 | dc.drawText(width_screen / 7 * 6, (height_screen / 2), Gfx.FONT_TINY, dateStr, Gfx.TEXT_JUSTIFY_VCENTER); 300 | } 301 | } 302 | --------------------------------------------------------------------------------