dev.phcode.dev/src/index.html at gh-pages · phcode-dev/dev.phcode.dev

History

1044 lines (982 loc) · 58.2 KB

Raw

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

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

328

329

330

331

332

333

334

335

336

337

338

339

340

341

342

343

344

345

346

347

348

349

350

351

352

353

354

355

356

357

358

359

360

361

362

363

364

365

366

367

368

369

370

371

372

373

374

375

376

377

378

379

380

381

382

383

384

385

386

387

388

389

390

391

392

393

394

395

396

397

398

399

400

401

402

403

404

405

406

407

408

409

410

411

412

413

414

415

416

417

418

419

420

421

422

423

424

425

426

427

428

429

430

431

432

433

434

435

436

437

438

439

440

441

442

443

444

445

446

447

448

449

450

451

452

453

454

455

456

457

458

459

460

461

462

463

464

465

466

467

468

469

470

471

472

473

474

475

476

477

478

479

480

481

482

483

484

485

486

487

488

489

490

491

492

493

494

495

496

497

498

499

500

501

502

503

504

505

506

507

508

509

510

511

512

513

514

515

516

517

518

519

520

521

522

523

524

525

526

527

528

529

530

531

532

533

534

535

536

537

538

539

540

541

542

543

544

545

546

547

548

549

550

551

552

553

554

555

556

557

558

559

560

561

562

563

564

565

566

567

568

569

570

571

572

573

574

575

576

577

578

579

580

581

582

583

584

585

586

587

588

589

590

591

592

593

594

595

596

597

598

599

600

601

602

603

604

605

606

607

608

609

610

611

612

613

614

615

616

617

618

619

620

621

622

623

624

625

626

627

628

629

630

631

632

633

634

635

636

637

638

639

640

641

642

643

644

645

646

647

648

649

650

651

652

653

654

655

656

657

658

659

660

661

662

663

664

665

666

667

668

669

670

671

672

673

674

675

676

677

678

679

680

681

682

683

684

685

686

687

688

689

690

691

692

693

694

695

696

697

698

699

700

701

702

703

704

705

706

707

708

709

710

711

712

713

714

715

716

717

718

719

720

721

722

723

724

725

726

727

728

729

730

731

732

733

734

735

736

737

738

739

740

741

742

743

744

745

746

747

748

749

750

751

752

753

754

755

756

757

758

759

760

761

762

763

764

765

766

767

768

769

770

771

772

773

774

775

776

777

778

779

780

781

782

783

784

785

786

787

788

789

790

791

792

793

794

795

796

797

798

799

800

801

802

803

804

805

806

807

808

809

810

811

812

813

814

815

816

817

818

819

820

821

822

823

824

825

826

827

828

829

830

831

832

833

834

835

836

837

838

839

840

841

842

843

844

845

846

847

848

849

850

851

852

853

854

855

856

857

858

859

860

861

862

863

864

865

866

867

868

869

870

871

872

873

874

875

876

877

878

879

880

881

882

883

884

885

886

887

888

889

890

891

892

893

894

895

896

897

898

899

900

901

902

903

904

905

906

907

908

909

910

911

912

913

914

915

916

917

918

919

920

921

922

923

924

925

926

927

928

929

930

931

932

933

934

935

936

937

938

939

940

941

942

943

944

945

946

947

948

949

950

951

952

953

954

955

956

957

958

959

960

961

962

963

964

965

966

967

968

969

970

971

972

973

974

975

976

977

978

979

980

981

982

983

984

985

986

987

988

989

990

991

992

993

994

995

996

997

998

999

1000

<!doctype html>

<!--

Permission is hereby granted, free of charge, to any person obtaining a

copy of this software and associated documentation files (the "Software"),

to deal in the Software without restriction, including without limitation

the rights to use, copy, modify, merge, publish, distribute, sublicense,

and/or sell copies of the Software, and to permit persons to whom the

Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in

all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR

IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,

FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE

AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER

LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING

FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER

DEALINGS IN THE SOFTWARE.

-->

content="default-src 'self' 'unsafe-inline' 'unsafe-eval' data: asset: https://asset.localhost localhost:* ws://localhost:* ws://127.0.0.1:* https://storage.googleapis.com https://platform.twitter.com https://buttons.github.io https://unpkg.com/@aicore/ https://www.googletagmanager.com;

img-src * data: blob: localhost:* asset: https://asset.localhost ;

media-src * data: localhost:* asset: https://asset.localhost ;

font-src * data: localhost:* asset: https://asset.localhost ;

frame-src * localhost:* asset: https://asset.localhost ;

connect-src * localhost:* asset: https://asset.localhost ;">

<title>Phoenix Code</title>

<style>

.forced-hidden {

display: none !important;

}

</style>

<!-- start inline javascript and non module bootstrap scripts. you must add module scripts to the

javascript module section only!!-->

