Skip to content

Commit

Permalink
maint: Upgrade to Patternslib v4 final - content-mirror customizations.
Browse files Browse the repository at this point in the history
  • Loading branch information
thet committed Apr 20, 2021
1 parent 8271517 commit 2d456e5
Show file tree
Hide file tree
Showing 4 changed files with 43 additions and 40 deletions.
23 changes: 1 addition & 22 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,27 +1,6 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Content-mirror pattern demo</title>
<script src="bundle.js"></script>
<link rel="icon" type="image/png" href="http://patterns.cornae.com/media/favicon.png" />
<meta http-equiv="refresh" content="0; url=./src" />
</head>
<body class="sidebar-left-open generic application- ">
<div id="content" class="application">
<h1>Content-mirror pattern demo</h1>
<p class="my-mirror"
><span class="text"
><em class="placeholder">Leave a comment</em></span
><em class="selected-users" id="selected-users"></em
><em class="selected-tags" id="selected-tags"></em
></p>
<textarea class="pat-content-mirror" placeholder="Type some text" data-pat-content-mirror="target:.my-mirror .text"></textarea>
<hr />
<p class="my-other-mirror"
><span class="text"
><em class="placeholder">I am the other mirror. Try me.</em></em
></p>
<textarea class="pat-content-mirror" placeholder="Say what's on your mind" data-pat-content-mirror="target:.my-other-mirror .text"></textarea>
</div>
</body>
</html>
16 changes: 10 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,8 @@
"name": "pat-content-mirror",
"version": "1.0.0",
"description": "A pattern for content-mirror",
"author": {
"name": "Syslab GesmbH",
"email": "dev@syslab.com"
},
"license": "MIT",
"homepage": "https://gitub.com/ploneintranet/pat-content-mirror",
"main": "./src/content-mirror.js",
"main": "./src/pat-content-mirror.js",
"dependencies": {
"@patternslib/patternslib": "4"
},
Expand Down Expand Up @@ -69,5 +64,14 @@
},
"publishConfig": {
"access": "public"
},
"author": {
"name": "Syslab GesmbH",
"email": "dev@syslab.com"
},
"homepage": "https://github.com/ploneintranet/pat-PATTERN_TEMPLATE",
"repository": {
"type": "git",
"url": "https://github.com/ploneintranet/pat-PATTERN_TEMPLATE.git"
}
}
26 changes: 26 additions & 0 deletions src/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Content-mirror pattern demo</title>
<script src="/dist/bundle.js"></script>
</head>
<body class="sidebar-left-open generic application- ">
<div id="content" class="application">
<h1>Content-mirror pattern demo</h1>
<p class="my-mirror"
><span class="text"
><em class="placeholder">Leave a comment</em></span
><em class="selected-users" id="selected-users"></em
><em class="selected-tags" id="selected-tags"></em
></p>
<textarea class="pat-content-mirror" placeholder="Type some text" data-pat-content-mirror="target:.my-mirror .text"></textarea>
<hr />
<p class="my-other-mirror"
><span class="text"
><em class="placeholder">I am the other mirror. Try me.</em></em
></p>
<textarea class="pat-content-mirror" placeholder="Say what's on your mind" data-pat-content-mirror="target:.my-other-mirror .text"></textarea>
</div>
</body>
</html>
18 changes: 6 additions & 12 deletions src/pat-content-mirror.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import $ from "jquery";
import _ from "underscore";
import Base from "patternslib/src/core/base";
import Parser from "patternslib/src/core/parser";
import Base from "@patternslib/patternslib/src/core/base";
import Parser from "@patternslib/patternslib/src/core/parser";

const parser = new Parser("content-mirror");
parser.add_argument("target");
Expand All @@ -16,22 +16,18 @@ export default Base.extend({
init: function content_mirror_init($el, opts) {
const options = parser.parse($el, opts, true)[0];
this.options = _.extend(_.clone(this.defaults), options);
const $mirror = $(this.options.target)
.parents("p.content-mirror")
.first();
const $mirror = $(this.options.target).parents("p.content-mirror").first();
$el.on(
"input propertychange",
$.proxy(this.updateMirror, this, this.options.target)
);
$el.parents("form")
.first()
.on("reset", function (e) {
.on("reset", function () {
$el.val("");
$mirror.html($mirror.html());
});
$(".placeholder", this.options.target).text(
$el.attr("placeholder") || ""
);
$(".placeholder", this.options.target).text($el.attr("placeholder") || "");
},

updateMirror: function updateMirror(target, ev) {
Expand All @@ -41,9 +37,7 @@ export default Base.extend({
if (!$el.val().length) {
const placeholder = $el.attr("placeholder");
if (placeholder) {
the_mirror.html(
'<em class="placeholder">' + placeholder + "</em>"
);
the_mirror.html('<em class="placeholder">' + placeholder + "</em>");
}
}
},
Expand Down

0 comments on commit 2d456e5

Please sign in to comment.