cgkineo / adapt-quicknav Goto Github PK

Should use window.top.close rather than window.close

It seems that the quick nav is no longer working when applied to content objects in contentObjects.json. Instead, it's required to create a new component to house the quick nav. In previous versions, adding to a content object worked fine.

Here is what I'm adding to a typical content object:

        "_quicknav": {
		    "_isEnabled": true,
		    "_isContinuous": "global",
		    "_injectIntoSelector": "",
	        "_global": {
		        "_pageNext":"co-300",
		        "_pagePrevious": "co-100"
		    }, 
		    "_buttons": {
		    	"_hasIcons": true,
		        "_root": {
		            "_isHidden": false,
		            "text": "Menu",
		            "_icon": "icon-home"
		        },
		        "_up": {
		            "_isHidden": true,
		            "text": "Back to menu",
		            "_icon": "icon-home"
		        },
		        "_previous": {
		            "_isHidden": false,
		            "text": "Previous Topic",
		            "_icon": "icon-controls-left"
		        },
		        "_next": {
		            "_isHidden": false,
		            "text": "Next Topic",
		            "_icon": "icon-controls-right"
		        }
		    }
		}

Note that I am not using an article reveal or a block slider.

Subject of the issue/enhancement/features

The tooltips do not align with their corresponding button.

Your environment

• Framework v4.3.0
• Chrome 76.0.3809.100
• OSX

Steps to reproduce

Run adapt create course in a new folder
git clone https://github.com/cgkineo/adapt-quicknav
Add quicknav json to components.json
Run grunt dev and grunt server
Hover over quicknav buttons

Expected behaviour

Tooltips should be aligned alongside their corresponding buttons.

Screenshots (if you can)

Could be related to #70

@oliverfoster - I think you are aware of this, but did not see a logged issue.

If you have a sub-menu in your course - the main menu pages Quick Nav previous and next buttons do not work. If clicked - nothing happens.

If you use the new version of quicknav on the start page of a course, you get the following error in the console:

Adapt.findById() unable to find collection type for id: undefined

Which isn't surprising since you'd expect Adapt.location._previousId to be undefined on the start page.

Perhaps change getReturnToPreviousLocation to return Adapt.location._previousId ? Adapt.findById(Adapt.location._previousId) : null; ?

I couldn't even get it to upload - 'upload failed' error.

This post on the forums reports a slightly different issue in that she could get it to upload but then not actually use it.

it doesn't check a content object's _isAvailable property when calculating the next/previous item to navigate to, allowing the user to navigate to content objects that have been hidden from the course by things like the role selector

If a Article Block Slider or Article Reveal is used at the bottom of the page QuickNav will not show below it.

Current workaround is having an empty article + block with a blank component below it. It would be better if this could just be avoided.

I think I'm right in saying that currently there's no way to implement any kind of locking of the quick nav buttons on the intro page of course that has the structure Intro page > Menu > Other pages...?

It would be extremely useful to be able to do this since you typically want to be quite hot about preventing the learner from getting past the intro page without having completed everything - as the intro page isn't typically shown on the menu (when there is a link back to it, there's generally no progress indicator). So if the learner does miss something they've got no way of knowing that what they missed was in the intro page.

(Yes you can put pageIncompletePrompt in - but the learner might ignore that and move forward anyway)

Here's my solution - which I'm not particularly happy with, it's just to get the conversation started!

Handlebars.registerHelper('shouldBeLocked', function(options) {
    if (this._isLocked) {
        return options.fn(this);
    }

    if (this._isDisabledUntilPageComplete && !Adapt.findById(this._isDisabledUntilPageComplete).get('_isComplete')) {
        return options.fn(this);
    }

    return options.inverse(this);
});

And here's the JSON:

"_buttons": {
    "_root": {
        "_isEnabled": true,
        "_isDisabledUntilPageComplete": "co-100",
        "_order": 1,
        "_classes": "btn-text",
        "_iconClass": "",
        "_alignIconRight": false,
        "text": "Continue",
        "ariaLabel": "Continue",
        "_showTooltip": false
    }
}

When using the tooltips and a 3 button setup the tooltip for the first button is way too far to the right.
Safari/Chrome on Mac and Firefox on Windows using Quicknav 3.1 on AT 0.6.0 Framework 3.2

Also happens on Safari Mac using Quicknav 3.0.5 on AT 0.5.0 Framework 3.0

outside of the kineo-theme, which causes an error if you try and use it with the vanilla theme

@secondary-color-inverted might be a suitable replacement...

at the moment if you want to implement locking you have to do so twice

getAllDescendantModels has since been moved to the framework.

type is set to boolean but inputType is set to Text

This will 'update the URL without creating an entry in the browser's history'

Pretty sure this is not a good thing if the course is using a 'back' button in the navbar - since it will then stop that from working properly...?

Full details of error:

Fatal error: {
 "message": "variable @button-text-color is undefined",
 "type": "Name",
 "filename": "src/components/adapt-quicknav/less/quicknav.less",
 "index": 354,
 "line": 18,
 "column": 19,
 "callLine": null,
 "extract": [
  "        .icon {",
  "            color: @button-text-color;",
  "            display: inline-block;"
 ]
}

FW version is v5.1.0
Quicknav version: v4.0.0

Now working great with the AT - It mentions being able to configure the buttons in the quick-nav though to be icons rather than text - can;t find any options in the AT interface - am I missing them?

currently you get no 'page incomplete' warning if you leave the page by clicking on one of the quickNav buttons

In multiple places, it uses this.get("_quicknav"); _quicknav does not exist in the properties.schema this causes the component to not render correctly.

