Details

    • Type: Task
    • Status: Closed (View Workflow)
    • Priority: Major
    • Resolution: Done
    • Affects Version/s: None
    • Fix Version/s: None
    • Labels:
      None
    • Story Points:
      0.5
    • Sprint:
      Spring 3 2021 Apr 19 - Apr 30, Spring 4 2021 May 3 - May 14, Spring 5 2021 May 17 - May 28, Spring 6 2021 May 31 - June 11

      Description

      App Store has a link labeled "Watch a demo" at the top of the page.
      When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
      It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
      As an example of how this can work, see: https://www.techsmith.com/video-editor.html
      For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.

      The video player should contain all the expected controls such as:

      • rewind or advance the video
      • show in full screen mode
      • go to youtube
        and etc.

      Before commencing work, kindly research the different options for doing this using bootstrap classes, since the site is configured using bootstrap. Take notes on your research here. google search "popup video"

        Attachments

          Activity

          ann.loraine Ann Loraine created issue -
          ann.loraine Ann Loraine made changes -
          Field Original Value New Value
          Epic Link IGBF-2563 [ 18746 ]
          ann.loraine Ann Loraine made changes -
          Story Points 2 0.5
          ann.loraine Ann Loraine made changes -
          Description App Store has a link labeled "Watch a demo" at the top of the page.
          When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
          It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
          As an example of how this can work, see: https://www.techsmith.com/video-editor.html

          For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.
          App Store has a link labeled "Watch a demo" at the top of the page.
          When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
          It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
          As an example of how this can work, see: https://www.techsmith.com/video-editor.html
          For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.

          The video player should contain all the expected controls such as:
          * rewind or advance the video
          * show in full screen mode
          * go to youtube
          and etc.

          Before commencing work, kindly research the different options for doing this using bootstrap classes, since the site is configured using bootstrap.
          ann.loraine Ann Loraine made changes -
          Description App Store has a link labeled "Watch a demo" at the top of the page.
          When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
          It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
          As an example of how this can work, see: https://www.techsmith.com/video-editor.html
          For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.

          The video player should contain all the expected controls such as:
          * rewind or advance the video
          * show in full screen mode
          * go to youtube
          and etc.

          Before commencing work, kindly research the different options for doing this using bootstrap classes, since the site is configured using bootstrap.
          App Store has a link labeled "Watch a demo" at the top of the page.
          When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
          It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
          As an example of how this can work, see: https://www.techsmith.com/video-editor.html
          For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.

          The video player should contain all the expected controls such as:
          * rewind or advance the video
          * show in full screen mode
          * go to youtube
          and etc.

          Before commencing work, kindly research the different options for doing this using bootstrap classes, since the site is configured using bootstrap. Take notes on your research here.
          ann.loraine Ann Loraine made changes -
          Description App Store has a link labeled "Watch a demo" at the top of the page.
          When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
          It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
          As an example of how this can work, see: https://www.techsmith.com/video-editor.html
          For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.

          The video player should contain all the expected controls such as:
          * rewind or advance the video
          * show in full screen mode
          * go to youtube
          and etc.

          Before commencing work, kindly research the different options for doing this using bootstrap classes, since the site is configured using bootstrap. Take notes on your research here.
          App Store has a link labeled "Watch a demo" at the top of the page.
          When users click the link, the Web browser takes them to a YouTube page where they can watch the video.
          It would be nicer if instead of going to a new page, a video player opens on the current page and plays the video.
          As an example of how this can work, see: https://www.techsmith.com/video-editor.html
          For this task, modify the code so that when a user clicks the link, a video player appears in the same page, allowing the user to watch the video without leaving the page.

          The video player should contain all the expected controls such as:
          * rewind or advance the video
          * show in full screen mode
          * go to youtube
          and etc.

          Before commencing work, kindly research the different options for doing this using bootstrap classes, since the site is configured using bootstrap. Take notes on your research here. google search "popup video"
          ann.loraine Ann Loraine made changes -
          Summary Show demo video in same window as app store Show demo video in popup
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status To-Do [ 10305 ] In Progress [ 3 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status In Progress [ 3 ] To-Do [ 10305 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status To-Do [ 10305 ] In Progress [ 3 ]
          ann.loraine Ann Loraine made changes -
          Sprint Spring 3 2021 Apr 19 - Apr 30 [ 119 ] Spring 3 2021 Apr 19 - Apr 30, Spring 4 2021 May 3 - May 14 [ 119, 120 ]
          ann.loraine Ann Loraine made changes -
          Rank Ranked higher
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status In Progress [ 3 ] Needs 1st Level Review [ 10005 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - Diff: https://bitbucket.org/chirag06/appstore/commits/32e8af9f6455d5381eac27cadfc9329d5eed4ef1
          Hide
          ann.loraine Ann Loraine added a comment - - edited

          Request for Chirag Chandrahas Shetty:

          Could you deploy this on one of the "dev" appstores for a demo?

          Show
          ann.loraine Ann Loraine added a comment - - edited Request for Chirag Chandrahas Shetty : Could you deploy this on one of the "dev" appstores for a demo?
          ann.loraine Ann Loraine made changes -
          Status Needs 1st Level Review [ 10005 ] First Level Review in Progress [ 10301 ]
          ann.loraine Ann Loraine made changes -
          Status First Level Review in Progress [ 10301 ] To-Do [ 10305 ]
          ann.loraine Ann Loraine made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status To-Do [ 10305 ] In Progress [ 3 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status In Progress [ 3 ] Needs 1st Level Review [ 10005 ]
          Hide
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment -

          Deployed the changes on https://devappstore5.bioviz.org/

          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - Deployed the changes on https://devappstore5.bioviz.org/
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Ann Loraine [ aloraine ]
          Hide
          ann.loraine Ann Loraine added a comment - - edited

          Request:

          Can you change the button back to a link, as in the original? (The big blue button doesn't line up properly with the other elements of the header and looks a bit weird. The hyperlinked text is centered and also less obtrusive, so I'd like to keep using it.)

          Show
          ann.loraine Ann Loraine added a comment - - edited Request: Can you change the button back to a link, as in the original? (The big blue button doesn't line up properly with the other elements of the header and looks a bit weird. The hyperlinked text is centered and also less obtrusive, so I'd like to keep using it.)
          ann.loraine Ann Loraine made changes -
          Status Needs 1st Level Review [ 10005 ] First Level Review in Progress [ 10301 ]
          ann.loraine Ann Loraine made changes -
          Status First Level Review in Progress [ 10301 ] To-Do [ 10305 ]
          ann.loraine Ann Loraine made changes -
          Assignee Ann Loraine [ aloraine ] Chirag Chandrahas Shetty [ chirag24 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status To-Do [ 10305 ] In Progress [ 3 ]
          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - - edited Diff: https://bitbucket.org/chirag06/appstore/commits/91241557678a6b7fb46f223881dd1eabc6330ed2 Deployed the changes on https://devappstore5.bioviz.org/
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status In Progress [ 3 ] Needs 1st Level Review [ 10005 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          Hide
          ann.loraine Ann Loraine added a comment - - edited

          One final request: Please change text "Watch a demo" to "Play video"

          Show
          ann.loraine Ann Loraine added a comment - - edited One final request: Please change text "Watch a demo" to "Play video"
          ann.loraine Ann Loraine made changes -
          Status Needs 1st Level Review [ 10005 ] First Level Review in Progress [ 10301 ]
          ann.loraine Ann Loraine made changes -
          Status First Level Review in Progress [ 10301 ] To-Do [ 10305 ]
          ann.loraine Ann Loraine made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - diff: https://bitbucket.org/chirag06/appstore/commits/0eb83ccd36c4f1cfbb3bed799383deb4e5cbcf5a
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status To-Do [ 10305 ] In Progress [ 3 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status In Progress [ 3 ] Needs 1st Level Review [ 10005 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          ann.loraine Ann Loraine made changes -
          Sprint Spring 3 2021 Apr 19 - Apr 30, Spring 4 2021 May 3 - May 14 [ 119, 120 ] Spring 3 2021 Apr 19 - Apr 30, Spring 4 2021 May 3 - May 14, Spring 5 2021 May 17 - May 28 [ 119, 120, 121 ]
          ann.loraine Ann Loraine made changes -
          Rank Ranked higher
          ann.loraine Ann Loraine made changes -
          Status Needs 1st Level Review [ 10005 ] First Level Review in Progress [ 10301 ]
          ann.loraine Ann Loraine made changes -
          Status First Level Review in Progress [ 10301 ] Ready for Pull Request [ 10304 ]
          Hide
          ann.loraine Ann Loraine added a comment -

          Looks good - please submit PR.

          Show
          ann.loraine Ann Loraine added a comment - Looks good - please submit PR.
          ann.loraine Ann Loraine made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - [~aloraine] Please review the following PR link: https://bitbucket.org/lorainelab/appstore/pull-requests/282/igbf-2839-show-demo-video-in-popup
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status Ready for Pull Request [ 10304 ] Pull Request Submitted [ 10101 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ] Ann Loraine [ aloraine ]
          ann.loraine Ann Loraine made changes -
          Status Pull Request Submitted [ 10101 ] Reviewing Pull Request [ 10303 ]
          ann.loraine Ann Loraine made changes -
          Status Reviewing Pull Request [ 10303 ] Merged Needs Testing [ 10002 ]
          ann.loraine Ann Loraine made changes -
          Assignee Ann Loraine [ aloraine ]
          Hide
          ann.loraine Ann Loraine added a comment -

          Merged but not yet deployed on test server.

          Show
          ann.loraine Ann Loraine added a comment - Merged but not yet deployed on test server.
          Hide
          ann.loraine Ann Loraine added a comment -

          Deployed to https://devappstore3.bioviz.org/ for testing.

          Show
          ann.loraine Ann Loraine added a comment - Deployed to https://devappstore3.bioviz.org/ for testing.
          Hide
          nfreese Nowlan Freese added a comment -

          Tested on Mac with Chrome.

          Video popup was working correctly, various controls such as pause were working.

          Dr. [~aloraine], should I close the issue or leave it until the changes have been pushed to production?

          Show
          nfreese Nowlan Freese added a comment - Tested on Mac with Chrome. Video popup was working correctly, various controls such as pause were working. Dr. [~aloraine] , should I close the issue or leave it until the changes have been pushed to production?
          Hide
          ann.loraine Ann Loraine added a comment - - edited

          I deployed the new code to a freshly created EC2 (prodappstore1) with domain name "apps.bioviz.org" and then associated this address with the new EC2's public IP address in my /etc/hosts file.

          However, when I visit the site and click the "Play video" link, the video does not play.

          This may have something to do with the fact that the site is claiming to be "apps.bioviz.org" when it is not.

          Am deploying to a new host (devappstore8) and associated devappstore8.bioviz.org with its public IP in DNS.

          Show
          ann.loraine Ann Loraine added a comment - - edited I deployed the new code to a freshly created EC2 (prodappstore1) with domain name "apps.bioviz.org" and then associated this address with the new EC2's public IP address in my /etc/hosts file. However, when I visit the site and click the "Play video" link, the video does not play. This may have something to do with the fact that the site is claiming to be "apps.bioviz.org" when it is not. Am deploying to a new host (devappstore8) and associated devappstore8.bioviz.org with its public IP in DNS.
          Hide
          ann.loraine Ann Loraine added a comment -

          Confirmed – the problem was due to public DNS mismatch.

          Moving to Done.

          Show
          ann.loraine Ann Loraine added a comment - Confirmed – the problem was due to public DNS mismatch. Moving to Done.
          ann.loraine Ann Loraine made changes -
          Status Merged Needs Testing [ 10002 ] Post-merge Testing In Progress [ 10003 ]
          ann.loraine Ann Loraine made changes -
          Resolution Done [ 10000 ]
          Status Post-merge Testing In Progress [ 10003 ] Closed [ 6 ]
          ann.loraine Ann Loraine made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          Hide
          ann.loraine Ann Loraine added a comment -

          Re-opening:

          The full screen option does not work, and the video is too small to see some of the key details. The video either needs to be larger or full-screen needs to be enabled.
          Also, there is no "go to YouTube" option, which would let the user view the video on YouTube and then get to see other videos available from the channel.

          Show
          ann.loraine Ann Loraine added a comment - Re-opening: The full screen option does not work, and the video is too small to see some of the key details. The video either needs to be larger or full-screen needs to be enabled. Also, there is no "go to YouTube" option, which would let the user view the video on YouTube and then get to see other videos available from the channel.
          ann.loraine Ann Loraine made changes -
          Resolution Done [ 10000 ]
          Status Closed [ 6 ] To-Do [ 10305 ]
          Hide
          ann.loraine Ann Loraine added a comment - - edited

          Chirag Chandrahas Shetty - Please modify the code to enable fullscreen mode for the video. Also enable "go to YouTube" option.

          Show
          ann.loraine Ann Loraine added a comment - - edited Chirag Chandrahas Shetty - Please modify the code to enable fullscreen mode for the video. Also enable "go to YouTube" option.
          Hide
          ann.loraine Ann Loraine added a comment - - edited

          I switched the public appstore address to the new ec2 (prodappstore1). However, the video still does not play, which is not what I expected.

          I think the javascript code for displaying the embedded needs to be better designed so that if YouTube refuses to provide the content, some kind of message is shown to the user or, better yet, the browser opens the old YouTube link.

          Detecting failure to play can probably be done by accessing the response code from YouTube.

          attn: Chirag Chandrahas Shetty

          Show
          ann.loraine Ann Loraine added a comment - - edited I switched the public appstore address to the new ec2 (prodappstore1). However, the video still does not play, which is not what I expected. I think the javascript code for displaying the embedded needs to be better designed so that if YouTube refuses to provide the content, some kind of message is shown to the user or, better yet, the browser opens the old YouTube link. Detecting failure to play can probably be done by accessing the response code from YouTube. attn: Chirag Chandrahas Shetty
          Hide
          ann.loraine Ann Loraine added a comment -

          Testing video playback using another computer's browser. On the other computer, the video played as it should. Chirag Chandrahas Shetty - you probably will not be able to reproduce the playback problem on your machine, so don't worry about it.

          Do please handle the issue with enabling fullscreen mode when you're working next.

          Show
          ann.loraine Ann Loraine added a comment - Testing video playback using another computer's browser. On the other computer, the video played as it should. Chirag Chandrahas Shetty - you probably will not be able to reproduce the playback problem on your machine, so don't worry about it. Do please handle the issue with enabling fullscreen mode when you're working next.
          Hide
          ann.loraine Ann Loraine added a comment -

          See the code working on this page - it may help with figuring out how to enable full-screen mode: https://www.bioviz.org/overview.html

          Show
          ann.loraine Ann Loraine added a comment - See the code working on this page - it may help with figuring out how to enable full-screen mode: https://www.bioviz.org/overview.html
          ann.loraine Ann Loraine made changes -
          Sprint Spring 3 2021 Apr 19 - Apr 30, Spring 4 2021 May 3 - May 14, Spring 5 2021 May 17 - May 28 [ 119, 120, 121 ] Spring 3 2021 Apr 19 - Apr 30, Spring 4 2021 May 3 - May 14, Spring 5 2021 May 17 - May 28, Spring 6 2021 May 31 - June 11 [ 119, 120, 121, 122 ]
          ann.loraine Ann Loraine made changes -
          Rank Ranked higher
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status To-Do [ 10305 ] In Progress [ 3 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status In Progress [ 3 ] Needs 1st Level Review [ 10005 ]
          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - Diff: https://bitbucket.org/chirag06/appstore/commits/0587e6f570ff55d923945769e0281ca04f8d1213
          Hide
          ann.loraine Ann Loraine added a comment -

          Thanks! Sorry about the frantic comments regarding the video not playing. Running in incognito mode fixed the problem for my Chrome browser.

          Show
          ann.loraine Ann Loraine added a comment - Thanks! Sorry about the frantic comments regarding the video not playing. Running in incognito mode fixed the problem for my Chrome browser.
          ann.loraine Ann Loraine made changes -
          Status Needs 1st Level Review [ 10005 ] First Level Review in Progress [ 10301 ]
          ann.loraine Ann Loraine made changes -
          Status First Level Review in Progress [ 10301 ] Ready for Pull Request [ 10304 ]
          Show
          chirag24 Chirag Chandrahas Shetty (Inactive) added a comment - PR: https://bitbucket.org/lorainelab/appstore/pull-requests/283
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Status Ready for Pull Request [ 10304 ] Pull Request Submitted [ 10101 ]
          chirag24 Chirag Chandrahas Shetty (Inactive) made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ] Ann Loraine [ aloraine ]
          ann.loraine Ann Loraine made changes -
          Status Pull Request Submitted [ 10101 ] Reviewing Pull Request [ 10303 ]
          ann.loraine Ann Loraine made changes -
          Status Reviewing Pull Request [ 10303 ] Merged Needs Testing [ 10002 ]
          ann.loraine Ann Loraine made changes -
          Assignee Ann Loraine [ aloraine ]
          ann.loraine Ann Loraine made changes -
          Status Merged Needs Testing [ 10002 ] Post-merge Testing In Progress [ 10003 ]
          ann.loraine Ann Loraine made changes -
          Resolution Done [ 10000 ]
          Status Post-merge Testing In Progress [ 10003 ] Closed [ 6 ]
          ann.loraine Ann Loraine made changes -
          Assignee Chirag Chandrahas Shetty [ chirag24 ]
          Hide
          ann.loraine Ann Loraine added a comment -

          Merged, tested, and deployed into production.

          Show
          ann.loraine Ann Loraine added a comment - Merged, tested, and deployed into production.

            People

            • Assignee:
              chirag24 Chirag Chandrahas Shetty (Inactive)
              Reporter:
              ann.loraine Ann Loraine
            • Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: