EditPosFix

Summary: Memorize both the last scroll position and cursor position when editing.
Version: 20160728
Prerequisites: None
Maintainer: Ling-San Meng
License: GPL3+
Categories: Editing
Users: (view? / edit)
Discussion: EditPosFix-Talk?

All sections are optional, you can remove those that do not apply to your recipe, and add new ones.

Description

Demo available at Jsfiddle:
https://jsfiddle.net/r7123p8w/2/

This recipe memorizes both the scroll and cursor positions when editing using "local storage" provided by HTML5. Since the positions are locally stored, they will be memorized even after hitting "Save and edit", or a page refresh. With this recipe, editing can continue in an undisturbed way after hitting "Save and edit", much like pressing ctrl+S on common text editors. Each PmWiki page has a separate local storage, which means the scroll/cursor positions are memorized separately for each page.

I am aware that there are several existing recipes which achieve similar functions (e.g., PositioningCursorInEditForm, RememberEditPosition, NotSavedWarning). So, explanation on the differences is in order. First, in addition to the scroll position, this recipe also memorizes the cursor position. Second, auto-focus is supported so editing continues smoothly after hitting "Save and edit". Third, the methods by which existing recipes memorize scroll position involve GET/POST, which means the position is sent to the server side. This is not ideal as the editing position is a local property. Sending to the server adds to its burden and the traffic. Finally, each page is memorized separately.

Note that this recipe can work with NotSavedWarning.

Installation

  • Download editposfix.zipΔ
  • Place the /editposfix/ dir with all files in your /pub/ directory.
  • Add to local/config.php the following lines:
    if ($action == 'edit')
    {
      $HTMLHeaderFmt['editposfix'] = "
      <script type='text/javascript' src='$PubDirUrl/editposfix/editposfix.js'></script>
      <script type='text/javascript'>EditPosFix.pagename='$pagename'; </script>";
    }

Notes

Editing after hitting "Save and edit" has always been a pain for me as I have to scroll back to find the last editing positions. Even with some existing solutions, I still have to locate the last cursor position. Also, for a very long page, I found it desirable if the last editing position can be remembered even after the page is closed or reopened. This recipe provides such a solution. Note that this recipe works on Chrome and Safari. Support for other browsers has not been tested.

Change log / Release notes

If the recipe has multiple releases, then release notes can be placed here. Note that it's often easier for people to work with "release dates" instead of "version numbers".

  • 20160728 - first release.

Contributors

See also

Comments

See discussion at EditPosFix-Talk?.

User notes? : If you use, used or reviewed this recipe, you can add your name. These statistics appear in the Cookbook listings and will help newcomers browsing through the wiki.