1.5 Demos: various issues

[jaspermdegroot]

WIP branch: 1.5-demos-issues (base branch: 1.5-dev)

Preview: http://view.jquerymobile.com/1.5-demos-issues/demos/

Update: If you want to help with updating/fixing the demos for version 1.5, please let us know in a comment on this ticket so we can prevent that multiple people work on the same thing. Thanks!

• Main menu: duplicates (most widgets)
• Main menu: Icons section shouldn't be under Theming section
• Main menu: update markup to new accordion widget
• Main menu: 3rd level is missing indent
• Main menu: double border when 2nd level is a collapsible (expand "Widgets" to see the issue)
• Main menu: should other jQuery UI widgets should also get "3rd party" banner just like Datepicker?
• Menu appears twice in C-grade: initially hide the search autocomplete menu content with CSS and reveal with JS (see Demos: Menu appears twice in C-grade #7679)
• Icons in header (search and menu) shouldn't get shadow
• Update CSS/markup of quick links and API docs links
• Cleanup/update demos custom CSS
• Better hover style for navmenu, quick links (table of contents) menu, and search panel list
• Check if new custom styles have enough contrast on SD/Windows
• New homepage design and content
• Replace the outdated image on the homepage (and on jquerymobile.com)
• 3rd Party: Add a banner or some other notification on the demo page itself (+ warning not supported)
• Search panel is empty
• Search panel and page filterable reveal issue
• Search panel doesn't submit on enter, only after tab followed by enter
• Search panel arrow key navigation is broken
• Search panel list is empty on the search results (_search/index.php) page: probably conflict in the JS
• View source popup contains collapsibles: change to accordion or tabs (if tabs work inside popups)
• Quick links: jumps to section and then back to top (This is not a Demos specific issue, but a general issue with panels. See 1.5-dev Panel: Page scrolls to top after closing a panel. #8323 Page is not returning to the "top" state after "long" panel is closed in android 2.3.3 browser #6767. PR Panel: ScrollTop only when ui-content is out of view #8483 fixes this)
• Quick links: If you open a popup (e.g. a view source popup) after you have clicked on a link in the quick links panel or a "back to top" link, the page scrolls back to that deeplink location or top when closing the popup. This is because the url changes from something like #ui-page-top&ui-state=dialog to #ui-page-top.
• Controlgroup: Textinput demo needs to be rewritten (maybe better to make this a separate demo)
• Duplicate files in https://github.com/jquery/jquery-mobile/tree/1.5-dev/demos/toolbar-fixed-persistent-optimized
• View Source: single quotes are converted to double quotes
• Replace Slider widget by Flipswitch widget flip switches (http://view.jquerymobile.com/1.5-dev/demos/listview/#Forms, http://view.jquerymobile.com/1.5-dev/demos/forms/#Flipswitch)
• Add data-direction="vertical" to controlgroups that are supposed to be vertical
• Revert popup close button class change: ui-toolbar-header-button-right|left --> ui-button-right|left (or ui-popup-button-right|left + add class name to popup.css and deprecate ui-button-right|left)
• Headers: Add button classes to anchor elements in headers on demo pages that don't have the global header
• Rewrite Button and Icons demo pages (see first comment below)
• Test + check markup and content all demo pages
• Test with a build (manipulation of links on homepage, API docs links, version, etc.)
• Move Form widgets to Widgets section in navmenu
• Add intro paragraphs to mention that custom CSS or JS is used (e.g. http://view.jquerymobile.com/1.5-demos-issues/demos/flipswitch/#Basiccheckboxswitchwithcustomlabels)
• Highlighting of matching strings in search panel list is broken
• Remove references to iconshadow. See Demos: Remove references to iconshadow #8492 (closed as duplicate)

[jaspermdegroot]

I updated the Icons and Buttons demo pages in the 1.5-css-and-demos branch, but I think we should rewrite them. Instead of Buttons and Icons we should have Button widget and CSS-only Buttons demo pages, both including info about icons. At the top of these pages there should be a link to the other demo page. The overview of all icons and their names doesn't need to be included in both pages.

When we do this we have to update the CSS Framework section on the homepage. We should also add a CSS Framework section to the main menu.

[jaspermdegroot]

@cogwurx

Maybe you can work on these design/style issues:

• Better hover style for navmenu, quick links (table of contents) menu, and search panel list
• Check if new custom styles have enough contrast on SD/Windows
• New homepage design and content
• Replace the outdated image on the homepage (and on jquerymobile.com)

Then I can continue working on updating demos content and technical issues. Does that work for you?

Thanks!

[cogwurx]

Works for me!

[jaspermdegroot]

@apsdehal - Could you please check the checkboxes in the list above of the issues with the search navigation that you have fixed already? Thanks!

[apsdehal]

@jaspermdegroot Done!

[apsdehal]

http://view.jquerymobile.com/1.5-dev/demos/transitions/ should also refrain from using dialogs in examples.

[ronsweb]

Bring 1.5 demo site under https.
http://view.jquerymobile.com/1.5-demos-issues/demos/map-geolocation/

Google Maps Geolocation now only supports https.
Throws warning: getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.

Details to the google maps geolocation is at:
https://developers.google.com/web/updates/2016/04/geolocation-on-secure-contexts-only

[ronsweb]

Popup Date Picker broken on 1.5 demo
http://view.jquerymobile.com/1.5-demos-issues/demos/datepicker/

Throwing error in console: $(...).zIndex is not a function
Line 746: inst.dpDiv.zIndex($(input).zIndex()+1);

Possible fix is to update to the latest jqueryUI. The 1.5 demo is using 1.10.4. Should be latest 1.12.0
Page is using:
http://cdn.rawgit.com/jquery/jquery-ui/1.10.4/ui/jquery.ui.datepicker.js

Tested in Chrome 52 and Firefox 48.0.1

[ecadius]

Can we make a detailed review after the merge of two corresponding pull requests #8628 #8524 ?
Most of the remaining open tasks are unclear or not reproduceable.