-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added appstore documentation and images
- Loading branch information
1 parent
a2a7b2a
commit 5caec87
Showing
10 changed files
with
12 additions
and
78 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,90 +1,24 @@ | ||
# App Store Widget Boilerplate | ||
# Version 1.0 - Language and TimeZone switcher | ||
|
||
This boilerplate gives you all you need to start a new custom widget for Mendix | ||
5.6.0 and up. | ||
|
||
The boilerplate contains: | ||
- Directory structure | ||
- Readme.md | ||
- License | ||
- JavaScript source | ||
- XSD for package.xml, to configure properties of the widget, visible inside the | ||
Mendix business modeler | ||
You can use this module to detect the Language and TimeZone used by the browser. For the best experience with the Mendix platform it is important that the user-language and user-timezone relationship are an exact match with where the user is actually located. | ||
|
||
## Contributing | ||
|
||
For more information on contributing to this repository visit [Contributing to a GitHub repository](https://world.mendix.com/display/howto50/Contributing+to+a+GitHub+repository)! | ||
To check this you can use one of the two Snippets from the '_Use Me' folder. One of these snippets can be placed in the layout (Make sure that you only use 1!). | ||
You can choose between the DetectLocale and AutoRedirect snippet. | ||
|
||
## Typical usage scenario | ||
## AutoDetect | ||
This will detect the user's Language and TimeZone, if the Language or TimeZone are different from the application. If there is a difference the application will show a Notification and allows the user to ignore or apply the change to his profile. | ||
|
||
Use this template to start building a widget for Mendix 5. | ||
Alter this README.md file and describe what your widget does. | ||
|
||
## Description | ||
## AutoRedirect | ||
This will trigger the same detection process as AutoDetect. When there is a change required to the user settings the application will automatically instruct to refresh the application to use the different Language and/or TimeZone | ||
|
||
The javascript inside the widget has examples of: | ||
- Using CSS within a widget | ||
- Using templating | ||
- Loading external library's | ||
- DOM manipulation | ||
- Event attaching | ||
- Loading data | ||
- Executing microflow and sending data | ||
- Working with the context object, which is an object in the current context | ||
(e.g. the one displayed in a DataView). | ||
|
||
### Dojo AMD module list | ||
|
||
The JavaScript contains an extensive list of modules that may be used to build a | ||
widget. It is best to reduce this list to what is actually used. Use JSHint to | ||
help identify errors and problems. | ||
This process also works for anonymous users, just be aware when using Deeplink functionality. If a deeplink was used to access the page, and if you'd refresh the page again the user will end up on the homepage and not the page he was deeplinking too. | ||
|
||
** Be sure to keep the module name array and the parameter list of the anonymous | ||
function below the module list in sync! ** | ||
|
||
The following modules are necessary for all widgets: | ||
- dojo/_base/declare | ||
- mxui/widget/_WidgetBase | ||
- dijit/_Widget | ||
## Custom styling | ||
All css is currently applied through the style elements in the snippet. If you would like to customize the look and file it would be best to copy the snippets into your own project and apply styling through your project specific CSS classes. | ||
|
||
If your widget does not use an HTML template: | ||
- Remove dijit/_TemplatedMixin from the module list | ||
- Remove _Templated from the parameter list of the anonymous function below the module list | ||
- Remove _Templated from the parameter list of the declare call | ||
- Remove the templates folder | ||
|
||
If your widget does not need jQuery: | ||
- Remove WidgetName/widget/lib/jquery from the module list | ||
- Remove _jQuery from the parameter list of the anonymous function below the module list | ||
- Remove _jQuery from the parameter list of the declare call | ||
- Remove jquery.js from src\WidgetName\widget\lib\ Or remove the lib folder if you don't include external libraries in the widget. | ||
|
||
### AMD caveats | ||
Working with jQuery can be difficult due to the fact that jquery does not adhere to the AMD standard correctly. Check out [Pull Request #13](https://github.com/mendix/AppStoreWidgetBoilerplate/pull/13) or the [Dojo AMD documentation](http://dojotoolkit.org/documentation/tutorials/1.10/modules/index.html) for details. | ||
|
||
## Migrating a widget to Dojo AMD | ||
|
||
A widget that uses Dojo AMD may not refer to functions like *dojo.forEach* etc. | ||
All necessary modules must be declared on the module list at the top of the source. | ||
|
||
Replacing all 'old' Dojo calls in an existing source can be a bit of a pain. | ||
|
||
Here is a list of commonly used functions and their new counterpart: | ||
|
||
Old | New | ||
---------- |---------- | ||
mxui.dom | domMx | ||
dojo.byId | dom.byId | ||
dojo.query | document.querySelector | ||
dojo.forEach | dojoArray.forEach | ||
dojo.hitch | lang.hitch | ||
dojo.addClass | domClass.add | ||
dojo.removeClass | domClass.remove | ||
dojo.hasClass | domClass.contains | ||
dojo.replaceClass | domClass.replace | ||
dojo.empty | domConstruct.empty | ||
dojo.place | domConstruct.place | ||
dojo.on | on | ||
dojo.window | win | ||
|
||
The referenced modules are in the module list of the boilerplate JavaScript. | ||
The reason why all CSS in this module is done through the style elements is because of easy sharing of the module. Since css class definitions can't automatically be added the css is done throught the Style element to allow an easy start with this module. |
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.