exports.id = 659;
exports.ids = [659];
exports.modules = {

/***/ 633:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "data": () => (/* binding */ data)
/* harmony export */ });
const data = {
  "key": "v-84af4ab8",
  "path": "/controller.html",
  "title": "IController/AController",
  "lang": "en-US",
  "frontmatter": {},
  "excerpt": "",
  "headers": [],
  "filePathRelative": "controller.md",
  "git": {
    "updatedTime": 1542013762000,
    "contributors": [
      {
        "name": "Joe",
        "email": "mitchelljoe3@gmail.com",
        "commits": 4
      }
    ]
  }
}


/***/ }),

/***/ 837:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// EXPORTS
__webpack_require__.d(__webpack_exports__, {
  "default": () => (/* binding */ controller)
});

// EXTERNAL MODULE: external "vue"
var external_vue_ = __webpack_require__(103);
// EXTERNAL MODULE: external "@vue/server-renderer"
var server_renderer_ = __webpack_require__(745);
;// CONCATENATED MODULE: ./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[1]!./node_modules/@vuepress/bundler-webpack/lib/build/ssr/vuepressLoader.js!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./doc/.vuepress/.temp/pages/controller.vue?vue&type=template&id=126334e4



function ssrRender(_ctx, _push, _parent, _attrs) {
  const _component_RouterLink = (0,external_vue_.resolveComponent)("RouterLink")

  _push(`<!--[--><h1 id="icontroller-acontroller"><a class="header-anchor" href="#icontroller-acontroller">#</a> IController/AController</h1><p>IController is an interface for what is essentially an event handler. AController is a minimal abstract class over that interface. MarkedText will take any object that satisfies this interface for the property &#39;controller&#39;.</p><div class="language-typescript ext-ts line-numbers-mode"><pre class="language-typescript"><code><span class="token keyword">interface</span> <span class="token class-name">IController</span> <span class="token punctuation">{</span>
  <span class="token function">link</span><span class="token punctuation">(</span>mt<span class="token operator">:</span> IMarkedText<span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token function">unlink</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token function">onMouseUpText</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token function">onMouseUpMark</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">,</span> marks<span class="token operator">:</span> IMark<span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token function">onMouseUpSelection</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token function">onMouseUpMetaString</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">,</span> metaStringText<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token function">onMouseUpOther</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><div class="language-typescript ext-ts line-numbers-mode"><pre class="language-typescript"><code><span class="token keyword">abstract</span> <span class="token keyword">class</span> <span class="token class-name">AController</span> <span class="token keyword">implements</span> <span class="token class-name">IController</span> <span class="token punctuation">{</span>
  <span class="token keyword">protected</span> markedText<span class="token operator">:</span> IMarkedText <span class="token operator">|</span> <span class="token keyword">null</span> <span class="token operator">=</span> <span class="token keyword">null</span>
  <span class="token keyword">public</span> <span class="token function">link</span><span class="token punctuation">(</span>mt<span class="token operator">:</span> IMarkedText<span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">this</span><span class="token punctuation">.</span>markedText <span class="token operator">=</span> mt
  <span class="token punctuation">}</span>
  <span class="token keyword">public</span> <span class="token function">unlink</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">this</span><span class="token punctuation">.</span>markedText <span class="token operator">=</span> <span class="token keyword">null</span>
  <span class="token punctuation">}</span>
  <span class="token keyword">public</span> <span class="token keyword">abstract</span> <span class="token function">onMouseUpText</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token keyword">public</span> <span class="token keyword">abstract</span> <span class="token function">onMouseUpMark</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">,</span> marks<span class="token operator">:</span> IMark<span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token keyword">public</span> <span class="token keyword">abstract</span> <span class="token function">onMouseUpSelection</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token keyword">public</span> <span class="token keyword">abstract</span> <span class="token function">onMouseUpMetaString</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">,</span> charRange<span class="token operator">:</span> <span class="token punctuation">[</span><span class="token builtin">number</span><span class="token punctuation">,</span> <span class="token builtin">number</span><span class="token punctuation">]</span><span class="token punctuation">,</span> metaStringText<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
  <span class="token keyword">public</span> <span class="token keyword">abstract</span> <span class="token function">onMouseUpOther</span><span class="token punctuation">(</span>e<span class="token operator">:</span> Event<span class="token punctuation">)</span><span class="token operator">:</span> <span class="token keyword">void</span>
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br></div></div><p>Your custom controller must implement IController and probably should extend AController if you want to be able to directly access the MarkedText from your controller, e.g. to modify highlighting. MarkedText calls link and unlink appropriately so that an AController should always have access to the MarkedText it is a property of.</p><h1 id="reasoning"><a class="header-anchor" href="#reasoning">#</a> Reasoning</h1><p>This allows for callbacks to trigger when there is a mouse up event in:</p><ul><li>plain text spans</li><li>marked spans</li><li>the selection span (internal selection controlled by vue-mark-text)</li><li>meta strings added to the marked text (fragile feature for now)</li><li>anywhere else in the component</li></ul><p>e is the actual mouse event triggering the controller. charRange is the tuple of character indices for the span the up-click is triggered in, to allow for easy manipulation of clicked text. marks is the list of marks under the mouse on mouse up. metaStringText is the text of the meta-string (foreign to the provided source text) that is clicked. Any of these events can have no callback.</p><p>Obviously, the events could be emitted from MarkedText and caught in the parent object, but this was deemed a more robust solution.</p><h1 id="concrete-controllers"><a class="header-anchor" href="#concrete-controllers">#</a> Concrete Controllers</h1><p>Three example controllers are provided in the library and displayed on the `)
  _push((0,server_renderer_.ssrRenderComponent)(_component_RouterLink, { to: "/example.html" }, {
    default: (0,external_vue_.withCtx)((_, _push, _parent, _scopeId) => {
      if (_push) {
        _push(`Example`)
      } else {
        return [
          (0,external_vue_.createTextVNode)("Example")
        ]
      }
    }),
    _: 1
  }, _parent))
  _push(` page.</p><p>The first is <code>NullController</code>, which allows no interactivity and merely displays the marked text as initialized.</p><p>The second is <code>TextSelectionController</code>. This controller allows selection of text and marks and triggers supplied callbacks when selection is changed.</p><ul><li>The selection is managed internally and will not interfere with selection on other parts of the window for browsers that allow only one selection.</li><li>If a section of text is selected, a callback &#39;selectNewCbk&#39; is triggered with the calculated character range.</li><li>If a mark is clicked and not dragged (which would trigger the above), the callback &#39;selectMarkCbk&#39; is triggered with the marks under the mouse.</li><li>If a selection, meta-string, or other is clicked, the event is consumed and selection is reset.</li><li>Selection is automatically set along with the callbacks; this may be optional in the future.</li></ul><p>The third is <code>WordSelectionController</code>. This controller inherits from <code>TextSelectionController</code> with the added functionality of expanding and contracting selected text to the nearest whitespace/word boundaries.</p><ul><li>If a section of text is selected or a word is clicked, the text is expanded or contracted to the nearest word boundary and &#39;selectNewCbk&#39; is triggered.</li></ul><!--]-->`)
}
;// CONCATENATED MODULE: ./doc/.vuepress/.temp/pages/controller.vue?vue&type=template&id=126334e4

;// CONCATENATED MODULE: ./doc/.vuepress/.temp/pages/controller.vue

const script = {}
;
script.ssrRender = (...args) => {
  const ssrContext = args[2].appContext.provides[external_vue_.ssrContextKey]
  ssrContext._registeredComponents.add("/home/joe/webbery/mortalarcjs/vue-mark-text/node_modules/@vuepress/bundler-webpack/lib/build/ssr/vuepressLoader.js!/home/joe/webbery/mortalarcjs/vue-mark-text/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!/home/joe/webbery/mortalarcjs/vue-mark-text/doc/.vuepress/.temp/pages/controller.vue")
  return ssrRender(...args)
}


/* harmony default export */ const controller = (script);

/***/ })

};
;
//# sourceMappingURL=659.app.js.map