Permalink
Browse files

Added Inlineeditor.Textarea to demo page

  • Loading branch information...
1 parent 31be55e commit a19511fb73a444a978162176dd295b6931fa579f @reednj committed Sep 11, 2011
Showing with 36 additions and 22 deletions.
  1. +36 −22 Test/demo.html
View
@@ -12,57 +12,60 @@
<script src='../Source/InlineEditor.js' type='text/javascript'></script>
<script src='../Source/InlineEditor.Combo.js' type='text/javascript'></script>
+<script src='../Source/InlineEditor.Textarea.js' type='text/javascript'></script>
<style type='text/css'>
#t-body {
font-size: 16pt;
+
margin: 32px;
+ padding-bottom: 32px;
}
-
+
.box {
padding: 16px;
}
-
+
span.small-edit {
font-weight:bold;
}
-
+
.small-edit input[type=text] {
width: 32px;
}
-
- .edit a, .editable a, .dropdown a, .cs-c a {
+
+ .edit a, .editable a, .dropdown a, .cs-c a, #ta-edit a {
background-color: #cef;
padding: 1px 3px;
}
-
+
.dropdown {
margin: 3px;
}
-
+
#color-target {
margin-top: 8px;
- width: 48px;
- height: 48px;
- background-color: white;
+ width: 48px;
+ height: 48px;
+ background-color: white;
border: 2px solid gray;
}
-
+
div.desc {
font-weight: bold;
}
-
+
#title {
padding-bottom: 16px;
margin-bottom: 16px;
border-bottom: 4px solid #ddd;
}
-
+
#t-main {
font-size: 18pt;
font-weight: bold;
}
-
+
#t-sub {
font-size: 10pt;
font-weight: bold;
@@ -77,20 +80,22 @@
$$('.small-edit').each(function(item) {
new InlineEditor(item, {hide_buttons: true});
});
-
+
$$('.edit').each(function(item) {
new InlineEditor(item, {'url':'api/edittest.php'});
});
-
+
$$('.dropdown').each(function(item) {
new InlineEditor.Combo(item, {'url':'api/edittest.php'});
});
-
+
new InlineEditor.Combo('color-select', {
onSuccess: function(new_text, new_value) {
$('color-target').setStyle('background-color', new_value);
}
- });
+ });
+
+ new InlineEditor.Textarea('ta-edit');
}
}
@@ -101,7 +106,7 @@
</head>
<body>
-
+
<div id='t-body'>
<div id='title'>
<div id='t-main'>InlineEditor for Mootools</div>
@@ -132,7 +137,7 @@
<div data-value='4'>Delta</div>
<div data-value='5'>Echo</div>
</div>
-
+
<div class='dropdown'>
<div data-value='WA'>Western Australia</div>
<div data-value='SA'>South Australia</div>
@@ -147,15 +152,15 @@
<div class='desc'>For small textboxes you can set the 'hide_buttons' option. (and use css to set the input width)</div>
<div class='box'>
<div>
- Set Minimum: <span class='editable small-edit' data-url='api/edittest.php'>10</span>
+ Set Minimum: <span class='editable small-edit' data-url='api/edittest.php'>10</span>
Set Maximum: <span class='editable small-edit' data-url='api/edittest.php'></span>
</div>
</div>
<div class='desc'>You can set a format code on numbers, so that appear with commas etc</div>
<div class='box'>
<div>
- Tonnes/hours: <span class='editable edit' data-format='N0'>10593.1</span>
+ Tonnes/hours: <span class='editable edit' data-format='N0'>10593.1</span>
</div>
</div>
@@ -176,6 +181,15 @@
</div>
+<div class='desc'>For editing larger volumes of text, use InlineEdit.Textarea.</div>
+
+<div class='box'>
+
+<div id='ta-edit' data-url='api/edittest.php'>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</div>
+
+</div>
+
+
</div>
</body>

0 comments on commit a19511f

Please sign in to comment.