Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

suppress CSS #21

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
53 changes: 53 additions & 0 deletions demo/alexfung.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<head>
<link rel="stylesheet" type="text/css" href="ruwix.css" title='roofpig'>
<!--
the title=roofpig above will supporess roofpig from inserting its style sheet
-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src='../roofpig_and_three.min.js'></script>
<style>
body {
font-family: Calibri;
margin-left: 1em;
}

div.roofpig {width: 15rem; margin-bottom: 2rem; margin-top: 1rem; float: left}

h3, h4 {
clear:left;
padding-top: 1rem;
}

li {margin-bottom: 0.5rem; margin-left: 2rem; list-style-type: disc}
</style>
</head>
<h2>alexfung commits demo</h2>
<p>
This demo page shows the effects of the commits on the alexfung branch,
which is a fork of the 1.4 master.
</p><p>
The demo files refer to the roofpig JS file at the root of this repo.
That file is not exactly the same as the output of the build process.
The roofpig JS file contains non-ANSI characters and may confuse browsers.
I have added BOM to the roofpig JS file at the root of this repo to make sure browsers know it is a UTF-8 file.
</p>

<h3>Color Fix</h3>
<p>
In 1.4 (and 1.5P) color is not assigned correctly if alg= includes any M/E/S slice movement or x/y/z rotation.
Fixed in the color fix commit.
</p>
<div class="roofpig" data-config="alg=U| colored=*|flags=showalg startsolved">Normal: U on top</div>
<div class="roofpig" data-config="alg=M| colored=*|flags=showalg startsolved|algdisplay=rotations">color fix for M</div>
<div class="roofpig" data-config="alg=x| colored=*|flags=showalg startsolved|algdisplay=rotations">color fix for X</div>

<h3>Suppress CSS</h3>
<p>
One style sheet of this demo page has title=roofpig added.
As a result, roofpig will not insert its style sheet.
The sheet I provided (ruwix.css) will be used instead.
</p>
<p>
Go visit other demos.
They do not have this override, and therefore use the default roofpig stylesheet.
</p>
14 changes: 14 additions & 0 deletions demo/alg.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src='../roofpig_and_three.min.js'></script>
<style>
body {font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif; font-size: 11px;}
.roofpig {width:160px; height:210px; float: left; margin:4px;}
</style>
</head>
<h2>Roofpig 'alg' demo</h2>
<div class="roofpig" data-config="alg=F U F' U F U2 F' | flags=showalg">Basic moves</div>

<div class="roofpig" data-config="alg=M E' S2 x y' z2 Rw Uw' Lw2 | flags=showalg">Standard advanced moves</div>

<div class="roofpig" data-config="alg=F+B' U+U< R2+LZ+U>>| algdisplay=rotations 2p| flags=showalg">Roofpig advanced moves</div>
30 changes: 30 additions & 0 deletions demo/cubexp.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src='../roofpig_and_three.min.js'></script>
<style>
body {
font-family:'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
font-size: small
}
.roofpig {
width:100px;
height:116px;
margin: 4px;
float:left;
background-color: #cc9;
}
</style>
</head>
<h2>Roofpig Cubexp Lab</h2>

<div class="roofpig" data-config="colored=UFR DFR LF R">UFR DFR LF R</div>
<div class="roofpig" data-config="colored=UfR DFr lF R">UfR DFr lF R</div>
<div class="roofpig" data-config="colored=F*">F*</div>
<div class="roofpig" data-config="colored=FR*">FR*</div>
<div class="roofpig" data-config="colored=U-">U-</div>
<div class="roofpig" data-config="colored=BD-">BD-</div>
<div class="roofpig" data-config="colored=BLD-">BLD-</div>
<div class="roofpig" data-config="colored=FB-">FB-</div>
<div class="roofpig" data-config="colored=r">r</div>
<div class="roofpig" data-config="colored=*/mc">*/mc</div>
<div class="roofpig" data-config="colored=r/e">r/e</div>
29 changes: 29 additions & 0 deletions demo/other.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src='../roofpig_and_three.min.js'></script>
<style>
body {
font-family:'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
font-size: 10px;
}
div.roofpig {
width:120px;
height:160px;
margin: 0px;
float:left;
}
</style>
</head>
<h2>Roofpig various options Demo</h2>

<div class="roofpig" data-config="colors=F:r R:#fee U:#f99 L:pink B:#f44 D:#fdd">colors in pink</div>
<div class="roofpig" data-config="colors=solved:plum ignored:#cfc cube:yellow | colored=UD- | solved=D*">non sticker colors</div>
<div class="roofpig" data-config="flags=startsolved|alg=F L F U' R U F2 L2 U' L' B D' B' L2 U">startsolved</div>

<div class="roofpig" data-config="algdisplay=fancy2s | alg=F D2 UZ+R>>|flags=showalg">algdisplay=fancy2s</div>
<div class="roofpig" data-config="algdisplay=rotations 2p| alg=F D2 UZ+R>>|flags=showalg">algdisplay=rotations 2p</div>

<div class="roofpig" data-config="hover=far">hover=far</div>
<div class="roofpig" data-config="hover=5">hover=5</div>
<div class="roofpig" data-config="hover=near">hover=near</div>
<div class="roofpig" data-config="hover=none">hover=none</div>
34 changes: 34 additions & 0 deletions demo/readme.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
<head>
<style>
body {
font-family: Calibri;
margin-left: 1em;
}
</style>
</head>
<body>
<h2>Offline demo</h2>
<p>
The original roofpig demos are at jsfiddle.net
They are no longer operational, because they tried to load the roofpig_and_three.js over http.
Therefore, I downloaded the demo file so I can run them offline.
</p><p>
The demo files refer to the roofpig JS file at the root of this repo.
The script has non-ANSI characters, and most browsers will not like it.
To browse the demo locally, you may need to manually add BOM at the start of the file.
A bom.txt is included under /lib for you.
</p>
<p>
Also, I added an extra demo file for the changes I made to the repo.
</p>
<h2>Demo pages</h2>
<ul>
<li><a href='alexfung.html'>My fixes and Features</a></li>
<li><a href='alg.html'>alg notation demo</a></li>
<li><a href='cubexp.html'>cubeexp demo</a></li>
<li><a href='solved.html'>solved and colored demo</a></li>
<li><a href='tweaks.html'>setupmoves and tweaks demo</a></li>
<li><a href='other.html'>other parameters demo</a></li>
<li><a href='sample.html'>feature sample demo</a></li>
</ul>
</body>
Loading