OSDN -- オープンソース・ソフトウェアの開発とダウンロード
日本語の翻訳状況 translation status for ja
  • R/O
  • SSH
  • HTTPS

コミット

よく使われているワード(クリックで追加)

javac++androidlinuxc#windowsobjective-ccocoa誰得qtpythonphprubygameguibathyscaphec計画中(planning stage)翻訳omegatframeworktwitterdomtestvb.netdirectxゲームエンジンbtronarduinopreviewer

JavaScriptを色々あれこれしようとするがひたすら失敗を繰り返している


コミットメタ情報

リビジョン48 (tree)
日時2016-12-11 14:50:36
作者takoyaki_umaaaa

ログメッセージ

・設定情報管理 object を変更
・Setting Palette 追加

変更サマリ

差分

--- HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/index.html (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/index.html (revision 48)
@@ -14,16 +14,6 @@
1414 <div id="FrameArea" data-objid="FrameArea"></div>
1515 </div>
1616 <!-- ------------------------------------ to here. -->
17- <!-- 固定ボタン (選択要素の削除, 保存, …) -->
18- <button type=button class="pal" data-objid="pal" data-palid="0" title="フォーカス中の要素を削除します">削除</button>
19- <button type=button class="pal" data-objid="pal" data-palid="1" title="現在のパレット設定を保存します">設定保存</button>
20- <button type=button class="pal" data-objid="pal" data-palid="2" title="設定画面を表示します">設定Drop</button>
21- <button type=button class="pal" data-objid="pal" data-palid="3" title="アニメーションを停止します">アニメ停止</button>
22- <button type=button class="pal" data-objid="pal" data-palid="4">枠表示</button>
23- <button type=button class="pal" data-objid="pal" data-palid="5">背景大</button>
24- <button type=button class="pal" data-objid="pal" data-palid="6">背景小</button>
25- <a href="#" id="save" download="DragDraw.dd" title="DragDraw.ddという名前でダウンロードフォルダに保存します">画像保存</a><br />
26- <a href="#apparea">停止</a>
2717
2818 <style id="styledispobj">
2919 .DispObj {
@@ -183,11 +173,11 @@
183173 <div style="overflow:hidden; position:absolute; left:0; top: 14px; width:100%; height:calc(100% - 14px); margin:0; padding:0;">
184174 <span class="paldesc1">外観</span><span class="paldesc2">見た</span>
185175 </div>
186- <div class="paltxtcol paltxtcol0" data-objid="paltxtcol0" data-palid="0">あ</div>
187- <div class="paltxtcol paltxtcol1" data-objid="paltxtcol1" data-palid="1">あ</div>
188- <div class="paltxtcol paltxtcol2" data-objid="paltxtcol2" data-palid="2">あ</div>
189- <div class="paltxtcol paltxtcol3" data-objid="paltxtcol3" data-palid="3">あ</div>
190- <div class="paltxtcol paltxtcol4" data-objid="paltxtcol4" data-palid="4">あ</div>
176+ <div class="paltxtcol paltxtcol0" data-objid="paltxtcol0" data-palid="0"></div>
177+ <div class="paltxtcol paltxtcol1" data-objid="paltxtcol1" data-palid="1"></div>
178+ <div class="paltxtcol paltxtcol2" data-objid="paltxtcol2" data-palid="2"></div>
179+ <div class="paltxtcol paltxtcol3" data-objid="paltxtcol3" data-palid="3"></div>
180+ <div class="paltxtcol paltxtcol4" data-objid="paltxtcol4" data-palid="4"></div>
191181 </fieldset>
192182
193183 <br />
@@ -204,7 +194,7 @@
204194 <div class="palact palact4" data-objid="palact4" data-palid="4"></div>
205195 </fieldset>
206196
207- <fieldset class="palgroup palgroup3" data-objid="palgroup3" title="設定を変更するパレットです">
197+ <fieldset class="palgroup palgroup3" data-objid="palgroup3" title="設定を変更するパレットです" draggable="false">
208198 <legend class="pallegend"> Setting Palette </legend>
209199 <div style="overflow:hidden; position:absolute; left:0; top: 14px; width:100%; height:calc(100% - 14px); margin:0; padding:0;">
210200 <span class="paldesc1">設定</span><span class="paldesc2">変更</span>
@@ -218,6 +208,7 @@
218208 </div> <!-- apparea -->
219209
220210 <script type="text/javascript" src="js/numeric-1.2.6.min.js"></script>
211+ <script type="text/javascript" src="js/settings.js"></script>
221212 <script type="text/javascript" src="js/Common.js"></script>
222213 <script type="text/javascript" src="js/Queue.js"></script>
223214 <script type="text/javascript" src="js/CommandObj.js"></script>
--- HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/DispObj.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/DispObj.js (revision 48)
@@ -29,9 +29,6 @@
2929
3030 // DOMをクリア
3131 this.initDOMobj();
32-
33-
34- this.dropinitsize = 200.0; // File dropで作成する Elementの長辺の長さ
3532 }
3633 initDOMobj() {
3734 if (null != this.DOMbase) {
@@ -174,17 +171,18 @@
174171 }.bind(this);
175172 }
176173 calcImageWH(srcW, srcH) {
174+ let initsize = window.MyAppSettings.getInitialSizeOfElement();
177175 let destW = 0;
178176 let destH = 0;
179177 let isLongWidth = (srcW < srcH) ? false : true;
180178 if (isLongWidth) {
181- let ratio = this.dropinitsize / srcW;
182- destW = this.dropinitsize;
179+ let ratio = initsize / srcW;
180+ destW = initsize;
183181 destH = srcH * ratio;
184182 }
185183 else {
186- let ratio = this.dropinitsize / srcH;
187- destH = this.dropinitsize;
184+ let ratio = initsize / srcH;
185+ destH = initsize;
188186 destW = srcW * ratio;
189187 }
190188 return new rectData(0, 0, destW, destH);
@@ -269,7 +267,8 @@
269267 this.width = rect.right - rect.left;
270268 this.height = rect.bottom - rect.top;
271269 window.renderLoop.requestRenderFunc(this.renderscalebox.bind(this));
272- this.fontsize = fontscale;
270+ if (0 < fontscale)
271+ this.fontsize = fontscale;
273272 }
274273 renderscalebox() {
275274 this.DOMbase.style.left = this.x.toString() + "px";
--- HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/ObjIDMgr.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/ObjIDMgr.js (revision 48)
@@ -103,6 +103,16 @@
103103 this.ObjIDarray[i].DOMobject.classList.toggle(classname);
104104 }
105105 }
106+ addClassToAllObj(classname) {
107+ for (let i = 0; i < this.ObjIDLen; i++) {
108+ this.ObjIDarray[i].DOMobject.classList.add(classname);
109+ }
110+ }
111+ removeClassToAllObj(classname) {
112+ for (let i = 0; i < this.ObjIDLen; i++) {
113+ this.ObjIDarray[i].DOMobject.classList.remove(classname);
114+ }
115+ }
106116
107117
108118 // Command処理 ----------------------
--- HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/UI_parts.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/UI_parts.js (revision 48)
@@ -287,27 +287,34 @@
287287 ( 0, 0)-(増分x,増分y) に対してrotateZ(degree) すればいい？
288288 算出結果 x1',y1'-x2',y2'をleft,top,right,bottomに加算？
289289 */
290+
291+
292+ // Aspect比 固定 処理 -----------
293+ let newHeight = moveY;
294+ if (window.MyAppSettings.getElementAspect()) {
295+ let inth = parseInt(eleFocus[1].dataset.orgheight);
296+ let intw = parseInt(eleFocus[1].dataset.orgwidth);
297+ if (0 < inth && 0 < intw)
298+ newHeight = moveX * (inth / intw);
299+ }
300+
301+
290302 let deg = parseFloat(eleFocus[0].dataset.degree) * -1;
291303 let resultLT = rotateZ(0, 0, deg, 0, 0);
292304
293- let resultRB = rotateZ(0, 0, deg, moveX, moveY);
305+// let resultRB = rotateZ(0, 0, deg, moveX, moveY);
306+ let resultRB = rotateZ(0, 0, deg, moveX, newHeight);
294307
295308
296-
297-
298- switch (1) {
299- case 0: // 領域サイズ変更のみ
300- window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartWidth + moveX, this.scaleStartHeight + moveY));
301- break;
302- case 1: // 縦倍率に合わせfont sizeも変更
303- {
304- let orgheight = parseInt(eleFocus[1].dataset.orgheight);
305- let scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
306-// window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + (mirrorCodLR * moveX), this.scaleStartTop + (mirrorCodUD * moveY), this.scaleStartWidth + moveX, this.scaleStartHeight + moveY, scaleY));
307- window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + resultLT[0], this.scaleStartTop + resultLT[1], this.scaleStartWidth + resultRB[0], this.scaleStartHeight + resultRB[1], scaleY));
308- }
309- break;
309+ // 縦倍率に合わせfont sizeも変更
310+ let scaleY = -1;
311+ if (window.MyAppSettings.getScaleFont()) {
312+ // let orgheight = parseInt(eleFocus[1].dataset.orgheight);
313+ // scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
314+ scaleY = (this.scaleStartHeight + moveY) / this.scaleStartHeight * 100;
310315 }
316+// window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + (mirrorCodLR * moveX), this.scaleStartTop + (mirrorCodUD * moveY), this.scaleStartWidth + moveX, this.scaleStartHeight + moveY, scaleY));
317+ window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + resultLT[0], this.scaleStartTop + resultLT[1], this.scaleStartWidth + resultRB[0], this.scaleStartHeight + resultRB[1], scaleY));
311318 }
312319 renderMouseMoveScale(left, top, width, height, scalefont) {
313320 let eleFocus = this.getFocusdElements();
@@ -314,19 +321,12 @@
314321 if (eleFocus.length < 2) return;
315322 eleFocus[1].style.opacity = 0.4;
316323
317- switch(1){
318- case 0:
319- eleFocus[0].style.width = width + "px";
320- eleFocus[0].style.height = height + "px";
321- break;
322- case 1:
323- eleFocus[0].style.left = left + "px";
324- eleFocus[0].style.top = top + "px";
325- eleFocus[0].style.width = width + "px";
326- eleFocus[0].style.height = height + "px";
327- eleFocus[1].style.fontSize = scalefont + '%';
328- break;
329- }
324+ eleFocus[0].style.left = left + "px";
325+ eleFocus[0].style.top = top + "px";
326+ eleFocus[0].style.width = width + "px";
327+ eleFocus[0].style.height = height + "px";
328+ if (0 < scalefont)
329+ eleFocus[1].style.fontSize = scalefont + '%';
330330 }
331331 renderMouseMoveScaleLTRB(left, top, right, bottom, scalefont) {
332332 let eleFocus = this.getFocusdElements();
@@ -337,7 +337,8 @@
337337 eleFocus[0].style.top = top + "px";
338338 eleFocus[0].style.right = right + "px";
339339 eleFocus[0].style.bottom = bottom + "px";
340- eleFocus[1].style.fontSize = scalefont + '%';
340+ if (0 < scalefont)
341+ eleFocus[1].style.fontSize = scalefont + '%';
341342 }
342343
343344 mouseUpScale(evt, target, touchevt) {
@@ -366,10 +367,20 @@
366367 let mirrorCodUD = (this.degUD) ? -1 : 0;
367368 let mirrorCodLR = (this.degLR) ? -1 : 0;
368369
370+ // Aspect比 固定 処理 -----------
371+ let newHeight = moveY;
372+ if (window.MyAppSettings.getElementAspect()) {
373+ let inth = parseInt(eleFocus[1].dataset.orgheight);
374+ let intw = parseInt(eleFocus[1].dataset.orgwidth);
375+ if (0 < inth && 0 < intw)
376+ newHeight = moveX * (inth / intw);
377+ }
369378
379+
370380 let deg = parseFloat(eleFocus[0].dataset.degree) * -1;
371381 let resultLT = rotateZ(0, 0, deg, 0, 0);
372- let resultRB = rotateZ(0, 0, deg, moveX, moveY);
382+// let resultRB = rotateZ(0, 0, deg, moveX, moveY);
383+ let resultRB = rotateZ(0, 0, deg, moveX, newHeight);
373384
374385
375386 let rectFrom = new rectData();
@@ -378,17 +389,13 @@
378389 // rectTo.setLTWH(this.scaleStartLeft + (mirrorCodLR * moveX), this.scaleStartTop + (mirrorCodUD * moveY), this.scaleStartWidth + moveX, this.scaleStartHeight + moveY);
379390 rectTo.setLTWH(this.scaleStartLeft + resultLT[0], this.scaleStartTop + resultLT[1], this.scaleStartWidth + resultRB[0], this.scaleStartHeight + resultRB[1]);
380391
381- let scaleY = 1.0;
382- switch (1) {
383- case 0: // 領域サイズ変更のみ
384- break;
385- case 1: // 縦倍率に合わせfont sizeも変更
386- {
387- let orgwidth = parseInt(eleFocus[1].dataset.orgwidth);
388- let orgheight = parseInt(eleFocus[1].dataset.orgheight);
389- scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
390- }
391- break;
392+ // 縦倍率に合わせfont sizeも変更
393+ let scaleY = -1;
394+ if (window.MyAppSettings.getScaleFont()) {
395+ // let orgwidth = parseInt(eleFocus[1].dataset.orgwidth);
396+ // let orgheight = parseInt(eleFocus[1].dataset.orgheight);
397+ // scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
398+ scaleY = (this.scaleStartHeight + moveY) / this.scaleStartHeight * 100;
392399 }
393400
394401 // Scale Command発行
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
--- HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/palette.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/palette.js (revision 48)
@@ -168,6 +168,16 @@
168168 this.DOMpalact[cnt].classList.toggle(classname);
169169 }
170170 }
171+ addClassToActionPalettes(classname) {
172+ for (let cnt = 0; cnt < this.DOMpalact.length; cnt++) {
173+ this.DOMpalact[cnt].classList.add(classname);
174+ }
175+ }
176+ removeClassToActionPalettes(classname) {
177+ for (let cnt = 0; cnt < this.DOMpalact.length; cnt++) {
178+ this.DOMpalact[cnt].classList.remove(classname);
179+ }
180+ }
171181
172182
173183 // Event handler -----------------------
@@ -206,6 +216,9 @@
206216 else if (null != objid.match(/^palact/)) {
207217 getDropFile(evt, this.definepalactText.bind(this, palid), null, null);
208218 }
219+ else if (null != objid.match(/^palset/)) {
220+ getDropFile(evt, this.definepalsetText.bind(this, palid), null, null);
221+ }
209222
210223 }
211224
@@ -358,18 +371,16 @@
358371 executeSettingButton(evt){
359372 switch (evt.target.dataset.objid) {
360373 case "palset0": // 設定パレット非表示
361- this.DOMpalset[0].parentNode.style.display = "none";
374+ window.MyAppSettings.setShowHideSettingPalette(false);
362375 break;
363376 case "palset1": // 選択中要素を削除
364- this.removeFocusedObject();
377+ window.MyAppSettings.removeFocusedObject();
365378 break;
366379 case "palset2": // 要素の枠を表示/非表示
367- this.toggleElementBorderline();
380+ window.MyAppSettings.setElementBorderLine(true);
368381 break;
369382 case "palset3": // アニメーション停止/再開
370- // DispObjとPalette要素にPauseAnimation css classを付与する
371- window.ObjIDMgr.toggleClassToAllObj('PauseAnimation');
372- window.CSSPalette.toggleClassToActionPalettes('PauseAnimation');
383+ window.MyAppSettings.setElementAnimation(true);
373384 break;
374385 case "palset4": // 編集中の画像をファイルに保存
375386 break;
@@ -376,7 +387,11 @@
376387 case "palset5": // 編集中の画像をhtmlとして保存
377388 break;
378389 case "palset6": // 拡大縮小操作のとき、Aspect比を保持する/しない
390+ window.MyAppSettings.setElementAspect(true);
379391 break;
392+ case "palset7":
393+ window.MyAppSettings.setAlwaysOffPaletteAnimation(false);
394+ break;
380395 default:
381396 break;
382397 }
@@ -383,31 +398,5 @@
383398 }
384399
385400
386- toggleElementBorderline() {
387- let setStr = '';
388- let nowSetting = window.frameArea.DOMobject.style.border;
389- if ("" == nowSetting) {
390- setStr = "1px solid black";
391- }
392- else {
393- setStr = "";
394- }
395- window.frameArea.DOMobject.style.border = setStr;
396401
397- let dispobjRuleBefore = ".DispObj { border: "
398- let dispobjRuleAfter = ";}";
399- let elestyle = document.getElementById('styledispobj');
400- elestyle.sheet.removeRule(0);
401- elestyle.sheet.insertRule(dispobjRuleBefore + setStr + dispobjRuleAfter, 0);
402- }
403- removeFocusedObject() {
404- let focused = window.partsFocus.getFocusedObjid();
405- if (null != focused) {
406- // Delete command発行
407- var obj1 = new CCommandObj();
408- obj1.createCommand(cmdType.request, cmdAddress.ObjIDMgr, cmdAddress.ObjIDMgr, cmdCmd.deletebox, focused, null, null, null, 1);
409- window.postToWorker.post(obj1);
410- }
411- };
412-
413402 } // class CSSPalette
--- HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/palgroup.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/bin/x64/Debug/AppX/js/palgroup.js (revision 48)
@@ -14,6 +14,7 @@
1414 this.typeBackground = 0;
1515 this.typeTextcolor = 1;
1616 this.typeAction = 2;
17+ this.typeSettings = 3;
1718
1819 this.DOMobject = []; // bg,text,action
1920 }
@@ -44,6 +45,15 @@
4445 let data = this.DOMobject[groupType].innerHTML;
4546 }
4647
48+ showSettingPalette(show) {
49+ this.debuglog('設定パレット 表示/非表示 要求 show = ' + show);
50+ if (true == show) {
51+ this.DOMobject[this.typeSettings].style.display = "block";
52+ }
53+ else {
54+ this.DOMobject[this.typeSettings].style.display = "none";
55+ }
56+ }
4757
4858 // Event handler -----------------------
4959
--- HtmlDrawApp/HTMLDrawApp/index.html (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/index.html (revision 48)
@@ -14,16 +14,6 @@
1414 <div id="FrameArea" data-objid="FrameArea"></div>
1515 </div>
1616 <!-- ------------------------------------ to here. -->
17- <!-- 固定ボタン (選択要素の削除, 保存, …) -->
18- <button type=button class="pal" data-objid="pal" data-palid="0" title="フォーカス中の要素を削除します">削除</button>
19- <button type=button class="pal" data-objid="pal" data-palid="1" title="現在のパレット設定を保存します">設定保存</button>
20- <button type=button class="pal" data-objid="pal" data-palid="2" title="設定画面を表示します">設定Drop</button>
21- <button type=button class="pal" data-objid="pal" data-palid="3" title="アニメーションを停止します">アニメ停止</button>
22- <button type=button class="pal" data-objid="pal" data-palid="4">枠表示</button>
23- <button type=button class="pal" data-objid="pal" data-palid="5">背景大</button>
24- <button type=button class="pal" data-objid="pal" data-palid="6">背景小</button>
25- <a href="#" id="save" download="DragDraw.dd" title="DragDraw.ddという名前でダウンロードフォルダに保存します">画像保存</a><br />
26- <a href="#apparea">停止</a>
2717
2818 <style id="styledispobj">
2919 .DispObj {
@@ -183,11 +173,11 @@
183173 <div style="overflow:hidden; position:absolute; left:0; top: 14px; width:100%; height:calc(100% - 14px); margin:0; padding:0;">
184174 <span class="paldesc1">外観</span><span class="paldesc2">見た</span>
185175 </div>
186- <div class="paltxtcol paltxtcol0" data-objid="paltxtcol0" data-palid="0">あ</div>
187- <div class="paltxtcol paltxtcol1" data-objid="paltxtcol1" data-palid="1">あ</div>
188- <div class="paltxtcol paltxtcol2" data-objid="paltxtcol2" data-palid="2">あ</div>
189- <div class="paltxtcol paltxtcol3" data-objid="paltxtcol3" data-palid="3">あ</div>
190- <div class="paltxtcol paltxtcol4" data-objid="paltxtcol4" data-palid="4">あ</div>
176+ <div class="paltxtcol paltxtcol0" data-objid="paltxtcol0" data-palid="0"></div>
177+ <div class="paltxtcol paltxtcol1" data-objid="paltxtcol1" data-palid="1"></div>
178+ <div class="paltxtcol paltxtcol2" data-objid="paltxtcol2" data-palid="2"></div>
179+ <div class="paltxtcol paltxtcol3" data-objid="paltxtcol3" data-palid="3"></div>
180+ <div class="paltxtcol paltxtcol4" data-objid="paltxtcol4" data-palid="4"></div>
191181 </fieldset>
192182
193183 <br />
@@ -204,7 +194,7 @@
204194 <div class="palact palact4" data-objid="palact4" data-palid="4"></div>
205195 </fieldset>
206196
207- <fieldset class="palgroup palgroup3" data-objid="palgroup3" title="設定を変更するパレットです">
197+ <fieldset class="palgroup palgroup3" data-objid="palgroup3" title="設定を変更するパレットです" draggable="false">
208198 <legend class="pallegend"> Setting Palette </legend>
209199 <div style="overflow:hidden; position:absolute; left:0; top: 14px; width:100%; height:calc(100% - 14px); margin:0; padding:0;">
210200 <span class="paldesc1">設定</span><span class="paldesc2">変更</span>
--- HtmlDrawApp/HTMLDrawApp/js/DispObj.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/js/DispObj.js (revision 48)
@@ -29,9 +29,6 @@
2929
3030 // DOMをクリア
3131 this.initDOMobj();
32-
33-
34- this.dropinitsize = 200.0; // File dropで作成する Elementの長辺の長さ
3532 }
3633 initDOMobj() {
3734 if (null != this.DOMbase) {
@@ -174,17 +171,18 @@
174171 }.bind(this);
175172 }
176173 calcImageWH(srcW, srcH) {
174+ let initsize = window.MyAppSettings.getInitialSizeOfElement();
177175 let destW = 0;
178176 let destH = 0;
179177 let isLongWidth = (srcW < srcH) ? false : true;
180178 if (isLongWidth) {
181- let ratio = this.dropinitsize / srcW;
182- destW = this.dropinitsize;
179+ let ratio = initsize / srcW;
180+ destW = initsize;
183181 destH = srcH * ratio;
184182 }
185183 else {
186- let ratio = this.dropinitsize / srcH;
187- destH = this.dropinitsize;
184+ let ratio = initsize / srcH;
185+ destH = initsize;
188186 destW = srcW * ratio;
189187 }
190188 return new rectData(0, 0, destW, destH);
@@ -269,7 +267,8 @@
269267 this.width = rect.right - rect.left;
270268 this.height = rect.bottom - rect.top;
271269 window.renderLoop.requestRenderFunc(this.renderscalebox.bind(this));
272- this.fontsize = fontscale;
270+ if (0 < fontscale)
271+ this.fontsize = fontscale;
273272 }
274273 renderscalebox() {
275274 this.DOMbase.style.left = this.x.toString() + "px";
--- HtmlDrawApp/HTMLDrawApp/js/ObjIDMgr.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/js/ObjIDMgr.js (revision 48)
@@ -103,6 +103,16 @@
103103 this.ObjIDarray[i].DOMobject.classList.toggle(classname);
104104 }
105105 }
106+ addClassToAllObj(classname) {
107+ for (let i = 0; i < this.ObjIDLen; i++) {
108+ this.ObjIDarray[i].DOMobject.classList.add(classname);
109+ }
110+ }
111+ removeClassToAllObj(classname) {
112+ for (let i = 0; i < this.ObjIDLen; i++) {
113+ this.ObjIDarray[i].DOMobject.classList.remove(classname);
114+ }
115+ }
106116
107117
108118 // Command処理 ----------------------
--- HtmlDrawApp/HTMLDrawApp/js/UI_parts.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/js/UI_parts.js (revision 48)
@@ -287,27 +287,34 @@
287287 ( 0, 0)-(増分x,増分y) に対してrotateZ(degree) すればいい？
288288 算出結果 x1',y1'-x2',y2'をleft,top,right,bottomに加算？
289289 */
290+
291+
292+ // Aspect比 固定 処理 -----------
293+ let newHeight = moveY;
294+ if (window.MyAppSettings.getElementAspect()) {
295+ let inth = parseInt(eleFocus[1].dataset.orgheight);
296+ let intw = parseInt(eleFocus[1].dataset.orgwidth);
297+ if (0 < inth && 0 < intw)
298+ newHeight = moveX * (inth / intw);
299+ }
300+
301+
290302 let deg = parseFloat(eleFocus[0].dataset.degree) * -1;
291303 let resultLT = rotateZ(0, 0, deg, 0, 0);
292304
293- let resultRB = rotateZ(0, 0, deg, moveX, moveY);
305+// let resultRB = rotateZ(0, 0, deg, moveX, moveY);
306+ let resultRB = rotateZ(0, 0, deg, moveX, newHeight);
294307
295308
296-
297-
298- switch (1) {
299- case 0: // 領域サイズ変更のみ
300- window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartWidth + moveX, this.scaleStartHeight + moveY));
301- break;
302- case 1: // 縦倍率に合わせfont sizeも変更
303- {
304- let orgheight = parseInt(eleFocus[1].dataset.orgheight);
305- let scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
306-// window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + (mirrorCodLR * moveX), this.scaleStartTop + (mirrorCodUD * moveY), this.scaleStartWidth + moveX, this.scaleStartHeight + moveY, scaleY));
307- window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + resultLT[0], this.scaleStartTop + resultLT[1], this.scaleStartWidth + resultRB[0], this.scaleStartHeight + resultRB[1], scaleY));
308- }
309- break;
309+ // 縦倍率に合わせfont sizeも変更
310+ let scaleY = -1;
311+ if (window.MyAppSettings.getScaleFont()) {
312+ // let orgheight = parseInt(eleFocus[1].dataset.orgheight);
313+ // scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
314+ scaleY = (this.scaleStartHeight + moveY) / this.scaleStartHeight * 100;
310315 }
316+// window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + (mirrorCodLR * moveX), this.scaleStartTop + (mirrorCodUD * moveY), this.scaleStartWidth + moveX, this.scaleStartHeight + moveY, scaleY));
317+ window.renderLoop.requestRenderFunc(this.renderMouseMoveScale.bind(this, this.scaleStartLeft + resultLT[0], this.scaleStartTop + resultLT[1], this.scaleStartWidth + resultRB[0], this.scaleStartHeight + resultRB[1], scaleY));
311318 }
312319 renderMouseMoveScale(left, top, width, height, scalefont) {
313320 let eleFocus = this.getFocusdElements();
@@ -314,19 +321,12 @@
314321 if (eleFocus.length < 2) return;
315322 eleFocus[1].style.opacity = 0.4;
316323
317- switch(1){
318- case 0:
319- eleFocus[0].style.width = width + "px";
320- eleFocus[0].style.height = height + "px";
321- break;
322- case 1:
323- eleFocus[0].style.left = left + "px";
324- eleFocus[0].style.top = top + "px";
325- eleFocus[0].style.width = width + "px";
326- eleFocus[0].style.height = height + "px";
327- eleFocus[1].style.fontSize = scalefont + '%';
328- break;
329- }
324+ eleFocus[0].style.left = left + "px";
325+ eleFocus[0].style.top = top + "px";
326+ eleFocus[0].style.width = width + "px";
327+ eleFocus[0].style.height = height + "px";
328+ if (0 < scalefont)
329+ eleFocus[1].style.fontSize = scalefont + '%';
330330 }
331331 renderMouseMoveScaleLTRB(left, top, right, bottom, scalefont) {
332332 let eleFocus = this.getFocusdElements();
@@ -337,7 +337,8 @@
337337 eleFocus[0].style.top = top + "px";
338338 eleFocus[0].style.right = right + "px";
339339 eleFocus[0].style.bottom = bottom + "px";
340- eleFocus[1].style.fontSize = scalefont + '%';
340+ if (0 < scalefont)
341+ eleFocus[1].style.fontSize = scalefont + '%';
341342 }
342343
343344 mouseUpScale(evt, target, touchevt) {
@@ -366,10 +367,20 @@
366367 let mirrorCodUD = (this.degUD) ? -1 : 0;
367368 let mirrorCodLR = (this.degLR) ? -1 : 0;
368369
370+ // Aspect比 固定 処理 -----------
371+ let newHeight = moveY;
372+ if (window.MyAppSettings.getElementAspect()) {
373+ let inth = parseInt(eleFocus[1].dataset.orgheight);
374+ let intw = parseInt(eleFocus[1].dataset.orgwidth);
375+ if (0 < inth && 0 < intw)
376+ newHeight = moveX * (inth / intw);
377+ }
369378
379+
370380 let deg = parseFloat(eleFocus[0].dataset.degree) * -1;
371381 let resultLT = rotateZ(0, 0, deg, 0, 0);
372- let resultRB = rotateZ(0, 0, deg, moveX, moveY);
382+// let resultRB = rotateZ(0, 0, deg, moveX, moveY);
383+ let resultRB = rotateZ(0, 0, deg, moveX, newHeight);
373384
374385
375386 let rectFrom = new rectData();
@@ -378,17 +389,13 @@
378389 // rectTo.setLTWH(this.scaleStartLeft + (mirrorCodLR * moveX), this.scaleStartTop + (mirrorCodUD * moveY), this.scaleStartWidth + moveX, this.scaleStartHeight + moveY);
379390 rectTo.setLTWH(this.scaleStartLeft + resultLT[0], this.scaleStartTop + resultLT[1], this.scaleStartWidth + resultRB[0], this.scaleStartHeight + resultRB[1]);
380391
381- let scaleY = 1.0;
382- switch (1) {
383- case 0: // 領域サイズ変更のみ
384- break;
385- case 1: // 縦倍率に合わせfont sizeも変更
386- {
387- let orgwidth = parseInt(eleFocus[1].dataset.orgwidth);
388- let orgheight = parseInt(eleFocus[1].dataset.orgheight);
389- scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
390- }
391- break;
392+ // 縦倍率に合わせfont sizeも変更
393+ let scaleY = -1;
394+ if (window.MyAppSettings.getScaleFont()) {
395+ // let orgwidth = parseInt(eleFocus[1].dataset.orgwidth);
396+ // let orgheight = parseInt(eleFocus[1].dataset.orgheight);
397+ // scaleY = (this.scaleStartHeight + moveY) / orgheight * 100; // ★さらに初期倍率設定値を掛ける必要がある
398+ scaleY = (this.scaleStartHeight + moveY) / this.scaleStartHeight * 100;
392399 }
393400
394401 // Scale Command発行
--- HtmlDrawApp/HTMLDrawApp/js/main.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/js/main.js (revision 48)
@@ -45,16 +45,8 @@
4545 // 選択 itemの focus状態表示用
4646 // MouseDownで Focus移動
4747 window.partsFocus = new CPartsFocus();
48-
49- // 固定設置 palette button ------------------
50- let palButtonlist = document.getElementsByClassName( 'pal' );
51- for( let cnt=0; cnt < palButtonlist.length; cnt++ ){
52- palButtonlist[cnt].addEventListener( 'click', onClickPalButton, false );
53- }
54-
55- let savelink = document.getElementById('save');
56- savelink.addEventListener('click', onClickSaveLink, false);
5748
49+
5850 // パレットグループ作成
5951 window.CSSPalGroup = new PalGroup();
6052 window.CSSPalGroup.initialize();
@@ -270,79 +262,4 @@
270262
271263 }
272264
273-
274-
275-
276-
277-
278-
279- // 固定ボタン押下 event handler ----------------
280-
281- function onClickPalButton(evt) {
282- debuglog('【onClickPalButton' + evt.target.dataset.palid + '】');
283- switch (parseInt(evt.target.dataset.palid)) {
284- case 0: // Delete (Elase) element
285- removeFocusedObject();
286- break;
287- case 1: // Save palette settings
288- let data = window.CSSPalGroup.getPalGroupInfo(window.CSSPalGroup.typeBackground);
289- break;
290- case 2:
291- case 3: // Pouse animation
292- // DispObjとPalette要素にPauseAnimation css classを付与する
293- window.ObjIDMgr.toggleClassToAllObj('PauseAnimation');
294- window.CSSPalette.toggleClassToActionPalettes('PauseAnimation');
295- break;
296- case 4: // Show/Hide element borderline
297- {
298- let setStr = '';
299- let nowSetting = window.frameArea.DOMobject.style.border;
300- if ("" == nowSetting) {
301- setStr = "1px solid black";
302- }
303- else {
304- setStr = "";
305- }
306- window.frameArea.DOMobject.style.border = setStr;
307-
308- let dispobjRuleBefore = ".DispObj { border: "
309- let dispobjRuleAfter = ";}";
310- let elestyle = document.getElementById('styledispobj');
311- elestyle.sheet.removeRule(0);
312- elestyle.sheet.insertRule(dispobjRuleBefore + setStr + dispobjRuleAfter, 0);
313- }
314- break;
315- case 5: // 背景大
316- window.displayField.DOMobject.style.overflow = "scroll";
317- window.frameArea.DOMobject.style.width = 1200 + 'px';
318- window.frameArea.DOMobject.style.height = 600 + 'px';
319- break;
320- case 6: // 背景小
321- window.frameArea.DOMobject.style.width = 600 + 'px';
322- window.frameArea.DOMobject.style.height = 300 + 'px';
323- break;
324- }
325- };
326-
327- function removeFocusedObject() {
328- let focused = window.partsFocus.getFocusedObjid();
329- if (null != focused) {
330- // Delete command発行
331- var obj1 = new CCommandObj();
332- obj1.createCommand(cmdType.request, cmdAddress.ObjIDMgr, cmdAddress.ObjIDMgr, cmdCmd.deletebox, focused, null, null, null, 1);
333- window.postToWorker.post(obj1);
334- }
335- };
336- function setBkColorFocusedObject(bkColor) {
337- let focused = window.partsFocus.getFocusedObjid();
338- if (null != focused) {
339- let obj = window.ObjIDMgr.getIDtoDispObj(focused);
340- obj.DOMobject.style.backgroundColor = 'rgba(' + ((0xff000000 & bkColor) >>> 24) + ', '
341- + ((0x00ff0000 & bkColor) >>> 16) + ', '
342- + ((0x0000ff00 & bkColor) >>> 8) + ', '
343- + ((0x000000ff & bkColor) >>> 0) + ');';
344- // 背景色変更 command 発行
345- }
346- };
347-
348265 })();
--- HtmlDrawApp/HTMLDrawApp/js/palette.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/js/palette.js (revision 48)
@@ -168,6 +168,16 @@
168168 this.DOMpalact[cnt].classList.toggle(classname);
169169 }
170170 }
171+ addClassToActionPalettes(classname) {
172+ for (let cnt = 0; cnt < this.DOMpalact.length; cnt++) {
173+ this.DOMpalact[cnt].classList.add(classname);
174+ }
175+ }
176+ removeClassToActionPalettes(classname) {
177+ for (let cnt = 0; cnt < this.DOMpalact.length; cnt++) {
178+ this.DOMpalact[cnt].classList.remove(classname);
179+ }
180+ }
171181
172182
173183 // Event handler -----------------------
@@ -206,6 +216,9 @@
206216 else if (null != objid.match(/^palact/)) {
207217 getDropFile(evt, this.definepalactText.bind(this, palid), null, null);
208218 }
219+ else if (null != objid.match(/^palset/)) {
220+ getDropFile(evt, this.definepalsetText.bind(this, palid), null, null);
221+ }
209222
210223 }
211224
@@ -358,18 +371,16 @@
358371 executeSettingButton(evt){
359372 switch (evt.target.dataset.objid) {
360373 case "palset0": // 設定パレット非表示
361- this.DOMpalset[0].parentNode.style.display = "none";
374+ window.MyAppSettings.setShowHideSettingPalette(false);
362375 break;
363376 case "palset1": // 選択中要素を削除
364- this.removeFocusedObject();
377+ window.MyAppSettings.removeFocusedObject();
365378 break;
366379 case "palset2": // 要素の枠を表示/非表示
367- this.toggleElementBorderline();
380+ window.MyAppSettings.setElementBorderLine(true);
368381 break;
369382 case "palset3": // アニメーション停止/再開
370- // DispObjとPalette要素にPauseAnimation css classを付与する
371- window.ObjIDMgr.toggleClassToAllObj('PauseAnimation');
372- window.CSSPalette.toggleClassToActionPalettes('PauseAnimation');
383+ window.MyAppSettings.setElementAnimation(true);
373384 break;
374385 case "palset4": // 編集中の画像をファイルに保存
375386 break;
@@ -376,7 +387,11 @@
376387 case "palset5": // 編集中の画像をhtmlとして保存
377388 break;
378389 case "palset6": // 拡大縮小操作のとき、Aspect比を保持する/しない
390+ window.MyAppSettings.setElementAspect(true);
379391 break;
392+ case "palset7":
393+ window.MyAppSettings.setAlwaysOffPaletteAnimation(false);
394+ break;
380395 default:
381396 break;
382397 }
@@ -383,31 +398,5 @@
383398 }
384399
385400
386- toggleElementBorderline() {
387- let setStr = '';
388- let nowSetting = window.frameArea.DOMobject.style.border;
389- if ("" == nowSetting) {
390- setStr = "1px solid black";
391- }
392- else {
393- setStr = "";
394- }
395- window.frameArea.DOMobject.style.border = setStr;
396401
397- let dispobjRuleBefore = ".DispObj { border: "
398- let dispobjRuleAfter = ";}";
399- let elestyle = document.getElementById('styledispobj');
400- elestyle.sheet.removeRule(0);
401- elestyle.sheet.insertRule(dispobjRuleBefore + setStr + dispobjRuleAfter, 0);
402- }
403- removeFocusedObject() {
404- let focused = window.partsFocus.getFocusedObjid();
405- if (null != focused) {
406- // Delete command発行
407- var obj1 = new CCommandObj();
408- obj1.createCommand(cmdType.request, cmdAddress.ObjIDMgr, cmdAddress.ObjIDMgr, cmdCmd.deletebox, focused, null, null, null, 1);
409- window.postToWorker.post(obj1);
410- }
411- };
412-
413402 } // class CSSPalette
--- HtmlDrawApp/HTMLDrawApp/js/palgroup.js (revision 47)
+++ HtmlDrawApp/HTMLDrawApp/js/palgroup.js (revision 48)
@@ -14,6 +14,7 @@
1414 this.typeBackground = 0;
1515 this.typeTextcolor = 1;
1616 this.typeAction = 2;
17+ this.typeSettings = 3;
1718
1819 this.DOMobject = []; // bg,text,action
1920 }
@@ -44,6 +45,15 @@
4445 let data = this.DOMobject[groupType].innerHTML;
4546 }
4647
48+ showSettingPalette(show) {
49+ this.debuglog('設定パレット 表示/非表示 要求 show = ' + show);
50+ if (true == show) {
51+ this.DOMobject[this.typeSettings].style.display = "block";
52+ }
53+ else {
54+ this.DOMobject[this.typeSettings].style.display = "none";
55+ }
56+ }
4757
4858 // Event handler -----------------------
4959