Skip to content

Commit efae032

Browse files
author
Lonnie
committed
다중 드롭 시 하나의 파일만 열도록 예외처리 & 웹 샘플 파일 로드하도록 수정
1 parent 62285fc commit efae032

File tree

1 file changed

+113
-76
lines changed

1 file changed

+113
-76
lines changed

index.html

+113-76
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@
1414
<div class="container">
1515
<a href="https://github.com/jungilhan/strings-xml-editor"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_left_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
1616
<a class="brand" href="#">비-개발자를 위한 strings.xml 편집기<span id='beta-label' class="label">Beta</span></a>
17-
<button id='export-xlsx' type="button" class="btn btn-success pull-right">Export to strings.xlsx</button>
18-
<button id='export-xml' type="button" class="btn btn-success pull-right">Export to strings.xml</button>
17+
<button id='export-xlsx' type="button" class="btn btn-success pull-right">Export to XLSX</button>
18+
<button id='export-xml' type="button" class="btn btn-success pull-right">Export to XML</button>
1919
</div> <!-- container -->
2020
</div> <!-- navbar-inner -->
2121
</div> <!-- navbar -->
@@ -33,7 +33,8 @@
3333

3434
<div class='drag-guide'>
3535
<h3>여기로 strings.xml 파일을 드래그 & 드롭하세요.</h3>
36-
</div>
36+
<p>샘플 파일 실행해보기 <a id='sample'>sample-strings.xml</a></p>
37+
</div>
3738
</div> <!-- container -->
3839
</div> <!-- drop-layer -->
3940

@@ -76,92 +77,128 @@ <h3>여기로 strings.xml 파일을 드래그 & 드롭하세요.</h3>
7677
});
7778

7879
var files = e.dataTransfer.files;
79-
$.each(files, function(index, file) {
80-
var reader = new FileReader();
80+
var reader = new FileReader();
81+
82+
reader.onload = (function(file) {
83+
return function(e) {
84+
parseXmlAndRender(file.name, this.result);
85+
};
86+
})(files[0]);
87+
reader.readAsText(files[0]);
88+
89+
return false;
90+
}); // bind("drop")
8191

82-
reader.onload = (function(file) {
83-
return function(e) {
84-
$('#tab .name').text(file.name);
92+
$('#sample').bind('click', function() {
93+
$.ajax({
94+
url: 'http://jungilhan.github.com/strings-xml-editor/sample-strings.xml',
95+
dataType: 'xml',
96+
encoding: 'UTF-8',
97+
success: function(xml) {
98+
parseXmlAndRender('sample-strings.xml', xml);
99+
}
100+
});
101+
});
85102

86-
var xml2js = new X2JS();
87-
var jsonObj = xml2js.xml_str2json(uncomment(this.result));
103+
var parseXmlAndRender = function(name, xml) {
104+
$('#tab .name').text(name);
88105

89-
// string 태그 파싱
90-
var string = { names: [], values: [] };
91-
var length = jsonObj.resources.string.length;
92-
for (var i = 0; i < length; i++) {
93-
var name = jsonObj.resources.string[i]._name;
94-
var value = jsonObj.resources.string[i].toString();
106+
var xml2js = new X2JS();
107+
var jsonObj = xml2js.xml_str2json(uncomment(xml));
95108

96-
if (jsonObj.resources.string[i].hasOwnProperty('g')) {
97-
var $xmlDoc = $(this.result);
98-
value = $xmlDoc.find('string').get(i).innerHTML;
109+
// string 태그 파싱
110+
var string = { names: [], values: [] };
99111

100-
} else if (jsonObj.resources.string[i].hasOwnProperty('__cdata')) {
101-
value = '\<\!\[CDATA[' + value + ']]>';
102-
}
112+
if (jsonObj.resources.string.hasOwnProperty('length')) {
113+
var length = jsonObj.resources.string.length;
114+
for (var i = 0; i < length; i++) {
115+
var name = jsonObj.resources.string[i]._name;
116+
var value = jsonObj.resources.string[i].toString();
103117

104-
string.names.push(name);
105-
string.values.push(value);
106-
}
118+
if (jsonObj.resources.string[i].hasOwnProperty('g')) {
119+
var $xmlDoc = $(xml);
120+
value = $xmlDoc.find('string').get(i).innerHTML;
107121

108-
// string-array 태그 파싱
109-
var stringArrays = [];
110-
if (jsonObj.resources['string-array'].hasOwnProperty('length')) {
111-
length = jsonObj.resources['string-array'].length;
112-
for (var i = 0; i < length; i++) {
113-
var stringArray = { name: '', items: [] };
122+
} else if (jsonObj.resources.string[i].hasOwnProperty('__cdata')) {
123+
value = '\<\!\[CDATA[' + value + ']]>';
124+
}
114125

115-
stringArray.name = jsonObj.resources['string-array'][i]._name;
116-
stringArray.items = jsonObj.resources['string-array'][i].item_asArray;
117-
stringArrays.push(stringArray);
118-
}
119-
} else {
120-
var stringArray = { name: '', items: [] };
126+
// Value가 비어있을 때를 의미
127+
if (value == '[object Object]') {
128+
value = '';
129+
}
121130

122-
stringArray.name = jsonObj.resources['string-array']._name;
123-
stringArray.items = jsonObj.resources['string-array'].item_asArray;
124-
stringArrays.push(stringArray);
125-
}
126-
127-
// 화면 출력
128-
var $table = $("<table class='table table-striped table-hover'></table>");
129-
var $thread = $('<thead><tr><th>#</th><th>Type</th><th>Key</th><th>Value</th></tr></thead>');
130-
$table.append($thread);
131-
132-
var count = 0;
133-
for (var i = 0; i < string.names.length; i++) {
134-
var $tr = $("<tr></tr>");
135-
var $index = $("<td></td>").text(++count);
136-
var $type = $("<td><span class='label label-success'>string</span></td>");
137-
var $key = $("<td></td>").text(string.names[i]);
138-
var $value = $("<td contentEditable='true'></td>").text(string.values[i]);
139-
$tr.append($index).append($type).append($key).append($value);
140-
$table.append($tr);
141-
}
131+
string.names.push(name);
132+
string.values.push(value);
133+
}
142134

143-
for (var i = 0; i < stringArrays.length; i++) {
144-
for (var j = 0; j < stringArrays[i].items.length; j++) {
145-
var $tr = $("<tr></tr>");
146-
var $index = $("<td></td>").text(++count);
147-
var $type = $("<td><span class='label label-info'>array</span></td>");
148-
var $key = $("<td></td>").text(stringArrays[i].name);
149-
var $value = $("<td contentEditable='true'></td>").text(stringArrays[i].items[j]);
150-
$tr.append($index).append($type).append($key).append($value);
151-
$table.append($tr);
152-
}
153-
}
135+
} else {
136+
var name = jsonObj.resources.string._name;
137+
var value = jsonObj.resources.string.toString();
138+
if (value == '[object Object]') {
139+
value = '';
140+
}
141+
142+
string.names.push(name);
143+
string.values.push(value);
144+
}
154145

155-
$('.content-wrapper').append($table)
156-
.append('<br><br><br><br><br><br><br><br><br><br><br><br><br><br>');
157-
};
158-
})(files[index]);
146+
// string-array 태그 파싱
147+
var stringArrays = [];
148+
if (jsonObj.resources['string-array'] !== undefined) {
149+
if (jsonObj.resources['string-array'].hasOwnProperty('length')) {
150+
length = jsonObj.resources['string-array'].length;
151+
for (var i = 0; i < length; i++) {
152+
var stringArray = { name: '', items: [] };
153+
154+
stringArray.name = jsonObj.resources['string-array'][i]._name;
155+
stringArray.items = jsonObj.resources['string-array'][i].item_asArray;
156+
stringArrays.push(stringArray);
157+
}
158+
} else {
159+
var stringArray = { name: '', items: [] };
159160

160-
reader.readAsText(file);
161-
}); // each()
161+
stringArray.name = jsonObj.resources['string-array']._name;
162+
stringArray.items = jsonObj.resources['string-array'].item_asArray;
163+
stringArrays.push(stringArray);
164+
}
165+
}
166+
167+
// 화면 출력
168+
var $table = $("<table class='table table-striped table-hover'></table>");
169+
var $thread = $('<thead><tr><th>#</th><th>Type</th><th>Key</th><th>Value</th></tr></thead>');
170+
$table.append($thread);
171+
172+
var count = 0;
173+
for (var i = 0; i < string.names.length; i++) {
174+
var $tr = $("<tr></tr>");
175+
var $index = $("<td></td>").text(++count);
176+
var $type = $("<td><span class='label label-success'>string</span></td>");
177+
var $key = $("<td></td>").text(string.names[i]);
178+
var $value = $("<td contentEditable='true'></td>").text(string.values[i]);
179+
$tr.append($index).append($type).append($key).append($value);
180+
$table.append($tr);
181+
}
162182

163-
return false;
164-
}); // bind("drop")
183+
for (var i = 0; i < stringArrays.length; i++) {
184+
if (stringArrays[i].items === undefined) {
185+
break;
186+
}
187+
188+
for (var j = 0; j < stringArrays[i].items.length; j++) {
189+
var $tr = $("<tr></tr>");
190+
var $index = $("<td></td>").text(++count);
191+
var $type = $("<td><span class='label label-info'>array</span></td>");
192+
var $key = $("<td></td>").text(stringArrays[i].name);
193+
var $value = $("<td contentEditable='true'></td>").text(stringArrays[i].items[j]);
194+
$tr.append($index).append($type).append($key).append($value);
195+
$table.append($tr);
196+
}
197+
}
198+
199+
$('.content-wrapper').append($table)
200+
.append('<br><br><br><br><br><br><br><br><br><br><br><br><br><br>');
201+
}
165202

166203
$('#export-xlsx').bind('click', function() {
167204
var $table = $('table');

0 commit comments

Comments
 (0)