commit 7be076461a4859a8a9a0dfe95ecbf41de1c80a74
| author | 斟酌 鵬兄 <tgckpg@gmail.com> |
|---|
| date | 2016-02-21T23:53:59Z |
|---|
| subject | Checkbox should wrapped with labels |
|---|
commit 7be076461a4859a8a9a0dfe95ecbf41de1c80a74
Author: 斟酌 鵬兄 <tgckpg@gmail.com>
Date: 2016-02-21T23:53:59Z
Checkbox should wrapped with labels
---
.../{SmartInput.css => SmartInput/_this.css} | 5 +
.../{SmartInput.js => SmartInput/_this.js} | 155 +++++++++++----------
.../Blog/AstroEdit/Visualizer/Snippet/Code.js | 4 +-
.../Blog/AstroEdit/Visualizer/Snippet/Image.js | 4 +-
.../Blog/AstroEdit/Visualizer/Snippet/SiteFile.js | 4 +-
.../Blog/AstroEdit/Visualizer/Snippet/Spoiler.js | 12 +-
.../Astro/Blog/AstroEdit/Visualizer/Snippet/Swf.js | 31 ++---
.../Astro.Blog.AstroEdit.SmartInput.Definition.js | 8 ++
.../src/externs/Astro.Blog.AstroEdit.SmartInput.js | 2 +
9 files changed, 127 insertions(+), 98 deletions(-)
diff --git a/botanjs/src/Astro/Blog/AstroEdit/SmartInput.css b/botanjs/src/Astro/Blog/AstroEdit/SmartInput/_this.css
similarity index 84%
rename from botanjs/src/Astro/Blog/AstroEdit/SmartInput.css
rename to botanjs/src/Astro/Blog/AstroEdit/SmartInput/_this.css
index 0951ceb..232a14c 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/SmartInput.css
+++ b/botanjs/src/Astro/Blog/AstroEdit/SmartInput/_this.css
@@ -14,3 +14,8 @@
.smartbar-candidates .cn[data-selected="1"] {
background-color: orangered;
}
+
+.cn .desc {
+ margin-left: 0.5em;
+ opacity: 0.65;
+}
diff --git a/botanjs/src/Astro/Blog/AstroEdit/SmartInput.js b/botanjs/src/Astro/Blog/AstroEdit/SmartInput/_this.js
similarity index 72%
rename from botanjs/src/Astro/Blog/AstroEdit/SmartInput.js
rename to botanjs/src/Astro/Blog/AstroEdit/SmartInput/_this.js
index 4c0dc08..538e933 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/SmartInput.js
+++ b/botanjs/src/Astro/Blog/AstroEdit/SmartInput/_this.js
@@ -26,94 +26,96 @@
/** @type {Astro.Blog.Config} */
var Config = __import( "Astro.Blog.Config" );
- var __cands = [];
- var GetCandidates = function()
+ var KeyHandler = function( sender, handler )
{
- if( __cands.length ) return __cands;
-
- var Cands = {
- "Article Reference": "Ref"
- , "facts": "T"
- , "text": "T"
- , "h1": "h1"
- , "h2": "h2"
- , "h3": "h3"
- , "h4": "h4"
- , "h5": "h5"
- };
-
- for( var i in Cands )
+ return function( e )
{
- __cands.push( Dand.wrapc( "cn", i, new DataKey( "key", Cands[i] ) ) );
- }
+ e = e || window.event;
+ if ( e.keyCode ) code = e.keyCode;
+ else if ( e.which ) code = e.which;
- return __cands;
+ handler( sender, e );
+ };
};
- var ResetCandidates = function()
+ /** @param {Astro.Blog.AstroEdit.Visualizer} */
+ var SmartInput = function ( visualizer, CandidatesOvd )
{
- var Cands = GetCandidates();
- for( var i in Cands )
- {
- var c = IDOMElement( Cands[i] );
- c.setAttribute( new DataKey( "selected", 0 ) );
- }
- };
+ var SBarPresent = false;
+ var insert = function() { return Dand.textNode( "" ); };
+ var __cands = [];
+
+ var CandidateCycle = -1;
+ var KeywordTyped = 0;
+ var shiftTabbed = false;
+
+ var Cands = CandidatesOvd || {
+ "Article Reference": { module: "ArticleReference", desc: "Article reference link" }
+ , "facts": { module: "Facts", desc: "Facts, a fact bubble popup when mouseover" }
+ , "footnote": { module: "Footnote", desc: "Footnote, a footnote displayed at the end of article" }
+ , "h1": { module: "Heading", options: 1, desc: "Heading, size 1" }
+ , "h2": { module: "Heading", options: 2, desc: "Heading, size 2" }
+ , "h3": { module: "Heading", options: 3, desc: "Heading, size 3" }
+ , "h4": { module: "Heading", options: 4, desc: "Heading, size 4" }
+ , "h5": { module: "Heading", options: 5, desc: "Heading, size 5" }
+ };
- var FilteredCandidates = function()
- {
- var Cands = GetCandidates();
- var selected = [];
- for( var i in Cands )
+ var GetCandidates = function()
{
- var c = IDOMElement( Cands[i] );
- c.setAttribute( new DataKey( "selected", 0 ) );
+ if( __cands.length ) return __cands;
- if( c.style.display != "none" )
+ for( var i in Cands )
{
- selected.push( c );
+ /** @param {Astro.Blog.AstroEdit.SmartInput.Definition} */
+ var c = Cands[i];
+ __cands.push( Dand.wrapc( "cn", [ i, Dand.wrapc( "desc", c.desc ) ], new DataKey( "key", i ) ) );
}
- }
- return selected;
- };
+ return __cands;
+ };
- var SelectedCandidate = function()
- {
- var Cands = GetCandidates();
- for( var i in Cands )
+ var ResetCandidates = function()
{
- var c = IDOMElement( Cands[i] );
- if( c.getDAttribute( "selected" ) == "1" )
+ var Cands = GetCandidates();
+ for( var i in Cands )
{
- return c;
+ var c = IDOMElement( Cands[i] );
+ c.setAttribute( new DataKey( "selected", 0 ) );
}
- }
-
- return null;
- };
+ };
- var KeyHandler = function( sender, handler )
- {
- return function( e )
+ var FilteredCandidates = function()
{
- e = e || window.event;
- if ( e.keyCode ) code = e.keyCode;
- else if ( e.which ) code = e.which;
+ var Cands = GetCandidates();
+ var selected = [];
+ for( var i in Cands )
+ {
+ var c = IDOMElement( Cands[i] );
+ c.setAttribute( new DataKey( "selected", 0 ) );
- handler( sender, e );
+ if( c.style.display != "none" )
+ {
+ selected.push( c );
+ }
+ }
+
+ return selected;
};
- };
- var CandidateCycle = -1;
- var KeywordTyped = 0;
- var shiftTabbed = false;
+ var SelectedCandidate = function()
+ {
+ var Cands = GetCandidates();
+ for( var i in Cands )
+ {
+ var c = IDOMElement( Cands[i] );
+ if( c.getDAttribute( "selected" ) == "1" )
+ {
+ return c;
+ }
+ }
- /** @param {Astro.Blog.AstroEdit.Visualizer} */
- var SmartInput = function ( visualizer )
- {
- var SBarPresent = false;
- var insert = function() { return Dand.textNode( "" ); };
+ return null;
+ };
var HandleInput = function( sender, e )
{
@@ -131,17 +133,18 @@
case 192: // `
// Closing the quote, that means this is a block-quoted text
e.preventDefault();
+ insert = undefined;
// Hitting ` twice escapes the ` character itself
var v = sender.value.substr( 1 );
if( v == "" ) insert = function() { return Dand.textNode( "`" ); };
- insert = undefined;
sender.BindingBox.close( true );
// Insert the code snippet with inline flag
visualizer.insertSnippet( "code", { "inline": "on", "lang": "plain", "value": v } );
break;
+
case 13: // Enter
// Not closing the quote, either a direct text or the first matched action
e.preventDefault();
@@ -150,7 +153,10 @@
// Check if matched an action first
if( selected )
{
+ insert = undefined;
+
+ sender.BindingBox.close();
}
else
{
@@ -160,9 +166,11 @@
sender.BindingBox.close( true );
}
break;
+
case 27: // Esc
sender.BindingBox.close();
break;
+
case 9: // Tab
// Hitting tab will cycle around the candidates
e.preventDefault();
@@ -185,11 +193,12 @@
var ThisCandidate = c[ CandidateCycle ];
ThisCandidate.setAttribute( new DataKey( "selected", 1 ) );
- var CyclingKeyword = ThisCandidate.element.textContent;
+ var CyclingKeyword = ThisCandidate.getDAttribute( "key" );
sender.value = "`" + CyclingKeyword;
sender.setSelectionRange( KeywordTyped, sender.value.length );
break;
+
default:
FilteredCandidates();
CandidateCycle = -1;
@@ -224,9 +233,15 @@
var keyword = sender.value.substr( 1 );
for( var i in c )
{
- var Cand = c[i];
- var t = Cand.textContent;
+ var Cand = IDOMElement( c[i] );
+ var t = Cand.getDAttribute( "key" );
Cand.style.display = t.match( new RegExp( "^" + keyword, "i" ) ) ? "" : "none";
+
+ // Highlight the exact match
+ if( t.match( new RegExp( "^" + keyword + "$", "i" ) ) )
+ {
+ Cand.setAttribute( new DataKey( "selected", 1 ) );
+ }
}
}
};
diff --git a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Code.js b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Code.js
index 6271c37..71dc3b5 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Code.js
+++ b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Code.js
@@ -57,7 +57,7 @@
// Input fields
var v_snippetInput = Dand.wrap( "textarea", null, "v_snippet_input" )
, v_codelang = Dand.wrap( "select", null, "v_select flsf", compileListItems() )
- , input_inline = Dand.wrapna('input', new IKey("type", "checkbox") );
+ , input_inline = Dand.wrapna( "input", new IKey( "type", "checkbox" ) );
if ( this._stage )
{
@@ -90,7 +90,7 @@
, [
Dand.wrapc( "v_instruction", v_codelang )
, v_snippetInput
- , Dand.wrape([ input_inline, Dand.textNode( "Inline" ) ])
+ , Dand.wrape( Dand.wrapne( "label", [ input_inline, "Inline" ] ) )
]
)
, "OK", "Cancel"
diff --git a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Image.js b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Image.js
index 7f72294..4bb0284 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Image.js
+++ b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Image.js
@@ -28,7 +28,7 @@
, input_a = Dand.wrap(
"input", null, "v_snippet_input_single", null, new IKey( "type", "text" )
)
- , input_preferred = Dand.wrapna('input', new IKey("type", "checkbox"))
+ , input_preferred = Dand.wrapna( "input", new IKey( "type", "checkbox" ) )
;
if ( this._stage )
@@ -46,7 +46,7 @@
, input_url
, Dand.wrapc( "v_instruction flsf", "Ancohr link(optional):" )
, input_a
- , Dand.wrape([ input_preferred, Dand.textNode( "Preferred" ) ])
+ , Dand.wrape( Dand.wrapne( "label", [ input_preferred, "Preferred" ] ) )
]
)
, "OK", "Cancel"
diff --git a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/SiteFile.js b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/SiteFile.js
index 9384f87..073bbe4 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/SiteFile.js
+++ b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/SiteFile.js
@@ -38,7 +38,7 @@
{
// Input fields
var v_snippetInput = Dand.wrap("input", null, "v_snippet_input_single", null, new IKey("type", "text"))
- , input_preferred = Dand.wrapna('input', new IKey("type", "checkbox"))
+ , input_preferred = Dand.wrapna( "input", new IKey( "type", "checkbox" ) )
;
if ( this._stage )
@@ -52,7 +52,7 @@
"Insert site file"
, Dand.wrape([
v_snippetInput
- , Dand.wrape([ input_preferred, Dand.textNode( "Preferred" ) ])
+ , Dand.wrape( Dand.wrapne( "label", [ input_preferred, "Preferred" ] ) )
])
, "OK", "Cancel"
, visualizer.bind({
diff --git a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Spoiler.js b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Spoiler.js
index 7fd6313..061974c 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Spoiler.js
+++ b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Spoiler.js
@@ -22,9 +22,9 @@
, handler = function ()
{
// Input fields
- var v_snippetInput = Dand.wrap('textarea', null, "v_snippet_input")
- , input_title = Dand.wrap('input', null, "v_snippet_input_single", null, new IKey("type", "text"))
- , input_expanded = Dand.wrapna('input', new IKey("type", "checkbox"))
+ var v_snippetInput = Dand.wrap("textarea", null, "v_snippet_input")
+ , input_title = Dand.wrap("input", null, "v_snippet_input_single", null, new IKey("type", "text"))
+ , input_expanded = Dand.wrapna("input", new IKey("type", "checkbox"))
if (this._stage)
{
@@ -42,7 +42,7 @@
, Dand.wrapc("v_instruction flsf", "Content")
, v_snippetInput
- , Dand.wrape([ input_expanded, Dand.textNode( "Expanded" ) ])
+ , Dand.wrape( Dand.wrapne( "label", [ input_expanded, "Expanded" ] ) )
]
)
, "OK", "Cancel", visualizer.bind({title: input_title, content:v_snippetInput, expanded: input_expanded, stage: this._stage})).show();
@@ -75,10 +75,10 @@
if (!content) return;
// Visualize component
- temp = Dand.wrapc('v_box',
+ temp = Dand.wrapc("v_box",
[
// caption
- Dand.wrapc('v_caption', i)
+ Dand.wrapc("v_caption", i)
, Dand.textNode(content)
],
[
diff --git a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Swf.js b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Swf.js
index 4222f66..7b6e702 100644
--- a/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Swf.js
+++ b/botanjs/src/Astro/Blog/AstroEdit/Visualizer/Snippet/Swf.js
@@ -26,16 +26,15 @@
, handler = function ()
{
// Input fields
- var input_w = Dand.wrapna('input', new IKey("type", "number"))
- , input_h = Dand.wrapna('input', new IKey("type", "number"))
- , input_title = Dand.wrap('input', null, "v_snippet_input_single", null, [new IKey("type", "text"), new IKey("placeHolder", "optional")] )
- , input_desc = Dand.wrap('input', null, "v_snippet_input_single", null, [new IKey("type", "text"), new IKey("placeHolder", "optional")] )
- , input_api = Dand.wrapna('input', new IKey("type", "checkbox"))
- , input_preview = Dand.wrap('input', null, "v_snippet_input_single", null, [new IKey("type", "text"), new IKey("placeHolder", "optional")] )
- , input_src = Dand.wrap('input', null, "v_snippet_input_single", null, new IKey("type", "text"))
+ var input_w = Dand.wrapna("input", new IKey("type", "number"))
+ , input_h = Dand.wrapna("input", new IKey("type", "number"))
+ , input_title = Dand.wrap("input", null, "v_snippet_input_single", null, [new IKey("type", "text"), new IKey("placeHolder", "optional")] )
+ , input_desc = Dand.wrap("input", null, "v_snippet_input_single", null, [new IKey("type", "text"), new IKey("placeHolder", "optional")] )
+ , input_api = Dand.wrapna("input", new IKey("type", "checkbox"))
+ , input_preview = Dand.wrap("input", null, "v_snippet_input_single", null, [new IKey("type", "text"), new IKey("placeHolder", "optional")] )
+ , input_src = Dand.wrap("input", null, "v_snippet_input_single", null, new IKey("type", "text"))
, stage = this._stage;
-
-
+
if (stage)
{
input_src.value = this._src;
@@ -64,7 +63,7 @@
, Dand.wrapc("v_instruction flsf", "Link to swf:")
, input_src
- , Dand.wrape([ input_api, Dand.textNode("Use external API") ] )
+ , Dand.wrape( Dand.wrapne( "label", [ input_api, "Use external API" ] ) )
]
)
, "OK", "Cancel", visualizer.bind({src:input_src, width:input_w, height:input_h, title: input_title, desc: input_desc, extAPI: input_api, preview: input_preview, stage: this._stage})).show();
@@ -103,14 +102,14 @@
{
// Visualize component
- temp = Dand.wrapc('v_box'
- , Dand.wrapc('v_description'
+ temp = Dand.wrapc("v_box"
+ , Dand.wrapc("v_description"
, [
- Dand.wrap('span', null, 'fls', title)
+ Dand.wrap("span", null, "fls", title)
, Dand.textNode(" ")
- , Dand.wrap('span', null, 'v_caption_desc flsf', desc)
+ , Dand.wrap("span", null, "v_caption_desc flsf", desc)
]
- , new IKey('style', 'font-size: 2em')
+ , new IKey("style", "font-size: 2em")
)
, [
new DataKey("value", src)
@@ -120,7 +119,7 @@
, new DataKey("desc", desc)
, new DataKey("preview", preview)
, new DataKey("useExtAPI", extAPI)
-
+
, new IKey
(
"style"
diff --git a/botanjs/src/externs/Astro.Blog.AstroEdit.SmartInput.Definition.js b/botanjs/src/externs/Astro.Blog.AstroEdit.SmartInput.Definition.js
new file mode 100644
index 0000000..baa0b1c
--- /dev/null
+++ b/botanjs/src/externs/Astro.Blog.AstroEdit.SmartInput.Definition.js
@@ -0,0 +1,8 @@
+/** @type {object} */
+Astro.Blog.AstroEdit.SmartInput.Definition = {};
+/** @type {String} */
+Astro.Blog.AstroEdit.SmartInput.Definition.desc;
+/** @type {String} */
+Astro.Blog.AstroEdit.SmartInput.Definition.module;
+/** @type {object} */
+Astro.Blog.AstroEdit.SmartInput.Definition.option;
diff --git a/botanjs/src/externs/Astro.Blog.AstroEdit.SmartInput.js b/botanjs/src/externs/Astro.Blog.AstroEdit.SmartInput.js
new file mode 100644
index 0000000..ee3eaa9
--- /dev/null
+++ b/botanjs/src/externs/Astro.Blog.AstroEdit.SmartInput.js
@@ -0,0 +1,2 @@
+/** @type {Object} */
+Astro.Blog.AstroEdit.SmartInput = {};