if(["dev.phcode.dev", "staging.phcode.dev"].includes(location.hostname)

&& localStorage.getItem("devDomainsEnabled") !== "true"){

alert("Hello explorer, you have reached a development version of phcode.dev that is not for general use and could be very unstable." +

`\n\nIf you know what you are doing and what to visit the dev site, please go to https://${location.hostname}/devEnable.html to enable dev site and visit again.` +

"\n\nYou will now be redirected to phcode.dev.");

window.location = "https://phcode.dev";

}

if(window.electronAppAPI) {

window.__ELECTRON__ = true;

}

if(location.href.startsWith("tauri://") || location.href.startsWith('https://tauri.localhost')){

const errorMessage = `You should use custom protocol phtauri:// instead of tauri protocol ${location.href} .`;

alert(errorMessage);

console.error(errorMessage);

throw new Error(errorMessage);

}

function _isTestWindow() {

// the test window query param will only be acknowledged if we are embedded in the spec runner.

// and test windows should be embedded within the same host as phcode.dev/tauri for security

// please see trust_ring.js before doing any changes to this check

const isTestPhoenixWindow = window.parent.location.pathname.endsWith("SpecRunner.html") &&

window.parent.location.host === window.location.host &&

!!(new window.URLSearchParams(window.location.search || "")).get("testEnvironment");

const isSpecRunnerWindow = window.location.pathname.endsWith("/SpecRunner.html");

return isTestPhoenixWindow || isSpecRunnerWindow;

}

let canAccessNativeShell = false;

try {

// This is to allow phoenix live previews in phoenix desktop editor so that we can

// develop phoenix inside phoenix.

// This will throw an error if the live preview iframe and parent are cross-origin which is case in phcode

canAccessNativeShell = window.top.window.__TAURI__;

canAccessNativeShell = window.top.window.electronAppAPI;

canAccessNativeShell = true;

} catch (e) {

// Cross-origin, exception caught, isSameOrigin remains false

}

// In Mac !! the window.__TAURI__ object is present in iframes, even if it doesnt works. so we are forced

// to use if(window.parent.window !== window) instead of if(!window.__TAURI__) here.

if(canAccessNativeShell && window.parent.window !== window && window.top.window.__TAURI__) {

// This is only intended to be used for in tests where phoenix is loaded inside iframes.

// this means that we are loaded in an iframe in the specrunner. Tauri doesnt expose tauri APIs

// in its iframes, so we directly use the top most windows tauri api object for tests to run properly.

console.warn("Phoenix is loaded in iframe, attempting to use tauri APIs from window.top.__TAURI__");

window.__TAURI__ = {

invoke: window.top.window.__TAURI__.invoke,

convertFileSrc: window.top.window.__TAURI__.convertFileSrc,

transformCallback: window.top.window.__TAURI__.transformCallback,

app: window.top.window.__TAURI__.app,

cli: window.top.window.__TAURI__.cli,

clipboard: window.top.window.__TAURI__.clipboard,

dialog: window.top.window.__TAURI__.dialog,

event: window.top.window.__TAURI__.event,

globalShortcut: window.top.window.__TAURI__.globalShortcut,

http: window.top.window.__TAURI__.http,

mocks: window.top.window.__TAURI__.mocks,

notification: window.top.window.__TAURI__.notification,

os: window.top.window.__TAURI__.os,

path: window.top.window.__TAURI__.path,

process: window.top.window.__TAURI__.process,

shell: window.top.window.__TAURI__.shell,

tauri: window.top.window.__TAURI__.tauri,

updater: window.top.window.__TAURI__.updater,

window: window.top.window.__TAURI__.window,

fs: {} // this needs some special handling and will be assigned below.

};

// fs special handling start :patch the fs.readBinaryFile and fs.WriteBinaryFile apis to use this windows uint8arrays

for (let key in window.top.window.__TAURI__.fs) {

window.__TAURI__.fs[key] = window.top.window.__TAURI__.fs[key];

}

const readBinaryFile = window.__TAURI__.fs.readBinaryFile;

const writeBinaryFile = window.__TAURI__.fs.writeBinaryFile;

window.__TAURI__.fs.readBinaryFile = function (...args) {

return new Promise((resolve, reject)=>{

readBinaryFile(...args)

.then(contents=>{

// contents is Uint8Array of parent window instance type. we have to convert it to

// this windows uintarray type

resolve(new Uint8Array(contents))

})

.catch(reject)

});

}

window.__TAURI__.fs.writeBinaryFile = function (platformPath, arrayBuffer, options) {

let uint8ArrayOfTop = new window.top.Uint8Array(arrayBuffer); // this will only pass the reference

uint8ArrayOfTop = new window.top.Uint8Array(uint8ArrayOfTop); // this will perform a deep copy bitwise

return new Promise((resolve, reject)=>{

writeBinaryFile(platformPath, uint8ArrayOfTop.buffer, options)

.then(resolve)

.catch(reject)

});

}

// fs special handling end

}

// electron api iframe injection for tests

if(canAccessNativeShell && window.parent.window !== window && window.top.window.__ELECTRON__) {

// This is only intended to be used for in tests where phoenix is loaded inside iframes.

// this means that we are loaded in an iframe in the specrunner. Electron doesnt expose APIs

// in its iframes, so we directly use the top most windows electron api objects for tests to run properly.

console.warn("Phoenix is loaded in iframe, attempting to use electron APIs from window.top");

window.__ELECTRON__ = true;

window.electronAppAPI = window.top.window.electronAppAPI;

window.electronFSAPI = window.top.window.electronFSAPI;

window.electronAPI = window.top.window.electronAPI;

}

if(window.__TAURI__ || window.__ELECTRON__) {

window.__IS_NATIVE_SHELL__ = true;

}

// Common function to process boot vars results for both Tauri and Electron

function _processBootVarsResults(results, pathSep, LOCALSTORAGE_KEY, bootStartTime) {

// results array: [appName, documentDir, appLocalDir, tempDir, homeDir]

const idx = {appName: 0, docDir: 1, appLocal: 2, temp: 3, home: 4};

window._tauriBootVars.appname = results[idx.appName].value;

if(results[idx.docDir].status === "fulfilled"){

window._tauriBootVars.documentDir = results[idx.docDir].value;

} else if(results[idx.home] && results[idx.home].status === "fulfilled"){

// some linux distros may not have Documents folder. so we use the home folder

// https://github.com/phcode-dev/phoenix/issues/1729

window._tauriBootVars.documentDir = results[idx.home].value;

} else if(results[idx.appLocal].status === "fulfilled"){

console.error("Unable to determine user documents dir, defaulting to app data dir as document dir:",

results[idx.docDir].reason, "home folder error: ", results[idx.home]?.reason);

window._tauriBootVars.documentDir = results[idx.appLocal].value;

} else {

alert("Could not resolve user documents directory. \nPhoenix Code cannot start.");

}

if(results[idx.appLocal].status === "fulfilled") {

window._tauriBootVars.appLocalDir = results[idx.appLocal].value;

} else {

alert("Could not resolve Application Data directory. \nPhoenix Code cannot start.");

}

// For tests, documents dir is localAppDataDir/testDocuments to keep user documents garbage free for tests

// Also In github actions, the tauri get doc dir call gets stuck indefinitely

if(_isTestWindow()){

if(!window._tauriBootVars.documentDir.endsWith(pathSep)){

window._tauriBootVars.documentDir = window._tauriBootVars.documentDir + pathSep;

}

window._tauriBootVars.documentDir = `${window._tauriBootVars.documentDir}testDocuments${pathSep}`;

}

window._tauriBootVars.appLocalDir = results[idx.appLocal].value;

window._tauriBootVars.tempDir = results[idx.temp].value;

window._tauriBootVars.bootstrapTime = Date.now() - bootStartTime;

localStorage.setItem(LOCALSTORAGE_KEY, JSON.stringify(window._tauriBootVars));

}

if(window.__TAURI__) {

function setupTauriBootVars() {

// this is used by storage.js (window.PhStore) to restore our persistent storage layer in tauri.

window._tauriStorageRestorePromise = window.__TAURI__.fs.readTextFile(

"storageDB/storageDBDump.json", { dir: window.__TAURI__.fs.BaseDirectory.AppLocalData })

.catch(err =>{

console.error("First boot detected or Failed to init storage from cache." +

" If first boot, ignore this error", err);

});

// increase this version number if you are modifying any boot vars

const TAURI_BOOT_VARS_LOCALSTORAGE_KEY = "tauriBootVarsV1";

const tauriBootVarsStr = localStorage.getItem(TAURI_BOOT_VARS_LOCALSTORAGE_KEY);

if(tauriBootVarsStr) {

try{

window._tauriBootVars = JSON.parse(tauriBootVarsStr);

window._tauriBootVarsPromise = Promise.resolve("Resolved from localstorage.");

} catch (e) {

console.error("Error getting tauri boot vars from localstorage. Falling back to make tauri bootstrap calls.", e);

}

const appNamePromise = window.__TAURI__.app.getName();

// for running tests, the user document dir is set to app data dir as we dont want to

// corrupt user documents dir for tests

let documentDirPromise, homeDirPromise;

if(_isTestWindow()){

documentDirPromise = window.__TAURI__.path.appLocalDataDir(); // appdata/testDocuments will be appended below

} else {

documentDirPromise = window.__TAURI__.path.documentDir();

homeDirPromise = window.__TAURI__.path.homeDir();

}

const appLocalDirPromise = window.__TAURI__.path.appLocalDataDir();

const tempDirPromise = window.__TAURI__.os.tempdir();

window._tauriBootVars = {};

const tauriBootStartTime = Date.now();

window._tauriBootVarsPromise = Promise.allSettled([appNamePromise, documentDirPromise,

appLocalDirPromise, tempDirPromise, homeDirPromise])

.then((results) => {

_processBootVarsResults(results, window.__TAURI__.path.sep, TAURI_BOOT_VARS_LOCALSTORAGE_KEY, tauriBootStartTime);

});

}

setupTauriBootVars();

}

if(window.__ELECTRON__) {

function setupElectronBootVars() {

// this is used by storage.js (window.PhStore) to restore our persistent storage layer in electron.

window._tauriStorageRestorePromise = window.electronFSAPI.appLocalDataDir()

.then(appDataDir => {

const sep = window.electronFSAPI.path.sep;

const storagePath = `${appDataDir}${appDataDir.endsWith(sep) ? "" : sep}storageDB${sep}storageDBDump.json`;

return window.electronFSAPI.fsReadFile(storagePath);

})

.then(data => {

if(data && data.__fsError) {

throw new Error(data.message);

}

// fsReadFile returns binary data, decode to text

const decoder = new TextDecoder("utf-8");

return decoder.decode(data);

})

.catch(err => {

console.error("First boot detected or Failed to init storage from cache." +

" If first boot, ignore this error", err);

});

// increase this version number if you are modifying any boot vars

const TAURI_BOOT_VARS_LOCALSTORAGE_KEY = "tauriBootVarsV1";

const tauriBootVarsStr = localStorage.getItem(TAURI_BOOT_VARS_LOCALSTORAGE_KEY);

if(tauriBootVarsStr) {

try{

window._tauriBootVars = JSON.parse(tauriBootVarsStr);

window._tauriBootVarsPromise = Promise.resolve("Resolved from localstorage.");

} catch (e) {

console.error("Error getting boot vars from localstorage. Falling back to make electron bootstrap calls.", e);

}

const appNamePromise = window.electronAppAPI.getAppName();

// for running tests, the user document dir is set to app data dir as we dont want to

// corrupt user documents dir for tests

let documentDirPromise, homeDirPromise;

if(_isTestWindow()){

documentDirPromise = window.electronFSAPI.appLocalDataDir(); // appdata/testDocuments will be appended below

} else {

documentDirPromise = window.electronFSAPI.documentDir();

homeDirPromise = window.electronFSAPI.homeDir();

}

const appLocalDirPromise = window.electronFSAPI.appLocalDataDir();

const tempDirPromise = window.electronFSAPI.tempDir();

window._tauriBootVars = {};

const tauriBootStartTime = Date.now();

window._tauriBootVarsPromise = Promise.allSettled([appNamePromise, documentDirPromise,

appLocalDirPromise, tempDirPromise, homeDirPromise])

.then((results) => {

_processBootVarsResults(results, window.electronFSAPI.path.sep, TAURI_BOOT_VARS_LOCALSTORAGE_KEY, tauriBootStartTime);

});

}

setupElectronBootVars();

}

// environment setup for boot. do not move out of index html!!

(function(){

function _mobileCheck() {

let check = false;

// eslint-disable-next-line

return check;

}

function _mobileAndTabletCheck() {

let check = false;

// eslint-disable-next-line

return check;

}

function isSafari() {

// Safari 3.0+ "[object HTMLElementConstructor]"

return /constructor/i.test(window.HTMLElement)

|| (function (p) {

return p.toString() === "[object SafariRemoteNotification]";

})(!window['safari'] || (typeof safari !== 'undefined' && window['safari'].pushNotification));

}

function detectEngine() {

const userAgent = navigator.userAgent;

if (/WebKit/.test(userAgent)) {

if (/Chrome|Blink|Edg\//.test(userAgent)) {

return 'Blink'; // Chrome or Edge (based on Blink)

} else {

return 'WebKit'; // Likely Safari or other true WebKit-based browser

}

return 'Other';

}

function getBrowserDetails() {

let isChrome = navigator.userAgent.indexOf("Chrome") !== -1;

let isEdgeBrowser = navigator.userAgent.indexOf("Edg") !== -1;

let isEdgeChromiumBrowser = isChrome && isEdgeBrowser;

let isOpera = (!!window.opr && !!window.opr.addons) ||

!!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

let isOperaChromiumBrowser = isChrome && isOpera;

let isChromeBrowser = isChrome && !isEdgeChromiumBrowser && !isOperaChromiumBrowser;

return{

isTablet: _mobileAndTabletCheck(),

isMobile: _mobileCheck(),

isDeskTop: !_mobileAndTabletCheck() && !_mobileCheck(),

isChromeOS: /CrOS/.test(navigator.userAgent),

isTauri: !!window.__TAURI__,

isElectron: !!window.__ELECTRON__,

mobile: {

isAndroid: (navigator.userAgent.match(/Android/i) !== null),

isIos: (navigator.userAgent.match(/iPhone|iPad|iPod/i) !== null),

isOpera: (navigator.userAgent.match(/Opera Mini/i) !== null),

isWindows: ((navigator.userAgent.match(/IEMobile/i) ||

navigator.userAgent.match(/WPDesktop/i))!== null)

desktop: {

isOpera: isOpera,

isFirefox: typeof window.InstallTrigger !== 'undefined',

isChromeBased: isChrome,

isChrome: isChromeBrowser,

isEdgeChromium: isEdgeChromiumBrowser,

isOperaChromium: isOperaChromiumBrowser,

isSafari: isSafari(),

isWebKit: detectEngine() === 'WebKit',

isBlink: detectEngine() === 'Blink'

}

};

}

function _getBaseURL() {

// strip query string

let base = window.location.href.split('?')[0];

if(base.endsWith(".html")){

base = base.slice(0, base.lastIndexOf('/'));

}

if(!base.endsWith("/")){

base = `${base}/`;

}

return base;

}

// Determine OS/platform

window._getPlatformOverride = function (){

const currentUrl = window.location.href;

const searchParams = new URLSearchParams(new URL(currentUrl).search);

const platform = searchParams.get('platform');

const allowedOverRides = ['win', 'mac', 'linux'];

if(allowedOverRides.includes(platform)){

return platform;

}

return null;

}

let platform = "win";

if(_getPlatformOverride() && _isTestWindow()){

platform = _getPlatformOverride();

console.warn("using platform override: ", platform, "This is only expected to run in tests.");

} else if (navigator.platform && navigator.platform.match("Mac")) {

platform = "mac";

} else if (navigator.platform && navigator.platform.indexOf("Linux") >= 0) {

platform = "linux";

}

// window.Phoenix should never be reassigned as code may cache references to this object.

window.Phoenix = {

PHOENIX_INSTANCE_ID: "PH-" + Math.round( Math.random()*1000000000000),

browser: getBrowserDetails(),

platform,

baseURL: _getBaseURL(),

isTestWindow: _isTestWindow(),

firstBoot: false, // will be set below

pro: {}, // this is only for display purposes and should not be used to gate features. use kernal mode for that

startTime: Date.now(),

TRUSTED_ORIGINS: {

// if modifying this list, make sure to update in https://github.com/phcode-dev/phcode.live/blob/main/docs/trustedOrigins.js

// extensions may add their trusted origin to this list at any time.

'http://localhost:8000': true, // phcode dev server

'http://localhost:8001': true, // phcode dev live preview server

'http://localhost:5000': true, // playwright tests

'http://127.0.0.1:8000': true, // phcode dev server

'http://127.0.0.1:8001': true, // phcode dev live preview server

'http://127.0.0.1:5000': true, // playwright tests

'phtauri://localhost': true, // tauri prod app

'https://phtauri.localhost': true, // tauri

'https://phcode.live': true, // phcode prod live preview server

'https://phcode.dev': true,

'https://dev.phcode.dev': true,

'https://staging.phcode.dev': true,

'https://create.phcode.dev': true

}

};

window.Phoenix.isNativeApp = window.__IS_NATIVE_SHELL__;

window.Phoenix.TRUSTED_ORIGINS[location.origin] = true;

Phoenix.isSupportedBrowser = Phoenix.isNativeApp ||

(Phoenix.browser.isDeskTop && ("serviceWorker" in navigator));

window.testEnvironment = window.Phoenix.isTestWindow;

const healthDisabled = localStorage.getItem("PH_HEALTH_DISABLED");

window.Phoenix.healthTrackingDisabled = (healthDisabled === "true");

window.Phoenix._setHealthTrackingDisabled = function (isDisabled) {

window.Phoenix.healthTrackingDisabled = isDisabled;

localStorage.setItem("PH_HEALTH_DISABLED", String(isDisabled));

};

// now setup PhoenixBaseURL, which if of the form https://phcode.dev/ or tauri://localhost/

const url = new URL(window.location.href);

url.search = ''; // remove all query string params.

let baseUrl = url.href;

if(baseUrl.endsWith(".html")){

// http://a.b/index.html -> // http://a.b

baseUrl = baseUrl.substring(0, baseUrl.lastIndexOf("/"));

}

if(!baseUrl.endsWith("/")){

baseUrl = baseUrl + "/";

}

window.PhoenixBaseURL = baseUrl;

}());

</script>

import BugsnagPerformance from "./thirdparty/bugsnag-performance.min.js";

window.BugsnagPerformance = BugsnagPerformance;

</script>

window.splashScreenPresent = true;

/*Bootstrap cache check. since index.html is always loaded network first, the cache reset code will always

be guaranteed to be hit on app update.

Note that this cannot be moved to a separate file and should be in index.html due to above reason.

There is a nuke cache option. Though mostly safe, Use it wisely to prevent slow startup when resetting.

window._CURRENT_CACHE_VERSION_KEY = "currentWebCacheVersion";

if(!localStorage.getItem(window._CURRENT_CACHE_VERSION_KEY)){

// first boot, no cache

localStorage.setItem(window._CURRENT_CACHE_VERSION_KEY, PHOENIX_APP_CACHE_VERSION);

}

function _loadPhoenixMain() {

if(window._phoenixMainLoaded){

return;

}

window._phoenixMainLoaded = true;

const loadJS = function(url, implementationCode, location, dataMainValue){

//url is URL of external file, implementationCode is the code

//to be called from the file, location is the location to

//insert the <script> element

const scriptTag = document.createElement('script');

if(dataMainValue){

scriptTag.setAttribute('data-main', dataMainValue);

}

scriptTag.onload = implementationCode;

scriptTag.onreadystatechange = implementationCode;

scriptTag.src = url;

location.appendChild(scriptTag);

};

function _requireDone() {

loadJS('verify-dependencies-loaded.js', null, document.body);

}

async function _startRequireLoop() {

// If running on localhost, `npm run serve`, `npm run serveLocalAccount` targets puts in a fetch proxy.

// tTe proxy helps work around cookie domain set by phcode.dev as the dev urls are localhost. so to use

// either the actual services endpoint or localhost endpoints in dev, this is needed.

if (!Phoenix.isTestWindow && (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1')) {

try {

const response = await fetch('/proxy/config');

if (response.ok) {

const config = await response.json();

if (config.accountURL) {

window.AppConfig.config.account_url = config.accountURL;

console.log('Applied dynamic account URL from proxy:', config.accountURL);

}

} catch (error) {

console.warn('Failed to fetch proxy config, using default account URL:', error);

}

loadJS('thirdparty/requirejs/require.js', _requireDone, document.body, "main");

}

if(window.PhStore){

window.PhStore.storageReadyPromise.finally(_startRequireLoop);

} else {

const interval = setInterval(()=>{

if(window.PhStore){

clearInterval(interval);

PhStore.storageReadyPromise.finally(_startRequireLoop);

}

}, 50);

}

async function _resetCacheIfNeeded(force) {

if(Phoenix.isNativeApp || Phoenix.isTestWindow) {

// no web cache in desktop builds ot test windows

return;

}

if(!window.caches){

console.error("CacheStorage: API not supported by browser.");

}

function _showUpdateMessage(message) {

let splashScreenFrame = document.getElementById("splash-screen-frame");

if(splashScreenFrame){

let displayText2 = splashScreenFrame.contentDocument.getElementById("load-status-display-text");

displayText2 && (displayText2.textContent = message);

}

async function computeSHA256(response) {

try {

if (!response.ok) {

return null;

}

const data = await response.arrayBuffer();

const hashBuffer = await crypto.subtle.digest('SHA-256', data);

// Convert the ArrayBuffer to hex string

const hashArray = Array.from(new Uint8Array(hashBuffer));

return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');

} catch (error) {

console.error("cache-upgrade: error computing hash:", error);

return null;

}

async function migrate(oldCache, newCache, newCacheManifest) {

try{

const newCacheOpen = await caches.open(newCache);

const oldCacheOpen = await caches.open(oldCache);

const oldCacheKeys = await oldCacheOpen.keys();

let count = 0, totalCount = 0;

for(let request of oldCacheKeys){

totalCount++;

let newResponseCached = await newCacheOpen.match(request);

let relativePath = (new URL(request.url)).pathname.slice(1);

const newSHA = newCacheManifest[relativePath];

if(!newResponseCached && newSHA) {

const oldResponse = await oldCacheOpen.match(request);

const oldResponseClone = oldResponse.clone();

if(!oldResponse){

continue;

}

_showUpdateMessage(`${count} of ${totalCount} files unchanged...`);

const oldSHA = await computeSHA256(oldResponse);

if(newSHA === oldSHA) {

count++;

await newCacheOpen.put(request, oldResponseClone);

}

console.log("cache-upgrade: reused entries from old cache: ", count, "of", totalCount);

await caches.delete(oldCache);

} catch (e) {

console.error("cache-upgrade: Error while migrating cache", e);

}

async function updateCache(newCacheName, oldCacheName, defaultCacheName) {

try{

let newCacheManifest = await fetch(`web-cache/${newCacheName}/cacheManifest.json`);

if(!newCacheManifest.ok){

return false;

}

newCacheManifest = await newCacheManifest.json();

_showUpdateMessage("Migrating default caches...");

if(await caches.has(defaultCacheName)){

await migrate(defaultCacheName, newCacheName, newCacheManifest);

}

_showUpdateMessage("Migrating last version caches...");

if(oldCacheName && await caches.has(oldCacheName)){

await migrate(oldCacheName, newCacheName, newCacheManifest);

}

return true;

} catch (e) {

console.error("Error updating cache: ", e);

}

return false;

}

const LESS_REFRESH_SCHEDULED_KEY = "lessRefreshScheduled";

function _readFileSafe(readPath) {

return new Promise(resolve =>{

fs.readFile(readPath, "utf8", (err, text)=>{

if(err){

console.error("Could not read", readPath)

resolve(null);

return;

}

resolve(text);

});

}

function _writeFileSafe(writePath, text) {

return new Promise(resolve =>{

fs.writeFile(writePath, text, "utf8", (err)=>{

if(err){

console.error("Could not written", writePath)

}

resolve(err);

});

}

const WEB_CACHE_FILE_PATH = "/webCacheVersion.txt";

const CACHE_NAME_EVERYTHING = "everythingV2"; // this is used in service worker

/**

* Clears legacy caches from the browser storage. This function is intended to be used

* when migrating to a new cache management strategy. Safe to be deleted after sep-2024

* @return {Promise<void>}

async function clearLegacyCache() {

// as we switched to new versioned cache management, we will be clearing all the legacy cache.

const legacyCacheName = "browserCacheVersionKey";

const lastClearedVersion = window.localStorage.getItem(legacyCacheName);

if(lastClearedVersion){

// legacy cache detected

console.log("Legacy cache detected, resetting...");

localStorage.removeItem(legacyCacheName);

await window.caches.delete(legacyCacheName);

localStorage.setItem(LESS_REFRESH_SCHEDULED_KEY, "yes");

if(window.fs){

await _writeFileSafe(WEB_CACHE_FILE_PATH, PHOENIX_APP_CACHE_VERSION);

location.reload();

} else {

location.reload();

}

await clearLegacyCache();

const shouldRefreshLess = window.localStorage.getItem(LESS_REFRESH_SCHEDULED_KEY) === 'yes';

if(shouldRefreshLess){

let lessRefreshInterval = setInterval(()=>{

// wait for less to get loaded. less caches css in local storage in production urls

// and might not load new css classes if we don't reset. less doesn't cache in localhost.

if(window.less && less.refresh){

less.refresh(true).finally(()=>{

localStorage.setItem(LESS_REFRESH_SCHEDULED_KEY, "no");

});

clearInterval(lessRefreshInterval);

}

}, 500);

}

const currentCacheName = await _readFileSafe(WEB_CACHE_FILE_PATH);

if(force){

// We have to delete and clear cache if force option is given

await window.caches.delete(CACHE_NAME_EVERYTHING);

currentCacheName && await window.caches.delete(currentCacheName);

}

if(!currentCacheName) {

// fresh install, no cache

console.log("No cache detected, ignore if first boot or safari ITP.");

localStorage.setItem(window._CURRENT_CACHE_VERSION_KEY, PHOENIX_APP_CACHE_VERSION);

await _writeFileSafe(WEB_CACHE_FILE_PATH, PHOENIX_APP_CACHE_VERSION);

// on next reload, the new cache will be active and populated by service worker

} else if(currentCacheName && (currentCacheName !== PHOENIX_APP_CACHE_VERSION || force)) {

// This is an upgrade we could in the future use the cacheManifest.json to increase update speed

// by only selectively updating the changed files.

console.warn("Old version cache detected", currentCacheName, "updating to", PHOENIX_APP_CACHE_VERSION);

const cacheUpdated = await updateCache(PHOENIX_APP_CACHE_VERSION, currentCacheName, CACHE_NAME_EVERYTHING);

if(cacheUpdated){

await _writeFileSafe(WEB_CACHE_FILE_PATH, PHOENIX_APP_CACHE_VERSION);

localStorage.setItem(window._CURRENT_CACHE_VERSION_KEY, PHOENIX_APP_CACHE_VERSION);

localStorage.setItem(LESS_REFRESH_SCHEDULED_KEY, "yes");

if(!force){

location.reload();

// force reload handlers should reload themselves.

}

} else if(location.pathname.endsWith("/src/") || location.pathname.endsWith("/dist/")

|| location.pathname.endsWith("index.html")){

// load phoenix if its any of the non-cached urls.

_loadPhoenixMain();

}

_resetCacheIfNeeded();

function _addOrRemoveSplashScreenIfNeeded() {

if(!window.__IS_NATIVE_SHELL__) {

document.getElementById('phoenix-loading-splash-screen-overlay').classList.remove('forced-hidden')

}

if(window.testEnvironment || window.__IS_NATIVE_SHELL__){

// tauri means local builds and, it loads up pretty fast, so no splash screen

document.getElementById('phoenix-loading-splash-screen-overlay').remove();

window.splashScreenPresent = false;

}

// this function is called onload so it is safe to be deferred loaded inline script as it is guarented to only

// get executed after all deferred scripts has been loaded

function _loadPhoenixAfterSplashScreen() {

$("#Phoenix-Main .main-view").removeClass("forced-hidden");

if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {

// Dark mode is enabled

document.body.classList.add('dark'); // This will later be overridden by the theme manager as required.

}

_addOrRemoveSplashScreenIfNeeded();

if(!Phoenix.isNativeApp && !Phoenix.isTestWindow) {

const currentCacheVersion = localStorage.getItem(window._CURRENT_CACHE_VERSION_KEY);

if(currentCacheVersion !== PHOENIX_APP_CACHE_VERSION){

// dont load phoenix as the cache is inconsistent, the updater will reload after fixing cache

let splashScreenFrame = document.getElementById("splash-screen-frame");

if(!splashScreenFrame){

return;

}

let displayBtn1 = splashScreenFrame.contentDocument.getElementById("load-status-display-btn");

let displayText2 = splashScreenFrame.contentDocument.getElementById("load-status-display-text");

displayBtn1 && (displayBtn1.textContent = "Updating app...");

displayText2 && (displayText2.textContent = "Please wait....");

return;

}

_loadPhoenixMain();

}

</script>

<!--

All module script tags comes here. If there are non module scripts that depend on modules, they must be

marked with defer Since module scripts are marked as defer by default. If not done, this can lead to

unpredictable ordering with mixed scripts as the non module script without defer attribute

will get loaded before the module scripts.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-defer

-->

<!-- The hljs color scheme is locked to dark github theme as it mainly used in sidebar which is always in dark mode.

For using a different theme in other places, import via main less by adding a code like:

.cssClassScope{@import url("thirdparty/highlight.js/styles/<theme.css>");} -->

<!-- Pre-load third party scripts that cannot be async loaded. Defer loading of all below scripts

caused increase in boot time with cache as observed from analytics. so we don't defer third party deps-->

// https://lesscss.org/usage/#using-less-in-the-browser-setting-options

less = {

math: 'always'

};

</script>

<style>

#phoenix-loading-splash-screen-overlay {

position: fixed; /* Sit on top of the page content */

display: block; /* Hidden by default */

width: 100%; /* Full width (cover the whole page) */

height: 100%; /* Full height (cover the whole page) */

top: 0;

left: 0;

right: 0;

bottom: 0;

background-color: rgba(0,0,0,0.5); /* Black background with opacity */

z-index: 1000000; /* overlay should be at the top */

cursor: pointer; /* Add a pointer on hover */

}

</style>

function _chromeOSPWAHandle() {

let deferredPrompt;

const PWA_PROMPTED_BEFORE_KEY = "PWA_PROMPTED_BEFORE";

function isChromeOS() {

return /CrOS/.test(navigator.userAgent);

}

function showPWAInstallIcon() {

if(!window.$ || !window.Strings){

setTimeout(showPWAInstallIcon, 5000);

return;

}

let $updateIcon = window.$("#update-notification");

$updateIcon.removeClass("forced-hidden");

$updateIcon.attr("title", Strings.INSTALL_WEBAPP);

$updateIcon.click(()=>{

deferredPrompt.prompt();

deferredPrompt.userChoice.then((choiceResult) => {

if (choiceResult.outcome === 'accepted') {

deferredPrompt = null;

$updateIcon.addClass("forced-hidden");

} else {

console.log('User dismissed the A2HS prompt');

}

});

if(!localStorage.getItem(PWA_PROMPTED_BEFORE_KEY)){

localStorage.setItem(PWA_PROMPTED_BEFORE_KEY, "yes");

deferredPrompt.prompt();

}

window.addEventListener("beforeinstallprompt", (event) => {

event.preventDefault(); // no install prompts in any other browser.

if(!isChromeOS()){

return;

}

deferredPrompt = event;

showPWAInstallIcon();

});

}

_chromeOSPWAHandle();

</script>

</head>

title="Phoenix Splash Screen" src="assets/phoenix-splash/index.html"></iframe>

</div>

</div>

</div>

<div>

<a id="phcode-io-main-nav" href="https://phcode.io" target="_blank" rel="noopener">phcode.io</a>

</div>

</div>

</div>

</div>

</div>

<!--

Vertical stack of titlebar (in-browser), editor, bottom panels, status bar

(status bar is injected later - see StatusBar.init()).

Note: all children must be in a vertical stack with heights explicitly set in a fixed

unit such as px (not percent/em/auto). If you change the height later, you must

call WorkspaceManager.recomputeLayout() each time. Otherwise the layout will

not get set correctly. Use WorkspaceManager to have this managed for you automatically.

-->

</ul>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

View remainder of file in raw view

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

FilesExpand file tree

index.html

Latest commit

History

index.html

File metadata and controls