매버릭스를 클린하게 설치했다.

S/L/E의 Kext를 배제하고 설치하는 것을 Clean설치라고 하는데,

이번에 그렇게 했다.


지난번엔 마운틴라이온을 근근히 설치한후,

이것저것 귀찮아서 Kext를 무자비하게 때려넣었었습니다.

그후 별도의 파티션에 EFI영역만들고, 10.9 매버릭스를 깨끗하게 클린설치(복원)했고,

org.chameleon.Boot, smbios, dsdt 수정을 적절히 해줬다.

거의 모든 정보와 자료는 [금사과 해킨토시] 카페에 다 있었고,

사용한 정보는 삽질하실 다음 사람을 위해 링크주소를 적어두겠다.

그외 참고할 만한 사이트는 http://x86osx.com/이 있는데,

많은 유저들의 경험담을 볼 수 있어서 검색만 잘해도 반은 된거나 다름없다.


-------------------------구성-------------------------

CPU : Q6600

M/B : GA-P35-DS3R

RAM : DDR2 6400 2G *4

POWER : Seasonic 430w 80plus

Case : LianLi PC-7 Plus(Silver)

HDD : 1TB * 2

VGA : 5870레퍼

OS : 10.9 Mavericks 10.9 복원이미지(http://cafe.daum.net/osxlion/HJRp/181)

부트로더 : 카멜레온

 - 베이스는 747(http://cafe.daum.net/osxlion/HKgC/1)

 - Boot파일은 r2375(http://cafe.daum.net/osxlion/HKgC/94)

------------------------------------------------------

* 해킨은 실제 맥에서 사용되는 하드웨어와 최대한 가깝게 구성하는게 중요하다.

* 할 수만 있다면 맥과 동일한 하드웨어를 사용하라! 처음부터 그냥 인식해린다.


-------------------------비용-------------------------

CPU+RAM(2G*2)+택배 : 7.6 만원

RAM(2G*2) : 안쓰이는 구형컴 2대에서 하나씩 적출

M/B+택배 : 2.7만원

Case + Power+택배 : 5만원

HDD : 4만원 직거래

VGA : 세컨에서 쓰던 놈 적출 .....

튜닝소품 : 카본시트지, LED바 30cm, 문구점에서 포맥스까지... 1.6만원 정도?

총 21만원 쯤 들었다.

------------------------------------------------------


해킨 설치과정(삽질을 많이 했지만, 삽질은 생략하고 숏컷만 적겠심)

1. EFI도 없이 닥치고 더티하게 OSX 설치

 - 저는 파티션을 2개로 나눠서 설치

 - 2번 파티션에 더티하게 설치한후 1번에 클린설치를 하기 위해서


2. 나머지 설치안된 1번 파티션에 EFI영역 심기

 - 설치가이드(http://cafe.daum.net/osxlion/HJp3/36)의 중간부분부터 있는 EFI만들기와

 - 설치가이드의 마지막부분에 있는 EFI가이드 링크를 참조해서 작업


3. EFI영역 완료후 1번 파티션에 클린이미지 복원

 - 금사과님이 올려주신 클린이미지(http://cafe.daum.net/osxlion/HJRp/181) 사용


4. DSDT인식 불가능 장비 처리

 - 맥에서 안쓰이는 칩셋은 kext로 박아넣을 수 밖에 없다.

 - 단 그위치가 S/L/E가 아니라 EFI영역의 E/E이다. 안그러면 다음 OSX업데이트시 커널패닉을 유발할 수 있다.

 - 이더넷 칩셋이 RTL8111b인데... 스노우레오파드때까진 인식됐었다고하나,

 - 라이언때부터 인식이 안되므로, 어쩔수없이 EFI파티션 E/E에 RealtekRTL81xx.Kext 하나 넣어줬다.

 - 아, 물론 fakeSMC.Kext는 기본포함 ^^


5. DSDT 수정

 - 여기저기서 남들이 수정해놓은 dsdt를 긁어모아서 짜집기했다.(개발자는 짜집기의 달인ㅋ)

 - 남의 DSDT아무생각없이 쓰면 안된다.

 - DSDT안에 나와 다른 CPU나 그래픽카드, 다른 장비들이 들어있으면 문제가 된다

 - DSDT내에 그래픽카드가 엉뚱한 것으로 되어있으니 앱스토어가 안되는 사태가 ㅡ,.ㅡ;;;;;;

 - 수정, 패치/컴파일은 DSDTSE에서 수행(http://cafe.daum.net/osxlion/HKg3/126)

 - 첨부된 dsdt.aml파일은 GA-P35-DS3R용 이다. 사운드, SATA AHCI, USB 등 보드관련 패치만 해놔서 동일보드면 누구나 OK

 - DSDT로 수정되는 항목은 절대로 Kext를 사용하면 안된다. 그건 죽도 아니고 밥도 아녀!

 - 다행히 그래픽카드는 맥프로에서도 사용되는 5870레퍼를 사용하기에 손도 까딱안하고 OK

--------------------------------------------

DSDT_GA-P35-DS3R.aml

--------------------------------------------


6. 그와중에 오버클럭ㅋ

 - 오버클럭때문에 1TB하드를 하나 더 넣고, 윈도우를 설치했다.

 - 오버클럭 안정화 테스트는 Linx같은 오버클럭용 과부하프로그램이 있어야하는데, OSX 앱엔 마땅한게 없어서이다.

 - 아무튼 오버클럭후 안정화 안된상태에선 OSX부팅도중 그냥 죽어버린다.

 - 반드시 윈도우에서 안정성이 확인된후 OSX로 부팅되어야겠다.

 - 안정화후 OSX부팅하고, EFI의 E/E안에서 simbios.plis를 수정

 - CPU와 RAM을 오버클럭한 경우에는 simbios.plis를 수정해줘야 정확한 성능이 나온다고 한다.

 - 각 명칭은 링크 참조(http://newlynux.blog.me/140133082688)


7. 모니터링


 - H/W상태를 볼 수 있는 모니터링이 있으면 좋다.

 - 위의 스크린샷에 있는  메뉴바의 HWmonitor가 그런 놈

 - 링크(http://cafe.daum.net/osxlion/HKg7/209)에 가면 있고, 클린설치를 했으니 2번째 자료를 이용


8. 모든게 다 잘되는데, iMessage활성화가 안되더라...

 - 여기 링크(http://cafe.daum.net/osxlion/HKgC/115) 따라했더니 되네 ^^


9. EFI 파티션 숨기기/락걸기

 - 제가 Application에 올려둔 자료가 있다. 사용하면 편하다(http://cafe.daum.net/osxlion/LfNd/180)

 - 위 링크의 앱을 사용할 경우, 파일이나 폴더도 감출 수 있어 불순한 어린이들의 필수 앱이 아닐까... ㅡ,.ㅡ;;;


10. 바탕화면 꾸미기

 - 맥북 첨 샀을때 GeekTool로 한창 꾸미기 했었는데,

 - 철지난 아이언맨 자비스 테마를 Geektool로 따라해 봤다.





VGA 튜닝----------------------------

레퍼런스 그래픽카드가 좀 투박하자나?

안에 LED를 박아 넣겠다.


옆면을 줄톱으로 틈을 잘라내고,



틈에 맞춰 LED빛을 산란시켜줄 면발광 아크릴판을 잘라준다.



요렇게 넣겠다.



줄톱질이 어설퍼 벌어진 틈새는 메꾸미로 채워주고,



카본시트를 위에 발라서 이쁘게 마무리




내부에 LED를 넣기전에 우선 빛이 잘 나오는지 확인, Gooooood



이제 내부 방열판 옆면에 LED를 붙이고, LED 12v전원을 쿨러전원 12v에 납땜으로 연결




CASE 튜닝----------------------------

다나와 중고업자가 상태 깨끗하다고 자부하더니....

받아보니 요모양 요꼴


그리하여 자잘한 긁힘, 기스를 박멸하기 위해 차트렁크에서 컴파운드 출동!!



컴파운드질로 대충은 깔끔해진 케이스



이제 옆면을 뚫고 아크릴판을 붙이겠다.

그라인더로 진짜 신경써서 잘랐건만, 울긋불긋. 이런건 왠만하면 절단업체에 맡겨야겠다 ㅡㅜ


여기에 실버카본시트지를 붙였는데, 부착하는 사진은 못찍었네ㅡㅜ


케이스가 2005년도 출시된 녀석이라 내부에 선정리홀이 없다.

그래서 선이 너무 너저분하길래 선을 가려줄 막이겸, LED조명등을 만들어줬다.


여기에도 실버카본시트지를 입혔는데, 역시나 시트지 붙이는건 못찍었다.


튜닝완성----------------------------




전원 넣고 튜닝의 결과


------여기서 LED조명색 변경

- 지난번 인증샷이후 하단 LED를 흰색에서 붉은색으로 변경

- 덕분에 글카의 LED도 살고, 전체적인 멋이 더 좋아졌다^^

 


Google AdSense
저작자표시 비영리 동일조건

'끄적끄적 > Mac' 카테고리의 다른 글

맥에서 최신 마메를 즐기자! SDLMAME for Mac  (25) 2015.11.05
XFX Radeon HD 5770 롬플래싱  (10) 2014.09.18
Mac Pro 2006(1세대)에 PC용 wifi TL-WDN4800 설치  (1) 2014.09.16
4870 1G vapor-X 롬플래싱 for 맥프로 1세대(2006)  (10) 2014.07.11
일반 8800gt 맥용으로 롬 플래싱  (2) 2014.06.28

HTML5 작성을 하면서 아쉬운점이...

대부분의 툴들이 CANVAS와 같은 HTML5 최신 요소들을 제대로 지원해주지 않는다는 것이다.





코드 어시스트 기능에 익숙해진 나같은 개발자에게...

"객체."이후 관련 멤버값을 자동으로 표시해주지 않는 것은 엄청난 스트레스였다.


예전처럼 개발할때마다 객체의 프로퍼티나 메서드를 알아보기 위해....

일일히 MSDN같은 Document를 뒤지는 것은 피곤한 일이 아닐 수 없다.


그런데 이것을 보라!!!!


세상에 canvas객체에도 점하나 찍으니 관련 코드들이 어시스트 되고 있다!!!!!

Liveweave라는 녀석인데, 내 PC에 설치한 프로그램도 아니다.

그냥 웹이다. 주소는....

http://liveweave.com/


화면이 4구역으로 나뉘어져 있는데,

좌상단은 HTML5, 우상단은 Javascript,

좌하단은 CSS, 우하단은 브라우저 화면이다.


코딩을 하면 우하단의 브라우저화면에 즉각 반영이 되는 것은 물론!!


Tools하부 메뉴로 가면 1개의 파일로 저장 또는 3개의 파일을 zip으로 압축해서 저장하는 것도 가능하다.

(zip확장자 없이 다운로드 되는데, ".zip"을 붙여서 사용하면 된다)


인터넷에 접속만 할 수 있다면,

eclipse, coda, XDK, Dreamweaver, visual web developer 2010 express 뭐 이런 프로그램 다~~~ 필요없다.


PS. Internet Explorer 9에서 확인해보니 정상 작동하지 않는다.

인터넷 익스플로어 사용자는 HTML5를 본격지원하는 10버젼 이상을 사용해야할듯하다.

Google AdSense
저작자표시 비영리 동일조건

'끄적끄적 > HTML5' 카테고리의 다른 글

HTML5 Canvas 이미지/스프라이트  (2) 2014.03.06
Event 처리를 통한 Canvas 캡슐화  (0) 2014.03.04
[HTML5] Javascript로 canvas제어하기  (0) 2014.03.01
HTML5 시작하기  (0) 2014.03.01
HTML5 코딩을 위한 준비 (윈도/맥 공통)  (0) 2014.02.27

이전 포스트에서 index.html, Nagarry.css를 만들었다.

이젠 Javascript파일 Nagarry.js를 추가해서 Canvas를 제어해 보겠다.




canvas는 말 그대로 뭔가를 그릴 수 있는 도화지 같은 바탕일 뿐이기에

크기 이외의 모든 것은 Javascript를 통해 이루어진다.


아래와 같은 index.html과 Nagarry.css파일을 준비하자.

(이전 포스트에서 작성했던 내용이다.)

Index.html

<!DOCTYPE html>

<html lang="ko">

<head>

<meta charset="UTF-8">

<title>Nagarry's HTML5</title>

<link type="text/css" rel="stylesheet" href="./css/Nagarry.css">

<script src="./script/Nagarry.js"></script>

</head>

<body>

<canvas id="CANVAS_1" width="800" height="480">

Sorry, Your browser doesn't support HTML5 Canvas.

</canvas>

</body>

</html>

Nagarry.css

@CHARSET "UTF-8";

body

{

background:#555555;

margin:20px;

}


#CANVAS_1

{

background:#ffffff;

border:1px solid #000000;

}



이제 아무 의심없이 아래와 같은 Javascript파일을 만들어보자.

Nagarry.js

var can1 = document.getElementById("CANVAS_1");

var context1 = can1.getContext("2d");

context1.fillStyle = "#ff0000";

context1.fillRect(50, 50, 360, 240);


이 javascript가 문제없이 동작한다면....

canvas내의 50, 50좌표에 360*240 크기의 붉은 사각형이 나타날 것이다.

(이 구문의 설명은 밑에서 하겠다)


브라우저를 통해 실행해보라.

지난 포스트에서 봤던거랑 달라진게 있는가???


없다. 붉은 사각형이 나타나지 않는다.

왜그럴까?

index.html파일을 다시 보겠다.

Index.html

<!DOCTYPE html>

<html lang="ko">

<head>

<meta charset="UTF-8">

<title>Nagarry's HTML5</title>

<link type="text/css" rel="stylesheet" href="./css/Nagarry.css">

<script src="./script/Nagarry.js"></script>

</head>

<body>

<canvas id="CANVAS_1" width="800" height="480">

Sorry, Your browser doesn't support HTML5 Canvas.

</canvas>

</body>

</html>


javascript에서는 분명 "CANVAS_1"이라는 것을 당겨썼지만,

"CANVAS_1"보다 먼저 javascript가 호출되었기 때문이다.


달리말해 <canvas>태그가 정의된 후에 javascript가 정의되거나 호출되어야 한다는 것이다.

그래서 수정하자면 아래와 같다.

Index.html

<!DOCTYPE html>

<html lang="ko">

<head>

<meta charset="UTF-8">

<title>Nagarry's HTML5</title>

<link type="text/css" rel="stylesheet" href="./css/Nagarry.css">

</head>

<body>

<canvas id="CANVAS_1" width="800" height="480">

Sorry, Your browser doesn't support HTML5 Canvas.

</canvas>

<script src="./script/Nagarry.js"></script>

</body>

</html>


수정후 브라우저를 통해 보면 이젠 사각형이 나올 것이다.


이제야 의도한 대로 동작한다.


그럼 javascript 문장을 살펴보겠다.

첫줄부터 마지막줄까지 설명한다.(이런 친절한 설명은 처음이자 마지막이 아닐까 싶다ㅎㅎㅎㅎ)

Nagarry.js

var can1 = document.getElementById("CANVAS_1");

var context1 = can1.getContext("2d");

context1.fillStyle = "#ff0000";

context1.fillRect(50, 50, 360, 240);


var can1 = document.getElementById("CANVAS_1");

can1이란 변수에 id가 "CANVAS_1"이라고 정의된 녀석을 대입한다.

이것으로 can1이 canvas가 되는것이다.


var context1 = can1.getContext("2d");

context1이란 변수에 canvas의 2d context를 대입한다.

context란 웹브라우저에서 제공하는 canvas용 그리기 영역이다.

하나의 canvas에는 하나의context가 있어, context와 canvas는 1:1매칭이 되고,

context를 통해 canvas에 이것 저것을 채워넣을 수 있다.

canvas의 다른 메서드는 젤 밑부분 "1)부가설명"을 보라.


context1.fillStyle = "#ff0000";

context에서 채우기 기능을 할 경우 채움색을 지정한다.

"#ff0000"이니 뭐든 채우기를 할 경우 붉은 색이 될 것이다.


context1.fillRect(50, 50, 360, 240);

사각형 채우기 기능을 한다.

x좌료 50, y좌표 50에서 시작하는 가로 360, 세로 240 사각형을 그린다.



자, 그럼 여기서 드는 의문.

<canvas>를 제어하는 javascript는 언제나 <canvas>태그 이후에 정의 되어야 하는가???

아니다. 방법이 있다.

<canvas>보다 앞에서 정의되더라도 얼마든지 제어할 수 있다.

다음 포스트에서 살펴보도록 하겠다.



---------------------------------------------------------------------------------------

1)부가설명

canvas의 메서드는 아래와 같다.

메서드 

내용 

  getContext() 

  canvas의 context를 반환한다. 

  toDataURL(type, quality)

  데이터 URL을 반환한다. <img>태그의 src속성에 쓰일 수 있는데,

  첫 인자인 type은 image/jpeg, image/png같은 이미지 타입을 지정한다.

  두번째 인자인 quality는 0.0~1.0으로 이미지 품질수준을 지정한다.

  toBlob(callback, type, args...)

  캔버스의 이미지 파일을 나타내는 Blob을 생성한다.

  첫 인자인 callback은 호출하는 함수,

  두번째 인자인 type은  image/png같은 이미지 타입,

  세번째 인자는 0.0~1.0으로 이미지 품질수준을 지정하고...

  이미지 특성을 제어하기 위해 다른 인수를 추가할 수 있다.



2)부가설명

HTML태그인 canvas의 속성은 딱 2가지 밖에 없다.

속성 

 내역

타입 

기본값 

 width

canvas의 너비 

음이 아닌 정수 

300 

 height

canvas의 높이 

음이 아닌 정수 

150 


아래와 같이 기술했다면, html을 통해 할 수 있는 모든것을 다한 셈이다.

<canvas id="CANVAS_1" width="800" height="480">Canvas지원하는 최신 브라우저 쓰세요</canvas>


Google AdSense
저작자표시 비영리 동일조건

'끄적끄적 > HTML5' 카테고리의 다른 글

Event 처리를 통한 Canvas 캡슐화  (0) 2014.03.04
HTML5 개발툴 끝판왕(?) - Liveweave  (2) 2014.03.02
HTML5 시작하기  (0) 2014.03.01
HTML5 코딩을 위한 준비 (윈도/맥 공통)  (0) 2014.02.27
HTML5 지원 브라우저 현황  (0) 2013.05.02

HTML, CSS 2개의 파일로 구성되는 HTML5 기본 페이지를 만들어 보겠다.

(Index.html, css/Nagarry.css)

Index.html

Nagarry.css





Index.html

<!DOCTYPE html>

<html lang="ko">

<head>

<meta charset="UTF-8">

<title>Nagarry's HTML5</title>

<link type="text/css" rel="stylesheet" href="./css/Nagarry.css">

<script src="./script/Nagarry.js"></script>

</head>

<body>

<canvas id="CANVAS_1" width="800" height="480">

Sorry, Your browser doesn't support HTML5 Canvas.

</canvas>

</body>

</html>

HTML5는 이전 HTML과 차이가 있는데, 윗부분에 파랗게 마크한 부분이다.


첫째. <!DOCTYPE html>

HTML5 표준을 따르는 문서라는 뜻이다. HTML5문서를 작성할때 항상 첫줄에 두어야한다.


둘째. <html lang="ko">

<html>해더에 사용언어 명시


셋째. <meta charset="UTF-8">

문자가 깨지는 것을 방지하기 위해 "euc-kr", "utf-8"등 캐릭터셋을 명시해야한다.


넷째. <script src="./script/Nagarry.js"></script>

더이상 <script> 태그내에 type="text/javascript"라는 구문은 필요없다.

Javascript가 표준이기 때문에 생략이 되었다.


다섯째. <canvas id="CANVAS_1" width="800" height="480"></canvas>

HTML5에는 새로운 태그들이 추가되었고, 그 중 대표적인 태그인 <Canvas>이다.

<canvas ...> </canvas> 사이에 "Sorry, ..."라는 부분이 있는데, 이것은 <canvas>태그를 표현하지 못하는 브라우저를 위한것이다.

구형 브라우저는 <canvas ...>태그를 인식하지 못하므로 <canvas ...></canvas>사이에 있는 문장을 브라우저에 그대로 노출시킨다.

하지만, <canvas>를 인식하는 브라우저는 <canvas>만을 표현하고, <canvas ...>와 </canvas>사이의 문장은 그냥 무시하게 된다.


Nagarry.css는 아래와 같고...

Nagarry.css

@CHARSET "UTF-8";

body

{

background:#555555;

margin:20px;

}


#CANVAS_1

{

background:#ffffff;

border:1px solid #000000;

}



지금까지의 결과를 브라우저에서 보면 이렇게 보일꺼다.


만약 Canvas영역(흰색 사각영역)이 나타나지 않고,

"Sorry, Your browser doesn't support HTML5 Canvas."라는 구문만 보인다면, 브라우저를 바꾸어야 한다.

크롬, 사파리, 파이어폭스, 오페라 브라우저를 사용한다면 별 탈없이 잘 보이지만,

(꽤 오래된 버젼이 아니라면 말이다)

인터넷익스플로어는 최소 9버젼 이상을 사용해야한다.


참고로, 브라우저의 HTML5지원 정도를 알아보고 싶으면

http://html5test.com/ 를 방문하면 된다. 보편적으로 어느 OS에서나 크롬이 젤 괜찮은 지원을 보여준다.

<550점이 만점의 html5 지원정도 -출처 : html5test.com)



다음포스팅에서는 Canvas를 javascript로 기초적으로 제어하는 포스팅을 할 예정이다.

Google AdSense
저작자표시 비영리 동일조건

'끄적끄적 > HTML5' 카테고리의 다른 글

Event 처리를 통한 Canvas 캡슐화  (0) 2014.03.04
HTML5 개발툴 끝판왕(?) - Liveweave  (2) 2014.03.02
[HTML5] Javascript로 canvas제어하기  (0) 2014.03.01
HTML5 코딩을 위한 준비 (윈도/맥 공통)  (0) 2014.02.27
HTML5 지원 브라우저 현황  (0) 2013.05.02

HTML5 CANVAS를 이용해서 이것저것 짜볼려고 하는데,

윈도우즈나 맥 모두 무료로 개발툴을 제공하고 있어 이를 이용하면 된다.



맥에는 Xcode가 있고, 윈도에는 Visual Express시리즈인 Visual Web Developer 2010 Express가 있다.

하지만, Windows7와 OSX 두OS 모두를 사용하는 내 입장에선

Windows/맥 둘다 항상 같은 환경에서 개발이 하고 싶었다.


그래서 인터페이스가 어디에서나 똑같은 이클립스를 사용하기로 했다.

이클립스 다운로드 링크 --> http://www.eclipse.org/downloads/


EE(Enterprise Edition)말구 용량이 적은 Standard를 설치했더니,

기본적인 HTML이나 Javascript포맷이 지원되지 않는다.

<마법사는 HTML, Javascript를 내놓지 않는다 ㅡㅡ;;)



결국 HTML5를 위해 기본적인 Plug-In를 하나 설치한다.

[Help]-[Eclipse Marketplace]에서 html5로 검색을 해보면,

아래와 같이 나오는데 그중 첫번째인 "HTML Editor"를 설치해본다.

<EE버젼을 설치했다면 기본으로 있었을 HTML Editor>



설치하고 Eclipse를 재시작하고 나면, 이렇게 Javascript와 Web이라는 항목이 지원된다.

<이제 JavaScript, CSS, HTML 포맷이 다 지원되는군>


PS1. 이클립스는 Java를 설치해야 동작하기 때문에 intel에서 배포중인 XDK도 참 좋은 도구이다.

windows/Mac/Linux 모두 지원되고, 해보진 않았지만, 스마트폰/태블릿 포팅도 지원하는 듯 하다.

http://software.intel.com/en-us/html5/tools


PS2. 아무래도 편리성과 코드 어시스트면에서 최고의 웹개발툴은  liveweave인듯 하다.

HTML5를 지원하는 브라우저에서 http://liveweave.com 가서 사용하기만 하면 되는 웹어플

Google AdSense
저작자표시 비영리 동일조건

'끄적끄적 > HTML5' 카테고리의 다른 글

Event 처리를 통한 Canvas 캡슐화  (0) 2014.03.04
HTML5 개발툴 끝판왕(?) - Liveweave  (2) 2014.03.02
[HTML5] Javascript로 canvas제어하기  (0) 2014.03.01
HTML5 시작하기  (0) 2014.03.01
HTML5 지원 브라우저 현황  (0) 2013.05.02

+ Recent posts

티스토리툴바