Tested on framework 2.2.2

Generates an error upon installation. "Plugin upload failed" is the error.

Hello,

If an article reveal is used at the bottom of a page, the quicknav extension will be placed inside of the article reveal. It is easy enough to create a new blank article after as a workaround so this ticket is just an idea really. Would it be possible to create an exception where quicknav is placed outside of an article reveal?

When hovering over quicknav buttons in IE11, tooltips cause the page to intermittently show an extra vertical scrollbar making the page momentarily shift.

It would be great to have the option to hide the previous and next button/icons in the same way you can hide the up button and the home button.

• Add role="link" to navigation buttons
• Add unlock listener
• Add disabled on lock
• Fix view events for header rendering in framework improvements

Quicknav button currently has the selector 'btn-text' regardless of whether the button has text or icon.

The btn type selector should be dynamic depending on whether text or icons are used in order to inherit the associated styling.

Added quickNav component. Configured it for previous, home, and next with icons. Enabled Tooltips ("_showTooltip": true).

When hovering over quickNav icon in Edge, a momentary shifting of elements is seen. On closer inspection, it appears to involve the inline style "top: 0px". In F12 devtools, uncheck "top: 0px" on the tooltip div and you'll see a secondary vertical scrollbar comes into view. Seems that the transition from "visibility: hidden" to "visibility: visible" is exposing the transition from "top: auto" to "top: 0px" and invoking a scrollbar during that period.

I was able to eliminate this behaviour by switching the rules from "visibility: hidden" to "display: none". Perhaps this has impact on some possible CSS transitions, but not for my current project.

framework 3.0
quicknav 3.0.5
edge 41.16299
Windows 10 Pro

the next/previous buttons are not able to reference the aria labels in _globals - should just need {{import_globals}} adding to the top of quicknav-item.hbs

additionally not sure that having complete/incomplete is that useful, in particular it seems a bit odd having the main menu button have 'Go to main menu. Incomplete' as the aria-label.

We have used the NVDA screen reader.

Normally with NVDA the user can press the down arrow to navigate through the content. However on QuickNav, when they reach the buttons, pressing down doesn't do anything. The user must press tab to navigate through the buttons. If they try to press the right arrow then NVDA starts to read out each individual character of the button. This is the case on Chrome, Firefox & IE11.

We would expect the user to be able to use the up/down arrows to navigate through the buttons.

QuickNav v3.0.0 FW v4.0.1

Course config and screenshot to follow.

Subject of the issue/enhancement/features

In Chrome it looks like the sort which takes place on the _order of each item can cause issues with the expected order. Seems fine on other supported browsers.

Steps to reproduce

If more than 5 _siblings (actually linked to the data array containing more than 10 items) the index order of the siblings is not maintained during the sort.

It would be useful to include a button which returns the user to the last routed location, so we can use the quicknav for functionality such as navigating back from pages outside of the main content hierarchy, e.g. help pages.

Using the latest version AT, when adding it to a course using the contrib-vanilla theme, it breaks preview with the dreaded "error occurred : contact admin"

output is :

error: [05 May 2017 13:19:49 -04:00] Error: Command failed: grunt server-build:d
ev --outputdir=courses\58f65fdabd661c0023b6c327\590cb2afd3312fac1132997a\build -
-theme=adapt-contrib-vanilla --menu=adapt-contrib-boxMenu

error: [05 May 2017 13:19:49 -04:00] Error: Command failed: grunt server-build:d
ev --outputdir=courses\58f65fdabd661c0023b6c327\590cb2afd3312fac1132997a\build -
-theme=adapt-contrib-vanilla --menu=adapt-contrib-boxMenu

In the animated GIF demo on this page it looks like the Harsh theme was used. adapt-quicknav seems to work with Harsh and other themes, but consistently breaks preview when switched back to adapt-contrib-vanilla theme. any ideas what's going on?

Can only apply a page complete lock on the next button, none of the other buttons are supported. You may wish to apply a lock to this other buttons if a sting page is used or if you want to force a user to remain within the page until it is complete.

Hi,

Im sort of new to adapt but have worked quite a bit on it, two projects to be exact.

I tried copying and pasting working code from the other previous buttons and it still wont workon the second page only, the rest are fine.

Is this a common issue.

Thanks in advance for your assistance.

Using 3 buttons: < Previous, Go to main menu, and Next > on Adapt Authoring 0.6.0, framework 3.2, Quicknav 3.1

When viewing in Chrome 69 Mac Sierra or on Chrome 67 or 69 on Windows 10 the Previous button is displayed last. They are ordered correctly in all other browsers.

Having upgraded to latest AT and vanilla 3.0.0 theme, and using quicknav 3.0.5, just struggling to preview / view a published course once quicknav component has been added.

I get as far as the menu but can't open a page that includes quicknav (when set to one of its button options). Without quicknav (or when no quicknav settings are selected) the page opens fine. This took me a while to figure out as I'm only getting a loading symbol and no error message. Logs and browser console aren't giving much away either. It's happening on both new and pre-existing projects.

Any clues as to what this might be?

*** just got it working when I went back a couple of quicknav versions **

As quicknav doesn't listen for menu completion it isn't able to capture page > menu completion cascades and unlocking if a button points to a page locked by a sub menu

Looks like this crashes when a footer is assigned to a contentObject which is a parent of course. Not sure if we should always have a contentObject of _type:menu assigned to course rather than individual pages directly (if using multiple contentObjects), but if not, then it is possible to create issues with this.

Its title is Up button I'm quite sure it should be Next button.