-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
126 lines (124 loc) · 5.49 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<!DOCTYPE HTML>
<html>
<head>
<title>Titanium Mobile UI Studio</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script type="text/javascript" src="3rd/jquery.tmpl.min.js"></script>
<script type="text/javascript" src="3rd/underscore-min.js"></script>
<script type="text/javascript" src="3rd/zeroclipboard/ZeroClipboard.js"></script>
<script type="text/javascript" src="3rd/colorpicker.js"></script>
<script type="text/javascript" src="src/utils.js"></script>
<link rel="stylesheet" href="3rd/overcast/jquery-ui-1.8.9.custom.css">
<link rel="stylesheet" href="3rd/colorpicker/css/colorpicker.css">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="loading">Loading...</div>
<script id="mainTemplate" type="text/x-jquery-tmpl">
<div class="library ui-widget-header">
<ul>
<li><div class="libControl" data-libType="View">View</div></li>
<li><div class="libControl" data-libType="Label">Label</div></li>
<li><div class="libControl" data-libType="TextField">Text field</div></li>
<li><div class="libControl" data-libType="TextArea">Text area</div></li>
<li><div class="libControl" data-libType="ImageView">ImageView</div></li>
<li><div class="libControl" data-libType="Button">Button</div></li>
<li><div class="libControl" data-libType="Switch">Switch</div></li>
<li><div class="libControl" data-libType="SearchBar">Search bar</div></li>
</ul>
<div class="buttons">
<button id="showLibrary">Library</button>
<button id="generate">Generate</button>
</div>
</div>
<div id="propertiesContainer" class="properties ui-widget-content">
</div>
</script>
<script id="propertiesTemplate" type="text/x-jquery-tmpl">
<div>
<button id="highlightActive">Highlight</button>
<button id="removeActive">Remove</button>
<ul class="propertiesList ui-widget">
{{tmpl({properties: properties, events: events, libData: libData, propertiesData: propertiesData}) 'propertiesList'}}
{{each interfaces}}
<li>
<h3 class="interfaceName clickable ui-widget-header ui-state-default">${$value}</h3>
<ul class="interfaceList">
{{tmpl({properties: interfacesData[$value].properties, events: interfacesData[$value].events, libData: libData, propertiesData: propertiesData}) 'propertiesList'}}
</ul>
</li>
{{/each}}
</ul>
</div>
</script>
<script id='propertiesListTemplate' type='text/x-jquery-tmpl'>
{{each properties}}
{{tmpl({propertyName: $index, propertyType: $value, propertyValue: libData.control[$index], propertiesData: propertiesData}) 'property'}}
{{/each}}
{{each events}}
{{tmpl({eventName: $value, eventValue: libData.events[$value] ? libData.events[$value].text : ''}) 'event'}}
{{/each}}
</script>
<script id="propertyTemplate" type="text/x-jquery-tmpl">
<li class="ui-helper-clearfix">
<div class="propertyName">${propertyName}</div>
{{tmpl({name: propertyName, value: propertyValue, propertyType: propertyType}) propertiesData[propertyType] == null ? "textProperty" : propertiesData[propertyType].template}}
</li>
</script>
<script id="eventTemplate" type="text/x-jquery-tmpl">
<li class="ui-helper-clearfix">
<div class="eventName">${eventName}</div>
<textarea class="event" name="${eventName}">{{html eventValue}}</textarea>
</li>
</script>
<script id="textPropertyTemplate" type="text/x-jquery-tmpl">
<input class="property" data-propertyType="${propertyType}" type="text" name="${name}" value="${value}"/>
</script>
<script id="boolPropertyTemplate" type="text/x-jquery-tmpl">
<input class="property" data-propertyType="${propertyType}" type="checkbox" name="${name}" ${value == true ? 'checked="checked"' : ''} />
</script>
<script id="colorPropertyTemplate" type="text/x-jquery-tmpl">
<input class="property" data-propertyType="${propertyType}" type="text" name="${name}" ${value == true ? 'checked="checked"' : ''} />
<div class="colorPickerIcon"></div>
</script>
<script id="sizePropertyTemplate" type="text/x-jquery-tmpl">
<input class="property" data-propertyType="${propertyType}" data-size="width" type="text" name="${name}" value="${value.width}" />
<div class="floating">x</div>
<input class="property" data-propertyType="${propertyType}" data-size="height" type="text" name="${name}" value="${value.height}" />
</script>
<script id="generatorTemplate" type="text/x-jquery-tmpl">
<div>
<button id="copyGenerator">Copy</button>
<textarea id="generator"></textarea>
</div>
</script>
<script id="showLibraryTemplate" type="text/x-jquery-tmpl">
<ol class="libraryItems">
{{each library}}
{{if $value != null}}
<li class="clickable" data-libId="${$value.libId}">${$value.typ}</li>
{{/if}}
{{/each}}
</ol>
</script>
<script id="runCodeTemplate" type="text/x-jquery-tmpl">
<div>
</div>
</script>
<script id="messageTemplate" type="text/x-jquery-tmpl">
<div class="message ${className} ui-corner-all">
<div class="closeButton ui-icon ui-icon-close"></div>
<div class="messageText">
{{if icon}}
<span class="ui-icon ${icon}"></span>
{{/if}}
${message}
</div>
</div>
</script>
<script type="text/javascript" src="titanium.js"></script>
<script type="text/javascript" src="src/controls.js"></script>
<script type="text/javascript" src="src/core.js"></script>
</body>
</html>