Instantly share code, notes, and snippets.

@insin /1.js
Created May 7, 2014

Embed
What would you like to do?
This is the sort of stuff JSX saves you from having to manage
this.$el.append(domBuilder([
['div.arrow']
, ['div.popup-header'
, ['button.close', {type: 'button'}, '\u00D7']
, ['h3', 'Add menu item']
]
, ['div.popup-body'
, ['form.form-horizontal'
, ['div.control-group'
, ['label.control-label', {'for': 'menuItemType'}, 'Type']
, ['div.controls'
, ['select$type', {id: 'menuItemType'}
, ['option', {value: ''}, '']
, ['option', {value: 'page'}, 'Page']
, ['option', {value: 'heading'}, 'Menu Heading']
, ['option', {value: 'text'}, 'Menu Text']
, ['option', {value: 'spacer'}, 'Menu Spacer']
]
, ['span.help-inline']
]
]
, ['div.control-group.hide$pageTypeControl'
, ['label.control-label', {'for': 'pageType'}, 'Page Type']
, ['div.controls'
, ['select$pageType', {id: 'pageType'}
, ['option', {value: ''}, '']
, ['option', {value: 'html'}, 'HTML Page']
, ['option', {value: 'gallery'}, 'Gallery']
]
, ['span.help-inline']
]
]
, ['div.control-group$labelControl'
, ['label.control-label', {'for': 'menuItemLabel'}, 'Label']
, ['div.controls'
, ['input$label', {type: 'text', id: 'menuItemLabel'}]
, ['span.help-inline']
]
]
]
]
, ['div.popup-footer'
, ['button.btn.cancel', 'Close']
, ['button.btn.btn-primary.save', 'Add']
]
], refs))
$template('season_details'
, DIV({'class': 'page-header'}
, H1('Season: {{ season.name }}')
)
, H2('Games')
, $if('season.games.length'
, TABLE({'class': 'table table-striped table-bordered table-condensed'}
, THEAD(TR(
TH()
, TH('Players')
, TH('Played On')
, TH('Winner')
))
, TBODY($for('game in season.games'
, TR(
TD(A({href: '#', click: $handler(displayGame, 'game')}, 'Game {{ game.getGameNumber }}'))
, TD('{{ game.results.length }}')
, TD('{{ game.date.toDateString }}')
, TD(A({href: '#', click: $handler(displayPlayer, 'game.getWinner')}, '{{ game.getWinner.name }}'))
)
))
)
, $else(DIV({'class': 'alert alert-info'}, 'None yet - add one below.'))
)
, toggleAddButton('Add Game')
, FORM({id: 'addGameForm', 'class': 'form-horizontal hide', submit: $handler(addGame, 'season')}
, FIELDSET(
LEGEND('Add Game')
, DIV({'class': 'control-group'}
, LABEL({'class': 'control-label', 'for': 'date'}, 'Date')
, DIV({'class': 'controls'}
, INPUT({type: 'text', name: 'date', id: 'date', placeholder: 'DD/MM/YYYY'})
, P({'class': 'help-block hide'})
)
)
, DIV({'class': 'control-group'}
, LABEL({'class': 'control-label'}, 'Results')
, DIV({'class': 'controls'}
, $if('players.length'
, TABLE({'class': 'table table-condensed table-controls', style: 'width: auto'}
, THEAD(TR(
TH({style: 'width: 150px'}, 'Player')
, TH({style: 'width: 350px'}, 'Position')
))
, TBODY($for('player in players'
, TR(
TD(LABEL({'for': 'position{{ forloop.counter }}'}, '{{ player.name }}'))
, TD(
INPUT({type: 'hidden', name: 'player', value: '{{ player.id }}'})
, INPUT({type: 'text', name: 'position', id: 'position{{ forloop.counter }}', 'class': 'input-mini'})
, SPAN({'class': 'help-inline hide'})
)
)
))
)
, $else(
DIV({'class': 'alert alert-info'}
, 'There are no Players registered yet - add some on the '
, A({href: '#', click: playersList}, 'Players')
, ' page.'
)
)
)
, P({'class': 'help-block hide', id: 'results-help'})
)
)
, DIV({'class': 'control-group'}
, LABEL({'class': 'control-label'}, 'Knockouts')
, DIV({'class': 'controls'}
, DIV({'class': 'control-knockout'}
, SELECT({'name': 'perp'}
, OPTION({value: ''}, '----')
, $for('player in players'
, OPTION({value: '{{ player.id }}'}, '{{ player.name }}')
)
)
, ' knocked out '
, SELECT({'name': 'victim'}
, OPTION({value: ''}, '----')
, $for('player in players'
, OPTION({value: '{{ player.id }}'}, '{{ player.name }}')
)
)
, P({'class': 'help-block hide'})
)
, P(BUTTON({'class': 'btn btn-success', type: 'button', click: cloneKnockout}
, I({'class': 'icon-plus icon-white'})
, ' Add'
))
)
)
, DIV({'class': 'form-actions'}
, BUTTON({'class': 'btn btn-primary', type: 'submit', name: 'submitBtn'}, 'Add Game')
, ' '
, toggleCancelButton()
, P({'class': 'help-block hide'})
)
)
)
, H2('League Table')
, $if('season.games.length'
, $include('league_table', {scores: $var('season.scores')})
, $else(DIV({'class': 'alert alert-info'}
,'The League Table will begin as soon as some games have been played.'
))
)
)
TABLE({border: 2, frame: "hsides", rules: "groups",
summary: "Code page support in different versions of MS Windows.",
click: function(e)
{
e = e || event;
alert(["You clicked this ", this.tagName, " at (",
e.screenX, ",", e.screenY, ")"].join(""));
}},
CAPTION("CODE-PAGE SUPPORT IN MICROSOFT WINDOWS"),
COLGROUP({align: "center"}),
COLGROUP({align: "left"}),
COLGROUP({align: "center", span: 2}),
COLGROUP({align: "center", span: 3}),
THEAD({valign: "top"},
TR(
TH("Code-Page", BR(), "ID"),
TH("Name"),
TH("ACP"),
TH("OEMCP"),
TH("Windows", BR(), "NT 3.1"),
TH("Windows", BR(), "NT 3.51"),
TH("Windows", BR(), "95")
)
),
TBODY(
TR(TD(1200), TD("Unicode (BMP of ISO/IEC-10646)"), TD(), TD(), TD("X"), TD("X"), TD("*")),
TR(TD(1250), TD("Windows 3.1 Eastern European"), TD("X"), TD(), TD("X"), TD("X"), TD("X")),
TR(TD(1251), TD("Windows 3.1 Cyrillic"), TD("X"), TD(), TD("X"), TD("X"), TD("X")),
TR(TD(1252), TD("Windows 3.1 US (ANSI)"), TD("X"), TD(), TD("X"), TD("X"), TD("X")),
TR(TD(1253), TD("Windows 3.1 Greek"), TD("X"), TD(), TD("X"), TD("X"), TD("X")),
TR(TD(1254), TD("Windows 3.1 Turkish"), TD("X"), TD(), TD("X"), TD("X"), TD("X")),
TR(TD(1255), TD("Hebrew"), TD("X"), TD(), TD(), TD(), TD("X")),
TR(TD(1256), TD("Arabic"), TD("X"), TD(), TD(), TD(), TD("X")),
TR(TD(1257), TD("Baltic"), TD("X"), TD(), TD(), TD(), TD("X")),
TR(TD(1361), TD("Korean (Johab)"), TD("X"), TD(), TD(), TD("**"), TD("X"))
),
TBODY(
TR(TD(437), TD("MS-DOS United States"), TD(), TD("X"), TD("X"), TD("X"), TD("X")),
TR(TD(708), TD("Arabic (ASMO 708)"), TD(), TD("X"), TD(), TD(), TD("X")),
TR(TD(709), TD("Arabic (ASMO 449+, BCON V4)"), TD(), TD("X"), TD(), TD(), TD("X")),
TR(TD(710), TD("Arabic (Transparent Arabic)"), TD(), TD("X"), TD(), TD(), TD("X")),
TR(TD(720), TD("Arabic (Transparent ASMO)"), TD(), TD("X"), TD(), TD(), TD("X"))
)
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment